:root{
  --ink:#05060a;
  --ink-2:#0b0d13;
  --paper:#edeff5;
  --orange:#ff6a1f;
  --teal:#17d3c8;
  --lime:#c6f24e;
  --gold:#ffc53d;
  --display:'Chakra Petch','Golos Text',system-ui,sans-serif;
  --text:'Golos Text',system-ui,sans-serif;
  --pixel:'Pixelify Sans','Chakra Petch',monospace;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:#05060a;color:var(--paper);font-family:var(--text);overflow:hidden;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit}
img{user-select:none;-webkit-user-drag:none}
.hide{display:none!important}
.hidden{opacity:0!important;pointer-events:none!important}

#app{position:fixed;inset:0;background:#05060a}
#scene{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}

.vignette{position:absolute;inset:0;pointer-events:none;z-index:2;background:
  radial-gradient(ellipse at 50% 48%,transparent 30%,rgba(0,0,0,.34) 72%,rgba(0,0,0,.9) 100%)}
.grain{position:absolute;inset:-10%;pointer-events:none;z-index:3;opacity:.03;background-image:url(assets/grain.png);background-size:220px 220px;animation:grain 1.2s steps(4) infinite;mix-blend-mode:screen}
@keyframes grain{
  0%{transform:translate(0,0)}
  25%{transform:translate(-1.5%,1%)}
  50%{transform:translate(1%,-1.5%)}
  75%{transform:translate(-1%,-1%)}
  100%{transform:translate(0,0)}
}

/* ------- boot ------- */
#boot-ui{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;align-items:center;transition:opacity .5s ease}
#boot-title{margin-top:clamp(16px,7.4vh,86px);width:min(58vw,720px);filter:drop-shadow(0 10px 40px rgba(255,164,80,.14));transition:all .6s ease}
#power{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%);width:clamp(132px,22vmin,252px);aspect-ratio:1;border:0;background:none;padding:0;cursor:pointer;transition:transform .25s cubic-bezier(.2,.8,.2,1.2)}
#power img{display:block;width:100%;height:100%;object-fit:contain;animation:breath 4s ease-in-out infinite;filter:drop-shadow(0 0 30px rgba(255,187,102,.5)) drop-shadow(0 0 90px rgba(255,106,31,.22))}
.power-halo{position:absolute;inset:-12%;border-radius:50%;background:radial-gradient(circle,rgba(255,178,104,.14) 0%,rgba(255,120,40,.04) 42%,transparent 66%);animation:halo 4s ease-in-out infinite;pointer-events:none}
@keyframes breath{
  0%,100%{filter:drop-shadow(0 0 22px rgba(255,187,102,.38)) drop-shadow(0 0 70px rgba(255,106,31,.16));transform:scale(.985)}
  50%{filter:drop-shadow(0 0 42px rgba(255,204,140,.74)) drop-shadow(0 0 120px rgba(255,106,31,.34));transform:scale(1)}
}
@keyframes halo{
  0%,100%{opacity:.45;transform:scale(.88)}
  50%{opacity:1;transform:scale(1.08)}
}
#power:hover{transform:translate(-50%,-51%) scale(1.035)}
#power:hover .power-halo{animation-duration:1.8s}
#power.pressed{transform:translate(-50%,-50%) scale(.82);opacity:0;transition:transform .28s ease,opacity .3s ease}
#power.pressed img{animation:none;filter:brightness(2.4) drop-shadow(0 0 60px rgba(255,255,255,.9))}
#power.pressed .power-halo{transform:scale(.2);opacity:0;transition:all .25s ease}
.hint{margin-top:auto;margin-bottom:clamp(22px,5vh,52px);font-family:var(--display);font-size:clamp(10px,1.4vmin,13px);letter-spacing:.22em;text-transform:uppercase;color:rgba(237,239,245,.52);transition:opacity .4s}

/* ------- load menu ------- */
#load-ui{position:absolute;inset:0;z-index:5;opacity:0;pointer-events:none;transition:opacity .7s ease}
#load-ui.on{opacity:1}
#load-title{position:absolute;top:clamp(10px,3.4vh,40px);left:50%;transform:translateX(-50%);width:min(46vw,560px);opacity:.92}
#load-caption{position:absolute;top:calc(clamp(10px,3.4vh,40px) + min(46vw,560px) * .109 + 18px);left:50%;transform:translateX(-50%);font-family:var(--display);font-size:clamp(9px,1.3vmin,12px);letter-spacing:.42em;text-transform:uppercase;color:rgba(237,239,245,.45);white-space:nowrap}
#chips{position:absolute;inset:0;pointer-events:none;z-index:8}
.chip{position:absolute;left:0;top:0;transform:translate(-50%,0);pointer-events:auto;display:flex;align-items:center;gap:clamp(6px,1vw,12px);padding:clamp(7px,.9vh,11px) clamp(10px,1.4vw,18px);border-radius:10px;background:rgba(5,6,10,.72);border:1px solid var(--chip,#555);box-shadow:0 0 0 1px rgba(0,0,0,.6),0 8px 26px rgba(0,0,0,.55),0 0 24px var(--chip-glow,transparent);backdrop-filter:blur(7px);cursor:pointer;transition:transform .22s cubic-bezier(.2,.8,.2,1.2),box-shadow .22s,border-color .22s;max-width:min(34vw,330px)}
.chip:hover,.chip:focus-visible,.chip.hot{transform:translate(-50%,-5px) scale(1.035);box-shadow:0 0 0 1px rgba(0,0,0,.6),0 14px 34px rgba(0,0,0,.6),0 0 40px var(--chip-glow,transparent);outline:none}
.chip:active{transform:translate(-50%,-2px) scale(.99)}
.chip .badge{height:clamp(24px,4.2vmin,40px);width:auto;object-fit:contain;flex:none;filter:drop-shadow(0 0 10px var(--chip-glow,transparent))}
.chip .word{height:clamp(18px,3vmin,30px);width:auto;max-width:min(22vw,210px);object-fit:contain;flex:none}
.chip[data-console="pixel"] .word{height:clamp(28px,4.6vmin,46px)}
.chip .word.mav-word{height:auto;width:auto;max-width:none;object-fit:initial;display:block;font-family:var(--display);font-weight:700;font-size:clamp(11px,1.9vmin,16px);letter-spacing:.13em;line-height:1.05;color:#efeaff;text-shadow:0 0 14px rgba(139,92,255,.55);white-space:nowrap}
.chip .sub{font-family:var(--display);font-size:10px;letter-spacing:.16em;color:rgba(237,239,245,.5);display:none}
#chips.stacked{inset:auto 0 2.6vh 0;display:flex;flex-direction:column;align-items:center;gap:7px}
#chips.stacked .chip{position:relative;left:auto!important;top:auto!important;transform:none!important;max-width:min(84vw,330px)}
#chips.stacked .chip:hover{transform:translateY(-2px) scale(1.02)!important}

/* ------- dashboard shell ------- */
#dashboard{position:absolute;inset:0;z-index:10;opacity:0;pointer-events:none;transition:opacity .45s ease}
#dashboard.on{opacity:1;pointer-events:auto}
.dash{position:absolute;inset:0;overflow:hidden;touch-action:none;--accent:#ff6a1f;--accent-soft:rgba(255,106,31,.18);--accent-line:rgba(255,106,31,.5);--chrome:rgba(8,8,11,.6);--chrome-text:#edeff5}
.dash[data-console="blaze"]{--accent:#ff6a1f;--accent-2:#c82000;--accent-soft:rgba(255,106,31,.16);--accent-line:rgba(255,106,31,.55);--chrome:rgba(10,7,5,.66)}
.dash[data-console="orbit"]{--accent:#17d3c8;--accent-2:#0a8f91;--accent-soft:rgba(23,211,200,.12);--accent-line:rgba(23,211,200,.5);--chrome:rgba(5,10,12,.6)}
.dash[data-console="pixel"]{--accent:#c6f24e;--accent-2:#7b9a1c;--accent-soft:rgba(198,242,78,.24);--accent-line:rgba(40,52,10,.55);--chrome:rgba(239,236,204,.86);--chrome-text:#151a06}
.dash[data-console="mav"]{--accent:#8b5cff;--accent-2:#5ef2ff;--accent-soft:rgba(139,92,255,.16);--accent-line:rgba(139,92,255,.55);--chrome:rgba(9,7,16,.7)}

.chrome{position:absolute;top:0;left:0;right:0;height:clamp(58px,8.4vh,76px);z-index:12;display:flex;align-items:center;gap:clamp(8px,1.2vw,18px);padding:0 clamp(14px,4.4vw,64px);background:linear-gradient(180deg,var(--chrome) 0%,transparent 100%);color:var(--chrome-text)}
.chrome::after{content:"";position:absolute;left:clamp(14px,4.4vw,64px);right:clamp(14px,4.4vw,64px);bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--accent-line),transparent);opacity:.5;pointer-events:none}
.chrome .brand{width:clamp(92px,9.5vw,136px);height:auto;opacity:.92;flex:none;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}
.chrome .wordmark{position:static;transform:none;height:clamp(20px,3.2vh,30px);width:auto;max-width:18vw;object-fit:contain;opacity:.96;flex:none;filter:drop-shadow(0 0 16px var(--accent-soft))}
.chrome .mav-wordmark{height:auto;max-width:18vw;font-family:var(--display);font-weight:700;font-size:clamp(13px,2.4vh,20px);letter-spacing:.15em;line-height:1;color:#eee8ff;white-space:nowrap;text-shadow:0 0 20px rgba(139,92,255,.55)}
.dash[data-console="pixel"] .chrome .wordmark{background:rgba(21,26,6,.9);padding:3px 8px;border-radius:7px;height:clamp(30px,4.6vh,44px)}
.dash[data-console="pixel"] .chrome .brand{background:rgba(21,26,6,.9);border-radius:6px;padding:3px 6px;opacity:1}
.chrome .nav{margin-left:auto;display:flex;align-items:center;gap:clamp(3px,.55vw,6px)}
.navbtn{position:relative;width:clamp(32px,4.4vh,42px);height:clamp(32px,4.4vh,42px);border-radius:9px;border:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.22);display:grid;place-items:center;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;padding:0}
.navbtn img{width:56%;height:56%;object-fit:contain;opacity:.84;transition:opacity .16s}
.navbtn:hover,.navbtn:focus-visible{transform:translateY(-2px);border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 16px var(--accent-soft);outline:none}
.navbtn:hover img,.navbtn:focus-visible img{opacity:1}
.navbtn:active{transform:translateY(0) scale(.95)}
.puck{position:relative;width:clamp(34px,4.4vmin,44px);height:clamp(34px,4.4vmin,44px);border:0;background:none;padding:0;cursor:pointer;border-radius:50%;transition:transform .2s ease;flex:none}
.puck:hover{transform:scale(1.06)}
.puck:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.puck .avatar{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 12px var(--accent-soft))}
.puck .badge{position:absolute;right:-7px;bottom:-6px;width:16px;height:16px;object-fit:contain;filter:drop-shadow(0 2px 4px #000)}
.dash[data-console="pixel"] .navbtn{background:#171d07;border-color:#0c1002}
.dash[data-console="pixel"] .navbtn:hover{background:#29360b;border-color:#0c1002;box-shadow:0 0 0 2px rgba(21,26,6,.3)}
.dash[data-console="pixel"] .chrome .clock{opacity:.9}
.chrome .clock{margin-left:clamp(4px,.8vw,12px);font-family:var(--display);font-weight:500;font-size:clamp(12px,1.5vmin,14px);letter-spacing:.1em;opacity:.82;white-space:nowrap}

.controls{position:absolute;bottom:clamp(7px,1.5vh,14px);left:0;right:0;z-index:11;text-align:center;font-family:var(--display);font-size:clamp(8px,1.1vmin,10px);letter-spacing:.16em;text-transform:uppercase;color:rgba(237,239,245,.42);pointer-events:none}
.dash[data-console="pixel"] .controls{color:rgba(21,26,6,.62)}
#dashboard.panel-open .blaze-body,
#dashboard.panel-open .orbit-stage,
#dashboard.panel-open .pixel-body,
#dashboard.panel-open .mav-body,
#dashboard.panel-open .orbit-hint,
#dashboard.panel-open .shop-strip,
#dashboard.panel-open .controls{visibility:hidden}

/* ------- shared rails and shop ------- */
.rail-head{display:flex;align-items:center;gap:10px;font-family:var(--display);min-height:20px;margin-bottom:7px}
.rail-title{font-size:clamp(9px,1.15vmin,11px);letter-spacing:.38em;text-transform:uppercase;color:var(--accent);white-space:nowrap}
.rail-sub{font-size:clamp(8px,1vmin,10px);letter-spacing:.16em;text-transform:uppercase;color:rgba(237,239,245,.42);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.rail-btns{margin-left:auto;display:flex;gap:5px;flex:none}
.rail-btn{width:26px;height:24px;border-radius:5px;border:1px solid var(--accent-line);background:var(--accent-soft);color:var(--accent);font-family:var(--display);font-size:15px;line-height:1;display:grid;place-items:center;cursor:pointer;padding:0;transition:background .16s,color .16s,transform .16s}
.rail-btn:hover{background:var(--accent);color:#08090d;transform:translateY(-1px)}
.rail-btn:active{transform:translateY(0) scale(.94)}
.hero-actions{display:flex;align-items:center;gap:clamp(10px,1.4vw,18px);flex-wrap:wrap;margin-top:10px}
.hero-kicker{font-family:var(--display);font-size:clamp(9px,1.15vmin,11px);letter-spacing:.3em;text-transform:uppercase;color:var(--accent)}
.hero-meta{font-family:var(--display);font-size:clamp(8px,1.05vmin,10px);letter-spacing:.16em;text-transform:uppercase;color:rgba(237,239,245,.46);white-space:nowrap}
.play-cta{font-family:var(--display);font-weight:600;font-size:clamp(10px,1.3vmin,12px);letter-spacing:.18em;text-transform:uppercase;color:#08090c;background:var(--accent);border:1px solid var(--accent);border-radius:6px;padding:8px 15px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;line-height:1;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;flex:none}
.play-cta:hover,.play-cta:focus-visible{transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.35),0 0 18px var(--accent-soft);filter:brightness(1.06);outline:none}
.play-cta:active{transform:translateY(0) scale(.97)}
.dash[data-console="pixel"] .play-cta{background:#1b2208;color:#d8f77e;border-color:#1b2208;border-radius:999px;box-shadow:2px 2px 0 rgba(27,34,8,.35)}
.dash[data-console="pixel"] .play-cta:hover{box-shadow:3px 4px 0 rgba(27,34,8,.4);filter:none}
.rail-scroll{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;touch-action:pan-x;overscroll-behavior-x:contain}
.rail-scroll::-webkit-scrollbar{display:none}
.owned-tag{font-family:var(--display);font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent-line);padding:2px 5px;border-radius:3px;background:rgba(0,0,0,.26);white-space:nowrap;line-height:1.1}
.shop-strip{position:absolute;left:clamp(14px,5.4vw,80px);right:clamp(14px,5.4vw,80px);bottom:clamp(26px,4.2vh,38px);z-index:11;display:flex;flex-direction:column;gap:2px}
.shop-strip .rail-head{margin-bottom:0}
.shop-rail{gap:8px;padding:4px 0 6px;height:60px}
.shop-item{flex:0 0 clamp(148px,14.2vw,192px);height:52px;display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border-radius:7px;padding:4px 8px 4px 4px;cursor:pointer;color:#edeff5;text-align:left;transition:border-color .18s,transform .18s,box-shadow .18s;scroll-snap-align:start;overflow:hidden}
.shop-item:hover,.shop-item:focus-visible{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 0 16px var(--accent-soft);outline:none}
.shop-item img{width:34px;height:42px;object-fit:cover;border-radius:4px;flex:none;background:rgba(255,255,255,.04)}
.shop-info{min-width:0;display:flex;flex-direction:column;gap:2px}
.shop-info strong{font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shop-info em{font-family:var(--display);font-style:normal;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:rgba(237,239,245,.45);white-space:nowrap}
.shop-item.owned{border-color:var(--accent-line)}
.shop-item.owned .shop-info em{color:var(--accent)}
.dash[data-console="pixel"] .rail-title{color:#151a06}
.dash[data-console="pixel"] .rail-sub{color:rgba(21,26,6,.6)}
.dash[data-console="pixel"] .rail-btn{border-color:#1b2208;background:#f3efd2;color:#1b2208;box-shadow:2px 2px 0 #1b2208}
.dash[data-console="pixel"] .rail-btn:hover{background:#151a06;color:#c6f24e}
.dash[data-console="pixel"] .shop-item{background:rgba(255,255,255,.5);border-color:rgba(21,26,6,.28);color:#151a06}
.dash[data-console="pixel"] .shop-item:hover{border-color:#151a06;box-shadow:3px 3px 0 #1b2208}
.dash[data-console="pixel"] .shop-item.owned{border-color:#a33b00}
.dash[data-console="pixel"] .shop-info em{color:rgba(21,26,6,.55)}
.dash[data-console="pixel"] .shop-item.owned .shop-info em{color:#a33b00}
.dash[data-console="pixel"] .owned-tag{color:#151a06;border-color:#151a06;background:rgba(255,255,255,.45)}
.dash[data-console="pixel"] .controls{color:rgba(21,26,6,.62)}

/* ------- blaze dashboard ------- */
.dash-blaze{background:
  radial-gradient(ellipse at 18% 12%,rgba(255,106,31,.20) 0%,transparent 46%),
  radial-gradient(ellipse at 92% 96%,rgba(200,32,0,.16) 0%,transparent 52%),
  linear-gradient(160deg,#120a06 0%,#090609 58%,#05060a 100%)}
.dash-blaze::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.012) 3px 4px);pointer-events:none}
.blaze-body{position:absolute;top:clamp(82px,11.5vh,102px);left:clamp(18px,5.4vw,80px);right:clamp(18px,5.4vw,80px);bottom:clamp(140px,19vh,164px);display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:clamp(14px,2.4vh,24px);perspective:1200px}
.blaze-hero{flex:0 0 auto;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto auto auto;column-gap:clamp(18px,2.2vw,32px);row-gap:4px;align-content:center;align-items:center;transform:rotateY(calc(var(--px,0) * 1.4deg)) rotateX(calc(var(--py,0) * -1deg));transition:transform .3s ease}
.blaze-hero .art{grid-column:1;grid-row:1 / span 4;height:clamp(200px,34vh,270px);width:auto;aspect-ratio:2/3;justify-self:start;position:relative;border-radius:7px;overflow:hidden;border:1px solid rgba(255,150,80,.34);box-shadow:0 22px 56px rgba(0,0,0,.68),0 0 42px rgba(255,106,31,.12)}
.blaze-hero .art img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .25s ease}
.blaze-hero .art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 54%,rgba(5,6,10,.8) 100%)}
.blaze-hero .num{position:absolute;right:10px;bottom:2px;z-index:2;font-family:var(--display);font-weight:700;font-size:clamp(32px,4.4vw,56px);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(255,197,61,.55);opacity:.8}
.blaze-hero .hero-kicker{grid-column:2;grid-row:1;margin:0}
.blaze-hero h2{grid-column:2;grid-row:2;margin:0;font-family:var(--display);font-weight:700;font-style:italic;text-transform:uppercase;font-size:clamp(24px,2.7vw,36px);line-height:1.02;letter-spacing:-.01em;background:linear-gradient(180deg,#fff3e2,#ff8a3a 62%,#e33c08);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 14px rgba(255,106,31,.25))}
.blaze-hero p{grid-column:2;grid-row:3;margin:4px 0 0;font-size:clamp(11px,1.4vmin,14px);color:rgba(237,239,245,.62);line-height:1.5;max-width:62ch;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.blaze-hero .hero-actions{grid-column:2;grid-row:4;margin-top:10px}
.blaze-main{flex:0 0 auto;min-width:0;display:flex;flex-direction:column;justify-content:flex-start;transform:rotateY(calc(var(--px,0) * 1.2deg)) rotateX(calc(var(--py,0) * -.8deg));transition:transform .35s ease}
.blaze-ribbons{gap:clamp(8px,1.1vw,14px);padding:2px 2px 10px}
.ribbon{position:relative;flex:0 0 clamp(238px,27vw,340px);height:clamp(124px,19vh,170px);display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:10px;border:1px solid rgba(255,106,31,.2);background:linear-gradient(135deg,rgba(255,106,31,.16),rgba(70,14,4,.2) 70%);overflow:hidden;cursor:pointer;text-align:left;opacity:.7;filter:saturate(.85);scroll-snap-align:start;transition:transform .22s cubic-bezier(.2,.8,.2,1.1),border-color .2s,box-shadow .22s,opacity .2s,filter .2s;outline:none}
.ribbon::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,190,120,.14) 50%,transparent 72%);transform:translateX(-120%);transition:transform .55s ease;pointer-events:none}
.ribbon:hover{transform:translateY(-3px);border-color:rgba(255,106,31,.44);opacity:.9;filter:none}
.ribbon:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ribbon:hover::after{transform:translateX(120%)}
.ribbon.focus{opacity:1;filter:none;transform:translateY(-4px) scale(1.01);border-color:var(--orange);box-shadow:0 0 0 2px var(--orange),0 16px 34px rgba(0,0,0,.5),0 0 36px rgba(255,106,31,.3),inset 0 0 34px rgba(255,106,31,.08)}
.ribbon-art{flex:0 0 auto;height:100%;aspect-ratio:2/3;border-radius:5px;overflow:hidden;box-shadow:0 6px 18px #000;background:#150906}
.ribbon-art img{width:100%;height:100%;object-fit:cover;display:block}
.ribbon .idx{position:absolute;top:9px;right:10px;font-family:var(--display);font-weight:600;font-size:10px;letter-spacing:.12em;color:#ff9a5e;opacity:.85}
.ribbon .txt{min-width:0;flex:1;padding-right:4px}
.ribbon h3{margin:0;font-family:var(--display);font-weight:700;font-style:italic;text-transform:uppercase;font-size:clamp(13px,1.6vw,17px);letter-spacing:.005em;line-height:1.1;color:#ffeadd;display:-webkit-box;text-wrap:balance;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ribbon .meta{margin-top:4px;font-family:var(--display);font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,196,160,.55);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ribbon .go{display:none}
.ribbon.focus .go{display:inline-flex;position:absolute;right:10px;bottom:9px;font-family:var(--display);font-weight:600;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:#120a06;background:var(--orange);border-radius:3px;padding:3px 6px;line-height:1;z-index:2}
.ribbon .owned-tag{position:absolute;left:13px;bottom:10px}
.ribbon .bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,#ff6a1f,#ffc53d,transparent);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.ribbon.focus .bar{transform:scaleX(1)}

/* ------- orbit dashboard ------- */
.dash-orbit{background:
  radial-gradient(circle at 50% 42%,rgba(23,211,200,.13) 0%,rgba(5,14,16,.2) 34%,#04070a 70%),
  linear-gradient(180deg,#05090b,#04060a)}
.dash-orbit::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(23,211,200,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(23,211,200,.05) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(circle at 50% 46%,rgba(0,0,0,.5),transparent 72%);-webkit-mask-image:radial-gradient(circle at 50% 46%,rgba(0,0,0,.5),transparent 72%)}
.orbit-stage{position:absolute;inset:clamp(82px,11.5vh,102px) 0 clamp(140px,19vh,164px);display:flex;align-items:center;justify-content:center}
.orbit-system{position:relative;width:min(58vmin,500px);aspect-ratio:1;display:grid;place-items:center}
.or-ring{position:absolute;border-radius:50%;pointer-events:none}
.or-ring.a{inset:0;border:1px solid rgba(23,211,200,.26);animation:spin 70s linear infinite}
.or-ring.a::before,.or-ring.a::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:#7ff5ee;box-shadow:0 0 12px #17d3c8;top:-3px;left:50%}
.or-ring.a::after{top:auto;bottom:-3px}
.or-ring.b{inset:12%;border:1px dashed rgba(23,211,200,.18);animation:spin 46s linear infinite reverse}
.or-ring.c{inset:25%;border:1px solid rgba(23,211,200,.12);animation:spin 90s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.or-core{position:relative;width:46%;aspect-ratio:1;border-radius:50%;overflow:hidden;border:1px solid rgba(23,211,200,.7);background:#04090b;box-shadow:0 0 0 8px rgba(23,211,200,.03),0 0 64px rgba(23,211,200,.18),inset 0 0 60px rgba(0,0,0,.6);z-index:3;transition:box-shadow .3s}
.or-core img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .3s ease}
.or-core::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 48px rgba(0,0,0,.6);pointer-events:none}
.or-node{position:absolute;left:50%;top:50%;width:15%;aspect-ratio:1;border-radius:50%;padding:3px;border:1px solid rgba(23,211,200,.36);background:#04090b;cursor:pointer;transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(-1 * min(20vmin,190px))) rotate(calc(-1 * var(--a)));opacity:.5;transition:opacity .25s,border-color .25s,box-shadow .25s,scale .25s;outline:none}
.or-node img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.or-node:hover{opacity:.92;border-color:rgba(127,245,238,.8);box-shadow:0 0 18px rgba(23,211,200,.4);scale:1.06}
.or-node:focus-visible,.or-node.focus{opacity:1;border:2px solid #7ff5ee;box-shadow:0 0 0 3px rgba(23,211,200,.2),0 0 28px rgba(23,211,200,.6);scale:1.16}
.or-detail{position:absolute;left:50%;bottom:0;transform:translateX(-50%);text-align:center;width:min(90vw,760px);z-index:4;pointer-events:none}
.or-head{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.or-detail h2{margin:0;font-family:var(--display);font-weight:300;font-size:clamp(16px,2.8vh,30px);letter-spacing:.1em;text-transform:uppercase;color:#effcfa;text-shadow:0 0 28px rgba(23,211,200,.35);white-space:nowrap}
.or-detail .play-cta{pointer-events:auto}
.or-detail .line{height:1px;width:min(46vw,360px);margin:8px auto 6px;background:linear-gradient(90deg,transparent,rgba(23,211,200,.7),transparent)}
.or-detail p{display:none}
.or-detail .meta{margin-top:4px;font-family:var(--display);font-size:9px;letter-spacing:.34em;text-transform:uppercase;color:rgba(23,211,200,.55)}
.orbit-hint{position:absolute;left:50%;top:clamp(82px,11.5vh,102px);transform:translateX(-50%);font-family:var(--display);font-size:9px;letter-spacing:.26em;text-transform:uppercase;color:rgba(23,211,200,.35);z-index:4;pointer-events:none;white-space:nowrap}

/* ------- pixel dashboard ------- */
.dash-pixel{background:
  radial-gradient(circle at 22% 10%,#d9f58a 0%,transparent 44%),
  radial-gradient(circle at 84% 92%,#aede3a 0%,transparent 48%),
  linear-gradient(150deg,#d3ef86 0%,#c6f24e 46%,#b4e63c 100%);color:#151a06}
.dash-pixel::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(21,26,6,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(21,26,6,.06) 1px,transparent 1px);background-size:26px 26px;pointer-events:none}
.pixel-hero{display:none}
.pixel-body{position:absolute;top:clamp(82px,11.5vh,102px);left:clamp(16px,4.6vw,64px);right:clamp(16px,4.6vw,64px);bottom:clamp(140px,19vh,164px);display:flex;flex-direction:column;justify-content:center;gap:clamp(9px,1.5vh,15px);min-height:0}
.px-quick{display:flex;align-items:center;gap:clamp(8px,1.6vw,16px);justify-content:center}
.px-quick .dot{width:clamp(32px,4.8vh,44px);aspect-ratio:1;border-radius:50%;background:#f3efd2;border:2px solid #1b2208;box-shadow:3px 3px 0 #1b2208;display:grid;place-items:center;cursor:pointer;transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s;padding:0}
.px-quick .dot img{width:56%;height:56%;object-fit:contain;opacity:.72;filter:brightness(.25)}
.px-quick .dot:hover{transform:translateY(-3px);box-shadow:4px 6px 0 #1b2208}
.px-grid{gap:clamp(9px,1.4vw,16px);padding:4px 2px 8px;width:100%;perspective:1000px}
.px-card{position:relative;flex:0 0 clamp(142px,15vw,192px);background:#f5f0d4;border:3px solid #1b2208;border-radius:14px;padding:clamp(5px,.7vw,8px);box-shadow:5px 5px 0 #1b2208;cursor:pointer;text-align:left;transition:transform .24s cubic-bezier(.34,1.56,.64,1),box-shadow .24s cubic-bezier(.34,1.56,.64,1),background .2s;outline:none;overflow:hidden;scroll-snap-align:start}
.px-card .art{position:relative;display:block;aspect-ratio:2/3;border-radius:8px;overflow:hidden;border:2px solid #1b2208;background:#1b2208}
.px-card .art img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease}
.px-card h3{margin:7px 2px 1px;font-family:var(--pixel);font-weight:400;font-size:clamp(12px,1.8vh,17px);line-height:1.02;letter-spacing:.01em;color:#151a06}
.px-card .meta{font-family:var(--display);font-weight:700;font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:rgba(21,26,6,.55);margin:0 2px 2px}
.px-card .pip{position:absolute;top:8px;right:8px;width:9px;height:9px;border-radius:50%;background:#1b2208;opacity:.25;z-index:2}
.px-card .owned-tag{position:absolute;left:9px;bottom:8px;z-index:2}
.px-card:hover{transform:translateY(-4px);box-shadow:7px 9px 0 #1b2208}
.px-card:focus-visible{outline:3px solid #151a06;outline-offset:3px}
.px-quick .dot:focus-visible{outline:3px solid #151a06;outline-offset:2px}
.px-card:hover .art img{transform:scale(1.04)}
.px-card.focus{transform:translateY(-8px) rotate(-.4deg);background:#fffbe8;box-shadow:9px 12px 0 #1b2208,0 0 0 4px rgba(27,34,8,.92),0 0 42px rgba(198,242,78,.55);border-color:#0e1202}
.px-card.focus .pip{background:#e34f0c;opacity:1}
.px-grid .px-card:not(.focus){filter:saturate(.86) brightness(.9);opacity:.82}
.px-detail{display:flex;align-items:center;gap:14px;justify-content:center;flex-wrap:wrap;font-family:var(--display);font-size:clamp(9px,1.2vmin,11px);letter-spacing:.16em;text-transform:uppercase;color:rgba(21,26,6,.7)}
.px-detail strong{font-family:var(--pixel);font-weight:400;font-size:clamp(12px,1.8vh,16px);letter-spacing:.03em}
.px-detail .play-cta{margin-left:2px}

/* ------- mavplay dashboard ------- */
.dash-mav{background:
  radial-gradient(ellipse at 16% 10%,rgba(139,92,255,.22) 0%,transparent 46%),
  radial-gradient(ellipse at 90% 92%,rgba(94,242,255,.12) 0%,transparent 52%),
  linear-gradient(155deg,#0d0a1c 0%,#080611 55%,#05060a 100%);color:#edeff5}
.dash-mav::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(139,92,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(139,92,255,.045) 1px,transparent 1px);background-size:52px 52px;mask-image:radial-gradient(circle at 60% 44%,rgba(0,0,0,.55),transparent 74%);-webkit-mask-image:radial-gradient(circle at 60% 44%,rgba(0,0,0,.55),transparent 74%);pointer-events:none}
.mav-body{position:absolute;top:clamp(82px,11.5vh,102px);left:clamp(16px,5.4vw,80px);right:clamp(16px,5.4vw,80px);bottom:clamp(140px,19vh,164px);display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:clamp(14px,2.4vh,24px);perspective:1100px}
.mav-hero{flex:0 0 auto;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto auto auto;column-gap:clamp(18px,2.2vw,32px);row-gap:4px;align-content:center;align-items:center;transform:rotateY(calc(var(--px,0) * 1.4deg)) rotateX(calc(var(--py,0) * -1deg));transition:transform .3s ease}
.mav-hero .art{grid-column:1;grid-row:1 / span 4;height:clamp(200px,34vh,270px);width:auto;aspect-ratio:2/3;justify-self:start;position:relative;border-radius:8px;overflow:hidden;border:1px solid rgba(139,92,255,.45);box-shadow:0 22px 56px rgba(0,0,0,.68),0 0 44px rgba(139,92,255,.16)}
.mav-hero .art img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .28s ease}
.mav-kicker{grid-column:2;grid-row:1;font-family:var(--display);font-size:clamp(9px,1.15vmin,11px);letter-spacing:.3em;text-transform:uppercase;color:var(--accent);margin:0;white-space:nowrap}
.mav-hero h2{grid-column:2;grid-row:2;margin:0;font-family:var(--display);font-weight:300;font-size:clamp(24px,2.7vw,36px);line-height:1.03;letter-spacing:.04em;text-transform:uppercase;color:#efeaff;text-shadow:0 0 24px rgba(139,92,255,.35)}
.mav-hero p{grid-column:2;grid-row:3;margin:4px 0 0;font-size:clamp(11px,1.4vmin,14px);color:rgba(237,239,245,.62);line-height:1.5;max-width:62ch;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mav-hero .hero-actions{grid-column:2;grid-row:4;margin-top:10px}
.mav-main{flex:0 0 auto;min-width:0;display:flex;flex-direction:column;justify-content:flex-start}
.mav-rail{gap:clamp(8px,1.1vw,14px);padding:2px 2px 10px}
.mav-card{position:relative;flex:0 0 clamp(238px,27vw,340px);height:clamp(124px,19vh,170px);display:flex;align-items:center;gap:12px;padding:11px 13px;border:1px solid rgba(139,92,255,.26);background:linear-gradient(105deg,rgba(139,92,255,.15),rgba(22,16,44,.22) 70%);border-radius:10px;cursor:pointer;text-align:left;opacity:.7;filter:saturate(.85);scroll-snap-align:start;transition:transform .22s cubic-bezier(.2,.8,.2,1.1),border-color .2s,box-shadow .22s,opacity .2s,filter .2s;outline:none;overflow:hidden}
.mav-card:hover{transform:translateY(-3px);border-color:rgba(182,156,255,.55);opacity:.9;filter:none}
.mav-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mav-card.focus{opacity:1;filter:none;transform:translateY(-4px) scale(1.01);border-color:var(--accent);box-shadow:0 0 0 2px var(--accent),0 16px 34px rgba(0,0,0,.5),0 0 34px rgba(139,92,255,.32),inset 0 0 28px rgba(139,92,255,.08)}
.mav-num{font-family:var(--display);font-weight:300;font-size:clamp(20px,3vh,28px);line-height:1;color:var(--accent);opacity:.9;flex:none;width:2ch}
.mav-card > img{width:auto;height:100%;aspect-ratio:2/3;object-fit:cover;border-radius:5px;flex:none;box-shadow:0 6px 18px #000}
.mav-info{min-width:0;flex:1;padding-right:12px;display:flex;flex-direction:column;gap:3px}
.mav-info h3{margin:0;font-family:var(--display);font-weight:600;font-size:clamp(13px,1.6vw,17px);line-height:1.1;text-transform:uppercase;letter-spacing:.03em;color:#f0ecff;display:-webkit-box;text-wrap:balance;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mav-info .meta{font-family:var(--display);font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:rgba(182,168,255,.6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mav-card .owned-tag{position:absolute;right:10px;bottom:9px}

/* ------- panels ------- */
.panel-layer{position:absolute;inset:0;z-index:30;touch-action:pan-y;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 42%,rgba(14,16,23,.86),rgba(3,4,7,.94));backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .25s ease;padding:16px}
.panel-layer.on{opacity:1;pointer-events:auto}
.panel{position:relative;width:min(600px,94vw);max-height:88dvh;overflow:auto;touch-action:pan-y;background:#0b0d13;border:1px solid rgba(255,255,255,.13);border-radius:16px;padding:clamp(18px,3.4vw,32px);box-shadow:0 30px 90px rgba(0,0,0,.75),0 0 60px rgba(0,0,0,.5);transform:translateY(12px) scale(.98);transition:transform .3s cubic-bezier(.2,.8,.2,1.1);color:#edeff5}
.panel-layer.on .panel{transform:none}
.panel .kicker{font-family:var(--display);font-size:10px;letter-spacing:.36em;text-transform:uppercase;color:var(--accent)}
.panel h2{margin:8px 0 2px;font-family:var(--display);font-weight:700;font-size:clamp(22px,3.4vw,34px);line-height:1.02;text-transform:uppercase;letter-spacing:.01em}
.panel p{margin:10px 0;color:rgba(237,239,245,.66);line-height:1.55;font-size:14px}
.panel .close{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);cursor:pointer;font-size:18px;line-height:1}
.panel .close:hover{background:rgba(255,255,255,.12)}
.panel .row{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.panel .row:last-child{border-bottom:0}
.panel .row .label{flex:1;font-size:14px}
.panel .row .sub{display:block;font-size:11px;color:rgba(237,239,245,.45);margin-top:3px}
.btn{font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--accent);background:var(--accent-soft);color:#fff;padding:11px 20px;border-radius:8px;cursor:pointer;transition:transform .18s,background .18s,box-shadow .18s}
.btn:hover{transform:translateY(-2px);box-shadow:0 0 24px var(--accent-soft);background:rgba(255,255,255,.1)}
.btn.ghost{border-color:rgba(255,255,255,.16);background:transparent;color:rgba(237,239,245,.8)}
.switch{width:52px;height:28px;border-radius:14px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);position:relative;cursor:pointer;transition:background .2s,border-color .2s;flex:none}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#cfd4df;transition:transform .2s cubic-bezier(.2,.8,.2,1.2),background .2s}
.switch.on{background:var(--accent-soft);border-color:var(--accent)}
.switch.on::after{transform:translateX(24px);background:var(--accent)}
.card-cover{width:100%;max-height:42dvh;object-fit:contain;display:block;margin:0 auto;border-radius:8px;filter:drop-shadow(0 18px 40px rgba(0,0,0,.6))}
.panel .cover-wrap{background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.06),transparent 60%);border-radius:12px;padding:10px;margin:12px 0}
.panel .actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.profile-head{display:flex;align-items:center;gap:16px;margin:10px 0 18px}
.profile-head img.avatar{width:92px;height:92px;object-fit:contain;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.08),transparent 70%)}
.profile-head .who{font-family:var(--display);font-weight:600;font-size:20px}
.profile-head .badge{width:24px;height:24px;object-fit:contain;margin-left:6px;vertical-align:-4px}
.profile-head .state{font-size:12px;color:rgba(237,239,245,.5);letter-spacing:.08em}
.launch{position:absolute;inset:0;z-index:32;display:none;align-items:center;justify-content:center;background:#05060a;text-align:center;padding:24px}
.launch.on{display:flex}
.launch .inner{width:min(520px,90vw)}
.launch .ring{width:64px;height:64px;margin:0 auto 24px;border-radius:50%;border:2px solid rgba(255,255,255,.12);border-top-color:var(--accent);animation:spin 1.1s linear infinite}
.launch h2{font-family:var(--display);font-weight:600;font-size:clamp(18px,3vh,26px);letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px}
.launch p{color:rgba(237,239,245,.6);line-height:1.6;margin:0 0 24px;font-size:14px}
.launch .ticker{height:3px;width:100%;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden;margin-bottom:26px}
.launch .ticker span{display:block;height:100%;width:38%;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:sweep 1.8s ease-in-out infinite}
@keyframes sweep{0%{transform:translateX(-100%)}100%{transform:translateX(320%)}}

#toast{position:fixed;left:50%;bottom:clamp(26px,6vh,60px);transform:translate(-50%,20px);z-index:60;background:rgba(12,14,20,.94);border:1px solid rgba(255,255,255,.16);border-left:3px solid var(--accent,#ff6a1f);padding:12px 18px;border-radius:9px;font-family:var(--display);font-size:12px;letter-spacing:.08em;color:#edeff5;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;max-width:min(90vw,520px);text-align:center;box-shadow:0 16px 40px rgba(0,0,0,.6)}
#toast.on{opacity:1;transform:translate(-50%,0)}

#flash{position:fixed;inset:0;z-index:50;background:#fff;opacity:0;pointer-events:none}
#flash.go{animation:flashout .42s ease-out}
@keyframes flashout{0%{opacity:.95}55%{opacity:.18}100%{opacity:0}}
#fade{position:fixed;inset:0;z-index:45;background:#000;opacity:0;pointer-events:none;transition:opacity .34s ease}
#fade.on{opacity:1;pointer-events:auto}
#fade.quick{transition-duration:.12s}

/* ------- responsive ------- */
@media (max-width:820px){
  #boot-title{width:min(86vw,640px);margin-top:clamp(14px,5vh,60px)}
  #load-title{width:min(64vw,420px)}
  #load-caption{display:none}

  /* header: legible two-line system block on the left, controls on the right */
  .chrome{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:clamp(6px,2vw,12px);row-gap:1px;height:auto;min-height:clamp(52px,8vh,64px);padding:6px clamp(9px,3vw,16px);align-content:center}
  .chrome .brand{grid-column:1;grid-row:1;width:clamp(96px,29vw,140px);align-self:end;justify-self:start;opacity:1}
  .chrome .wordmark{grid-column:1;grid-row:2;justify-self:start;position:static;transform:none;height:clamp(16px,2.6vh,22px);max-width:min(36vw,140px)}
  .chrome .mav-wordmark{height:auto;font-size:clamp(10px,2.8vw,13px);max-width:min(36vw,140px);line-height:1}
  .dash[data-console="pixel"] .chrome .wordmark{height:clamp(22px,3.4vh,28px);max-width:min(34vw,120px);padding:2px 5px}
  .chrome .clock{display:none}
  .chrome .nav{grid-column:2;grid-row:1 / span 2;justify-self:end;margin:0;display:flex;align-items:center;gap:3px}
  .navbtn{width:clamp(28px,7.4vw,34px);height:clamp(28px,4vh,34px);border-radius:8px}
  .puck{grid-column:3;grid-row:1 / span 2;align-self:center;width:clamp(28px,7.4vw,34px);height:clamp(28px,7.4vw,34px)}
  .puck .badge{width:14px;height:14px;right:-4px;bottom:-4px}
  #chips.stacked{gap:5px;bottom:2.2vh}
  #chips.stacked .chip{padding:5px 10px;max-width:min(88vw,300px)}

  .blaze-body{left:14px;right:14px;top:clamp(62px,8.4vh,78px);bottom:clamp(112px,14vh,134px);gap:clamp(12px,2.2vh,20px);justify-content:center}
  .blaze-hero{grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto auto auto;column-gap:14px;row-gap:3px;align-content:center}
  .blaze-hero .art{grid-column:1;grid-row:1 / span 4;height:clamp(200px,34vh,300px)}
  .blaze-hero .num{font-size:28px}
  .blaze-hero .hero-kicker{grid-column:2;grid-row:1;font-size:8px}
  .blaze-hero h2{grid-column:2;grid-row:2;margin:0;font-size:clamp(18px,5.1vw,26px)}
  .blaze-hero p{grid-column:2;grid-row:3;margin:2px 0 0;font-size:clamp(10px,2.7vw,12.5px);line-height:1.4;max-width:none;-webkit-line-clamp:3}
  .blaze-hero .hero-actions{grid-column:2;grid-row:4;margin-top:7px;gap:8px}
  .play-cta{font-size:10px;padding:7px 12px}
  .hero-meta{font-size:8.5px;letter-spacing:.08em;max-width:44vw;overflow:hidden;text-overflow:ellipsis}
  .rail-title{font-size:10px;letter-spacing:.26em}
  .rail-sub{font-size:8px;letter-spacing:.11em}
  .blaze-main{width:100%}
  .blaze-ribbons{width:100%;gap:8px}
  .ribbon{flex:0 0 clamp(270px,72vw,320px);height:clamp(150px,22.5vh,195px);padding:10px 12px;gap:10px}
  .ribbon h3{font-size:clamp(12px,3.3vw,15px)}
  .ribbon .meta{font-size:8px;white-space:normal;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.2}
  .ribbon-art{height:100%}

  .orbit-stage{inset:clamp(62px,8.4vh,78px) 0 clamp(112px,14vh,134px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(8px,1.6vh,14px);padding:0 14px}
  .orbit-system{width:min(96vw,420px)}
  .or-node{transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(-1 * min(35vw,150px))) rotate(calc(-1 * var(--a)))}
  .or-detail{position:static;left:auto;bottom:auto;transform:none;width:100%}
  .or-detail h2{font-size:clamp(15px,4vw,22px);white-space:normal}
  .or-detail .or-head{gap:8px;row-gap:6px}
  .or-detail .line{margin:6px auto 5px}
  .or-detail .play-cta{font-size:9px;padding:6px 10px}
  .orbit-hint{display:block;top:clamp(74px,9.4vh,92px);font-size:8.5px;letter-spacing:.14em;color:rgba(23,211,200,.5)}

  .pixel-body{top:clamp(62px,8.4vh,78px);bottom:clamp(112px,14vh,134px);gap:clamp(10px,1.8vh,16px);justify-content:center;padding-top:0}
  .px-quick{display:none}
  .pixel-hero{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto auto auto;column-gap:12px;row-gap:3px;align-content:center;align-items:center}
  .pixel-hero .art{grid-column:1;grid-row:1 / span 4;height:clamp(160px,27vh,230px);aspect-ratio:2/3;width:auto;justify-self:start;position:relative;border-radius:12px;overflow:hidden;border:3px solid #1b2208;box-shadow:6px 6px 0 #1b2208}
  .pixel-hero .art img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .25s ease}
  .pixel-hero .hero-kicker{grid-column:2;grid-row:1;font-size:8px;color:#151a06}
  .pixel-hero h2{grid-column:2;grid-row:2;margin:0;font-family:var(--pixel);font-weight:400;font-size:clamp(19px,5.2vw,26px);line-height:1.02;color:#151a06;text-shadow:none}
  .pixel-hero p{grid-column:2;grid-row:3;margin:2px 0 0;font-size:clamp(10px,2.7vw,12.5px);line-height:1.4;color:rgba(21,26,6,.78);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .pixel-hero .hero-actions{grid-column:2;grid-row:4;margin-top:7px;gap:8px}
  .pixel-hero .hero-meta{color:rgba(21,26,6,.6)}
  .px-grid{width:100%}
  .px-card{flex:0 0 clamp(120px,38vw,170px)}
  .px-card h3{font-size:clamp(11px,3.2vw,14px)}
  .px-detail{display:none}

  .mav-body{left:14px;right:14px;top:clamp(62px,8.4vh,78px);bottom:clamp(112px,14vh,134px);gap:clamp(12px,2.2vh,20px);justify-content:center}
  .mav-hero{grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto auto auto;column-gap:14px;row-gap:3px;align-content:center}
  .mav-hero .art{grid-column:1;grid-row:1 / span 4;height:clamp(200px,34vh,300px)}
  .mav-kicker{grid-column:2;grid-row:1;font-size:8px}
  .mav-hero h2{grid-column:2;grid-row:2;margin:0;font-size:clamp(17px,5vw,26px)}
  .mav-hero p{grid-column:2;grid-row:3;margin:2px 0 0;font-size:clamp(10px,2.7vw,12.5px);line-height:1.4;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .mav-hero .hero-actions{grid-column:2;grid-row:4;margin-top:7px;gap:8px}
  .mav-main{width:100%}
  .mav-rail{width:100%;gap:8px}
  .mav-card{flex:0 0 clamp(270px,72vw,320px);height:clamp(150px,22.5vh,195px);padding:10px 12px;gap:10px}
  .mav-num{display:none}
  .mav-info h3{font-size:clamp(12px,3.3vw,15px)}
  .mav-info .meta{white-space:normal;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.2}

  .shop-strip{left:14px;right:14px;bottom:clamp(22px,3.4vh,30px)}
  .shop-rail{height:56px;gap:6px}
  .shop-item{flex:0 0 clamp(142px,44vw,180px);height:50px}
  .shop-item img{width:32px;height:40px}
  .shop-info strong{font-size:11.5px}
  .shop-info em{font-size:8px}
  .controls{font-size:8.5px;letter-spacing:.09em;bottom:6px}
  .panel{padding:18px}
}
@media (max-width:820px) and (max-height:640px){
  .pixel-hero .art{height:150px}
  .px-card{flex:0 0 clamp(96px,30vw,130px)}
  .blaze-hero .art,.mav-hero .art{height:clamp(180px,32vh,240px)}
  .ribbon,.mav-card{height:clamp(140px,22vh,170px)}
}
@media (max-width:820px) and (max-height:530px) and (orientation:portrait){
  .blaze-hero,.mav-hero,.pixel-hero{display:none}
  .blaze-body,.mav-body,.pixel-body{top:56px;bottom:104px;justify-content:center;gap:8px}
  .blaze-body,.mav-body{display:flex;flex-direction:column}
  .ribbon,.mav-card{height:clamp(110px,24vh,140px)}
  .px-card{flex:0 0 clamp(96px,30vw,130px)}
  .px-detail{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;font-size:8px;letter-spacing:.1em}
  .px-detail .play-cta{font-size:9px;padding:6px 10px}
  .orbit-stage{inset:56px 0 104px}
  .orbit-system{width:min(80vw,260px)}
  .orbit-hint{display:none}
  .or-detail h2{font-size:14px}
  .shop-strip{bottom:18px}
  .shop-rail{height:48px}
  .shop-item{height:42px}
  .shop-item img{width:28px;height:34px}
  .controls{display:none}
}
@media (max-height:520px) and (orientation:landscape){
  #boot-title{width:min(48vw,520px);margin-top:10px}
  #power{width:clamp(120px,30vmin,190px);top:52%}
  .chrome{height:50px}
  .chrome .brand{width:66px}
  .chrome .wordmark{height:18px}
  .chrome .mav-wordmark{font-size:13px}
  .blaze-body{top:56px;bottom:112px;flex-direction:row;align-items:center;gap:16px}
  .blaze-hero{display:none}
  .blaze-main{width:auto;flex:1}
  .ribbon{flex:0 0 190px;height:84px;padding:6px 8px}
  .ribbon-art{height:100%}
  .ribbon h3{font-size:11px}
  .ribbon .meta{display:none}
  .orbit-stage{inset:56px 0 112px}
  .orbit-system{width:min(54vmin,340px)}
  .or-node{transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(-1 * min(20vmin,130px))) rotate(calc(-1 * var(--a)))}
  .or-detail h2{font-size:14px}
  .or-detail .line{margin:5px auto 4px}
  .or-detail .meta{display:none}
  .pixel-body{top:56px;bottom:112px;gap:4px}
  .px-grid{width:100%}
  .px-card{flex:0 0 104px;padding:4px}
  .px-card .art{height:118px;aspect-ratio:auto}
  .px-card h3{font-size:10px}
  .px-card .meta{display:none}
  .mav-body{top:56px;bottom:112px;flex-direction:row;align-items:center;gap:16px}
  .mav-hero{display:none}
  .mav-main{width:auto;flex:1}
  .mav-card{flex:0 0 200px;height:80px;padding:6px 8px}
  .mav-card > img{height:100%}
  .mav-info h3{font-size:11px}
  .mav-info .meta{display:none}
  .shop-strip{bottom:16px;left:14px;right:14px}
  .shop-rail{height:46px}
  .shop-item{height:40px;flex-basis:140px}
  .shop-item img{width:28px;height:34px}
  .shop-strip .rail-sub{display:none}
  .controls{display:none}
}
@media (max-width:420px){
  .chrome{padding:0 8px;gap:4px}
  .chrome .brand{width:44px}
  .chrome .wordmark{max-width:15vw;height:16px}
  .dash[data-console="pixel"] .chrome .wordmark{height:22px}
  .navbtn{width:28px;height:28px}
  .puck{width:28px;height:28px}
  .puck .badge{width:12px;height:12px;right:-3px;bottom:-3px}
  .or-node{width:16%}
}