:root { color-scheme: light; --paper:#fbf8f3; --surface:#f3eadc; --ink:#272019; --muted:#6c5f50; --rule:#ccb494; --forest:#315844; --selected:#e5ecdf; font:16px/1.5 system-ui,sans-serif; color:var(--ink); background:var(--paper); }
:root[data-theme=dark] { color-scheme:dark; --paper:#17130f; --surface:#211a14; --ink:#f2e8da; --muted:#c7b8a5; --rule:#6c5134; --forest:#8fbea1; --selected:#253b2e; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body { margin:0; padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); height:100vh; height:100dvh; display:flex; flex-direction:column; }
a { color:var(--forest); text-underline-offset:3px; }
button,input,select { font:inherit; color:inherit; }
button,select,input { min-height:44px; border:1px solid var(--rule); border-radius:8px; background:var(--paper); padding:8px 12px; }
button { cursor:pointer; font-weight:600; }
button:hover,a.primary:hover { background:var(--selected); }
button:disabled { opacity:.45; cursor:default; }
a,button,input,select,summary { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid var(--forest); outline-offset:3px; }
h1,h2,p { margin:0; } h1 { font-size:clamp(1.25rem,2.4vw,1.8rem); line-height:1.15; letter-spacing:-.035em; } h2 { font-size:1.05rem; line-height:1.35; }
.map-header { display:flex; align-items:center; justify-content:space-between; padding:16px 24px 12px; border-bottom:1px solid var(--rule); gap:16px; }
.map-header>div { display:grid; grid-template-columns:auto 1fr; align-items:center; column-gap:24px; }
.map-header p { grid-column:2; color:var(--muted); font-size:.8rem; margin-top:4px; }
.back,.locale-link { display:inline-flex; align-items:center; min-height:44px; padding:8px 0; text-decoration:none; font-size:.875rem; font-weight:600; }
.back { grid-row:1 / 3; }.locale-link { min-width:44px; justify-content:center; }
.toolbar { display:flex; align-items:end; gap:12px; padding:14px 24px; }
.search-container { flex:1; max-width:640px; display:grid; gap:4px; }
.search-container span,.panel label { color:var(--muted); font-size:.8rem; font-weight:650; }
.search-container input { width:100%; min-width:0; }
.view-switch { display:flex; gap:4px; padding:3px; border:1px solid var(--rule); border-radius:10px; }
.view-switch button { border:0; min-height:44px; background:transparent; }
.view-switch button[aria-pressed=true] { background:var(--forest); color:var(--paper); }
#open-panel { display:none; }
.workspace { flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) 300px; border-top:1px solid var(--rule); }
main { min-height:0; min-width:0; display:flex; flex-direction:column; }
.results-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 24px; min-height:56px; color:var(--muted); font-size:.875rem; border-bottom:1px solid var(--rule); }
.results-bar button { padding:5px 12px; }
#list-view { overflow:auto; padding:0 24px 24px; }
.game-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr)); list-style:none; margin:0; padding:0; gap:0 24px; }
.game-list li { padding:18px 0; border-bottom:1px solid var(--rule); overflow-wrap:anywhere; }
.game-list li>a { display:block; font-weight:650; text-decoration:none; font-size:1.05rem; min-height:44px; padding:6px 0; }
.game-list p { font-size:.8rem; color:var(--muted); margin:3px 0 8px; }
.game-list span { font-size:.75rem; color:var(--forest); }
#empty { padding:32px 0; }
#map-view { position:relative; flex:1; min-height:0; background:var(--paper); }
#map-engine { display:block; width:100%; height:100%; border:0; }
#map-status { position:absolute; inset:20px 20px auto; padding:16px; background:var(--surface); border:1px solid var(--rule); border-radius:12px; max-width:460px; box-shadow:0 4px 24px #0001; }
#recovery { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.map-controls { display:flex; position:absolute; right:16px; bottom:16px; gap:6px; }
.map-controls button { box-shadow:0 2px 6px #0001; min-width:44px; }
.panel { height:100%; color:var(--ink); background:var(--surface); border:0; border-left:1px solid var(--rule); padding:20px; margin:0; max-width:none; max-height:none; width:100%; min-width:0; position:static; overflow:auto; }
.panel-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:24px; }
#close-panel { display:none; }
.panel label { display:block; margin-bottom:6px; }
.panel select { width:100%; text-overflow:ellipsis; }
.muted { color:var(--muted); font-size:.85rem; margin:10px 0; }
#download { display:flex; align-items:center; min-height:44px; font-size:.875rem; font-weight:650; margin-top:16px; }
#game-detail { margin:24px 0; padding-top:20px; border-top:1px solid var(--rule); overflow-wrap:anywhere; }
#detail-summary { font-size:.9rem; }
.eyebrow { text-transform:uppercase; font-size:.7rem; letter-spacing:.08em; color:var(--muted); margin-bottom:8px; }
a.primary { display:flex; justify-content:center; align-items:center; min-height:44px; padding:10px; margin-top:16px; border:1px solid var(--forest); border-radius:8px; text-decoration:none; font-weight:650; }
.map-help { border-top:1px solid var(--rule); margin-top:24px; padding-top:12px; font-size:.85rem; }
summary { cursor:pointer; min-height:44px; padding:10px 0; font-weight:650; }
.map-help p { margin:8px 0; color:var(--muted); }
@media(max-width:767px) {
 .map-header { padding:10px 16px; }.map-header>div { column-gap:12px; }.map-header p { font-size:.7rem; }.back { font-size:0; }.back::before { content:'←'; font-size:1.3rem; padding-right:8px; }
 .toolbar { display:grid; grid-template-columns:1fr auto; gap:10px; padding:10px 16px; }.search-container { grid-column:1/-1; max-width:none; }.search-container span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
 .view-switch { justify-self:start; }.view-switch button { min-height:44px; padding:8px 18px; }#open-panel { display:block; }
 .workspace { display:flex; flex-direction:column; }main { flex:1; }.results-bar { padding:4px 16px; }#list-view { padding:0 16px 24px; }.game-list { display:block; }
 .panel { display:none; }.panel[open] { display:block; height:auto; position:fixed; inset:auto 0 0; width:100%; max-height:80dvh; padding:16px 20px max(20px,env(safe-area-inset-bottom)); border:1px solid var(--rule); border-radius:20px 20px 0 0; margin:0; }
 .panel::backdrop { background:#0006; }.panel-heading { margin-bottom:16px; }#close-panel { display:block; min-width:44px; font-size:1.4rem; }
 .map-controls { bottom:12px; right:12px; }
}
@media(prefers-reduced-motion:no-preference) { button,a { transition:background-color .15s; } }

.detail-sources { font-size:.8rem; margin-top:12px; }.detail-sources a { display:inline-flex; align-items:center; min-height:44px; }
