.interactive-article.article-urban-simulation {
  color-scheme:inherit;
  --surface-0:var(--main-bg); --surface-1:var(--card-bg, var(--main-bg)); --surface-2:var(--bs-tertiary-bg);
  --ink-1:var(--heading-color); --ink-2:var(--text-color); --ink-3:var(--text-muted-color);
  --line:var(--main-border-color); --line-strong:var(--tb-border-color, var(--main-border-color));
  --s1:#2a78d6; --s2:#eb6834; --s3:#1baf7a; --s4:#eda100; --s5:#e87ba4;
  --s6:#008300; --s7:#4a3aa7; --s8:#e34948;
  --ok:#0ca30c; --warn:#fab219; --serious:#ec835a; --crit:#d03b3b;
  --ring:var(--main-border-color);
  --maxw:1180px;
}

html[data-bs-theme="dark"] .interactive-article.article-urban-simulation {
  --s1:#3987e5; --s2:#d95926; --s3:#199e70; --s4:#c98500; --s5:#d55181;
  --s6:#008300; --s7:#9085e9; --s8:#e66767;
}

.interactive-article.article-urban-simulation, .interactive-article.article-urban-simulation * {
  box-sizing:border-box
}

.interactive-article.article-urban-simulation {
  scroll-behavior:smooth; scroll-padding-top:64px
}

.interactive-article.article-urban-simulation {
  margin:0; background:transparent; color:var(--ink-1);
  font-family:inherit;
  font-size:15px; line-height:1.75; -webkit-font-smoothing:antialiased;
}

.interactive-article.article-urban-simulation .wrap {
  max-width:var(--maxw); margin:0 auto; padding:0 22px
}

.interactive-article.article-urban-simulation .topbar {
  position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--surface-0) 92%, transparent);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--line);
}

.interactive-article.article-urban-simulation .topbar .wrap {
  display:flex; align-items:center; gap:18px; height:52px
}

.interactive-article.article-urban-simulation .brand {
  font-weight:650; font-size:13.5px; letter-spacing:.01em; white-space:nowrap
}

.interactive-article.article-urban-simulation .navlinks {
  display:flex; gap:2px; overflow-x:auto; flex:1; scrollbar-width:none
}

.interactive-article.article-urban-simulation .navlinks::-webkit-scrollbar {
  display:none
}

.interactive-article.article-urban-simulation .navlinks a {
  color:var(--ink-2); text-decoration:none; font-size:13px; padding:5px 9px;
  border-radius:6px; white-space:nowrap;
}

.interactive-article.article-urban-simulation .navlinks a:hover {
  background:var(--surface-2); color:var(--ink-1)
}

.interactive-article.article-urban-simulation .themebtn {
  border:1px solid var(--line-strong); background:var(--surface-1); color:var(--ink-2);
  border-radius:6px; padding:5px 10px; font-size:12px; cursor:pointer; white-space:nowrap;
  font-family:inherit;
}

.interactive-article.article-urban-simulation .themebtn:hover {
  color:var(--ink-1)
}

.interactive-article.article-urban-simulation header.hero {
  padding:56px 0 34px; border-bottom:1px solid var(--line)
}

.interactive-article.article-urban-simulation .eyebrow {
  font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); margin-bottom:14px
}

.interactive-article.article-urban-simulation h1 {
  font-size:clamp(26px,3.4vw,40px); line-height:1.28; margin:0 0 14px; font-weight:680; letter-spacing:-.01em
}

.interactive-article.article-urban-simulation .sub {
  font-size:16px; color:var(--ink-2); max-width:820px; margin:0 0 26px
}

.interactive-article.article-urban-simulation .statrow {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:10px; overflow:hidden
}

.interactive-article.article-urban-simulation .stat {
  background:var(--surface-1); padding:14px 16px
}

.interactive-article.article-urban-simulation .stat .v {
  font-size:24px; font-weight:650; line-height:1.2
}

.interactive-article.article-urban-simulation .stat .l {
  font-size:12px; color:var(--ink-3); margin-top:3px
}

.interactive-article.article-urban-simulation section {
  padding:46px 0; border-bottom:1px solid var(--line)
}

