@font-face{font-family:"Press Start 2P";src:url(fonts/PressStart2P-Regular.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Silkscreen";src:url(fonts/silkscreen-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Silkscreen";font-weight:700;src:url(fonts/silkscreen-latin-700-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Barlow Condensed";font-weight:700;src:url(fonts/BarlowCondensed-Bold.woff2) format("woff2");font-display:swap}
:root{--void:#07060c;--ink:#f6f2f8;--pink:#ff148c;--pale:#ffd2e6;--mint:#7dffc3;--gold:#ffc356;--lav:#c9b6ff;--cyan:#7cf7ff;--green:#146e46;--muted:#c9c3d4;--card:#110d1c;--line:#2a2340}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--void);color:var(--ink);font:15px/1.6 "Silkscreen",ui-monospace,monospace;background-image:radial-gradient(ellipse at 50% -10%,#1d1236 0%,transparent 55%),radial-gradient(1px 1px at 20% 30%,#fff8,transparent),radial-gradient(1px 1px at 70% 80%,#fff6,transparent),radial-gradient(1px 1px at 40% 60%,#fff5,transparent),radial-gradient(1px 1px at 85% 20%,#fff7,transparent);background-attachment:fixed}
a{color:var(--mint)}
h1,h2,h3,.px{font-family:"Press Start 2P",monospace;font-weight:400;letter-spacing:.02em}
h2{font-size:18px;color:var(--pale);text-shadow:0 0 8px var(--pink),0 0 22px var(--pink);margin:0 0 6px}
h3{font-size:11px;color:var(--mint);margin:0 0 10px;line-height:1.5}
.wrap{max-width:1180px;margin:0 auto;padding:0 18px}
header.top{position:sticky;top:0;z-index:20;background:rgba(7,6,12,.85);backdrop-filter:blur(8px);border-bottom:2px solid var(--pink);box-shadow:0 0 18px #ff148c55}
header.top .wrap{display:flex;align-items:center;gap:14px;height:56px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--pale);font-family:"Press Start 2P";font-size:11px;white-space:nowrap}
.brand img{width:28px;height:28px;image-rendering:pixelated}
nav.links{display:flex;gap:14px;overflow-x:auto;scrollbar-width:none;flex:1}
nav.links a{color:var(--muted);text-decoration:none;font-size:13px;white-space:nowrap}
nav.links a:hover{color:var(--mint)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:"Press Start 2P";font-size:10px;line-height:1.4;padding:11px 14px;border-radius:8px;border:2px solid var(--mint);color:var(--mint);background:rgba(125,255,195,.06);text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{background:rgba(125,255,195,.16);box-shadow:0 0 14px #7dffc366}
.btn.pink{border-color:var(--pink);color:#fff;background:var(--pink);box-shadow:0 0 18px #ff148c88}
.btn.pink:hover{background:#ff3aa0}
.btn.gold{border-color:var(--gold);color:var(--gold);background:rgba(255,195,86,.08)}
.btn.sm{font-size:8px;padding:8px 10px}
.top .btn{font-size:8px;padding:9px 10px}
.hero{padding:56px 0 34px;text-align:center;border-bottom:2px solid var(--mint);box-shadow:0 8px 24px -16px var(--mint)}
.hero h1{font-size:clamp(26px,6vw,58px);margin:0;color:var(--pale);text-shadow:0 0 6px var(--pink),0 0 18px var(--pink),0 0 42px var(--pink)}
.hero .tag{font-family:"Press Start 2P";color:var(--mint);font-size:clamp(10px,2vw,14px);text-shadow:0 0 10px #7dffc399;margin:16px 0 6px}
.hero p.lead{color:var(--muted);max-width:640px;margin:14px auto 22px}
.hero .chars{display:flex;justify-content:center;gap:clamp(6px,2vw,18px);margin:26px 0 10px}
.hero .chars img{width:clamp(56px,11vw,110px);height:auto;image-rendering:pixelated;filter:drop-shadow(0 0 12px #ff148c44)}
.cta{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:28px auto 0;max-width:900px}
.fact{border:2px solid #7dffc355;border-radius:10px;padding:14px 10px;background:rgba(7,6,12,.6);text-align:center}
.fact b{display:block;font-family:"Press Start 2P";font-weight:400;color:var(--gold);font-size:clamp(12px,2.4vw,18px);margin-bottom:6px;text-shadow:0 0 10px #ffc35666}
.fact span{color:var(--muted);font-size:12px}
section.blk{padding:52px 0;border-bottom:1px solid var(--line)}
.sub{color:var(--muted);margin:0 0 22px;max-width:760px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.g3{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.g4{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.g6{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.card .pv{background:#0b0914;display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;overflow:hidden;position:relative}
.card .pv.checker{background-color:#1a1626;background-image:linear-gradient(45deg,#231d33 25%,transparent 25%,transparent 75%,#231d33 75%),linear-gradient(45deg,#231d33 25%,transparent 25%,transparent 75%,#231d33 75%);background-size:20px 20px;background-position:0 0,10px 10px}
.card .pv.light{background:#f6f2f8}
.card .pv img,.card .pv video{max-width:100%;max-height:100%;display:block}
.card .pv.sq{aspect-ratio:1/1}.card .pv.tall{aspect-ratio:3/4}
.card .meta{padding:12px;display:flex;flex-direction:column;gap:8px;flex:1}
.card .meta .name{font-size:13px;color:var(--ink)}
.card .meta .dim{font-size:11px;color:#8d8796}
.dl{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
.char .pv{aspect-ratio:1/1}
.char .pv img{width:100%;height:100%;image-rendering:pixelated}
.badge{position:absolute;top:8px;left:8px;font-family:"Press Start 2P";font-size:7px;padding:5px 6px;border-radius:5px;background:#07060ccc;color:var(--gold);border:1px solid #ffc35666}
.sw{border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--card)}
.sw .chip{height:96px}
.sw .meta{padding:10px 12px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.sw .meta b{font-family:"Press Start 2P";font-weight:400;font-size:9px;color:var(--ink);display:block;margin-bottom:4px}
.sw code{font-size:12px;color:var(--muted)}
.type{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px}
.type .s{font-size:22px;margin:8px 0 6px;word-break:break-word}
.composer{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}
.stage{background:#0b0914;border:1px solid var(--line);border-radius:12px;padding:10px;position:relative}
.stage canvas{width:100%;height:auto;display:block;border-radius:6px;touch-action:none;cursor:grab}
.stage canvas.drag{cursor:grabbing}
.panel{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:14px}
.panel label{font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:6px}
.panel select,.panel input[type=text]{background:#07060c;color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:10px;font:inherit}
.panel input[type=range]{width:100%;accent-color:var(--mint)}
.panel .row{display:flex;gap:8px;flex-wrap:wrap}
.drop{border:2px dashed var(--mint);border-radius:10px;padding:16px;text-align:center;color:var(--mint);cursor:pointer;background:rgba(125,255,195,.05)}
.drop.over{background:rgba(125,255,195,.15)}
.note{font-size:11px;color:#8d8796}
.chk{flex-direction:row!important;align-items:center;gap:8px!important}
.post{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px;white-space:pre-wrap;font:15px/1.6 system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);max-width:640px}
.dd{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.dd ul{margin:0;padding-left:18px}.dd li{margin:6px 0;color:var(--muted)}
.dd .do{border-color:#7dffc366}.dd .dont{border-color:#ff148c66}
.dd .do h3{color:var(--mint)}.dd .dont h3{color:var(--pink)}
footer{padding:40px 0 70px;text-align:center;color:#8d8796}
footer img.credit{height:30px;opacity:.9}
footer pre{font-size:5px;line-height:1.05;color:#1FA39C;display:inline-block;text-align:left;margin:18px 0 0;overflow:hidden;max-width:100%}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(120px);background:var(--mint);color:#07060c;font-family:"Press Start 2P";font-size:10px;padding:12px 16px;border-radius:8px;transition:transform .25s;z-index:50}
.toast.on{transform:translateX(-50%) translateY(0)}
.zipline{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 18px}
@media (max-width:860px){.composer{grid-template-columns:1fr}.facts{grid-template-columns:repeat(2,1fr)}.dd{grid-template-columns:1fr}nav.links{display:none}.top .wrap{justify-content:space-between}}
@media (max-width:420px){.g2,.g3{grid-template-columns:1fr}.g6{grid-template-columns:repeat(2,1fr)}.g4{grid-template-columns:repeat(2,1fr)}.brand span{display:none}}
.composer>*{min-width:0}.panel select,.panel input[type=text]{width:100%;max-width:100%;min-width:0}
.grid{align-items:start}
.bigdl{display:flex;flex-direction:column;align-items:center;gap:14px;margin:26px auto 8px;max-width:760px}
.btn.big{font-size:16px;padding:20px 28px;flex-direction:column;gap:8px;width:100%;max-width:560px;white-space:normal;text-align:center}
.btn.big small{font-family:"Silkscreen",monospace;font-size:12px;opacity:.85}
.parts{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center}
.parts .note{width:100%;text-align:center}
.dlrow{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}
.dlrow .lab{font-family:"Press Start 2P";font-size:8px;color:var(--muted);min-width:76px}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.btn.sm.pink{color:#fff}