/* Module Địa chí số - giao diện người xem. Mọi lớp đều có tiền tố dc- để không đụng theme. */
.dc-app{--dc-bg:#fff;--dc-fg:#1f2a2e;--dc-mute:#5d6b70;--dc-line:#d8dfe1;--dc-soft:#f3f6f6;--dc-accent:#1f6f5c;--dc-accent-fg:#fff;--dc-his:#b4562b;--dc-adm:#51608a;--dc-lit:#8a3f7a;--dc-bio:#2f7d3a;--dc-warn:#9a6a00;
 color:var(--dc-fg);background:var(--dc-bg);font-size:16px;line-height:1.55;box-sizing:border-box;width:100%;max-width:100%;min-width:0}
.dc-app *,.dc-app *::before,.dc-app *::after{box-sizing:border-box}
.dc-app [hidden]{display:none!important}
.dc-app button{font:inherit;cursor:pointer}
.dc-app :focus-visible{outline:3px solid #ffb703;outline-offset:2px}
.dc-loading,.dc-error,.dc-empty{padding:24px;text-align:center;color:var(--dc-mute)}
.dc-error{color:#a11}
.dc-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 12px}
.dc-seg{display:inline-flex;border:1px solid var(--dc-line);border-radius:8px;overflow:hidden}
.dc-seg button{border:0;background:var(--dc-bg);color:var(--dc-fg);padding:8px 16px;min-height:40px}
.dc-seg button[aria-pressed="true"]{background:var(--dc-accent);color:var(--dc-accent-fg)}
.dc-places{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;padding:0;list-style:none}
.dc-places button,.dc-chip{border:1px solid var(--dc-line);background:var(--dc-bg);color:var(--dc-fg);border-radius:999px;padding:6px 14px;min-height:36px}
.dc-places button[aria-pressed="true"],.dc-chip[aria-pressed="true"]{background:var(--dc-accent);border-color:var(--dc-accent);color:var(--dc-accent-fg)}
.dc-split{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:16px}
.dc-map{height:520px;min-height:320px;border:1px solid var(--dc-line);border-radius:10px;background:#e8eeee;position:relative;z-index:0}
.dc-map-hint{color:var(--dc-mute);font-size:14px;margin:6px 0 0}
.dc-panel{border:1px solid var(--dc-line);border-radius:10px;padding:16px;background:var(--dc-bg);min-width:0;max-height:620px;overflow:auto}
.dc-panel h2,.dc-card h3{margin:0 0 4px;font-size:1.35rem;line-height:1.25}
.dc-meta{margin:0 0 12px;color:var(--dc-mute);font-size:14px}
.dc-meta div{margin:0}
.dc-tabs{display:flex;gap:4px;border-bottom:1px solid var(--dc-line);margin:0 0 12px}
.dc-tabs button{flex:1 1 0;white-space:nowrap;border:0;background:none;padding:8px 6px;border-bottom:3px solid transparent;color:var(--dc-mute)}
.dc-tabs button[aria-selected="true"]{border-bottom-color:var(--dc-accent);color:var(--dc-fg);font-weight:600}
.dc-list{list-style:none;margin:0;padding:0}
.dc-item{border:1px solid var(--dc-line);border-radius:8px;margin:0 0 8px}
.dc-item>button{display:block;width:100%;text-align:left;border:0;background:var(--dc-soft);padding:10px 12px;border-radius:8px;color:inherit}
.dc-item>button[aria-expanded="true"]{border-bottom-left-radius:0;border-bottom-right-radius:0}
.dc-item-when{display:block;font-size:13px;color:var(--dc-mute)}
.dc-item-body{padding:10px 12px}
.dc-text{white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 8px}
.dc-src{font-size:14px;color:var(--dc-mute);margin:0}
.dc-badge{display:inline-block;font-size:12px;border-radius:4px;padding:1px 6px;color:#fff;margin-right:6px;vertical-align:middle}
.dc-badge.his{background:var(--dc-his)}.dc-badge.adm{background:var(--dc-adm)}.dc-badge.lit{background:var(--dc-lit)}.dc-badge.bio{background:var(--dc-bio)}
.dc-check{display:inline-block;font-size:12px;border:1px solid var(--dc-warn);color:var(--dc-warn);border-radius:4px;padding:0 6px;margin-left:4px}
.dc-tl-ctl{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin:0 0 10px}
.dc-tl-ctl label{font-size:14px;color:var(--dc-mute)}
.dc-tl-ctl input[type=range]{flex:1 1 220px;min-width:160px}
.dc-play{border:1px solid var(--dc-accent);background:var(--dc-accent);color:var(--dc-accent-fg);border-radius:8px;padding:6px 16px;min-height:40px}
.dc-tl-now{font-variant-numeric:tabular-nums;font-weight:600}
.dc-tl-wrap{overflow-x:auto;border:1px solid var(--dc-line);border-radius:10px;background:var(--dc-bg)}
.dc-tl-svg{display:block;max-width:none}
.dc-tl-svg text{font-family:inherit;fill:var(--dc-fg)}
.dc-tl-svg .mute{fill:var(--dc-mute)}
.dc-dot{cursor:pointer;stroke:#fff;stroke-width:2}
.dc-dot:focus-visible{stroke:#ffb703;stroke-width:3;outline:none}
.dc-dot.his{fill:var(--dc-his)}.dc-dot.adm{fill:var(--dc-adm)}.dc-dot.lit{fill:var(--dc-lit)}.dc-dot.bio{fill:var(--dc-bio)}
.dc-dot.sel{stroke:#111;stroke-width:3}
.dc-card{border:1px solid var(--dc-line);border-radius:10px;padding:16px;margin:12px 0 0}
.dc-caption{color:var(--dc-mute);font-size:14px;margin:8px 0 0}
.dc-tip{background:#fff;border:1px solid var(--dc-line);color:var(--dc-fg);font-weight:600;box-shadow:none}
.dc-link{border:0;background:none;color:var(--dc-accent);text-decoration:underline;padding:0}
@media (max-width:760px){
 .dc-split{grid-template-columns:minmax(0,1fr)}
 .dc-map{height:360px}
 .dc-panel{max-height:none}
}
@media (prefers-color-scheme:dark){
 .dc-app.dc-dark-auto{--dc-bg:#14191b;--dc-fg:#e6ecee;--dc-mute:#9db0b5;--dc-line:#334045;--dc-soft:#1d2529}
}
@media (prefers-reduced-motion:reduce){.dc-app *{transition:none!important;animation:none!important}}
