/* =========================================================
   Beyond Science | Arcade styles (Bee Blaster, Hive Dash, and
   the seven new arcade Missions plus Boss Rush)
   ========================================================= */
.arcadepage{position:relative}
.arcadepage .kicker{margin-top:4px}
.hud{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 8px}
.hud span{flex:1 1 90px;text-align:center;font-family:Orbitron,"Chakra Petch",sans-serif;font-weight:900;font-size:15px;letter-spacing:1px;color:#fff;
  padding:8px 10px;border-radius:12px;background:linear-gradient(180deg,rgba(62,240,255,.14),rgba(10,14,42,.9));border:1px solid rgba(62,240,255,.45);box-shadow:0 0 14px rgba(62,240,255,.25),inset 0 0 10px rgba(62,240,255,.12);text-shadow:0 0 8px rgba(62,240,255,.6)}
.gameclue{display:flex;align-items:center;gap:10px;min-height:64px;padding:10px 12px;border-radius:16px;margin-bottom:10px;
  background:linear-gradient(90deg,rgba(255,201,77,.16),rgba(10,14,42,.92) 40%);border:1px solid rgba(255,201,77,.6);box-shadow:0 0 20px rgba(255,201,77,.2)}
.gameclue .cl{flex:none;font-family:Orbitron,"Chakra Petch",sans-serif;font-weight:900;font-size:13px;letter-spacing:2px;color:#1a1000;background:linear-gradient(180deg,#FFE08A,#F5A623);border-radius:8px;padding:6px 10px}
.gameclue #clueT{flex:1;min-width:0;font-family:"Chakra Petch",Fredoka,sans-serif;font-weight:700;font-size:clamp(17px,2.2vw,22px);line-height:1.3;color:#fff}
.gameclue .hear{float:none;margin:0;flex:none;width:44px;height:44px;border-radius:50%;border:1px solid rgba(62,240,255,.6);background:rgba(62,240,255,.12);color:#fff}
.stage{position:relative;height:min(62vh,520px);min-height:340px;border-radius:20px;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;
  border:1px solid rgba(62,240,255,.5);box-shadow:0 0 30px rgba(62,240,255,.25),0 0 80px rgba(123,92,255,.15);background:#05071a}
.stage canvas{position:absolute;inset:0;display:block}
.stage.dom canvas{pointer-events:none;z-index:3}
.tip{text-align:center;font-size:14px;font-weight:700;color:var(--ink2,#a9b8dd);margin:10px 0 0}
/* PLAY card + countdown + results */
.startcard{position:absolute;inset:0;z-index:10;display:grid;place-content:center;justify-items:center;gap:12px;text-align:center;padding:20px;
  background:radial-gradient(70% 60% at 50% 45%,rgba(62,240,255,.2),transparent 70%),rgba(4,5,15,.82);backdrop-filter:blur(3px);overflow:auto}
.startcard .startart{width:min(170px,40vw);height:auto;filter:drop-shadow(0 0 24px rgba(62,240,255,.7));animation:hoverA 2.6s ease-in-out infinite}
@keyframes hoverA{50%{transform:translateY(-10px) rotate(-2deg)}}
.startcard h2{font-family:Orbitron,"Chakra Petch",sans-serif!important;font-weight:900;font-size:clamp(28px,5vw,48px);letter-spacing:4px;color:#fff!important;background:none!important;-webkit-text-fill-color:#fff;
  text-shadow:0 0 18px rgba(62,240,255,.9),0 0 40px rgba(255,79,216,.6);animation:titlePulse 1.4s ease-in-out infinite}
@keyframes titlePulse{50%{text-shadow:0 0 28px rgba(62,240,255,1),0 0 70px rgba(255,79,216,.9)}}
.startcard .tips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.startcard .tips span{font-weight:800;font-size:14px;color:#fff;background:rgba(62,240,255,.1);border:1px solid rgba(62,240,255,.5);border-radius:999px;padding:6px 12px}
.btn.mega{font-size:22px!important;padding:16px 38px!important;min-height:62px;border-radius:999px!important;animation:megaPulse 1.3s ease-in-out infinite}
@keyframes megaPulse{50%{box-shadow:0 0 0 1px rgba(255,220,140,.6) inset,0 6px 0 #9a5a00,0 0 50px rgba(255,180,40,.95)}}
.count{font-family:Orbitron,sans-serif;font-weight:900;font-size:clamp(90px,18vw,170px);color:#fff;text-shadow:0 0 30px #3EF0FF,0 0 70px #FF4FD8;animation:countIn .6s cubic-bezier(.2,1.6,.3,1)}
@keyframes countIn{from{transform:scale(2.6);opacity:0}to{transform:scale(1);opacity:1}}
.results{background:radial-gradient(70% 60% at 50% 40%,rgba(255,201,77,.25),transparent 70%),rgba(4,5,15,.9)}
.results .resart{width:min(320px,70vw);border-radius:16px;border:2px solid rgba(255,201,77,.7);box-shadow:0 0 30px rgba(255,201,77,.45)}
.results p{color:#dbe6ff;font-weight:700;max-width:520px}
.bigstats{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.bigstats div{min-width:110px;padding:10px 14px;border-radius:14px;background:rgba(62,240,255,.08);border:1px solid rgba(62,240,255,.45);box-shadow:0 0 14px rgba(62,240,255,.2)}
.bigstats b{display:block;font-family:Orbitron,sans-serif;font-weight:900;font-size:26px;color:#FFD84D;text-shadow:0 0 12px rgba(255,201,77,.7)}
.bigstats span{font-size:12.5px;font-weight:800;color:#bcd0ff;text-transform:uppercase;letter-spacing:1px}
.stamp{font-family:Orbitron,sans-serif;font-weight:900;font-size:clamp(26px,5vw,42px);letter-spacing:5px;color:#5CFFB0;border:4px solid #5CFFB0;border-radius:12px;padding:6px 18px;transform:rotate(-6deg);text-shadow:0 0 14px #5CFFB0;box-shadow:0 0 24px rgba(92,255,176,.5);animation:stampIn .5s cubic-bezier(.2,1.6,.3,1)}
@keyframes stampIn{from{transform:rotate(-6deg) scale(3);opacity:0}}
.watch{background:rgba(255,201,77,.12)!important;border:1px solid rgba(255,201,77,.5);border-radius:12px;padding:8px 12px;color:#ffe6a8!important}
/* Hive Dash lanes + clues */
.lanes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.lanes button{min-height:64px;border-radius:14px;border:1px solid rgba(62,240,255,.45);background:rgba(10,14,42,.9);color:#fff;font-family:"Chakra Petch",sans-serif;font-weight:700;font-size:15px;line-height:1.25;padding:8px}
.lanes button.on{border-color:#FFD84D;background:linear-gradient(180deg,rgba(255,201,77,.3),rgba(10,14,42,.9));box-shadow:0 0 20px rgba(255,201,77,.5)}
.cluebar{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.cluebar span{font-size:13px;font-weight:700;color:#cfefff;background:rgba(62,240,255,.08);border:1px solid rgba(62,240,255,.35);border-radius:10px;padding:5px 9px}
/* Sort Storm portals */
.sbins{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:8px;margin-top:10px}
.sbins button{min-height:62px;border-radius:14px;border:2px solid var(--c);background:rgba(10,14,42,.9);color:#fff;font-family:"Chakra Petch",sans-serif;font-weight:700;font-size:14px;line-height:1.2;padding:6px;box-shadow:0 0 12px color-mix(in srgb,var(--c) 40%,transparent)}
.sbins button.on{background:color-mix(in srgb,var(--c) 30%,#0a0e2a);box-shadow:0 0 26px var(--c);transform:translateY(-2px)}
@media (max-width:560px){.sbins{grid-template-columns:repeat(min(var(--n),3),minmax(0,1fr))}.sbins button{font-size:12.5px;min-height:54px}}
/* Atom Smash tray */
.tray{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:10px}
.tray .tr{display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:rgba(10,14,42,.9);border:1px solid rgba(62,240,255,.4)}
.tray .tr.full{border-color:#5CFFB0;box-shadow:0 0 16px rgba(92,255,176,.5)}
.tray .ball{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-family:Orbitron,sans-serif;font-weight:900;font-size:12px;box-shadow:0 0 10px rgba(255,255,255,.4)}
.tray .dots{display:flex;flex-wrap:wrap;gap:3px;max-width:150px}
.tray .dots i{width:9px;height:9px;border-radius:50%;border:1px solid rgba(255,255,255,.5)}
.tray .dots i.on{background:var(--c);box-shadow:0 0 6px var(--c)}
.tray b{font-family:Orbitron,sans-serif;font-size:13px;color:#fff}
/* Balance Blitz */
.eqrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:10px}
.eqrow .pod{display:grid;grid-template-columns:auto;justify-items:center;gap:2px;padding:6px 10px;border-radius:14px;background:rgba(10,14,42,.9);border:1px solid rgba(62,240,255,.5)}
.eqrow .pod.r{border-color:rgba(255,79,216,.6)}
.eqrow .pod button{width:42px;height:32px;border-radius:10px;border:1px solid rgba(255,255,255,.3);background:rgba(62,240,255,.12);color:#fff;font-size:18px;font-weight:900}
.eqrow .pod b{font-family:Orbitron,sans-serif;font-weight:900;font-size:26px;color:#FFD84D;text-shadow:0 0 12px rgba(255,201,77,.7)}
.eqrow .pod span{font-family:"Chakra Petch",sans-serif;font-weight:700;font-size:20px;color:#fff}
.eqrow .arrow,.eqrow .plus{font-family:Orbitron,sans-serif;font-weight:900;font-size:24px;color:#9fdcff}
.tally{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:8px}
.tally div{display:flex;align-items:center;gap:8px;padding:5px 12px;border-radius:999px;border:1px solid #ff4d6a;background:rgba(255,77,106,.1);font-family:Orbitron,sans-serif;font-weight:700;color:#fff;font-size:14px}
.tally div.ok{border-color:#5CFFB0;background:rgba(92,255,176,.12);box-shadow:0 0 12px rgba(92,255,176,.4)}
.tally b{color:#FFD84D}
/* Laser Link */
.stage.dom{height:auto;min-height:360px;background:radial-gradient(80% 70% at 50% 50%,#141b52,#05071a)}
.lk{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,14vw,160px);padding:18px 14px}
.lkcol{display:grid;gap:12px;align-content:center}
.node{position:relative;min-height:62px;padding:10px 14px;border-radius:14px;border:2px solid #3EF0FF;background:rgba(10,14,42,.94);color:#fff;font-family:"Chakra Petch",sans-serif;font-weight:700;font-size:16px;line-height:1.25;
  box-shadow:0 0 14px rgba(62,240,255,.35);animation:nodeIn .5s cubic-bezier(.2,1.4,.3,1) backwards;transition:transform .15s,opacity .3s}
.node.R{border-color:#FF4FD8;box-shadow:0 0 14px rgba(255,79,216,.35)}
.node::after{content:"";position:absolute;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:currentColor;color:#3EF0FF;box-shadow:0 0 10px currentColor}
.node.L::after{right:-8px}.node.R::after{left:-8px;color:#FF4FD8}
.node:hover{transform:scale(1.03)}
.node.sel{border-color:#FFD84D;box-shadow:0 0 0 2px #FFD84D,0 0 30px rgba(255,201,77,.8);transform:scale(1.05)}
.node.gone{opacity:0;transform:scale(.6) rotate(8deg);pointer-events:none}
.node.shake{animation:nodeShake .4s}.node.hint{animation:nodeHint .35s 4 alternate}
@keyframes nodeIn{from{opacity:0;transform:translateY(20px) scale(.7) rotate(-6deg)}}
@keyframes nodeShake{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
@keyframes nodeHint{to{box-shadow:0 0 0 3px #5CFFB0,0 0 40px #5CFFB0}}
/* Stack Attack */
.stage.stack.dom,.arcadepage.stack .stage{height:min(62vh,500px)}
.blocks{position:absolute;left:0;top:0;width:66%;height:100%;z-index:4}
.fblock{position:absolute;left:0;top:0;max-width:200px;padding:10px 14px;border-radius:12px;border:2px solid #5CFFB0;background:rgba(10,30,30,.92);color:#fff;font-family:"Chakra Petch",sans-serif;font-weight:700;font-size:15px;line-height:1.2;box-shadow:0 0 16px rgba(92,255,176,.45);will-change:transform}
.fblock.bad{border-color:#ff4d6a;box-shadow:0 0 26px #ff4d6a;background:rgba(80,10,25,.94)}
.tower{position:absolute;right:0;top:0;bottom:0;width:34%;z-index:4;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;padding:10px}
.tblock{width:var(--w);min-width:70px;max-width:100%;text-align:center;padding:6px 8px;border-radius:8px;font-family:"Chakra Petch",sans-serif;font-weight:700;font-size:12.5px;color:#05071a;background:var(--c);box-shadow:0 0 16px var(--c);animation:drop .45s cubic-bezier(.3,1.5,.4,1)}
@keyframes drop{from{transform:translateY(-140px) scale(1.2);opacity:0}}
/* Truth Shield */
.tf{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.tf button{min-height:70px;border-radius:16px;font-family:Orbitron,sans-serif;font-weight:900;font-size:clamp(15px,2.2vw,20px);letter-spacing:1.5px;color:#fff;cursor:pointer}
.tf button small{display:block;font-family:"Chakra Petch",sans-serif;font-size:12px;letter-spacing:0;opacity:.75}
.tf .fake{border:2px solid #FF4FD8;background:linear-gradient(180deg,rgba(255,79,216,.3),rgba(30,8,48,.95));box-shadow:0 0 22px rgba(255,79,216,.45)}
.tf .true{border:2px solid #5CFFB0;background:linear-gradient(180deg,rgba(92,255,176,.3),rgba(8,40,30,.95));box-shadow:0 0 22px rgba(92,255,176,.45)}
.tf button:active{transform:scale(.97)}
/* Boss Rush meter */
.bossbar{margin-top:10px;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,77,106,.6);background:rgba(40,8,20,.7);color:#fff;font-weight:800;box-shadow:0 0 20px rgba(255,77,106,.3)}
.bossbar .meter{height:16px;margin:6px 0;background:rgba(255,255,255,.1)}
.bossbar .meter i{background:linear-gradient(90deg,#ff4d5e,#ffb84d);box-shadow:0 0 12px #ff4d5e}
.bossbar small{color:#ffc9d2;font-weight:700}
/* Mission doors light up */
.door .di img{width:100%;height:100%;object-fit:contain}
@media (max-width:560px){.stage{height:min(56vh,440px);min-height:300px}.hud span{font-size:12.5px;padding:6px}.gameclue{min-height:54px}.gameclue #clueT{font-size:16px}.lk{gap:30px;padding:12px 8px}.node{font-size:13.5px;min-height:54px;padding:8px}}
