:root{color-scheme:light;--ink:#182a36;--muted:#65747a;--paper:#f3efe6;--card:#fffdf8;--line:#ddd8cd;--gold:#cf9a42;--red:#a6584d;--green:#447e72}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,system-ui,sans-serif;line-height:1.6}
button,input{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}
.shell{max-width:1500px;margin:auto;min-height:100vh;padding:0 clamp(16px,3.4vw,50px) 32px}
.topbar{height:72px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #cfc9bd}
.brand{color:var(--ink);text-decoration:none;font-family:Georgia,serif;font-size:19px;font-weight:800;letter-spacing:.15em}.brand:first-letter{color:var(--gold)}
.edition{color:#566871;font-size:11px;font-weight:700;letter-spacing:.12em}.edition span{margin-left:12px;color:var(--gold)}
.intro{display:flex;justify-content:space-between;align-items:end;gap:24px;padding:36px 0 28px}
.eyebrow,.section-label,.card-head small{font-size:11px;font-weight:800;letter-spacing:.17em;color:#9d7232}
.eyebrow{margin:0 0 9px}
h1,h2,h3,p{margin-top:0}
h1{font-family:Georgia,"Yu Mincho",serif;font-size:clamp(34px,4vw,60px);line-height:1.2;letter-spacing:.045em;margin-bottom:12px}
h1 span{color:#b1773e}
.intro p:last-child{margin:0;color:#57666c;font-size:14px}
.intro-number{font:700 clamp(76px,9vw,130px)/.75 Georgia,serif;color:#dfd1b9;letter-spacing:-.08em;display:flex;align-items:baseline;gap:12px}.intro-number small{font:800 12px/1 system-ui,sans-serif;letter-spacing:.24em;color:#b28b58}
.scoreboard{position:relative;display:grid;grid-template-columns:repeat(3,1fr);background:#182d39;color:#fff;padding:17px 22px 23px;border-radius:12px;gap:10px;margin-bottom:22px}
.scoreboard>div:not(.score-rail){display:flex;align-items:baseline;justify-content:center;gap:18px;border-right:1px solid #52616a}.scoreboard>div:nth-child(3){border-right:0}
.scoreboard span{font-size:12px;color:#b5c5c6}.scoreboard strong{font:700 30px/1 Georgia,serif;min-width:64px}.scoreboard strong small{font:500 15px/1 system-ui,sans-serif;color:#9eafb3}
.score-rail{position:absolute;bottom:0;left:0;right:0;height:5px;background:#47616a;border-radius:0 0 12px 12px;overflow:hidden}.score-rail i{display:block;height:100%;width:0;background:#cf9a42;transition:width .28s}
.play-area{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);gap:20px;align-items:stretch}
.map-card,.quiz-card{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 34px #342b1d0b}
.map-card{min-width:0;overflow:hidden}.card-head{padding:20px 24px 13px;display:flex;align-items:center;justify-content:space-between;gap:15px}.card-head h2{font-size:20px;margin:2px 0 0}
.map-legend{display:flex;gap:14px;color:#64737a;font-size:11px;white-space:nowrap}.map-legend span{display:flex;gap:5px;align-items:center}.dot{width:9px;height:9px;border-radius:50%;display:inline-block}.dot.active{background:var(--gold)}.dot.good{background:var(--green)}.dot.bad{background:var(--red)}
.region-tabs{display:flex;gap:6px;overflow-x:auto;padding:0 20px 13px;scrollbar-width:thin}.region-tabs button{flex:none;min-height:42px;border:1px solid #e1dcd1;border-radius:999px;background:#faf8f2;color:#50606a;padding:8px 14px;font-size:12px;font-weight:700;white-space:nowrap}.region-tabs button[aria-pressed="true"]{background:#243d49;border-color:#243d49;color:#fff}.region-tabs button:focus-visible,.primary-button:focus-visible,.point:focus-visible,input:focus-visible{outline:3px solid #c99032;outline-offset:3px}
.map-stage{height:clamp(440px,48vw,650px);margin:0 14px;border-radius:11px;background:radial-gradient(circle at 55% 40%,#e7eee8,#d6e4e2 70%,#c7d7d8);overflow:hidden;position:relative}
.map-stage::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#fff5 1px,transparent 1px),linear-gradient(90deg,#fff5 1px,transparent 1px);background-size:64px 64px;opacity:.25}
#map{display:block;width:100%;height:100%}.coast{fill:#e8dec8;stroke:#aeae97;stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.point{cursor:pointer;-webkit-tap-highlight-color:transparent}.point .hit{fill:transparent}.point .halo{fill:#cf9a4233;opacity:0}.point .core{fill:#304b56;stroke:#fffdf8;stroke-width:2.5;vector-effect:non-scaling-stroke;transition:fill .2s}.point:hover .core,.point:focus-visible .core{fill:#b9792f}.point.current .halo{opacity:1}.point.current .core{fill:#d7952e}.point.correct .core{fill:var(--green)}.point.wrong .core{fill:var(--red)}.point.locked{cursor:default}.point.locked:hover .core{filter:none}
.map-note{padding:11px 20px 17px;color:#718087;font-size:11px;margin:0}
.quiz-card{display:flex;min-height:570px}.view{display:flex;flex-direction:column;width:100%;padding:clamp(25px,3vw,42px)}.view h2{font-family:Georgia,"Yu Mincho",serif;font-size:clamp(27px,2.5vw,38px);line-height:1.35;margin:0 0 13px}.view>p:not(.feedback-kicker):not(.feedback-seat):not(.feedback-input):not(.small-copy):not(.rule):not(.perfect-message){font-size:14px;color:#64717a;max-width:28em}
.view-icon{font:70px/1 Georgia,serif;color:#d7a04a;margin:34px 0 17px}.rule{font-size:11px;color:#8b9799;margin:15px 0 0}.primary-button{margin-top:auto;width:100%;border:0;border-radius:9px;background:#233e4c;color:#fff;min-height:52px;padding:12px 18px;text-align:left;display:flex;align-items:center;justify-content:space-between;font-weight:800;box-shadow:0 7px 16px #1a37411c}.primary-button:hover{background:#315766}.primary-button span{font-size:22px;font-weight:400}
.question-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.question-top>span{font:700 13px Georgia,serif;color:#78878d}.prompt-mark{color:#d79b40;font-size:45px;margin:36px 0 12px}.small-copy{color:#79868b;font-size:13px;margin-bottom:30px}
#answer-form{display:flex;flex-direction:column;margin-top:auto}#answer-form label{font-size:12px;font-weight:800;margin-bottom:8px}#answer-input{height:56px;padding:12px 15px;border:1px solid #c7cbc7;border-radius:8px;background:#fff;color:var(--ink);font-size:18px}#answer-input::placeholder{color:#a3acab}#answer-form .primary-button{margin-top:18px}.input-error{color:#a34d43;font-size:12px;margin:6px 0 0}
.feedback-symbol{font:74px/1 Georgia,serif;color:var(--green);margin:45px 0 4px}.feedback-symbol.wrong{color:var(--red)}.feedback-kicker{font-size:13px;letter-spacing:.1em;font-weight:800;color:var(--green);margin:0 0 10px}.feedback-kicker.wrong{color:var(--red)}.feedback-seat{font-size:13px;color:#758489;margin:0 0 5px}.feedback-input{font-size:12px;color:#8a7772;margin:0}
.result-score{display:flex;align-items:baseline;gap:10px;color:#c3883f}.result-score strong{font:700 86px/1 Georgia,serif}.result-score span{font:500 22px/1 Georgia,serif;color:#7b888b}.perfect-message{color:var(--green);font-weight:800}.review-wrap{margin:20px 0 24px;max-height:215px;overflow:auto;border-top:1px solid var(--line);padding-top:15px}.review-wrap h3{font-size:13px;margin-bottom:9px}.review-wrap h3 span{font-weight:400;color:#879095}.review-wrap ol{padding-left:26px;margin:0;color:#62727b;font-size:12px}.review-wrap li{padding:3px 0}.review-wrap strong{color:var(--ink)}.review-wrap em{font-style:normal;color:#9a665b}
footer{display:flex;align-items:start;gap:20px;border-top:1px solid #d5cec1;margin-top:28px;padding-top:16px;color:#79817e;font-size:11px}footer>span{white-space:nowrap;font:700 11px Georgia,serif;letter-spacing:.15em}footer p{margin:0}footer a{color:#3e6870}
@media(max-width:880px){.play-area{grid-template-columns:1fr}.quiz-card{min-height:390px}.view{min-height:390px}.map-stage{height:min(65vh,520px)}}
@media(max-width:600px){.shell{padding:0 12px max(20px,env(safe-area-inset-bottom))}.topbar{height:58px}.edition{font-size:9px}.edition span{display:block;margin:0;text-align:right}.intro{padding:24px 4px 18px}.intro-number{display:none}.intro p:last-child{font-size:12px}.scoreboard{margin-bottom:12px;padding:12px 8px 18px;gap:0}.scoreboard>div:not(.score-rail){display:flex;flex-direction:column;align-items:center;gap:2px}.scoreboard span{font-size:10px}.scoreboard strong{font-size:22px;min-width:0}.scoreboard strong small{font-size:11px}.play-area{gap:12px}.card-head{padding:14px 14px 10px}.card-head h2{font-size:17px}.map-legend{gap:7px;font-size:9px}.map-legend span{gap:3px}.dot{width:7px;height:7px}.region-tabs{padding:0 11px 11px}.region-tabs button{font-size:11px;padding:7px 12px}.map-stage{height:clamp(350px,52vh,520px);margin:0 9px}.map-note{padding:9px 12px 12px}.quiz-card{min-height:340px}.view{min-height:340px;padding:25px}.view-icon{margin:16px 0 10px;font-size:52px}.prompt-mark{margin:17px 0 6px}.feedback-symbol{margin:15px 0 0;font-size:55px}footer{display:block;padding-bottom:12px}footer p{margin-top:8px}}
@media(max-width:880px) and (orientation:landscape){.play-area{grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr)}.map-stage{height:max(290px,65vh)}.quiz-card,.view{min-height:330px}.view{padding:20px}.view-icon{margin:12px 0}.prompt-mark{margin:10px 0}.feedback-symbol{margin:8px 0}}

/* NBA home-city map */
.map-stage{height:clamp(400px,39vw,550px)}
.neighbor-land{fill:#e0e1d2;stroke:#a8b2aa;stroke-width:1;stroke-linejoin:round;vector-effect:non-scaling-stroke;fill-rule:evenodd}
.state-shape{fill:#e9e1cd;stroke:#adb1a2;stroke-width:1;stroke-linejoin:round;vector-effect:non-scaling-stroke;fill-rule:evenodd}
#country-labels text{fill:#526d65;opacity:.65;letter-spacing:.18em;text-anchor:middle;font-family:Georgia,serif;pointer-events:none}
.map-label{position:absolute;z-index:2;pointer-events:none;max-width:calc(100% - 16px);background:#fffdf8;border:1px solid #d5c4a7;border-left:4px solid var(--gold);border-radius:8px;box-shadow:0 7px 22px #293b3524;padding:9px 14px;line-height:1.3}
.map-label strong{display:block;font:700 20px/1.2 Georgia,serif;white-space:nowrap}
.map-label span{display:block;color:#718077;font-size:11px;margin-top:4px}
.point .core{stroke-width:2;stroke:#fff;fill:#304b56}
.point.current .core{fill:#d88f23}
.point.current .halo{fill:#cf9a426b}
.point.correct .core{fill:var(--green)}
.point.wrong .core{fill:var(--red)}
.map-note{line-height:1.45}
.basketball-icon{width:68px;height:68px;fill:none;stroke:#c88f3f;stroke-width:2.2;margin:26px 0 23px}
.example{font:700 23px/1.4 Georgia,serif!important;color:#748480!important}.example span{font:400 19px/1 system-ui;color:#b79866;padding:0 8px}.example strong{color:#b47c35}
.clue-caption{font-size:11px!important;color:#88918c!important;margin:29px 0 8px}
.view h2.place-clue{font-family:Georgia,serif;font-size:clamp(30px,3.2vw,44px);line-height:1.15;letter-spacing:0;overflow-wrap:anywhere;margin-bottom:0}
.name-blank{font:italic 700 32px/1 Georgia,serif;color:#ca994f;width:90px;border-bottom:2px solid #d7bb8c;margin:14px 0 20px;padding:0 0 7px}
.city-note,.multi-note{font-size:12px!important;color:#697a7d!important;margin:0 0 20px;line-height:1.5}
.multi-note{background:#f2eadb;border-radius:6px;padding:8px 10px}
.input-help{font-size:10px;color:#788a8c;margin:7px 0 0}
button{-webkit-tap-highlight-color:transparent}.point:focus{outline:none}.point:focus-visible .core{stroke:#98631f;stroke-width:3.5}
@media(max-width:880px){.map-stage{height:clamp(330px,55vh,520px)}}
@media(max-width:600px){.map-stage{height:clamp(230px,30vh,270px)}.edition{max-width:50%;text-align:right}.view{min-height:365px}.basketball-icon{width:52px;height:52px;margin:10px 0 18px}.clue-caption{margin-top:21px}.view h2.place-clue{font-size:36px}.name-blank{margin-bottom:16px}.city-note,.multi-note{margin-bottom:16px}.map-label strong{font-size:18px}}
@media(max-width:880px) and (orientation:landscape){.map-stage{height:max(275px,70vh)}.clue-caption{margin-top:18px}.basketball-icon{width:48px;height:48px;margin:10px 0 15px}}