:root{--ink:#222922;--paper:#eeeadd;--mono:Consolas,'Courier New',monospace;--serif:Georgia,'Times New Roman',serif;--heavy:'Arial Black','Franklin Gothic Heavy',Arial,sans-serif;font-family:Arial,sans-serif;color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}a{color:inherit;text-underline-offset:4px}a:focus-visible{outline:3px solid #095b8a;outline-offset:4px}header{position:fixed;z-index:5;inset:0 0 auto;display:flex;justify-content:space-between;align-items:flex-start;padding:18px 24px;pointer-events:none}header>*{pointer-events:auto;background:var(--paper);padding:7px 10px}.author{font:10px/1.45 var(--mono);text-decoration:none}header nav{display:flex;gap:clamp(6px,1.5vw,24px);font:10px/1.4 var(--mono)}header nav a{min-height:32px;display:flex;align-items:center}.skip{position:fixed;z-index:9;top:-90px;left:16px;background:var(--paper);padding:12px}.skip:focus{top:12px}.street{position:relative;min-height:100svh;padding:120px clamp(20px,5vw,72px) 48px;background-image:linear-gradient(90deg,rgba(20,24,19,.18),transparent 65%),url('../assets/mumbai-walk-master.webp');background-size:cover;background-position:center}.street:before{content:"";position:absolute;inset:0;background:rgba(29,32,25,.08);pointer-events:none}.street>*{position:relative}.tree{background-position:center 72%}.civic{background-position:74% 56%}.attention{background-position:88% 50%}.label{margin:0 0 20px;width:fit-content;background:var(--paper);padding:8px 10px;font:10px/1.2 var(--mono);letter-spacing:.06em}.street>h1,.street>h2{max-width:min(880px,100%);margin:0 0 9vh;padding:0;overflow-wrap:anywhere;color:var(--ink);font:normal clamp(2.6rem,6.4vw,6.2rem)/.98 var(--serif);letter-spacing:-.045em;text-wrap:balance;text-shadow:0 1px rgba(238,234,221,.45)}.reveal{width:min(790px,100%);padding:clamp(20px,4vw,48px);background:var(--paper)}.reveal h2,.reveal h3{max-width:100%;margin:0 0 16px;font:900 clamp(3.4rem,10vw,8rem)/.88 var(--heavy);letter-spacing:-.075em;overflow-wrap:anywhere}.reveal p{font:clamp(1.2rem,2.2vw,1.65rem)/1.3 var(--serif);margin:0 0 18px}.reveal a{display:inline-flex;min-height:44px;align-items:center;font:12px var(--mono)}.civic .reveal{margin-left:auto}.attention .reveal{width:min(850px,100%)}.end{padding:42px clamp(20px,5vw,72px);display:flex;justify-content:space-between;gap:24px;align-items:flex-start;flex-wrap:wrap;background:var(--paper);font:11px/1.5 var(--mono)}.end nav,.end div{display:grid;gap:4px}.end a{min-height:36px;display:flex;align-items:center}.end p{margin:10px 0}.attention .reveal h3{font-size:clamp(3.1rem,9.4vw,7.3rem)}
@media(max-width:520px){header{padding:10px 8px}.author{font-size:8px;padding:5px 7px}header nav{gap:2px;font-size:8px}header nav a{padding:0 4px;min-height:34px}.street{min-height:92svh;padding:92px 16px 28px;background-position:center}.tree{background-position:42% 70%}.civic{background-position:72% 54%}.attention{background-position:84% 50%}.street>h1,.street>h2{font-size:clamp(2.3rem,9.3vw,3.5rem);margin-bottom:11vh}.reveal{padding:18px}.reveal h2,.reveal h3{font-size:clamp(2.7rem,12.2vw,4.5rem);line-height:.91}.attention .reveal h3{font-size:clamp(2.45rem,10.6vw,4.2rem)}.reveal p{font-size:1.12rem}.end{padding:24px 18px;gap:14px}.end nav{width:100%}}
@media(max-height:540px) and (orientation:landscape){.street{min-height:125svh;padding-top:75px}.street>h1,.street>h2{margin-bottom:5vh}.reveal{width:min(680px,90%)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
header nav a,.end a,.skip{min-height:44px}.skip{display:flex;align-items:center}
 .civic{background-image:linear-gradient(90deg,rgba(20,24,19,.18),transparent 65%),url('./assets/civic-works.jpg')}.attention{background-image:linear-gradient(90deg,rgba(20,24,19,.18),transparent 65%),url('./assets/attention-cue.jpg')}
.street>h1,.street>h2{color:#fff3d6;text-shadow:0 1px 2px rgba(20,22,18,.95),1px 0 1px rgba(20,22,18,.75),-1px 0 1px rgba(20,22,18,.75),0 -1px 1px rgba(20,22,18,.75)}