.interactive-article.article-urban-simulation h2 {
  font-size:23px; font-weight:660; margin:0 0 6px; letter-spacing:-.005em
}

.interactive-article.article-urban-simulation h2 .num {
  color:var(--ink-3); font-weight:500; margin-right:10px; font-variant-numeric:tabular-nums
}

.interactive-article.article-urban-simulation .lede {
  color:var(--ink-2); font-size:14.5px; margin:0 0 26px; max-width:840px
}

.interactive-article.article-urban-simulation h3 {
  font-size:17px; font-weight:640; margin:34px 0 10px
}

.interactive-article.article-urban-simulation h4 {
  font-size:14.5px; font-weight:640; margin:22px 0 7px
}

.interactive-article.article-urban-simulation p {
  margin:0 0 13px
}

.interactive-article.article-urban-simulation a {
  color:var(--s1)
}

.interactive-article.article-urban-simulation strong {
  font-weight:640
}

.interactive-article.article-urban-simulation code {
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.9em; background:var(--surface-2); padding:1px 5px; border-radius:4px
}

.interactive-article.article-urban-simulation .callout {
  border:1px solid var(--line); border-left:3px solid var(--s1); background:var(--surface-1);
  border-radius:0 8px 8px 0; padding:14px 18px; margin:18px 0; font-size:14px;
}

.interactive-article.article-urban-simulation .callout.warn {
  border-left-color:var(--warn)
}

.interactive-article.article-urban-simulation .callout.crit {
  border-left-color:var(--crit)
}

.interactive-article.article-urban-simulation .callout .ttl {
  font-weight:640; margin-bottom:5px; font-size:13.5px
}

.interactive-article.article-urban-simulation .matrix {
  width:100%; border-collapse:separate; border-spacing:0; font-size:13px; margin:8px 0 4px
}

.interactive-article.article-urban-simulation .matrix th, .interactive-article.article-urban-simulation .matrix td {
  border:1px solid var(--line); padding:11px 13px; vertical-align:top; text-align:left
}

.interactive-article.article-urban-simulation .matrix thead th {
  background:var(--surface-2); font-weight:640; font-size:12.5px; color:var(--ink-2)
}

.interactive-article.article-urban-simulation .matrix tbody th {
  background:var(--surface-1); font-weight:640; width:150px; font-size:12.5px
}

.interactive-article.article-urban-simulation .matrix td {
  background:var(--surface-1)
}

.interactive-article.article-urban-simulation .matrix .ex {
  display:block; color:var(--ink-3); font-size:12px; margin-top:4px
}

.interactive-article.article-urban-simulation .tl {
  position:relative; margin:26px 0 0; padding-left:0
}

.interactive-article.article-urban-simulation .tl-item {
  display:grid; grid-template-columns:104px 1fr; gap:0; position:relative
}

.interactive-article.article-urban-simulation .tl-when {
  padding:22px 18px 22px 0; text-align:right; border-right:2px solid var(--line-strong);
  font-variant-numeric:tabular-nums; font-size:13px; color:var(--ink-2); font-weight:600;
}

.interactive-article.article-urban-simulation .tl-body {
  padding:22px 0 22px 24px; position:relative
}

.interactive-article.article-urban-simulation .tl-body::before {
  content:""; position:absolute; left:-7px; top:28px; width:12px; height:12px; border-radius:50%;
  background:var(--surface-0); border:2.5px solid var(--dot,var(--s1));
}

.interactive-article.article-urban-simulation .tl-title {
  font-weight:650; font-size:16px; margin-bottom:6px
}

.interactive-article.article-urban-simulation .tl-tag {
  display:inline-block; font-size:11.5px; color:var(--ink-3); border:1px solid var(--line); border-radius:20px; padding:1px 9px; margin-left:9px; vertical-align:middle
}

.interactive-article.article-urban-simulation .tl-body p {
  font-size:14px; color:var(--ink-2); margin:0 0 9px
}

.interactive-article.article-urban-simulation .tl-key {
  font-size:12.5px; color:var(--ink-3); margin-top:8px
}

.interactive-article.article-urban-simulation .tl-key b {
  color:var(--ink-2); font-weight:600
}

