/* A: retain the printed atlas, give controls and reading areas clear roles. */
:root{--ux-paper:rgba(249,241,216,.9);--ux-ink:#17343d;--ux-line:#596448}
.home .settings{background:rgba(249,241,216,.76);padding:8px;border-radius:2px}
.home .settings small{background:none;box-shadow:none;padding:0;color:var(--ux-ink);font-size:13px;line-height:1.6}
.home .settings label>span{font-size:14px;line-height:1.6}
.home .settings-group{column-gap:12px;row-gap:6px;margin-bottom:14px}
.home .settings .limits-group{margin-bottom:0}
.home .settings .limits-group small{min-height:1.6em}
.home .settings .limits-group label>span{min-height:1.6em;display:block}
.home .settings #questionSelectionSummary{min-height:1.6em}
.home .settings .mode-bubble-slot>#modeDescription{font-size:13px;background:#f7ecd0;padding:3px 6px}
.mode-bubble-slot{min-height:30px;margin-top:10px}
.mode-buttons button{font-size:14px;min-height:44px}
.home .settings #untimedSetting{height:44px;min-height:44px;margin:5px 0;line-height:24px;padding:9px 6px;font-size:14px}
.home .settings input[type=number],.home .settings select{min-height:44px}
#homeRanking{background-color:rgba(249,241,216,.72);background-image:none;border-width:2px}
#homeRanking .personal-ranking{background:var(--ux-paper);margin:8px 0;padding:6px 8px}
.personal-metrics dt,.personal-ranking p,.board-status,.rank-score{font-size:13px;line-height:1.65}
#homeRanking .board-status{background:var(--ux-paper);padding:4px 6px}
#homeRanking .home-ranking-list li{background:rgba(249,241,216,.84)}
#homeRanking h2{font-size:17px;line-height:1.5}
#allRankings{background:rgba(249,241,216,.9);color:#174d3f;border:2px solid var(--ux-line);text-decoration:none}
#start,#readyStart{font-size:18px;border:2px solid #703b27}
#ready>p[data-i18n=readyHint]{font-size:14px;line-height:1.65;background:var(--ux-paper);padding:6px 10px;width:fit-content}
#ready #rankingSetup{box-sizing:border-box;display:grid;grid-template-columns:1fr;gap:4px;width:min(100%,520px);min-height:100px;margin:10px auto;padding:8px 12px}
#ready #rankingSetup[hidden]{display:grid!important}
#ready #rankingSetup label{max-width:none;font-size:13px;line-height:1.5;text-align:left}
#ready #rankingName{width:100%;min-width:0;min-height:40px;font-size:16px}
.match-clock{max-width:640px;margin:10px auto;text-align:left;background:var(--ux-paper);padding:8px 12px}
.match-clock summary{font-size:13px;line-height:1.6;cursor:pointer;min-height:24px}
#ready .match-clock .ready-clock{margin:10px 0;padding:10px 0;background:transparent}
#ready .match-clock .ready-clock strong{font-size:26px}
#ready .match-clock .clock-status,#ready .match-clock .clock-help{font-size:13px;line-height:1.65}
#ready #readyConditions{max-width:640px;min-height:4.8em;box-sizing:border-box;padding:8px 12px;background:var(--ux-paper);font-size:14px;line-height:1.6;text-align:left;border-left:3px solid #596448}
#ready #readyConditions.ranking-conditions{border-left-color:#91482f}
#ready #rankingNote{background:var(--ux-paper);font-size:13px;line-height:1.8}
#readyBack{background:var(--ux-paper);color:#174d3f;border:2px solid var(--ux-line)}
.game-actions{margin:10px 0 14px;padding:0;border-top:0;gap:12px;align-items:stretch}
.game-actions button{min-height:44px;font-size:14px;padding:10px 12px}
.game-actions #skip{background:#245a48;border:2px solid #173d30;color:#fff9e9;flex:1}
.game-actions #quit{background:none;color:#354d50;border:1px solid #596448;flex:0 1 auto}
.input-help,.practice-stats,.feedback-row{font-size:14px;line-height:1.65}
.map-expand{display:block;width:100%;min-height:36px;margin:0;padding:6px 8px;border:0;border-top:1px solid #82957e;background:#f4ecd6;color:#17343d;font-size:13px;text-decoration:none}
#mapZoom{box-sizing:border-box;width:min(1100px,96vw);max-width:1100px;max-height:94dvh;padding:16px;overflow:auto}
.map-zoom-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
#mapZoom h2{font-size:20px;margin:0;line-height:1.5}
#closeMapZoom{min-height:44px;padding:8px 12px;flex-shrink:0}
#mapZoomCanvas svg{display:block;width:100%;height:auto;max-height:65dvh;object-fit:contain;background:#dcebf0}
#mapZoomTime{font-size:13px;margin:8px 0;line-height:1.6}
#result #finalAccuracy{font-size:15px;line-height:1.7;margin:12px 0 20px;color:#17343d}
#result .result-share-details,#result .result-session-details{margin:24px 0 0;text-align:left;border-top:1px solid #82957e;padding:12px 0}
#result details>summary{cursor:pointer;font-size:14px;min-height:28px;line-height:1.7}
#result .result-sharing{margin:12px 0;padding:0;border:0}
#result .result-sharing h3{display:none}
#result .share-panel{margin:12px 0 0;padding:0;border:0}
#result #resultSession{overflow-wrap:anywhere;font-size:13px;text-align:left;line-height:1.8}
.history-row{grid-template-columns:minmax(0,1fr) auto;column-gap:12px;row-gap:4px;font-size:14px}
.history-row>span:last-child{grid-column:2;text-align:right;font-variant-numeric:tabular-nums}
.history-country{grid-row:1/span 2}
.danger-action,#confirmManagement.danger-action{color:#7c2d23;background:#f8e6d8;border:2px solid #8b382c}
button:focus-visible,a:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #245a48;outline-offset:3px}
@media(max-width:600px){
 .home .settings{padding:10px}.home .settings-group{column-gap:10px}
 .mode-buttons{gap:4px}.mode-buttons button{font-size:12px;padding:8px 1px}
 .home .settings .limits-group{column-gap:8px}
 .home .settings .limits-group label>span{font-size:13px}
 .home .settings .limits-group small{font-size:13px;min-height:3.2em}
 .home .settings #questionSelectionSummary{min-height:3.2em}
 #ready{padding:16px 12px}#ready #readyConditions{min-height:6.4em}
 #ready #rankingSetup{min-height:112px}
 #ready .primary{margin:10px auto 6px}
 .game-actions{gap:8px;flex-wrap:wrap}.game-actions #quit{font-size:13px}
 #mapZoom{padding:12px}#mapZoom h2{font-size:17px}
 .flag .map-question>div>span,.guided-game #studyMap .map-question>div>span{font-size:12px}
}
@media(forced-colors:active){.home .settings,#homeRanking,.match-clock,#ready #readyConditions{background:Canvas;color:CanvasText}.mode-buttons button[aria-pressed=true]{outline:2px solid Highlight}.danger-action{border-color:ButtonText}}

#homeRanking .home-board-viewport{height:220px}
html[lang=en] .home .settings .limits-group label>span,html[lang=en] .home .settings .limits-group small{min-height:3.2em}
@media(max-width:600px){.mode-bubble-slot{min-height:46px}.home .settings .limits-group label>span{min-height:3.2em}}

/* Keep the multiplayer clock visible without pushing the main action below the fold. */
#ready #rankingSetup{grid-template-columns:auto minmax(0,1fr);min-height:54px;padding:6px 10px;gap:12px}
#ready .match-clock h3{margin:0 0 4px;font-size:13px;line-height:1.6}
#ready .match-clock{margin:6px auto;padding:8px 12px}
#ready .match-clock .ready-clock{margin:4px 0;padding:6px 0}
#ready .match-clock .clock-help{margin:4px 0;font-size:12px}
#ready .match-clock .clock-status{font-size:12px}
#ready #readyConditions{min-height:3.2em;padding:6px 10px;font-size:13px}
@media(max-width:600px){#ready #rankingSetup{min-height:64px;gap:8px}#ready #rankingSetup label{max-width:110px}#ready #readyConditions{min-height:6.4em}#ready .match-clock{padding:6px 8px}#ready .match-clock .clock-help{line-height:1.5}}

#homeRanking .board-status{height:auto;min-height:20px;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.6}


html[lang=ja] #homeRanking .home-board-viewport{height:198px}

#ready .match-clock .clock-help{white-space:pre-line}