:root{
  --text:#111827;--muted:#111827;--panel:#fff;--outline:#cbd3df;
  --shadow:0 2px 6px rgba(15,23,42,.06),0 10px 24px rgba(15,23,42,.08)
}

html,body{
  margin:0;padding:0;color:var(--text);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial;
  font-size:16px;line-height:1.55;
}
.muted{color:var(--muted)}
h1,.hero__title,.card-header h1{
  font-family:"Times New Roman",Times,Georgia,serif;
  font-weight:700;letter-spacing:.2px;line-height:1.15;
}
.lead{
  font-family:"Times New Roman",Times,Georgia,serif;
  font-weight:700;font-size:clamp(16px,1.9vw,18px);
  line-height:1.3;margin:0 0 8px;
}
p{margin:0 0 12px}
.caption{font-size:13px;color:var(--muted)}

.hero{
  background:#0f1b2a;color:#fff;padding:52px 18px 48px;
  box-shadow:var(--shadow);border-bottom:2px solid #1f2b3c;
}
.hero__inner{max-width:1280px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.hero__title{margin:0;font-size:clamp(30px,4.2vw,56px);font-weight:700;letter-spacing:.3px}
.hero__tag{margin:0;opacity:.9;font-size:clamp(14px,2.2vw,18px)}

*{box-sizing:border-box}
.wrap{max-width:1280px;margin:22px auto 36px;padding:0 18px}
.card{background:var(--panel);border:2px solid var(--outline);border-radius:18px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:28px}
.card-header{display:flex;align-items:center;justify-content:center;padding:16px 20px;border-bottom:2px solid var(--outline)}
.card-header h1{margin:0;font-size:clamp(26px,3.4vw,40px);font-weight:700;text-align:center}

.card-body{display:grid;grid-template-columns:minmax(0,1fr) 2px 360px;align-items:stretch;min-height:560px}
.card-body.line{grid-template-columns:minmax(0,1fr) 360px}
.card-body.stack{display:block;min-height:auto}
.left{padding:16px;min-width:0}
.divider{background:var(--outline)}
.card-body.line .left{grid-column:1}
.card-body.line .right{grid-column:2;border-left:2px solid var(--outline);padding:20px}
.card-body.line .divider{display:none}
.right{padding:20px}
.under{padding:18px 20px;border-top:2px solid var(--outline)}
#mapVis,#lineVis,#heatmapVis,#lollipopVis,#donutVis,#barVis,#scatterVis,#bubbleVis{width:100%;min-height:520px}

@media (max-width:980px){
  .card-body,.card-body.line{grid-template-columns:1fr}
  .divider{display:none}
  .right{border-top:2px solid var(--outline)}
  .card-body.line .right{border-left:none}
}
.vega-embed,.vega-embed>div{width:100%!important;max-width:100%!important}

.meta-list{padding-left:18px;margin:8px 0 0}
.meta-list li{margin:6px 0}
.meta-heading{font-family:"Times New Roman",Times,Georgia,serif;font-weight:700;margin:0 0 6px}


.vega-bind, .vega-bind select, .vega-bind input, .vega-bind label {
  font-family: ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial;
  font-size: 14px;
}