.interactive-article.article-urban-simulation .threads {
  display:grid; gap:16px
}

.interactive-article.article-urban-simulation .thread {
  border:1px solid var(--line); border-radius:12px; background:var(--surface-1); overflow:hidden
}

.interactive-article.article-urban-simulation .thread-hd {
  display:flex; align-items:flex-start; gap:13px; padding:18px 20px 14px; border-bottom:1px solid var(--line)
}

.interactive-article.article-urban-simulation .thread-dot {
  width:10px; height:10px; border-radius:3px; margin-top:8px; flex:none
}

.interactive-article.article-urban-simulation .thread-hd h3 {
  margin:0; font-size:17px
}

.interactive-article.article-urban-simulation .thread-hd .cap {
  font-size:12.5px; color:var(--ink-3); margin-top:2px
}

.interactive-article.article-urban-simulation .thread-bd {
  padding:16px 20px 20px; font-size:14px
}

.interactive-article.article-urban-simulation .thread-bd p {
  color:var(--ink-2)
}

.interactive-article.article-urban-simulation .phase {
  display:grid; grid-template-columns:82px 1fr; gap:14px; padding:9px 0; border-top:1px dashed var(--line); font-size:13.5px
}

.interactive-article.article-urban-simulation .phase:first-of-type {
  border-top:none
}

.interactive-article.article-urban-simulation .phase .p-when {
  color:var(--ink-3); font-variant-numeric:tabular-nums; font-size:12.5px; padding-top:1px
}

.interactive-article.article-urban-simulation .phase .p-what b {
  display:block; margin-bottom:2px; font-weight:640; color:var(--ink-1)
}

.interactive-article.article-urban-simulation .phase .p-what span {
  color:var(--ink-2)
}

.interactive-article.article-urban-simulation .pivot {
  margin-top:14px; padding:11px 14px; background:var(--surface-2); border-radius:8px;
  font-size:13px; color:var(--ink-2);
}

.interactive-article.article-urban-simulation .pivot b {
  color:var(--ink-1)
}

.interactive-article.article-urban-simulation .chartgrid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:18px; margin-top:8px; align-items:start
}

.interactive-article.article-urban-simulation .card {
  border:1px solid var(--line); border-radius:12px; background:var(--surface-1); padding:18px 20px
}

.interactive-article.article-urban-simulation .card .c-ttl {
  font-size:14px; font-weight:640; margin-bottom:2px
}

.interactive-article.article-urban-simulation .card .c-sub {
  font-size:12px; color:var(--ink-3); margin-bottom:16px
}

.interactive-article.article-urban-simulation .bars {
  display:flex; align-items:flex-end; gap:5px; height:225px; position:relative
}

.interactive-article.article-urban-simulation .barval {
  font-size:10.5px; color:var(--ink-3); text-align:center; font-variant-numeric:tabular-nums; margin-bottom:4px; line-height:1
}

.interactive-article.article-urban-simulation .barcol {
  flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:stretch; height:100%; position:relative; cursor:default
}

.interactive-article.article-urban-simulation .barseg {
  width:100%
}

.interactive-article.article-urban-simulation .barcol .stack {
  display:flex; flex-direction:column-reverse; gap:2px; width:100%
}

.interactive-article.article-urban-simulation .barcol .stack > div:last-child {
  border-radius:4px 4px 0 0
}

.interactive-article.article-urban-simulation .barlbl {
  font-size:10.5px; color:var(--ink-3); text-align:center; margin-top:7px; font-variant-numeric:tabular-nums
}

.interactive-article.article-urban-simulation .hbars {
  display:flex; flex-direction:column; gap:9px
}

.interactive-article.article-urban-simulation .hbar {
  display:grid; grid-template-columns:96px 1fr 38px; gap:10px; align-items:center; font-size:12.5px
}

.interactive-article.article-urban-simulation .hbar .n {
  color:var(--ink-2); text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis
}

.interactive-article.article-urban-simulation .hbar .t {
  height:14px; background:var(--surface-2); border-radius:4px; overflow:hidden
}

.interactive-article.article-urban-simulation .hbar .t i {
  display:block; height:100%; border-radius:4px; background:var(--s1)
}

