/* 윈도우에는 국기 이모지 글리프가 없어 🇰🇷가 KR 두 글자로 보인다.
   지역 표시 기호 구간(U+1F1E6-1F1FF)에만 국기 전용 폰트를 얹어 어느 OS에서나 같은 국기가 나오게 한다. */
@font-face{font-family:"Twemoji Country Flags";src:url(./fonts/TwemojiCountryFlags.woff2) format("woff2");font-display:swap;unicode-range:U+1F1E6-1F1FF}
:root{--ink:#13231d;--paper:#f4f0e7;--white:#fffdf8;--line:#c9c7bb;--green:#235c45;--lime:#d9f26a;--blue:#3859a8;--orange:#f08a50;--muted:#667069;--shadow:0 20px 60px rgba(20,43,32,.12)}
*{box-sizing:border-box}html{font-family:"Twemoji Country Flags",Inter,Pretendard,"Noto Sans KR",system-ui,sans-serif;color:var(--ink);background:var(--paper)}body{margin:0;min-height:100vh;background:radial-gradient(circle at 75% 5%,rgba(217,242,106,.28),transparent 30rem),var(--paper)}button,a{font:inherit}.shell{width:min(1180px,calc(100% - 40px));margin-inline:auto}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(19,35,29,.18)}.brand{font-weight:900;color:var(--ink);text-decoration:none;letter-spacing:-.04em}.data-note,.status{font-size:14px;color:var(--muted)}.status{display:flex;gap:18px;align-items:center}.status strong{color:var(--green);font-size:18px}.landing-main{padding:78px 0 80px}.hero{display:grid;grid-template-columns:1.3fr .7fr;gap:60px;align-items:end;margin-bottom:66px}.eyebrow{margin:0 0 14px;color:var(--green);font-size:13px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.hero h1{grid-row:2;margin:0;font-family:"Twemoji Country Flags",Georgia,"Noto Serif KR",serif;font-size:clamp(54px,7vw,96px);line-height:.94;letter-spacing:-.07em;font-weight:600}.hero h1 em{color:var(--green);font-weight:600}.hero-copy{grid-column:2;grid-row:2;margin:0 0 8px;font-size:18px;line-height:1.8;color:var(--muted)}.game-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.game-card{min-height:500px;padding:34px;border-radius:28px;color:white;text-decoration:none;display:grid;grid-template-rows:auto 150px 1fr auto;position:relative;overflow:hidden;box-shadow:var(--shadow);transition:.2s transform}.game-card:hover{transform:translateY(-5px)}.gdp-card{background:var(--green)}.geo-card{background:var(--blue)}.card-number{font:700 14px/1 Georgia,serif;opacity:.6}.game-card h2{font-family:"Twemoji Country Flags",Georgia,"Noto Serif KR",serif;font-size:42px;line-height:1.12;letter-spacing:-.04em;margin:5px 0 15px}.game-card p{margin:0;line-height:1.7;opacity:.76}.card-kicker{font-size:13px;font-weight:900;letter-spacing:.12em}.start-link{display:flex;justify-content:space-between;align-items:center;padding-top:24px;border-top:1px solid rgba(255,255,255,.26);font-weight:800}.start-link b{font-size:28px}.mini-rank{position:relative;margin:48px 16px 0}.rank-line{position:absolute;left:0;right:0;top:50%;height:2px;background:rgba(255,255,255,.45)}.mini-rank i,.mini-rank b{position:absolute;top:50%;transform:translate(-50%,-50%);font-style:normal;font-size:11px;padding-top:42px}.mini-rank i:before,.mini-rank b:before{content:"";position:absolute;top:11px;left:50%;width:18px;height:18px;border-radius:50%;transform:translate(-50%,-50%);background:var(--lime);border:5px solid var(--green)}.mini-rank b:before{background:white}.mini-quadrant{height:122px;margin:26px 50px 0;position:relative;border-left:2px solid rgba(255,255,255,.6);border-bottom:2px solid rgba(255,255,255,.6)}.mini-quadrant:before{content:"";position:absolute;left:-50%;right:0;top:50%;border-top:2px solid rgba(255,255,255,.6)}.mini-quadrant i{position:absolute;left:-6px;top:calc(50% - 5px);width:12px;height:12px;border-radius:50%;background:var(--lime)}.mini-quadrant b{position:absolute;right:20%;top:10%;font-size:36px;color:var(--lime)}.mini-quadrant span{position:absolute;left:10px;top:53%;font-size:11px}.landing-footer{padding:26px 0 44px;color:var(--muted);font-size:13px}.game-main{padding:52px 0 90px}.game-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:32px}.game-heading h1{font-family:"Twemoji Country Flags",Georgia,"Noto Serif KR",serif;font-size:clamp(34px,5vw,58px);letter-spacing:-.05em;margin:0}.text-button{border:0;background:none;border-bottom:1px solid var(--ink);padding:3px 0;cursor:pointer}.prompt-card,.geo-prompt{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:24px 30px;box-shadow:0 8px 30px rgba(20,43,32,.06)}.prompt-card{text-align:center}.prompt-card p,.geo-prompt p{font-size:12px;color:var(--muted);font-weight:800;letter-spacing:.1em;margin:0 0 5px}.prompt-card h2,.geo-prompt h2{font-size:30px;margin:0 0 5px}.prompt-card span,.geo-prompt span{color:var(--muted)}.rank-panel,.quadrant-panel{margin-top:20px;background:rgba(255,253,248,.66);border:1px solid var(--line);border-radius:28px;padding:34px;overflow:auto}.axis-caption{display:flex;justify-content:space-between;color:var(--muted);font-size:13px;margin-bottom:24px}.rank-board{display:flex;align-items:flex-start;min-width:0;padding:34px 10px 58px;position:relative;container-type:inline-size}.rank-board:before{content:"";position:absolute;left:34px;right:34px;top:76px;height:3px;background:var(--ink)}.country-node,.gap{position:relative;z-index:1}.country-node{flex:3 1 0;min-width:0;text-align:center;padding-top:59px}.country-node i{position:absolute;top:35px;left:50%;width:20px;height:20px;border-radius:50%;background:var(--white);border:5px solid var(--ink);transform:translateX(-50%)}.country-node.base i{background:var(--lime);border-color:var(--green)}.country-node b{display:block;font-size:14px;word-break:keep-all;overflow-wrap:anywhere}.country-node span{display:block;margin-top:5px;font-size:11px;color:var(--muted);overflow-wrap:anywhere}.gap{flex:1 1 0;min-width:0;min-height:125px;border:0;background:transparent;cursor:pointer;color:var(--muted)}.gap span{position:absolute;top:29px;left:50%;width:34px;height:34px;display:grid;place-items:center;border:2px dashed #8e958f;background:var(--paper);border-radius:50%;transform:translateX(-50%);font-size:22px}.gap small{position:absolute;top:82px;left:50%;width:125px;transform:translateX(-50%);opacity:0;transition:.15s}.rank-board .gap:first-child small{left:0;transform:none;text-align:left}.rank-board .gap:last-child small{left:auto;right:0;transform:none;text-align:right}.gap:hover small,.gap:focus-visible small{opacity:1}.gap:hover span{background:var(--lime);color:var(--ink);border-color:var(--green)}.gap.correct span{background:#bde7c8;border:2px solid #267244}.gap.wrong span{background:#ffd0bd;border:2px solid #b84b31}.instruction{text-align:center;color:var(--muted);margin:8px 0 0}.feedback{margin-top:18px}.feedback-box{display:flex;align-items:center;gap:16px;border-radius:18px;padding:18px 20px;border:1px solid}.feedback-box.good{background:#e2f3df;border-color:#87ba86}.feedback-box.bad{background:#fff0e7;border-color:#e5a486}.feedback-box strong{font-size:20px}.feedback-box span{flex:1}.feedback-box small{display:block;margin-top:5px;color:var(--muted)}.feedback-box button,.primary-button,.secondary-button{border:0;border-radius:999px;background:var(--ink);color:white;padding:12px 18px;text-decoration:none;cursor:pointer}.geo-prompt{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px}.geo-prompt>div:last-child{text-align:right}.geo-prompt>b{font-size:32px;color:var(--orange)}.quadrant{width:min(720px,90vw);aspect-ratio:1.65;margin:22px auto 10px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;position:relative;padding:24px}.axis-x,.axis-y{position:absolute;background:var(--ink);z-index:2;pointer-events:none}.axis-x{height:3px;left:0;right:0;top:50%}.axis-y{width:3px;top:0;bottom:0;left:50%}.quadrant>button{border:1px solid var(--line);background:rgba(255,255,255,.45);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ink);transition:.15s}.quadrant>button:nth-of-type(1){border-radius:22px 0 0 0}.quadrant>button:nth-of-type(2){border-radius:0 22px 0 0}.quadrant>button:nth-of-type(3){border-radius:0 0 0 22px}.quadrant>button:nth-of-type(4){border-radius:0 0 22px 0}.quadrant>button:hover{background:var(--lime)}.quadrant>button b{font:50px Georgia,serif;opacity:.28}.quadrant>button span{font-weight:900}.quadrant>button.correct{background:#bde7c8}.quadrant>button.wrong{background:#ffd0bd}.origin-dot{position:absolute;left:50%;top:50%;z-index:3;transform:translate(-50%,-50%);text-align:center}.origin-dot i{display:block;width:22px;height:22px;border-radius:50%;background:var(--orange);border:5px solid var(--white);box-shadow:0 0 0 2px var(--ink)}.origin-dot span{position:absolute;top:28px;left:50%;transform:translateX(-50%);font-size:12px;font-weight:900;background:var(--paper);padding:2px 6px;white-space:nowrap}.north,.south,.west,.east{position:absolute;font-size:11px;color:var(--muted);z-index:4}.north{left:calc(50% + 9px);top:0}.south{left:calc(50% + 9px);bottom:0}.west{left:0;top:calc(50% + 8px)}.east{right:0;top:calc(50% + 8px)}.result-card{max-width:720px;margin:7vh auto;background:var(--white);border:1px solid var(--line);border-radius:30px;padding:50px;text-align:center;box-shadow:var(--shadow)}.result-card h2{font:48px Georgia,"Noto Serif KR",serif;margin:0}.result-score{margin:30px 0}.result-score strong{font:90px Georgia,serif;color:var(--green)}.result-score span{font-size:24px;color:var(--muted)}.result-actions{display:flex;gap:10px;justify-content:center;margin:28px 0}.secondary-button{background:transparent;color:var(--ink);border:1px solid var(--ink)}.result-card small{color:var(--muted)}
@media(max-width:760px){.shell{width:min(100% - 24px,1180px)}.topbar{height:62px}.data-note{display:none}.landing-main{padding-top:45px}.hero{display:block;margin-bottom:38px}.hero h1{font-size:54px}.hero-copy{margin-top:24px}.game-grid{grid-template-columns:1fr}.game-card{min-height:430px}.game-heading{align-items:start}.game-heading h1{font-size:38px}.prompt-card h2,.geo-prompt h2{font-size:23px}.rank-panel,.quadrant-panel{padding:18px}.feedback-box{align-items:flex-start;flex-wrap:wrap}.feedback-box button{width:100%}.geo-prompt{gap:10px;padding:18px}.geo-prompt>b{font-size:20px}.quadrant{width:100%;padding:14px;aspect-ratio:1.1}.quadrant>button b{font-size:38px}.result-card{padding:34px 20px}.result-card h2{font-size:36px}.result-score strong{font-size:70px}}

.geo-prompt{grid-template-columns:minmax(0,2fr) minmax(180px,1fr);align-items:end}.geo-question h2{max-width:760px;font-size:clamp(26px,3.2vw,40px);line-height:1.35;letter-spacing:-.035em}.geo-question h2 strong{color:var(--ink)}.geo-question h2 #targetName{color:var(--green)}.geo-prompt>.origin-context{text-align:left;padding-left:28px;border-left:1px solid var(--line)}.origin-context>strong{display:block;font-size:18px}.origin-context>span{display:block;margin-top:5px;font-size:14px}@media(max-width:760px){.geo-prompt{grid-template-columns:1fr;align-items:start;gap:18px}.geo-prompt>.origin-context{padding:16px 0 0;border-left:0;border-top:1px solid var(--line)}}
.country-node.revealed i{background:var(--orange);border-color:#9b4523;box-shadow:0 0 0 7px rgba(240,138,80,.2)}
.difficulty-badge{display:inline-block;margin-left:7px;padding:3px 7px;border-radius:999px;background:#edf4db;color:var(--green)!important;letter-spacing:0}.prompt-chips{display:inline-flex;gap:6px;white-space:nowrap;vertical-align:middle}.prompt-chips>*{margin-left:0!important}.round-badge{display:inline-block;margin-left:7px;padding:3px 8px;border-radius:999px;background:#eceade;color:var(--ink)!important;letter-spacing:0;font-variant-numeric:tabular-nums}.setup-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.setup-dialog label{display:block;margin:0 0 7px;font-size:13px;font-weight:800}.setup-dialog input{width:100%;border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:white;color:var(--ink);font-size:20px;font-weight:800}.setup-note{margin:14px 0 0;color:var(--muted);font-size:13px;line-height:1.6}.group-result-dialog{text-align:center}.group-result-dialog .result-score{margin:18px 0}.group-result-dialog .result-score strong{font-size:64px}.group-end-link{display:block;margin-top:10px}.group-result-dialog #nextGroup[hidden]{display:none}@media(max-width:560px){.setup-fields{grid-template-columns:1fr}}
.group-board{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:18px;margin-bottom:20px;padding:14px 18px;border:1px solid var(--line);border-radius:18px;background:rgba(255,253,248,.72)}.group-board>p{margin:0;font-size:13px;font-weight:900;white-space:nowrap}.group-standings{display:grid;grid-template-columns:repeat(auto-fit,minmax(78px,1fr));gap:8px;padding:2px}.group-status{min-width:0;display:grid;grid-template-columns:1fr auto;gap:3px 6px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--white);color:var(--muted)}.group-status b{color:var(--ink)}.group-status strong{color:var(--muted)}.group-status span{grid-column:1/-1;font-size:11px}.group-status.current{border-color:var(--green);background:#edf4db;box-shadow:0 0 0 1px var(--green)}.group-status.current strong{color:var(--green)}.group-status.complete{background:#e2f3df;border-color:#87ba86}.group-status.complete strong{color:#267244}@media(max-width:560px){.group-board{grid-template-columns:1fr;gap:8px}.group-standings{grid-template-columns:repeat(3,minmax(0,1fr))}}
.class-label{padding:5px 9px;border-radius:999px;background:#edf4db;color:var(--green);font-weight:900}
.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.game-card{padding:28px}.game-card h2{font-size:34px}.personal-card{background:#8b4b32}.personal-card:hover{transform:none}.mini-personal{height:122px;margin:26px 20px 0;border:2px dashed rgba(255,255,255,.45);border-radius:18px;display:flex;align-items:center;justify-content:center;gap:24px}.mini-personal span{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--lime);color:var(--ink);font-weight:900}.mini-personal b{font:48px Georgia,serif;color:white}@media(max-width:760px){.game-grid{grid-template-columns:1fr}.game-card{padding:28px}.game-card h2{font-size:38px}}
.country-node.revealed b{color:#9b4523}
.exchange-note{display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 18px;padding:10px 14px;border-radius:12px;background:#edf2df;color:var(--green);font-size:13px}.exchange-note span{color:var(--muted);font-size:11px}.country-node{flex-grow:2.6}.country-node span em,.country-node span small{display:block;font-style:normal}.country-node span em{color:var(--ink);font-weight:700}.country-node span small{margin-top:2px;color:var(--muted);font-size:10px;white-space:nowrap}
.world-panel{margin-top:20px;background:rgba(255,253,248,.72);border:1px solid var(--line);border-radius:28px;padding:24px;overflow:hidden}.world-game{position:relative;width:100%;aspect-ratio:1000/402.8;border-radius:18px;overflow:hidden;border:1px solid #aab7b1;background:#dceae4}.world-game svg{display:block;width:100%;height:100%}.ocean{fill:#dceae4}.land{fill:#f4f0e7;stroke:#75877e;stroke-width:.7}.graticule{stroke:#81968d;stroke-width:.7;stroke-dasharray:4 4}.graticule.equator,.graticule.meridian{stroke:#526a60;stroke-width:1}.quadrant-axis{stroke:rgba(19,35,29,.78);stroke-width:2;pointer-events:none}.grid-label{font:11px Inter,Pretendard,sans-serif;fill:#526a60;paint-order:stroke;stroke:#dceae4;stroke-width:3px}.capital circle{stroke:var(--white);stroke-width:3}.capital text{font:700 13px Inter,Pretendard,sans-serif;paint-order:stroke;stroke:var(--white);stroke-width:4px;stroke-linejoin:round}.origin-capital circle{fill:var(--orange)}.origin-capital text{fill:#8a371c}.answer-capital circle{fill:#355bb0}.answer-capital text{fill:#25417e}.answer-line{stroke:#eb6f3b;stroke-width:2;stroke-dasharray:7 5}.map-quadrants{position:absolute;inset:0;display:grid;grid-template-columns:var(--origin-x) calc(100% - var(--origin-x));grid-template-rows:var(--origin-y) calc(100% - var(--origin-y))}.map-quadrants button{position:relative;border:0;background:transparent;cursor:pointer;color:var(--ink);text-shadow:0 1px 4px var(--white)}.map-quadrants button:hover,.map-quadrants button:focus-visible{background:rgba(217,242,106,.28);outline:2px solid var(--green);outline-offset:-2px}.map-quadrants button b{display:block;font:32px Georgia,serif;opacity:.42}.map-quadrants button span{font-size:12px;font-weight:900}.map-quadrants button.correct{background:rgba(100,190,119,.35)}.map-quadrants button.wrong{background:rgba(240,138,80,.35)}.map-key{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-top:15px;color:var(--muted);font-size:12px}.map-key span{display:flex;align-items:center;gap:6px}.map-key i{width:10px;height:10px;border-radius:50%;display:inline-block}.origin-key{background:var(--orange)}.answer-key{background:#355bb0}
@media(max-width:760px){.world-panel{padding:10px}.world-game{aspect-ratio:1.25}.world-game svg{object-fit:cover}.map-quadrants button b{font-size:22px}.map-quadrants button span{font-size:10px}.map-key{gap:10px}.grid-label{font-size:9px}}
@media(max-width:760px){.exchange-note{align-items:flex-start;flex-wrap:wrap;gap:3px 7px}.exchange-note span{width:100%;text-align:center}}
.answer-dialog{width:min(720px,calc(100% - 32px));border:1px solid var(--line);border-radius:26px;padding:32px;background:var(--white);color:var(--ink);box-shadow:0 30px 90px rgba(19,35,29,.28)}.answer-dialog::backdrop{background:rgba(19,35,29,.52);backdrop-filter:blur(3px)}.dialog-result{display:inline-block;margin:0 0 16px;padding:8px 14px;border-radius:999px;font-size:18px;font-weight:900}.answer-dialog[data-result="good"] .dialog-result{color:#267244;background:#e2f3df}.answer-dialog[data-result="bad"] .dialog-result{color:#b84b31;background:#fff0e7}.answer-dialog h2{margin:0 0 24px;font-size:25px;line-height:1.45;letter-spacing:-.035em}.dialog-comparison{display:flex;align-items:center;gap:12px}.compare-country{min-width:0;flex:1;padding:17px;border-radius:17px;background:#f2f2e9}.compare-country.current{background:#edf4db;outline:2px solid var(--green)}.compare-country small,.compare-country b,.compare-country strong,.compare-country span{display:block}.compare-country small{color:var(--muted);font-size:11px}.compare-country b{min-height:44px;margin:4px 0 10px;font-size:18px;word-break:keep-all}.compare-country strong{font:25px Georgia,serif}.compare-country span{margin-top:5px;color:var(--muted);font-size:12px}.compare-sign{flex:0 0 auto;color:var(--green);font:32px Georgia,serif}.comparison-rank{margin:18px 0 0;text-align:center;color:var(--muted);font-size:13px}.answer-industries{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}.answer-industries>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.answer-industries h3{margin:0;font-size:17px}.answer-industries>div>span,.answer-industries>p{color:var(--muted);font-size:11px}.answer-industries ol{display:grid;gap:7px;margin:10px 0 7px;padding:0;list-style:none}.answer-industries li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#f2f2e9}.answer-industries li i{display:grid;width:22px;height:22px;place-items:center;border-radius:50%;background:var(--green);color:#fff;font-size:11px;font-style:normal;font-weight:800}.industry-copy{min-width:0}.industry-copy>span{display:flex;align-items:baseline;gap:8px}.industry-copy>small{display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.answer-industries li b{font-size:14px}.answer-industries li small{color:var(--muted);font-size:10px}.answer-industries li strong{display:flex;align-items:baseline;gap:6px;flex:0 0 auto}.answer-industries li strong b{font-size:14px}.answer-industries li strong small{font-weight:500;white-space:nowrap}.answer-industries>p{margin:0}.answer-industries a{color:inherit;text-underline-offset:2px}.dialog-action{width:100%;margin-top:24px;border:0;border-radius:999px;padding:14px 18px;background:var(--ink);color:white;font-weight:800;cursor:pointer}@media(max-width:560px){.answer-dialog{padding:22px}.answer-dialog h2{font-size:20px}.dialog-comparison{gap:7px;overflow-x:auto;padding:2px}.compare-country{min-width:125px;padding:13px}.compare-country b{font-size:15px}.compare-country strong{font-size:20px}.compare-sign{font-size:25px}.answer-industries li b{font-size:13px}.answer-industries li strong{gap:4px}.answer-industries li strong b{font-size:12px}.answer-industries li strong small{font-size:9px}}
.country-map-card{margin:0;padding:12px;border:1px solid var(--line);border-radius:22px;background:var(--white);box-shadow:0 8px 30px rgba(20,43,32,.06);overflow:hidden}.locator-map{display:block;width:100%;border-radius:13px;background:#dceae4}.locator-ocean{fill:#dceae4}.locator-land{fill:#f4f0e7;stroke:#75877e;stroke-width:.8}.locator-parallel{stroke:#81968d;stroke-width:1;stroke-dasharray:5 5}.locator-equator{stroke:#d9473f;stroke-width:2}.locator-grid-label,.locator-equator-label{font:700 11px Inter,Pretendard,sans-serif;fill:#526a60;paint-order:stroke;stroke:#dceae4;stroke-width:3px}.locator-equator-label{fill:#b52f2a}.locator-grid-label.end,.locator-equator-label.end{text-anchor:end}.locator-country path{fill:#f2b48f;stroke:#c25f31;stroke-width:1.2}
.locator-point .locator-halo{fill:rgba(217,242,106,.52);stroke:none}.locator-point>circle:not(.locator-halo){fill:var(--orange);stroke:var(--white);stroke-width:2.4}.locator-point text{font:700 13px Inter,Pretendard,sans-serif;fill:#8a371c;paint-order:stroke;stroke:var(--white);stroke-width:3px;stroke-linejoin:round}@media(max-width:760px){.country-map-card{padding:10px}.locator-map{max-height:none}}
.gdp-chart{margin-top:2px}.gdp-chart-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}.gdp-chart-heading b{font-size:15px}.gdp-chart-heading span{color:var(--muted);font-size:11px}.gdp-horizontal-chart{display:grid;grid-template-columns:120px minmax(0,1fr);gap:5px 10px}.gdp-y-title,.gdp-x-title{color:var(--muted);font-size:10px}.gdp-x-title{text-align:center}.gdp-y-labels,.gdp-plot ol{display:grid;grid-auto-rows:36px;margin:0;padding:0}.gdp-y-labels span{display:flex;align-items:center;padding-right:5px;font-size:11px;font-weight:800;line-height:1.15;word-break:keep-all}.gdp-y-labels span.current{color:var(--orange)}.gdp-plot{position:relative;border-left:1px solid var(--ink);border-bottom:1px solid var(--ink);background:linear-gradient(90deg,transparent calc(50% - .5px),rgba(102,112,105,.28) 50%,transparent calc(50% + .5px))}.gdp-plot:after{content:"";position:absolute;top:0;right:0;bottom:0;border-right:1px solid rgba(102,112,105,.28)}.gdp-plot ol{position:relative;z-index:1;list-style:none}.gdp-plot li{position:relative;display:flex;align-items:center}.gdp-plot li>span{display:block;width:var(--value);min-width:3px;height:20px;background:var(--green)}.gdp-plot li.current>span{background:var(--orange)}.gdp-plot li>strong{position:absolute;left:clamp(6px,calc(var(--value) + 6px),calc(100% - 96px));padding:2px 4px;background:rgba(255,253,248,.86);font:700 10px Georgia,"Noto Sans KR",sans-serif;white-space:nowrap}.gdp-x-axis{grid-column:2;display:flex;justify-content:space-between;color:var(--muted);font-size:9px}.gdp-x-axis span:nth-child(2){transform:translateX(-50%)}@media(max-width:560px){.gdp-horizontal-chart{grid-template-columns:88px minmax(0,1fr);column-gap:7px}.gdp-y-labels span{font-size:10px}.gdp-plot li>strong{font-size:9px}}
.answer-flash{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;background:rgba(19,35,29,.58);pointer-events:none}.answer-flash[hidden]{display:none}.answer-flash strong{padding:22px 36px;border-radius:999px;background:var(--white);font-size:clamp(42px,8vw,76px);font-weight:900;box-shadow:0 24px 80px rgba(19,35,29,.35)}.answer-flash[data-result="good"] strong{color:#267244;background:#e2f3df}.answer-flash[data-result="bad"] strong{color:#b84b31;background:#fff0e7}.answer-flash.play{animation:answer-flash-fade .85s ease both}.answer-flash.play strong{animation:answer-flash-pop .85s cubic-bezier(.2,.9,.25,1.15) both}@keyframes answer-flash-fade{0%,100%{background:rgba(19,35,29,0)}20%,75%{background:rgba(19,35,29,.58)}}@keyframes answer-flash-pop{0%{opacity:0;transform:scale(.45)}35%{opacity:1;transform:scale(1.18)}58%{transform:scale(.96)}76%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.08)}}.answer-gdp-headline>span,.answer-gdp-headline>strong{display:block}.answer-gdp-headline>span:first-child{margin-bottom:4px;color:var(--muted);font-size:12px;font-weight:800}.answer-gdp-headline>strong{font:700 clamp(34px,4.6vw,46px)/1.15 Georgia,"Noto Serif KR",serif}.answer-gdp-headline>strong small{color:var(--muted);font:600 clamp(15px,1.8vw,19px) Inter,Pretendard,sans-serif}@media(prefers-reduced-motion:reduce){.answer-flash.play,.answer-flash.play strong{animation:none}}
.rank-panel{padding:22px}.rank-panel .axis-caption{margin-bottom:8px;font-size:16px}.rank-panel .rank-board{padding:10px 10px 16px}.rank-panel .rank-board:before{top:42px}.rank-panel .country-node{padding-top:58px}.rank-panel .country-node i{top:15px;width:clamp(24px,calc(100cqi/(var(--seats,6)*4.4)),34px);height:clamp(24px,calc(100cqi/(var(--seats,6)*4.4)),34px);display:grid;place-items:center;overflow:hidden;border-width:3px;background:var(--white);font-size:clamp(16px,calc(100cqi/(var(--seats,6)*6.2)),23px);font-style:normal;line-height:1}.rank-panel .country-node.base i{background:var(--white)}.rank-panel .country-node b{font-size:clamp(13px,calc(100cqi/(var(--seats,6)*7)),20px)}.rank-panel .country-node span em{font-size:clamp(12px,calc(100cqi/(var(--seats,6)*8.5)),18px)}.rank-panel .country-node span small{font-size:clamp(10px,calc(100cqi/(var(--seats,6)*11)),14px)}.rank-panel .gap{min-height:115px}.rank-panel .gap span{top:10px;width:clamp(26px,calc(100cqi/(var(--seats,6)*3.6)),44px);height:clamp(26px,calc(100cqi/(var(--seats,6)*3.6)),44px);font-size:clamp(15px,calc(100cqi/(var(--seats,6)*5.6)),28px)}.rank-panel .gap small{top:67px;font-size:13px}.rank-panel .instruction{margin-top:6px;font-size:17px}.gdp-data-note{margin:14px 4px 0;text-align:center;color:var(--muted);font-size:11px;line-height:1.55}.gdp-data-note span{display:block}
.prompt-flag{display:block;margin-bottom:12px;font-size:48px;line-height:1}
.class-select-main{padding:72px 0 90px}.class-select-main h1{margin:0;font:clamp(52px,7vw,84px)/.98 Georgia,"Noto Serif KR",serif;letter-spacing:-.06em}.class-select-copy{margin:24px 0 36px;color:var(--muted);font-size:17px}.class-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.class-grid a{display:grid;place-items:center;min-height:112px;border:1px solid var(--line);border-radius:22px;background:var(--white);color:var(--ink);text-decoration:none;font-size:24px;font-weight:900;box-shadow:0 8px 24px rgba(20,43,32,.05);transition:.15s}.class-grid a:hover,.class-grid a:focus-visible{border-color:var(--green);background:#edf4db;transform:translateY(-2px)}@media(max-width:680px){.class-select-main{padding-top:46px}.class-grid{grid-template-columns:repeat(2,1fr)}.class-grid a{min-height:88px}}

/* Atlas landing */
.atlas-landing{--atlas-ink:#102a38;--atlas-paper:#e9f0f2;--atlas-white:#f8fbfc;--atlas-blue:#2454d6;--atlas-orange:#ff5a2f;--atlas-lime:#d8ff45;--atlas-line:#9caeb6;color:var(--atlas-ink);background-color:var(--atlas-paper);background-image:linear-gradient(rgba(16,42,56,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(16,42,56,.055) 1px,transparent 1px);background-size:32px 32px;font-family:"Twemoji Country Flags",Pretendard,"Noto Sans KR",Arial,sans-serif}.atlas-topbar{height:68px;display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid var(--atlas-ink)}.atlas-brand{display:flex;align-items:center;gap:9px;color:var(--atlas-ink);text-decoration:none;font-size:17px;font-weight:900;letter-spacing:-.04em}.atlas-brand span{display:grid;place-items:center;width:25px;height:25px;border:2px solid currentColor;border-radius:50%;font-size:13px}.atlas-meta{display:flex;gap:6px}.atlas-meta span{padding:5px 8px;border:1px solid var(--atlas-line);background:var(--atlas-white);font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.atlas-main{padding:30px 0 64px}.atlas-hero{position:relative;padding:0 0 34px}.atlas-title>p,.atlas-section-title span,.instrument header span,.next-module>span{margin:0 0 16px;color:var(--atlas-blue);font:800 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em}.atlas-title h1{margin:0;font-size:clamp(42px,5.7vw,70px);font-weight:900;line-height:.98;letter-spacing:-.075em}.atlas-title h1 strong{color:var(--atlas-blue);font-weight:900}.atlas-title>span{display:block;margin-top:19px;color:#526875;font-size:16px}.coordinate-rule{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;gap:12px;color:#526875;font:700 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em}.coordinate-rule i{height:1px;flex:1;background:var(--atlas-line)}.atlas-games{padding-top:35px}.atlas-section-title{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:17px}.atlas-section-title span{display:block;margin-bottom:8px}.atlas-section-title h2{margin:0;font-size:clamp(27px,3.4vw,40px);line-height:1;font-weight:900;letter-spacing:-.055em}.atlas-section-title>p{margin:0 0 2px;color:#526875;font-size:13px}.instrument-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.instrument{position:relative;min-height:390px;display:grid;grid-template-rows:auto 112px 1fr auto;padding:23px;border:2px solid var(--atlas-ink);color:inherit;text-decoration:none;overflow:hidden;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%);transition:transform .18s ease,box-shadow .18s ease}.instrument:hover,.instrument:focus-visible{transform:translateY(-5px);box-shadow:8px 9px 0 rgba(16,42,56,.18);outline:0}.income-instrument{background:var(--atlas-lime)}.direction-instrument{background:var(--atlas-blue);color:white}.instrument header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid currentColor;padding-bottom:13px}.instrument header span{margin:0;color:inherit;opacity:.72}.instrument header b{font-size:12px}.scale-visual{position:relative;margin:27px 4px 0;border-top:3px solid var(--atlas-ink)}.scale-visual>span{position:absolute;left:var(--x);top:-10px;width:19px;height:19px;transform:translateX(-50%);border:3px solid var(--atlas-ink);border-radius:50%;background:var(--atlas-white)}.scale-visual>span:first-child{background:var(--atlas-orange)}.scale-visual>span i{position:absolute;top:23px;left:50%;transform:translateX(-50%);font-size:11px;font-style:normal;font-weight:800;white-space:nowrap}.scale-visual .unknown{width:29px;height:29px;top:-15px;background:var(--atlas-ink);color:var(--atlas-lime)}.quadrant-visual{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;margin:13px 25% 0;border-left:2px solid currentColor;border-bottom:2px solid currentColor}.quadrant-visual:before{content:"";position:absolute;left:-100%;right:0;top:50%;border-top:2px solid currentColor}.quadrant-visual>span{display:grid;place-items:center;font:22px ui-monospace,SFMono-Regular,Menlo,monospace;opacity:.38}.quadrant-visual i{position:absolute;left:-7px;top:calc(50% - 7px);width:14px;height:14px;border-radius:50%;background:var(--atlas-lime);font-size:0}.quadrant-visual b{position:absolute;right:18%;top:4%;color:var(--atlas-lime);font-size:32px}.instrument-copy{align-self:end}.instrument-copy h3{margin:0 0 10px;font-size:clamp(30px,4vw,43px);line-height:1.02;font-weight:900;letter-spacing:-.065em}.instrument-copy p{max-width:430px;margin:0;line-height:1.55;opacity:.78}.instrument footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:24px;padding-top:15px;border-top:1px solid currentColor}.instrument footer>span{font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;opacity:.7}.instrument footer strong{font-size:14px;white-space:nowrap}.instrument footer strong b{color:var(--atlas-orange);font-size:20px}.direction-instrument footer strong b{color:var(--atlas-lime)}.next-module{display:grid;grid-template-columns:110px 140px 1fr auto;align-items:center;gap:18px;margin-top:14px;padding:15px 18px;border:1px solid var(--atlas-line);background:rgba(248,251,252,.72)}.next-module>span{margin:0;color:var(--atlas-orange)}.next-module strong{font-size:16px}.next-module p{margin:0;color:#526875;font-size:13px}.next-module i{padding:5px 8px;background:var(--atlas-ink);color:white;font-size:11px;font-style:normal;font-weight:800}.atlas-footer{display:flex;justify-content:space-between;padding:17px 0 32px;border-top:1px solid var(--atlas-line);color:#526875;font:700 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em}@media(prefers-reduced-motion:reduce){.instrument{transition:none}}@media(max-width:760px){.atlas-meta span:not(:last-child){display:none}.atlas-main{padding-top:25px}.atlas-hero{padding-bottom:26px}.atlas-section-title{display:block}.atlas-section-title>p{margin-top:10px}.instrument-grid{grid-template-columns:1fr}.instrument{min-height:360px}.next-module{grid-template-columns:1fr auto}.next-module>span,.next-module p{grid-column:1/-1}.atlas-footer{gap:18px;flex-wrap:wrap}}@media(max-width:460px){.atlas-title h1{font-size:40px}.instrument{padding:19px}.instrument-copy h3{font-size:32px}.next-module{grid-template-columns:1fr}.next-module i{justify-self:start}}

.quadrant-visual{border:0}
.quadrant-visual:before,.quadrant-visual:after{content:"";position:absolute;background:currentColor}
.quadrant-visual:before{left:0;right:0;top:50%;height:2px;border:0}
.quadrant-visual:after{top:0;bottom:0;left:50%;width:2px}
.quadrant-visual i{left:calc(50% - 7px)}
.target-country path{fill:#2f5f4c;stroke:#173c2e;stroke-width:1.2}
.target-country-dot{fill:#2f5f4c;stroke:var(--white);stroke-width:2}
.map-quadrants button.correct{background:transparent}
.map-quadrants button.wrong{background:rgba(184,75,49,.1);box-shadow:inset 0 0 0 4px #b84b31}
.map-quadrants button.wrong:after{content:"오답 ×";position:absolute;left:50%;top:50%;padding:7px 11px;border-radius:999px;background:#b84b31;color:white;font-size:13px;font-weight:900;text-shadow:none;transform:translate(-50%,-50%)}

.landing .landing-main{padding:54px 0 72px}.landing-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);align-items:end;gap:56px;padding-bottom:48px;border-bottom:1px solid rgba(19,35,29,.18)}.landing-hero h1{margin:0;font:600 clamp(48px,6vw,76px)/.98 Georgia,"Noto Serif KR",serif;letter-spacing:-.065em}.landing-hero h1 em{color:var(--green);font-weight:600}.landing-intro>p{margin:0 0 20px;color:var(--muted);font-size:18px;line-height:1.65}.landing-intro{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--green)}.landing-intro span{padding:7px 10px;border-radius:999px;background:rgba(255,253,248,.7);border:1px solid var(--line);font-size:12px;font-weight:900}.landing-intro b{font-size:13px}.game-section{padding-top:42px}.game-section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:22px}.game-section-heading h2{margin:0;font:600 clamp(30px,4vw,44px)/1.05 Georgia,"Noto Serif KR",serif;letter-spacing:-.045em}.game-section-heading>p{margin:0 0 4px;color:var(--muted)}.landing .game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.landing .game-card{min-height:430px;padding:30px;grid-template-rows:auto 120px 1fr auto}.landing .game-card h2{font-size:clamp(34px,4vw,46px)}.landing .mini-rank{margin-top:34px}.landing .mini-quadrant{height:102px;margin-top:18px}.personal-strip{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px;margin-top:20px;padding:22px 26px;border:1px dashed #b99382;border-radius:22px;background:rgba(139,75,50,.08)}.personal-mark{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--lime);font-weight:900}.personal-strip h3{margin:2px 0 5px;font:600 27px Georgia,"Noto Serif KR",serif;letter-spacing:-.04em}.personal-strip p{margin:0;color:var(--muted);line-height:1.55}.personal-strip>strong{padding:8px 12px;border-radius:999px;background:#8b4b32;color:white;font-size:13px;white-space:nowrap}@media(max-width:900px){.landing-hero{grid-template-columns:1fr;gap:24px}.landing-intro>p{width:100%;margin-bottom:8px}.landing .game-card{min-height:410px}}@media(max-width:680px){.landing .landing-main{padding-top:38px}.landing-hero{padding-bottom:34px}.landing-hero h1{font-size:48px}.game-section{padding-top:32px}.game-section-heading{display:block}.game-section-heading>p{margin-top:10px}.landing .game-grid{grid-template-columns:1fr}.landing .game-card{min-height:390px}.personal-strip{grid-template-columns:auto 1fr;padding:20px}.personal-strip>strong{grid-column:2;justify-self:start}}

/* Capital atlas */
.instrument-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.instrument-grid .instrument-copy h3{font-size:clamp(27px,3vw,38px)}.explore-instrument{background:var(--atlas-orange);color:white}.explore-instrument footer strong b{color:var(--atlas-lime)}.atlas-visual{position:relative;margin:14px 13% 0;border:2px solid currentColor;border-radius:50%;opacity:.95}.atlas-visual:before,.atlas-visual:after{content:"";position:absolute;inset:15% 0;border-top:1px solid currentColor;border-bottom:1px solid currentColor;border-radius:50%}.atlas-visual:after{inset:0 28%;border:1px solid currentColor}.atlas-visual i{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--atlas-lime)}.atlas-visual i:nth-child(1){left:66%;top:24%}.atlas-visual i:nth-child(2){left:31%;top:59%}.atlas-visual i:nth-child(3){left:75%;top:70%}.atlas-visual span{position:absolute;left:calc(66% + 13px);top:20%;font:800 9px ui-monospace,SFMono-Regular,Menlo,monospace}.atlas-visual b{position:absolute;right:9%;bottom:4%;color:var(--atlas-lime);font-size:28px}
.explore-page{--field-paper:#e9f0f2;--field-white:#f8fbfc;--field-navy:#102a38;--field-blue:#2454d6;--field-lime:#d8ff45;--field-orange:#ff5a2f;color:var(--field-navy);background-color:var(--field-paper);background-image:linear-gradient(rgba(16,42,56,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(16,42,56,.055) 1px,transparent 1px),radial-gradient(circle at 82% 6%,rgba(216,255,69,.34),transparent 26rem);background-size:32px 32px,32px 32px,auto}.explore-page .topbar{border-color:rgba(16,42,56,.32)}.explore-main{padding:54px 0 90px}.explore-heading{display:grid;grid-template-columns:1.25fr .75fr;gap:60px;align-items:end;margin-bottom:32px}.explore-heading h1{margin:0;font:900 clamp(46px,6vw,72px)/.94 Pretendard,"Noto Sans KR",sans-serif;letter-spacing:-.075em}.explore-heading>p{margin:0 0 5px;color:#526875;font-size:17px;line-height:1.7}
@media(max-width:900px){.instrument-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.instrument{min-height:380px;padding:18px}.instrument-grid .instrument-copy h3{font-size:28px}.explore-heading{grid-template-columns:1fr;gap:20px}.capital-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.instrument-grid{grid-template-columns:1fr}}

/* Country study atlas */
.instrument-copy h3,.instrument-copy>strong{display:block;margin:0 0 10px;font-size:clamp(27px,3vw,38px);line-height:1.02;font-weight:900;letter-spacing:-.065em}
.explore-main{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(22rem,.7fr);gap:1rem;align-items:start}
.explore-heading{grid-column:1/-1}
.country-study-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(22rem,.7fr);gap:1rem;align-items:start}
.atlas-browser{min-width:0}.explore-world-panel{grid-column:1;margin:0;padding:1rem;border-radius:0;min-width:0}.explore-world-panel svg{display:block;width:100%;height:auto}.map-zoom-controls{display:flex;justify-content:flex-end;align-items:center;gap:.4rem;margin-bottom:.65rem}.map-zoom-controls button{min-width:2.5rem;height:2.5rem;border:1px solid var(--line);background:white;color:var(--ink);font-weight:900;cursor:pointer}.map-zoom-controls button:disabled{opacity:.4;cursor:not-allowed}.map-zoom-controls output{min-width:3.5rem;text-align:center;font-size:.8rem;font-weight:800;color:var(--muted)}#exploreMap{overflow:hidden;border:1px solid #aab7b1;background:#dceae4;touch-action:none}#exploreMap.is-zoomed{cursor:grab}#exploreMap.is-zoomed:active{cursor:grabbing}
/* 퀴즈 모드: 지도와 문제를 한 줄에 나란히 둔다. 지도가 주인공이므로 문제 열은 20rem으로 고정하고
   남는 폭은 전부 지도에 준다(공부 모드의 22rem 프로필 열보다 좁다). */
.is-quiz-mode .explore-main{grid-template-columns:minmax(0,1fr) clamp(15rem,22vw,20rem)}
.is-quiz-mode .explore-world-panel{grid-column:1}
.is-quiz-mode .country-quiz{grid-column:2;position:sticky;top:1rem}
.is-quiz-mode .quiz-header{align-items:flex-start;flex-direction:column;gap:.7rem}
.is-quiz-mode .quiz-hud{width:100%}
.is-quiz-mode .quiz-hud span{flex:1;min-width:0}
/* 태블릿 이하에서만 1열로 내린다. 노트북 창(1000~1400px)은 나란히 유지 */
@media(max-width:820px){.is-quiz-mode .explore-main{grid-template-columns:1fr}.is-quiz-mode .explore-world-panel,.is-quiz-mode .country-quiz{grid-column:1}.is-quiz-mode .country-quiz{position:static}}
.capital-browser{grid-column:1;margin:0;padding:1rem;border-radius:0;background:var(--paper)}.capital-browser>header{margin-bottom:.75rem}.capital-browser h2{font-size:1.4rem}
.country-index,#countryList{display:grid;gap:1rem;max-height:24rem;overflow:auto}.continent-group{display:grid;gap:.55rem}.continent-group h3{display:flex;align-items:baseline;justify-content:space-between;margin:0;padding-bottom:.4rem;border-bottom:2px solid var(--ink);font-size:1rem}.continent-group h3 span{color:var(--muted);font-size:.72rem}.continent-countries{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.country-index-item{display:grid;grid-template-columns:auto 1fr;gap:.2rem .55rem;text-align:left;min-width:0;padding:.75rem;border:1px solid var(--line);background:white;color:var(--ink);cursor:pointer}
.country-index-item small{grid-column:2;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.country-index-item.is-selected{outline:3px solid var(--blue);background:#edf4db}
.country-profile,#countryProfile{position:sticky;top:1rem;grid-column:2;grid-row:2/span 2;display:grid;gap:1rem;padding:1.25rem;border:1px solid var(--line);background:var(--paper)}
#countryProfile[hidden]{display:none}#countryProfile.is-quiz-result{position:static;grid-column:1/-1;grid-row:auto}
#countryProfile header h2{margin:0;font:600 clamp(2rem,4vw,3rem)/1 Georgia,"Noto Serif KR",serif}#countryProfile header p{margin:.4rem 0 0;color:var(--muted)}
.profile-facts,#countryProfile>section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.profile-fact,.industry-study-card,#countryProfile>section>p{margin:0;padding:1rem;border:1px solid var(--line);background:white}
#countryProfile>section>h3,#countryProfile>section>small{grid-column:1/-1;margin:0}
/* 수출산업과 대표 기업을 나란히 — "무엇을 파는가" 옆에 "누가 파는가" */
.trade-pair{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.trade-col{display:grid;align-content:start;gap:.6rem;min-width:0}
.trade-col>h3,.trade-col>small{margin:0}
.company-card .company-cap{margin:.45rem 0 0;color:var(--ink);font-size:1rem;font-weight:900;font-variant-numeric:tabular-nums}
/* 옆 열의 수출액과 단위가 같아서, 무슨 금액인지 반드시 붙여준다 */
.company-card .cap-tag{display:block;margin-bottom:.15rem;color:var(--muted);font-size:.7rem;font-weight:800;letter-spacing:.02em}
.company-card .company-cap.is-private{color:var(--muted);font-size:.85rem;font-weight:800}
.company-card .company-note{margin:.35rem 0 0;color:var(--muted);font-size:.78rem;line-height:1.5}
@media(max-width:1240px){.trade-pair{grid-template-columns:1fr}}.industry-study-list,.industry-cards{display:grid;grid-column:1/-1;gap:.65rem}.industry-card{padding:1rem;border:1px solid var(--line);background:white}.industry-card p{margin:.4rem 0 0;color:var(--muted);font-size:.875rem}
.gdp-highlight{grid-column:1/-1;display:flex;align-items:baseline;justify-content:space-between;gap:1rem;padding:1rem;background:var(--ink);color:white}.gdp-highlight strong{font:700 clamp(1.7rem,3vw,2.3rem)/1 Georgia,"Noto Serif KR",serif}.gdp-highlight span{color:#dbe6df;font-weight:700}.gdp-section>small{color:var(--muted);font-size:.8rem;font-weight:700}
.explore-country{fill:var(--white);stroke:#75877e;stroke-width:.8;cursor:pointer}.explore-country-dot{cursor:pointer;fill:var(--white);stroke:#75877e;stroke-width:.8}.explore-country-dot .dot-hit{fill:none;stroke:none;pointer-events:all}.map-country[aria-pressed="true"],.explore-country.is-selected,.explore-country-dot.is-selected{fill:var(--green);stroke:var(--lime);stroke-width:2.5}.map-country.is-filtered-out,.explore-country.is-filtered-out,.explore-country-dot.is-filtered-out{opacity:.14;pointer-events:none}
.country-index-item:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.atlas-mode-switch{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;padding:1px;background:var(--line)}.atlas-mode-switch[hidden]{display:none}
.atlas-mode-switch button{min-height:3.25rem;border:0;background:var(--paper);color:var(--ink);font-weight:900;cursor:pointer}
.is-atlas-entry .explore-main{min-height:calc(100vh - 76px);grid-template-columns:1fr;gap:1.25rem;padding-top:clamp(3rem,8vh,6.5rem)}.is-atlas-entry .explore-heading{position:relative;grid-template-columns:minmax(0,1fr) minmax(15rem,.42fr);gap:4rem;align-items:end;margin:0 0 1.5rem;padding-bottom:2.25rem;border-bottom:2px solid var(--field-navy)}.is-atlas-entry .explore-heading:after{content:"SELECT A FIELD MODE  /  LAT · LON · CAPITAL · GDP";position:absolute;right:0;bottom:.6rem;color:#526875;font:800 .65rem ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em}.is-atlas-entry .explore-heading .eyebrow{color:var(--field-blue);font-family:"Twemoji Country Flags",ui-monospace,SFMono-Regular,Menlo,monospace}.is-atlas-entry .explore-heading h1{max-width:10ch;font-size:clamp(4rem,8vw,7rem)}.atlas-mode-switch.is-entry{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:0;background:transparent}.atlas-mode-switch.is-entry button{position:relative;min-height:18rem;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;overflow:hidden;padding:1.7rem;border:2px solid var(--field-navy);clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,0 100%);color:white;text-align:left;transition:transform .18s ease,box-shadow .18s ease}.atlas-mode-switch.is-entry #studyModeButton{background:var(--field-navy)}.atlas-mode-switch.is-entry #quizModeButton{background:var(--field-blue)}.atlas-mode-switch.is-entry button:hover{transform:translateY(-6px);box-shadow:9px 10px 0 rgba(16,42,56,.2)}.mode-card-meta{position:absolute;left:1.7rem;top:1.6rem;color:var(--field-lime);font:800 .7rem ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em}.mode-card-glyph{position:absolute;right:1.7rem;top:1.5rem;width:7.6rem;aspect-ratio:1;display:grid;place-items:center;border:2px solid currentColor;border-radius:50%;color:var(--field-lime);font:700 4rem/1 Georgia,serif}.mode-card-glyph:before,.mode-card-glyph:after{content:"";position:absolute;background:currentColor;opacity:.6}.mode-card-glyph:before{width:145%;height:1px}.mode-card-glyph:after{width:1px;height:145%}.atlas-mode-switch.is-entry button strong{position:relative;font-size:clamp(2rem,4vw,3.25rem);line-height:1;letter-spacing:-.06em}.atlas-mode-switch.is-entry button small{position:relative;max-width:24rem;margin-top:.8rem;color:rgba(255,255,255,.72);font-size:.95rem;line-height:1.55}.mode-card-action{position:relative;width:100%;display:flex;justify-content:space-between;margin-top:1.35rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.38);font-size:.85rem;font-weight:900}.mode-card-action b{color:var(--field-lime);font-size:1.35rem}.atlas-mode-switch:not(.is-entry) button>:not(strong){display:none}.atlas-mode-switch:not(.is-entry) button strong{font-size:inherit}
.atlas-mode-switch button:focus-visible,.quiz-choice:focus-visible,#nextQuiz:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
/* 정답 팝업 — 뒤로 지도가 비쳐서 방금 문제의 위치를 다시 확인할 수 있다 */
.quiz-modal{width:min(46rem,calc(100% - 2.5rem));max-height:86vh;padding:0;border:1px solid var(--line);background:var(--paper);color:var(--ink);overflow:auto;box-shadow:0 24px 60px rgba(16,42,56,.32)}
.quiz-modal::backdrop{background:rgba(16,42,56,.55)}
.quiz-modal-head{position:sticky;top:0;z-index:1;padding:1.4rem 1.5rem 1.1rem;border-bottom:2px solid var(--ink);background:var(--paper)}
.quiz-modal-badge{margin:0 0 .5rem;font-size:.72rem;font-weight:900;letter-spacing:.14em}
.quiz-modal-badge.is-correct{color:#267244}.quiz-modal-badge.is-wrong{color:#b84b31}.quiz-modal-badge.is-over{color:var(--field-blue)}
.quiz-modal-head h2{margin:0;font:600 clamp(1.6rem,3vw,2.2rem)/1.15 "Twemoji Country Flags",Georgia,"Noto Serif KR",serif}
#quizResultSub{margin:.55rem 0 0;color:var(--ink);font-size:.95rem;font-weight:700}
.quiz-modal-score{margin:.35rem 0 0;color:var(--muted);font-size:.82rem;font-weight:700}
.quiz-modal-score:empty{display:none}
/* 기회를 다 썼을 때의 점수판 — 맞힌 수가 주인공이라 크게, 나머지는 한 줄로 */
.quiz-score-card{padding:1.6rem 0 .4rem;text-align:center}
.quiz-score-line{margin:0;display:flex;align-items:baseline;justify-content:center;gap:.45rem}
.quiz-score-line strong{font:900 4rem/1 Georgia,"Noto Serif KR",serif;color:var(--green)}
.quiz-score-line span{font-size:1.15rem;font-weight:800;color:var(--muted)}
.quiz-score-rate{margin:.6rem 0 0;font-size:1rem;font-weight:800}
.quiz-score-last{margin:1.1rem 0 0;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted);font-size:.86rem}
.quiz-modal-body{display:grid;gap:1rem;padding:1.3rem 1.5rem}
.quiz-modal-body>header{display:none}
.quiz-modal-body>section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.quiz-modal-body>section>h3,.quiz-modal-body>section>small{grid-column:1/-1;margin:0}
.quiz-modal-foot{position:sticky;bottom:0;display:flex;justify-content:flex-end;gap:.6rem;padding:1rem 1.5rem 1.3rem;border-top:1px solid var(--line);background:var(--paper)}
/* 정답 축하 — 팝업을 덮었다가 물러나면서 국가 정보를 드러낸다 */
.quiz-modal:has(.quiz-celebrate:not([hidden]))>*:not(.quiz-celebrate){visibility:hidden}
.quiz-celebrate{position:absolute;inset:0;z-index:5;display:grid;place-content:center;justify-items:center;gap:.5rem;overflow:hidden;background:var(--paper);cursor:pointer}
.quiz-celebrate[hidden]{display:none}   /* display 지정이 hidden 속성을 이겨버리므로 반드시 필요 */
.quiz-celebrate strong{position:relative;z-index:2;font:900 clamp(2.4rem,6vw,3.8rem)/1 Pretendard,"Noto Sans KR",sans-serif;letter-spacing:-.06em;color:#1d7a45}
.quiz-celebrate span{position:relative;z-index:2;font-size:clamp(1.1rem,2.4vw,1.5rem);font-weight:900;color:var(--ink)}
/* 오답 — 같은 크기로 띄우되 색과 움직임을 다르게 해서 정답과 헷갈리지 않게 */
.quiz-celebrate.is-wrong{background:#fff4ef}
.quiz-celebrate.is-wrong strong{color:#b84b31}
.quiz-celebrate.is-wrong .burst,.quiz-celebrate.is-wrong .confetti{display:none}
.quiz-celebrate.is-wrong.is-playing strong{animation:wrongShake .45s cubic-bezier(.36,.07,.19,.97) both}
@keyframes wrongShake{0%{transform:scale(.85);opacity:0}
  35%{opacity:1}45%{transform:translateX(-.6rem)}60%{transform:translateX(.5rem)}
  75%{transform:translateX(-.3rem)}100%{transform:none;opacity:1}}
.quiz-celebrate.is-playing strong{animation:celebratePop .5s cubic-bezier(.2,1.5,.4,1) both}
.quiz-celebrate.is-playing span{animation:celebrateRise .45s .22s ease-out both}
.quiz-celebrate.is-leaving{animation:celebrateOut .3s ease-in forwards}
.quiz-celebrate .burst{position:absolute;top:50%;left:50%;width:1px;height:1px}
.quiz-celebrate .burst i{position:absolute;left:0;top:0;width:5px;height:2.6rem;margin-left:-2.5px;border-radius:3px;background:var(--field-lime);transform-origin:50% 0;opacity:0}
.quiz-celebrate .burst i:nth-child(even){background:#1d7a45;height:1.9rem}
.quiz-celebrate .burst i:nth-child(1){--a:0deg}.quiz-celebrate .burst i:nth-child(2){--a:45deg}
.quiz-celebrate .burst i:nth-child(3){--a:90deg}.quiz-celebrate .burst i:nth-child(4){--a:135deg}
.quiz-celebrate .burst i:nth-child(5){--a:180deg}.quiz-celebrate .burst i:nth-child(6){--a:225deg}
.quiz-celebrate .burst i:nth-child(7){--a:270deg}.quiz-celebrate .burst i:nth-child(8){--a:315deg}
.quiz-celebrate.is-playing .burst i{animation:burstRay .55s cubic-bezier(.2,.9,.3,1) both}
.quiz-celebrate .confetti b{position:absolute;top:42%;left:50%;width:.7rem;height:.95rem;border-radius:2px;opacity:0}
.quiz-celebrate.is-playing .confetti b{animation:confettiFly 1.15s cubic-bezier(.15,.7,.4,1) both}
.quiz-celebrate .confetti b:nth-child(3n+1){background:var(--field-lime)}
.quiz-celebrate .confetti b:nth-child(3n+2){background:var(--field-orange)}
.quiz-celebrate .confetti b:nth-child(3n){background:var(--field-blue)}
.quiz-celebrate .confetti b:nth-child(1){--dx:-19rem;--dy:-5rem;--r:-320deg;animation-delay:.02s}
.quiz-celebrate .confetti b:nth-child(2){--dx:-14rem;--dy:5rem;--r:250deg;animation-delay:.09s}
.quiz-celebrate .confetti b:nth-child(3){--dx:-10rem;--dy:-8rem;--r:190deg;animation-delay:.05s}
.quiz-celebrate .confetti b:nth-child(4){--dx:-6rem;--dy:7rem;--r:-160deg;animation-delay:.13s}
.quiz-celebrate .confetti b:nth-child(5){--dx:-2.5rem;--dy:-9.5rem;--r:300deg;animation-delay:0s}
.quiz-celebrate .confetti b:nth-child(6){--dx:2.5rem;--dy:-9rem;--r:-280deg;animation-delay:.07s}
.quiz-celebrate .confetti b:nth-child(7){--dx:6rem;--dy:8rem;--r:210deg;animation-delay:.11s}
.quiz-celebrate .confetti b:nth-child(8){--dx:10rem;--dy:-7rem;--r:-230deg;animation-delay:.04s}
.quiz-celebrate .confetti b:nth-child(9){--dx:14rem;--dy:6rem;--r:270deg;animation-delay:.15s}
.quiz-celebrate .confetti b:nth-child(10){--dx:18rem;--dy:-4rem;--r:-190deg;animation-delay:.06s}
.quiz-celebrate .confetti b:nth-child(11){--dx:-22rem;--dy:2rem;--r:240deg;animation-delay:.12s}
.quiz-celebrate .confetti b:nth-child(12){--dx:22rem;--dy:1rem;--r:-260deg;animation-delay:.1s}
@keyframes celebratePop{0%{transform:scale(.4);opacity:0}60%{opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes celebrateRise{from{transform:translateY(.7rem);opacity:0}to{transform:none;opacity:1}}
@keyframes celebrateOut{to{opacity:0;transform:scale(1.06)}}
@keyframes burstRay{0%{opacity:0;transform:rotate(var(--a)) translateY(0) scaleY(.3)}
  35%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateY(5.5rem) scaleY(1)}}
@keyframes confettiFly{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}
  12%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(var(--r))}}
/* 모달 본문이 축하 뒤에 이어서 올라온다 */
.quiz-modal.is-revealing .quiz-modal-head,.quiz-modal.is-revealing .quiz-modal-body{animation:revealUp .34s ease-out both}
.quiz-modal.is-revealing .quiz-modal-body{animation-delay:.06s}
@keyframes revealUp{from{transform:translateY(.9rem);opacity:0}to{transform:none;opacity:1}}
@media(max-width:560px){.quiz-modal-body>section{grid-template-columns:1fr}.quiz-modal-foot{flex-direction:column-reverse}.quiz-modal-foot button{width:100%}}
.explore-country.is-quiz-target{fill:var(--orange)}
.country-quiz{grid-column:1/-1;padding:1.25rem;border:1px solid var(--line);background:var(--paper)}
.quiz-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-bottom:.9rem;border-bottom:2px solid var(--ink)}.quiz-header .eyebrow{margin:0}.quiz-hud{display:flex;gap:.55rem}.quiz-hud span{display:grid;gap:.2rem;min-width:7.5rem;padding:.65rem .8rem;border:1px solid var(--line);background:white;color:var(--muted);font-size:.72rem;font-weight:800}.quiz-hud output{color:var(--ink);font-size:1.05rem;font-weight:900}.quiz-hud span:first-child output{color:#d34c3d;letter-spacing:.08em}
.country-quiz h2{margin:.25rem 0 .5rem;font:600 clamp(1.8rem,3vw,2.5rem)/1.05 Georgia,"Noto Serif KR",serif}
.country-quiz>p:not(.eyebrow):not(.quiz-feedback){margin:0 0 1rem;color:var(--muted)}
.quiz-choices{display:grid;gap:.55rem;margin-top:1rem}
.quiz-choice{min-height:3.25rem;padding:.75rem 1rem;border:1px solid var(--line);background:white;color:var(--ink);text-align:left;font-weight:900;cursor:pointer}
.quiz-choice:hover:not(:disabled){background:#edf4db;border-color:var(--green)}
.quiz-choice.is-correct{background:#e2f3df;border:2px solid #267244;color:#18542f}
.quiz-choice.is-wrong{background:#fff0e7;border:2px solid #b84b31;color:#8f321f}
.quiz-choice:disabled{opacity:1;cursor:default}
.quiz-feedback{min-height:3rem;margin:1rem 0 0;padding:.8rem;border-left:4px solid transparent;background:white}
.quiz-feedback:empty{display:none}
.quiz-feedback.is-correct{border-color:#267244}
.quiz-feedback.is-wrong{border-color:#b84b31}
#nextQuiz{width:100%;margin-top:.75rem}
.study-to-quiz{align-self:end;display:grid;grid-template-columns:1fr auto;align-items:center;gap:.35rem 1rem;width:100%;padding:1.1rem 1.25rem;border:2px solid var(--field-navy);background:var(--field-lime);color:var(--field-navy);text-align:left;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.study-to-quiz[hidden]{display:none}.study-to-quiz span{grid-column:1/-1;font-size:.78rem;font-weight:800}.study-to-quiz strong{font-size:1.15rem}.study-to-quiz b{font-size:1.8rem}.study-to-quiz:hover{transform:translateY(-3px);box-shadow:7px 7px 0 rgba(16,42,56,.18)}.study-to-quiz:focus-visible{outline:3px solid var(--field-blue);outline-offset:3px}
@media(max-width:900px){.country-quiz{position:static;grid-column:1;grid-row:auto}}
@media(max-width:900px){.country-study-layout,.explore-main{grid-template-columns:1fr}.country-profile,#countryProfile{position:static;grid-column:1;grid-row:auto}.continent-countries{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.is-atlas-entry .explore-main{padding-top:2.5rem}.is-atlas-entry .explore-heading{grid-template-columns:1fr;gap:1rem}.is-atlas-entry .explore-heading h1{font-size:clamp(3.6rem,15vw,5.8rem)}.atlas-mode-switch.is-entry{grid-template-columns:1fr}.atlas-mode-switch.is-entry button{min-height:13rem}.mode-card-glyph{width:5.5rem;font-size:3rem}}
@media(max-width:560px){.quiz-header{align-items:flex-start;flex-direction:column}.quiz-hud{width:100%}.quiz-hud span{flex:1;min-width:0}.country-index,.continent-countries,.profile-facts,#countryProfile>section{grid-template-columns:1fr}.gdp-highlight{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.atlas-mode-switch.is-entry button,.study-to-quiz{transition:none}
  .quiz-celebrate .burst,.quiz-celebrate .confetti{display:none}
  .quiz-celebrate.is-playing strong,.quiz-celebrate.is-wrong.is-playing strong,
  .quiz-celebrate.is-playing span,.quiz-celebrate.is-leaving,
  .quiz-modal.is-revealing .quiz-modal-head,.quiz-modal.is-revealing .quiz-modal-body{animation:none}}

/* 반 선택 화면의 진행 현황 카드 */
.class-progress-note{margin:-22px 0 26px;padding:11px 15px;border:1px solid var(--line);border-radius:14px;background:rgba(255,253,248,.72);color:var(--muted);font-size:13px;font-weight:700}
.class-progress-note[hidden]{display:none}
.class-progress-row{display:flex;align-items:center;gap:10px;margin:-22px 0 26px}
.class-progress-row[hidden]{display:none}
.class-progress-row .class-progress-note{flex:1 1 auto;margin:0}
.class-reset{flex:0 0 auto;padding:11px 15px;border:1px solid var(--line);border-radius:14px;background:transparent;color:var(--muted);font-size:13px;font-weight:700;white-space:nowrap;cursor:pointer}
.class-reset:hover{border-color:var(--ink);color:var(--ink)}
.class-grid.with-progress a{place-items:stretch;align-content:space-between;gap:10px;min-height:132px;padding:15px 16px 13px;text-align:left;font-size:14px;font-weight:700}
.class-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.class-card-head b{font-size:23px;font-weight:900;letter-spacing:-.03em}
.class-card-badge{padding:4px 8px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}
.class-card-badge[data-state="done"]{background:#e2f3df;color:#267244}
.class-card-badge[data-state="partial"]{background:#e7ecf8;color:var(--blue)}
.class-card-badge[data-state="empty"]{background:#eeece3;color:var(--muted)}
.class-card-bar{display:block;height:6px;border-radius:999px;background:#e8e5d9;overflow:hidden}
.class-card-bar i{display:block;width:var(--fill,0%);height:100%;border-radius:999px;background:var(--green)}
.class-card-bar[data-state="partial"] i{background:var(--blue)}
.class-card-meta{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:12px;font-weight:700}
.class-card-meta strong{color:var(--ink);font-weight:900}
.class-card-date{color:var(--muted);font-size:11px;font-weight:700}
.class-grid.with-progress a:not([data-progress]){align-content:start;gap:8px}
.class-grid a[data-progress]{border-color:#b7bfae}
.class-grid a[data-progress="done"]{background:linear-gradient(var(--white),#f3f8ec)}
@media(max-width:680px){.class-progress-note{margin-top:-14px}.class-progress-row{margin-top:-14px;flex-wrap:wrap}.class-grid.with-progress a{min-height:120px}}

/* 정답 팝업의 대표 기업 — 수출산업 목록과 같은 틀을 쓰되 번호 색으로 구분한다 */
.answer-companies li i{background:var(--orange)}
.answer-companies li strong{text-align:right}
.answer-companies li strong .unlisted{color:var(--muted)}
.answer-companies[hidden]{display:none}
.answer-companies li strong b{white-space:nowrap}
@media(max-width:560px){.answer-companies .industry-copy>span{display:block}.answer-companies .industry-copy>span small{display:block;margin-top:1px}}

/* 이어하기 안내 — 설정창에서 폼 대신 뜬다 */
.setup-history[hidden]{display:none}
.setup-secondary{width:100%;margin-top:9px;border:1px solid var(--line);border-radius:999px;padding:12px 18px;background:transparent;color:var(--muted);font-weight:800;cursor:pointer}
.setup-secondary:hover{border-color:var(--ink);color:var(--ink)}
.reset-dialog{width:min(460px,calc(100% - 32px))}
.reset-dialog h2{margin:0;font-size:25px;letter-spacing:-.035em}
.dialog-action.danger{background:#a8391f}





.setup-history{margin:14px 0 0;padding:10px 13px;border-radius:12px;background:#f2f2e9;color:var(--muted);font-size:12px;font-weight:700}
@media(max-width:560px){}

/* 지도는 한 행을 가득 채우고, 그 아래 행에 출제 나라와 순위 줄을 2열로 놓는다 */
.game-main>.country-map-card{margin:0 0 14px}
/* 지도는 1000x402.8 비율 그대로 늘어나야 한 세계만 꽉 찬다.
   세로를 max-height로 자르면 가로가 남아 대륙이 두 번씩 보인다. */
.game-main>.country-map-card .locator-map{width:100%;height:auto}
.gdp-round{display:grid;grid-template-columns:minmax(230px,.42fr) minmax(0,1.58fr);gap:14px;align-items:start}
.gdp-round .prompt-card{display:flex;flex-direction:column;justify-content:center;height:100%}
@media(max-width:760px){.gdp-round{grid-template-columns:1fr}}

/* 지도 확대 — 프레임 안에서만 커지고, 확대했을 때만 끌어서 움직인다 */
.map-zoom{position:relative;overflow:hidden;border-radius:13px;touch-action:none;background:#dceae4}
.map-zoom svg{transform-origin:center;will-change:transform}
.map-zoom[data-zoomed="true"]{cursor:grab}
.map-zoom[data-zoomed="true"]:active{cursor:grabbing}
.map-zoom .map-zoom-controls{position:absolute;top:10px;right:10px;display:flex;gap:6px;margin:0;justify-content:flex-end}
.map-zoom .map-zoom-controls button{min-width:38px;height:38px;padding:0 10px;border:1px solid rgba(19,35,29,.18);border-radius:11px;background:rgba(255,253,248,.94);color:var(--ink);font-size:15px;font-weight:900;line-height:1;cursor:pointer;box-shadow:0 3px 10px rgba(20,43,32,.12)}
.map-zoom .map-zoom-controls button:hover:not(:disabled){border-color:var(--ink)}
.map-zoom .map-zoom-controls button:disabled{opacity:.4;cursor:default}
.map-zoom .map-zoom-controls{align-items:center}
.map-zoom .map-zoom-level{margin:0;padding:6px 10px;border-radius:999px;background:rgba(255,253,248,.9);color:var(--muted);font:800 11px ui-monospace,SFMono-Regular,Menlo,monospace}
@media(max-width:560px){.map-zoom .map-zoom-controls button{min-width:34px;height:34px}.map-zoom .map-zoom-level{display:none}}

/* 대표 수출산업·대표 기업 — 가로로 긴 줄 대신 3열 카드 */
.answer-industries ol{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:12px 0 9px}
.answer-industries li{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr auto;align-items:start;gap:7px;padding:14px 13px}
.answer-industries li>i{grid-row:1}
.answer-industries li .industry-copy{grid-row:2/4;display:grid;gap:4px;align-content:start}
.answer-industries li .industry-copy>span{display:block}
.answer-industries li .industry-copy>span>b{display:block;font-size:15px;line-height:1.25;word-break:keep-all}
.answer-industries li .industry-copy>span>small{display:block;margin-top:3px}
.answer-industries li .industry-copy>small{white-space:normal;overflow:visible;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.answer-industries li>strong{grid-row:4;display:block;padding-top:8px;border-top:1px solid rgba(19,35,29,.1)}
.answer-industries li>strong>b{display:block;font-size:15px}
.answer-industries li>strong>small{display:block;margin-top:2px;font-size:10px}
.answer-companies li>strong{text-align:left}
@media(max-width:560px){.answer-industries ol{grid-template-columns:1fr;gap:7px}.answer-industries li{grid-template-rows:none;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 12px}.answer-industries li .industry-copy{grid-row:auto}.answer-industries li>strong{grid-row:auto;padding-top:0;border-top:0;text-align:right}.answer-industries li .industry-copy>small{-webkit-line-clamp:2}}
/* 카드 3열이 들어갈 만큼 정답 팝업을 넓힌다 (설정 팝업은 그대로 좁게 둔다) */
#answerDialog{width:min(980px,calc(100% - 32px))}
.answer-industries li>strong>b{white-space:nowrap}
.answer-industries li .industry-copy>small{word-break:keep-all}

/* 지도 공부 화면 — 지도를 화면의 주인공으로 두고, 나라를 누르는 것이 학습이 되게 한다 */
.is-study-mode .explore-heading{margin-bottom:1rem;padding-bottom:1.1rem}
.is-study-mode .explore-heading h1{font-size:clamp(2.2rem,4vw,3.2rem)}
.is-study-mode .explore-heading:after{content:none}
.is-study-mode .explore-main{gap:1rem}
.is-study-mode #atlasMapPanel{grid-column:1/-1;position:relative}
.is-study-mode #countryProfile{grid-column:1;grid-row:auto;position:static}
.is-study-mode #countryBrowser{grid-column:2;position:sticky;top:1rem;max-height:calc(100vh - 3rem);overflow:auto}
.is-study-mode #exploreMap svg{width:100%;height:auto}

/* 누를 수 있다는 것이 보이게 — 기본 색, 지나갈 때, 눌러 본 나라, 지금 보는 나라가 모두 달라야 한다 */
.explore-country:hover,.explore-country-dot:hover{fill:var(--lime);stroke:var(--ink);stroke-width:1.6}
.explore-country.is-visited{fill:#cfe3cd}
.explore-country-dot.is-visited{fill:#4b7f5f}
.explore-country.is-visited:hover{fill:var(--lime)}
.map-hover-label{position:absolute;z-index:5;transform:translate(14px,-140%);padding:5px 9px;border-radius:9px;background:var(--ink);color:white;font-size:13px;font-weight:800;white-space:nowrap;pointer-events:none}
.map-hover-label[hidden]{display:none}

/* 지도 바로 아래 — 방금 누른 나라와 진도 */
.study-deck{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.6fr) minmax(16rem,.9fr);gap:.75rem;align-items:stretch}
.study-deck[hidden]{display:none}
.study-now{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding:1rem 1.1rem;border:1px solid var(--line);background:var(--white)}
.study-now-flag{font-size:2rem;line-height:1}
.study-now-copy b{display:block;font-size:1.35rem;font-weight:900;letter-spacing:-.03em}
.study-now-copy small,.study-now-fact small{display:block;color:var(--muted);font-size:.72rem;font-weight:800}
.study-now-fact{padding-left:1rem;border-left:1px solid var(--line)}
.study-now-fact b{font-size:1rem;font-weight:900}.study-now-fact em{display:block;margin-top:.1rem;color:var(--muted);font-size:.72rem;font-style:normal;font-weight:700}
.study-progress{display:grid;align-content:center;gap:.55rem;padding:1rem 1.1rem;border:1px solid var(--line);background:var(--paper)}
.study-progress-count{display:flex;align-items:baseline;gap:.4rem;margin:0}
.study-progress-count strong{font-size:1.6rem;font-weight:900;line-height:1}
.study-progress-count span{color:var(--muted);font-size:.8rem;font-weight:800}
.study-progress-bar{height:7px;border-radius:999px;background:#dfdccf;overflow:hidden}
.study-progress-bar i{display:block;height:100%;width:0;border-radius:999px;background:var(--green);transition:width .25s ease}
.study-deck[data-complete="true"] .study-progress-bar i{background:var(--orange)}
.study-progress-actions{display:flex;gap:.4rem}
.study-progress-actions button{flex:1;border:1px solid var(--ink);border-radius:999px;padding:.55rem .7rem;background:var(--ink);color:white;font-size:.8rem;font-weight:800;cursor:pointer}
.study-progress-actions button:disabled{border-color:var(--line);background:transparent;color:var(--muted);cursor:default}
.study-progress-actions .study-reset{flex:0 0 auto;border-color:var(--line);background:transparent;color:var(--muted)}
.study-progress-actions .study-reset:hover{border-color:var(--ink);color:var(--ink)}
.country-index-item.is-visited{border-color:#8fb392}
.country-index-item.is-visited strong:after{content:" ✓";color:var(--green)}
@media(max-width:900px){.is-study-mode #countryProfile,.is-study-mode #countryBrowser{grid-column:1;position:static;max-height:none}.study-deck{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.study-progress-bar i{transition:none}}
/* 지금 보고 있는 나라는 눌러 본 표시·마우스 올린 표시보다 항상 세게 — 뒤에 두어 이기게 한다 */
.explore-country.is-selected,.explore-country.is-selected:hover,
.explore-country-dot.is-selected,.explore-country-dot.is-selected:hover{fill:var(--green);stroke:var(--lime);stroke-width:2.5}
/* 국가 목록이 지도 옆 좁은 칸으로 들어갔으므로 칸 수를 폭에 맞춘다 */
.is-study-mode .continent-countries{grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr))}
.is-study-mode .country-index-item strong{min-width:0;overflow-wrap:anywhere;word-break:keep-all}

/* 퀴즈 정답 팝업 — 수출산업·대표 기업을 3열 카드로 */
.quiz-modal{width:min(62rem,calc(100% - 2.5rem))}
.quiz-modal-body .trade-pair{grid-template-columns:1fr;gap:1.4rem}
.quiz-modal-body .industry-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.quiz-modal-body .industry-card{display:grid;align-content:start;gap:.1rem;padding:.9rem}
.quiz-modal-body .industry-card strong{font-size:.98rem;line-height:1.3;word-break:keep-all}
.quiz-modal-body .industry-card p{font-size:.8rem;line-height:1.5}
.quiz-modal-body .industry-card>p:last-child{margin-top:.65rem;padding-top:.6rem;border-top:1px solid var(--line);color:var(--ink);font-weight:800}
.quiz-modal-body .company-card p.company-note{margin-top:.35rem;padding-top:0;border-top:0;color:var(--muted);font-weight:400}
.quiz-modal-body .company-card .company-cap{margin-top:.65rem;padding-top:.6rem;border-top:1px solid var(--line)}
.quiz-modal-body .trade-col>small{color:var(--muted);font-size:.7rem}
@media(max-width:720px){.quiz-modal-body .industry-cards{grid-template-columns:1fr}}

/* 랜딩 히어로 오른쪽 QR — 교실 화면을 띄워 두면 학생이 폰으로 바로 연다 */
.atlas-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center}
.atlas-hero .atlas-title{align-self:center}
.atlas-qr{display:flex;align-items:center;gap:14px;padding:14px 16px;border:2px solid var(--atlas-ink);background:var(--atlas-white)}
.atlas-qr .qr-code{display:block;width:104px;height:104px}
.atlas-qr-copy p{margin:0 0 6px;color:var(--atlas-blue);font:800 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em}
.atlas-qr-copy strong{display:block;font-size:16px;font-weight:900;letter-spacing:-.03em}
.atlas-qr-copy a{display:inline-block;margin-top:5px;color:#526875;font:700 11px ui-monospace,SFMono-Regular,Menlo,monospace;text-decoration:none;border-bottom:1px solid var(--atlas-line)}
.atlas-qr-copy a:hover{color:var(--atlas-ink);border-color:var(--atlas-ink)}
.atlas-qr-open{padding:0;border:0;background:none;cursor:zoom-in;line-height:0}
.atlas-qr-open:focus-visible{outline:3px solid var(--atlas-blue);outline-offset:3px}
/* 확대 팝업 — 교실 뒷자리에서도 스캔되도록 화면 높이에 맞춰 키운다 */
.qr-dialog{border:2px solid var(--atlas-ink);border-radius:0;padding:26px 28px 24px;background:var(--atlas-white);color:var(--atlas-ink);text-align:center}
.qr-dialog::backdrop{background:rgba(16,42,56,.72)}
.qr-dialog-eyebrow{margin:0 0 8px;color:var(--atlas-blue);font:800 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em}
.qr-dialog h2{margin:0 0 18px;font-size:24px;font-weight:900;letter-spacing:-.03em}
.qr-dialog-code .qr-code{display:block;width:min(62vh,78vw,420px);height:min(62vh,78vw,420px)}
.qr-dialog a{display:inline-block;margin-top:18px;color:#526875;font:700 14px ui-monospace,SFMono-Regular,Menlo,monospace;text-decoration:none;border-bottom:1px solid var(--atlas-line)}
.qr-dialog a:hover{color:var(--atlas-ink);border-color:var(--atlas-ink)}
.qr-dialog-close{display:block;width:100%;margin-top:22px;padding:12px 18px;border:2px solid var(--atlas-ink);background:var(--atlas-ink);color:var(--atlas-white);font-weight:800;cursor:pointer}
@media(max-width:760px){.atlas-hero{grid-template-columns:1fr;gap:22px}.atlas-qr{justify-self:start}}

/* 사분면 게임의 지도 확대.
 * 답을 고르는 사분면 버튼이 지도 위에 겹쳐 있어서, 지도만 키우면 그려진 축과 버튼 경계가 어긋난다.
 * 그래서 지도와 버튼을 한 겹(.map-stage)에 담아 함께 키우고, 글자만 배율만큼 되돌린다. */
.world-game.map-zoom{border-radius:18px}
.map-stage{position:absolute;inset:0;transform-origin:center;will-change:transform}
.map-quadrants{--quadrant-glyph:32px;--quadrant-label:12px;--quadrant-badge:13px}
.map-quadrants button b{font-size:calc(var(--quadrant-glyph) / var(--map-zoom,1))}
.map-quadrants button span{font-size:calc(var(--quadrant-label) / var(--map-zoom,1))}
.map-quadrants button.wrong:after{font-size:calc(var(--quadrant-badge) / var(--map-zoom,1))}
@media(max-width:760px){.map-quadrants{--quadrant-glyph:22px;--quadrant-label:10px}}
/* 확대하면 사분면 한 칸이 화면보다 커져서, 칸 한가운데 있던 이름표가 화면 밖으로 밀려난다.
 * 확대 중에는 네 이름표를 축이 만나는 자리로 모아 둔다 — 기준점이 보이면 방향도 함께 보인다. */
.map-zoom[data-zoomed="true"] .map-quadrants button{display:flex;flex-direction:column;padding:calc(20px / var(--map-zoom,1))}
.map-zoom[data-zoomed="true"] .map-quadrants button b{opacity:.6}
.map-zoom[data-zoomed="true"] [data-q="NW"]{align-items:flex-end;justify-content:flex-end}
.map-zoom[data-zoomed="true"] [data-q="NE"]{align-items:flex-start;justify-content:flex-end}
.map-zoom[data-zoomed="true"] [data-q="SW"]{align-items:flex-end;justify-content:flex-start}
.map-zoom[data-zoomed="true"] [data-q="SE"]{align-items:flex-start;justify-content:flex-start}

/* 끝난 반의 순위표. 점수가 같으면 같은 순위라 순위 칸은 조 번호와 따로 둔다. */
.class-result-dialog .class-result-note{margin:-14px 0 20px;color:var(--muted);font-size:13px;line-height:1.6}
.class-ranking{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.class-rank-row{display:grid;grid-template-columns:3.4rem minmax(0,1fr) auto auto;align-items:baseline;gap:12px;padding:14px 16px;border-radius:14px;background:#f2f2e9;font-variant-numeric:tabular-nums}
.class-rank-row[data-place="1"]{background:#edf4db;outline:2px solid var(--green)}
.class-rank-row b{font:800 13px Inter,Pretendard,sans-serif;color:var(--muted)}
.class-rank-row[data-place="1"] b{color:var(--green)}
.class-rank-row strong{font-size:17px}
.class-rank-score{font:22px Georgia,serif}
.class-rank-score small{color:var(--muted);font:500 12px Inter,Pretendard,sans-serif}
.class-rank-percent{min-width:3.2rem;text-align:right;color:var(--muted);font-size:13px;font-weight:800}
@media(max-width:560px){.class-rank-row{grid-template-columns:2.8rem minmax(0,1fr) auto;gap:8px;padding:12px}.class-rank-percent{grid-column:2/4;text-align:left}}
