:root{color-scheme:light;--ink:#252d34;--muted:#79858e;--blue:#2875ab;--line:#293e5014;--glass:#ffffffdc;--base:#f6f7f7}
*{box-sizing:border-box}html,body,main{width:100%;height:100%;margin:0;overflow:hidden}body{background:var(--base);color:var(--ink);font:25.2px/1.5 'Avenir Next',Avenir,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--blue);outline-offset:4px}button{border:0}a{color:inherit;text-decoration:none}a:hover{color:var(--blue)}[hidden]{display:none!important}svg{display:block}#scene,#node-labels,#layer-labels{position:absolute;inset:0}#scene canvas{display:block;width:100%;height:100%;touch-action:none}#node-labels,#layer-labels{pointer-events:none;overflow:hidden}.glass{background:var(--glass);border:1px solid #fff;box-shadow:0 12px 50px #24364a0b,0 1px 4px #24364a03;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-radius:20px}
.identity{position:absolute;left:32px;top:28px;display:flex;align-items:center;gap:12px;pointer-events:none}.brand-icon{width:32px;height:38px;fill:none;stroke:#374957;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.wordmark{display:block;font-size:45px;line-height:1.1;font-weight:620;letter-spacing:-1.1px}.brand-dot{color:var(--blue)}.location{display:block;margin-top:5px;font-size:19.8px;color:var(--muted);letter-spacing:.3px}.top-actions{position:absolute;top:28px;right:30px;display:flex;gap:8px}.icon-button{width:36px;height:36px;background:transparent;border-radius:12px;display:grid;place-items:center;padding:8px;flex-shrink:0;color:#7b858b}.icon-button:hover{background:#283d5010;color:var(--ink)}.icon-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.top-actions>.glass{width:40px;height:40px;border-radius:14px}
.legend{position:absolute;left:34px;top:124px;display:flex;flex-direction:column;gap:11px;font-size:19.8px;color:#747e85;pointer-events:none}.legend>span{display:flex;align-items:center;gap:9px}.legend i{width:6px;height:6px;background:var(--color);border-radius:50%}.legend b{font-weight:400;font-size:18px;color:#a4acb1;min-width:20px;padding-left:9px}
.node-hit{position:absolute;left:0;top:0;width:26px;height:26px;padding:0;background:transparent;border-radius:50%;pointer-events:auto;transform:translate(-50%,-50%);z-index:1;display:grid;place-items:center;transition:opacity .3s;outline-offset:1px}.node-hit i{display:block;width:9px;height:9px;background:var(--node-color);border-radius:50%;box-shadow:0 1px 5px #23384825;transition:transform .3s,opacity .3s,box-shadow .3s}.node-hit:hover i{transform:scale(1.4)}.node-hit.is-target{z-index:3}.node-hit.is-target i{width:12px;height:12px;box-shadow:0 0 0 4px #fff9,0 0 0 5px #2875ab55,0 2px 8px #2875ab24}.node-hit.is-selected i{transform:scale(1.3)}.node-hit.city-node i{opacity:0}.node-hit.city-node{width:38px;height:38px}.node-hit.city-node:focus-visible i,.node-hit.city-node:hover i{opacity:1}.node-hit.dimmed i{opacity:.22}.node-hit.has-photo:after{content:'';position:absolute;right:3px;bottom:3px;width:3px;height:3px;background:var(--node-color);border-radius:50%;opacity:.55}
.layer-label{position:absolute;left:0;top:0;transform:translate(-100%,-50%);font-size:18px;letter-spacing:.5px;display:flex;align-items:center;gap:10px;color:var(--layer-color);white-space:nowrap;opacity:.8}.layer-label:after{content:'';width:23px;height:1px;background:currentColor;opacity:.4}.layer-label small{display:block;color:#9a9fa5;font-size:16.2px;letter-spacing:0}
.inspector{position:absolute;top:96px;right:28px;width:314px;max-height:calc(100svh - 226px);overflow:auto;padding:13px 18px 18px;scrollbar-width:thin;scrollbar-color:#d2d8dc transparent;animation:appear .25s ease-out}.inspector-header{display:flex;align-items:center;justify-content:space-between;gap:14px;color:var(--muted);font-size:19.8px;min-height:30px}.inspector-header .icon-button{width:28px;height:28px;padding:6px;margin-right:-6px}.node-kind{display:flex;align-items:center;gap:7px}.node-kind:before{content:'';width:6px;height:6px;background:var(--node-color);border-radius:50%}h1{font-size:27px;line-height:1.4;font-weight:550;margin:5px 0 15px;letter-spacing:-.3px}.inspector img{display:block;width:100%;height:200px;object-fit:contain;background:#eef1f2;border-radius:10px}.inspector #photo-credit{font-size:16.2px;color:#92999e;margin-top:6px;line-height:1.5}.inspector #photo-credit a{color:#73828d}#photo-wrap{margin-bottom:18px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 12px;margin:18px 0 0}.metric-grid div{min-width:0}.metric-grid dt{font-size:18px;color:var(--muted);margin:0 0 4px;line-height:1.4}.metric-grid dd{font-size:27px;letter-spacing:-.35px;margin:0;font-variant-numeric:tabular-nums}.metric-grid dd small{font-size:18px;color:#7f8b92;margin-left:3px;letter-spacing:0}.subtle-note{font-size:18px;color:#9aa2a7;line-height:1.6;margin:17px 0 0}.inspector details{border-top:1px solid var(--line);margin-top:18px;padding-top:13px}.inspector summary{list-style:none;cursor:pointer;font-size:18px;color:#89939b;display:flex;justify-content:space-between}.inspector summary::-webkit-details-marker{display:none}.inspector details[open] summary span{transform:rotate(45deg)}.text-action{padding:0;margin-top:18px;display:flex;align-items:center;justify-content:space-between;background:transparent;width:100%;font-size:19.8px;color:var(--blue)}
.prediction-locked{font-size:18px;color:#99a3ab;display:flex;align-items:center;gap:7px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:11px 0}.prediction-locked svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5}.prediction-results{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 0;margin-top:2px}.prediction-results div{display:flex;flex-direction:column;gap:4px}.prediction-results small{font-size:16.2px;letter-spacing:.3px;color:#99a1a7}.prediction-results strong{font-size:27px;font-weight:550;letter-spacing:-.3px;color:var(--blue)}.prediction-results div+div strong{color:#7a838a;font-size:25.2px;font-weight:400}.prediction-unknown{font-size:18px;color:#99a1a7;margin:12px 0}
.target-chip{position:absolute;left:34px;bottom:170px;display:flex;align-items:center;gap:8px;font-size:19.8px;color:#647e90;max-width:calc(100vw - 60px)}.target-chip i{width:5px;height:5px;border-radius:50%;background:var(--blue)}.target-chip button{background:transparent;color:var(--blue);font-size:25.2px;padding:0 5px}.target-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bottom-ui{position:absolute;bottom:49px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:13px;max-width:calc(100vw - 28px)}.phase-note{font-size:21.6px;color:#72818c;letter-spacing:.1px;white-space:nowrap}.timeline{padding:9px;display:flex;align-items:center;gap:5px;border-radius:21px}.stage-tabs{display:flex;align-items:center;gap:2px}.stage-tabs button{padding:8px 11px;background:transparent;border-radius:12px;color:#99a3aa;display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:19.8px;transition:background .2s,color .2s}.stage-tabs button:hover{background:#f0f3f5;color:#566f81}.stage-tabs button[aria-current=step]{background:#e9f1f6;color:#286589}.stage-number{font-size:14.4px;opacity:.55;font-variant-numeric:tabular-nums}.control-divider{height:22px;width:1px;background:var(--line);margin:0 5px}.play-button{color:#526c7f;width:32px;height:32px}.play-button svg{width:17px;height:17px}.play-button svg path{fill:currentColor;stroke:none}.next-button{height:35px;min-width:100px;background:#294f68;color:#fff;border-radius:11px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:19.8px}.next-button:hover{background:#346783}.next-button span{font-size:28.8px}.canvas-hint{font-size:16.2px;color:#a6afb4;display:flex;gap:8px;letter-spacing:.2px}footer{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:7px;align-items:center;color:#a2a9af;font-size:16.2px;white-space:nowrap}
.about-panel{position:absolute;right:28px;top:82px;width:320px;padding:14px 20px 21px;z-index:5;max-height:calc(100svh - 150px);overflow:auto}.about-panel p{color:#7f8b93;font-size:19.8px;line-height:1.8;margin:12px 0}.about-panel a{font-size:19.8px;color:#3c718f}.about-panel #source-links{display:flex;gap:8px 15px;flex-wrap:wrap;margin:15px 0}.tooltip{position:absolute;left:0;top:0;padding:6px 10px;background:#ffffffed;box-shadow:0 3px 20px #223c4810;border-radius:8px;font-size:18px;color:#69808e;pointer-events:none;z-index:8;white-space:nowrap}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;background:var(--base);font-size:21.6px;color:#9aa5ad;z-index:10}.loading-mark{width:15px;height:15px;border:1px solid #d9e1e7;border-top-color:#377da8;border-radius:50%;animation:spin 1.4s linear infinite}.error{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);padding:20px;max-width:440px;font-size:21.6px;color:#936259;z-index:11}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes appear{from{opacity:0;translate:7px 0}to{opacity:1;translate:0 0}}
@media(max-width:1000px){.stage-tabs button{padding:8px}.stage-number{display:none}.identity{left:24px}.legend{left:27px}.target-chip{left:27px}.inspector{width:280px;right:20px}.top-actions{right:20px}.next-button{min-width:88px}}
@media(max-width:700px){.identity{top:21px;left:20px;gap:8px}.brand-icon{width:26px;height:32px}.wordmark{font-size:39.6px}.location{font-size:18px}.top-actions{top:21px;right:16px;gap:5px}.top-actions>.glass{width:34px;height:34px;border-radius:11px}.legend{top:108px;left:22px;gap:9px;font-size:18px}.legend b{display:none}.legend i{width:5px;height:5px}.bottom-ui{bottom:49px;gap:11px}.timeline{padding:7px;gap:2px;border-radius:17px}.stage-tabs{gap:0}.stage-tabs button{padding:7px 6px;font-size:16.2px;border-radius:9px}.timeline>.icon-button{width:24px;padding:4px}.control-divider{margin:0 3px}.next-button{min-width:0;width:33px;padding:0;justify-content:center;height:31px;font-size:0}.next-button span{font-size:28.8px}.phase-note{font-size:18px;max-width:90vw;white-space:normal;text-align:center}.canvas-hint{font-size:14.4px}footer{font-size:14.4px}.inspector{top:81px;right:13px;width:46vw;min-width:170px;padding:10px 13px 15px;max-height:calc(100svh - 236px);border-radius:16px}.inspector img{height:150px}.inspector h1{font-size:21.6px}.metric-grid{gap:11px 8px}.metric-grid dt{font-size:16.2px}.metric-grid dd{font-size:21.6px}.prediction-results{grid-template-columns:1fr;gap:10px}.prediction-results strong{font-size:23.4px}.target-chip{left:22px;bottom:162px;max-width:55vw;font-size:16.2px}.layer-label{font-size:16.2px}.layer-label:after{width:12px}.about-panel{right:13px;top:70px;width:min(320px,calc(100vw - 26px))}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

#scene{z-index:0}#node-labels{z-index:2}#layer-labels{z-index:1}.identity,.top-actions,.legend,.bottom-ui,.target-chip,footer{z-index:4}.inspector{z-index:5}.node-hit.city-node:after{opacity:0}.next-button{white-space:nowrap}

.prediction-label{position:absolute;z-index:3;font-size:19.8px;padding:5px 10px;border-radius:9px;background:#ffffffed;box-shadow:0 3px 20px #2c536a12;color:var(--blue);pointer-events:none;white-space:nowrap}
@media(max-width:700px){.inspector{top:auto;bottom:151px;right:13px;width:calc(100vw - 26px);min-width:0;max-height:42svh;padding:10px 16px 15px}.inspector h1{margin-top:0;margin-bottom:10px}.inspector #photo-wrap{float:left;width:34%;margin:0 17px 10px 0}.inspector img{height:120px}.inspector #photo-credit{font-size:14.4px}.inspector .metric-grid{gap:11px}.inspector .subtle-note{clear:both}.inspector .prediction-results{grid-template-columns:1fr 1fr}.inspector .prediction-locked{border-top:0}.inspector .metric-grid:after{content:none}.prediction-label{font-size:16.2px;padding:4px 7px}}

#scene canvas{cursor:grab}#scene canvas:active{cursor:grabbing}

/* Marker faces live on horizontal planes in the 3D scene; buttons remain accessible hit areas. */
.node-hit i,.node-hit:after{display:none}

.graph-steps{display:flex;align-items:center;gap:12px;height:18px;color:#b4bcc1}.graph-steps button{background:transparent;padding:0;color:#8b989f;font-size:19.8px;white-space:nowrap}.graph-steps button small{font-size:14.4px;opacity:.55;margin-right:4px}.graph-steps button[aria-pressed=true]{color:var(--blue)}.graph-steps button:hover{color:var(--ink)}@media(max-width:700px){.graph-steps{gap:9px}.graph-steps button{font-size:18px}}

/* Larger type keeps the same floating layout, with room for the new text sizes. */
.identity{gap:16px}.brand-icon{width:42px;height:50px}.legend{top:168px;gap:12px}.legend b{padding-left:12px}.legend i{width:7px;height:7px}
.inspector{width:390px;top:100px;padding:16px 22px 22px}.inspector-header{min-height:36px}.inspector h1{overflow-wrap:anywhere}.inspector img{height:230px}.metric-grid{column-gap:18px;row-gap:20px}.prediction-results{gap:16px}.inspector #photo-credit{margin-top:10px}.inspector .subtle-note{line-height:1.5}
.about-panel{width:460px}.bottom-ui{bottom:66px;gap:16px}.timeline{padding:11px;gap:8px}.stage-tabs button{padding:9px 12px}.stage-tabs{gap:4px}.stage-number{font-size:14.4px}.next-button{height:46px;min-width:150px;padding:0 16px}.play-button{width:38px;height:38px}.phase-note{white-space:normal;text-align:center}.canvas-hint{white-space:nowrap}footer{bottom:22px;gap:10px}.target-chip{bottom:214px}.graph-steps{height:auto;min-height:30px;gap:18px}.graph-steps button{padding:4px 0}.graph-steps button small{margin-right:6px}.prediction-label{padding:8px 14px}.tooltip{font-size:18px;max-width:calc(100vw - 30px);white-space:normal}.prediction-reveal{animation:prediction-in 2s ease both}
@keyframes prediction-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px){.stage-number{display:none}.stage-tabs button{padding:8px;font-size:18px}.next-button{min-width:135px}.inspector{width:340px;right:20px}.metric-grid dt{font-size:16.2px}.graph-steps{gap:14px}}
@media(max-width:700px){.identity{left:20px;top:21px;gap:10px}.brand-icon{width:30px;height:38px}.wordmark{font-size:39.6px}.location{font-size:18px}.legend{top:150px;left:22px;font-size:18px;gap:9px}.inspector{top:auto;bottom:226px;right:13px;width:calc(100vw - 26px);max-height:38svh;padding:12px 16px 16px}.inspector #photo-wrap{width:34%;margin-right:15px}.inspector img{height:145px}.inspector h1{font-size:21.6px}.metric-grid dt{font-size:16.2px}.metric-grid dd{font-size:21.6px}.inspector-header{font-size:19.8px}.bottom-ui{width:calc(100vw - 26px);bottom:65px;gap:10px}.timeline{width:100%;display:grid;grid-template-columns:36px 1fr 44px;padding:8px;gap:3px}.stage-tabs{grid-row:1;grid-column:1 / -1;justify-content:space-between;width:100%}.stage-tabs button{font-size:16.2px;padding:8px 5px}.timeline>#previous{grid-row:2;grid-column:1;width:32px}.control-divider{display:none}.timeline>#play{grid-row:2;grid-column:2;justify-self:center;width:34px}.timeline>#next{grid-row:2;grid-column:3;width:40px;min-width:0;height:34px;font-size:0;padding:0}.timeline>#next span{font-size:28.8px}.graph-steps{width:100%;display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;align-items:start;min-height:32px}.graph-steps>span{display:none}.graph-steps button{font-size:18px;white-space:normal;line-height:1.25}.graph-steps button small{display:block;font-size:14.4px;margin:0 0 3px}.phase-note{font-size:18px}.target-chip{bottom:242px;font-size:16.2px;max-width:calc(100vw - 44px)}.target-chip:has(+.bottom-ui #graph-steps:not([hidden])){bottom:275px}.layer-label{font-size:16.2px}.layer-label small{font-size:16.2px}.canvas-hint{font-size:14.4px;gap:5px}footer{font-size:14.4px;gap:7px;max-width:calc(100vw - 20px)}.prediction-label{font-size:16.2px;max-width:calc(100vw - 26px);white-space:normal}.about-panel{width:calc(100vw - 26px);max-height:calc(100svh - 150px)}.about-panel p{font-size:19.8px}.about-panel a{font-size:19.8px}}
@media(prefers-reduced-motion:reduce){.prediction-reveal{animation:none}}

@media(max-width:700px){.layer-label{display:none}}

/* Right-side layer captions and larger playback / brand controls. */
.identity{left:auto;right:30px;top:22px}.brand-icon{width:56px;height:66px}.wordmark{font-size:56px}.top-actions{left:32px;right:auto}.top-actions>.glass{width:48px;height:48px}.top-actions .icon-button svg{width:25px;height:25px}
.play-button{width:58px;height:58px;border-radius:16px;background:#e8eff4;color:#2c607f}.play-button svg{width:31px;height:31px}.play-button:hover{background:#dce8f0}.bottom-ui{bottom:64px}
.layer-label{transform:translateY(-50%);gap:10px;text-align:left;opacity:.9}.layer-label:after{order:-1;width:22px;flex-shrink:0}.layer-label .intersection-label{color:#bc5145}
@media(max-width:700px){.identity{left:auto;right:16px;top:18px;gap:10px}.brand-icon{width:40px;height:48px}.wordmark{font-size:43px}.location{font-size:16px}.top-actions{left:16px;right:auto;top:22px}.top-actions>.glass{width:39px;height:39px}.top-actions .icon-button svg{width:23px;height:23px}.timeline>#play{width:52px;height:52px}.play-button svg{width:29px;height:29px}.layer-label{display:flex;font-size:14px;gap:6px}.layer-label small{font-size:12px}.layer-label:after{width:12px}}

@media(min-width:701px){.inspector{top:132px;max-height:calc(100svh - 290px)}.about-panel{top:132px;max-height:calc(100svh - 200px)}}
@media(max-width:700px){.about-panel{top:120px;max-height:calc(100svh - 190px)}}
@media(max-width:380px){.identity .brand-icon{width:32px;height:40px}.identity .wordmark{font-size:36px}.identity .location{font-size:14px}}

.layer-label{font-size:22px}.layer-label small{font-size:18px}.next-button{height:58px;border-radius:16px;justify-content:center}
@media(max-width:700px){.layer-label{font-size:16px}.layer-label small{font-size:13px}.timeline{grid-template-columns:36px 1fr 52px}.timeline>#next{grid-column:2;justify-self:end;width:auto;min-width:135px;height:52px;padding:0 14px;font-size:16.2px}.timeline>#play{grid-column:3;height:52px;width:52px}}

.identity{left:32px;right:auto;top:26px;max-width:calc(100vw - 180px);gap:12px}.identity .brand-icon{width:44px;height:52px;flex-shrink:0}.identity .wordmark{font-size:36px;letter-spacing:-1px;line-height:1.12}.identity .location{font-size:18px}.top-actions{left:auto;right:30px}
.inspector #photo-wrap.building-imagery{display:grid;grid-template-columns:1fr 1fr;gap:12px;float:none;width:auto;margin:0 0 18px}.building-imagery figure{margin:0;min-width:0}.building-imagery figcaption{font-size:14px;color:var(--muted);margin-bottom:7px}.inspector .building-imagery img{height:168px;width:100%;object-fit:contain;border-radius:9px}.building-imagery .image-credit,.inspector .building-imagery #photo-credit{font-size:11px;line-height:1.45;margin-top:7px;overflow-wrap:anywhere;color:#92999e}.image-unavailable{height:168px;display:grid;place-items:center;background:#eef1f2;border-radius:9px;color:#9aa2a7;font-size:13px;text-align:center;padding:12px}
@media(max-width:700px){.identity{left:16px;right:auto;top:22px;max-width:calc(100vw - 140px);gap:8px}.identity .brand-icon{width:28px;height:36px}.identity .wordmark{font-size:21px;letter-spacing:-.5px}.identity .location{font-size:13px}.top-actions{left:auto;right:16px}.inspector #photo-wrap.building-imagery{float:none;width:auto;margin:0 0 14px;gap:12px}.inspector .building-imagery img,.image-unavailable{height:150px}.building-imagery figcaption{font-size:13px}.building-imagery .image-credit,.inspector .building-imagery #photo-credit{font-size:10px}}

@media(max-width:700px){.graph-steps[aria-label="Propagation steps"]{grid-template-columns:1fr 1fr;max-width:360px}}

.layer-label{font-weight:600}.layer-label small{font-weight:400}
@media(max-width:700px){
 .bottom-ui{width:calc(100vw - 24px);max-width:calc(100vw - 24px);bottom:calc(48px + env(safe-area-inset-bottom));gap:10px}
 .timeline{display:grid;grid-template-areas:"stages stages stages" "previous next play";grid-template-columns:44px minmax(0,1fr) 52px;grid-template-rows:40px 48px;gap:8px;width:100%;min-width:0;padding:8px;border-radius:20px}
 .timeline>#stage-tabs{grid-area:stages;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;width:100%;min-width:0}
 .stage-tabs button{justify-content:center;width:100%;min-width:0;max-width:100%;padding:6px 3px;font-size:clamp(12px,3.5vw,16px)}.stage-tabs .stage-number{display:none}
 .timeline>#previous{grid-area:previous;width:44px;height:48px;justify-self:stretch}
 .timeline>#next{grid-area:next;justify-self:stretch;width:100%;min-width:0;height:48px;padding:0 10px;border-radius:13px;font-size:16px}
 .timeline>#play{grid-area:play;width:52px;height:48px;justify-self:stretch;border-radius:13px}
 footer{bottom:calc(14px + env(safe-area-inset-bottom));font-size:11px;gap:6px;max-width:calc(100vw - 24px)}
}

@media(max-width:700px){.inspector{bottom:calc(var(--bottom-controls-height,170px) + 64px + env(safe-area-inset-bottom))}}

.layer-label{transform:translate(-100%,-50%);text-align:right}.layer-label:after{order:1}