:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#242424;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}a{color:#646cff;-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}a:hover{color:#535bf2}body{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:pan-x pan-y;place-items:center;min-width:320px;min-height:100vh;margin:0;display:flex}h1{font-size:3.2em;line-height:1.1}button{cursor:pointer;background-color:#1a1a1a;border:1px solid #0000;border-radius:8px;padding:.6em 1.2em;font-family:inherit;font-size:1em;font-weight:500;transition:border-color .25s,transform .15s}button:hover{border-color:#646cff}button:active{transform:scale(.98)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.screen.landscape{color:#e6ecf2;background:#0b1020;flex-direction:column;width:100vw;height:100vh;display:flex}.topbar{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;height:64px;padding:0 24px;display:flex}.topbar .logo{letter-spacing:.5px;color:#a9c4ff;font-size:18px;font-weight:600}.topbar .link{color:#dde6ff;background:0 0;border:1px solid #ffffff2e;border-radius:10px;padding:8px 14px}.hero{flex:1;grid-template-columns:1.4fr 1fr;gap:24px;padding:24px;display:grid}.canvas-wrap{background:#000;border-radius:16px;position:relative;overflow:hidden;box-shadow:0 10px 30px #00000059}.canvas-wrap canvas{display:block;width:100%!important;height:100%!important}.copy{flex-direction:column;justify-content:center;gap:16px;padding:0 12px;display:flex}.copy h1{color:#d8e6ff;letter-spacing:.5px;margin:0;font-size:48px;line-height:1.15}.copy p{color:#bfd4ff;margin:4px 0 20px;font-size:18px}.copy .cta{color:#fff;background:linear-gradient(135deg,#00a3ff 0%,#7b42f6 100%);border:none;border-radius:12px;padding:12px 18px;font-weight:600;box-shadow:0 8px 18px #00a3ff40}.footer{align-items:center;height:72px;padding:0 24px 24px;display:flex}.progress{grid-template-columns:repeat(6,1fr);gap:12px;width:100%;display:grid}.progress-item{opacity:.6;align-items:center;gap:10px;transition:opacity .2s;display:flex}.progress-item .dot{background:0 0;border:2px solid #ffffff40;border-radius:999px;width:12px;height:12px}.progress-item .label{color:#fff9;font-size:12px}.progress-item.active{opacity:1}.progress-item.active .dot{background:#00a3ff;border-color:#00a3ff;box-shadow:0 0 12px #00a3ff99}.progress-item.done{opacity:.9}.progress-item.done .dot{background:#6bcb77;border-color:#6bcb77}.screen.landscape,.hero,.canvas-wrap,.copy,.footer{-webkit-user-select:none;user-select:none}@media (max-width:1024px){.copy h1{font-size:36px}.copy p{font-size:16px}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.fade-up{opacity:0;animation:.7s forwards fadeUp}.fade-up.d0{animation-delay:0s}.fade-up.d1{animation-delay:.25s}.fade-up.d2{animation-delay:.5s}.fade-up.d3{animation-delay:.8s}.fade-up.d4{animation-delay:1.1s}.sublist{flex-direction:column;gap:6px;display:flex}.orbit-svg{pointer-events:none;opacity:.35;filter:drop-shadow(0 0 10px #00a3ff40);place-items:center;display:grid;position:absolute;inset:0}.orbit-svg svg{width:100%;max-width:520px}.ring{fill:none;stroke-width:.8px;stroke:#7b42f659}.r1{animation:22s linear infinite orbit}.r2{stroke:#00a3ff59;animation:28s linear infinite reverse orbit}.r3{stroke:#c9a24a47;animation:36s linear infinite orbit}@keyframes orbit{0%{transform-origin:100px 100px;transform:rotate(0)}to{transform-origin:100px 100px;transform:rotate(360deg)}}.screen .topbar .title{color:#d8e6ff;font-size:18px;font-weight:600}.content{place-items:center;height:calc(100vh - 136px);padding:24px;display:grid}.cards{grid-template-columns:repeat(4,1fr);gap:24px;width:100%;max-width:1200px;display:grid}.card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;background:linear-gradient(#0c1224e6 0%,#0c1224bf 100%);border:1px solid #ffffff1a;border-radius:16px;flex-direction:column;gap:12px;padding:16px;transition:transform .16s,box-shadow .16s,border-color .16s,filter .16s;display:flex;box-shadow:0 10px 28px #00000059}.card:hover{filter:saturate(1.08);border-color:#00a3ff59;transform:translateY(-4px);box-shadow:0 14px 34px #00a3ff38,0 0 24px #7b42f62e}.card:active{transform:translateY(0)}.card .thumb{background:radial-gradient(120px 80px at 30% 30%,#00a3ff38,#0000 60%),radial-gradient(120px 80px at 70% 70%,#7b42f638,#0000 60%),#0e1428;border:1px solid #ffffff1a;border-radius:12px;height:180px;position:relative;overflow:hidden}.card .thumb:after{content:"";opacity:.8;pointer-events:none;background:radial-gradient(120px 80px at 60% 40%,#c9a24a2e,#0000 60%);transition:opacity .16s;position:absolute;inset:0}.card:hover .thumb:after{opacity:1}.card .thumb img{object-fit:cover;opacity:.95;width:100%;height:100%;transition:transform .2s,opacity .16s;display:block;transform:scale(1)}.card:hover .thumb img{opacity:1;transform:scale(1.02)}.card .name{color:#d8e6ff;letter-spacing:.3px;font-size:20px;font-weight:700}.card:hover .name{color:#a9c4ff}.card .desc{color:#ffffffbf;font-size:14px;line-height:1.45}@media (max-width:1200px){.cards{grid-template-columns:repeat(2,1fr)}.card .thumb{height:160px}}@media (max-width:720px){.cards{grid-template-columns:1fr}.content{padding:16px}}.intro-screen{color:#e6ecf2;background:#2a2a2a url(/intro/intro_bg.png) 50%/cover no-repeat;width:100vw;height:100vh;position:relative;overflow:hidden}.intro-header{align-items:center;height:48px;display:flex;position:absolute;top:20px;left:24px}.intro-logo{opacity:.95;filter:drop-shadow(0 2px 6px #00000059);width:auto;height:60px}.intro-main{text-align:center;flex-direction:column;align-items:center;gap:12px;width:min(980px,90vw);display:flex;position:absolute;top:20%;left:50%;transform:translate(-50%)}.intro-title{z-index:2;align-items:center;gap:24px;display:inline-flex;position:relative}.intro-h1{color:#fff;text-shadow:0 2px 14px #00000059;margin:0;font-size:48px;line-height:1.2}.intro-sub{color:#ffffffd9;margin:4px 0 0;font-size:16px}.intro-star{filter:drop-shadow(0 4px 12px #ffffff59);z-index:2;pointer-events:none;display:inline-block}.star-large{width:30px;height:30px}.star-small{width:22px;height:22px}.star-left{transform:translateY(-6px)}.star-right{transform:translateY(6px)}.star-float{position:absolute;top:8px;right:10%}.intro-cta{place-items:center;gap:12px;display:grid;position:absolute;bottom:330px;left:50%;transform:translate(-50%)}.intro-cta-star{cursor:pointer;background:0 0;border:none;border-radius:999px;place-items:center;width:88px;height:88px;padding:0;display:grid;position:relative;overflow:visible}.intro-cta-star img{filter:drop-shadow(0 2px 8px #ffffff73);width:62px;height:62px;display:block}.intro-cta-star:focus-visible{outline-offset:6px;border-radius:999px;outline:3px solid #7b42f699}.intro-cta-text{color:#ffffffd9;font-size:14px}@keyframes twinkleKF{0%{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}to{opacity:.85;transform:scale(1)}}.twinkle{animation:2.4s ease-in-out infinite twinkleKF}.twinkle.delay{animation-delay:.6s}.twinkle.delay2{animation-delay:1.2s}@keyframes twinkleStrongKF{0%{opacity:.94;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}to{opacity:.94;transform:scale(1)}}.twinkle-strong,.twinkle-strong img{animation:2.2s ease-in-out infinite twinkleStrongKF}.intro-cta-star:after{content:"";pointer-events:none;opacity:.28;filter:blur(8px);background:radial-gradient(closest-side,#ffffff8c,#fff0 68%);border-radius:50%;width:84px;height:84px;animation:2.2s ease-in-out infinite twinkleGlowKF;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.twinkle-strong,.twinkle-strong img{will-change:transform,opacity}@keyframes twinkleGlowKF{0%{opacity:.22}50%{opacity:.4}to{opacity:.22}}.intro-cta-star:hover img,.intro-cta-star:focus-visible img{filter:drop-shadow(0 0 18px #ffffffe6)}@media (max-width:1280px){.intro-h1{font-size:40px}.intro-sub{font-size:15px}.intro-cta{bottom:72px}}
