:root{
  --bg:#0b0f11;--panel:#11181b;--panel2:#172126;--ink:#f4f1e8;--muted:#8ea0a6;
  --teal:#38d7bf;--red:#e14a45;--gold:#f2c14e;--blue:#70a7ff;--line:#27343a;--green:#61d095;
  --radius:20px;--shadow:0 18px 60px rgba(0,0,0,.28)
}
*{box-sizing:border-box}
html{background:var(--bg);color-scheme:dark}
body{margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"SF Pro Display","Noto Sans SC",system-ui,sans-serif;background:
radial-gradient(circle at 20% -10%,rgba(56,215,191,.11),transparent 30rem),
radial-gradient(circle at 90% 10%,rgba(225,74,69,.08),transparent 28rem),var(--bg);color:var(--ink)}
button,input,select{font:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(56,215,191,.45);outline-offset:2px}
#app{max-width:980px;margin:0 auto;min-height:100vh;padding:env(safe-area-inset-top) 14px calc(92px + env(safe-area-inset-bottom))}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 2px 18px;position:sticky;top:0;z-index:20;background:linear-gradient(var(--bg) 75%,rgba(11,15,17,0));backdrop-filter:blur(12px)}
.brand{display:flex;align-items:center;gap:10px}.brand-panda{font-size:28px}.brand strong{display:block;letter-spacing:.08em;font-size:14px}.brand small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.hud{display:flex;gap:8px}.hud span,.score-pill{background:var(--panel);border:1px solid var(--line);padding:8px 10px;border-radius:999px;font-size:12px}
.view{display:none}.view.active{display:block}
.hero{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;padding:24px 4px 18px}.hero h1{font-size:clamp(31px,7vw,58px);line-height:.98;margin:7px 0 12px;max-width:12ch;letter-spacing:-.04em}.hero p{color:var(--muted);margin:0;max-width:60ch}
.eyebrow{font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--teal)}
.rank-orb{width:94px;height:94px;border-radius:50%;border:1px solid rgba(242,193,78,.55);display:grid;place-items:center;align-content:center;background:radial-gradient(circle,rgba(242,193,78,.12),transparent 65%);box-shadow:inset 0 0 25px rgba(242,193,78,.08)}
.rank-orb span,.rank-orb small{font-size:9px;color:var(--muted);letter-spacing:.12em}.rank-orb strong{font-size:27px;color:var(--gold)}
.mission-card{background:linear-gradient(145deg,rgba(23,33,38,.94),rgba(15,23,26,.98));border:1px solid var(--line);border-radius:28px;padding:20px;box-shadow:var(--shadow)}
.section-heading{display:flex;justify-content:space-between;gap:16px;align-items:start}.section-heading h2{margin:4px 0 0;font-size:28px}.badge{font-size:10px;font-weight:900;letter-spacing:.12em;border:1px solid rgba(56,215,191,.5);color:var(--teal);padding:7px 10px;border-radius:999px}
.today-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;margin:18px 0}
.today-char{min-width:0;border:1px solid var(--line);background:#0c1214;border-radius:16px;padding:12px 4px;text-align:center;transition:.18s transform,.18s border-color}
.today-char strong{font-size:clamp(25px,6vw,42px);display:block}.today-char span{display:block;color:var(--gold);font-size:11px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.today-char small{display:none;color:var(--muted);font-size:9px;margin-top:4px}
.today-char.revealed small{display:block}.today-char:active{transform:scale(.96);border-color:var(--teal)}
.primary,.ghost,.danger,.file-label{border-radius:14px;min-height:46px;padding:11px 15px;border:1px solid transparent;font-weight:800;letter-spacing:.02em}
.primary{background:var(--teal);color:#07110f}.primary:hover{filter:brightness(1.05)}
.primary.big{width:100%;margin-top:4px;font-size:14px;min-height:54px}.ghost,.file-label{background:transparent;color:var(--ink);border-color:var(--line)}.danger{background:rgba(225,74,69,.14);color:#ff8c87;border-color:rgba(225,74,69,.35)}
.mission-meter,.boss-track{height:7px;background:#0a0f11;border-radius:999px;overflow:hidden;margin-top:15px}.mission-meter div,.boss-track div{height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--gold));transition:width .35s ease}.micro{color:var(--muted);font-size:11px;line-height:1.45}.mission-card .micro{text-align:center;margin:7px 0 0}
.mode-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px}.mode-card{min-height:126px;text-align:left;background:var(--panel);border:1px solid var(--line);color:var(--ink);border-radius:20px;padding:16px}.mode-card.special{background:linear-gradient(135deg,rgba(225,74,69,.13),rgba(242,193,78,.08));border-color:rgba(225,74,69,.3)}.mode-card strong,.mode-card small{display:block}.mode-card strong{font-size:16px;margin:9px 0 4px}.mode-card small{color:var(--muted);line-height:1.3}.mode-icon{font-size:24px}
.stats-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:16px 0 8px}.stats-strip div{border-top:1px solid var(--line);padding:15px 4px}.stats-strip strong,.stats-strip span{display:block}.stats-strip strong{font-size:20px}.stats-strip span{font-size:10px;color:var(--muted);margin-top:3px}
.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:30;display:grid;grid-template-columns:repeat(4,1fr);background:rgba(10,14,16,.94);border-top:1px solid var(--line);padding:7px max(10px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));backdrop-filter:blur(18px)}
.bottom-nav button{background:transparent;border:0;color:var(--muted);min-height:50px;font-size:10px;border-radius:12px}.bottom-nav button span{display:block;font-size:19px;margin-bottom:2px}.bottom-nav button.active{color:var(--teal);background:rgba(56,215,191,.08)}
.arcade-header,.drop-header,.progress-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:6px 0 14px}.round-counter{font-size:26px;font-weight:900}.question-stage{min-height:510px;background:var(--panel);border:1px solid var(--line);border-radius:26px;padding:24px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.question-stage h2{font-size:clamp(24px,7vw,42px);line-height:1.08;margin:12px 0 22px;max-width:18ch}.question-big{font-size:clamp(76px,26vw,150px);line-height:1;margin:4px 0 22px}.option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%;max-width:580px}.option-grid button{min-height:72px;background:#0c1214;color:var(--ink);border:1px solid var(--line);border-radius:17px;font-size:18px;font-weight:800;padding:10px;word-break:break-word}.option-grid button .opt-sub{display:block;color:var(--muted);font-size:11px;font-weight:600;margin-top:3px}.option-grid button.correct{border-color:var(--green);background:rgba(97,208,149,.1)}.option-grid button.wrong{border-color:var(--red);background:rgba(225,74,69,.1)}.feedback{min-height:34px;margin:14px 0 0;font-size:13px}.feedback.good{color:var(--green)}.feedback.bad{color:#ff8c87}.next{margin-top:10px}
.arcade-footer{display:flex;justify-content:space-between;align-items:center;padding:12px 4px;color:var(--muted);font-size:12px}.peek-panel{display:flex;gap:9px;margin:18px 0 26px}.peek-panel span{width:58px;height:68px;display:grid;place-items:center;border:1px solid var(--line);border-radius:14px;background:#0c1214;font-size:35px}.peek-panel.hidden-state span{color:transparent;background:linear-gradient(145deg,#172126,#0d1417);position:relative}.peek-panel.hidden-state span::after{content:"?";color:var(--muted);position:absolute;font-size:24px}
.type-answer{display:flex;gap:9px;width:100%;max-width:480px}.type-answer input,.progress-controls input,.settings-card input[type=time]{flex:1;min-width:0;background:#0c1214;color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:13px 14px;font-size:16px}
.sentence-build{width:100%;max-width:600px}.sentence-target{color:var(--muted);font-size:13px;margin-bottom:12px}.sentence-answer{min-height:66px;border:1px dashed #415158;border-radius:16px;padding:10px;display:flex;flex-wrap:wrap;gap:7px;align-items:center;justify-content:center;margin-bottom:12px}.sentence-answer span,.sentence-tiles button{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;font-size:25px}.sentence-answer span{background:rgba(56,215,191,.08);border:1px solid rgba(56,215,191,.25)}.sentence-tiles{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.sentence-tiles button{background:#0c1214;color:var(--ink);border:1px solid var(--line)}.sentence-actions{display:flex;gap:8px;justify-content:center;margin-top:14px}
.drop-header h2,.progress-header h2{margin:3px 0 0;font-size:22px}.drop-layout{display:grid;grid-template-columns:180px minmax(0,430px);gap:18px;justify-content:center;align-items:start}.drop-info{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:15px}.drop-info p{color:var(--muted);font-size:12px;line-height:1.45}.drop-info button{width:100%;margin-top:8px}.drop-next,.drop-preview{display:grid;place-items:center;text-align:center;border-bottom:1px solid var(--line);padding-bottom:12px}.drop-next span,.drop-preview>span,.drop-next small,.drop-preview>small{font-size:10px;color:var(--muted);letter-spacing:.12em}.drop-next strong,.drop-preview strong{font-size:58px;line-height:1.05;margin:5px 0;color:var(--gold)}.drop-meaning{width:100%;margin:4px 0 0!important;color:var(--muted);font-size:11px!important;line-height:1.3!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.drop-preview{padding-top:12px}.piece-preview{display:grid;gap:2px;width:76px;min-height:0;margin:8px 0 2px;align-self:center}.preview-cell{background:transparent;border:1px solid transparent;min-width:0;min-height:0}.preview-cell.filled{background:rgba(242,193,78,.82);border-color:#f2c14e;box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.tetris-board{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:repeat(18,minmax(0,1fr));aspect-ratio:10/18;width:100%;max-width:430px;background:#070b0c;border:0;border-radius:14px;box-shadow:inset 0 0 0 2px #2d3b40;overflow:hidden;touch-action:manipulation}.tetris-cell{border:1px solid rgba(255,255,255,.035);display:grid;place-items:center;min-width:0;min-height:0;font-size:clamp(13px,4.3vw,22px);font-weight:900;color:var(--ink)}.tetris-cell.filled{background:#151e22;border-color:#2c3a40}.tetris-cell.active{background:rgba(242,193,78,.13);border-color:rgba(242,193,78,.45);color:var(--gold)}
.touch-controls{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:10px}.touch-controls button{min-height:48px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:13px;font-size:22px}.drop-quiz{position:absolute;inset:0;z-index:60;background:rgba(4,7,8,.82);display:grid;place-items:center;padding:20px;backdrop-filter:blur(6px)}#viewDrop{position:relative}.drop-quiz-card{width:min(520px,100%);background:#121a1e;border:1px solid var(--line);border-radius:24px;padding:24px;text-align:center;box-shadow:var(--shadow)}.drop-quiz-char{font-size:92px;color:var(--gold);line-height:1.1}.compact button{min-height:58px;font-size:14px}.drop-quiz-feedback{min-height:24px;margin-top:12px;font-size:13px;font-weight:900;line-height:1.35}.drop-quiz-feedback.good{color:var(--green)}.drop-quiz-feedback.bad{color:#ff8c87}.compact button:disabled{cursor:default;opacity:.78}.compact button.correct{border-color:var(--green);background:rgba(97,208,149,.14)}.compact button.wrong{border-color:var(--red);background:rgba(225,74,69,.14)}.center{text-align:center}
.progress-controls{display:grid;grid-template-columns:1fr 190px;gap:10px;margin:12px 0}.progress-controls select{background:#0c1214;color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:11px}
.legend{display:flex;flex-wrap:wrap;gap:12px;color:var(--muted);font-size:10px;margin:10px 2px 12px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;background:#46565c}.dot.imported{background:var(--blue)}.dot.current{background:var(--gold)}.dot.weak{background:var(--red)}.dot.mastered{background:var(--green)}
.hanzi-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:5px}.hanzi-tile{aspect-ratio:1;border-radius:9px;border:1px solid var(--line);background:#0c1214;color:#c6d0d3;font-size:18px;display:grid;place-items:center;position:relative;padding:0}.hanzi-tile.imported{border-color:rgba(112,167,255,.35)}.hanzi-tile.current{border-color:rgba(242,193,78,.8);color:var(--gold);background:rgba(242,193,78,.07)}.hanzi-tile.weak{border-color:rgba(225,74,69,.8);color:#ff918d}.hanzi-tile.mastered{border-color:rgba(97,208,149,.75);color:var(--green)}.hanzi-tile.duplicate::after{content:"R";position:absolute;right:2px;top:1px;font-size:7px;color:var(--muted)}
.char-inspector{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:16px;margin:16px 0}.inspector-char{font-size:76px;text-align:center;color:var(--gold)}.char-inspector h3{margin:5px 0;font-size:18px}.char-inspector p{color:var(--muted);margin:6px 0 12px}.inspector-actions{display:flex;gap:8px;flex-wrap:wrap}.source-note{color:var(--muted);font-size:11px;line-height:1.45;border-top:1px solid var(--line);padding-top:12px}
.yellow-test-launch{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:16px 0;padding:16px;border:1px solid rgba(242,193,78,.55);border-radius:18px;background:linear-gradient(135deg,rgba(242,193,78,.12),rgba(17,24,27,.94))}.yellow-test-launch h3{margin:5px 0 3px;font-size:17px}.yellow-test-launch p{margin:0;line-height:1.4}.yellow-test-launch button{flex:none}.mastery-test-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:6px 0 14px}.mastery-test-header h2{margin:3px 0 0;font-size:22px}.mastery-test-counter{font:900 25px/1 "Courier New",ui-monospace,monospace;color:var(--gold);white-space:nowrap}.mastery-test-track{height:8px;background:#0a0f11;border:1px solid #244552;padding:1px;margin:0 0 14px;overflow:hidden}.mastery-test-track div{height:100%;width:0;background:repeating-linear-gradient(90deg,var(--gold) 0 12px,#fff0b5 12px 15px,var(--gold) 15px 20px);transition:width .25s ease}.mastery-test-stage{min-height:510px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:var(--panel);border:1px solid rgba(242,193,78,.35);border-radius:24px;padding:24px 18px}.mastery-test-stage h2{font-size:clamp(24px,7vw,40px);line-height:1.08;margin:12px 0 22px;max-width:18ch}.mastery-test-big{font-size:clamp(82px,27vw,156px);line-height:1;margin:0 0 22px;color:var(--gold);text-shadow:4px 4px 0 rgba(0,0,0,.3)}.mastery-test-replay{margin:-5px 0 18px;border-color:rgba(242,193,78,.55);color:#ffe097}.mastery-test-replay:disabled{cursor:default;opacity:.65}.mastery-test-stage .option-grid{max-width:560px}.mastery-test-rule{margin:12px 0;text-align:center;color:var(--muted);font:900 10px/1.4 "Courier New",ui-monospace,monospace;letter-spacing:.12em}.mastery-test-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin-top:15px}.yellow-test-launch button:disabled{cursor:not-allowed;opacity:.55}
.mastery-dont-know{grid-column:1/-1!important;color:var(--gold)!important;border-style:dashed!important;background:rgba(242,193,78,.06)!important}
.settings-card{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:18px;margin:12px 0}.settings-card>label:first-child{display:block;font-weight:800;margin-bottom:8px}.settings-card input[type=time]{width:100%;margin:4px 0 8px}.settings-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.status-line{font-size:12px;color:var(--muted)}.toggle-row{display:flex!important;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--line)}.toggle-row:last-child{border-bottom:0}.toggle-row strong,.toggle-row small{display:block}.toggle-row small{color:var(--muted);font-size:10px;margin-top:3px}.toggle-row input{width:22px;height:22px;accent-color:var(--teal)}.file-label{display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.file-label input{display:none}
.hidden{display:none!important}
.shake{animation:shake .25s linear}@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.pop{animation:pop .22s ease}@keyframes pop{0%{transform:scale(.96)}60%{transform:scale(1.03)}100%{transform:scale(1)}}
body.reduced-motion *:not(.ticker-track):not(.train-convoy){animation:none!important;transition:none!important}
@media (max-width:680px){
  #app{padding-left:10px;padding-right:10px}.hero{grid-template-columns:1fr 82px;gap:8px}.rank-orb{width:78px;height:78px}.rank-orb strong{font-size:22px}
  .mission-card{padding:16px}.today-grid{gap:4px}.today-char{padding:9px 2px;border-radius:12px}.today-char span{font-size:9px}
  .mode-grid{grid-template-columns:1fr 1fr;gap:8px}.mode-card{min-height:118px;padding:14px}
  .stats-strip{grid-template-columns:repeat(2,1fr)}
  .question-stage{min-height:480px;padding:20px 13px}.option-grid button{font-size:16px}
  .drop-layout{grid-template-columns:1fr}.drop-info{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:center}.drop-info p{margin:0}.drop-info button{margin:0}.drop-next,.drop-preview{border-bottom:0;border-right:1px solid var(--line);padding:0 10px 0 0}.drop-next strong,.drop-preview strong{font-size:46px}.drop-info>p,.drop-info>.drop-legend{grid-column:1/-1}.drop-info>.drop-legend{width:100%}
  .progress-controls{grid-template-columns:1fr}.yellow-test-launch{align-items:stretch;flex-direction:column;gap:12px}.yellow-test-launch button{width:100%}.hanzi-grid{grid-template-columns:repeat(10,minmax(0,1fr));gap:4px}.hanzi-tile{font-size:16px;border-radius:7px}.char-inspector{grid-template-columns:70px 1fr}.inspector-char{font-size:58px}
}
@media (max-width:390px){
  .today-grid{grid-template-columns:repeat(4,1fr)}.today-char:last-child{grid-column:2/4}
  .mode-grid{grid-template-columns:1fr}.mode-card{min-height:95px}
  .hanzi-grid{grid-template-columns:repeat(8,minmax(0,1fr))}
  .option-grid{grid-template-columns:1fr}.option-grid button{min-height:58px}
  .question-stage h2{font-size:26px}.peek-panel span{width:48px;height:58px;font-size:29px}
}
@media (prefers-reduced-motion:reduce){*:not(.ticker-track):not(.train-convoy){animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* --- V1 contextual microgames + traffic-light progress --- */
:root{
  --learn:#f2c14e;
  --unseen:#e14a45;
  --master:#61d095;
  --pixel:#dfe7e9;
}
.bottom-nav{grid-template-columns:repeat(5,1fr)}
.ghost.big{width:100%;margin-top:4px;min-height:50px}
.rush-card{margin-bottom:14px;border:1px solid rgba(56,215,191,.38);background:
  linear-gradient(180deg,rgba(56,215,191,.055),rgba(56,215,191,.015)),#0d1417;
  border-radius:24px;padding:18px;position:relative;overflow:hidden}
.rush-card::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.12;background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px);background-size:100% 4px}
.rush-copy{position:relative;z-index:1}.rush-copy h2{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;margin:5px 0 5px;font-size:clamp(28px,7vw,48px);text-shadow:3px 3px 0 rgba(0,0,0,.4)}
.rush-copy p{color:var(--muted);margin:0 0 14px;max-width:60ch;line-height:1.45}
.pixel-button{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;border-radius:5px;box-shadow:4px 4px 0 #07110f;transform:translate(-2px,-2px)}
.pixel-button:active{transform:translate(1px,1px);box-shadow:1px 1px 0 #07110f}
.rush-icons{display:flex;justify-content:space-between;gap:4px;margin-top:15px;filter:saturate(.75)}.rush-icons span{font-size:24px;line-height:1}
.traffic-stats .stat-mastered strong{color:var(--master)}.traffic-stats .stat-learning strong{color:var(--learn)}.traffic-stats .stat-unseen strong{color:#ff7f79}
.cabinet-intro{background:var(--panel);border:1px solid var(--line);padding:16px;border-radius:18px;margin-bottom:12px}.cabinet-intro p{margin:0 0 12px;color:var(--muted);font-size:12px;line-height:1.5}.cabinet-intro strong{color:var(--ink)}
.game-cabinet{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.game-card{border:1px solid var(--line);background:#0c1214;color:var(--ink);border-radius:18px;padding:16px;text-align:left;min-height:155px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.game-card::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.15) 1px,transparent 1px);background-size:100% 4px}.game-card .game-icon{font-size:34px}.game-card strong{display:block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:17px;letter-spacing:.03em;margin:9px 0 4px}.game-card small{display:block;color:var(--muted);line-height:1.35;font-size:11px}.game-card .game-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:9px}.game-card .game-tags i{font-style:normal;border:1px solid var(--line);border-radius:999px;padding:3px 6px;font-size:10px;color:var(--gold)}.game-card:active{transform:scale(.985);border-color:var(--teal)}
.micro-header{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin:6px 0 10px}.micro-title-wrap{text-align:center;min-width:0}.micro-title-wrap h2{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;margin:2px 0 0;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.micro-hud{display:flex;gap:5px}.micro-hud span{border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:7px 8px;font-size:11px}.micro-goalline{height:5px;background:#06090a;border-radius:0;overflow:hidden;margin-bottom:8px}.micro-goalline div{height:100%;width:0;background:var(--teal);transition:width .2s linear}
.micro-stage{min-height:440px;border:2px solid #344248;background:#071014;border-radius:4px;padding:12px;position:relative;overflow:hidden;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;box-shadow:inset 0 0 0 3px #0c171b,0 8px 0 #050809;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);background-size:100% 4px}
.micro-feedback{min-height:54px;margin:10px 0;text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.micro-feedback .micro-result{font-size:16px;font-weight:1000;letter-spacing:.08em;margin-bottom:3px}.micro-feedback .micro-result.good{color:var(--green)}.micro-feedback .micro-result.bad{color:#ff8c87}.micro-feedback .flash-hanzi{font-size:42px;font-weight:900;color:var(--gold);line-height:1}.micro-feedback .flash-pinyin{font-size:13px;color:var(--teal);margin-top:2px}.micro-feedback .flash-meaning{font-size:10px;color:var(--muted);margin-top:2px}
.micro-instruction{text-align:center;color:var(--muted);font-size:10px;letter-spacing:.12em;margin:1px 0 8px}.micro-big-hanzi{font-size:clamp(66px,24vw,126px);font-weight:900;line-height:1;text-align:center;text-shadow:4px 4px 0 #000}.micro-pinyin{font-size:16px;text-align:center;color:var(--gold);margin-top:4px}
.micro-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;position:absolute;left:10px;right:10px;bottom:10px}.micro-controls.three{grid-template-columns:repeat(3,1fr)}.micro-controls.two{grid-template-columns:repeat(2,1fr)}.micro-controls button{min-height:66px;background:#101a1f;color:var(--ink);border:2px solid #344248;border-radius:4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:900;padding:5px}.micro-controls button strong{font-size:29px;display:block}.micro-controls button small{display:block;font-size:9px;color:var(--gold);margin-top:2px}.micro-controls button:active,.micro-controls button.correct{background:rgba(97,208,149,.12);border-color:var(--master)}.micro-controls button.wrong{background:rgba(225,74,69,.12);border-color:var(--unseen)}
.pixel-scene{height:270px;position:relative;background:linear-gradient(#13252d 0 62%,#142018 62% 100%);border:2px solid #2f424a;overflow:hidden}.pixel-scene::after{content:"";position:absolute;left:0;right:0;top:62%;height:4px;background:#324d35}.pixel-panda{position:absolute;left:12%;bottom:22px;font-size:52px;z-index:3;transform-origin:center bottom}.pixel-enemy{position:absolute;right:14%;bottom:25px;font-size:45px}.pixel-obstacle{position:absolute;right:20%;bottom:12px;font-size:48px}.pixel-sign{position:absolute;right:18%;top:20px;background:#0a0f11;border:2px solid #e3d8a8;padding:8px 11px;font-size:34px;color:var(--ink)}.action-punch{animation:punch .28s steps(2)}.action-jump{animation:jump .45s steps(5)}.action-run{animation:run .35s steps(4)}.action-stop{animation:stop .22s steps(2)}@keyframes punch{50%{transform:translateX(40px) scaleX(1.05)}}@keyframes jump{50%{transform:translateY(-85px)}}@keyframes run{50%{transform:translateX(75px)}}@keyframes stop{50%{transform:scale(.9)}}
.pot-scene{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:430px;margin:18px auto 100px}.pot{min-height:95px;border:2px solid #62452c;background:#2e2017;border-radius:4px;color:var(--ink);font-size:42px;position:relative}.pot::before{content:"🏺";font-size:48px}.pot.revealed::before{display:none}.pot.revealed{background:#10191d;border-color:#50646c}.pot .pot-char{font-size:44px;font-weight:900}.pot .pot-effect{display:block;font-size:25px;margin-top:1px}.target-icon{text-align:center;font-size:52px;margin:12px 0 0}.target-icon small{display:block;color:var(--muted);font-size:10px;letter-spacing:.12em;margin-top:3px}
.road-scene{height:300px;position:relative;overflow:hidden;background:linear-gradient(#10242d 0 47%,#2a2f32 47% 100%);border:2px solid #344248}.road-scene::after{content:"";position:absolute;left:49%;top:48%;bottom:0;border-left:5px dashed #e8df9d}.pixel-car{position:absolute;left:50%;bottom:28px;font-size:55px;transform:translateX(-50%);z-index:2;transition:left .25s ease,transform .25s ease}.road-cue{position:absolute;top:18px;left:50%;transform:translateX(-50%);font-size:66px}.car-left{left:25%}.car-right{left:75%}.car-fast{transform:translateX(-50%) scale(1.18)}.car-slow{transform:translateX(-50%) scale(.82)}
.quality-stage{display:grid;grid-template-rows:auto 1fr auto;height:100%}.quality-prompt{text-align:center}.quality-prompt .micro-big-hanzi{font-size:82px}.quality-choices{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center;margin:10px auto 98px;width:min(520px,100%)}.quality-choice{min-height:180px;background:#0c1519;border:2px solid #344248;border-radius:4px;display:grid;place-items:center;color:var(--ink)}.quality-object{display:block;background:#cfbb79;border:4px solid #3b3423}.obj-big{width:125px;height:125px}.obj-small{width:54px;height:54px}.obj-long{width:140px;height:36px}.obj-short{width:62px;height:36px}.quality-choice .quality-emoji{font-size:72px}.quality-choice .quality-label{font-size:11px;color:var(--muted)}
.quality-prompt .quality-emoji{display:block;font-size:72px;line-height:1;margin:4px 0 2px}.quality-choice{font-size:42px;font-weight:900;line-height:1;text-shadow:3px 3px 0 #000}
.train-track{height:250px;border-bottom:8px double #5a666a;display:flex;align-items:end;justify-content:center;padding-bottom:16px;gap:4px;overflow:hidden}.train-engine,.train-car{width:92px;height:70px;border:3px solid #48585f;background:#172329;display:grid;place-items:center;font-size:44px;font-weight:900;position:relative}.train-engine{border-radius:3px 18px 3px 3px;background:#1c3434}.train-engine::before,.train-car::before{content:"●";position:absolute;left:10px;bottom:-17px;font-size:20px;color:#69767b}.train-engine::after,.train-car::after{content:"●";position:absolute;right:10px;bottom:-17px;font-size:20px;color:#69767b}.train-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px auto 0;max-width:500px}.train-options button{min-height:72px;border:2px solid #344248;background:#101a1f;color:var(--ink);font-size:34px;border-radius:4px;font-weight:900}.train-word{text-align:center;font-size:16px;color:var(--muted);margin-top:8px}.train-go{animation:trainGo .65s steps(8)}@keyframes trainGo{to{transform:translateX(180px)}}
.sound-scene{text-align:center;padding-top:10px}.sound-speaker{font-size:65px}.sound-replay{margin:7px auto 12px;display:inline-flex}.sound-bubbles{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:480px;margin:10px auto 0}.sound-bubble{min-height:122px;border:2px solid #344248;background:#101a1f;color:var(--ink);border-radius:50%;font-size:52px;font-weight:900;animation:bob 1.2s steps(3) infinite alternate}.sound-bubble:nth-child(2n){animation-delay:.18s}.sound-bubble:nth-child(3n){animation-delay:.36s}@keyframes bob{to{transform:translateY(-8px)}}
.sound-hunt{position:relative;height:clamp(250px,38vw,330px);width:min(720px,100%);margin:10px auto 0;overflow:hidden;border:2px solid #31596a;border-radius:3px;background:radial-gradient(circle at 18% 25%,rgba(255,209,90,.18) 0 1px,transparent 2px),radial-gradient(circle at 82% 68%,rgba(80,243,208,.2) 0 1px,transparent 2px),linear-gradient(145deg,#132b3d,#060d17 70%);cursor:none;--flash-x:-160px;--flash-y:-160px}
.sound-hunt::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(80,243,208,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(80,243,208,.1) 1px,transparent 1px);background-size:28px 28px}
.sound-hunt .sound-bubbles{position:absolute;inset:0;display:block;max-width:none;margin:0}
.sound-hunt .sound-bubble{position:absolute;z-index:2;width:78px;height:78px;min-height:0;margin:0;padding:0;border:2px solid #5b8c9b;background:radial-gradient(circle at 35% 28%,#d8fff4,#3c7e89 58%,#122e3d);box-shadow:0 0 0 3px #071521,0 0 18px rgba(80,243,208,.25);font-size:45px;line-height:1;color:#eaffdf;transform:translate(-50%,-50%);animation:none;filter:brightness(.34) saturate(.55);transition:filter .12s ease,box-shadow .12s ease,transform .12s ease}
.sound-hunt .sound-bubble:hover{z-index:5;filter:brightness(1.15) saturate(1.1);box-shadow:0 0 0 3px #f2d15a,0 0 22px rgba(242,209,90,.72);transform:translate(-50%,-50%) scale(1.06)}
.sound-hunt .sound-bubble.correct{z-index:5;filter:brightness(1.55) saturate(1.35);border-color:#9dffcd;box-shadow:0 0 0 3px #071521,0 0 12px #61d095,0 0 30px rgba(97,208,149,.95);animation:soundCorrectGlow .36s ease-in-out 2 alternate}.sound-hunt .sound-bubble.wrong{z-index:5;filter:sepia(.8) saturate(3) brightness(.9);border-color:#ff7f79;box-shadow:0 0 0 3px #071521,0 0 12px #e14a45,0 0 30px rgba(225,74,69,.92);animation:soundWrongGlow .36s ease-in-out 2 alternate}
@keyframes soundCorrectGlow{to{filter:brightness(1.9) saturate(1.55);box-shadow:0 0 0 3px #071521,0 0 18px #61d095,0 0 42px rgba(97,208,149,1)}}@keyframes soundWrongGlow{to{filter:sepia(.8) saturate(4) brightness(1.05);box-shadow:0 0 0 3px #071521,0 0 18px #e14a45,0 0 42px rgba(225,74,69,1)}}
.sound-darkness{position:absolute;z-index:3;inset:0;pointer-events:none;background:radial-gradient(ellipse 105px 92px at var(--flash-x) var(--flash-y),transparent 0 28px,rgba(3,9,16,.18) 65px,rgba(3,9,16,.72) 118px,rgba(3,9,16,.96) 178px)}
.sound-flashlight{position:absolute;z-index:4;left:var(--flash-x);top:var(--flash-y);width:146px;height:128px;pointer-events:none;opacity:0;transform:translate(-50%,-8%);clip-path:polygon(50% 0,100% 100%,0 100%);background:linear-gradient(180deg,rgba(255,248,178,.85),rgba(255,235,112,.08) 72%,transparent);filter:drop-shadow(0 0 8px rgba(255,236,132,.75));transition:opacity .1s ease}
.sound-flashlight.active{opacity:.32}
.sound-flashlight::after{content:"🔦";position:absolute;left:50%;top:-5px;transform:translateX(-50%);font-size:22px;filter:drop-shadow(2px 2px 0 #07101d)}
.game-over-panel{height:100%;display:grid;place-items:center;text-align:center;align-content:center;gap:12px}.game-over-panel .result-grade{font-size:70px}.game-over-panel h3{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;margin:0;font-size:26px}.game-over-panel p{color:var(--muted);margin:0;max-width:44ch;line-height:1.45}.game-over-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:6px}.rush-progress{font-size:11px;color:var(--gold);letter-spacing:.12em}
.progress-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}.progress-summary-box{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:12px;text-align:center}.progress-summary-box strong{display:block;font-size:25px}.progress-summary-box span{font-size:8px;letter-spacing:.12em;color:var(--muted)}.progress-summary-box.mastered strong{color:var(--master)}.progress-summary-box.learning strong{color:var(--learn)}.progress-summary-box.unseen strong{color:#ff7f79}
.dot.learning{background:var(--learn)}.dot.unseen{background:var(--unseen)}
.hanzi-tile{transition:transform .1s ease,filter .1s ease}.hanzi-tile.mastered{background:rgba(97,208,149,.18);border-color:rgba(97,208,149,.95);color:#aaf2c7}.hanzi-tile.learning{background:rgba(242,193,78,.14);border-color:rgba(242,193,78,.9);color:#ffe097}.hanzi-tile.unseen{background:rgba(225,74,69,.14);border-color:rgba(225,74,69,.68);color:#ff9b97}.hanzi-tile:active{transform:scale(.9);filter:brightness(1.3)}
.status-actions{gap:6px}.status-button{min-height:44px;border-radius:8px;padding:9px 10px;font-size:10px;font-weight:900;border:2px solid transparent}.status-button.mastered{background:rgba(97,208,149,.14);border-color:var(--master);color:#aaf2c7}.status-button.learning{background:rgba(242,193,78,.12);border-color:var(--learn);color:#ffe097}.status-button.unseen{background:rgba(225,74,69,.12);border-color:var(--unseen);color:#ffaaa6}.status-button.active{box-shadow:0 0 0 3px rgba(255,255,255,.16) inset}
.speak-char{border:1px solid rgba(242,193,78,.35);background:rgba(242,193,78,.07);border-radius:14px;min-height:96px;color:var(--gold);padding:4px}.speak-char::after{content:" 🔊";font-size:13px;vertical-align:top;color:var(--muted)}
@media (max-width:680px){
  .game-cabinet{grid-template-columns:1fr 1fr}.game-card{min-height:145px;padding:13px}.micro-stage{min-height:420px}.micro-header{grid-template-columns:auto 1fr}.micro-hud{grid-column:1/-1;justify-content:center}.micro-controls button strong{font-size:27px}.quality-choices{gap:10px}.quality-choice{min-height:165px}.train-engine,.train-car{width:74px;height:64px;font-size:36px}.bottom-nav button{font-size:9px}.bottom-nav button span{font-size:17px}
}
@media (max-width:390px){
  .game-cabinet{grid-template-columns:1fr}.game-card{min-height:116px}.rush-icons span{font-size:20px}.micro-stage{min-height:400px;padding:8px}.micro-controls{left:7px;right:7px;bottom:7px;gap:5px}.micro-controls button{min-height:60px}.micro-controls button strong{font-size:24px}.pot-scene{gap:7px}.pot{min-height:82px}.pot::before{font-size:42px}.sound-bubble{min-height:100px;font-size:44px}.quality-choice{min-height:145px}.obj-big{width:100px;height:100px}.progress-summary-box{padding:9px 5px}.progress-summary-box strong{font-size:21px}.status-button{width:100%}
}
/* V2 retro canvas microgames */
.retro-game-shell{min-height:410px;display:flex;flex-direction:column;gap:8px;position:relative}.retro-canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#081014;border:3px solid #3d4e54;image-rendering:pixelated;box-shadow:inset 0 0 0 3px #111a1e;transition:filter .12s}.retro-canvas.hit-good{filter:brightness(1.35)}.retro-canvas.hit-bad{filter:sepia(.8) saturate(3) brightness(.72)}
.retro-keyboard-hint,.micro-keyboard-hint,.keyboard-hint{margin:0;color:var(--gold);font:900 9px/1.35 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;text-align:center}.micro-keyboard-hint,.keyboard-hint{padding:5px 0 2px}.keyboard-selected{outline:2px solid var(--gold)!important;outline-offset:-4px;filter:brightness(1.18)}
.snake-shell{display:flex;flex-direction:column;align-items:center;gap:8px;min-height:100%;font-family:"Courier New",ui-monospace,monospace}
.snake-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;width:min(600px,100%);color:#d9edac;font-size:10px;letter-spacing:.08em}
.snake-pause{min-height:30px;padding:5px 9px;background:#173f2e;color:#e5f4ba;border:2px solid #2f6e4b;border-radius:2px;font:900 10px "Courier New",ui-monospace,monospace}
.snake-pause:hover{border-color:#e5f4ba;color:#fff}
.snake-pause:disabled{opacity:.45;cursor:default}
.snake-canvas{display:block;width:min(600px,100%);height:auto;aspect-ratio:3/2;background:#b7cf83;border:4px solid #102b20;box-shadow:inset 0 0 0 3px #5b845d,5px 5px 0 #050910;image-rendering:pixelated;touch-action:none}
.snake-caption{width:min(600px,100%);color:var(--gold);font:900 9px/1.25 "Courier New",ui-monospace,monospace;letter-spacing:.07em;text-align:center}
.snake-touch-controls{display:flex;align-items:center;justify-content:center;gap:22px;width:min(600px,100%);margin-top:auto;padding-top:3px}
.snake-dpad{display:grid;grid-template-columns:repeat(3,42px);grid-template-rows:repeat(3,36px);gap:4px}
.snake-dpad span{display:block}
.snake-dpad button{min-height:36px;padding:0;background:#101f23;color:var(--teal);border:2px solid #34505a;border-radius:2px;box-shadow:2px 2px 0 #050910;font-size:16px}
.snake-dpad button:active{transform:translate(2px,2px);box-shadow:none;background:#173f3d}
.snake-key-hint{color:#8ea0a6;font:900 9px/1.45 "Courier New",ui-monospace,monospace;letter-spacing:.05em;text-align:left}
.panda-dash-shell{display:flex;flex-direction:column;gap:8px;min-height:410px}.panda-dash-copy{display:flex;align-items:baseline;justify-content:space-between;gap:12px;color:var(--muted);font-size:10px;line-height:1.35}.panda-dash-copy strong{color:var(--gold);font:900 13px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.panda-dash-frame{display:block;width:100%;aspect-ratio:16/9;min-height:0;border:3px solid #3d4e54;background:#081014;box-shadow:inset 0 0 0 3px #111a1e}.panda-dash-status{display:flex;justify-content:space-between;gap:8px;padding:6px 9px;border:1px solid #334148;background:#0d1519;color:var(--muted);font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em}.panda-dash-status strong{color:var(--teal)}
.doom-review-shell{display:flex;flex-direction:column;gap:8px;min-height:410px}.doom-review-copy{display:flex;align-items:baseline;justify-content:space-between;gap:12px;color:var(--muted);font-size:10px;line-height:1.35}.doom-review-copy strong{color:#e97d69;font:900 13px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.doom-review-roster{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 9px;border:1px solid #5b4635;background:#171311;color:var(--muted);font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.05em}.doom-review-roster strong{overflow:hidden;color:#e8cf78;text-overflow:ellipsis;white-space:nowrap}.doom-review-frame{display:block;width:100%;aspect-ratio:16/9;min-height:0;border:3px solid #3d4e54;background:#080707;box-shadow:inset 0 0 0 3px #111a1e}.doom-review-status{display:flex;justify-content:space-between;gap:8px;padding:6px 9px;border:1px solid #4d3d31;background:#120f0d;color:var(--muted);font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em}.doom-review-status strong{color:#e8cf78}
.shark-island-shell{display:flex;flex-direction:column;gap:8px;min-height:410px}.shark-island-copy{display:flex;align-items:baseline;justify-content:space-between;gap:12px;color:var(--muted);font-size:10px;line-height:1.35}.shark-island-copy strong{color:#f2a65a;font:900 13px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.shark-island-frame{display:block;width:100%;height:clamp(360px,63vw,720px);border:3px solid #3d4e54;background:#8bd7e8;box-shadow:inset 0 0 0 3px #111a1e}.shark-island-status{display:flex;justify-content:space-between;gap:8px;padding:6px 9px;border:1px solid #5a4637;background:#171412;color:var(--muted);font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.05em}.shark-island-status strong{color:#f2c85b}
.ritual-review-shell{display:flex;flex-direction:column;gap:8px;min-height:0}.ritual-review-copy{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:10px;line-height:1.35}.ritual-review-copy>div{display:grid;gap:2px;min-width:0}.ritual-review-copy strong{color:#d5b6ef;font:900 13px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.ritual-copy-log{flex:none;border:2px solid #d5b6ef;border-radius:2px;background:#24172f;color:#fff;font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.05em;padding:7px 9px;cursor:pointer;touch-action:manipulation}.ritual-copy-log:hover,.ritual-copy-log:focus-visible{background:#422b52}.ritual-copy-log:disabled{cursor:wait;opacity:.72}.ritual-review-roster{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 9px;border:1px solid #574664;background:#17121b;color:var(--muted);font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.05em}.ritual-review-roster strong{overflow:hidden;color:#ead7ff;text-overflow:ellipsis;white-space:nowrap}.ritual-review-frame{display:block;width:100%;height:clamp(390px,calc(100vh - 330px),620px);min-height:0;border:3px solid #574664;background:#120d17;box-shadow:inset 0 0 0 3px #21182a}.ritual-review-status{display:flex;justify-content:space-between;gap:8px;padding:6px 9px;border:1px solid #574664;background:#17121b;color:var(--muted);font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em}.ritual-review-status strong{color:#d5b6ef}
.hanzi-battle-shell{display:flex;flex-direction:column;gap:8px;min-height:410px}.hanzi-battle-copy{display:flex;align-items:baseline;justify-content:space-between;gap:12px;color:var(--muted);font-size:10px;line-height:1.35}.hanzi-battle-copy strong{color:#f3c969;font:900 13px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.hanzi-battle-frame{display:block;width:100%;height:clamp(420px,64vw,720px);min-height:0;border:3px solid #496877;background:#071015;box-shadow:inset 0 0 0 3px #111a1e}.hanzi-battle-status{display:flex;justify-content:space-between;gap:8px;padding:6px 9px;border:1px solid #496877;background:#0e1b23;color:var(--muted);font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em}.hanzi-battle-status strong{color:#f3c969}
.retro-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.retro-action{min-height:68px;background:#111c20;color:var(--ink);border:2px solid #405259;border-radius:3px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.retro-action strong{display:block;font-size:29px}.retro-action small{display:block;font-size:10px;color:var(--gold)}.retro-action.correct{border-color:var(--master);background:rgba(97,208,149,.16)}.retro-action.wrong{border-color:var(--unseen);background:rgba(225,74,69,.16)}.retro-action.command-pulse{border-color:var(--teal);background:rgba(56,215,191,.16);box-shadow:0 0 0 2px rgba(56,215,191,.16) inset}
.retro-mini-hud{position:absolute;z-index:3;left:10px;right:10px;top:8px;display:flex;justify-content:space-between;pointer-events:none;color:#f3e6bd;font:900 11px ui-monospace,SFMono-Regular,Menlo,monospace;text-shadow:2px 2px #000}.retro-mini-hud b{color:#e85e59;letter-spacing:3px}
.kungfu-hud{gap:10px;align-items:center;font-size:10px}.kungfu-hud span{white-space:nowrap}.kungfu-hud small{color:#8df4d2;font-size:9px}.kungfu-hud span:nth-child(2) b{color:#f3d36f}.kungfu-hud span:nth-child(3) b{color:#ed6a63;letter-spacing:2px}
.kungfu-controls{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.kungfu-controls button{min-height:64px;background:#111c20;color:var(--ink);border:2px solid #405259;border-radius:3px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;box-shadow:3px 3px 0 #050910}.kungfu-controls button strong{display:block;font-size:25px;line-height:1}.kungfu-controls button small{display:block;margin-top:5px;color:var(--gold);font-size:9px}.kungfu-controls button:hover,.kungfu-controls button:focus-visible{border-color:var(--teal);color:#fff7d1}.kungfu-controls button:active{transform:translate(2px,2px);box-shadow:none;background:#173f3d}
.direction-rush-prompt,.kungfu-rush-prompt{display:grid;gap:4px;justify-items:center;padding:8px 10px;border:2px solid #3d6970;background:linear-gradient(180deg,#102c35,#0a171d);color:#b8d6ce;font:900 10px/1.25 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-align:center}.direction-rush-prompt strong,.kungfu-rush-prompt strong{color:#f3d36f;font-size:16px;letter-spacing:.04em;text-shadow:2px 2px #000}.direction-rush-options,.kungfu-rush-options{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.direction-rush-option,.kungfu-rush-option{position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-rows:1fr auto;align-items:center;min-height:67px;padding:5px 8px;background:#111c20;color:var(--ink);border:2px solid #405259;border-radius:3px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;box-shadow:3px 3px 0 #050910}.direction-rush-option strong,.kungfu-rush-option strong{font-size:29px;line-height:1}.direction-rush-option small,.kungfu-rush-option small{grid-column:2;color:var(--gold);font-size:9px;text-align:left}.direction-rush-option:hover,.direction-rush-option:focus-visible,.kungfu-rush-option:hover,.kungfu-rush-option:focus-visible{border-color:var(--teal);color:#fff7d1}.direction-rush-option.correct,.kungfu-rush-option.correct{border-color:var(--master);background:rgba(97,208,149,.16)}.direction-rush-option.wrong,.kungfu-rush-option.wrong{border-color:var(--unseen);background:rgba(225,74,69,.16)}.direction-rush-lane-mark,.kungfu-rush-seal{grid-row:1/-1;display:grid;place-items:center;width:29px;height:42px;margin-right:5px;border:1px solid #dca94f;color:#f3d36f;font-size:18px}.kungfu-rush-seal{color:#ffbd72;border-color:#db6e55;font-size:17px}.direction-hud small,.kungfu-rush-hud small{color:#8df4d2;font-size:9px}.direction-hud b,.kungfu-rush-hud b{color:#f3d36f;letter-spacing:2px}.direction-hud span:nth-child(2) b{color:#64efdc}.kungfu-rush-hud span:nth-child(2) b{color:#f3d36f}
.pot-controls{display:grid;grid-template-columns:1fr 92px;gap:10px;align-items:stretch}.pot-dpad{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.pot-controls button{min-height:66px;background:#111c20;color:var(--ink);border:2px solid #405259;border-radius:3px;font:900 27px ui-monospace,SFMono-Regular,Menlo,monospace}.sword-btn{background:#2b2317!important;border-color:#b3954d!important}.sword-btn strong{display:block;font-size:31px}.sword-btn small{display:block;font-size:10px;color:var(--gold)}
.drop-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:8px 0 10px}.drop-legend span{border:1px solid #334148;background:#0d1519;padding:6px 4px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:4px;min-width:0}.drop-legend b{font-size:23px;color:#f1e8c9}.drop-legend div{min-width:0}.drop-legend small,.drop-legend em{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.drop-legend small{font-size:9px;color:var(--gold)}.drop-legend em{font-style:normal;font-size:8px;color:var(--muted)}.drop-legend i{font-style:normal;font-size:9px;color:var(--muted)}
.tetris-cell.filled,.tetris-cell.active{background:#152127!important;border-color:#55666d!important;color:#f0e8cc!important;text-shadow:1px 1px 0 #000!important}.tetris-cell.active{outline:1px solid #e3c96f;outline-offset:-2px}
@media(max-width:520px){.retro-game-shell{min-height:360px}.retro-action{min-height:58px}.retro-action strong{font-size:24px}.kungfu-controls{grid-template-columns:repeat(3,1fr)}.kungfu-controls button{min-height:58px}.kungfu-controls button strong{font-size:23px}.direction-rush-prompt strong,.kungfu-rush-prompt strong{font-size:14px}.direction-rush-option,.kungfu-rush-option{min-height:58px;padding:4px}.direction-rush-option strong,.kungfu-rush-option strong{font-size:24px}.direction-rush-lane-mark,.kungfu-rush-seal{width:24px;height:35px;font-size:14px}.pot-controls{grid-template-columns:1fr 76px}.pot-controls button{min-height:58px;font-size:23px}.drop-legend{grid-template-columns:repeat(2,1fr)}}

/* Hanzi Drop V3 mechanics and learning feedback */
.drop-head-stats{display:flex;gap:5px}.drop-head-stats span{display:grid;place-items:center;min-width:42px;padding:5px 7px;background:var(--panel);border:1px solid var(--line);border-radius:10px}.drop-head-stats small{font-size:8px;color:var(--muted);letter-spacing:.1em}.drop-head-stats b{font-size:15px;color:var(--gold);line-height:1.1}
.drop-hold{display:grid;place-items:center;text-align:center;border-bottom:1px solid var(--line);padding:12px 0}.drop-hold>span{font-size:10px;color:var(--muted);letter-spacing:.12em}.drop-hold strong{font-size:36px;line-height:1.05;margin:4px 0;color:var(--gold)}.drop-hold>small{font-size:9px;color:var(--muted);letter-spacing:.08em}.drop-hold.empty{opacity:.72}.drop-hold.empty .piece-preview{opacity:.38}.drop-hold .piece-preview{margin-top:8px}
.drop-map-entry .drop-status{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:7px;letter-spacing:.08em;margin-top:2px;color:var(--teal)}.drop-map-entry.weak .drop-status{color:var(--red)}.drop-map-entry.due .drop-status{color:var(--gold)}.drop-map-entry.mastered .drop-status{color:var(--green)}.drop-map-entry.unseen .drop-status{color:var(--muted)}
.touch-controls{grid-template-columns:repeat(6,minmax(0,1fr))}.touch-controls button:disabled{opacity:.35;cursor:not-allowed}.tetris-cell.ghost{background:rgba(242,193,78,.05);border:1px dashed rgba(242,193,78,.35);color:rgba(242,193,78,.45);text-shadow:none}.tetris-cell.clearing{animation:dropLineClear .3s steps(2,end)}@keyframes dropLineClear{0%,100%{background:#f2c14e;color:#0b0f11;filter:brightness(1.25)}50%{background:#e14a45;color:#fff;filter:brightness(1.6)}}
.drop-summary{display:grid;gap:7px;margin:0 0 16px;padding:16px 12px;min-height:92px;align-content:center;border:2px solid #ff6f69;background:linear-gradient(145deg,rgba(225,74,69,.3),rgba(78,20,28,.55));box-shadow:4px 4px 0 #250d19;text-align:center}.drop-summary strong{font-size:20px;color:#ffd2cd;letter-spacing:.16em;text-shadow:2px 2px 0 #5c1c25}.drop-summary span{font-size:12px;color:#ffd0ca;line-height:1.4}.drop-summary b{color:#fff4e8;font-size:14px}
@media(max-width:680px){.drop-header{flex-wrap:wrap}.drop-header>div:nth-child(2){flex:1;min-width:150px}.drop-head-stats{order:3}.drop-header>.score-pill{order:4}.drop-hold{border-right:1px solid var(--line);padding:0 10px 0 0}}
@media(max-width:680px){.drop-summary{grid-column:1/-1;width:100%;margin-bottom:0}}
@media(max-width:520px){.touch-controls{grid-template-columns:repeat(3,minmax(0,1fr))}.drop-head-stats span{min-width:38px;padding:5px}.drop-head-stats small{font-size:7px}.drop-summary{padding:14px 10px;min-height:86px}.drop-summary strong{font-size:18px}}

/* Homepage cabinet select screen */
.home-cabinet{--cabinet-red:#9e302f;--cabinet-red-dark:#481c20;--cabinet-gold:#f5c95d;position:relative;margin:8px 0 18px;padding:13px 13px 11px;border:3px solid #2d171b;border-radius:28px 28px 16px 16px;background:linear-gradient(135deg,#a63a36 0%,#722729 33%,#401b21 100%);box-shadow:0 18px 0 #160e11,0 28px 50px rgba(0,0,0,.42),inset 0 0 0 2px rgba(245,201,93,.24);overflow:hidden}
.home-cabinet::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;background:repeating-linear-gradient(135deg,transparent 0 18px,rgba(255,255,255,.08) 19px 20px,transparent 21px 44px)}
.home-cabinet::after{content:"";position:absolute;left:2%;right:2%;bottom:0;height:8px;border-radius:4px 4px 10px 10px;background:#221115;box-shadow:0 -2px 0 rgba(245,201,93,.3)}
.cabinet-marquee{position:relative;z-index:1;display:grid;grid-template-columns:36px 1fr 36px;align-items:center;gap:8px;min-height:96px;padding:12px 16px;border:3px solid #2a1619;border-radius:18px 18px 9px 9px;background:linear-gradient(180deg,#f2c25b 0%,#d8913f 48%,#a64a31 100%);box-shadow:inset 0 0 0 3px rgba(255,240,167,.35),0 5px 0 #321519;text-align:center}
.cabinet-brand-lockup{color:#fff2c4;text-shadow:none}
.cabinet-kicker{display:block;margin-bottom:4px;font:900 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;color:#552026}
.cabinet-brand-lockup strong{display:block;font:900 clamp(31px,8vw,58px)/.92 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;text-shadow:3px 3px 0 #632126,0 0 12px rgba(255,235,137,.42)}
.cabinet-brand-lockup em{font-style:normal;color:#74f1db}
.cabinet-light{display:block;width:18px;height:18px;border-radius:50%;justify-self:center;border:2px solid rgba(48,19,20,.7);box-shadow:inset 0 2px 2px rgba(255,255,255,.55),0 0 13px currentColor}
.light-red{color:#ef5b54;background:#ef5b54}.light-teal{color:#64efdc;background:#64efdc}
.cabinet-screen-frame{position:relative;z-index:1;margin:15px 8px 0;padding:9px;border:3px solid #241419;border-radius:9px 9px 15px 15px;background:#15171a;box-shadow:inset 0 0 0 2px #58302a,0 5px 0 #2e171c}
.cabinet-screen{position:relative;padding:18px 18px 16px;border:2px solid #3a5252;border-radius:4px;background:radial-gradient(circle at 50% 15%,rgba(35,111,99,.32),transparent 52%),#071513;color:#e8f3dd;box-shadow:inset 0 0 22px rgba(48,219,187,.11);overflow:hidden}
.cabinet-screen::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(236,255,205,.18) 4px,transparent 5px)}
.screen-header,.screen-divider,.home-game-list{position:relative;z-index:1}
.screen-header{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center}
.screen-header h1{max-width:15ch;margin:8px 0 8px;color:#f5edc5;font:900 clamp(27px,5.5vw,48px)/.96 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.01em;text-shadow:3px 3px 0 #0b2824}
.screen-header p{max-width:54ch;margin:0;color:#9fc3b4;font-size:12px;line-height:1.45}
.screen-header .rank-orb{width:88px;height:88px;background:radial-gradient(circle,rgba(242,193,78,.18),transparent 65%);border-color:rgba(242,193,78,.7);box-shadow:inset 0 0 25px rgba(242,193,78,.14),0 0 16px rgba(242,193,78,.12)}
.screen-divider{display:flex;align-items:center;gap:9px;margin:18px 0 10px;color:#65d9c0;font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.13em}
.screen-divider i{height:1px;flex:1;background:linear-gradient(90deg,rgba(101,217,192,.05),rgba(101,217,192,.65),rgba(101,217,192,.05))}
.home-game-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.home-game-entry{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:8px;min-width:0;min-height:95px;padding:10px 9px;border:1px solid #2a4d4a;border-radius:4px;background:linear-gradient(145deg,rgba(19,55,52,.88),rgba(8,26,26,.92));color:#e8f3dd;text-align:left;box-shadow:inset 0 0 0 1px rgba(119,242,210,.05);transition:transform .12s ease,border-color .12s ease,background .12s ease}
.home-game-entry:hover{border-color:#76f1d5;background:linear-gradient(145deg,rgba(25,78,70,.92),rgba(9,32,30,.96));transform:translateY(-2px)}
.home-game-entry:active{transform:translateY(1px)}
.home-game-entry:focus-visible{outline:2px solid #f5c95d;outline-offset:2px}
.home-game-index{align-self:start;color:#5fb29f;font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;padding-top:2px}
.home-game-icon{font-size:27px;line-height:1;filter:saturate(.75)}
.home-game-info{min-width:0}.home-game-info strong{display:block;overflow:hidden;color:#fff3c6;font:900 12px/1.1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.02em;text-overflow:ellipsis;white-space:nowrap}.home-game-info small{display:block;display:-webkit-box;margin-top:4px;overflow:hidden;color:#88afa2;font-size:10px;line-height:1.25;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.home-game-entry .game-tags{display:flex;gap:3px;margin-top:6px;overflow:hidden}.home-game-entry .game-tags i{font-style:normal;color:#e9c762;font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}.home-game-entry .game-tags i:not(:last-child)::after{content:" ·";color:#567f76}
.home-game-play{align-self:start;color:#64efdc;font:900 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;writing-mode:vertical-rl}.home-game-play b{font-size:13px;margin-top:4px}
.cabinet-control-deck{position:relative;z-index:1;display:grid;grid-template-columns:130px 1fr auto;gap:18px;align-items:center;margin:15px 8px 0;padding:14px 18px 13px;border:3px solid #2b151a;border-radius:10px 10px 19px 19px;background:linear-gradient(180deg,#593030,#321a22);box-shadow:inset 0 2px 0 rgba(248,215,120,.24),0 5px 0 #241319}
.cabinet-controls{display:flex;align-items:center;justify-content:space-around;gap:12px;height:60px}.cabinet-joystick{position:relative;width:38px;height:54px}.cabinet-joystick::before{content:"";position:absolute;left:16px;bottom:2px;width:8px;height:34px;border-radius:5px 5px 2px 2px;background:#1a2428;box-shadow:2px 0 0 #0b1113}.cabinet-joystick::after{content:"";position:absolute;left:8px;top:0;width:25px;height:25px;border-radius:50%;background:#e1584d;border:2px solid #6b2026;box-shadow:inset 3px 3px 0 rgba(255,255,255,.24),0 4px 0 #281114}.cabinet-joystick span{position:absolute;left:3px;bottom:0;width:33px;height:8px;border-radius:50%;background:#1a2428;border:2px solid #0b1113}.cabinet-buttons{display:flex;gap:7px;transform:rotate(-10deg)}.cabinet-buttons i{display:block;width:16px;height:16px;border-radius:50%;background:#f4c756;border:2px solid #7b4a25;box-shadow:inset 2px 2px 0 rgba(255,255,255,.32),0 3px 0 #241318}.cabinet-buttons i:nth-child(2){background:#61d6c2}.cabinet-buttons i:nth-child(3){background:#e1584d}
.cabinet-deck-copy{min-width:0}.cabinet-deck-copy .eyebrow{font-size:9px;color:#f0c85d}.cabinet-deck-copy p{margin:5px 0 0;color:#d09d92;font-size:11px;line-height:1.35}.cabinet-control-deck .primary{white-space:nowrap;min-height:45px}
.cabinet-foot{position:relative;z-index:1;display:flex;justify-content:space-between;padding:11px 12px 0;color:#d28c82;font:900 8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em}
@media(max-width:720px){.home-game-list{grid-template-columns:repeat(2,minmax(0,1fr))}.cabinet-control-deck{grid-template-columns:100px 1fr;gap:12px;padding:12px}.cabinet-control-deck .primary{grid-column:1/-1}.cabinet-controls{height:52px}.cabinet-deck-copy p{font-size:10px}}
@media(max-width:480px){.home-cabinet{margin-left:-2px;margin-right:-2px;padding:9px 8px 9px;border-radius:20px 20px 13px 13px}.cabinet-marquee{grid-template-columns:25px 1fr 25px;min-height:80px;padding:10px 7px}.cabinet-brand-lockup strong{font-size:30px}.cabinet-kicker{font-size:7px}.cabinet-light{width:14px;height:14px}.cabinet-screen-frame{margin:10px 3px 0;padding:6px}.cabinet-screen{padding:13px 10px 11px}.screen-header{grid-template-columns:1fr 62px;gap:7px}.screen-header h1{font-size:25px;margin:6px 0}.screen-header p{font-size:10px}.screen-header .rank-orb{width:62px;height:62px}.screen-header .rank-orb strong{font-size:19px}.screen-divider{gap:5px;font-size:7px;margin:13px 0 8px}.home-game-list{gap:5px}.home-game-entry{grid-template-columns:auto 1fr auto;min-height:91px;padding:8px 7px;gap:6px}.home-game-index{grid-row:1/3}.home-game-icon{font-size:23px}.home-game-info strong{font-size:10px}.home-game-info small{font-size:9px}.home-game-entry .game-tags{margin-top:5px}.home-game-play{font-size:8px}.cabinet-control-deck{margin:10px 3px 0;grid-template-columns:80px 1fr;padding:10px 9px;gap:8px}.cabinet-controls{gap:5px}.cabinet-deck-copy .eyebrow{font-size:7px}.cabinet-deck-copy p{font-size:9px}.cabinet-control-deck .primary{font-size:11px}.cabinet-foot{font-size:7px;padding:9px 5px 0}}
@media(max-width:360px){.home-game-entry{grid-template-columns:auto 1fr;min-height:82px}.home-game-play{grid-column:2;grid-row:2;writing-mode:horizontal-tb}.home-game-play b{margin:0}.home-game-icon{grid-row:1/3}.cabinet-control-deck{grid-template-columns:64px 1fr}.cabinet-controls{transform:scale(.86);transform-origin:left center}.cabinet-foot span:nth-child(2){display:none}}

/* --- Pixel arcade visual pass --- */
:root{
  --bg:#070b14;
  --panel:#101827;
  --panel2:#152238;
  --ink:#fff0cf;
  --muted:#87a4ad;
  --teal:#50f3d0;
  --red:#ff6480;
  --gold:#ffd15a;
  --blue:#7198ff;
  --purple:#aa7cff;
  --line:#244552;
  --green:#76e39b;
  --shadow:8px 8px 0 rgba(2,5,12,.8),0 20px 40px rgba(0,0,0,.25);
}

html{background:var(--bg)}
body{
  position:relative;
  overflow-x:hidden;
  font-family:"Courier New",ui-monospace,SFMono-Regular,Menlo,monospace;
  background:
    linear-gradient(rgba(80,243,208,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(80,243,208,.025) 1px,transparent 1px),
    radial-gradient(circle at 50% -12%,rgba(170,124,255,.26),transparent 34rem),
    radial-gradient(circle at 0% 40%,rgba(255,100,128,.10),transparent 26rem),
    var(--bg);
  background-size:32px 32px,32px 32px,auto,auto,auto;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:50;
  pointer-events:none;
  opacity:.07;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.55) 4px,transparent 5px);
  mix-blend-mode:screen;
}
body::after{
  content:"✦  ·  ✧  ·  ✦  ·  ✧  ·  ✦";
  position:fixed;
  top:94px;
  left:50%;
  z-index:0;
  width:100vw;
  color:rgba(255,209,90,.28);
  font-size:11px;
  letter-spacing:2.2em;
  white-space:nowrap;
  transform:translateX(-50%);
  pointer-events:none;
}

#app{position:relative;z-index:1;max-width:1080px}
.topbar{
  padding:16px 6px 18px;
  background:linear-gradient(var(--bg) 70%,transparent);
  backdrop-filter:none;
  border-bottom:2px solid rgba(80,243,208,.22);
}
.brand{gap:12px}
.brand-panda{
  display:grid;
  width:38px;
  height:38px;
  place-items:center;
  border:2px solid var(--teal);
  background:#0b1622;
  box-shadow:3px 3px 0 #142c3a;
  font-size:24px;
}
.brand strong,.brand small,.hud span,.score-pill,.eyebrow,
.primary,.ghost,.danger,.file-label,.bottom-nav button,
.home-game-entry,.game-card,.rush-copy h2,.micro-title-wrap h2,
.drop-header h2,.progress-header h2,.settings-card>label:first-child,
.cabinet-brand-lockup strong,.screen-header h1,.cabinet-deck-copy p,
.cabinet-foot,.screen-divider,.cabinet-kicker{font-family:"Courier New",ui-monospace,SFMono-Regular,Menlo,monospace}
.brand strong{color:var(--ink);letter-spacing:.12em}
.brand small{color:var(--muted);letter-spacing:.02em}
.hud{gap:6px}
.hud span,.score-pill{
  border-radius:2px;
  border:2px solid var(--line);
  background:#0b1320;
  box-shadow:3px 3px 0 #03060b;
  color:var(--gold);
}

h1,h2,h3,strong{font-family:"Courier New",ui-monospace,SFMono-Regular,Menlo,monospace}
.eyebrow{color:var(--teal);font-size:10px;text-shadow:0 0 8px rgba(80,243,208,.35)}
.rank-orb{border-radius:2px;transform:rotate(45deg);width:84px;height:84px;background:#12152b;border:2px solid var(--gold);box-shadow:4px 4px 0 #493a27,inset 0 0 0 3px #12152b}
.rank-orb>*{transform:rotate(-45deg)}
.rank-orb strong{color:var(--gold)}

.mission-card,.cabinet-intro,.drop-info,.question-stage,.progress-summary-box,.settings-card,.char-inspector,.rush-card{
  border-radius:2px;
  border:2px solid var(--line);
  box-shadow:var(--shadow);
  background:linear-gradient(135deg,rgba(21,34,56,.98),rgba(10,17,30,.98));
}
.mission-card{padding:18px;background:linear-gradient(135deg,#19263d,#101725)}
.section-heading h2{color:var(--ink);text-shadow:3px 3px 0 #111b2b}
.badge{border-radius:2px;border-width:2px;color:var(--teal);background:#0b1721;box-shadow:3px 3px 0 #071019}
.today-grid{gap:6px}
.today-char{border-radius:2px;border:2px solid #28414c;background:#0a1420;box-shadow:3px 3px 0 #071019}
.today-char strong{color:var(--ink)}
.today-char span{color:var(--gold);font-family:"Courier New",ui-monospace,SFMono-Regular,Menlo,monospace}
.today-char:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #071019}
.primary,.ghost,.danger,.file-label{border-radius:2px;min-height:44px}
.primary{border:2px solid #b1ffed;background:var(--teal);box-shadow:4px 4px 0 #09211f;color:#06131a;text-transform:uppercase}
.primary:hover{filter:brightness(1.08);box-shadow:5px 5px 0 #09211f}
.ghost,.file-label{border:2px solid #355563;background:#0b1522;color:var(--ink);box-shadow:3px 3px 0 #050910;text-transform:uppercase}
.danger{border:2px solid #ff91a3;border-radius:2px;box-shadow:3px 3px 0 #250d19}
.primary:active,.ghost:active,.danger:active,.file-label:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #050910}
.mission-meter,.boss-track{height:10px;border-radius:0;border:2px solid #1f3440;background:#070d17;padding:1px}
.mission-meter div,.boss-track div{background:repeating-linear-gradient(90deg,var(--teal) 0 12px,#b9ffdf 12px 15px,var(--teal) 15px 19px,var(--gold) 19px 23px);}
.mode-grid{gap:10px}
.mode-card{border-radius:2px;border:2px solid var(--line);background:#101827;box-shadow:5px 5px 0 #050910;transition:transform .12s ease,border-color .12s ease}
.mode-card.special{background:linear-gradient(135deg,#2c1e4e,#17233b);border-color:#8754bc}
.mode-card:hover{transform:translate(-2px,-2px);border-color:var(--teal)}
.mode-card:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #050910}
.mode-icon{filter:saturate(.8)}
.stats-strip div{border-top:2px solid var(--line)}
.stats-strip strong{font-family:"Courier New",ui-monospace,SFMono-Regular,Menlo,monospace}

.bottom-nav{
  background:#080d17;
  border-top:3px solid #2d5563;
  box-shadow:0 -6px 0 rgba(2,7,14,.85);
  padding-top:6px;
  backdrop-filter:none;
}
.bottom-nav button{border-radius:2px;color:#6b8b96;letter-spacing:.03em}
.bottom-nav button span{font-family:"Courier New",ui-monospace,SFMono-Regular,Menlo,monospace}
.bottom-nav button.active{color:var(--teal);background:#102b32;box-shadow:inset 0 -3px 0 var(--teal)}

.home-cabinet{
  margin-top:12px;
  border-radius:4px 4px 2px 2px;
  border:4px solid #41275e;
  background:linear-gradient(145deg,#43235b 0%,#24234d 42%,#11182e 100%);
  box-shadow:10px 12px 0 #050711,0 28px 50px rgba(0,0,0,.44),inset 0 0 0 2px rgba(255,209,90,.28);
}
.home-cabinet::before{opacity:.22;background:repeating-linear-gradient(135deg,transparent 0 18px,rgba(170,124,255,.18) 19px 20px,transparent 21px 44px)}
.home-cabinet::after{height:10px;border-radius:0;background:#080b14;box-shadow:0 -2px 0 var(--gold)}
.cabinet-marquee{
  border:4px solid #3b183f;
  border-radius:2px;
  background:linear-gradient(180deg,#ff7386 0%,#e4497a 47%,#9f2f65 100%);
  box-shadow:inset 0 0 0 3px rgba(255,228,149,.4),5px 6px 0 #24132e;
}
.cabinet-brand-lockup{color:#fff4cc}
.cabinet-kicker{color:#531b49}
.cabinet-brand-lockup strong{letter-spacing:.1em;text-shadow:4px 4px 0 #7a2757,0 0 12px rgba(255,238,171,.5)}
.cabinet-brand-lockup em{color:#55f4d3}
.cabinet-light{border-radius:2px;box-shadow:inset 2px 2px 0 rgba(255,255,255,.55),0 0 14px currentColor}
.cabinet-screen-frame{border:4px solid #1c1b30;border-radius:2px;background:#0e1220;box-shadow:inset 0 0 0 2px #704065,6px 6px 0 #24132f}
.cabinet-screen{border:3px solid #3e8885;border-radius:2px;background:radial-gradient(circle at 50% 15%,rgba(49,145,141,.28),transparent 52%),#06141a;box-shadow:inset 0 0 22px rgba(80,243,208,.16)}
.cabinet-screen::before{opacity:.2;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(236,255,205,.24) 4px,transparent 5px)}
.screen-header h1{color:#fff0bd;text-shadow:4px 4px 0 #0a2b2b}
.screen-divider{color:var(--teal)}
.home-game-entry{border:2px solid #285b5b;border-radius:2px;background:linear-gradient(145deg,rgba(20,69,66,.94),rgba(6,29,33,.96));box-shadow:3px 3px 0 #041015;}
.home-game-entry:hover{border-color:#a2ffdf;background:linear-gradient(145deg,rgba(35,103,91,.96),rgba(9,42,42,.98));transform:translate(-2px,-2px)}
.home-game-entry:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #041015}
.home-game-info strong{color:#fff3c6}
.home-game-play{color:var(--teal)}
.cabinet-control-deck{border:4px solid #24152f;border-radius:2px 2px 4px 4px;background:linear-gradient(180deg,#39264d,#201a35);box-shadow:inset 0 2px 0 rgba(248,215,120,.24),6px 6px 0 #100b18}
.cabinet-deck-copy .eyebrow{color:var(--gold)}
.cabinet-deck-copy p{color:#c59bad}
.cabinet-foot{color:#e3a0a7}

.arcade-header,.drop-header,.progress-header{border-bottom:2px solid rgba(80,243,208,.18);padding-bottom:10px}
.round-counter{color:var(--gold);text-shadow:3px 3px 0 #2b2032}
.question-stage{border-radius:2px;background:radial-gradient(circle at 50% 20%,rgba(113,152,255,.12),transparent 44%),#101827;box-shadow:var(--shadow),inset 0 0 0 3px #172b42}
.option-grid button,.sentence-tiles button,.sentence-answer span{border-radius:2px;border-width:2px;box-shadow:3px 3px 0 #050910;background:#0a1420}
.option-grid button:hover,.sentence-tiles button:hover{border-color:var(--teal);transform:translate(-1px,-1px)}
.feedback.good{color:var(--green);text-shadow:0 0 8px rgba(118,227,155,.35)}
.feedback.bad{color:#ff9aae}
.micro-stage{border-radius:2px;box-shadow:inset 0 0 0 3px #122b3b,6px 6px 0 #050910}
.micro-goalline{height:9px;border:2px solid #244552;padding:1px;background:#070d17}
.micro-goalline div{background:var(--gold);box-shadow:0 0 10px rgba(255,209,90,.5)}
.game-card{border-radius:2px;border-width:2px;background:#0c1420;box-shadow:5px 5px 0 #050910}
.game-card:hover{border-color:var(--teal);transform:translate(-2px,-2px)}
.game-card .game-tags i{border-radius:2px;border-width:2px}
.drop-info,.drop-quiz-card,.settings-card,.char-inspector{box-shadow:var(--shadow)}
.tetris-board{border-radius:2px;box-shadow:inset 0 0 0 3px #2d5663,6px 6px 0 #050910}
.touch-controls button{border-radius:2px;border-width:2px;box-shadow:3px 3px 0 #050910}
.hanzi-tile{border-radius:2px;border-width:2px;background:#0a1420}
.char-inspector{background:linear-gradient(135deg,#19263d,#101725)}
.inspector-char{color:var(--gold);text-shadow:4px 4px 0 #32263b}
.progress-summary-box strong{font-family:"Courier New",ui-monospace,SFMono-Regular,Menlo,monospace}

@media(max-width:680px){
  body::after{top:76px;font-size:9px;letter-spacing:1.3em}
  .topbar{padding-left:2px;padding-right:2px}
  .mission-card,.cabinet-intro,.drop-info,.settings-card,.char-inspector{box-shadow:4px 4px 0 rgba(2,5,12,.8)}
  .home-cabinet{box-shadow:6px 8px 0 #050711,0 18px 30px rgba(0,0,0,.42),inset 0 0 0 2px rgba(255,209,90,.28)}
  .cabinet-screen-frame,.cabinet-control-deck{box-shadow:inset 0 0 0 2px #704065,3px 3px 0 #24132f}
  .mode-card,.game-card{box-shadow:3px 3px 0 #050910}
}

/* --- Simple homepage: five-game start screen + cartridge library --- */
#app{max-width:1180px;padding-left:18px;padding-right:18px}
.topbar{
  display:grid;
  grid-template-columns:170px minmax(180px,1fr) auto;
  gap:20px;
  align-items:center;
  padding:13px 2px 12px;
  border-bottom:2px solid rgba(80,243,208,.25);
  background:linear-gradient(var(--bg) 78%,rgba(7,11,20,.88));
}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none}
.brand-panda{width:34px;height:34px;font-size:20px;border:2px solid var(--teal);box-shadow:3px 3px 0 #142c3a}
.brand-wordmark{font:900 15px/.82 "Courier New",ui-monospace,monospace;letter-spacing:.08em}
.brand-wordmark em{font-style:normal;color:var(--teal)}
.ticker{min-width:0}
.ticker-mask{overflow:hidden;border:1px solid #284552;background:#09121e;box-shadow:inset 0 0 0 2px #0d1c2b}
.ticker-track{display:flex;width:max-content;animation:ticker-scroll 34s linear infinite;color:var(--gold);font:900 10px/1 "Courier New",ui-monospace,monospace;letter-spacing:.06em;white-space:nowrap}
.ticker-track span{display:block;padding:10px 24px 9px}
@keyframes ticker-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.top-actions{display:flex;align-items:stretch;gap:7px}
.top-action,.top-stat{min-width:47px;border:2px solid #284552;background:#0b1320;color:var(--ink);box-shadow:3px 3px 0 #03060b}
.top-action{display:grid;place-items:center;align-content:center;padding:5px 8px;cursor:pointer}
.top-action:hover{border-color:var(--teal);color:var(--teal);transform:translateY(-1px)}
.top-action .action-icon{font:900 18px/1 "Courier New",ui-monospace,monospace;color:var(--gold)}
.top-action:hover .action-icon{color:var(--teal)}
.top-action small{margin-top:3px;color:var(--muted);font:900 8px/1 "Courier New",ui-monospace,monospace;letter-spacing:.06em}
.top-stat{display:grid;align-content:center;gap:4px;padding:5px 8px;min-width:72px}
.top-stat span{color:var(--muted);font:900 8px/1 "Courier New",ui-monospace,monospace;letter-spacing:.08em}
.top-stat strong{color:var(--gold);font:900 13px/1 "Courier New",ui-monospace,monospace;white-space:nowrap}
.score-stat strong{color:var(--teal)}
.bottom-nav{display:none}

.home-launch{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 230px;
  align-items:center;
  gap:24px;
  min-height:340px;
  margin:30px 0 42px;
  padding:46px 60px 26px;
  overflow:hidden;
  border:3px solid #39295e;
  background:
    linear-gradient(135deg,rgba(31,29,74,.96),rgba(9,19,36,.98)),
    #101827;
  box-shadow:10px 10px 0 #050711,0 22px 40px rgba(0,0,0,.28),inset 0 0 0 2px rgba(255,209,90,.18);
}
.home-launch::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.2;background:linear-gradient(rgba(80,243,208,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(80,243,208,.1) 1px,transparent 1px);background-size:28px 28px}
.home-launch::after{content:"";position:absolute;right:140px;top:-120px;width:370px;height:370px;border:2px solid rgba(255,209,90,.2);box-shadow:0 0 0 20px rgba(255,209,90,.025),0 0 0 40px rgba(255,209,90,.02);transform:rotate(45deg);pointer-events:none}
.launch-copy,.play-button,.launch-status,.launch-progress{position:relative;z-index:1}
.launch-copy{align-self:center}
.launch-copy h1{margin:11px 0 12px;color:var(--ink);font:900 clamp(44px,7vw,76px)/.86 "Courier New",ui-monospace,monospace;letter-spacing:.04em;text-shadow:5px 5px 0 #2e2150}
.launch-copy h1 em{font-style:normal;color:var(--pink,#ff6480)}
.launch-copy p{max-width:420px;margin:0;color:#a5bac4;font:700 12px/1.5 "Courier New",ui-monospace,monospace}
.launch-spark{position:absolute;z-index:1;color:var(--gold);font-size:24px;text-shadow:0 0 12px var(--gold);animation:spark-blink 1.4s steps(2,end) infinite}
.spark-one{left:33px;top:34px}.spark-two{right:45%;bottom:88px;font-size:16px;animation-delay:.5s}
@keyframes spark-blink{50%{opacity:.3;transform:scale(.8)}}
.play-button{justify-self:end;display:grid;place-items:center;align-content:center;width:200px;height:200px;padding:20px;border:4px solid #351631;background:linear-gradient(145deg,#ff7690 0%,#dd3e78 56%,#a82c68 100%);color:#fff5cf;box-shadow:10px 10px 0 #31173e,inset 0 0 0 3px rgba(255,237,167,.35),inset 0 -10px 0 rgba(106,21,72,.22);transform:rotate(-4deg);transition:transform .15s ease,filter .15s ease;animation:play-float 2.8s steps(4,end) infinite}
.play-button::before{content:"";position:absolute;inset:9px;border:2px dashed rgba(255,245,201,.58);pointer-events:none}
.play-button:hover{filter:brightness(1.1);transform:rotate(-2deg) translateY(-4px)}
.play-button:active{transform:rotate(-4deg) translate(5px,5px);box-shadow:4px 4px 0 #31173e}
.play-button-glow{position:absolute;inset:-24px;z-index:-1;background:#ff6480;opacity:.18;filter:blur(22px);animation:play-glow 1.7s ease-in-out infinite alternate}
.play-triangle{font-size:41px;line-height:1;margin-bottom:4px;text-shadow:3px 3px 0 #9c2c60}
.play-button strong{font:900 32px/1 "Courier New",ui-monospace,monospace;letter-spacing:.12em;text-shadow:3px 3px 0 #9c2c60}
.play-button small{margin-top:8px;font:900 9px/1 "Courier New",ui-monospace,monospace;letter-spacing:.14em}
@keyframes play-float{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(-2deg) translateY(-5px)}}
@keyframes play-glow{from{opacity:.12;transform:scale(.9)}to{opacity:.28;transform:scale(1.1)}}
.launch-status{grid-column:1/-1;display:flex;gap:18px;align-items:center;padding:11px 0 0;border-top:2px solid rgba(80,243,208,.18);color:var(--muted);font:900 9px/1 "Courier New",ui-monospace,monospace;letter-spacing:.08em}
.launch-status>span{white-space:nowrap}.launch-status>span:nth-child(2){color:var(--teal)}
.status-dot{display:inline-block;width:7px;height:7px;margin-right:5px;background:var(--green);box-shadow:0 0 9px var(--green)}
.launch-rank{margin-left:auto}.launch-rank b{color:var(--gold);font-size:14px}
.launch-progress{grid-column:1/-1;margin-top:-10px}
.progress-label{display:flex;justify-content:space-between;margin-bottom:5px;color:#78939d;font:900 8px/1 "Courier New",ui-monospace,monospace;letter-spacing:.08em}
.mission-meter{height:8px;margin:0;border:1px solid #244552;background:#070d17;padding:1px}
.mission-meter div{background:repeating-linear-gradient(90deg,var(--teal) 0 12px,#c2ffe6 12px 15px,var(--teal) 15px 20px);box-shadow:0 0 12px rgba(80,243,208,.35)}
.cartridge-library{position:relative;margin-bottom:30px}
.library-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:15px;padding-bottom:10px;border-bottom:2px solid rgba(80,243,208,.2)}
.library-heading h2{margin:6px 0 0;color:var(--ink);font:900 clamp(24px,4vw,34px)/1 "Courier New",ui-monospace,monospace;letter-spacing:.05em;text-shadow:3px 3px 0 #20284a}
.library-count{color:var(--gold);font:900 10px/1 "Courier New",ui-monospace,monospace;letter-spacing:.1em}
.cartridge-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.home-game-entry{position:relative;display:grid;grid-template-columns:24px 92px minmax(0,1fr) auto;align-items:center;gap:12px;min-width:0;min-height:148px;padding:13px 13px 13px 10px;overflow:hidden;color:var(--ink);text-align:left;border:2px solid #294655;border-radius:2px;background:linear-gradient(135deg,#111d2c,#0b1320);box-shadow:6px 6px 0 #050910;transition:transform .13s ease,border-color .13s ease,background .13s ease}
.home-game-entry::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.14;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.2) 4px,transparent 5px)}
.home-game-entry:hover{border-color:var(--teal);background:linear-gradient(135deg,#182d39,#0b1825);transform:translate(-2px,-2px)}
.home-game-entry:active{transform:translate(3px,3px);box-shadow:2px 2px 0 #050910}
.home-game-index{align-self:start;color:#58798b;font:900 10px/1 "Courier New",ui-monospace,monospace;padding-top:3px}
.cartridge-shell{position:relative;display:block;width:92px;height:112px;overflow:hidden;border:3px solid #1a2531;background:#1a222c;box-shadow:4px 4px 0 #050910;transform:rotate(-3deg)}
.cartridge-shell::before{content:"";position:absolute;left:9px;right:9px;top:12px;bottom:12px;z-index:1;border:2px solid rgba(255,209,90,.6);background:linear-gradient(135deg,rgba(55,30,87,.92),rgba(11,37,55,.94));box-shadow:inset 0 0 0 2px rgba(80,243,208,.17)}
.cartridge-shell i{position:absolute;z-index:2;inset:19px 12px 25px;display:grid;place-items:center;color:#fff0cf;font:900 27px/1 "Courier New",ui-monospace,monospace;font-style:normal;text-shadow:3px 3px 0 #2b1e45}
.cartridge-info{position:relative;z-index:1;min-width:0}
.cartridge-label{display:block;margin-bottom:5px;color:#6f9aa5;font:900 8px/1 "Courier New",ui-monospace,monospace;letter-spacing:.08em}
.home-game-info strong{display:block;overflow:hidden;color:var(--ink);font:900 clamp(13px,1.5vw,17px)/1.1 "Courier New",ui-monospace,monospace;letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap}
.home-game-info small{display:-webkit-box;margin-top:8px;overflow:hidden;color:#8ca6af;font:700 10px/1.35 "Courier New",ui-monospace,monospace;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.home-game-entry .game-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:9px;overflow:hidden}
.home-game-entry .game-tags i{font:900 8px/1 "Courier New",ui-monospace,monospace;font-style:normal;color:var(--gold);white-space:nowrap}
.home-game-entry .game-tags i:not(:last-child)::after{content:" ·";color:#4b7380}
.home-game-play{position:relative;z-index:1;align-self:start;color:var(--teal);font:900 9px/1 "Courier New",ui-monospace,monospace;letter-spacing:.08em;writing-mode:vertical-rl}
.home-game-play b{font-size:15px;margin-top:6px}
.home-footer-note{display:flex;justify-content:center;align-items:center;gap:12px;margin:8px 0 40px;color:#69818b;font:700 10px/1.4 "Courier New",ui-monospace,monospace;text-align:center}
.home-footer-note span{color:var(--gold);font-size:14px}

@media(max-width:900px){
  .topbar{grid-template-columns:150px minmax(130px,1fr) auto;gap:12px}
  .top-stat{min-width:62px}.cartridge-grid{grid-template-columns:1fr}
}
@media(max-width:680px){
  #app{padding-left:12px;padding-right:12px}
  .topbar{position:relative;grid-template-columns:1fr auto;gap:10px;padding-top:10px}
  .ticker{grid-column:1/-1;grid-row:2}
  .top-actions{gap:4px}.top-stat{min-width:58px;padding:5px 6px}.top-action{min-width:44px;min-height:44px;padding:4px 5px}.top-action small{font-size:9px}
  .brand-wordmark{font-size:13px}
  .home-launch{grid-template-columns:1fr 145px;gap:14px;min-height:310px;margin-top:20px;padding:34px 22px 22px}
  .launch-copy h1{font-size:clamp(39px,11vw,56px)}
  .launch-copy p{font-size:10px;max-width:290px}
  .play-button{width:145px;height:145px;padding:12px}.play-triangle{font-size:30px}.play-button strong{font-size:24px}.play-button small{font-size:7px}
  .launch-status{gap:9px;flex-wrap:wrap;font-size:8px}.launch-rank{margin-left:0}.launch-progress{margin-top:0}
  .cartridge-grid{gap:11px}.home-game-entry{grid-template-columns:21px 75px minmax(0,1fr) auto;gap:9px;min-height:128px;padding:10px 9px 10px 7px}.cartridge-shell{width:75px;height:96px}.cartridge-shell i{inset:16px 8px 21px;font-size:23px}.cartridge-shell::before{left:7px;right:7px;top:10px;bottom:10px}.home-game-info small{font-size:9px;margin-top:6px}.home-game-entry .game-tags{margin-top:6px}.home-game-play{font-size:8px}
}
@media(max-width:420px){
  .top-stat{min-width:50px}.top-stat span{font-size:7px}.top-stat strong{font-size:11px}.top-action small{font-size:9px}
  .home-launch{display:flex;flex-direction:column;align-items:center;text-align:center;padding:32px 18px 22px}.launch-copy p{max-width:250px}.launch-copy h1{font-size:47px}.play-button{width:164px;height:164px;margin:2px 0 3px}.launch-status{justify-content:center}.launch-rank{margin-left:0}.launch-progress{width:100%}
  .library-heading{align-items:center}.library-count{font-size:8px}.home-game-entry{grid-template-columns:18px 64px minmax(0,1fr) auto;gap:7px}.cartridge-shell{width:64px;height:86px}.cartridge-shell i{font-size:20px}.cartridge-label{font-size:7px}.home-game-info strong{font-size:11px}.home-game-info small{font-size:8px}.home-game-entry .game-tags i{font-size:7px}
}
@media(prefers-reduced-motion:reduce){.ticker-track{animation:ticker-scroll 34s linear infinite!important}.play-button,.play-button-glow,.launch-spark{animation:none}}

/* Accessibility and touch baseline. Keep the pixel treatment in borders and weight,
   not in controls that are too small to read or activate. */
button,.file-label{touch-action:manipulation}
.skip-link{position:fixed;left:8px;top:8px;z-index:120;transform:translateY(-160%);background:var(--gold);color:#071019;padding:10px 14px;font-weight:900;border:2px solid #071019}
.skip-link:focus{transform:translateY(0)}
button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.top-action{min-width:47px;min-height:47px}
.launch-review-button{justify-self:end;min-width:170px}
.privacy-note{font-size:12px;line-height:1.45;color:var(--muted);border-top:1px solid var(--line);padding-top:10px}
.save-error::before{content:"SAVE WARNING · EXPORT A BACKUP";position:fixed;left:0;right:0;bottom:0;z-index:100;background:#6e2030;color:#fff4cf;text-align:center;padding:8px;font-size:12px}
@media(max-width:680px){
  .top-action{min-width:44px;min-height:44px}
  .bottom-nav{display:grid}
  .launch-review-button{justify-self:auto;min-width:190px}
}
@media(max-width:420px){
  .top-action{min-width:44px;padding:4px 5px}
  .home-game-info small,.cabinet-deck-copy p{font-size:10px;line-height:1.35}
  .top-action small{font-size:8px}
}
@media(prefers-reduced-motion:reduce){*:not(.ticker-track):not(.train-convoy),*:not(.ticker-track):not(.train-convoy)::before,*:not(.ticker-track):not(.train-convoy)::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}

/* --- Chinese zodiac mastery stamp album --- */
.zodiac-collection{
  position:relative;
  margin:0 0 42px;
  padding:22px;
  border:3px solid #4a3269;
  background:linear-gradient(145deg,rgba(29,28,70,.98),rgba(10,19,36,.98));
  box-shadow:6px 7px 0 #050711,0 18px 34px rgba(0,0,0,.28),inset 0 0 0 2px rgba(255,209,90,.12);
  overflow:hidden;
}
.zodiac-collection::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;background:linear-gradient(rgba(80,243,208,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(80,243,208,.1) 1px,transparent 1px);background-size:24px 24px}
.zodiac-collection>*{position:relative;z-index:1}
.zodiac-collection-heading{display:flex;justify-content:space-between;align-items:end;gap:16px;padding-bottom:12px;border-bottom:2px solid rgba(80,243,208,.22)}
.zodiac-collection-heading h2{margin:6px 0 0;color:var(--ink);font:900 clamp(22px,4vw,32px)/1 "Courier New",ui-monospace,monospace;letter-spacing:.04em;text-shadow:3px 3px 0 #20284a}
.zodiac-stamp-count{color:var(--gold);font:900 10px/1 "Courier New",ui-monospace,monospace;letter-spacing:.1em;white-space:nowrap}
.zodiac-collection-copy{margin:12px 0 0;color:#9bb3b8;font-size:11px;line-height:1.4}
.zodiac-progress-line{display:flex;justify-content:space-between;gap:12px;margin:13px 0 15px;color:#a5bcc0;font:900 9px/1.3 "Courier New",ui-monospace,monospace;letter-spacing:.06em}
.zodiac-progress-line span:last-child{color:var(--teal);text-align:right}
.zodiac-stamp-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.zodiac-stamp{display:grid;justify-items:center;align-content:start;gap:4px;min-width:0;min-height:125px;padding:10px 5px 8px;border:2px solid #294855;background:linear-gradient(145deg,#0d1b2b,#09121f);box-shadow:3px 3px 0 #050910;text-align:center}
.zodiac-stamp-medallion{display:grid;place-items:center;width:56px;height:56px;border:2px solid #4c6175;border-radius:50%;background:radial-gradient(circle at 35% 30%,#2b4960,#0e1c2c 68%);font-size:31px;line-height:1;filter:grayscale(1);opacity:.28}
.zodiac-stamp strong{overflow:hidden;max-width:100%;color:#75919b;font:900 10px/1.1 "Courier New",ui-monospace,monospace;text-overflow:ellipsis;white-space:nowrap}
.zodiac-stamp small{color:#617c88;font:900 9px/1 "Courier New",ui-monospace,monospace}
.zodiac-stamp b{color:#55717d;font:900 7px/1 "Courier New",ui-monospace,monospace;letter-spacing:.08em}
.zodiac-stamp.earned{border-color:#8f6f2c;background:linear-gradient(145deg,rgba(87,61,31,.9),rgba(17,28,39,.98));box-shadow:3px 3px 0 #050910,0 0 14px rgba(255,209,90,.12)}
.zodiac-stamp.earned .zodiac-stamp-medallion{border-color:var(--gold);background:radial-gradient(circle at 35% 30%,#ffe6a1,#a66e27 60%,#30232a 100%);filter:none;opacity:1;box-shadow:inset 0 0 0 3px rgba(255,255,255,.1),0 0 12px rgba(255,209,90,.32)}
.zodiac-stamp.earned strong{color:#fff0bd}.zodiac-stamp.earned small{color:#e4bd63}.zodiac-stamp.earned b{color:var(--green)}
.zodiac-view-button{display:block;margin:16px auto 0;min-height:38px;padding:8px 12px;font-size:9px}
.zodiac-toast{position:fixed;top:calc(74px + env(safe-area-inset-top));left:50%;z-index:100;display:flex;align-items:center;gap:11px;width:min(420px,calc(100vw - 28px));padding:11px 14px;border:3px solid var(--gold);background:linear-gradient(145deg,#37284d,#151c32);box-shadow:5px 5px 0 #050711,0 12px 30px rgba(0,0,0,.42);opacity:0;pointer-events:none;transform:translate(-50%,-18px);transition:opacity .2s ease,transform .2s ease}
.zodiac-toast.show{opacity:1;transform:translate(-50%,0)}
.zodiac-toast-icon{display:grid;place-items:center;flex:none;width:42px;height:42px;border:2px solid var(--gold);border-radius:50%;background:#9e692c;font-size:25px}
.zodiac-toast strong,.zodiac-toast small{display:block;font-family:"Courier New",ui-monospace,monospace}.zodiac-toast strong{color:#fff0bd;font-size:11px;letter-spacing:.05em}.zodiac-toast small{margin-top:4px;color:#b8cbd0;font-size:9px;letter-spacing:.04em}
body.reduced-motion .zodiac-toast{transition:none}
@media(max-width:900px){.zodiac-stamp-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:560px){.zodiac-collection{padding:15px 11px;margin-bottom:30px}.zodiac-collection-heading{align-items:start;flex-direction:column;gap:8px}.zodiac-progress-line{align-items:start;flex-direction:column;gap:4px}.zodiac-progress-line span:last-child{text-align:left}.zodiac-stamp-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.zodiac-stamp{min-height:114px;padding:8px 3px 7px}.zodiac-stamp-medallion{width:46px;height:46px;font-size:25px}.zodiac-stamp strong{font-size:9px}.zodiac-stamp small{font-size:8px}.zodiac-toast{top:calc(66px + env(safe-area-inset-top))}}

/* --- Home cabinet columns + compact progress-page stamp drawer --- */
.cartridge-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.zodiac-drawer{margin:0 0 16px;border:2px solid #385867;background:linear-gradient(145deg,#121f32,#0b1422);box-shadow:4px 4px 0 #050910}
.zodiac-drawer-toggle{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:14px;width:100%;min-height:62px;padding:10px 13px;border:0;background:transparent;color:var(--ink);text-align:left}
.zodiac-drawer-toggle:hover{background:rgba(80,243,208,.06)}
.zodiac-drawer-toggle-copy{display:grid;gap:5px;min-width:0}
.zodiac-drawer-toggle-copy strong{overflow:hidden;color:#fff0bd;font:900 13px/1 "Courier New",ui-monospace,monospace;letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap}
.zodiac-drawer-toggle .zodiac-stamp-count{font-size:9px}
.zodiac-drawer-chevron{color:var(--teal);font:900 22px/1 "Courier New",ui-monospace,monospace;transition:transform .18s ease}
.zodiac-drawer-toggle[aria-expanded="true"] .zodiac-drawer-chevron{transform:rotate(45deg)}
.zodiac-drawer-panel{padding:0 13px 14px;border-top:1px solid rgba(80,243,208,.2)}
.zodiac-drawer-panel .zodiac-collection-copy{margin-top:12px}
.zodiac-drawer-panel .zodiac-stamp-grid{margin-top:13px}
@media(max-width:900px){.cartridge-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.cartridge-grid{grid-template-columns:1fr}.zodiac-drawer-toggle{grid-template-columns:minmax(0,1fr) auto;gap:8px}.zodiac-drawer-toggle .zodiac-stamp-count{grid-column:1}.zodiac-drawer-chevron{grid-column:2;grid-row:1/3;align-self:center}}
@media(prefers-reduced-motion:reduce){.zodiac-drawer-chevron{transition:none}}

/* Only the tall Cadet table needs page scrolling; review games should keep arrow keys in-game. */
body:has(#viewMicro.active .pinball-embed-shell){overflow-x:hidden;overflow-y:auto}
#app:has(#viewMicro.active .pinball-embed-shell){height:auto;min-height:100vh;overflow:visible;padding-bottom:calc(92px + env(safe-area-inset-bottom))}
body:has(#viewMicro.active .doom-review-shell){overflow:hidden}

/* Keep long ritual copy readable inside the fixed-size card. */
.textbox{min-width:0;min-height:0;overflow:auto;overflow-wrap:anywhere;word-break:break-word}
.textbox .rules,.textbox .lore{min-width:0;overflow-wrap:anywhere;word-break:break-word}

/* --- Word Train: load, depart, and inbound convoy pass --- */
.train-board{display:flex;flex-direction:column;min-height:100%;position:relative}
.train-board .micro-instruction{margin-bottom:4px;color:#83b9c1}
.train-word{display:flex;flex-direction:column;align-items:center;gap:4px;margin:0;color:#fff0cf;line-height:1.1;text-shadow:2px 2px 0 #07101d}
.train-word strong{font-size:clamp(24px,7vw,36px);letter-spacing:.08em;color:var(--gold)}
.train-word small{font:900 10px/1.25 "Courier New",ui-monospace,monospace;letter-spacing:.08em;color:#a3c5c9}
.train-options{display:flex;justify-content:center;gap:10px;width:100%;max-width:500px;margin:14px auto 0;position:relative;z-index:5}
.train-options button{position:relative;min-width:76px;min-height:64px;padding:5px 13px;border:2px solid #31596a;border-radius:3px;background:linear-gradient(145deg,#142b3c,#0a1725);box-shadow:4px 4px 0 #050910,inset 0 0 0 2px rgba(80,243,208,.06);color:var(--ink);font:900 35px/1 "PingFang SC","Noto Sans CJK SC",sans-serif;transition:transform .12s ease,background .12s ease,border-color .12s ease,filter .12s ease}
.train-options button::after{content:"LOAD";display:block;margin-top:5px;color:#75a8b2;font:900 7px/1 "Courier New",ui-monospace,monospace;letter-spacing:.12em}
.train-options button:hover{border-color:var(--teal);background:linear-gradient(145deg,#1b4250,#0c1d2c);transform:translateY(-3px);filter:brightness(1.1)}
.train-options button.correct{border-color:var(--green);background:linear-gradient(145deg,rgba(118,227,155,.28),#0c2930);color:#d8ffe4}
.train-options button.wrong{border-color:var(--red);background:linear-gradient(145deg,rgba(255,100,128,.2),#281a2c);color:#ffb1ba}
.train-options button.train-choice-load{animation:trainChoiceLoad .62s cubic-bezier(.2,.8,.2,1) both}
.train-options button.train-choice-drop{animation:trainChoiceDrop .6s cubic-bezier(.4,0,.9,.25) both}
@keyframes trainChoiceLoad{35%{transform:translateY(-10px) scale(1.05);filter:brightness(1.35)}100%{transform:translateY(4px) scale(.9);opacity:.35}}
@keyframes trainChoiceDrop{20%{transform:translateY(5px) rotate(-7deg)}55%{transform:translateY(28px) rotate(9deg)}100%{transform:translateY(15px) rotate(12deg);opacity:.25}}
.train-yard{position:relative;isolation:isolate;flex:1;min-height:265px;margin:16px 0 0;overflow:hidden;border:3px solid #294f68;border-radius:4px;background:radial-gradient(circle at 76% 16%,rgba(255,209,90,.2) 0 1px,transparent 2px),radial-gradient(circle at 14% 28%,rgba(80,243,208,.25) 0 1px,transparent 2px),linear-gradient(180deg,#101b3a 0%,#111831 57%,#19233a 58%,#101522 100%);box-shadow:inset 0 0 0 3px #0b1427,6px 6px 0 #050910}
.train-yard::before{content:"";position:absolute;left:0;right:0;bottom:53px;height:70px;opacity:.4;background:linear-gradient(135deg,transparent 0 10%,#182b49 10% 24%,transparent 24% 33%,#1b3150 33% 48%,transparent 48% 60%,#172d49 60% 77%,transparent 77%),linear-gradient(180deg,transparent 0 45%,#0b1324 45%);clip-path:polygon(0 100%,0 43%,9% 43%,12% 20%,16% 43%,24% 43%,27% 4%,33% 43%,41% 43%,46% 25%,51% 43%,58% 43%,63% 10%,71% 43%,79% 43%,84% 30%,90% 43%,100% 43%,100% 100%)}
.train-yard::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:10;background:repeating-linear-gradient(0deg,transparent 0 5px,rgba(134,224,222,.045) 6px 7px),linear-gradient(90deg,transparent 0 49%,rgba(255,255,255,.045) 50%,transparent 51%)}
.train-yard-grid{position:absolute;inset:0;z-index:-1;opacity:.35;background-image:linear-gradient(rgba(80,243,208,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(80,243,208,.1) 1px,transparent 1px);background-size:26px 26px;transform:perspective(180px) rotateX(48deg) scale(1.8);transform-origin:bottom}
.train-route{position:absolute;top:10px;left:13px;right:13px;display:flex;justify-content:space-between;gap:10px;color:#78a5b0;font:900 8px/1 "Courier New",ui-monospace,monospace;letter-spacing:.1em}
.train-route strong{color:var(--gold);white-space:nowrap}
.train-convoy{position:absolute;left:50%;bottom:64px;display:flex;align-items:end;gap:0;z-index:3;width:max-content;transform:translateX(-50%);filter:drop-shadow(0 9px 0 rgba(0,0,0,.35));will-change:transform,opacity}
.train-convoy.train-arrive{animation:trainArrival .78s cubic-bezier(.15,.75,.25,1) both}
.train-yard.train-departing .train-convoy{animation:trainDeparture .92s cubic-bezier(.45,.05,.8,.3) both}
.train-yard.train-mistake .train-convoy{animation:trainJolt .28s steps(2,end) both}
@keyframes trainArrival{from{transform:translateX(-145%);opacity:.1;filter:drop-shadow(0 9px 0 rgba(0,0,0,.35)) saturate(.55)}70%{opacity:1}to{transform:translateX(-50%);opacity:1;filter:drop-shadow(0 9px 0 rgba(0,0,0,.35))}}
@keyframes trainDeparture{0%{transform:translateX(-50%);opacity:1}12%{transform:translateX(-47%) translateY(-2px)}100%{transform:translateX(145%);opacity:0}}
@keyframes trainJolt{50%{transform:translateX(calc(-50% + 7px))}100%{transform:translateX(-50%)}}
.train-locomotive,.train-wagon{position:relative;flex:0 0 auto;height:82px;border:3px solid #3f7890;background:linear-gradient(180deg,#1b4354 0%,#11263b 58%,#0b1526 59%);box-shadow:inset 0 0 0 2px rgba(80,243,208,.1),inset 0 -9px 0 rgba(0,0,0,.24)}
.train-locomotive{width:clamp(82px,24vw,112px);border-color:#5c8fac;border-radius:8px 20px 4px 4px;background:linear-gradient(180deg,#24777c 0%,#17465d 58%,#0b1c31 59%)}
.train-locomotive::before{content:"";position:absolute;left:13px;top:-19px;width:13px;height:22px;border:3px solid #4d8190;border-bottom:0;border-radius:7px 7px 0 0;background:#10243a}
.train-locomotive::after{content:"";position:absolute;right:-11px;bottom:5px;width:18px;height:24px;border-right:3px solid #6e9aac;border-bottom:3px solid #6e9aac;transform:skewX(24deg);background:linear-gradient(225deg,transparent 45%,#1d394a 46%)}
.train-wagon{width:clamp(72px,22vw,100px);border-radius:4px;background:linear-gradient(180deg,#5c3f80 0%,#382856 58%,#15142d 59%);border-color:#906bb0}
.train-wagon + .train-coupler + .train-wagon{background:linear-gradient(180deg,#a05069 0%,#602b58 58%,#28172f 59%);border-color:#d47888}
.train-wagon-target{background:linear-gradient(180deg,#725429 0%,#4a3226 58%,#211a25 59%);border-color:#e2ae4d;box-shadow:inset 0 0 0 2px rgba(255,209,90,.14),0 0 13px rgba(255,209,90,.16),inset 0 -9px 0 rgba(0,0,0,.24)}
.train-wagon-target::after{content:"LOAD";position:absolute;right:5px;top:5px;color:#f7d47b;font:900 7px/1 "Courier New",ui-monospace,monospace;letter-spacing:.08em}
.train-wagon-window{position:relative;display:inline-block;width:21%;height:18px;margin:12px 2px 0;border:2px solid rgba(180,242,239,.4);background:#14283a;box-shadow:inset 0 0 0 2px rgba(80,243,208,.08)}
.train-wagon-character{position:absolute;inset:28px 0 4px;display:grid;place-items:center;color:#fff1d1;font:900 clamp(28px,7vw,38px)/1 "PingFang SC","Noto Sans CJK SC",sans-serif;text-shadow:3px 3px 0 rgba(7,10,22,.6)}
.train-wagon-target .train-wagon-character{color:#ffd15a;text-shadow:0 0 10px rgba(255,209,90,.65),3px 3px 0 rgba(7,10,22,.7)}
.train-wagon-target.train-loaded{animation:trainWagonLoaded .55s ease-out both}
.train-wagon-target.train-loaded .train-wagon-character{color:#d8ffe4;text-shadow:0 0 12px rgba(118,227,155,.85),3px 3px 0 rgba(7,10,22,.7)}
@keyframes trainWagonLoaded{35%{transform:translateY(-7px);filter:brightness(1.4)}100%{transform:translateY(0);filter:brightness(1)}}
.train-wagon small,.train-cabin small{position:absolute;bottom:4px;left:0;right:0;text-align:center;color:rgba(223,239,225,.56);font:900 6px/1 "Courier New",ui-monospace,monospace;letter-spacing:.1em}
.train-cabin{position:absolute;left:34%;top:20px;width:42%;height:42px;border:2px solid #86c7bd;background:linear-gradient(135deg,#123f4b,#1b293c);color:#ffd15a;text-align:center;box-shadow:inset 0 0 0 2px rgba(255,209,90,.12)}
.train-cabin b{display:block;font:900 24px/.9 "PingFang SC","Noto Sans CJK SC",sans-serif;text-shadow:2px 2px 0 #142035}
.train-headlight{position:absolute;right:6px;top:28px;color:#fff3a1;font-size:17px;text-shadow:0 0 9px #ffd15a}
.train-stack{position:absolute;left:12px;top:-23px;width:15px;height:11px;border:3px solid #4d8190;border-bottom:0;border-radius:7px 7px 0 0;background:#0e2237}
.train-smoke{position:absolute;left:11px;top:-37px;color:#86c7bd;font-size:8px;opacity:.6;animation:trainSmoke 1.1s ease-out infinite}
.train-smoke.smoke-two{left:1px;top:-49px;font-size:6px;animation-delay:.3s}
@keyframes trainSmoke{to{transform:translate(-4px,-11px) scale(1.5);opacity:0}}
.train-cowcatcher{position:absolute;right:-9px;bottom:-4px;color:#82b9bd;font-size:23px;line-height:1;transform:rotate(10deg)}
.train-coupler{display:grid;place-items:center;width:16px;height:18px;margin-bottom:7px;color:#e0b75b;font-size:8px;text-shadow:0 0 5px rgba(255,209,90,.5)}
.train-wheel{position:absolute;bottom:-14px;width:24px;height:24px;border:3px solid #172034;border-radius:50%;background:#26374b;box-shadow:inset 0 0 0 4px #73828c,0 3px 0 #050910}
.train-wheel::after{content:"";position:absolute;inset:6px;border-radius:50%;background:#172034}
.train-locomotive .wheel-left,.train-wagon .wheel-left{left:13px}.train-locomotive .wheel-right,.train-wagon .wheel-right{right:13px}
.train-rail{position:absolute;left:0;right:0;z-index:1;height:4px;background:#9aaab0;box-shadow:0 0 0 2px #111b2b,0 0 8px rgba(80,243,208,.18)}
.train-rail::after{content:"";position:absolute;inset:-8px 0;background:repeating-linear-gradient(90deg,transparent 0 17px,#7e5d43 17px 25px,transparent 25px 43px);z-index:-1}
.rail-top{bottom:44px}.rail-bottom{bottom:32px;background:#536e7b}
.train-signal{position:absolute;right:10%;bottom:67px;width:16px;height:60px;border-left:4px solid #657a8e;z-index:2}
.train-signal::before{content:"";position:absolute;left:-10px;top:0;width:20px;height:31px;border:2px solid #426278;border-radius:3px;background:#0b1526;box-shadow:inset 0 -2px 0 #050910}
.train-signal i,.train-signal b,.train-signal em{position:absolute;left:-4px;width:6px;height:6px;border-radius:50%;background:#ff6480;box-shadow:0 0 7px currentColor}.train-signal i{top:5px;color:#ff6480}.train-signal b{top:13px;color:#ffd15a;background:#ffd15a}.train-signal em{top:21px;color:#76e39b;background:#76e39b}
.train-falling-hanzi{position:absolute;left:50%;top:27px;z-index:8;color:#ff9eaa;font:900 38px/1 "PingFang SC","Noto Sans CJK SC",sans-serif;text-shadow:3px 3px 0 #24152f;opacity:0;pointer-events:none}
.train-falling-hanzi.train-fall{animation:trainFall .68s cubic-bezier(.5,.05,.85,.32) both}
@keyframes trainFall{0%{transform:translate(-50%,-10px) rotate(-8deg) scale(1.1);opacity:0}14%{opacity:1}72%{transform:translate(calc(-50% + 18px),155px) rotate(18deg) scale(.92);opacity:1}100%{transform:translate(calc(-50% + 25px),205px) rotate(34deg) scale(.65);opacity:0}}
.train-ground-mark{position:absolute;left:calc(50% + 22px);bottom:26px;color:#ff6480;font:900 18px/1 "Courier New",ui-monospace,monospace;opacity:0}
.train-yard.train-mistake .train-ground-mark{animation:groundMark .68s ease-out .43s both}
@keyframes groundMark{0%{opacity:0;transform:scale(.6)}65%{opacity:.9;transform:scale(1.2)}100%{opacity:0;transform:scale(1)}}
@media(max-width:680px){
  .train-yard{min-height:250px;margin-top:13px}.train-convoy{bottom:59px}.train-rail{transform:scaleX(1.02)}.train-signal{right:5%;bottom:62px}.rail-top{bottom:40px}.rail-bottom{bottom:28px}.train-wagon-window{margin-top:11px}.train-wagon-character{top:26px;bottom:4px}.train-falling-hanzi{top:26px}
}
@media(max-width:390px){
  .train-options{gap:6px;margin-top:11px}.train-options button{min-width:65px;min-height:58px;padding:4px 9px;font-size:30px}.train-options button::after{font-size:6px}.train-yard{min-height:232px}.train-locomotive,.train-wagon{height:73px}.train-coupler{width:11px;font-size:6px}.train-wheel{width:20px;height:20px;bottom:-12px}.train-locomotive .wheel-left,.train-wagon .wheel-left{left:8px}.train-locomotive .wheel-right,.train-wagon .wheel-right{right:8px}.train-wagon-character{font-size:31px}.train-cabin b{font-size:20px}.train-cabin{top:18px;height:38px}.train-signal{transform:scale(.8);transform-origin:bottom right}.rail-top{bottom:37px}.rail-bottom{bottom:25px}.train-convoy{bottom:53px}.train-falling-hanzi{font-size:32px}
}
@media(prefers-reduced-motion:reduce){.train-convoy,.train-smoke,.train-falling-hanzi,.train-ground-mark,.train-options button,.train-wagon-target{animation:none!important;transition:none!important}.train-falling-hanzi.train-fall{opacity:0}.train-yard.train-departing .train-convoy{transform:translateX(-50%);opacity:1}}
@media(prefers-reduced-motion:reduce){.train-convoy.train-arrive{animation:trainArrival .78s cubic-bezier(.15,.75,.25,1) both!important}.train-yard.train-departing .train-convoy{animation:trainDeparture .92s cubic-bezier(.45,.05,.8,.3) both!important}}
/* Sound Catch keyboard navigation should not imitate pointer hover. */
.sound-hunt .sound-bubble.keyboard-selected:not(:hover){z-index:2;outline:none!important;filter:brightness(.34) saturate(.55);box-shadow:0 0 0 3px #071521,0 0 18px rgba(80,243,208,.25);transform:translate(-50%,-50%)}

/* Hanzi Pong cartridge */
.pong-shell{display:flex;flex-direction:column;gap:8px;min-height:100%;font-family:"Courier New",ui-monospace,SFMono-Regular,Menlo,monospace}
.pong-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--gold);font-size:10px;letter-spacing:.1em}
.pong-topline strong{font-size:13px;color:var(--ink)}
.pong-mode{display:inline-block;margin-left:10px;color:var(--teal);font-size:9px}
.pong-cpu{color:var(--muted);white-space:nowrap}.pong-cpu b{color:var(--gold)}
.pong-court{position:relative;overflow:hidden;border:3px solid #344d57;background:#000;box-shadow:inset 0 0 0 3px #111a1e,5px 5px 0 #050910}
.pong-canvas{display:block;width:100%;height:auto;aspect-ratio:720/430;background:#050505;image-rendering:pixelated;touch-action:none}
.pong-scoreboard{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;text-align:center;color:var(--muted)}
.pong-scoreboard div{display:grid;gap:2px}.pong-scoreboard small{font-size:9px;letter-spacing:.12em}.pong-scoreboard strong{font-size:25px;color:var(--ink)}
.pong-feedback{min-width:100px;color:var(--gold);font-size:10px;font-weight:900;letter-spacing:.06em}
.pong-controls{display:grid;grid-template-columns:1fr 1fr auto;gap:7px;margin-top:2px}
.pong-controls button{min-height:48px;padding:8px 10px;border:2px solid #405259;border-radius:3px;background:#111c20;color:var(--ink);box-shadow:3px 3px 0 #050910;font:900 11px "Courier New",ui-monospace,monospace;letter-spacing:.06em;touch-action:manipulation}
.pong-controls button:hover,.pong-controls button:focus-visible{border-color:var(--teal);color:#fff7d1}.pong-controls button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #050910}
.pong-controls .pong-pause{background:#2a2119;border-color:#b3954d;color:var(--gold)}
.pong-hint{margin:0;color:#8ea0a6;font:900 9px/1.35 "Courier New",ui-monospace,monospace;letter-spacing:.06em;text-align:center}
@media(max-width:520px){
  .pong-topline{font-size:9px}.pong-topline strong{font-size:11px}.pong-mode{margin-left:6px;font-size:8px}
  .pong-scoreboard strong{font-size:22px}.pong-controls{grid-template-columns:1fr 1fr}.pong-controls .pong-pause{grid-column:1/-1}
}