:root{--green:#2d9a45;--green2:#e9f7ec;--ink:#12304a;--muted:#6c7b87;--line:#dbe5dc;--card:#fff;--bg:#f4faf5;--gold:#f4b942;--red:#e74c3c;--blue:#3b82f6}
*{box-sizing:border-box}body{margin:0;font-family:ui-rounded,"Trebuchet MS",system-ui,sans-serif;background:linear-gradient(#fbfff9,#eef8f1);color:var(--ink)}button{font:inherit}.app-shell{width:min(1500px,96vw);margin:auto;padding:22px 0 40px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px 26px;box-shadow:0 12px 35px #1c5b2a12}.eyebrow,.mini-label{font-size:12px;font-weight:900;letter-spacing:.08em;color:var(--green)}h1{margin:5px 0 4px;font-size:clamp(28px,3vw,46px)}h2{margin:0 0 14px}.topbar p{margin:0;color:var(--muted)}.icon-btn,.small-btn,.secondary-btn{border:1px solid var(--line);background:#fff;border-radius:14px;padding:11px 14px;font-weight:800;color:var(--ink);cursor:pointer}.setup-card,.map-card,.province-panel,.finish{margin-top:20px;background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:0 12px 35px #1c5b2a0d}.setup-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:28px}.region-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.region-btn{border:2px solid #e4ece6;background:#fff;padding:14px;border-radius:16px;text-align:left;font-weight:900;cursor:pointer;min-height:58px}.region-btn:hover,.region-btn.selected{border-color:var(--green);background:var(--green2)}.mode-grid{display:grid;gap:8px}.mode-card{border:2px solid #e4ece6;background:#fff;padding:13px 14px;border-radius:16px;text-align:left;cursor:pointer;display:grid;gap:3px}.mode-card span{color:var(--muted);font-size:13px}.mode-card.selected{border-color:var(--green);background:var(--green2)}.primary-btn{border:0;background:var(--green);color:#fff;font-weight:900;padding:14px 20px;border-radius:16px;cursor:pointer}.primary-btn:disabled{opacity:.45;cursor:not-allowed}.setup-card .primary-btn{width:100%;margin-top:14px}.note{font-size:12px;color:var(--muted);margin:10px 0 0}.hidden{display:none!important}.hud{margin-top:20px;display:grid;grid-template-columns:repeat(4,1fr) auto;gap:10px}.hud>div,.hud>button{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 14px}.hud span{display:block;color:var(--muted);font-size:11px;font-weight:800}.hud strong{font-size:18px}.game-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px}.map-head,.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.legend{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;flex-wrap:wrap}.dot{width:11px;height:11px;border-radius:50%;display:inline-block}.dot.target{background:#bfe3c5}.dot.done{background:var(--green)}.map-wrap{position:relative;border-radius:18px;overflow:hidden;background:linear-gradient(180deg,#eef8ff,#fff8e8);min-height:430px}.map-wrap svg{display:block;width:100%;height:auto;min-height:430px}.province{fill:#e9eef1;stroke:#fff;stroke-width:1.2;cursor:pointer;transition:fill .18s,transform .18s}.province.region{fill:#cdebd2}.province.selected-target{fill:#92d5a0}.province.done{fill:#2d9a45}.province.wrong{fill:#ffb5ad}.province:hover{filter:brightness(.95)}.plate-label{font-size:9px;font-weight:900;pointer-events:none;fill:#1f5c2f;text-anchor:middle}.map-loading{position:absolute;inset:0;display:grid;place-items:center;background:#ffffffdd;font-weight:900}.touch-help{margin:12px 0 0;color:var(--muted);font-size:13px}.province-list{display:grid;gap:9px;max-height:520px;overflow:auto;padding-right:3px}.province-chip{border:2px solid #e2e9e4;background:#fff;border-radius:14px;padding:11px 12px;display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:900;cursor:grab;user-select:none}.province-chip.selected{border-color:var(--blue);background:#edf5ff}.province-chip.done{opacity:.45;text-decoration:line-through;cursor:default}.plate{font-size:12px;border-radius:9px;background:#eef2f4;padding:5px 7px}.feedback{margin-top:14px;padding:13px;border-radius:14px;font-weight:800;font-size:13px}.feedback.info{background:#edf5ff;color:#24518a}.feedback.good{background:#e8f7eb;color:#207238}.feedback.bad{background:#fff0ee;color:#ad3326}.shake{animation:shake .28s linear 2}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}.finish{text-align:center;padding:40px}.trophy{font-size:70px}.finish-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:22px auto;max-width:800px}.finish-stats div{background:#f7faf7;border:1px solid var(--line);border-radius:16px;padding:14px}.finish-stats span{display:block;color:var(--muted);font-size:12px}.finish-stats strong{font-size:24px}.finish-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}@media(max-width:900px){.setup-grid,.game-grid{grid-template-columns:1fr}.province-panel{order:-1}.province-list{grid-template-columns:repeat(2,1fr);max-height:none}.hud{grid-template-columns:repeat(2,1fr)}.hud button{grid-column:span 2}.finish-stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.app-shell{width:94vw}.topbar{align-items:flex-start;flex-direction:column}.region-grid,.province-list{grid-template-columns:1fr}.map-head{align-items:flex-start;flex-direction:column}.map-wrap{min-height:300px}.map-wrap svg{min-height:300px}.finish-stats{grid-template-columns:1fr 1fr}}
/* V2 interaction improvements */
.province{pointer-events:all;touch-action:manipulation;vector-effect:non-scaling-stroke}
.province.dimmed{fill:#e8edf0;opacity:.42}
.province.region{fill:#a8ddb3;opacity:1;stroke:#fff;stroke-width:1.5}
.province.region:hover,.province.region:focus{fill:#82c892;outline:none;filter:none}
.province.selected-target{fill:#f5c451!important;opacity:1!important}
.province.done{fill:#2d9a45!important;opacity:1!important}
.province.wrong{fill:#ef7669!important;opacity:1!important}
.plate-labels{pointer-events:none}
.map-wrap.has-active{box-shadow:inset 0 0 0 3px #3b82f655}

/* V3: dedicated, oversized hit layer for reliable map interaction */
.province-visual-layer{pointer-events:none}
.province-hit-layer{pointer-events:all}
.province-hit{fill:rgba(255,255,255,.001);stroke:rgba(255,255,255,.001);stroke-width:8;vector-effect:non-scaling-stroke;cursor:pointer;pointer-events:all;touch-action:manipulation}
.province-hit.disabled{cursor:not-allowed}
.province-hit.enabled:focus{outline:none;stroke:#2563eb;stroke-width:4;fill:rgba(59,130,246,.05)}
.province.region{fill:#8fd09b!important;opacity:1!important;stroke:#fff;stroke-width:1.6}
.province.dimmed{fill:#e6ebee!important;opacity:.35!important}
.map-wrap.has-active .province.region{fill:#9cdaa7!important}

/* V4: entire map captures taps; visible province layer stays non-interactive */
#mapSvg{pointer-events:auto;touch-action:manipulation;cursor:crosshair}
.province-visual-layer,.plate-labels{pointer-events:none}

/* V5: visibly separate the active learning region from the rest of Türkiye. */
#mapSvg .province.region{fill:#86d59a!important;opacity:1!important;stroke:#ffffff!important;stroke-width:1.8!important}
#mapSvg .province.dimmed{fill:#dfe6e9!important;opacity:.23!important}
#mapWrap.has-active #mapSvg .province.region{fill:#76cf8c!important}

/* V6: direct SVG province hit testing */
#mapSvg .province-visual-layer{pointer-events:all!important}
#mapSvg .province{pointer-events:all!important;cursor:pointer;touch-action:manipulation}
#mapSvg .province:hover{filter:brightness(.9)!important}
#mapSvg .plate-labels{pointer-events:none!important}
/* V7: deterministic province ids; remove browser SVG focus rectangles */
#mapSvg .province{outline:none!important}
#mapSvg .province:focus,#mapSvg .province:focus-visible{outline:none!important}
#mapSvg .province.region{fill:#79d28d!important;opacity:1!important}
#mapSvg .province.dimmed{fill:#dfe6e9!important;opacity:.20!important}
#mapSvg .province.done{fill:#169447!important;opacity:1!important;stroke:#0b6d32!important;stroke-width:2.2!important}
#mapSvg .province.wrong{fill:#ef6c62!important;opacity:1!important}
#mapSvg .province.selected-target{fill:#f5c451!important;opacity:1!important}
/* V8: oyun içinden bölge seçimine hızlı dönüş */
.back-regions-btn{white-space:nowrap;align-self:stretch}
@media(max-width:760px){.back-regions-btn{order:-1;width:100%}}

/* ===== V9 CANLI YARIŞMA ===== */
.top-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.trophy-btn{background:linear-gradient(135deg,#fff7d6,#fff);border-color:#efc95e}.competition-banner{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:18px 20px;margin-bottom:18px;border-radius:20px;background:linear-gradient(135deg,#0d7f52,#19a86d);color:#fff;box-shadow:0 16px 38px rgba(13,127,82,.18)}.competition-medal{font-size:40px}.competition-banner strong{display:block;font-size:22px}.competition-banner span{display:block;opacity:.94;margin-top:3px}.rule-pill{background:#fff;color:#9b4f00;font-weight:900;border-radius:999px;padding:10px 15px;white-space:nowrap}.player-card{background:#f8fffb;border:1px solid #ccebdc;border-radius:20px;padding:18px;margin-bottom:20px}.section-title-row{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.privacy-chip{background:#e9f7ff;border:1px solid #b7def4;color:#245c7e;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:800}.player-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:12px}.field{display:flex;flex-direction:column;gap:7px}.field>span{font-weight:900;color:#204a3a}.field input,.field select{width:100%;box-sizing:border-box;border:2px solid #d6e7df;border-radius:14px;padding:13px 14px;font-size:16px;background:#fff;outline:none}.field input:focus,.field select:focus{border-color:#25a66d;box-shadow:0 0 0 3px rgba(37,166,109,.12)}.field small{color:#60736b;line-height:1.35}.race-rules{display:grid;gap:10px}.race-rules>div{border:1px solid #e2e8e5;border-radius:15px;padding:12px 14px;background:#fff;display:flex;flex-direction:column;gap:4px}.race-rules span{font-size:13px;color:#63726c}.race-start{width:100%;margin-top:14px;font-size:18px;padding:15px}.online-note{font-weight:700}.online-note.warn{color:#a45b00}.region-btn{display:flex!important;flex-direction:column;justify-content:center;align-items:center;gap:5px;min-height:82px}.region-btn>span{font-size:24px}.region-btn>b{font-size:14px}.race-status{margin:10px 0 14px;border-radius:12px;padding:9px 12px;font-size:13px;font-weight:800;background:#edf8f3;color:#167149;border:1px solid #bce4d1}.race-status.bad{background:#fff0f0;color:#a03232;border-color:#f2bcbc}.hud{grid-template-columns:auto repeat(5,minmax(90px,1fr)) auto!important}.finish-kicker{font-size:12px;font-weight:900;letter-spacing:.12em;color:#14845a}.finish-stats{grid-template-columns:repeat(4,1fr)!important}.score-stat{background:linear-gradient(135deg,#fff8d8,#fff)!important;border-color:#e8c85c!important}.rank-card{max-width:760px;margin:18px auto;padding:16px 18px;border-radius:18px;text-align:left;display:flex;flex-direction:column;gap:5px}.rank-card b{font-size:22px}.rank-card span{font-size:14px;line-height:1.45}.rank-card.loading{background:#f3f6f5;border:1px solid #dce5e1}.rank-card.success{background:linear-gradient(135deg,#e8fff2,#f8fffb);border:2px solid #64c994;color:#145f42}.rank-card.error{background:#fff1f1;border:1px solid #efb6b6;color:#973636}.mini-leaderboard{max-width:850px;margin:18px auto;text-align:left}.mini-leaderboard h3{margin:0 0 8px}.leader-dialog{width:min(960px,94vw);max-height:88vh;border:0;border-radius:24px;padding:0;box-shadow:0 25px 80px rgba(0,0,0,.28);overflow:hidden}.leader-dialog::backdrop{background:rgba(9,27,21,.62);backdrop-filter:blur(3px)}.dialog-head{padding:18px 20px;border-bottom:1px solid #e6ebe8;display:flex;justify-content:space-between;align-items:center;background:#fff}.dialog-head h2{margin:3px 0 0}.close-btn{border:0;background:#eff4f2;border-radius:999px;width:40px;height:40px;font-size:18px;cursor:pointer}.leader-tabs{padding:12px 16px;display:flex;gap:7px;overflow-x:auto;background:#fbfdfc;border-bottom:1px solid #edf1ef}.leader-tab{border:1px solid #d5e0db;border-radius:999px;background:#fff;padding:9px 12px;white-space:nowrap;cursor:pointer;font-weight:800}.leader-tab.selected{background:#167b54;color:#fff;border-color:#167b54}.leader-help{padding:10px 18px;font-size:13px;color:#5e6c66;background:#f7faf8}.leader-table-wrap{padding:0 16px 18px;max-height:60vh;overflow:auto}.leader-table{min-width:650px}.leader-row{display:grid;grid-template-columns:70px 1.5fr 1.2fr 1fr 44px;gap:10px;align-items:center;padding:11px 10px;border-bottom:1px solid #edf1ef}.leader-row.me{background:#eafff2;border-radius:12px;border-bottom-color:#a6ddbf}.leader-head{position:sticky;top:0;background:#fff;font-size:12px;font-weight:900;color:#708078;z-index:2}.leader-row .rank{font-weight:900}.leader-row .nick{font-weight:900}.leader-row .time{font-weight:900;text-align:right}.leader-row .time small{display:block;font-weight:600;color:#7b8882}.report-btn{border:0;background:#f6f7f7;border-radius:9px;width:34px;height:34px;cursor:pointer}.report-btn:hover{background:#fff0e8}.empty-leader,.loading-box{text-align:center;padding:30px;color:#65736d}.finish-actions{flex-wrap:wrap}

@media(max-width:900px){.competition-banner{grid-template-columns:auto 1fr}.rule-pill{grid-column:1/-1;justify-self:start}.player-grid{grid-template-columns:1fr}.section-title-row{flex-direction:column}.hud{grid-template-columns:repeat(3,1fr)!important}.hud>button{grid-column:auto}.finish-stats{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:560px){.top-actions{width:100%}.top-actions .icon-btn{flex:1}.competition-banner{grid-template-columns:1fr;text-align:center}.competition-medal{font-size:34px}.rule-pill{justify-self:center}.privacy-chip{font-size:11px}.leader-dialog{width:98vw}.leader-table-wrap{padding:0 8px 12px}.hud{grid-template-columns:repeat(2,1fr)!important}.hud .back-regions-btn,.hud #resetBtn{grid-column:auto}.finish-stats{grid-template-columns:1fr 1fr!important}}

.home-link{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}