/* Part 7 · arcade feedback. Fixed layer, pointer-events:none, transform/opacity only → zero layout shift. */
.fx-layer{position:fixed;inset:0;z-index:40;pointer-events:none;overflow:hidden}
.fx-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.fx-burst{position:fixed;transform:translate(-50%,-50%);font:800 16px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.02em;white-space:nowrap;text-shadow:0 2px 0 #000,0 0 12px currentColor;animation:fx-rise 1.5s cubic-bezier(.2,.7,.3,1) forwards}
.fx-burst.big{font-size:26px}
.fx-burst.gain{color:#6ce8b5}.fx-burst.loss{color:#ff858b;animation-name:fx-sink}.fx-burst.xp{color:#e3bc69;font-size:13px}.fx-burst.gold{color:#ffd84d}
@keyframes fx-rise{0%{opacity:0;transform:translate(-50%,-30%) scale(.7)}15%{opacity:1;transform:translate(-50%,-60%) scale(1.08)}100%{opacity:0;transform:translate(-50%,-210%) scale(1)}}
@keyframes fx-sink{0%{opacity:0;transform:translate(-50%,-50%)}15%{opacity:1}100%{opacity:0;transform:translate(-50%,40%)}}
.fx-banner{position:fixed;left:50%;top:max(14px,env(safe-area-inset-top));transform:translate(-50%,0);width:min(440px,calc(100vw - 20px));padding:10px 14px 11px;background:#0b1512f2;border:1px solid #638873;box-shadow:0 12px 34px #000c;text-align:center;font:12px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace;animation:fx-drop .42s steps(5,end)}
.fx-banner small{display:block;color:#8aa39f;letter-spacing:.16em;font-size:10px}
.fx-banner strong{display:block;margin:3px 0 2px;font:400 clamp(15px,4.2vw,21px)/1.2 "Astoria Pixel",ui-monospace,monospace;letter-spacing:.02em;color:#e9f3f2}
.fx-banner span{display:block;color:#b9d8ce;font-size:11px}
.fx-banner.out{animation:fx-lift .4s ease-in forwards}
.fx-banner.achievement{border-color:#dcb675}.fx-banner.achievement strong{color:#ffd08a}
.fx-banner.level{border-color:#e3bc69;background:#171207f2}.fx-banner.level strong{color:#ffd84d}
.fx-banner.tier{border-color:#5cf0bf}.fx-banner.tier strong{color:#6ce8b5}
.fx-banner.unlock{border-color:#7c8cf8}.fx-banner.unlock strong{color:#b8c1ff}
.fx-banner.record{border-color:#ffd84d;background:#1a1405f5;box-shadow:0 0 0 1px #6b5418,0 14px 40px #000,0 0 36px #ffd84d44}.fx-banner.record strong{color:#ffd84d;font-size:clamp(20px,6vw,28px)}
.fx-banner.ticker{border-color:#dcb675;text-align:left}.fx-banner.ticker.red{border-color:#ff858b}.fx-banner.ticker.red strong{color:#ff858b}.fx-banner.ticker.green{border-color:#6ce8b5}.fx-banner.ticker.green strong{color:#6ce8b5}.fx-banner.ticker.amber strong{color:#ffd08a}
@keyframes fx-drop{from{opacity:0;transform:translate(-50%,-24px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes fx-lift{to{opacity:0;transform:translate(-50%,-20px)}}
.fx-flash{position:fixed;inset:0;opacity:0;animation:fx-flash .8s ease-out}
.fx-flash.gold{background:radial-gradient(circle at 50% 40%,#ffd84d33,transparent 70%)}.fx-flash.teal{background:radial-gradient(circle at 50% 40%,#5cf0bf2b,transparent 70%)}.fx-flash.red{background:radial-gradient(circle at 50% 50%,#ff3b4640,transparent 75%)}.fx-flash.green{background:radial-gradient(circle at 50% 40%,#6ce8b52b,transparent 70%)}
@keyframes fx-flash{15%{opacity:1}100%{opacity:0}}
.fx-bit{position:fixed;top:-12px;width:7px;height:7px;animation:fx-fall var(--dur,2s) linear forwards}
.fx-bit.c0{background:#ffd84d}.fx-bit.c1{background:#6ce8b5}.fx-bit.c2{background:#dcb675}.fx-bit.c3{background:#e9f3f2}
@keyframes fx-fall{to{transform:translate(var(--dx,0),105vh) rotate(540deg);opacity:.2}}
main.fx-shake{animation:fx-shake .5s steps(8,end)}
@keyframes fx-shake{0%,100%{transform:none}20%{transform:translate(-4px,1px)}40%{transform:translate(4px,-1px)}60%{transform:translate(-3px,0)}80%{transform:translate(2px,1px)}}
@media(prefers-reduced-motion:reduce){.fx-burst,.fx-banner,.fx-banner.out{animation-duration:.01s}.fx-flash,.fx-bit{display:none}main.fx-shake{animation:none}}
body.is-bankrupt .fx-banner{visibility:hidden}

/* Run screen additions (summary, title, high score, board) */
.bankrupt-card{max-height:calc(100dvh - 32px)}
.bankrupt-card[data-mode="complete"],.bankrupt-card[data-mode="live"]{border-color:#638873;background:#081315;box-shadow:0 20px 60px #000,0 0 40px #5cf0bf1f}
.bankrupt-card[data-mode="complete"] h2,.bankrupt-card[data-mode="live"] h2{color:#6ce8b5;text-shadow:0 0 14px #5cf0bf44;animation:none}
.bankrupt-card[data-mode="complete"] .bankrupt-kicker,.bankrupt-card[data-mode="live"] .bankrupt-kicker{color:#8aa39f}
.bankrupt-card[data-mode="complete"] .bankrupt-primary,.bankrupt-card[data-mode="live"] .bankrupt-primary{background:#17392d;border-color:#6ce8b5;color:#eafff6}
.bankrupt-card[data-mode="complete"] .bankrupt-stats,.bankrupt-card[data-mode="live"] .bankrupt-stats{background:#1d2f2b;border-color:#1d2f2b}
.bankrupt-card[data-mode="complete"] .bankrupt-stats div,.bankrupt-card[data-mode="live"] .bankrupt-stats div{background:#0b1714}
.bankrupt-stats strong{font-size:14px}.bankrupt-stats .up strong{color:#6ce8b5}.bankrupt-stats .down strong{color:#ff9aa0}
.run-high{margin:14px 0 4px;padding:10px 12px;border:1px solid #675239;background:#140f07;text-align:center}
.run-high small{display:block;color:#b99a66;letter-spacing:.16em;font-size:10px}
.run-high strong{display:block;margin:2px 0;font:400 22px/1.2 "Astoria Pixel",ui-monospace,monospace;color:#ffd08a;letter-spacing:.04em}
.run-high span{display:block;color:#a99d86;font-size:10px;letter-spacing:.04em}
.run-high-bar{display:block;height:4px;margin-top:7px;background:#2d2415}.run-high-bar b{display:block;height:100%;background:#dcb675}
.run-high.record{border-color:#ffd84d;background:#1a1405;box-shadow:0 0 24px #ffd84d33;animation:run-glow 1.6s ease-in-out infinite}
.run-high.record small{color:#ffd84d}.run-high.record strong{color:#ffd84d;font-size:28px;text-shadow:0 0 14px #ffd84d66}
@keyframes run-glow{50%{box-shadow:0 0 36px #ffd84d55}}
.run-persona{margin:12px 0 0}
.run-persona small{display:block;color:#a98c87;letter-spacing:.14em;font-size:10px}
.run-persona strong{display:block;margin:2px 0;font:400 19px/1.2 "Astoria Pixel",ui-monospace,monospace;color:#e9b06c;letter-spacing:.05em}
.run-persona span{display:block;color:#bfa9a4;font-size:11px}
.bankrupt-card[data-mode="complete"] .run-persona span,.bankrupt-card[data-mode="live"] .run-persona span{color:#9ab6aa}
.run-board{margin:4px 0 12px;text-align:left}
.run-board-head{display:flex;justify-content:space-between;color:#8f7a76;font-size:10px;letter-spacing:.1em;padding:0 2px 5px;border-bottom:1px solid #3a2a26}
.run-board ol{list-style:none;margin:0;padding:0}
.run-board li{display:grid;grid-template-columns:34px auto 1fr;gap:8px;align-items:baseline;padding:6px 2px;border-bottom:1px solid #2a1d1a;font-variant-numeric:tabular-nums}
.run-board li b{color:#8f7a76}.run-board li strong{color:#f1e4e1}.run-board li span{color:#a98c87;font-size:10px;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.run-board li.current{background:#2a2410;outline:1px solid #6b5418}.run-board li.current strong,.run-board li.current b{color:#ffd84d}
.run-board li.empty{display:block;color:#8f7a76;font-size:11px}
@media(prefers-reduced-motion:reduce){.run-high.record{animation:none}}
.session-summary-btn{width:100%;min-height:38px;margin:2px 0 4px;border:1px solid #dcb675;background:#1a1407;color:#ffd08a;font:700 11px ui-monospace,monospace;letter-spacing:.06em;cursor:pointer}

/* Part 8 · arcade HUD score, sound toggle, name entry, leaderboard rows */
.hud-score{display:inline-flex;align-items:baseline;gap:5px;font:700 12px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.04em;white-space:nowrap}
.hud-score small{color:#8aa39f;font-size:10px;letter-spacing:.12em}
.hud-score b{color:#ffd08a;font-variant-numeric:tabular-nums;margin-right:6px}
.hud-score.record b:first-of-type{color:#ffd84d;text-shadow:0 0 10px #ffd84d88}
.sound-toggle{min-height:30px;padding:4px 8px;border:1px solid #675239;background:transparent;color:#e9b06c;font:700 10px ui-monospace,monospace;letter-spacing:.08em;cursor:pointer;border-radius:1px}
.sound-toggle.off{color:#7d8f8b;border-color:#3b4a44}
@media(max-width:720px){.topright .beta-tag{display:none}.topright{gap:8px}.hud-score{flex-direction:column;align-items:flex-end;gap:0;font-size:11px;line-height:1.25}.hud-score small{display:none}.hud-score b{margin:0}.hud-score b::before{color:#8aa39f;font-size:9px;margin-right:4px;letter-spacing:.1em}.hud-score b:first-of-type::before{content:'SCORE'}.hud-score b:last-of-type::before{content:'HI'}}

.name-slots{display:flex;justify-content:center;gap:6px;margin:10px 0 8px;cursor:text}
.name-slots span{width:38px;height:46px;display:grid;place-items:center;border-bottom:3px solid #6b5418;background:#1a1407;font:400 26px/1 "Astoria Pixel",ui-monospace,monospace;color:#ffd08a}
.name-slots span.active{border-bottom-color:#ffd84d;color:#ffd84d;animation:name-blink 1s steps(1,end) infinite}
.name-input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;left:50%;top:50%}
.name-pad{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:8px}
.name-pad button{min-height:40px;background:#1a1407;border:1px solid #6b5418;color:#ffd08a;font:700 15px ui-monospace,monospace;cursor:pointer}
@keyframes name-blink{50%{opacity:.35}}

@media(max-width:720px){.topright>span.hud-score:first-child{display:flex}.sound-toggle{padding:4px 6px}}
@media(max-width:400px){.brand small{display:none}.topright .pill{font-size:10px;padding:5px 7px}}
/* Part 8 · arena text lines reserve fixed height on phones (the bot-flow line wrapped 1↔2 lines and shifted the page). */
#arenaFlow,#arenaResult,#arenaHeadline{min-height:2.7em;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
#arenaHeadline{min-height:38px}
@media(max-width:720px){.arena-top{min-height:47px}}
/* Beta final · arcade name entry + shared board (leaderboard.js mount) */
.shared-board{margin-top:12px;padding-top:10px;border-top:1px solid #3d6456;color:#bdd8c5;font:11px ui-monospace,SFMono-Regular,Consolas,monospace;text-align:left}
.arcade-entry{position:relative;margin:8px 0 6px;padding:12px 10px 10px;border:1px solid #6b5418;background:#120e05;text-align:center}
.entry-label{display:block;color:#ffd84d;letter-spacing:.2em;font-size:10px;animation:name-blink 1.1s steps(1,end) infinite}
.shared-save{width:100%;min-height:42px;background:#3a2d0c;border:1px solid #ffd84d;color:#fff4cf;font:700 12px ui-monospace,monospace;letter-spacing:.12em;cursor:pointer}
.shared-save:disabled{opacity:.5;cursor:default}
.shared-status{display:block;min-height:15px;margin:6px 0;color:#e9b06c;font-size:10px;letter-spacing:.08em}
.shared-rows{list-style:none;margin:0;padding:0}
.shared-rows li{display:grid;grid-template-columns:38px 1fr auto;gap:8px;align-items:baseline;padding:6px 4px;border-bottom:1px solid #1d2f2b;font-variant-numeric:tabular-nums}
.shared-rows li b{color:#8aa39f}.shared-rows li em{font-style:normal;color:#ffd08a;letter-spacing:.14em}.shared-rows li strong{color:#dbf3da}
.shared-rows li.medal-1 b,.shared-rows li.medal-1 em{color:#ffd84d;text-shadow:0 0 8px #ffd84d66}.shared-rows li.medal-2 b,.shared-rows li.medal-2 em{color:#d9e2e0}.shared-rows li.medal-3 b,.shared-rows li.medal-3 em{color:#d99a62}
.shared-rows li.mine{background:#2a2410;outline:1px solid #6b5418}.shared-rows li.empty{display:block;color:#8f7a76}
.arcade-sounds{width:100%;margin:0 0 8px;min-height:36px;padding:7px 9px;background:#142820;border:1px solid #658567;color:#dfd3a4;font:700 11px ui-monospace,monospace;letter-spacing:.08em;cursor:pointer}
.hud-score b.down{color:#ff9aa0}
@media(prefers-reduced-motion:reduce){.entry-label,.name-slots span.active{animation:none}}


/* exact two-line boxes (min-height alone left a 1px wobble when text wrapped) */
#arenaFlow,#arenaResult{line-height:1.4;height:2.8em;min-height:0}

/* v21 · name-taken alert: centred at the top of the entry, red, shakes once (transform only → no layout shift) */
.name-alert{margin:0 0 10px;padding:9px 10px 8px;border:2px solid #ff5a64;background:#2a0b0d;box-shadow:0 0 18px #ff3b4640,inset 0 0 12px #ff3b4622;text-align:center}
.name-alert[hidden]{display:none}
.name-alert strong{display:block;font:400 clamp(18px,5.4vw,24px)/1.15 "Astoria Pixel",ui-monospace,monospace;letter-spacing:.08em;color:#ff5a64;text-shadow:0 0 10px #ff3b4688}
.name-alert span{display:block;margin-top:4px;color:#ffb3b8;font:700 10px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.1em}
.name-slots.bad span{border-bottom-color:#ff5a64;color:#ff9aa0;background:#210b0c}
.shake{animation:name-shake .42s cubic-bezier(.36,.07,.19,.97) both}
@keyframes name-shake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}30%,50%,70%{transform:translateX(-7px)}40%,60%{transform:translateX(7px)}}
@media(prefers-reduced-motion:reduce){.shake{animation:none}}
