/* =========================================================
   Beyond Science | NEO skin (the 2030 look)
   Deep space, glass panels, neon edges, holograms.
   Turn it off: remove class="neo" from <body> in index.html.
   ========================================================= */
@font-face{font-family:"Orbitron";font-weight:500;font-display:swap;src:url(assets/fonts/orbitron-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Orbitron";font-weight:700;font-display:swap;src:url(assets/fonts/orbitron-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Orbitron";font-weight:900;font-display:swap;src:url(assets/fonts/orbitron-latin-900-normal.woff2) format("woff2")}
@font-face{font-family:"Chakra Petch";font-weight:500;font-display:swap;src:url(assets/fonts/chakra-petch-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Chakra Petch";font-weight:600;font-display:swap;src:url(assets/fonts/chakra-petch-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Chakra Petch";font-weight:700;font-display:swap;src:url(assets/fonts/chakra-petch-latin-700-normal.woff2) format("woff2")}

body.neo{
  --void:#04050f; --deep:#0a0e2a; --cyan:#3EF0FF; --magenta:#FF4FD8; --violet:#7B5CFF; --lime:#5CFFB0;
  --hud:"Orbitron","Chakra Petch",system-ui,sans-serif;
  --display:"Chakra Petch",Fredoka,system-ui,sans-serif;
  --glass:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
  --glassWarm:linear-gradient(160deg,rgba(255,201,77,.22),rgba(255,140,0,.07));
  --line:rgba(130,220,255,.28);
  --page:#0d1233; --page2:rgba(120,160,255,.10); --edge:rgba(130,220,255,.28);
  --ink:#EEF4FF; --ink2:#A9B8DD;
  --honeyDeep:#FFC94D; --plum:#D2B4FF; --mint:#5CFFB0; --mintBg:rgba(92,255,176,.12); --coral:#FF6B7A; --coralBg:rgba(255,107,122,.14);
  --night:#0a0e2a; --night2:#141a46; --night3:#22296a;
  background-color:var(--void);
  background-image:
    radial-gradient(1.5px 1.5px at 12% 18%, #fffc 50%, transparent 51%),
    radial-gradient(1px 1px at 72% 12%, #fffa 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 88% 46%, #fff9 50%, transparent 51%),
    radial-gradient(1px 1px at 32% 64%, #fff8 50%, transparent 51%),
    radial-gradient(1px 1px at 55% 88%, #fff9 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 6% 82%, #fff8 50%, transparent 51%),
    radial-gradient(900px 520px at 85% -8%, rgba(123,92,255,.45) 0%, transparent 60%),
    radial-gradient(800px 480px at -8% 105%, rgba(62,240,255,.22) 0%, transparent 60%),
    radial-gradient(700px 400px at 50% 120%, rgba(255,79,216,.18) 0%, transparent 60%);
  background-attachment:fixed;
}
body.neo::before{content:"";position:fixed;inset:auto 0 0 0;height:42vh;pointer-events:none;z-index:-1;
  background:
    linear-gradient(to top,rgba(62,240,255,.10),transparent 70%),
    repeating-linear-gradient(90deg,rgba(62,240,255,.16) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(0deg,rgba(62,240,255,.16) 0 1px,transparent 1px 64px);
  transform:perspective(500px) rotateX(62deg);transform-origin:bottom;
  -webkit-mask-image:linear-gradient(to top,#000 10%,transparent 85%);mask-image:linear-gradient(to top,#000 10%,transparent 85%)}
body.neo h1,body.neo h2,body.neo h3,body.neo h4{font-family:var(--display);font-weight:700;letter-spacing:.2px}
body.neo .book h1,body.neo .book h2{background:linear-gradient(90deg,#fff 0%,#cfe9ff 60%,var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
body.neo .kicker{font-family:var(--hud);font-weight:700;font-size:12.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--cyan);text-shadow:0 0 12px rgba(62,240,255,.55)}

/* Top bar: a floating HUD */
body.neo .top{background:rgba(6,8,24,.72);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);border-bottom:1px solid rgba(62,240,255,.22);box-shadow:0 8px 30px rgba(0,0,0,.45),0 1px 0 rgba(62,240,255,.25)}
body.neo .wordmark{font-family:var(--hud);font-weight:900;letter-spacing:2px;text-transform:uppercase;font-size:22px}
body.neo .chip,body.neo .iconbtn{background:rgba(255,255,255,.05);border:1px solid rgba(62,240,255,.25);box-shadow:inset 0 0 12px rgba(62,240,255,.08)}
body.neo .xpbar{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(62,240,255,.25)}
body.neo .xpbar i{background:linear-gradient(90deg,var(--cyan),var(--honey2));box-shadow:0 0 10px var(--cyan)}
body.neo .practice{border:1px solid rgba(62,240,255,.35)!important;background:rgba(62,240,255,.06)!important;font-family:var(--hud);font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#bfefff}

/* The book becomes a glass command panel */
body.neo .book{background:linear-gradient(165deg,rgba(26,32,78,.82),rgba(8,10,32,.9));color:var(--ink);
  border:1px solid rgba(62,240,255,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px rgba(123,92,255,.15),0 0 50px rgba(62,240,255,.10),0 30px 70px rgba(0,0,0,.6);
  backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3)}
body.neo .book::after{content:"";position:absolute;inset:8px;pointer-events:none;border-radius:calc(var(--r-lg) - 6px);z-index:0;
  background:
    linear-gradient(var(--cyan),var(--cyan)) top left/26px 2px no-repeat,linear-gradient(var(--cyan),var(--cyan)) top left/2px 26px no-repeat,
    linear-gradient(var(--cyan),var(--cyan)) top right/26px 2px no-repeat,linear-gradient(var(--cyan),var(--cyan)) top right/2px 26px no-repeat,
    linear-gradient(var(--magenta),var(--magenta)) bottom left/26px 2px no-repeat,linear-gradient(var(--magenta),var(--magenta)) bottom left/2px 26px no-repeat,
    linear-gradient(var(--magenta),var(--magenta)) bottom right/26px 2px no-repeat,linear-gradient(var(--magenta),var(--magenta)) bottom right/2px 26px no-repeat;
  opacity:.8}
body.neo .book.spread>.pg:first-child{border-right:1px solid rgba(62,240,255,.14)}
@media (max-width:820px){body.neo .book.spread>.pg:first-child{border-right:0;border-bottom:1px solid rgba(62,240,255,.14)}}
body.neo .pageturn{animation:neoIn .5s cubic-bezier(.2,.8,.2,1)}
@keyframes neoIn{from{transform:translateY(18px) scale(.985);opacity:0;filter:blur(6px)}to{transform:none;opacity:1;filter:none}}

/* Buttons: plasma */
body.neo .btn{font-family:var(--hud);font-weight:700;letter-spacing:1.2px;text-transform:uppercase;font-size:15px;border-radius:12px;color:#1a1000;
  background:linear-gradient(180deg,#FFE08A,var(--honey) 55%,#F08C00);box-shadow:0 0 0 1px rgba(255,220,140,.6) inset,0 6px 0 #9a5a00,0 0 24px rgba(255,180,40,.45)}
body.neo .btn:hover{filter:brightness(1.08)}
body.neo .btn:active{box-shadow:0 0 0 1px rgba(255,220,140,.6) inset,0 2px 0 #9a5a00,0 0 18px rgba(255,180,40,.4)}
body.neo .btn.ghost{background:rgba(62,240,255,.06);color:var(--cyan);box-shadow:inset 0 0 0 1.5px var(--cyan),0 0 16px rgba(62,240,255,.2)}
body.neo .btn.dark{background:linear-gradient(180deg,#2a3380,#121747);color:#fff;box-shadow:inset 0 0 0 1px rgba(62,240,255,.4),0 5px 0 #05071c,0 0 18px rgba(62,240,255,.25)}
body.neo .btn.big{font-size:17px}
body.neo .back{color:var(--ink);border:1px solid var(--line);box-shadow:0 0 14px rgba(62,240,255,.15);font-family:var(--hud);font-size:13px;letter-spacing:1px;text-transform:uppercase}
body.neo .back:hover{background:rgba(62,240,255,.15);border-color:var(--cyan)}
body.neo .xclose{color:var(--ink);border:1px solid var(--line);box-shadow:0 0 14px rgba(62,240,255,.2)}
body.neo label.f{font-family:var(--hud);font-size:12.5px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#cfe3ff;margin-top:20px}
body.neo label.f .muted{text-transform:none;letter-spacing:0;font-family:var(--body);font-size:13.5px;color:var(--ink2)}
body.neo .inp{border:1px solid var(--line);color:var(--ink)}
body.neo .inp:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(62,240,255,.18)}
body.neo .inp::placeholder{color:#7f8fb8}
body.neo :focus-visible{outline-color:var(--cyan)}
body.neo .cover{background:linear-gradient(rgba(4,5,15,.72),rgba(4,5,15,.92)),url(assets/scenes/splash.webp) center/cover no-repeat}
body.neo .cover h1{color:#fff}
body.neo .tag{font-family:var(--hud);font-size:15px;letter-spacing:1.5px;text-transform:uppercase;color:var(--honey2);text-shadow:0 0 14px rgba(255,201,77,.5)}
body.neo .bnav{background:rgba(6,8,24,.8)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid rgba(62,240,255,.25)!important}
body.neo .toast{background:rgba(10,14,42,.92);border:1px solid var(--cyan);color:#fff;box-shadow:0 0 24px rgba(62,240,255,.35);backdrop-filter:blur(10px)}
body.neo .toast.mint{border-color:var(--lime);box-shadow:0 0 24px rgba(92,255,176,.35)}
body.neo .meter{background:rgba(255,255,255,.08)}

body.neo .book.spread>.pg:first-child{background:var(--glass)}
body.neo .book.spread>.pg:last-child{background:var(--glass)}
body.neo .btn.ms{background:var(--glass);color:var(--ink)}
body.neo .back{background:var(--glass)}
body.neo .briefcard .bcard{background:var(--glass)}
body.neo .xclose{background:var(--glass)}
body.neo .inp{background:var(--glass)}
body.neo .sheetThumb{border:4px solid var(--line);background:var(--glass)}
body.neo .door{background:var(--glass)}
body.neo .dok{background:var(--glass)}
body.neo .sec{background:var(--glass)}
body.neo .sec.on{background:var(--glassWarm)}
body.neo .qcard{background:var(--glass)}
body.neo .choice .k{background:var(--glass)}
body.neo .feedback.good{color:var(--ink)}
body.neo .feedback.try{background:var(--glassWarm);color:var(--ink)}
body.neo .cluecard{background:var(--glass)}
body.neo .watch{background:var(--glassWarm)}
body.neo .flip .front{background:var(--glass)}
body.neo .tile{background:var(--glass)}
body.neo .tile.sel{background:var(--glassWarm)}
body.neo .sortcard{background:var(--glass)}
body.neo .cnt{background:var(--glass)}
body.neo .coef{background:var(--glass)}
body.neo .tally{background:var(--glass)}
body.neo .ordered div{color:var(--ink)}
body.neo .ordered div::before{background:var(--glass)}
body.neo .sw{border:3px solid var(--line)}
body.neo .opt{background:var(--glass)}
body.neo .opt.on{background:var(--glassWarm)}
body.neo .depotline{background:var(--glassWarm)}
body.neo .pup{background:var(--glass)}
body.neo .fieldnote{background:var(--glass)}
body.neo .dcats button{background:var(--glass)}
body.neo .dcard{background:var(--glass)}
body.neo .dcard.mine{background:var(--glass)}
body.neo .wcard{background:var(--glass)}
body.neo .wcard.on{background:var(--glassWarm)}
body.neo .fcard{background:var(--glass)}
body.neo .fcard.on{background:var(--glassWarm)}
body.neo .beat{background:var(--glass)}
body.neo .beat.apex{background:var(--glass)}
body.neo .say{background:var(--glass)}

/* ---------- Hand tuning after the auto pass ---------- */
body.neo .book{color:var(--ink)}
body.neo .fcard,body.neo .dcard,body.neo .opt,body.neo .wcard{border:1px solid var(--line);color:var(--ink);backdrop-filter:blur(6px)}
body.neo .fcard.on,body.neo .opt.on,body.neo .wcard.on{border-color:var(--honey2);box-shadow:0 0 0 1px var(--honey2),0 0 22px rgba(255,201,77,.45)}
body.neo .fcard .fpic,body.neo .dcard .dpic{background:radial-gradient(circle at 50% 35%,rgba(62,240,255,.18),rgba(10,14,42,.9) 70%)}
body.neo .fcard b,body.neo .dcard b{font-family:var(--display);font-weight:700}
body.neo .fcard .lockpill,body.neo .wcard .lockpill{background:rgba(4,5,15,.85);border:1px solid var(--line)}
body.neo .persona .opt span{color:var(--ink2)}
body.neo .persona .opt{border-radius:14px;padding:12px}
body.neo .say{border:1px solid var(--line)}
body.neo .panel{background:rgba(255,255,255,.04);border:1px solid var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}

/* ---------- Founder screen: the hologram showcase ---------- */
body.neo .neo-stage{position:relative}
.showcase{position:relative;width:min(100%,400px);aspect-ratio:1/1.08;margin:6px auto 0;border-radius:24px;overflow:hidden;isolation:isolate;
  background:radial-gradient(120% 70% at 50% 100%,rgba(62,240,255,.28),transparent 60%),radial-gradient(90% 60% at 50% 0%,rgba(123,92,255,.35),transparent 70%),linear-gradient(#0b1033,#05071a);
  border:1px solid rgba(62,240,255,.35);box-shadow:0 0 40px rgba(62,240,255,.18),inset 0 0 40px rgba(123,92,255,.25)}
.showcase::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:6;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px);mix-blend-mode:screen}
.sc-grid{position:absolute;left:-30%;right:-30%;bottom:-6%;height:46%;z-index:0;transform:perspective(320px) rotateX(64deg);transform-origin:bottom;
  background:repeating-linear-gradient(90deg,rgba(62,240,255,.35) 0 1px,transparent 1px 34px),repeating-linear-gradient(0deg,rgba(62,240,255,.35) 0 1px,transparent 1px 34px);
  -webkit-mask-image:linear-gradient(to top,#000,transparent 90%);mask-image:linear-gradient(to top,#000,transparent 90%);animation:gridRun 2.4s linear infinite}
@keyframes gridRun{to{background-position:0 34px,0 34px}}
.sc-beam{position:absolute;left:50%;bottom:8%;width:80%;height:92%;transform:translateX(-50%);z-index:1;clip-path:polygon(38% 100%,62% 100%,100% 0,0 0);
  background:linear-gradient(to top,rgba(62,240,255,.45),rgba(62,240,255,.06) 70%,transparent);filter:blur(2px);animation:beam 3s ease-in-out infinite}
@keyframes beam{50%{opacity:.65}}
.sc-rings{position:absolute;left:50%;bottom:6%;width:62%;aspect-ratio:3.6;transform:translateX(-50%);z-index:2}
.sc-rings i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--cyan);box-shadow:0 0 16px var(--cyan),inset 0 0 16px var(--cyan);animation:ring 2.4s ease-out infinite}
.sc-rings i:nth-child(2){animation-delay:.8s;border-color:var(--magenta);box-shadow:0 0 16px var(--magenta)}
.sc-rings i:nth-child(3){animation-delay:1.6s}
@keyframes ring{from{transform:scale(.4);opacity:1}to{transform:scale(1.25);opacity:0}}
.sc-hero{position:absolute;left:50%;bottom:9%;height:86%;width:auto;max-width:none;transform:translateX(-50%);z-index:3;
  filter:drop-shadow(0 0 14px rgba(62,240,255,.55)) drop-shadow(0 18px 18px rgba(0,0,0,.5));animation:hover 3.2s ease-in-out infinite}
@keyframes hover{50%{transform:translateX(-50%) translateY(-10px)}}
.showcase.quick .sc-hero{animation:zap .22s ease-out}
@keyframes zap{from{transform:translateX(-50%) scale(.82) skewX(-6deg);filter:brightness(2.2) hue-rotate(40deg) drop-shadow(0 0 22px var(--cyan));opacity:.4}to{transform:translateX(-50%)}}
.showcase.landed .sc-hero{animation:materialize .9s cubic-bezier(.2,1.4,.3,1),hover 3.2s ease-in-out .9s infinite}
@keyframes materialize{0%{transform:translateX(-50%) scale(.3) rotate(-25deg);filter:brightness(3) blur(8px);opacity:0}60%{transform:translateX(-50%) scale(1.12) rotate(4deg);filter:brightness(1.5)}100%{transform:translateX(-50%) scale(1)}}
.showcase.landed::before{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;background:radial-gradient(circle at 50% 60%,rgba(255,255,255,.9),rgba(62,240,255,.4) 30%,transparent 65%);animation:flashOut .8s ease-out forwards}
@keyframes flashOut{to{opacity:0;transform:scale(1.6)}}
.showcase.locked .sc-hero{filter:grayscale(1) brightness(.45) drop-shadow(0 0 10px rgba(255,79,216,.5))}
.sc-lock{position:absolute;left:12px;right:12px;bottom:12px;z-index:7;background:rgba(4,5,15,.85);border:1px solid var(--magenta);border-radius:14px;padding:8px 12px;text-align:center;font-weight:800;font-size:14px;color:#ffd6f6;box-shadow:0 0 18px rgba(255,79,216,.35)}
.sc-badge{position:absolute;right:12px;bottom:12px;z-index:7;width:68px;height:68px;border-radius:50%;overflow:hidden;border:2px solid var(--honey2);box-shadow:0 0 16px rgba(255,201,77,.6)}
.sc-plate{display:grid;justify-items:center;gap:2px;margin-top:14px;text-align:center}
.sc-name{font-family:"Orbitron",var(--display);font-weight:900;font-size:clamp(30px,4.4vw,46px);letter-spacing:3px;text-transform:uppercase;line-height:1;
  background:linear-gradient(180deg,#fff 20%,#9DEBFF 60%,#3EF0FF);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 12px rgba(62,240,255,.45))}
.sc-kind{font-family:"Orbitron",var(--display);font-weight:700;font-size:13px;letter-spacing:3px;text-transform:uppercase;color:#bcd0ff}
.sc-tier{font-family:"Orbitron",var(--display);font-weight:700;font-size:11.5px;letter-spacing:2px;text-transform:uppercase;padding:4px 12px;border-radius:999px;border:1px solid currentColor;display:inline-flex;align-items:center;gap:4px}
.t-basic .sc-tier{color:var(--cyan)}.t-silver .sc-tier{color:#dfe8ff}.t-gold .sc-tier{color:var(--honey2)}.t-platinum .sc-tier{color:var(--magenta)}
.sc-line{margin:10px auto 0;max-width:360px;text-align:center;font-weight:800;font-size:16px;color:var(--ink)}
.sc-hook{margin:2px auto 0;max-width:360px;text-align:center;font-weight:600;font-size:14px;color:var(--ink2)}
.sc-founder{margin-top:18px;text-align:center;font-family:"Orbitron",var(--display)!important;font-weight:900;letter-spacing:2px;text-transform:uppercase}
body.neo .avstage .muted{text-align:center}
@media (min-width:821px){body.neo .neo-stage>#scwrap{position:sticky;top:84px}}

/* ---------- The Hive Wheel ---------- */
.hw{margin:6px 0 4px}
.hw-frame{position:relative;padding:14px;border-radius:26px;background:linear-gradient(180deg,#141a4a,#070a22);border:1px solid rgba(255,201,77,.5);box-shadow:0 0 30px rgba(255,201,77,.25),inset 0 0 20px rgba(255,201,77,.15)}
.hw-bulbs{position:absolute;inset:3px;border-radius:23px;pointer-events:none;
  background:radial-gradient(circle,#FFF4C9 0 2.5px,rgba(255,201,77,.55) 3.5px,transparent 6px) 0 0/18px 18px;
  -webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);padding:9px;
  animation:chase 1.1s steps(2) infinite}
.hw-frame.spinning .hw-bulbs{animation-duration:.22s;filter:hue-rotate(160deg) saturate(1.6)}
@keyframes chase{to{background-position:18px 0}}
.hw-stage{position:relative;height:360px;border-radius:18px;overflow:hidden;perspective:900px;perspective-origin:50% 50%;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none;
  background:radial-gradient(80% 60% at 50% 50%,#1b2266,#060818);outline:none}
.hw-stage:active{cursor:grabbing}
.hw-stage:focus-visible{box-shadow:0 0 0 3px var(--cyan)}
.hw-drum{position:absolute;left:0;right:0;top:50%;height:0;transform-style:preserve-3d;will-change:transform}
.hw-slab{position:absolute;left:12px;right:30px;top:-43px;height:86px;display:flex;align-items:center;gap:12px;padding:0 14px 0 10px;border-radius:14px;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;color:#fff;border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(100deg,rgba(62,240,255,.35),rgba(20,30,90,.92) 45%);box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
.hw-slab.t-silver{background:linear-gradient(100deg,rgba(220,232,255,.42),rgba(26,32,80,.92) 45%)}
.hw-slab.t-gold{background:linear-gradient(100deg,rgba(255,201,77,.6),rgba(60,34,10,.92) 48%)}
.hw-slab.t-platinum{background:linear-gradient(100deg,rgba(255,79,216,.55),rgba(123,92,255,.4) 30%,rgba(24,12,60,.94) 55%)}
.hw-slab:nth-child(even)::before{content:"";position:absolute;inset:0;border-radius:inherit;background:rgba(255,255,255,.035);pointer-events:none}
.hw-face{flex:none;width:66px;height:66px;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 50% 35%,#2f3a9a,#0a0e2a);border:2px solid rgba(255,255,255,.6)}
.hw-face img{width:100%;height:100%;object-fit:cover;object-position:50% 15%}
.hw-txt{flex:1;min-width:0;display:grid}
.hw-txt b{font-family:"Orbitron",var(--display);font-weight:900;font-size:22px;letter-spacing:2px;text-transform:uppercase;line-height:1.05;text-shadow:0 2px 0 rgba(0,0,0,.4)}
.hw-txt small{font-weight:800;font-size:13px;color:#d5e2ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hw-tier{flex:none;font-family:"Orbitron",var(--display);font-weight:700;font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;padding:4px 9px;border-radius:999px;background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.35)}
.hw-slab.locked .hw-face img{filter:grayscale(1) brightness(.55)}
.hw-slab.locked .hw-txt b{color:#b9c2e0}
.hw-slab.center{border-color:#fff}
.hw-slab.center .hw-face{border-color:var(--honey2);box-shadow:0 0 16px var(--honey2)}
.hw-slab.pop .hw-face{animation:facePop .6s cubic-bezier(.2,1.6,.3,1)}
@keyframes facePop{40%{transform:scale(1.25)}}
.hw-window{position:absolute;left:4px;right:20px;top:50%;height:96px;margin-top:-48px;border-radius:18px;pointer-events:none;
  border:2px solid var(--cyan);box-shadow:0 0 22px rgba(62,240,255,.7),inset 0 0 22px rgba(62,240,255,.35)}
.hw-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#060818 0%,rgba(6,8,24,.55) 22%,transparent 38%,transparent 62%,rgba(6,8,24,.55) 78%,#060818 100%)}
.hw-flapper{position:absolute;right:0;top:50%;width:44px;height:40px;margin-top:-20px;z-index:4;pointer-events:none;transform-origin:100% 50%}
.hw-flapper span{position:absolute;right:4px;top:4px;width:0;height:0;border-top:16px solid transparent;border-bottom:16px solid transparent;border-right:34px solid var(--honey2);filter:drop-shadow(0 0 8px var(--honey))}
.hw-flapper.kick{animation:flap .16s ease-out}
@keyframes flap{30%{transform:rotate(-22deg)}100%{transform:none}}
.hw-controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:14px}
.hw-nudge{width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:rgba(62,240,255,.08);color:var(--cyan);font-size:18px;box-shadow:0 0 14px rgba(62,240,255,.2)}
.hw-nudge:hover{background:rgba(62,240,255,.2)}
.hw-spin{flex:1;max-width:280px;min-height:64px;border:0;border-radius:999px;display:grid;justify-items:center;line-height:1;color:#1a0b00;
  background:linear-gradient(180deg,#FFF0B0,var(--honey2) 40%,#FF8A00);box-shadow:0 0 0 2px rgba(255,255,255,.5) inset,0 7px 0 #9a4f00,0 0 34px rgba(255,170,40,.7);animation:spinPulse 1.6s ease-in-out infinite}
.hw-spin span{font-family:"Orbitron",var(--display);font-weight:900;font-size:26px;letter-spacing:6px}
.hw-spin small{font-family:"Orbitron",var(--display);font-weight:700;font-size:10.5px;letter-spacing:2px;text-transform:uppercase;margin-top:3px}
.hw-spin:active{transform:translateY(5px);box-shadow:0 0 0 2px rgba(255,255,255,.5) inset,0 2px 0 #9a4f00,0 0 24px rgba(255,170,40,.6)}
@keyframes spinPulse{50%{box-shadow:0 0 0 2px rgba(255,255,255,.5) inset,0 7px 0 #9a4f00,0 0 54px rgba(255,170,40,1)}}
.hw-hint{text-align:center;font-size:13.5px;font-weight:700;color:var(--ink2);margin-top:10px}
@media (max-width:560px){.hw-stage{height:320px}.hw-txt b{font-size:18px;letter-spacing:1px}.hw-face{width:56px;height:56px}.hw-tier{display:none}.hw-slab{right:26px}}

/* ---------- Spiral rows ---------- */
.fitrow.spiral{gap:6px;padding:26px calc(50% - 52px) 34px;scroll-snap-type:x proximity;scrollbar-width:none;margin:0 -4px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.fitrow.spiral::-webkit-scrollbar{display:none}
.fitrow.spiral.dragging{scroll-snap-type:none;cursor:grabbing}
.fitrow.spiral>*{scroll-snap-align:center;transform-origin:50% 65%;will-change:transform,opacity;transition:box-shadow .25s,border-color .25s}
.fitrow.spiral>.focus{border-color:var(--cyan);box-shadow:0 0 0 1px var(--cyan),0 0 26px rgba(62,240,255,.55)}
.fitrow.spiral>.focus.on{border-color:var(--honey2);box-shadow:0 0 0 2px var(--honey2),0 0 30px rgba(255,201,77,.7)}
.fitrow.spiral>.spiral-in{animation:spiralIn .75s cubic-bezier(.2,1.2,.3,1) backwards}
@keyframes spiralIn{from{rotate:-320deg;scale:.05;translate:0 -40px;opacity:0}to{rotate:0deg;scale:1;translate:0 0;opacity:1}}

/* ---------- Confetti ---------- */
.st-confetti{position:fixed;inset:0;pointer-events:none;z-index:9999}
.st-confetti i{position:absolute;left:0;top:0;width:9px;height:14px;border-radius:2px}
@media (prefers-reduced-motion:reduce){.sc-hero,.sc-rings i,.sc-grid,.sc-beam,.hw-bulbs,.hw-spin{animation:none!important}}

/* ---------- HYPE LIGHTS: marquee bulbs ---------- */
.bulbs{position:absolute;inset:0;pointer-events:none;z-index:8}
.bulbs i{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--c);
  box-shadow:0 0 4px #fff,0 0 10px var(--c),0 0 22px var(--c);animation:bulb 1.15s ease-in-out infinite;animation-delay:var(--d)}
@keyframes bulb{0%,100%{opacity:1;transform:scale(1.15)}50%{opacity:.18;transform:scale(.75);box-shadow:0 0 2px var(--c)}}
.spinning>.bulbs i{animation:bulbStrobe .26s steps(2) infinite;animation-delay:var(--d)}
@keyframes bulbStrobe{0%{opacity:1;filter:hue-rotate(0deg);transform:scale(1.3)}100%{opacity:.25;filter:hue-rotate(200deg);transform:scale(.8)}}
.win>.bulbs i{animation:bulbWin .2s linear 8 alternate;animation-delay:0s}
@keyframes bulbWin{from{opacity:1;transform:scale(1.6);background:#fff}to{opacity:.2;transform:scale(.8)}}
.hw-bulbs{display:none}
.hw-frame{padding:20px;box-shadow:0 0 40px rgba(255,201,77,.45),0 0 90px rgba(255,79,216,.18),inset 0 0 26px rgba(255,201,77,.25)}
.hw-frame.win{animation:frameWin .25s 6 alternate}
@keyframes frameWin{to{box-shadow:0 0 80px rgba(255,230,140,1),0 0 160px rgba(255,79,216,.6),inset 0 0 40px rgba(255,255,255,.4)}}
.hw-frame::after{content:"";position:absolute;inset:-2px;border-radius:28px;pointer-events:none;z-index:9;
  background:conic-gradient(from var(--ang,0deg),transparent 0 70%,rgba(255,255,255,.75) 78%,transparent 86%);
  -webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);padding:3px;animation:sweep 2.6s linear infinite}
.hw-frame.spinning::after{animation-duration:.5s}
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes sweep{to{--ang:360deg}}
.hw-window{animation:windowPulse 1.4s ease-in-out infinite}
@keyframes windowPulse{50%{box-shadow:0 0 40px rgba(62,240,255,1),inset 0 0 30px rgba(62,240,255,.55)}}
.hw-flapper span{border-right-color:#FFE680;filter:drop-shadow(0 0 10px var(--honey)) drop-shadow(0 0 22px #fff)}
.hw-spin{position:relative;overflow:hidden}
.hw-spin::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.7) 48%,transparent 62%);transform:translateX(-120%);animation:shine 2.2s ease-in-out infinite}
@keyframes shine{60%,100%{transform:translateX(120%)}}
/* the showcase frame: a lit marquee podium with sweeping spotlights */
.sc-frame{position:relative;padding:16px 16px 14px;border-radius:30px;background:linear-gradient(180deg,rgba(20,26,74,.6),rgba(6,8,24,.7));border:1px solid rgba(255,201,77,.45);
  box-shadow:0 0 40px rgba(255,201,77,.3),0 0 90px rgba(62,240,255,.15);width:100%;isolation:isolate}
.sc-frame.win{animation:frameWin .25s 6 alternate}
.sc-frame::before{content:"";position:absolute;left:50%;top:-30%;width:160%;height:130%;transform:translateX(-50%);z-index:-1;pointer-events:none;opacity:.55;
  background:conic-gradient(from 180deg at 50% 0%,transparent 0 160deg,rgba(62,240,255,.35) 170deg,transparent 180deg,rgba(255,79,216,.3) 190deg,transparent 200deg 360deg);animation:lights 5s ease-in-out infinite alternate}
@keyframes lights{from{transform:translateX(-50%) rotate(-14deg)}to{transform:translateX(-50%) rotate(14deg)}}
.sc-frame .showcase{margin-top:0}
.fitrow.spiral>.focus{animation:focusGlow 1.2s ease-in-out infinite}
@keyframes focusGlow{50%{box-shadow:0 0 0 2px var(--cyan),0 0 40px rgba(62,240,255,.9)}}
body.neo label.f{text-shadow:0 0 10px rgba(62,240,255,.35)}

/* ---------- The Trapdoor ---------- */
.trapdoor{display:flex;align-items:center;gap:14px;width:100%;margin:14px 0;padding:12px 14px;border-radius:20px;cursor:pointer;color:#fff;text-align:left;
  background:repeating-linear-gradient(135deg,rgba(255,201,77,.16) 0 12px,rgba(0,0,0,.25) 12px 24px),linear-gradient(180deg,#141a46,#070a22);
  border:1px solid rgba(255,201,77,.6);box-shadow:0 0 22px rgba(255,201,77,.25),inset 0 0 18px rgba(0,0,0,.6);transition:transform .15s}
.trapdoor:hover{transform:translateY(-2px);box-shadow:0 0 34px rgba(255,201,77,.5),inset 0 0 18px rgba(0,0,0,.6)}
.td-hatch{position:relative;flex:none;width:74px;height:74px;border-radius:50%;overflow:hidden;background:radial-gradient(circle,#fff 0,#3EF0FF 25%,#0a0e2a 70%);box-shadow:0 0 0 4px #2a3170,0 0 0 6px #FFC94D,0 0 24px rgba(62,240,255,.7);perspective:300px}
.td-glow{position:absolute;inset:0;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(62,240,255,.6) 40%,transparent 70%);animation:tdGlow 1.6s ease-in-out infinite}
@keyframes tdGlow{50%{opacity:.4}}
.td-l,.td-r{position:absolute;top:0;bottom:0;width:50%;background:repeating-linear-gradient(90deg,#4a5288 0 3px,#323a72 3px 9px);transition:transform .6s cubic-bezier(.5,-0.3,.3,1.4)}
.td-l{left:0;transform-origin:left center;border-right:2px solid #11163d}.td-r{right:0;transform-origin:right center;border-left:2px solid #11163d}
.td-bolt{position:absolute;inset:0;display:grid;place-items:center;font-size:24px;color:#FFC94D;text-shadow:0 0 8px #000;z-index:2;transition:opacity .2s}
.trapdoor:hover .td-l{transform:rotateY(-25deg)}.trapdoor:hover .td-r{transform:rotateY(25deg)}
.trapdoor.open .td-l{transform:rotateY(-100deg)}.trapdoor.open .td-r{transform:rotateY(100deg)}.trapdoor.open .td-bolt{opacity:0}
.trapdoor.open .td-hatch{animation:hatchBoom .8s ease-out}
@keyframes hatchBoom{40%{box-shadow:0 0 0 4px #2a3170,0 0 0 6px #fff,0 0 90px #3EF0FF,0 0 160px #fff}}
.td-txt b{display:block;font-family:"Orbitron",var(--display);font-weight:900;letter-spacing:4px;font-size:18px;color:#FFD84D;text-shadow:0 0 12px rgba(255,201,77,.7)}
.td-txt small{font-weight:700;font-size:13.5px;color:#cdd8ff}
.side .trapdoor{margin-top:0}

/* ---------- The Study Guide Vault: a spiral notebook in HD ---------- */
.vaultwrap .book.vault{padding-bottom:30px}
.vaultrow .vcard{width:118px}.vaultrow .vcard .fpic{width:96px;height:120px}.vaultrow .vcard .fpic img{width:100%;height:100%;object-fit:cover;object-position:top}
.sb{position:relative;margin:10px auto 0;max-width:1000px;padding:46px 22px 18px;border-radius:30px;background:linear-gradient(180deg,#151b4c,#070a22);border:1px solid rgba(255,201,77,.45);box-shadow:0 0 40px rgba(255,201,77,.25),0 0 90px rgba(62,240,255,.12)}
.sb-coil{position:absolute;left:44px;right:44px;top:14px;height:44px;display:flex;justify-content:space-between;z-index:6;pointer-events:none}
.sb-coil i{width:14px;height:44px;border-radius:8px;background:linear-gradient(90deg,#8d94b8,#fff 40%,#6b7299 70%,#3d4470);box-shadow:0 2px 4px rgba(0,0,0,.6),0 0 8px rgba(62,240,255,.35)}
.sb-stack{position:relative;perspective:1800px;perspective-origin:50% 0%}
.sb-page{position:relative;border-radius:6px 6px 14px 14px;overflow:hidden;background:#fff;color:#1a1530;box-shadow:0 18px 40px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.2);display:flex;flex-direction:column}
.sb-page::before{content:"";position:absolute;left:0;right:0;top:0;height:30px;z-index:3;pointer-events:none;background:radial-gradient(circle at 50% 50%,#070a22 0 6px,transparent 7px) 26px 12px/calc((100% - 52px) / 21) 30px repeat-x}
.sb-leaf{position:absolute;inset:0;transform-origin:50% 0;backface-visibility:hidden;z-index:4}
.sb-leaf.out{animation:leafOut .75s cubic-bezier(.45,.05,.3,1) forwards}
.sb-leaf.in{animation:leafIn .75s cubic-bezier(.45,.05,.3,1) forwards}
@keyframes leafOut{0%{transform:rotateX(0)}100%{transform:rotateX(-176deg);filter:brightness(.4)}}
@keyframes leafIn{0%{transform:rotateX(-176deg);filter:brightness(.4)}100%{transform:rotateX(0)}}
.sb-img{position:relative;flex:none;aspect-ratio:4/3;display:block;width:100%;border:0;padding:0;cursor:zoom-in;background-color:#fff;background-repeat:no-repeat;background-size:100% auto}
.sb-lens{display:none;position:absolute;width:180px;height:180px;margin:-90px 0 0 -90px;border-radius:50%;pointer-events:none;background-repeat:no-repeat;border:3px solid #FFC94D;box-shadow:0 0 0 3px #070a22,0 0 30px rgba(62,240,255,.8);z-index:5}
.sb-tag{position:absolute;right:12px;bottom:12px;background:rgba(7,10,34,.85);color:#fff;font-weight:800;font-size:13px;border-radius:999px;padding:6px 12px;border:1px solid var(--cyan)}
.sb-foot{display:flex;justify-content:space-between;padding:6px 14px;font-family:"Orbitron",var(--display);font-size:11px;letter-spacing:1.5px;font-weight:700;background:#0b0f2c;color:#9fdcff}
.sb-cover{flex:none;aspect-ratio:4/3;display:grid;place-content:center;justify-items:center;text-align:center;gap:6px;padding:40px 30px 20px;color:#fff;
  background:radial-gradient(70% 60% at 50% 40%,rgba(62,240,255,.3),transparent 70%),linear-gradient(160deg,#1b2266,#070a22)}
.sb-holo{width:120px;height:120px;display:grid;place-items:center;font-size:64px;filter:drop-shadow(0 0 20px rgba(62,240,255,.8));animation:hover2 3s ease-in-out infinite}
.sb-holo img{width:100%;height:100%;object-fit:contain}
@keyframes hover2{50%{transform:translateY(-8px)}}
.sb-code{font-family:"Orbitron",var(--display);font-weight:900;letter-spacing:4px;color:var(--cyan);font-size:14px}
.sb-cover h2{font-family:"Orbitron",var(--display)!important;font-weight:900;font-size:clamp(20px,3vw,34px);letter-spacing:1px;background:linear-gradient(180deg,#fff,#9DEBFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.sb-fac{font-weight:800;color:#FFD84D;margin:0}
.sb-ican{max-width:560px;font-weight:700;color:#dbe6ff;font-size:clamp(14px,1.8vw,18px)}
.sb-ican b{color:#FFD84D;font-family:"Orbitron",var(--display);letter-spacing:1px;margin-right:6px}
.sb-hint{font-family:"Orbitron",var(--display);font-size:11px;letter-spacing:2px;color:#9fb3e0;animation:tdGlow 1.6s infinite}
.sb-vocab{flex:none;aspect-ratio:4/3;overflow:auto;padding:40px 22px 14px;background:linear-gradient(180deg,#fffdf6,#f1f4ff)}
.sb-vocab h3{font-family:"Orbitron",var(--display)!important;font-weight:900;color:#2B2770;letter-spacing:2px;margin-bottom:10px}
.sb-vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.sb-vgrid div{background:#fff;border:2px solid #d9def5;border-radius:12px;padding:8px 10px;font-size:14px;line-height:1.35;color:#2b2550}
.sb-vgrid b{display:block;color:#6B3FA0;font-size:16px}
.sb-lock{flex:none;aspect-ratio:4/3;display:grid;place-content:center;justify-items:center;text-align:center;gap:8px;padding:40px 30px;color:#fff;background:repeating-linear-gradient(135deg,rgba(255,79,216,.08) 0 14px,transparent 14px 28px),linear-gradient(160deg,#1b1240,#070a22)}
.sb-lockicon{font-size:56px;filter:drop-shadow(0 0 18px rgba(255,79,216,.8))}
.sb-lock h3{color:#ffd6f6!important}.sb-lock p{max-width:440px;color:#d9d0ff}
.sb-bar{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:14px}
.sb-dots{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.sb-dots button{width:14px;height:14px;border-radius:50%;border:1px solid var(--cyan);background:transparent;padding:0}
.sb-dots button.on{background:var(--cyan);box-shadow:0 0 12px var(--cyan)}
.sb-tools{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:12px}
@media (max-width:640px){.sb{padding:40px 10px 14px}.sb-coil{left:22px;right:22px}.sb-coil i{width:9px}.sb-tag{font-size:11px}}

/* ---------- Launch Pad button (top bar) ---------- */
.launchpad{display:inline-flex;align-items:center;gap:6px;margin-left:6px;padding:8px 14px;border-radius:999px;border:1px solid #FFD84D;cursor:pointer;color:#1a1000;
  background:linear-gradient(180deg,#FFF0B0,#FFC94D 45%,#FF8A00);box-shadow:0 0 18px rgba(255,180,40,.6),inset 0 0 0 1px rgba(255,255,255,.5);font-family:Orbitron,"Chakra Petch",sans-serif;font-weight:900;font-size:12.5px;letter-spacing:1.5px;text-transform:uppercase;animation:lpGlow 2s ease-in-out infinite}
.launchpad span{font-size:16px}
@keyframes lpGlow{50%{box-shadow:0 0 32px rgba(255,180,40,1),inset 0 0 0 1px rgba(255,255,255,.5)}}
@media (max-width:640px){.launchpad{padding:7px 10px;font-size:11px;letter-spacing:.5px}}
@media (max-width:480px){.launchpad{flex-direction:column;gap:0;padding:4px 9px;font-size:8.5px;letter-spacing:.5px;line-height:1.05;margin-left:2px}.launchpad span{font-size:14px}.top .chip{padding-right:8px}.top .iconbtn{width:34px;height:34px}}
/* ---------- Voice Lab ---------- */
.voicelab{margin:22px 0 4px;padding:14px;border-radius:18px;border:1px solid rgba(62,240,255,.45);background:linear-gradient(160deg,rgba(62,240,255,.1),rgba(10,14,42,.85));box-shadow:0 0 22px rgba(62,240,255,.2);display:grid;gap:10px}
.vl-head{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center}
.vl-ico{grid-row:span 2;font-size:28px;filter:drop-shadow(0 0 10px rgba(62,240,255,.8))}
.vl-head b{font-family:Orbitron,"Chakra Petch",sans-serif;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;font-size:14px;color:#fff}
.vl-head small{color:var(--ink2);font-weight:700;font-size:13px}
.vl-row{display:grid;grid-template-columns:62px minmax(0,1fr) auto;align-items:center;gap:10px;margin:0}
.vl-row>span:first-child{font-family:Orbitron,sans-serif;font-weight:700;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#cfe3ff}
.vl-voice{grid-column:2/4;width:100%;max-width:100%;min-width:0;min-height:44px;padding:8px 10px;border-radius:12px;border:1px solid rgba(62,240,255,.5);background:#0a0e2a;color:#fff;font-weight:700;font-size:15px}
.vl-speed{display:flex;min-width:0;align-items:center;gap:8px;font-size:20px}
.vl-rate{flex:1;min-width:0;width:100%;accent-color:#FFC94D;height:28px}
.vl-val{font-family:Orbitron,sans-serif;color:#FFD84D;font-size:14px;min-width:52px;text-align:right}
.vl-test{justify-self:start}
.vault-foot{max-width:1000px;margin:18px auto 0;display:grid;gap:16px;justify-items:center}
.vault-foot .voicelab{width:100%;margin:0}
.launchback{width:min(100%,520px)}

body.neo .book.spread{overflow:clip}
#scwrap{width:100%}
@media (min-width:821px){body.neo .book.spread>.neo-stage{position:sticky;top:70px;align-self:start}}
body.neo{color:var(--ink)}
body.neo .top,body.neo .chip,body.neo .bnav{color:#EEF4FF}
body.neo .cnt .el,body.neo .formula,body.neo .eq,body.neo .flip .front,body.neo .sortcard{color:#fff;text-shadow:0 0 14px rgba(62,240,255,.45)}
body.neo [style*="background:#fff;"],body.neo [style*="background:#fff\""]{background:var(--glassWarm)!important}
body.neo [style*="color:var(--night)"]{color:#fff!important}
body.neo .hex svg{filter:drop-shadow(0 0 8px rgba(62,240,255,.45))}
body.neo .hex:hover svg{filter:drop-shadow(0 0 16px rgba(62,240,255,.9))}
body.neo .hex .lbl,body.neo .hex .st{color:#EEF4FF}
@media (max-width:640px){body.neo .top .hide-sm{display:none!important}}

/* Launch Pad button hides while you stand on the Launch Pad */
body.on-lp .top .launchpad{display:none}