.connected-walk .intro h1{font-size:clamp(40px,4.8vw,66px)}
.intro-starts{display:flex;gap:22px;margin-top:18px;font-size:11px;color:var(--accent)}
.street-switch{grid-column:1/-1;display:grid;grid-template-columns:1fr 48px 1fr;align-items:stretch;gap:6px;margin-bottom:4px}
.street-switch>a{display:flex;align-items:center;justify-content:center;gap:12px;text-decoration:none;border:1px solid var(--line);border-radius:4px;background:#f9f8f1;padding:10px 18px;transition:background .15s;color:var(--ink)}
.street-switch>a.current{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.street-switch>a>span{font:18px Georgia,serif;opacity:.75}
.street-switch b{font-size:13px;font-weight:500;line-height:1.25}.street-switch small{display:block;font-size:10px;font-weight:400;margin-top:4px;letter-spacing:.5px;opacity:.8}
.street-switch #streetJunction{flex-direction:column;gap:0;padding:3px;color:var(--accent);border:0;background:transparent}
.street-switch #streetJunction>span{font-size:25px;line-height:1}.street-switch #streetJunction small{font-size:9px}
.connected-walk .chapter-nav{grid-template-columns:repeat(4,1fr)}
.connected-walk .story-column{top:188px}.connected-walk .story-card{max-height:calc(100dvh - 210px)}
.connected-walk .related-walk{display:block;margin:16px 0 8px;padding:12px;border:1px solid var(--accent);font-size:12px;color:var(--accent);text-decoration:none;background:#f4ece0}
.connected-walk .directory-detail dl{display:grid;grid-template-columns:110px 1fr;gap:9px 14px;margin:0 0 16px}.connected-walk .directory-detail dt{font-size:10px;color:var(--accent)}.connected-walk .directory-detail dd{margin:0;font-size:11px}.connected-walk .directory-detail a+a{margin-left:16px}
.turn-marker{position:absolute;z-index:5;left:75%;transform:translate(-50%,-100%);display:block;width:clamp(200px,30%,310px);line-height:1.35;padding:14px 17px;background:var(--ink);color:var(--paper);border:1px solid #e9d6ae;border-radius:5px;text-decoration:none;box-shadow:0 7px 22px #142e2750}
.turn-marker:after{content:'';position:absolute;left:34px;top:100%;border:10px solid transparent;border-top-color:var(--ink)}
.turn-marker small{display:block;font-size:8px;letter-spacing:.7px;color:#dbd9bd}.turn-marker strong{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:500;margin:6px 0}.turn-marker strong span{font-size:25px;color:#efb18c;line-height:1}.turn-marker>span{font-size:11px;color:#e5cdae}
.junction-panel{position:absolute;left:0;right:0;background:#edf0e6;border-block:1px solid #bdcbb8;line-height:1.5;display:grid;grid-template-columns:1.2fr 1fr;gap:25px;align-items:center;padding:clamp(20px,4vw,54px);scroll-margin-top:180px}
.junction-copy .eyebrow{font-size:clamp(8px,.85vw,11px);line-height:1.4;letter-spacing:1.2px;margin:0 0 12px;color:var(--accent)}
.junction-copy h2{font:clamp(22px,3.4vw,39px)/1.08 Georgia,serif;letter-spacing:-1px;margin:0}
.junction-chinese{font-size:clamp(11px,1.3vw,15px);letter-spacing:2px;margin:13px 0;color:var(--ink)}
.junction-description{font-size:clamp(11px,1.2vw,14px);line-height:1.7;max-width:380px;color:var(--muted)}
.junction-actions{display:flex;align-items:center;gap:18px;margin-top:20px}.junction-actions a{font-size:clamp(10px,1vw,12px);text-decoration:none}.junction-actions a:first-child{padding:12px 14px;color:var(--paper);background:var(--accent);border-radius:3px}.junction-actions a:last-child{border-bottom:1px solid #b7c2ac;padding:4px 0;white-space:nowrap}
.junction-diagram{margin:0;line-height:1}.junction-diagram svg{width:100%;height:auto}.junction-diagram figcaption{display:block!important;text-align:center;padding:10px 0!important;font-size:10px!important;color:var(--muted);line-height:1.2}
.connected-walk #buildingIndex,.connected-walk #huaihaiIndex{scroll-margin-top:190px}
@media(max-width:760px){
 .connected-walk .intro h1{font-size:40px}.intro-starts{font-size:10px;gap:18px}
 .street-switch{grid-template-columns:1fr 32px 1fr;gap:3px;margin-bottom:2px}.street-switch>a{padding:7px 5px;gap:6px}.street-switch>a>span{font-size:14px}.street-switch b{font-size:11px}.street-switch small{font-size:9px;letter-spacing:0}.street-switch #streetJunction>span{font-size:21px}
 .connected-walk .route-strip{gap:10px}.connected-walk .route-strip div>span{display:none}.connected-walk .route-strip b{font-size:17px}.connected-walk .route-strip p{max-width:160px;font-size:9px;line-height:1.7}.connected-walk .route-strip p span{margin:0 3px}
 .turn-marker{left:73%;width:49%;min-width:0;padding:8px 10px}.turn-marker small{font-size:6px;letter-spacing:0}.turn-marker strong{font-size:11px;margin:3px 0}.turn-marker strong span{font-size:18px}.turn-marker>span{font-size:9px}.turn-marker:after{border-width:7px}
 .junction-panel{padding:15px 20px;gap:10px;grid-template-columns:1fr}.junction-copy .eyebrow{font-size:7px;letter-spacing:.6px;margin-bottom:7px}.junction-copy h2{font-size:23px;letter-spacing:-.5px}.junction-chinese{font-size:11px;letter-spacing:1px;margin:7px 0}.junction-description,.junction-diagram{display:none}.junction-actions{margin-top:10px;gap:18px}.junction-actions a:first-child{padding:9px 11px}
 .connected-walk .story-column.has-story,.connected-walk .story-column.has-story.card-left{top:auto}.connected-walk .story-column.has-story .story-card{max-height:44dvh}
 .connected-walk .street-finish a{display:inline-block;margin:8px 18px 0 0}
}
@media(prefers-reduced-motion:reduce){.street-switch>a{transition:none}}
@media(max-width:380px){.junction-panel{padding-block:10px}.junction-copy h2{font-size:21px}.junction-actions{gap:12px}.junction-actions a{font-size:9px}}
.connected-walk .map-canvas{min-width:0;margin-inline:auto}.connected-walk .map-viewport{overflow-anchor:none}.connected-walk .view-tools #zoomIn,.connected-walk .view-tools #zoomOut{border:1px solid #cfcebd;background:#eeeddf;font-size:16px;min-width:34px;min-height:34px}.connected-walk .view-tools #resetView{border:1px solid #d9d7c8;min-height:34px}.street-zoom-label{font-size:9px;color:var(--muted);margin-right:3px}@media(max-width:420px){.street-zoom-label{display:none}}

/* Resize the viewing window; keep all seven paintings in the same canvas. */
.street-window{width:var(--street-window-width,100%);height:var(--street-window-height,clamp(220px,calc(100dvh - var(--walk-toolbar-height,180px) - 28px),720px));max-width:100%;max-height:max(220px,calc(100dvh - var(--walk-toolbar-height,180px) - 28px));display:flex;flex-direction:column;margin:12px auto 0;border:1px solid #c6c9b7;border-radius:8px;overflow:hidden;background:#e2e5dc;container-type:inline-size}
.connected-walk .street-window .map-viewport{flex:1;min-height:0;height:0;max-height:none;overflow:auto;scrollbar-gutter:stable;overscroll-behavior-y:auto}
.window-size-bar{display:flex;align-items:center;gap:8px;flex:none;min-height:36px;padding:0 0 0 12px;border-top:1px solid #d5d5c6;background:#f6f4e9;color:var(--muted);font:9px/1.3 Arial,"PingFang SC",sans-serif}
.window-size-bar>span{min-width:0}.window-size-bar small{font-size:9px;margin-left:8px}.window-size-reset{margin-left:auto;padding:6px 3px;background:none;border:0;font:9px Arial,"PingFang SC",sans-serif;color:var(--muted);white-space:nowrap}
.window-resize-handle{display:grid;place-items:center;flex:none;width:36px;height:36px;min-height:36px;padding:0;border:0;border-left:1px solid #d5d5c6;background:#e9eadd;color:#45624e;cursor:nwse-resize;touch-action:none;user-select:none;font:24px/1 Arial,sans-serif}
.window-resize-handle:hover,.window-resize-handle:focus-visible{background:#d9dfcc;color:#233e30}.window-resize-handle:focus-visible{outline-offset:-3px}.is-resizing{user-select:none}.is-resizing .map-canvas{pointer-events:none}
.connected-walk .story-column,.connected-walk .story-column.has-story,.connected-walk .story-column.card-left{position:fixed;left:auto;right:16px;top:calc(var(--walk-toolbar-height,176px) + 12px);width:min(338px,calc(100vw - 32px))}
.connected-walk .story-card{max-height:calc(100dvh - var(--walk-toolbar-height,176px) - 28px)}
@media(max-width:760px){.connected-walk .story-column,.connected-walk .story-column.has-story,.connected-walk .story-column.has-story.card-left{left:auto;right:12px;top:auto;bottom:12px;width:min(310px,calc(100vw - 24px))}.street-window{border-radius:5px}.window-size-bar{padding-left:8px;gap:5px}.window-size-bar small{margin-left:4px}}
@container(max-width:620px){.junction-panel{padding:12px 18px;gap:8px}.junction-copy .eyebrow{font-size:7px;letter-spacing:.6px;margin-bottom:7px}.junction-copy h2{font-size:23px;letter-spacing:-.5px}.junction-chinese{font-size:11px;letter-spacing:1px;margin:7px 0}.junction-description{display:none}.junction-actions{margin-top:10px;gap:12px}.junction-actions a{font-size:10px}.junction-actions a:first-child{padding:9px 11px}.map-label{padding:4px 5px;gap:4px}.label-name{font-size:10px}.label-english{font-size:7px}}

.single-street .street-switch{grid-template-columns:repeat(4,minmax(0,1fr))}.single-street .street-switch>a{padding:9px 5px;gap:6px}.single-street .street-switch b{font-size:12px}.single-street .street-switch small{font-size:10px}.single-street .intro h1{font-size:clamp(40px,4.8vw,66px)}.single-street .street-index{scroll-margin-top:190px}.single-street .directory-detail p{font-size:14px;line-height:1.7;max-width:780px}.single-street .touch-hint{font-size:14px}.single-street .road-history p{line-height:1.6}@media(max-width:760px){.single-street .street-switch>a{display:block;text-align:center}.single-street .street-switch b{font-size:11px}.single-street .street-switch>a>span{display:none}.single-street .street-switch small{font-size:9px}}

.road-labels a{pointer-events:all;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.road-labels a:hover{fill:#a44e31}.single-street .road-labels{font-size:12px}