.interactive-article.article-urban-simulation .hbar .c {
  color:var(--ink-3); font-variant-numeric:tabular-nums; text-align:right
}

.interactive-article.article-urban-simulation .legend {
  display:flex; flex-wrap:wrap; gap:12px; margin-top:14px; font-size:12px; color:var(--ink-2)
}

.interactive-article.article-urban-simulation .legend span {
  display:inline-flex; align-items:center; gap:6px
}

.interactive-article.article-urban-simulation .legend i {
  width:9px; height:9px; border-radius:2.5px; display:inline-block
}

.interactive-article.article-urban-simulation #tip {
  position:fixed; z-index:200; pointer-events:none; opacity:0; transition:opacity .1s;
  background:var(--surface-1); border:1px solid var(--line-strong); border-radius:8px;
  padding:9px 12px; font-size:12.5px; box-shadow:0 6px 22px rgba(0,0,0,.14); max-width:260px;
}

.interactive-article.article-urban-simulation #tip b {
  display:block; margin-bottom:4px; font-size:13px
}

.interactive-article.article-urban-simulation #tip .r {
  display:flex; justify-content:space-between; gap:16px; color:var(--ink-2)
}

.interactive-article.article-urban-simulation #tip .r i {
  width:8px;height:8px;border-radius:2px;display:inline-block;margin-right:6px
}

.interactive-article.article-urban-simulation .filters {
  display:flex; flex-wrap:wrap; gap:9px; align-items:center; margin-bottom:16px
}

.interactive-article.article-urban-simulation .filters select, .interactive-article.article-urban-simulation .filters input {
  font-family:inherit; font-size:13px; padding:6px 10px; border-radius:7px;
  border:1px solid var(--line-strong); background:var(--surface-1); color:var(--ink-1);
}

.interactive-article.article-urban-simulation .filters input {
  min-width:230px; flex:1
}

.interactive-article.article-urban-simulation .filters .cnt {
  font-size:12.5px; color:var(--ink-3); white-space:nowrap; font-variant-numeric:tabular-nums
}

.interactive-article.article-urban-simulation .ptable {
  width:100%; border-collapse:collapse; font-size:13px
}

.interactive-article.article-urban-simulation .ptable thead th {
  position:sticky; top:52px; background:var(--surface-0); text-align:left; font-weight:640;
  font-size:12px; color:var(--ink-3); padding:9px 10px; border-bottom:1px solid var(--line-strong);
  cursor:pointer; user-select:none; white-space:nowrap;
}

.interactive-article.article-urban-simulation .ptable thead th:hover {
  color:var(--ink-1)
}

.interactive-article.article-urban-simulation .ptable td {
  padding:11px 10px; border-bottom:1px solid var(--line); vertical-align:top
}

.interactive-article.article-urban-simulation .ptable tbody tr:hover {
  background:var(--surface-1)
}

.interactive-article.article-urban-simulation .ptable .ti {
  font-weight:600; line-height:1.45
}

.interactive-article.article-urban-simulation .ptable .ti a {
  text-decoration:none
}

.interactive-article.article-urban-simulation .ptable .ti a:hover {
  text-decoration:underline
}

.interactive-article.article-urban-simulation .ptable .de {
  color:var(--ink-2); font-size:12.5px; margin-top:3px; line-height:1.55
}

.interactive-article.article-urban-simulation .ptable .au {
  color:var(--ink-3); font-size:11.5px; margin-top:3px
}

.interactive-article.article-urban-simulation .ptable .yr {
  font-variant-numeric:tabular-nums; color:var(--ink-2); white-space:nowrap
}

.interactive-article.article-urban-simulation .ven {
  display:inline-block; font-size:11.5px; padding:2px 7px; border-radius:5px; border:1px solid var(--line-strong); white-space:nowrap; font-weight:600
}

.interactive-article.article-urban-simulation .ven.top {
  border-color:color-mix(in srgb,var(--s1) 45%,transparent); color:var(--s1)
}

.interactive-article.article-urban-simulation .ven.pre {
  color:var(--ink-3)
}

.interactive-article.article-urban-simulation .ven.unc {
  border-color:color-mix(in srgb,var(--warn) 55%,transparent); color:var(--serious)
}

