/* Additive arcade shell. All game rules and scene art live in their own modules. */
.arcade-app{--arc-accent:#8fe8f6;--arc-ink:#080e1b;--arc-muted:#adbed0;font: max(16pt,1rem)/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f3f7ff;isolation:isolate;position:relative;display:flex;flex-direction:column;width:calc(100% - 32px);max-width:2100px;margin:16px auto;background:var(--arc-ink);border:1px solid #52627a;border-radius:22px;overflow:hidden;box-shadow:0 24px 80px #030d2540;outline:none!important;height:calc(100dvh - var(--arc-site-offset,180px));min-height:480px}
.arcade-app *{box-sizing:border-box}.arcade-app [hidden]{display:none!important}.arcade-app :where(p,span,small,strong,label,input,select,button,a,li,div){font-size:inherit}.arcade-app :is(button,input,select){font-family:inherit}.arcade-app button{cursor:pointer}.arcade-app :is(button,a,input,select):focus-visible{outline:3px solid var(--arc-accent);outline-offset:3px}.arcade-app button:disabled{opacity:.45;cursor:default}
.arc-header{display:flex;align-items:center;gap:16px;justify-content:space-between;padding:14px 20px;border-bottom:1px solid #7489ac40;background:linear-gradient(120deg,#1b263b,#101725);flex-shrink:0;z-index:3}.arc-brand{display:flex;gap:14px;align-items:center;min-width:0;flex-shrink:0}.arc-brand a{color:var(--arc-muted);display:grid;place-items:center;width:48px;height:48px;border:1px solid #68819d80;border-radius:13px;text-decoration:none}.arc-brand a svg{width:28px;height:28px}.arc-title{font-weight:750;letter-spacing:-.025em;line-height:1.1;color:#fff}.arc-tools{display:flex;align-items:center;gap:8px}.arc-tool{display:grid;place-items:center;width:50px;height:50px;border:1px solid #7891b05c;border-radius:13px;color:#e5edfa;background:#c6e4ff08;padding:10px}.arc-tool:hover,.arc-touch button:hover{background:#a4d6ff24;border-color:var(--arc-accent)}.arc-tool svg{width:28px;height:28px}
.arc-hud{flex-shrink:0;display:flex;justify-content:center;align-items:center;gap:12px 38px;padding:8px 18px;background:#0b1425;border-bottom:1px solid #728bab33;min-height:66px}.arc-stat{display:flex;align-items:baseline;gap:12px;min-width:0;line-height:1.25;white-space:nowrap}.arc-stat span{color:#adbed0}.arc-stat strong{overflow-wrap:anywhere}.arc-stat strong{color:var(--arc-accent);font-variant-numeric:tabular-nums;font-weight:750}.arc-playfield{position:relative;flex:1;min-height:0;background:#040a13;overflow:hidden;display:grid;place-items:center}.arc-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none;outline:none}.arc-playfield::after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid #b5c9ff0a;box-shadow:inset 0 0 70px #00000025}
.arc-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background:linear-gradient(110deg,#070d20e8,#080e2199);z-index:2;padding:24px;overflow:auto}.arc-welcome{width:min(660px,100%);margin:auto;padding:30px;border:1px solid #a7c4f34d;border-radius:24px;background:linear-gradient(145deg,#172438ed,#0a1325f5);box-shadow:0 25px 90px #0008;backdrop-filter:blur(12px)}.arc-kicker{color:var(--arc-accent);font-weight:650;letter-spacing:.06em;margin:0 0 14px}.arc-welcome h1{font-size:clamp(30pt,4vw,52pt);line-height:1.04;letter-spacing:-.045em;margin:0 0 20px;font-weight:800;color:#fff}.arc-welcome p{color:#becddd;margin:14px 0 22px}.arc-start-row{display:flex;flex-wrap:wrap;gap:12px}.arc-button{font:inherit;min-height:52px;border-radius:12px;border:1px solid #b5cee86b;background:#9acbff12;color:#f2f7ff;padding:11px 20px;text-decoration:none;display:inline-flex;justify-content:center;align-items:center;gap:10px}.arc-button--primary{background:var(--arc-accent);color:#081222;border-color:var(--arc-accent);font-weight:750;box-shadow:0 6px 25px color-mix(in srgb,var(--arc-accent) 17%,transparent)}.arc-button:hover{filter:brightness(1.12)}.arc-note{border-top:1px solid #8aa8d035;padding-top:16px;margin-bottom:0!important}.arc-note a{color:var(--arc-accent)}
.arc-bottom{flex-shrink:0;padding:10px 18px 12px;border-top:1px solid #768baa40;background:#0e1829;display:flex;gap:12px;justify-content:center;align-items:center}.arc-touch{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.arc-touch button{font:inherit;border:1px solid #8da8cc6b;border-radius:12px;background:linear-gradient(#1b2d45,#132037);color:#f3f7ff;min-width:58px;min-height:52px;padding:8px 14px;touch-action:none;user-select:none;-webkit-user-select:none}.arc-touch button[aria-pressed=true]{background:var(--arc-accent);color:#061023;transform:translateY(2px)}.arc-hint{color:#a8bad0;margin:0}.arc-toast{position:absolute;top:18px;left:50%;transform:translateX(-50%);max-width:90%;background:#10283aee;border:1px solid var(--arc-accent);border-radius:14px;padding:12px 20px;color:#fff;z-index:4;pointer-events:none;text-align:center;box-shadow:0 10px 25px #0006}
.arcade-app .gr-dialog{background:#111e32;border-color:#738aa9;color:#eff5ff}.arcade-app .gr-dialog__head{background:#17263d}.arcade-app .gr-dialog__head h2{color:#f4f8ff}.arcade-app .gr-dialog h3{color:var(--arc-accent)}.arcade-app .gr-dialog p{color:#c5d2e2}.arcade-app .gr-dialog__body{overflow-y:auto;overscroll-behavior:contain}.arc-help-toc{display:flex;gap:10px;flex-wrap:wrap;border-bottom:1px solid #7793b54a;padding:0 0 20px;margin-bottom:22px}.arc-help-toc button{font:inherit;padding:10px 16px;min-height:50px;border:1px solid #7391b375;border-radius:11px;background:#abc5ff0c;color:#e1edff}.arc-help-toc button[aria-current=page]{background:var(--arc-accent);color:#071323;border-color:var(--arc-accent)}.arc-help-article h3{margin-top:0}.arc-help-nav{display:flex;gap:12px;justify-content:space-between;margin-top:24px;padding-top:20px;border-top:1px solid #799ab844}.arc-setting{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 20px;align-items:center;padding:18px 0;border-bottom:1px solid #7796b73b}.arc-setting input[type=range]{grid-column:1/-1;width:100%}.arc-setting select{max-width:100%}.arc-records{display:grid;gap:16px}.arc-record{display:flex;justify-content:space-between;gap:18px;padding:20px;border:1px solid #8badce55;border-radius:14px;background:#10243b}.arc-record strong{color:var(--arc-accent);font-variant-numeric:tabular-nums}
.arcade-app:fullscreen,.arcade-app.arc-immersive{width:100%;height:100dvh!important;max-width:none;min-height:0;margin:0;border:0;border-radius:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.arcade-app.arc-immersive{position:fixed;inset:0;z-index:2147483000}.arc-immersive-page{overflow:hidden!important}
@media(max-width:850px){.arc-title{max-width:170px}.arc-header{padding:10px 14px;gap:10px}.arc-brand{gap:10px}.arc-tools{gap:5px}.arc-tool{width:46px;height:46px;padding:9px}.arc-hud{gap:22px}.arc-stat{display:block;text-align:center}.arc-stat span{display:block}.arc-stat strong{display:block}}
@media(max-width:600px){.arcade-app{width:100%;margin:0;border-radius:0;border-left:0;border-right:0;min-height:420px}.arc-header{padding:8px 10px}.arc-title{display:none}.arc-brand a{width:44px;height:44px}.arc-tools{gap:5px}.arc-tool{width:44px;height:44px;border-radius:10px}.arc-hud{padding:7px 8px;gap:10px;justify-content:space-around;min-height:62px}.arc-stat{flex:1}.arc-welcome{padding:22px;border-radius:17px}.arc-welcome h1{font-size:30pt}.arc-overlay{padding:16px}.arc-welcome p{line-height:1.4;margin:12px 0 18px}.arc-note{padding-top:12px}.arc-bottom{padding:8px}.arc-touch{gap:6px}.arc-touch button{min-width:48px;padding:8px 10px}.arc-hint{display:none}.arc-toast{padding:9px 14px;top:10px}.arc-setting{grid-template-columns:1fr auto;gap:10px}.arc-setting select{grid-column:1/-1}}
@media(max-height:520px) and (orientation:landscape){.arcade-app{min-height:300px}.arc-header{padding:5px 12px}.arc-title{font-size:inherit;max-width:none}.arc-hud{min-height:43px;padding:4px 12px}.arc-stat{display:flex;gap:10px}.arc-stat :is(strong,span){display:inline}.arc-tool{height:44px;width:44px}.arc-brand a{width:44px;height:44px}.arc-bottom{padding:5px}.arc-touch button{min-height:44px;padding:5px 14px}.arc-welcome{padding:18px;max-width:760px}.arc-welcome h1{font-size:27pt;margin-bottom:10px}.arc-kicker{margin-bottom:8px}.arc-welcome p{margin:8px 0 12px}.arc-note{display:none}.arc-start-row{display:inline-flex}}
@media(prefers-reduced-motion:reduce){.arcade-app *{scroll-behavior:auto!important;transition:none!important}.arc-touch button[aria-pressed=true]{transform:none}}

@media(max-width:365px){.arc-header{flex-wrap:wrap;justify-content:center;gap:6px}.arc-brand{width:100%;justify-content:center}.arc-title{display:block;max-width:none}.arc-tools{width:100%;justify-content:space-between}.arc-stat{white-space:normal}.arc-hud{gap:5px}.arc-stat strong{overflow-wrap:anywhere}}

body.ksw-game-canvas .arcade-app{width:100%;height:100dvh!important;min-height:0;max-width:none;margin:0;border:0;border-radius:0}

/* Playing surfaces keep selection gestures for editable controls only. */
.arcade-app{-webkit-user-select:none;user-select:none}.arcade-app :is(input,textarea,[contenteditable=true]){-webkit-user-select:text;user-select:text}
.arc-exit-actions{display:grid;gap:20px;margin-top:24px}.arc-exit-actions>*{width:100%}.arc-button--danger{background:#8d303a;color:#fff;border-color:#e8868d}.arc-button--danger:hover{background:#a13b45}

/* Optional engine detail stays readable outside the scaled canvas. */
.arc-status{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 24px;flex-shrink:0;padding:5px 18px;border-bottom:1px solid #728bab33;background:#0b1425;line-height:1.3}
.arc-status__item{display:flex;flex-wrap:wrap;gap:0 8px;min-width:0;max-width:100%;overflow-wrap:anywhere}.arc-status__item>span{color:var(--arc-muted)}.arc-status__item>strong{color:var(--arc-accent);font-weight:650;font-variant-numeric:tabular-nums;min-width:0;overflow-wrap:anywhere}
@media(max-width:600px){.arc-status{padding:4px 8px;gap:4px 16px}}

/* Keep leaving a paused run visually separate from Resume and Help. */
.arc-pause-exit{margin-top:24px;padding-top:20px;border-top:1px solid #8aa8d035}.arc-pause-exit>button{width:100%}

/* Keep full scores legible instead of clipping long values on narrow HUDs. */
.arc-stat strong{min-width:0;white-space:normal}

/* One handbook structure across arcade games and Pirate Quest. */
.arc-help-toc{display:block;padding-bottom:24px}.arc-help-toc h3{display:flex;align-items:center;gap:12px;margin-top:0}.arc-help-toc ol{list-style:none;display:grid;gap:8px;padding:0;margin:0}.arc-help-toc li{min-width:0}.arc-help-toc button{display:flex;align-items:center;gap:12px;width:100%;text-align:left;cursor:pointer}.arc-help-toc button>span{flex:1;min-width:0;overflow-wrap:anywhere}.arc-help-toc button svg{flex-shrink:0}.arc-help-sections{display:grid;gap:14px}.arc-help-section{border:1px solid #7391b375;border-radius:14px;overflow:hidden;min-width:0;scroll-margin-top:16px}.arc-help-section summary{list-style:none;display:flex;align-items:center;gap:12px;padding:18px;color:var(--arc-accent);cursor:pointer;font-weight:700}.arc-help-section summary::-webkit-details-marker{display:none}.arc-help-section summary svg{flex-shrink:0}.arc-help-disclosure{display:inline-block;flex-shrink:0;transition:transform .15s}.arc-help-section[open] .arc-help-disclosure{transform:rotate(90deg)}.arc-help-article{padding:0 20px 12px}.arc-help-article>:last-child{margin-bottom:8px}.arc-help-section summary:hover,.arc-help-toc button:hover{background:#aacfff12}.arc-help-section summary:focus-visible{outline:3px solid var(--arc-accent);outline-offset:-3px}

/* Shared account panels keep full names and scores readable at every width. */
.arc-board-tabs{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}.arc-board-tabs>button{flex:1;min-width:0}.arc-board-results{margin-top:20px}.arc-leaderboard{list-style:none;padding:0;margin:0;display:grid}.arc-leaderboard>li{display:grid;grid-template-columns:3ch minmax(0,1fr) auto;gap:12px;align-items:center;padding:16px 0;border-bottom:1px solid #7796b73b}.arc-leaderboard>li:last-child{border-bottom:0}.arc-leaderboard>li>span:nth-child(2){min-width:0;overflow-wrap:anywhere}.arc-leaderboard>li>strong{font-variant-numeric:tabular-nums;color:var(--arc-accent)}.arc-board-rank{color:var(--arc-muted)}.arc-leaderboard-own{background:#b7d9ff0b;box-shadow:0 0 0 10px #b7d9ff0b}.arc-setting:last-of-type{border-bottom:0}.arc-help-section summary>span:last-child{min-width:0;overflow-wrap:anywhere}.arc-help-article :is(p,li){overflow-wrap:anywhere}.arc-start-row>*{min-width:0}
@media(max-width:600px){.arc-start-row{display:grid;grid-template-columns:1fr}.arc-start-row>*{width:100%}.arc-leaderboard>li{grid-template-columns:3ch minmax(0,1fr);gap:6px 12px}.arc-leaderboard>li>strong{grid-column:2}.arc-help-section summary{padding:16px 12px;gap:10px}.arc-help-article{padding:0 14px 12px}}

/* Narrow HUD details use one compact label/value row instead of stacked words. */
@media(max-width:365px){.arc-status{display:grid;grid-template-columns:minmax(0,1fr);gap:3px;padding:5px 8px}.arc-status__item{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:nowrap;gap:10px;max-width:none}.arc-status__item>span{min-width:0}.arc-status__item>strong{text-align:right}}

/* Seven full-size icon targets share one narrow row; smaller phones keep the fallback. */
@media(min-width:320px) and (max-width:365px){.arc-header{display:grid;grid-template-columns:repeat(7,44px);justify-content:space-between;gap:0;padding:6px 0}.arc-header .arc-brand,.arc-header .arc-tools{display:contents}.arc-header .arc-title{display:none}.arc-header :is(.arc-tool,.arc-brand a){width:44px;height:44px;min-width:44px;min-height:44px}.arc-header :is(button,a):focus-visible{outline-offset:-3px}}

/* HUD labels wrap inside their own cell without clipping or shrinking type. */
.arc-stat>span{white-space:normal;overflow-wrap:anywhere;min-width:0}

/* Readable status labels at phone widths, without splitting ordinary words. */
.arcade-app .arc-stat>span{font-size:14px;line-height:1.25;overflow-wrap:normal}
.arcade-app .arc-stat>strong{font-size:20px;line-height:1.25}
.arcade-app .arc-status__item>span{font-size:14px;line-height:1.35;overflow-wrap:normal}
.arcade-app .arc-status__item>strong{font-size:16px;line-height:1.35}
@media(max-width:600px){.arcade-app .arc-hud{min-height:56px}.arcade-app .arc-stat>strong{font-size:18px}}

/* The scoreboard belongs to the game frame. Its measured height reserves a
 * separate canvas rectangle, so a small screen never hides objects under HUD. */
.arcade-app .arc-playfield{display:block;background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--arc-accent) 11%,#070d1d),#030712 75%)}
.arc-scene-frame{position:absolute;inset:0;min-width:0;min-height:0;overflow:hidden}
.arc-scoreboard{position:absolute;inset:0 0 auto;z-index:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;width:100%;background:linear-gradient(110deg,#101a2bf5,#091322f5);box-shadow:0 1px 0 #96bded30;overflow-wrap:anywhere}
.arc-scoreboard .arc-hud{display:flex;flex:1 1 420px;justify-content:space-evenly;align-items:center;gap:6px 16px;min-width:0;min-height:40px;padding:6px 12px;background:transparent;border:0}
.arc-scoreboard .arc-stat{display:flex;flex:0 1 auto;align-items:center;justify-content:center;gap:7px;min-width:0;line-height:1.2;text-align:center;white-space:normal}
.arc-scoreboard .arc-stat>strong{display:block;min-width:0;font-size:18px;line-height:1.2;overflow-wrap:anywhere;color:#fff}
.arc-scoreboard .arc-stat>.arc-stat-label{display:none;font-size:14px;line-height:1.2;color:#c7d4e9}
.arc-stat-icon{display:grid;flex:0 0 22px;place-items:center;width:22px;height:22px;color:var(--arc-accent);font-style:normal}
.arc-stat-icon>svg{width:22px;height:22px}
.arc-scoreboard .arc-status{display:flex;flex:1 1 250px;justify-content:center;align-items:center;gap:4px 20px;min-width:0;min-height:32px;padding:4px 12px;background:transparent;border:0}
.arc-scoreboard .arc-status__item{display:flex;flex:0 1 auto;flex-wrap:wrap;justify-content:center;align-items:center;gap:3px 6px;max-width:100%;min-width:0;line-height:1.25;white-space:normal}
.arc-scoreboard .arc-status__item>span,.arc-scoreboard .arc-status__item>strong{font-size:14px;line-height:1.25;white-space:normal;overflow-wrap:anywhere}
.arc-scoreboard .arc-status__item>strong{font-weight:700;color:var(--arc-accent)}
.arc-scoreboard .arc-status__item>.gr-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.arc-scoreboard .arc-status__item--preview{gap:6px;flex-wrap:nowrap;min-height:32px}
.arc-preview-flow{display:grid;place-items:center;font-style:normal;color:#b7cae3}
.arc-orb-preview{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border:1px solid #ffffffbd;border-radius:50%;color:#fff;background:radial-gradient(circle at 30% 25%,#ffffffae,var(--arc-orb) 36%,color-mix(in srgb,var(--arc-orb),#030c30 40%) 100%);box-shadow:inset -2px -3px 5px #06162a77,0 0 10px color-mix(in srgb,var(--arc-orb) 25%,transparent)}
.arc-orb-preview>svg{width:19px;height:19px;filter:drop-shadow(0 1px 1px #06162a77)}
.arcade-app .arc-toast{top:calc(var(--arc-scoreboard-height,40px) + 6px);bottom:auto;max-width:calc(100% - 24px);font-size:14px;line-height:1.35;padding:6px 12px}
.arcade-app .arc-bottom{padding:6px 10px;gap:0;min-width:0}
.arcade-app .arc-hint{display:none}
.arcade-app .arc-touch{gap:6px;flex-wrap:nowrap;max-width:100%;width:100%}
.arcade-app .arc-touch button{flex:0 1 auto;min-width:44px;min-height:44px;padding:6px 12px;font-size:14px;line-height:1.2}
@media(hover:hover) and (pointer:fine){.arcade-app:not(.arc-show-controls) .arc-bottom{display:none}}
@media(any-pointer:coarse){.arcade-app .arc-bottom{display:flex}}
@media(min-width:1000px) and (min-height:601px){.arc-scoreboard .arc-stat>.arc-stat-label{display:block}.arc-scoreboard .arc-stat>strong{font-size:20px}}
@media(max-width:600px){.arc-scoreboard .arc-hud{flex-basis:100%;gap:4px 8px;padding:5px 8px;min-height:36px}.arc-scoreboard .arc-stat{flex:1;gap:5px}.arc-scoreboard .arc-status{gap:4px 14px;flex-basis:100%;padding:4px 8px}.arcade-app .arc-touch button{padding:6px 8px}.arcade-app .arc-bottom{padding:5px 6px}}
@media(max-width:365px){.arc-scoreboard .arc-status{display:flex;grid-template-columns:none}.arc-scoreboard .arc-status__item{flex:0 1 auto;justify-content:center}.arcade-app .arc-touch{gap:4px}.arcade-app .arc-touch button{min-width:44px;padding:6px 4px}}
@media(max-height:520px){.arcade-app .arc-header{padding:5px 10px}.arcade-app .arc-title{font-size:18px}.arcade-app .arc-tool,.arcade-app .arc-brand a{width:44px;height:44px}.arc-scoreboard .arc-hud{min-height:36px;padding-top:4px;padding-bottom:4px}.arc-scoreboard .arc-status{min-height:30px;padding-top:3px;padding-bottom:3px}}
.arcade-app.arc-hide-controls .arc-bottom{display:none}
.arcade-app .arc-brand a>svg{transform:rotate(180deg)}
.arcade-app .arc-touch button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.arc-control-icon{display:grid;place-items:center;flex:0 0 22px;width:22px;height:24px;font-size:22px!important;line-height:1;font-weight:650}
.arc-control-icon>svg{width:22px;height:22px}
.arcade-app .arc-control-label{font-size:14px;line-height:1.2}
@media(max-width:700px){.arcade-app .arc-control-label{display:none}.arcade-app .arc-touch button{flex:1;max-width:72px;padding:7px}}
/* Optional accessible controls for in-scene milestones and explicit choices. */
.arcade-app .arc-scene-controls{position:absolute;z-index:3;left:50%;bottom:18px;transform:translateX(-50%);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;width:max-content;max-width:calc(100% - 24px);padding:8px}
.arcade-app .arc-scene-controls .arc-button{min-height:44px;font-size:16px;line-height:1.25}
@media(max-width:600px){.arcade-app .arc-scene-controls{gap:8px;padding:4px}.arcade-app .arc-scene-controls .arc-button{padding:10px 14px}}
/* Never split a score or health percentage across lines on a phone. */
@media(max-width:600px){.arc-scoreboard .arc-stat>strong{white-space:nowrap;overflow-wrap:normal;font-size:16px}.arc-scoreboard .arc-stat-icon{width:18px;height:18px;flex-basis:18px}.arc-scoreboard .arc-stat-icon>svg{width:18px;height:18px}.arc-scoreboard .arc-hud.arc-hud--long{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));row-gap:6px}.arc-scoreboard .arc-hud.arc-hud--long .arc-stat{justify-content:center}}
