/* Release layout: static start content, platform-independent flags and clear controls */
.catalog-badge{display:block;width:fit-content;margin:22px auto 0;border-radius:10px}
.catalog-badge img{display:block}
.catalog-badge:hover,.catalog-badge:focus-visible{filter:brightness(1.12)}
.catalog-badge:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}
.start-screen{overflow:visible;padding:0;top:120px;max-height:none}
.start-screen .eyebrow{margin-bottom:14px}
.start-screen .start-title{font-size:40px;margin-bottom:16px}
.start-screen .intro{font-size:18px;line-height:1.35}
.start-screen .start-play{margin-top:22px}
.start-screen .best-line{margin-top:10px}
.start-how{position:relative;text-align:center;margin:8px 0 0;color:#fff}
.start-how summary{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:center;text-decoration:underline;text-underline-offset:5px}
.start-how summary::-webkit-details-marker{display:none}
.start-how summary:focus-visible{outline:2px solid var(--yellow);outline-offset:1px;border-radius:12px}
.start-how ol{position:absolute;bottom:calc(100% + 8px);left:0;right:0;margin:0;z-index:12;padding:18px 18px 18px 38px;text-align:left;line-height:1.4;font-size:15px;color:var(--ink);background:#fff;border:3px solid var(--ink);border-radius:20px;box-shadow:0 5px #1b2a6b44}
.start-how li+li{margin-top:8px}
#globe-fallback{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);width:80%;height:auto;max-height:90%;object-fit:contain;border-radius:50%;pointer-events:none}
.globe-ready #globe-fallback{display:none}
.no-script{position:absolute;left:32px;bottom:16px;max-width:90%;color:#fff;font-size:13px}
.country-flag{display:inline-block;vertical-align:middle;width:24px;height:18px;flex:none;object-fit:cover;border-radius:3px;box-shadow:0 0 0 1px #1b2a6b28;margin-right:3px}
.map-label{display:flex;align-items:center;gap:6px;overflow:visible}
.map-label .country-flag{margin:0}
.map-label span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.map-label.is-detached:after{display:none}
.answer-chip{gap:5px}
.answer-chip .country-flag{width:20px;height:15px;margin:0}
.country-result{display:flex;align-items:center;gap:9px}
#globe:focus{outline:none}
#globe:focus-visible{outline:2px solid #ffffff80;outline-offset:-6px;border-radius:18px}
#game-hud{pointer-events:none}
.overview-note{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);color:#fff;font-size:13px;white-space:nowrap;background:#1b2a6b66;padding:2px 12px;border-radius:18px;pointer-events:none}
.error-art{position:absolute;left:7%;top:18%;width:min(48vw,580px);height:auto;border-radius:42px;box-shadow:0 10px #1b2a6b33}
.error-home{text-decoration:none;display:flex;align-items:center;justify-content:center;margin-top:30px;font-size:24px;text-align:center}
.error-panel{top:180px;overflow:visible}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.retry-button{position:relative;margin:24px 0 8px}
#app[data-screen=error] .panel{overflow:visible}
.over-best.new-best{display:table;margin:10px auto 0;padding:4px 15px;border:2px solid var(--ink);border-radius:20px;background:var(--yellow);color:var(--ink);box-shadow:0 3px #1b2a6b22}
/* Keep the optional scope note's space on both question and reveal cards */
.question-card .question-note{min-height:16px;margin-top:5px;font-size:12px;line-height:16px;color:var(--muted)}
@media(max-width:1023px){
  #app[data-screen=start] .start-screen{top:95px;bottom:14px;max-height:none;padding:0}
  .start-screen .eyebrow{font-size:10px;margin-bottom:9px}
  .start-screen .start-title{font-size:32px;margin-bottom:9px}
  .start-screen .intro{font-size:15px}
  .start-screen .start-play{bottom:150px;margin:0;min-height:68px}
  .start-screen .start-how{position:absolute;bottom:96px;left:0;right:0;margin:0;pointer-events:auto;font-size:14px}
  .start-screen .best-line{bottom:66px;margin:0;font-size:13px}
  .start-screen .catalog-badge{position:absolute;bottom:0;left:50%;transform:translateX(-50%);margin:18px auto 0;pointer-events:auto}
  .start-how ol{left:12px;right:12px;font-size:14px}
  #app[data-screen=start] #globe-stage{top:278px;bottom:255px}
  #app:is([data-screen=question],[data-screen=reveal],[data-screen=draft]) .topbar{top:12px;left:12px;right:12px;height:52px;justify-content:initial;pointer-events:none}
  #app:is([data-screen=question],[data-screen=reveal],[data-screen=draft]) .brand{position:absolute;left:109px;top:19px;font-size:15px;letter-spacing:-.7px;pointer-events:auto}
  #app:is([data-screen=question],[data-screen=reveal],[data-screen=draft]) .top-actions{position:absolute;left:auto;bottom:auto;right:60px;top:4px;pointer-events:auto}
  #app:is([data-screen=question],[data-screen=reveal],[data-screen=draft]) .top-actions #mute{width:44px;height:44px;min-width:44px;background:#fff;border:3px solid var(--ink);font-size:23px}
  .score-pill{min-width:94px;width:94px;padding-left:28px;padding-right:5px}
  .score-pill b{font-size:20px}
  .score-pill small{left:27px}
  .score-star{font-size:42px;top:-8px}
  .panel{top:86px}
  .question-card{padding:20px 12px 11px}
  .theme-chip{position:static;max-width:none;white-space:normal;font-size:11px;line-height:1.2;color:var(--muted);margin:0 0 6px}
  .question-card h1{font-size:20px;line-height:1.13}
  .question-card p{margin-top:6px}
  .run-meta{padding-top:10px}
  #globe-stage{top:241px;bottom:222px}
  .run-bottom{position:fixed;left:18px;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));display:grid;gap:8px}
  .selection-line{position:static;min-height:28px;padding:0;display:flex;align-items:center;justify-content:center;gap:5px;font-size:17px}
  .selection-line.empty{font-size:14px}
  .shelf{position:static;margin:0}
  .shelf-title{font-size:12px}
  .bottom-actions{display:grid;grid-template-columns:42% 1fr;gap:9px;margin-top:2px}
  .lock-button{position:static;grid-column:2;grid-row:1;width:auto;min-height:62px;font-size:26px;border-radius:20px}
  .find-button{position:static;grid-column:1;grid-row:1;left:auto;bottom:auto;transform:none;margin:0;min-height:62px;font-size:14px;line-height:1.1;border:3px solid var(--ink);border-radius:20px;padding:5px 8px}
  .zoom-controls{right:14px;bottom:12px;gap:7px}
  .charms{bottom:calc(227px + env(safe-area-inset-bottom));left:14px;max-width:220px;gap:5px}
  #app[data-screen=reveal] .panel{top:86px;bottom:16px}
  .reveal-top{position:static;display:flex;align-items:stretch;gap:8px;margin:13px 2px 0}
  .verdict{display:grid;place-items:center;flex:1;min-width:0;font-size:17px;line-height:1.1;padding:8px 6px;margin:0;border-radius:14px;rotate:0;-webkit-text-stroke-width:2.5px}
  .reward{display:flex;align-items:center;flex:1;gap:7px;margin:0;max-width:none;min-width:0;padding:7px 9px;border-radius:14px;font-size:13px;box-shadow:0 3px #c9d4ff}
  .reward strong{font-size:22px;white-space:nowrap}
  .reward .country-flag{width:20px;height:15px}
  #app[data-screen=reveal] #globe-stage{top:300px;bottom:277px}
  #app[data-screen=reveal] .zoom-controls{bottom:10px}
  .reveal-title{font-size:14px}
  .answer-list{max-height:112px}
  .fact{max-height:43px;margin-bottom:10px}
  .reveal-bottom{bottom:env(safe-area-inset-bottom)}
  .overview-note{bottom:0;font-size:11px}
  #app[data-screen=over] .panel{top:94px}
  #app[data-screen=over] #globe-stage{display:none}
  .error-page .topbar{left:18px;top:22px}
  .error-art{width:230px;height:230px;left:50%;top:320px;transform:translateX(-50%);border-radius:30px}
  .error-panel{top:110px;text-align:center;overflow:visible}
  .error-panel .start-title{font-size:30px}
  .error-home{position:fixed;bottom:55px;left:26px;right:26px;min-height:68px;font-size:24px}
}
/* Short phones use two columns, leaving the globe and every primary action clear */
@media(max-width:1023px) and (orientation:landscape) and (max-height:550px){
  #app{min-height:0;height:100dvh}
  .topbar{top:12px;left:22px;right:18px;height:44px}
  .panel{left:auto;right:18px;width:342px;top:75px;bottom:12px;max-height:none}
  #globe-stage{inset:58px 380px 18px 0}
  .zoom-controls{right:12px;bottom:6px}
  #map-guide{display:none}
  #app[data-screen=start] .start-screen{left:auto;right:22px;width:382px;top:58px;bottom:12px;text-align:center}
  .start-screen .eyebrow{font-size:10px;margin-bottom:5px}
  .start-screen .start-title{font-size:28px;line-height:1.07;margin-bottom:7px}
  .start-screen .intro{font-size:14px;max-width:none}
  .start-screen .pitch{font-size:12px;margin-top:7px;padding:2px 12px}
  .start-screen .start-play{position:relative;left:auto;bottom:auto;width:100%;min-height:54px;font-size:25px;margin:12px 0 0}
  .start-screen .start-how{position:static;margin:0;font-size:13px}
  .start-screen .best-line{position:static;margin:0;font-size:12px}
  .start-screen .catalog-badge{position:fixed;left:calc((100vw - 426px)/2);bottom:12px;margin:0}
  #app[data-screen=start] #globe-stage{inset:48px 426px 69px 0}
  #app[data-screen=start] .zoom-controls{right:8px;bottom:6px}
  #app:is([data-screen=question],[data-screen=reveal],[data-screen=draft]) .topbar{top:12px;left:22px;right:18px;height:44px}
  #app:is([data-screen=question],[data-screen=reveal],[data-screen=draft]) .brand{left:0;top:12px;font-size:20px}
  #app:is([data-screen=question],[data-screen=reveal],[data-screen=draft]) .top-actions{right:66px;top:0;left:auto;bottom:auto}
  #game-hud{left:auto;right:18px;top:12px;width:220px;height:44px}
  .score-pill{left:0;top:3px}
  .timer{top:-2px}
  .question-card{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:14px 40px 14px;row-gap:2px;min-height:0;height:96px;padding:12px 12px 6px}
  .question-card h1{grid-column:1/-1;grid-row:2;align-self:center;font-size:18px;line-height:1.1;max-height:40px;overflow:auto}
  .question-card p{font-size:11px;margin-top:3px}
  .question-card .question-note{grid-column:1/-1;grid-row:3;min-height:14px;margin:0;font-size:11px;line-height:14px}
  .question-card .question-fit{grid-column:2;grid-row:1;margin:0;font-size:10px;line-height:14px;text-align:right}
  .theme-chip{grid-column:1;grid-row:1;margin:0;font-size:10px;line-height:14px;text-align:left}
  .run-meta{padding:6px 6px 0;height:28px}
  .hearts{font-size:19px;line-height:1}
  .run-bottom{position:absolute;left:0;right:0;bottom:0;gap:4px}
  .selection-line{min-height:24px;font-size:15px}
  .selection-line.empty{font-size:13px}
  .shelf-title{font-size:11px;margin-bottom:2px}
  .hint-slot{height:44px;min-height:44px}
  .bottom-actions{gap:8px;margin-top:2px}
  .lock-button,.find-button{min-height:50px}
  .lock-button{font-size:23px;border-radius:17px}
  .find-button{font-size:13px;border-radius:17px}
  .charms{left:14px;bottom:16px;max-width:220px}
  #app[data-screen=reveal] .panel{top:75px;bottom:12px}
  #app[data-screen=reveal] #globe-stage{inset:58px 380px 18px 0}
  .reveal-top{margin:8px 0 0;gap:6px;height:40px}
  .verdict{font-size:15px;padding:6px 4px}
  .reward{padding:5px 7px;font-size:12px}
  .reward strong{font-size:20px}
  .reveal-bottom{position:absolute;top:174px;bottom:0;display:grid;grid-template-rows:14px minmax(28px,1fr) auto 48px;gap:3px;margin:0;max-height:none;overflow:visible;padding:0 3px}
  .reveal-title{font-size:12px}
  .answer-list{max-height:none;min-height:0;padding:0 2px 3px}
  .answer-chip{font-size:11px;min-height:44px}
  .fact{font-size:11px;max-height:14px;min-height:0;margin:0;line-height:1.2}
  .reveal-action{grid-row:4;min-height:48px;font-size:22px;margin:0}
  .overview-note{font-size:11px;bottom:0}
  dialog{max-height:calc(100dvh - 24px);width:calc(100% - 36px);padding:16px 18px}
  dialog h2{font-size:23px}
  dialog .sub{margin:5px 0 12px}
  .draft-cards{flex-direction:row;gap:12px}
  .draft-card{padding:12px 10px;text-align:center;min-height:208px}
  .card-icon{position:static;width:44px;height:44px;font-size:26px;margin:7px auto 9px;border-radius:14px}
  .draft-card h3{font-size:18px}
  .draft-card p{font-size:12px;min-height:44px}
  .card-kind{margin:6px 22px 0;font-size:10px}
  .card-key{top:auto;bottom:7px;right:7px;min-width:22px;font-size:11px}
  .search-dialog{max-width:500px;padding-top:22px}
  .search-input{margin-top:12px}
  .country-results{max-height:40dvh}
  #app[data-screen=over] .panel{top:65px;bottom:12px;width:min(720px,calc(100% - 48px));left:50%;right:auto;transform:translateX(-50%);display:grid;grid-template-columns:1fr 1.1fr;grid-template-rows:auto auto auto auto 1fr;column-gap:30px;overflow:auto}
  .over-title,.over-sub,.final-score,.over-best{grid-column:1}
  .over-title{font-size:26px}
  .over-sub{font-size:13px;line-height:1.2;margin:8px 0}
  .final-score{font-size:52px;margin:12px 0 6px}
  .over-best.new-best{align-self:start;margin-top:8px}
  .stats{grid-column:2;grid-row:1/4;margin:0 0 12px;padding:9px 14px;align-self:start}
  .stat{font-size:13px;min-height:31px}
  .over-play{grid-column:2;grid-row:4;width:100%;margin:0;min-height:54px;font-size:23px;align-self:start}
  .over-share{grid-column:2;grid-row:5;margin:10px auto 0;align-self:start}
  #app[data-screen=error] .panel{top:83px}
  #app[data-screen=error] #globe-stage{inset:58px 380px 18px 0}
  #app[data-screen=error] .start-title{font-size:28px}
  .error-page .error-art{left:calc((100vw - 400px)/2);top:76px;transform:translateX(-50%);width:min(32vw,260px);height:auto;border-radius:30px}
  .error-page .error-panel{top:82px;left:auto;right:22px;width:342px}
  .error-page .error-home{position:relative;left:auto;right:auto;bottom:auto;width:100%;min-height:58px;margin:24px 0 0;font-size:23px}
}
@media(max-width:1023px) and (orientation:portrait) and (max-height:730px){
  #app[data-screen=start] .start-screen{top:78px}
  .start-screen .start-title{font-size:27px}
  .start-screen .intro{font-size:14px}
  #app[data-screen=start] #globe-stage{top:237px;bottom:245px}
  .start-screen .start-play{bottom:144px;min-height:59px}
  .start-screen .start-how{bottom:94px}
  .question-card h1{font-size:18px}
  #globe-stage{top:233px;bottom:215px}
  #app[data-screen=reveal] #globe-stage{top:284px;bottom:250px}
  .answer-list{max-height:82px}
  .reveal-action{min-height:52px}
  .error-art{top:285px;width:190px;height:190px}
}