.interactive-article.article-urban-simulation .vsub {
  display:block; font-size:11px; color:var(--ink-3); margin-top:4px
}

.interactive-article.article-urban-simulation .thr {
  display:inline-flex; align-items:center; gap:6px; font-size:11.5px; color:var(--ink-2); white-space:nowrap
}

.interactive-article.article-urban-simulation .thr i {
  width:8px; height:8px; border-radius:2px; flex:none
}

.interactive-article.article-urban-simulation .trends {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:14px
}

.interactive-article.article-urban-simulation .trend {
  border:1px solid var(--line); border-radius:11px; padding:16px 18px; background:var(--surface-1)
}

.interactive-article.article-urban-simulation .trend .tn {
  font-size:11.5px; color:var(--ink-3); font-variant-numeric:tabular-nums; margin-bottom:6px; letter-spacing:.08em
}

.interactive-article.article-urban-simulation .trend .tt {
  font-weight:640; font-size:14.5px; margin-bottom:7px; line-height:1.45
}

.interactive-article.article-urban-simulation .trend .tb {
  font-size:13.5px; color:var(--ink-2)
}

.interactive-article.article-urban-simulation .trend .tb em {
  font-style:normal; color:var(--ink-1); font-weight:600
}

.interactive-article.article-urban-simulation .oplist {
  display:grid; gap:12px
}

.interactive-article.article-urban-simulation .op {
  border:1px solid var(--line); border-left:3px solid var(--crit); border-radius:0 10px 10px 0; padding:14px 18px; background:var(--surface-1)
}

.interactive-article.article-urban-simulation .op .ot {
  font-weight:640; font-size:14.5px; margin-bottom:5px
}

.interactive-article.article-urban-simulation .op .ob {
  font-size:13.5px; color:var(--ink-2)
}

.interactive-article.article-urban-simulation .groups {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:14px
}

.interactive-article.article-urban-simulation .grp {
  border:1px solid var(--line); border-radius:11px; padding:15px 17px; background:var(--surface-1)
}

.interactive-article.article-urban-simulation .grp .gn {
  font-weight:640; font-size:14px; margin-bottom:3px
}

.interactive-article.article-urban-simulation .grp .gi {
  font-size:12px; color:var(--ink-3); margin-bottom:9px
}

.interactive-article.article-urban-simulation .grp .gw {
  font-size:13px; color:var(--ink-2)
}

.interactive-article.article-urban-simulation .article-footer {
  padding:40px 0 70px; color:var(--ink-3); font-size:12.5px
}

.interactive-article.article-urban-simulation .article-footer p {
  margin:0 0 9px
}

.interactive-article.article-urban-simulation .hr {
  height:1px; background:var(--line); margin:26px 0
}

@media (max-width:720px) {
.interactive-article.article-urban-simulation .tl-item {
  grid-template-columns:1fr
}

.interactive-article.article-urban-simulation .tl-when {
  text-align:left; border-right:none; padding:18px 0 0
}

.interactive-article.article-urban-simulation .tl-body {
  padding-left:0; border-left:2px solid var(--line-strong); padding-left:18px
}

.interactive-article.article-urban-simulation .tl-body::before {
  left:-7px
}

.interactive-article.article-urban-simulation .ptable thead {
  display:none
}

.interactive-article.article-urban-simulation .ptable td {
  display:block; border:none; padding:4px 0
}

.interactive-article.article-urban-simulation .ptable tbody tr {
  display:block; border-bottom:1px solid var(--line); padding:12px 0
}
}

/* Jekyll/Chirpy integration */
.interactive-article.article-urban-simulation {
  isolation: isolate;
  max-width: 100%;
  min-height: 0;
  margin: 1.5rem 0 0;
  overflow-wrap: anywhere;
}
.interactive-article.article-urban-simulation img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
}
.interactive-article.article-urban-simulation .scroll {
  max-width: 100%;
}
.interactive-article.article-urban-simulation section:first-child {
  padding-top: 1rem;
}
@media (max-width: 576px) {
  .interactive-article.article-urban-simulation { margin-inline: -0.25rem; }
}