/* Author: Codex app agent · 2026-09-11. Compact operations reference. */
:root{--paper:#f6f5ef;--surface:#fffefa;--ink:#203b36;--muted:#52655d;--line:#cfd7ce;--green:#185442;--lime:#d9edb2;--blue:#e0ebf3;--sand:#f2e5cf;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;line-height:1.5;font-size:16px}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:3px}button,input{font:inherit;color:inherit}button,summary{cursor:pointer}button{border:1px solid var(--line);border-radius:4px;background:var(--surface);min-height:44px}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #a14d16;outline-offset:2px}h1,h2,h3,p{margin-top:0}h1{font-size:1.65rem;line-height:1.2;letter-spacing:-.02em;margin-bottom:12px}h1:focus,main:focus{outline:none}h2{font-size:1.12rem;line-height:1.3;margin-bottom:8px}h3{font-size:1rem;margin-bottom:6px}p{margin-bottom:10px}svg{fill:none;stroke:currentColor;stroke-width:1.6}[hidden]{display:none!important}
.skip{position:fixed;top:-100px;left:12px;background:var(--green);color:white;z-index:20;padding:12px}.skip:focus{top:8px}.topbar{min-height:54px;display:flex;align-items:center;padding:5px 16px;border-bottom:1px solid var(--line);gap:24px}.brand{font-size:1.05rem;display:flex;align-items:center;gap:9px;text-decoration:none;min-height:44px}.brand-mark{background:var(--green);color:var(--lime);height:29px;width:29px;border-radius:5px;display:grid;place-items:center;font-weight:750}.top-note,.about-link{font-size:.82rem}.top-note{color:var(--muted)}.about-link{margin-left:auto;display:flex;align-items:center;min-height:44px}.layout{display:grid;grid-template-columns:235px minmax(0,1fr);width:100%;margin:0}.sidebar{padding:12px;border-right:1px solid var(--line);position:sticky;top:0;align-self:start;height:100dvh;overflow:auto}.search-box label{display:block;font-size:.8rem;font-weight:650;margin-bottom:5px}.search-input{display:flex;align-items:center;position:relative}.search-input svg{width:17px;position:absolute;left:10px;pointer-events:none}.search-input input{width:100%;min-width:0;min-height:44px;padding:8px 45px 8px 33px;background:var(--surface);border:1px solid #9eaea0;border-radius:4px;font-size:.88rem}input::-webkit-search-cancel-button{display:none}#clear-search{position:absolute;right:1px;width:42px;border:0;background:transparent;font-size:1.2rem}.quiet,.review-stamp{font-size:.8rem;color:var(--muted)}#search-status{margin:5px 0;font-size:.75rem}.navigation{border:0;background:transparent;margin:0}.navigation>summary{padding:8px 0;font-size:.85rem}.nav-group{margin:8px 0}.nav-group h3{font-size:.76rem;color:var(--muted);margin:8px 6px 2px}.nav-group a{display:flex;align-items:center;text-decoration:none;font-size:.85rem;padding:5px 8px;line-height:1.25;min-height:36px;border-radius:3px}.nav-group a:hover{background:#e4eadd}.nav-group a[aria-current=page]{background:var(--green);color:white}.sidebar-note{font-size:.72rem;color:var(--muted);border-top:1px solid var(--line);padding-top:8px;margin-top:12px}main{min-width:0;padding:18px 22px}.record{min-width:0}.operations{display:grid;grid-template-columns:175px minmax(0,1fr);margin:0 0 12px;border-top:2px solid var(--green)}.operations dt,.operations dd{margin:0;padding:10px 12px;border-bottom:1px solid var(--line)}.operations dt{font-weight:650;font-size:.85rem;background:#e9eee2}.operations dd{font-size:.94rem;overflow-wrap:anywhere}.index-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:16px 0}.index-groups section{min-width:0;border-top:2px solid var(--green);padding-top:8px}.index-groups section:has(a[href="#webphp"]){grid-row:span 2}.index-groups h2{margin-bottom:5px}.index-groups ul{list-style:none;padding:0;margin:0}.index-groups li{display:flex;align-items:center;flex-wrap:wrap;gap:0 8px;border-bottom:1px solid var(--line);font-size:.88rem;min-height:36px}.index-groups a{padding:7px 0;font-weight:550}.index-groups li span{color:var(--muted);font-size:.76rem}
details{background:var(--surface);border:1px solid var(--line);border-radius:4px;margin:7px 0}summary{padding:10px 12px;font-size:.87rem;font-weight:600;min-height:44px}summary::marker{color:var(--green)}.detail-content{padding:0 14px 10px;font-size:.9rem}.detail-content h3{font-size:.83rem;margin-top:12px}.detail-content ol,.detail-content ul{padding-left:22px;margin:8px 0}.detail-content li{margin:6px 0}.sources{font-size:.8rem}.sources li{margin:3px 0}code{font-size:.8rem;overflow-wrap:anywhere}.badge{font-size:.75rem}.flow-section{margin:8px 0;padding:8px 0;border-top:1px solid var(--line)}.flow-section>h3{font-size:.87rem;margin:0 0 4px}.flow-section .flow{gap:6px}.flow-section .flow li{padding:4px 8px}.flow-section .flow p{margin:2px 0 0}.flow-section .step-num{display:inline-block;margin-right:5px}.flow{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.flow li{min-width:0;border-left:2px solid var(--line);padding:8px 10px}.step-num{font-size:.72rem;color:var(--muted)}.flow p{font-size:.85rem;margin:5px 0}.node{background:transparent;border:0;padding:4px 0;text-align:left;font-weight:600;line-height:1.3}.node span{font-size:.75rem}.about{margin-top:16px;border-top:1px solid var(--line);padding-top:10px;font-size:.85rem}.about>summary{padding-left:0}.legend{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.legend dt{font-weight:650}.legend dd{margin:3px 0;color:var(--muted)}footer{border-top:1px solid var(--line);margin-top:12px;padding-top:10px;display:flex;justify-content:space-between;font-size:.72rem;color:var(--muted);gap:12px}
dialog{border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);width:min(560px,calc(100% - 24px));max-height:90dvh;padding:24px;box-shadow:0 20px 80px #0003}dialog::backdrop{background:#142e29a8}dialog h2{padding-right:32px}.dialog-close{position:absolute;right:10px;top:10px;width:44px;font-size:1.4rem}.connections{border-top:1px solid var(--line);padding-top:12px;display:grid;grid-template-columns:1fr 1fr;gap:16px}.connections dt{font-size:.75rem;color:var(--muted)}.connections dd{font-size:.9rem;margin:0}video{display:block;width:100%;max-height:560px;background:#17241f;margin-top:10px;border-radius:4px}.intro,.chapter-intro{font-size:1rem}.eyebrow{font-size:.72rem;color:var(--muted);margin-bottom:6px}.primary,.secondary{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;border-radius:4px;font-size:.88rem}.primary{background:var(--green);color:#fff}.no-script-note{font-size:.8rem}
@media(min-width:1800px){.operations{grid-template-columns:190px minmax(0,1fr)}.index-groups{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1050px){.index-groups{grid-template-columns:repeat(2,minmax(0,1fr))}.flow{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.topbar{padding:3px 10px;gap:8px}.top-note{display:none}.layout{display:block}.sidebar{position:static;height:auto;padding:8px 10px;border-right:0;border-bottom:1px solid var(--line)}.search-box label{margin:0}.search-input input{font-size:1rem}#search-status{margin:3px 0}.navigation>summary{padding:8px 0}.navigation nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.nav-group a{min-height:44px}.sidebar-note{display:none}main{padding:14px 10px}h1{font-size:1.4rem}.operations{grid-template-columns:1fr}.operations dt{padding:7px 9px 0;border-bottom:0;background:transparent}.operations dd{padding:3px 9px 9px;font-size:.94rem}.index-groups{grid-template-columns:1fr;gap:12px}.index-groups section:has(a[href="#webphp"]){grid-row:auto}.index-groups li{min-height:44px}.index-groups a{padding:10px 0}.flow{grid-template-columns:1fr}.legend{grid-template-columns:1fr 1fr}.about{margin-top:12px}footer{display:block}footer span{display:block;margin-bottom:6px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media print{.sidebar,.topbar,dialog{display:none}.layout{display:block}main{padding:0}.record[hidden]{display:block!important}.record{break-before:page}.record:first-child{break-before:auto}details{break-inside:avoid}}
/* Author: Codex app agent · 2026-09-11. Guided multimedia tour. */
.city-hero{margin:0 0 36px;background:#102d32;color:#f6f5ef;border-radius:18px;overflow:hidden}.city-hero img{display:block;width:100%;height:auto}.city-hero figcaption{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 25px;font-size:.9rem}.city-hero .primary{background:#bce5c5;color:#102d32}.tour-contents{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 32px}.tour-contents button{padding:12px 17px;background:#185442;color:#fff;border:0}.audio-guide{padding:25px;border-top:3px solid #185442;background:#e9eee2;border-radius:0 0 16px 16px;margin-bottom:50px}.audio-guide .eyebrow{margin-bottom:10px}.audio-guide h2{margin-bottom:8px}.audio-guide p{font-size:.9rem}.audio-guide audio{width:100%;margin:8px 0}.spoken-caption{min-height:3.5em;font-weight:550;padding:12px 0;color:#185442}.tour-chapter{position:relative;border-top:1px solid var(--line);padding-top:36px;margin-top:60px;scroll-margin-top:24px}.chapter-number{font-family:ui-monospace,monospace;font-size:4rem;line-height:1;color:#becbc0;float:right;margin-left:20px}.tour-chapter>h2{font-size:clamp(1.8rem,3vw,2.7rem);max-width:700px;letter-spacing:-.04em}.chapter-intro{max-width:700px;font-size:1.04rem;line-height:1.7}.film{margin:28px 0 38px}.film video{aspect-ratio:16/9;max-height:none;width:100%;background:#102d32}.media-label{font-size:.65rem;letter-spacing:.06em;color:var(--muted);margin:12px 0}.diagram-figure{margin:28px 0;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface)}.diagram-preview{overflow:auto;padding:18px;max-height:650px}.diagram-preview img{display:block;width:100%;height:auto;min-width:520px}.diagram-figure figcaption{padding:20px;border-top:1px solid var(--line)}.diagram-figure figcaption strong{display:block;margin-bottom:14px}.figure-tools{display:flex;gap:16px;flex-wrap:wrap;align-items:center;font-size:.8rem}.figure-tools button{padding:9px 15px}.diagram-figure details{border:0;border-top:1px solid var(--line);border-radius:0;margin:0}.next-reading{font-size:.88rem;line-height:2}.drift-note{background:#f2e5cf;border-left:4px solid #bd7528;padding:25px;margin:30px 0}.drift-note .eyebrow{font-size:.62rem}.drift-note h3{font-size:1.2rem}.drift-note p{font-size:.85rem;margin:20px 0 0}.drift-table{overflow:auto}table{border-collapse:collapse;width:100%;font-size:.85rem;text-align:left}caption{text-align:left;font-size:.7rem;color:var(--muted);padding:0 0 12px}th,td{padding:12px 9px;border-bottom:1px solid #cbbda3;vertical-align:top}thead th{font-size:.7rem;text-transform:uppercase}td code{font-size:.76rem}.copy-bench{background:#102d32;color:#f6f5ef;padding:28px;border-radius:16px}.copy-bench h3{font-size:1.5rem;color:#f3bf70}.copy-bench>p{font-size:.9rem}.bench-files{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}.bench-files>div{border:1px solid #517475;padding:18px;border-radius:8px}.bench-files span{display:block;font-size:.6rem;letter-spacing:.08em;color:#bce5c5;margin-bottom:12px}.bench-files strong{font-size:1rem}.bench-files .bad{color:#ec947f}.bench-actions{display:flex;flex-wrap:wrap;gap:10px}.bench-actions button{padding:9px 14px;background:#bce5c5;color:#102d32;border:0;font-size:.8rem}.bench-actions button:disabled{opacity:.4;cursor:default}#bench-status{border-top:1px solid #517475;padding-top:18px;margin:24px 0 14px;color:#f3bf70}.copy-bench .quiet{color:#bed1ca;font-size:.75rem}.takeaway{padding:30px 0}.takeaway li{margin-bottom:12px}.takeaway p{font-size:.9rem}.diagram-dialog{width:95vw;max-width:1500px;max-height:95dvh;padding:24px}.diagram-dialog:fullscreen{background:var(--surface);max-height:none;width:100vw;height:100dvh}.zoom-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.zoom-tools button{padding:8px 14px}.zoom-tools output{min-width:50px;text-align:center;font-size:.85rem}.zoom-viewport{height:60dvh;overflow:auto;border:1px solid var(--line);background:#e9eee2;overscroll-behavior:contain}.zoom-viewport img{display:block;max-width:none;height:auto}.diagram-dialog .quiet{margin:12px 0}.diagram-dialog:fullscreen .zoom-viewport{height:75dvh}@media(max-width:760px){.city-hero figcaption{display:block;padding:18px}.city-hero figcaption>span{display:block;margin-bottom:15px}.city-hero img{min-height:210px;object-fit:cover}.tour-contents{display:grid;grid-template-columns:1fr}.audio-guide{padding:20px}.chapter-number{font-size:3rem}.tour-chapter{margin-top:45px}.diagram-preview{padding:10px;max-height:500px}.diagram-preview img{min-width:620px}.figure-tools{gap:12px}.drift-note{padding:18px}th,td{padding:10px 7px}.bench-files{grid-template-columns:1fr}.bench-files>div{padding:14px;display:flex;justify-content:space-between;align-items:center;gap:12px}.bench-files span{margin:0}.copy-bench{padding:20px}.diagram-dialog{padding:18px}.diagram-dialog h2{font-size:1.1rem}.zoom-tools{gap:6px}.zoom-tools button{padding:8px 10px}}@media print{.tour-contents,.bench-actions,.figure-tools,audio,video{display:none}}
.diagram-shell:fullscreen{background:var(--surface);color:var(--ink);padding:26px;width:100vw;height:100dvh;overflow:auto}.diagram-shell:fullscreen .zoom-viewport{height:calc(100dvh - 190px)}.zoom-viewport img{margin-inline:auto}.diagram-preview img{object-fit:contain}

/* Keep optional media compact without changing playback. */
.tour-chapter{padding-top:16px;margin-top:24px}.tour-chapter>h2{font-size:1.5rem}.chapter-number{font-size:2rem}.audio-guide{padding:14px;margin-bottom:20px}.film,.diagram-figure{margin:16px 0}.diagram-figure figcaption{padding:12px}.drift-note,.copy-bench{padding:16px}.chapter-intro{line-height:1.5}.takeaway{padding:14px 0}

/* Index: WWW capabilities together, shared runtime references beside them. */
.index-groups{grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-items:start}.index-groups>div{display:grid;gap:16px;min-width:0}.index-groups section:has(a[href="#webphp"]){grid-row:auto}.index-groups>section ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}.index-groups>section li{align-content:center}.index-groups li span{display:block}@media(max-width:1050px){.index-groups>section ul{grid-template-columns:1fr}}@media(max-width:760px){.index-groups{grid-template-columns:1fr}.index-groups>section ul{grid-template-columns:1fr}}

/* Author: Codex app agent · 2026-09-11. Continuous lane reading. */
.lane>.record{margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}
.lane>.record>h2{font-size:1.3rem;margin-bottom:10px}
.lane>.record:first-of-type{margin-top:0;padding-top:0;border-top:0}
.lane>h1{margin-bottom:14px}
.record,.lane,#about{scroll-margin-top:12px}
.nav-group h3{margin:8px 0 2px}.nav-group h3 .lane-link{font-size:.88rem;font-weight:750;min-height:36px}
.nav-group>a[data-route]{padding-left:16px;font-size:.8rem;min-height:30px}
.nav-group a[aria-current=location]{background:#e4eadd;font-weight:650}
h2[tabindex="-1"]:focus{outline:none}
@media(max-width:760px){.nav-group>a[data-route]{min-height:44px}.nav-group h3 .lane-link{min-height:44px}}

/* Independent lane links and native project disclosures. */
.lane-group{position:relative;margin:4px 0;border-bottom:1px solid var(--line)}
.lane-group h3{margin:0;padding-right:44px}
.lane-group h3 .lane-link{min-height:44px;padding:8px;font-size:.85rem}
.project-list{margin:0;border:0;border-radius:0;background:transparent}
.project-list>summary{position:absolute;top:0;right:0;width:44px;height:44px;min-height:44px;padding:0;display:grid;place-items:center;list-style:none;border-radius:3px;color:var(--green)}
.project-list>summary::-webkit-details-marker{display:none}
.project-list>summary:hover{background:#e4eadd}
.project-list>summary span{font-size:1.1rem}
.project-list[open]>summary span{transform:rotate(90deg)}
.project-jumps{padding:0 0 6px 12px}
.project-jumps a[data-route]{font-size:.8rem;min-height:32px;padding:5px 8px;border-left:1px solid var(--line);border-radius:0}
@media(max-width:760px){.project-jumps a[data-route]{min-height:44px}}