/* The original site surrounds a responsive game surface. */
div.section div.content .arcade-player { margin:8px; }
div.section div.content .arcade-player > p { margin:8px 0; line-height:145%; }
.game-review-label { color:#234a27; font-weight:bold; font-size:90%; }
.game-hud { display:flex; justify-content:space-between; gap:8px; background:#183e58; color:#d7edf8; padding:8px; font-size:90%; font-variant-numeric:tabular-nums; }
.game-hud strong { display:block; color:#fff; font-size:120%; margin-top:2px; }
.game-viewport { position:relative; margin:0; background:#080d15; line-height:0; }
.game-viewport canvas { display:block; width:100%; height:auto; touch-action:none; outline-offset:-3px; }
.game-overlay { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; background:rgba(7,15,24,.73); color:#fff; line-height:150%; text-align:center; padding:16px; }
.game-overlay[hidden] { display:none; }
div.section div.content .game-overlay p { font-size:150%; font-weight:bold; margin:0; }
#content .game-overlay button { font:inherit; font-weight:bold; min-height:44px; padding:8px 24px; color:#173c1e; background:#b7db8e; border:2px outset #d3edb7; }
.game-toolbar { display:flex; flex-wrap:wrap; gap:6px; padding:8px 0; }
#content .game-toolbar button { float:none; min-height:32px; padding:4px 8px; }
.game-controls-help { font-size:90%; }
.game-touch-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; touch-action:none; user-select:none; padding:4px 0; }
.game-dpad { display:grid; grid-template-columns:repeat(3,42px); grid-template-rows:42px 42px; gap:4px; }
.game-dpad button:first-child { grid-column:2; }
.game-dpad button:nth-child(2) { grid-row:2; grid-column:1; }
.game-dpad button:nth-child(3) { grid-row:2; grid-column:2; }
.game-dpad button:nth-child(4) { grid-row:2; grid-column:3; }
#content .game-touch-controls button { float:none; min-height:42px; min-width:42px; padding:4px; font-size:18px; touch-action:none; }
#content .game-touch-controls .game-action { min-height:58px; padding:8px 12px; font-size:14px; font-weight:bold; background:#a0c86a; }
.game-touch-controls button:active { filter:brightness(1.2); }
.game-status { min-height:18px; font-size:90%; }
.game-storage-note { font-size:83%; }
.arcade-player:fullscreen { background:#0d1d2a; padding:8px; overflow:auto; box-sizing:border-box; color:#d7edf8; }
.arcade-player:fullscreen .game-review-label { color:#b7db8e; }
.arcade-player:fullscreen .game-viewport, .arcade-player:fullscreen .game-hud, .arcade-player:fullscreen .game-toolbar, .arcade-player:fullscreen > p, .arcade-player:fullscreen .game-touch-controls { max-width:min(650px,calc((100vh - 220px) * 480 / 540)); margin-left:auto; margin-right:auto; }
@media (min-width:800px) and (pointer:fine) { .game-touch-controls { display:none; } }
@media (max-width:455px) { .game-hud { font-size:85%; } #content .game-toolbar button { font-size:12px; padding:4px 6px; } }
