.card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.35rem; box-shadow:var(--shadow); }
.card h3 { margin:.35rem 0 .5rem; }
.card p { color:var(--muted); margin:.5rem 0; }
.card-link { color:var(--ink); text-decoration:none; display:block; height:100%; }
.card-link:hover h3 { color:var(--teal); }
.tag { display:inline-flex; border:1px solid var(--line); padding:.18rem .5rem; border-radius:999px; font-size:.72rem; color:var(--muted); margin:.15rem .2rem .15rem 0; }
.tag.realm-republic { border-color:var(--teal); color:var(--teal); }
.tag.realm-syndicate { border-color:var(--garnet); color:var(--garnet); }
.tag.realm-international { border-color:var(--ochre); color:var(--ochre); }
.meta { color:var(--muted); font-size:.78rem; letter-spacing:.01em; }
.prose { font-size:1.03rem; }
.prose h2 { margin-top:2.5em; padding-top:.5em; scroll-margin-top:1.5rem; }
.prose h3 { margin-top:2em; scroll-margin-top:1.5rem; }
.prose blockquote { border-left:3px solid var(--ochre); padding-left:1rem; color:var(--muted); margin-left:0; }
.prose pre { overflow:auto; background:var(--paper-2); padding:1rem; border-radius:10px; }
.prose li { margin:.35rem 0; }
.notice { border:1px solid color-mix(in srgb,var(--ochre) 55%,var(--line)); background:color-mix(in srgb,var(--ochre) 9%,var(--card)); padding:1rem 1.15rem; border-radius:12px; }
.notice strong { color:var(--ochre); }
.stat { border-top:2px solid var(--teal); padding-top:.6rem; }
.stat strong { display:block; font:2.3rem ui-serif,Georgia,serif; }
.stat span { color:var(--muted); font-size:.85rem; }
.search-box { display:flex; gap:.7rem; align-items:center; margin:1.5rem 0; }
.search-box input { flex:1; min-height:48px; padding:.6rem .8rem; border:1px solid var(--line); border-radius:10px; background:var(--card); color:var(--ink); }
.filters { display:flex; flex-wrap:wrap; gap:.6rem; margin:1rem 0 1.5rem; }
.filters select { min-height:40px; border:1px solid var(--line); border-radius:8px; padding:.35rem .5rem; background:var(--card); color:var(--ink); }
.data-table { overflow:auto; border:1px solid var(--line); border-radius:12px; background:var(--card); }
.data-table table { min-width:650px; }
.layer-list,.tree { list-style:none; padding:0; margin:0; }
.layer-list li { display:flex; align-items:center; gap:.5rem; padding:.35rem 0; }
.layer-list label { cursor:pointer; }
.atlas-shell { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(270px,.75fr); gap:1.2rem; align-items:start; }
.atlas-stage { min-width:0; padding:1rem; }
.atlas-toolbar { display:flex; align-items:center; justify-content:space-between; gap:.8rem; flex-wrap:wrap; margin-bottom:.8rem; }
.atlas-toolbar-actions,.atlas-layer-actions { display:flex; gap:.4rem; flex-wrap:wrap; }
.atlas-toolbar-actions .icon-btn { min-height:38px; }
.map-frame { border:1px solid var(--line); border-radius:var(--radius); background:var(--card); overflow:hidden; position:relative; }
.map-frame svg { display:block; width:100%; height:auto; min-height:420px; aspect-ratio:1000 / 560; background:linear-gradient(135deg,transparent 49%,color-mix(in srgb,var(--line) 55%,transparent) 50%,transparent 51%); cursor:grab; touch-action:none; user-select:none; }
.map-frame svg [hidden] { display:none; }
.map-frame svg:active { cursor:grabbing; }
.atlas-background { fill:color-mix(in srgb,var(--paper-2) 72%,var(--card)); stroke:var(--line); stroke-width:1; }
.atlas-feature-group { cursor:pointer; outline:none; }
.atlas-feature-group:focus .atlas-feature,.atlas-feature-group.is-selected .atlas-feature { stroke:var(--focus); stroke-width:3; filter:drop-shadow(0 0 4px color-mix(in srgb,var(--focus) 55%,transparent)); }
.atlas-feature { cursor:pointer; vector-effect:non-scaling-stroke; }
.atlas-feature[data-type="state"] { fill:color-mix(in srgb,var(--teal) 10%,var(--card)); stroke:var(--teal); }
.atlas-feature[data-type="river"],.atlas-feature[data-type="coastline"],.atlas-feature[data-type="estuary"],.atlas-feature[data-type="ridge"],.atlas-feature[data-type="frontier"],.atlas-feature[data-type="railway"],.atlas-feature[data-type="major_road"] { fill:none; stroke:var(--teal); stroke-width:1.2; }
.atlas-feature[data-type="lake"],.atlas-feature[data-type="basin"],.atlas-feature[data-type="watershed"],.atlas-feature[data-type="wetland"] { fill:color-mix(in srgb,#5b99a0 18%,transparent); stroke:#5b99a0; stroke-width:1; }
.atlas-feature[data-type="river"] { stroke:#5b99a0; stroke-dasharray:3 2; }
.atlas-feature[data-type="railway"] { stroke:var(--ochre); stroke-dasharray:5 3; }
.atlas-feature[data-type="major_road"] { stroke:var(--garnet); stroke-width:1.7; }
.atlas-feature[data-type="port"],.atlas-feature[data-type="airport"],.atlas-feature[data-type="settlement"],.atlas-feature[data-type="state_capital"] { fill:var(--garnet); stroke:var(--card); stroke-width:1.5; }
.atlas-feature[data-type="treaty_territory"] { fill:color-mix(in srgb,var(--olive) 25%,transparent); stroke:var(--olive); stroke-dasharray:2 2; }
.atlas-feature[data-type="disputed_boundary"] { fill:none; stroke:var(--garnet); stroke-dasharray:2 2; stroke-width:2; }
.atlas-label { fill:var(--ink); font:600 11px ui-sans-serif,system-ui,sans-serif; paint-order:stroke; stroke:var(--card); stroke-width:3px; stroke-linejoin:round; pointer-events:none; }
.atlas-panel { position:sticky; top:1rem; }
.atlas-panel .section-header { align-items:center; margin-bottom:1rem; }
.atlas-panel h2 { font-size:1.45rem; }
.atlas-filters { max-height:420px; overflow:auto; align-content:flex-start; margin:0; padding-right:.35rem; }
.layer-toggle { display:inline-flex; align-items:center; gap:.35rem; border:1px solid var(--line); border-radius:999px; padding:.35rem .55rem; color:var(--muted); font-size:.78rem; cursor:pointer; }
.layer-toggle:has(input:checked) { color:var(--teal); border-color:var(--teal); background:color-mix(in srgb,var(--teal) 8%,var(--card)); }
.layer-toggle input { accent-color:var(--teal); }
.atlas-detail { border-top:1px solid var(--line); margin-top:1.2rem; padding-top:1.2rem; }
.atlas-detail h2 { margin:.3rem 0 .8rem; }
.atlas-feature-list { margin-top:2.5rem; }
.atlas-feature-list .section-header { align-items:center; }
.atlas-feature-list [aria-pressed="true"] { border-color:var(--teal); color:var(--teal); }
.atlas-error .map-frame { border-color:var(--garnet); }
.atlas-error .atlas-map { opacity:.35; }
.legend { display:flex; flex-wrap:wrap; gap:.7rem; color:var(--muted); font-size:.82rem; margin:.75rem 0 0; }
.legend span::before { content:""; display:inline-block; width:1.2rem; height:2px; background:currentColor; vertical-align:middle; margin-right:.3rem; }
.legend-node::before { height:.55rem!important; width:.55rem!important; border-radius:50%; }
.legend-state { color:var(--teal); }
.legend-network { color:var(--ochre); }
.legend-water { color:#5b99a0; }
.legend-node { color:var(--garnet); }
.columns { columns:2 300px; column-gap:2rem; }
.columns > * { break-inside:avoid; }
.relationship { border-left:3px solid var(--teal); padding:.5rem 0 .5rem 1rem; margin:.4rem 0; }
.ripple { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
.ripple > div { border:1px solid var(--line); padding:.8rem; border-radius:10px; background:var(--card); }
.ripple h3 { margin:.1rem 0 .5rem; font-size:1rem; }
.mode-note { color:var(--muted); font-size:.84rem; }
.pressure-links { gap:.45rem; }
.pulse-card { display:flex; justify-content:space-between; align-items:center; gap:1rem; border-left:4px solid var(--garnet); background:var(--card); border-top:1px solid var(--line); border-right:1px solid var(--line); border-bottom:1px solid var(--line); border-radius:12px; padding:1rem 1.2rem; }
.pulse-card h3 { margin:.25rem 0; }
.pulse-card p { color:var(--muted); margin:.25rem 0 0; }
@media(max-width:600px){.pulse-card{align-items:flex-start; flex-direction:column;}}
[data-mode="reader"] .research-only { display:none!important; }
[data-mode="research"] .research-only { display:block; }
dialog { border:1px solid var(--line); border-radius:16px; background:var(--card); color:var(--ink); max-width:min(720px,calc(100% - 2rem)); width:100%; padding:1.2rem; box-shadow:var(--shadow); }
dialog::backdrop { background:rgba(10,20,20,.55); }
