:root{--bg: #070710;--bg-2: #0b0b18;--surface: rgba(20, 21, 38, .55);--surface-hi: rgba(30, 32, 54, .72);--border: rgba(150, 160, 200, .14);--border-hi: rgba(180, 190, 230, .32);--text: #eef0f8;--text-dim: #9aa0b8;--text-faint: #6b7090;--font-display: "Space Grotesk", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;min-height:100vh;font-family:var(--font-display);color:var(--text);background:radial-gradient(1100px 700px at 78% -8%,rgba(60,139,255,.16),transparent 60%),radial-gradient(900px 650px at 12% 12%,rgba(177,92,255,.13),transparent 60%),radial-gradient(800px 600px at 50% 112%,rgba(255,90,60,.1),transparent 60%),linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%);background-attachment:fixed;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:2;background:radial-gradient(120% 120% at 50% 40%,transparent 62%,rgba(0,0,0,.45) 100%);mix-blend-mode:multiply}#bg{position:fixed;inset:0;width:100%;height:100%;z-index:0;opacity:.7}#app{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:clamp(2.5rem,6vw,5.5rem) clamp(1.1rem,4vw,2.5rem) 3rem;display:flex;flex-direction:column;min-height:100vh}.hero{text-align:center;margin-bottom:clamp(2.6rem,5vw,4.2rem)}.pill{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--font-mono);font-size:.74rem;letter-spacing:.04em;color:var(--text-dim);padding:.42rem .95rem;border:1px solid var(--border);border-radius:100px;background:var(--surface);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;transform:translateY(12px);transition:opacity .7s ease,transform .7s ease}.pill-dot{width:7px;height:7px;border-radius:50%;background:#3ee07a;box-shadow:0 0 #3ee07a80;animation:pulse 2.4s ease-out infinite}@keyframes pulse{0%{box-shadow:0 0 #3ee07a80}70%{box-shadow:0 0 0 9px #3ee07a00}to{box-shadow:0 0 #3ee07a00}}.title{font-size:clamp(3.2rem,12vw,8rem);line-height:.92;font-weight:700;letter-spacing:-.03em;margin:1.3rem 0 0;display:flex;flex-direction:column}.title-line{opacity:0;transform:translateY(20px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}.title-line:nth-child(2){transition-delay:.08s}.title-accent{background:linear-gradient(100deg,#3c8bff,#b15cff 38%,#ff5a3c 72%,#ffb23c);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;filter:drop-shadow(0 6px 40px rgba(120,90,255,.35))}.subtitle{margin:1.5rem auto 0;max-width:38ch;font-size:clamp(1rem,2.2vw,1.22rem);line-height:1.5;color:var(--text-dim);opacity:0;transform:translateY(14px);transition:opacity .8s ease .18s,transform .8s ease .18s}body.ready .pill,body.ready .title-line,body.ready .subtitle{opacity:1;transform:translateY(0)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:clamp(1.1rem,2.4vw,1.6rem);width:100%}.card{--mx: 50%;--my: 0%;position:relative;display:flex;flex-direction:column;border-radius:22px;border:1px solid var(--border);background:var(--surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow:hidden;text-decoration:none;color:inherit;isolation:isolate;opacity:0;transform:translateY(26px) scale(.985);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .45s cubic-bezier(.2,.8,.2,1),border-color .35s ease,box-shadow .45s ease}body.ready .card{opacity:1;transform:translateY(0) scale(1);transition-delay:calc(.28s + var(--i) * .09s)}.card:before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(420px circle at var(--mx) var(--my),color-mix(in srgb,var(--accent) 16%,transparent),transparent 45%);opacity:0;transition:opacity .4s ease}.card:after{content:"";position:absolute;top:0;left:0;right:0;height:2px;z-index:4;background:linear-gradient(90deg,transparent,var(--accent),var(--accent2),transparent);opacity:0;transition:opacity .4s ease}.card--live{cursor:pointer}.card--live:hover{transform:translateY(-8px) scale(1.012);border-color:var(--border-hi);box-shadow:0 24px 60px -20px #000000b3,0 0 0 1px color-mix(in srgb,var(--accent) 25%,transparent),0 30px 80px -30px color-mix(in srgb,var(--accent) 45%,transparent)}.card--live:hover:before,.card--live:hover:after{opacity:1}.card--live:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.card--live:active{transform:translateY(-3px) scale(1.004)}.card--soon{cursor:default}.card--soon .card-body,.card--soon .card-thumb{opacity:.82}.card-thumb{position:relative;aspect-ratio:16 / 9;overflow:hidden;background:radial-gradient(120% 120% at 50% 0%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 55%),linear-gradient(160deg,#ffffff0b,#0000002e);border-bottom:1px solid var(--border)}.art-svg{position:absolute;inset:0;width:100%;height:100%;display:block}.thumb-glow{position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 120%,color-mix(in srgb,var(--accent) 30%,transparent),transparent 70%);opacity:.5;transition:opacity .4s ease;pointer-events:none}.card--live:hover .thumb-glow{opacity:.95}.float-a{animation:floatA 6s ease-in-out infinite;transform-origin:175px 130px}.float-b{animation:floatB 5s ease-in-out infinite;transform-origin:248px 150px}.spin{animation:spin 14s linear infinite;transform-origin:200px 130px}.swing{animation:swing 3.4s ease-in-out infinite;transform-origin:300px 20px}.boost{animation:floatA 3.6s ease-in-out infinite;transform-origin:147px 137px}.flame{animation:flicker .4s ease-in-out infinite alternate;transform-origin:100px 144px}.debris{animation:floatB 4.2s ease-in-out infinite}@keyframes floatA{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-7px) rotate(1.5deg)}}@keyframes floatB{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes swing{0%,to{transform:rotate(-12deg)}50%{transform:rotate(14deg)}}@keyframes flicker{0%{opacity:.6;transform:scaleX(.9)}to{opacity:1;transform:scaleX(1.1)}}.card-body{display:flex;flex-direction:column;gap:.7rem;padding:1.25rem 1.3rem 1.35rem;flex:1}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.card-title{font-size:1.16rem;font-weight:600;letter-spacing:-.012em;margin:0;line-height:1.2}.badge{flex-shrink:0;display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.08em;padding:.3rem .55rem;border-radius:7px;margin-top:.15rem}.badge--live{color:#4be08a;background:#4be08a1a;border:1px solid rgba(75,224,138,.28)}.badge--live .dot{width:6px;height:6px;border-radius:50%;background:#4be08a;box-shadow:0 0 8px #4be08acc}.badge--soon{color:var(--text-dim);background:#96a0c814;border:1px solid var(--border)}.card-tagline{margin:0;font-size:.92rem;line-height:1.45;color:var(--text-dim)}.card-foot{margin-top:auto;padding-top:.85rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem}.tags{display:flex;flex-wrap:wrap;gap:.35rem}.tag{font-family:var(--font-mono);font-size:.64rem;color:var(--text-faint);padding:.22rem .5rem;border:1px solid var(--border);border-radius:6px;white-space:nowrap}.cta{flex-shrink:0;display:inline-flex;align-items:center;gap:.3rem;font-size:.86rem;font-weight:600;color:var(--accent);white-space:nowrap}.cta .arrow{transition:transform .3s ease;display:inline-block}.card--live:hover .cta .arrow{transform:translate(2px,-2px)}.cta--muted{color:var(--text-faint);font-weight:500}.footer{margin-top:auto;padding-top:clamp(2.5rem,6vw,4rem);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.55rem;font-family:var(--font-mono);font-size:.76rem;color:var(--text-faint);text-align:center}.footer-mark{color:var(--text-dim);font-weight:500}.footer-sep{opacity:.45}.footer-dim{opacity:.7}@media (max-width: 560px){.title{letter-spacing:-.02em}.card-head{flex-direction:row}.footer{font-size:.7rem}#bg{opacity:.55}}@media (hover: none){.card--live:active{transform:translateY(-3px) scale(1.005);border-color:var(--border-hi)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.15s!important}.pill,.title-line,.subtitle,.card{opacity:1!important;transform:none!important}}
