@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;800&display=swap";:root{font:16px/1.5 Inter,Noto Sans SC,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#app{min-height:100%}body{margin:0;min-width:320px}a{color:inherit;text-decoration:none}p{margin:0}.gradient-root{position:relative;top:0;left:0;width:100vw;min-height:100vh;overflow:hidden;background:linear-gradient(40deg,var(--gradient-background-start),var(--gradient-background-end))}.filter-defs{position:absolute;width:0;height:0;opacity:0;pointer-events:none}.demo-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:0 16px;pointer-events:none}.demo-stack{display:flex;flex-direction:column;align-items:center;gap:20px}.demo-logo{width:clamp(40px,6vw,64px);height:clamp(40px,6vw,64px);flex:0 0 auto;filter:drop-shadow(0 18px 36px rgba(0,0,0,.28))}.demo-title{background:linear-gradient(to bottom,#ffffffe0,#ffffff38);background-clip:text;-webkit-background-clip:text;color:transparent;font-size:clamp(3rem,11vw,7rem);font-weight:800;line-height:.95;letter-spacing:-.06em;text-align:center;filter:drop-shadow(0 25px 50px rgba(0,0,0,.4))}.demo-slogan{max-width:720px;color:#ffffffb8;font-size:clamp(1rem,2.4vw,1.2rem);font-weight:500;letter-spacing:-.02em;text-align:center;text-wrap:balance}.download-link{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:#ffffff1f;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#fff;font-size:.95rem;font-weight:600;pointer-events:auto}.capabilities{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;width:min(980px,100%);margin-top:8px}.capability-card{padding:16px 18px;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:#ffffff14;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.capability-title{color:#ffffffe6;font-size:1rem;font-weight:700}.capability-text{margin-top:6px;color:#ffffffad;font-size:.92rem;line-height:1.6}.gradients-container{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.gradients-container.is-goo{filter:url(#blurMe) blur(40px)}.gradients-container.is-safari{filter:blur(40px)}.gradient-blob{position:absolute;mix-blend-mode:var(--blending-value);width:var(--size);height:var(--size);top:calc(50% - var(--size) / 2);left:calc(50% - var(--size) / 2)}.gradient-first{background:radial-gradient(circle at center,var(--first-color) 0,var(--first-color) 50%) no-repeat;transform-origin:center center;animation:move-vertical 30s ease infinite;opacity:1}.gradient-second{background:radial-gradient(circle at center,rgba(var(--second-color),.8) 0,rgba(var(--second-color),0) 50%) no-repeat;transform-origin:calc(50% - 400px);animation:move-in-circle 20s reverse infinite;opacity:1}.gradient-third{background:radial-gradient(circle at center,rgba(var(--third-color),.8) 0,rgba(var(--third-color),0) 50%) no-repeat;transform-origin:calc(50% + 400px);animation:move-in-circle 40s linear infinite;opacity:1}.gradient-fourth{background:radial-gradient(circle at center,rgba(var(--fourth-color),.8) 0,rgba(var(--fourth-color),0) 50%) no-repeat;transform-origin:calc(50% - 200px);animation:move-horizontal 40s ease infinite;opacity:.7}.gradient-fifth{background:radial-gradient(circle at center,rgba(var(--fifth-color),.8) 0,rgba(var(--fifth-color),0) 50%) no-repeat;transform-origin:calc(50% - 800px) calc(50% + 800px);animation:move-in-circle 20s ease infinite;opacity:1}.gradient-interactive{width:100%;height:100%;top:-50%;left:-50%;background:radial-gradient(circle at center,rgba(var(--pointer-color),.8) 0,rgba(var(--pointer-color),0) 50%) no-repeat;opacity:.7}@keyframes move-horizontal{0%{transform:translate(-50%) translateY(-10%)}50%{transform:translate(50%) translateY(10%)}to{transform:translate(-50%) translateY(-10%)}}@keyframes move-in-circle{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}@keyframes move-vertical{0%{transform:translateY(-50%)}50%{transform:translateY(50%)}to{transform:translateY(-50%)}}@media (max-width: 768px){.demo-overlay{padding:0 20px}.demo-stack{gap:16px}.download-link{min-height:44px;padding:0 18px;font-size:.92rem}.demo-slogan{max-width:320px;font-size:.98rem}.capabilities{grid-template-columns:minmax(0,1fr);gap:10px;width:min(420px,100%)}.capability-card{padding:14px 16px;border-radius:16px}}
