@font-face{font-family:LocalGrotesk;src:local("Arial");font-display:swap}
:root{font-family:LocalGrotesk,Arial,Helvetica,sans-serif;color:#f1f0e9;background:#111310;font-synthesis:none;--ink:#111310;--cream:#f1f0e9;--muted:#a3a69a;--accent:#ff8058;--line:#34382e;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0}button,a,input,summary{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a,summary{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.38}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #eaff8d;outline-offset:5px}h1,h2,h3,p{margin:0}h1{font-weight:500;letter-spacing:-.072em;line-height:.99}h1 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.073em}h2{letter-spacing:-.04em}p{line-height:1.55}.wrap{width:min(1320px,calc(100% - 96px));margin-inline:auto}.mono,.eyebrow,.card-caption,.stage-toolbar,.map-footnote,.brand,.method-link,.site-footer,.map-coordinate,.north{font-family:'Courier New',monospace}.small{font-size:11px;line-height:1.7;letter-spacing:.045em}.muted{color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:absolute;top:-100px;left:20px;z-index:10;padding:15px;background:var(--cream);color:var(--ink)}.skip:focus{top:10px}.site-header{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-size:11px;font-weight:bold;display:flex;align-items:center;gap:12px;letter-spacing:.025em}.brand-symbol{font-family:Arial,sans-serif;font-size:32px;line-height:1;font-weight:normal}.brand-lab{color:var(--muted);margin-left:7px}.method-link{font-size:11px;display:flex;gap:25px}.method-link:hover{color:var(--accent)}.eyebrow{font-size:10px;letter-spacing:.13em;display:flex;gap:10px;align-items:center;line-height:1.5}.live-dot,.reality-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);display:inline-block;flex:none}.button{border:0;padding:18px 23px;min-height:53px;border-radius:3px;font-size:13px;font-weight:600;display:inline-flex;justify-content:space-between;align-items:center;gap:35px;transition:background .15s,transform .15s}.button.primary{background:var(--accent);color:#141610}.button.primary:hover:not(:disabled){background:#ff9b7b;transform:translateY(-2px)}.button.secondary{border:1px solid #555b4d;color:var(--cream);background:transparent}.button.secondary:hover{background:#25291f}.button span[aria-hidden]{font-size:20px;line-height:1}.stage-toolbar{display:flex;justify-content:space-between;align-items:center;margin:29px 0 15px;font-size:10px;letter-spacing:.04em;gap:12px;min-height:34px}.stage-toolbar>p{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.text-button{border:1px solid #4b5143;background:transparent;color:#c9ccbf;min-height:36px;border-radius:3px;padding:8px 11px;font-size:10px;white-space:nowrap}.text-button:hover{background:#262a20}.demo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.demo-card{--tone:#ff9d79;--map:#27271f;--block:#34352a;--street:#535742;--river:#1e2521;--tone-wash:#3d3328;border:1px solid #45493b;border-radius:7px;background:#1e221b;overflow:hidden;transition:border-color .2s,box-shadow .2s}.demo-card.sage{--tone:#d0e4ab;--map:#222b25;--block:#303c31;--street:#596953;--river:#172623;--tone-wash:#303e2d}.demo-card.lilac{--tone:#c9b3ed;--map:#282631;--block:#3a3447;--street:#625575;--river:#1c222e;--tone-wash:#3b3248}.card-header{height:59px;padding:12px 17px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #ffffff13}.label-circle{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;font:14px 'Courier New',monospace;border:1px solid var(--tone);color:var(--tone);border-radius:50%;flex:none}.card-caption{font-size:9px;letter-spacing:.12em;color:#c2c7b9}.card-spark{margin-left:auto;font-size:25px;line-height:1;color:var(--tone)}.map-wrap{position:relative;overflow:hidden}.city{width:100%;display:block;overflow:visible}.map-ground{fill:var(--map)}.grid-line{stroke:var(--street);stroke-width:.6;opacity:.35}.buildings{fill:var(--block)}.contours{fill:none;stroke:var(--street);stroke-width:1;opacity:0}.map-1 .buildings{opacity:.15}.map-1 .contours{opacity:.6}.map-2 .buildings{opacity:.35}.map-2 .grid-line{stroke-dasharray:1 4;stroke-width:1.4;opacity:.8}.river{stroke:var(--river);stroke-width:24;fill:none}.avenue{stroke:var(--street);stroke-width:.6;fill:none;stroke-dasharray:4 6;opacity:.6}.map-corner{fill:none;stroke:var(--tone);stroke-width:.6;opacity:.3}.route-path{fill:none;stroke:var(--tone);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}.emphasis-0 .route-path{stroke-width:1.7}.emphasis-2 .route-path{stroke-width:3.2}.route-glow{fill:none;stroke:var(--tone);stroke-width:7;opacity:.2}.route-flow{fill:none;stroke:#fffbee;stroke-width:1;stroke-dasharray:5 24;opacity:.5;animation:route-flow 4s linear infinite}.stop circle{fill:var(--map);stroke:var(--tone);stroke-width:1.8}.stop.depot rect{fill:var(--tone);stroke:var(--map);stroke-width:2}.courier{fill:#fffcdf;stroke:var(--tone);stroke-width:1;animation:travel 13s linear infinite;filter:drop-shadow(0 0 3px var(--tone))}.motion-0 .courier{animation-duration:20s}.motion-2 .courier{animation-duration:9s}.map-coordinate{font-size:6px;letter-spacing:.7px;fill:var(--tone);opacity:.75}.north{font-size:9px;fill:var(--tone);opacity:.7}.map-overlay{position:absolute;bottom:17px;left:18px;display:flex;gap:8px;align-items:center;font:8px 'Courier New',monospace;color:var(--tone);padding:9px 10px;background:var(--map);border:1px solid color-mix(in srgb,var(--tone),transparent 70%);border-radius:3px;line-height:1.5;box-shadow:0 3px 10px #0002}.overlay-number{font:29px Arial,sans-serif;letter-spacing:-.07em}.overlay-cross{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5}.overlay-0{border-color:transparent;background:var(--map);padding:6px}.overlay-2{left:auto;right:18px;bottom:17px}.tiny-pulse{width:4px;height:4px;background:var(--tone);border-radius:50%;box-shadow:0 0 7px var(--tone)}.scan-chart{position:absolute;top:14px;right:18px;background:var(--map);border:1px solid #ffffff22;border-radius:3px;padding:7px 9px;color:var(--tone);font:6px 'Courier New',monospace}.scan-chart>div{display:flex;gap:3px;align-items:end;height:25px;padding-top:5px}.scan-chart i{width:4px;height:13px;background:var(--tone);opacity:.5;animation:scan 3s ease-in-out infinite alternate}.scan-chart i:nth-child(2n){height:19px;animation-delay:-1s}.scan-chart i:nth-child(3n){height:9px;animation-delay:-2s}.demo-card.is-selected{border-color:var(--tone);box-shadow:0 0 0 2px var(--tone)}.map-footnote{font-size:9px;color:#a1a993;display:flex;justify-content:space-between;margin:12px 0 0;line-height:1.5;gap:10px}.method-section{margin:42px 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);scroll-margin-top:20px}.method-section summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;padding:25px 0;gap:16px;font-size:20px;letter-spacing:-.035em;min-height:64px}.method-section summary::-webkit-details-marker{display:none}.method-section summary>.mono{font-size:9px;color:var(--muted);letter-spacing:.06em;display:flex;gap:30px}.method-section summary>.mono>span{font-size:20px;line-height:10px}.method-section details[open] summary>.mono>span{transform:rotate(45deg)}.method-content{display:grid;grid-template-columns:1fr 1fr;gap:30px 60px;padding:10px 0 32px}.method-content h3{font-weight:500;font-size:17px;margin-bottom:12px}.method-content p{font-size:13px;color:#b4bba8;margin-top:10px;max-width:58ch}.site-footer{display:flex;justify-content:space-between;gap:20px;padding-top:29px;padding-bottom:30px;font-size:9px;color:#a1aa94;line-height:1.6}.footer-dot{font-size:5px;margin:0 10px;color:var(--accent)}.play-heading{padding:42px 0 0}.play-title-row{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:23px}.play-title-row h1{font-size:clamp(50px,5.3vw,76px)}.play-title-row h1 em{color:var(--accent)}.generation-counter{width:154px;padding-top:4px}.generation-counter>.mono{color:var(--muted);font-size:9px;letter-spacing:.15em}.generation-counter b{display:block;font-size:68px;font-weight:400;letter-spacing:-.09em;line-height:1.4}.generation-counter b>span{font-size:21px;margin-left:8px;color:#979f89;letter-spacing:-.04em}.play-subtitle{color:#bbc1af;margin-top:18px;font-size:14px}.reality-dot{background:#cee9a6}.toggle{display:flex;align-items:center;gap:9px;min-height:44px;cursor:pointer;font-size:10px}.toggle input{width:17px;height:17px;accent-color:#ff8058;cursor:pointer}.reality-card{--tone:#242d22;--map:#e3e5dc;--block:#dadecf;--street:#a2aa99;--river:#d9dfd3;background:#e9ebe3;border-color:#a2ac96;color:var(--ink)}.reality-card .card-header{border-color:#c4cbbd}.reality-card .card-caption{color:#495541}.reality-card .map-wrap{border-bottom:1px solid #c4cbbd}.reality-card .route-path{stroke:#293625;stroke-width:2!important}.reality-card .stop circle{fill:#f3f5ec;stroke:#293625}.reality-card .depot rect{fill:#a73713;stroke:#e3e5dc}.reality-card .map-coordinate,.reality-card .north{fill:#435338;opacity:1}.reality-card .map-corner{stroke:#3f4a36;opacity:.4}.reality-card .stop text{font:8px 'Courier New',monospace;fill:#172212;stroke:#e3e5dc;stroke-width:2px;paint-order:stroke}.optimum-path{fill:none;stroke:#735444;stroke-width:2;stroke-dasharray:5 4;opacity:.8}.replay-row{display:flex;gap:14px;align-items:center;margin-top:36px;flex-wrap:wrap}.replay-row>.small{color:#aeba9e}.in-reality{background:#172013}.in-reality .site-header,.in-reality .method-section{border-color:#414f33}.in-reality .site-footer{color:#b1be9f}
@keyframes travel{from{offset-distance:0%}to{offset-distance:100%}}@keyframes route-flow{to{stroke-dashoffset:-116}}@keyframes scan{to{opacity:.85;transform:scaleY(.65);transform-origin:bottom}}
.motion-paused *,.motion-paused *::before,.motion-paused *::after{animation-play-state:paused!important}
@media(max-width:1050px){.wrap{width:calc(100% - 56px)}.demo-grid{gap:12px}.card-header{padding-inline:13px}.card-caption{font-size:8px}}
@media(max-width:760px){.wrap{width:calc(100% - 36px)}.site-header{height:70px}.brand{font-size:9px;gap:8px}.brand-symbol{font-size:26px}.brand-lab{display:none}.method-link{font-size:9px;gap:10px}.stage-toolbar{font-size:8px;margin:22px 0 12px;gap:7px}.stage-toolbar>p{gap:5px}.text-button{font-size:9px;padding:8px;min-height:38px}.demo-grid{grid-template-columns:1fr;gap:14px}.card-header{height:46px;padding:8px 14px}.card-caption{font-size:9px}.card-spark{font-size:23px}.label-circle{width:25px;height:25px;font-size:12px}.map-wrap{height:190px}.city{height:100%;width:100%}.map-overlay{left:12px;bottom:12px;padding:7px;font-size:7px}.overlay-number{font-size:24px}.overlay-2{left:auto;right:12px}.scan-chart{right:12px;top:12px}.map-footnote{font-size:8px;display:block;margin-top:13px}.map-footnote>span{display:block;margin-bottom:4px}.method-section{margin-top:30px}.method-section summary{padding-block:22px;font-size:19px}.method-section summary>.mono{font-size:8px;gap:15px}.method-content{grid-template-columns:1fr;gap:25px;padding-bottom:25px}.method-content p{font-size:12px}.method-content h3{font-size:16px}.site-footer{font-size:8px;display:block;padding-block:23px;line-height:1.9}.site-footer>span{display:block}.play-heading{padding-top:29px}.play-heading .eyebrow{font-size:8px;letter-spacing:.04em}.play-title-row{gap:10px;margin-top:22px;align-items:end}.play-title-row h1{font-size:clamp(40px,8.4vw,62px)}.generation-counter{width:85px;padding-bottom:2px}.generation-counter>.mono{font-size:7px;letter-spacing:.06em}.generation-counter b{font-size:39px;line-height:1.4}.generation-counter b>span{font-size:15px;margin-left:4px}.play-subtitle{font-size:12px;max-width:36ch;margin-top:17px}.toggle{font-size:8px;gap:6px}.toggle input{width:16px;height:16px}.reality-card .map-wrap{height:220px}.replay-row{display:grid;grid-template-columns:1fr;margin-top:27px}.replay-row>.button{width:100%}.replay-row>.small{font-size:8px;text-align:center}}
@media(max-width:365px){.wrap{width:calc(100% - 28px)}.play-title-row h1{font-size:38px}.stage-toolbar{font-size:7px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.courier{display:none}.route-flow{display:none}.button.primary:hover:not(:disabled){transform:none}}.text-button:disabled{opacity:1;color:#b8bfaa;cursor:default}
@media print{body{background:white;color:black}.site-header,.site-footer,.button,.stage-toolbar{display:none}.wrap{width:100%}.demo-grid{grid-template-columns:repeat(3,1fr)}.map-wrap{height:auto}}
/* Compact edition: the drawings carry the first explanation. */.site-header{height:78px}.method-section summary{font-size:17px}.stage-toolbar{margin-top:16px}.play-heading{padding-top:26px}.play-title-row{margin-top:12px}.play-title-row h1{font-size:clamp(40px,4.8vw,68px)}.play-subtitle{margin-top:8px}.generation-counter{width:auto}.generation-counter b{font-size:52px}.map-footnote{display:block;margin-top:10px}.method-section{margin-top:25px}.demo-card.blueprint{--tone:#c1daff;--map:#1631a0;--block:#2443b5;--street:#8eb8ff;--river:#182a77;--tone-wash:#243e9c}.demo-card.acid{--tone:#deff60;--map:#252c10;--block:#374020;--street:#657b2b;--river:#1c230e;--tone-wash:#3a4619}.demo-card.ice{--tone:#c0f2f8;--map:#153339;--block:#244b52;--street:#638f96;--river:#11282e;--tone-wash:#24525a}.frame-1{border-radius:0}.frame-1 .label-circle{border-radius:0}.frame-1 .card-header{border-bottom:3px double var(--tone);font-family:monospace}.frame-2 .label-circle{border:0;border-radius:0;font:italic 31px Georgia,serif}.frame-2 .card-header{height:59px}.map-3 .buildings,.map-3 .river,.map-3 .avenue{display:none}.map-3 .grid-line{opacity:.12}.map-3 .map-corner{opacity:.8}.frame-2 .map-overlay{border:0;border-radius:30px}.demo-card:focus-within{outline-offset:3px}table{width:100%;border-collapse:collapse;font-size:13px}caption{text-align:left;color:var(--muted);padding-bottom:12px;font-size:11px}th{text-align:left;color:var(--muted);font-weight:400;font-size:11px}td,th{padding:9px 12px;border-bottom:1px solid var(--line)}td:last-child,th:last-child{text-align:right}.chosen td{color:var(--accent)}.bench-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 20px}.segmented{display:inline-flex;gap:4px}.segmented button,.trace-slider button{background:transparent;border:1px solid var(--line);color:var(--cream);padding:10px 16px;min-height:44px;border-radius:3px;font-size:12px}.segmented button[aria-pressed=true]{background:var(--cream);color:var(--ink)}.trace-layout{display:grid;grid-template-columns:1fr 1fr;gap:30px}.trace-explanation{min-width:0}.trace-explanation h3{font-weight:400;font-size:23px;line-height:1.3;margin:18px 0 10px;letter-spacing:-.025em}.trace-explanation .eyebrow{color:var(--accent)}.trace-map .city{max-height:340px}.trace-slider{display:flex;align-items:center;gap:10px;padding:14px}.trace-slider input{min-width:0;flex:1;accent-color:#b74520}.trace-slider button{border-color:#a3aa96;color:#243421;padding:8px 12px}.trace-slider output{font:11px monospace}.decision-options{max-height:245px;overflow:auto;margin-top:20px}.decision-options .chosen td{color:#ffc6ad}.trace-total{display:flex;flex-wrap:wrap;gap:24px;padding-top:22px;font-size:12px;color:var(--muted)}.trace-total b{color:var(--cream);margin-left:8px}.votes{display:inline-flex;gap:6px;margin-left:12px;vertical-align:middle}.votes button{color:inherit;background:transparent;border:1px solid currentColor;border-radius:50%;width:36px;height:36px;opacity:.6}.votes button[aria-pressed=true]{opacity:1;color:var(--accent)}.votes svg{display:block;margin:auto;width:17px;height:17px}.site-footer{align-items:center}.in-reality{background:#111810}
@media(max-width:760px){.site-header{height:65px}.stage-toolbar{margin-top:18px}.play-title-row h1{font-size:39px;max-width:8ch}.generation-counter b{font-size:38px}.play-subtitle{font-size:12px}.map-wrap{height:170px}.demo-grid{gap:12px}.card-header,.frame-2 .card-header{height:40px}.map-overlay{font-size:7px;padding:5px}.trace-layout{grid-template-columns:1fr;gap:22px}.bench-controls{gap:10px}.segmented button{padding-inline:14px}.trace-explanation h3{font-size:23px}.trace-total{gap:12px}.trace-total>span{flex-basis:100%}.decision-options{max-height:270px}.replay-row{display:flex;flex-wrap:wrap;gap:10px}.replay-row>.button{width:auto;flex:1;white-space:nowrap;padding-inline:15px;gap:10px}.site-footer>span{display:block;margin-block:10px}}
@media(prefers-color-scheme:light){:root{--cream:#21251d;--ink:#f2f1e9;--muted:#58614e;--line:#c4c8b9;--accent:#b74520;color:#21251d;background:#f2f1e9;color-scheme:light}.in-reality{background:#ecefe5}.play-subtitle,.map-footnote,.method-content p,.site-footer,.generation-counter b>span{color:#58614e}.text-button{color:#36442b;border-color:#a7af99}.text-button:hover,.button.secondary:hover{background:#dce1d3}.button.primary{background:#ff8058;color:#161b12}.button.secondary{color:#21251d;border-color:#a4ad97}.demo-card{color:#f1f0e9}.reality-card{color:#172212}.reality-card.is-selected{box-shadow:0 0 0 2px #293625}.decision-options .chosen td{color:#a73713}.in-reality .site-footer{color:#58614e}.text-button:disabled{color:#58614e}}

.cue-inspector{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:36px;margin-top:24px;max-width:850px}.cue-inspector h3{font-size:26px;font-weight:400;margin-bottom:12px}.cue-inspector p{font-size:13px}.cue-switches{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.cue-switches label{display:flex;align-items:center;gap:8px;font-size:12px;border:1px solid var(--line);border-radius:4px;padding:11px;cursor:pointer}.cue-switches input{accent-color:var(--accent)}.no-colour .demo-card{--tone:#ddd;--map:#292929;--block:#383838;--street:#666;--river:#202020;--tone-wash:#333}.no-colour .courier{fill:#fff}.cue-inspector .map-wrap{max-height:260px}.cue-inspector .city{max-height:260px}
@media(max-width:760px){.cue-inspector{grid-template-columns:1fr;gap:20px}.cue-inspector .map-wrap{height:210px}}
.trace-map>.city{height:auto;aspect-ratio:6/5;flex:none}
/* A whole card is one native button; its invisible hit area spans the artwork. */
.demo-card{position:relative;--paper-tone:#87311e;--chosen-bg:var(--tone);--chosen-text:#131a11}
.selectable-card{cursor:pointer;isolation:isolate}
.selectable-card:hover{border-color:var(--tone);box-shadow:0 0 0 1px var(--tone)}
.demo-card.is-selected{box-shadow:0 0 0 2px var(--tone)}
.demo-card .card-header{height:58px;padding:12px 18px;background:var(--map);border-bottom:1px solid color-mix(in srgb,var(--tone),transparent 65%)}
.demo-card .label-circle{font-size:18px;width:32px;height:32px;color:var(--tone)}
.demo-card .map-overlay{font-size:11px;padding:10px 12px;line-height:1.2;letter-spacing:.04em;color:var(--tone);background:var(--map);border-color:var(--tone)}
.demo-card .overlay-number{font-size:32px}
.demo-card .map-coordinate{font-size:10px;opacity:1;letter-spacing:.2px}
.demo-card .north{font-size:11px;opacity:1}
.demo-card .emphasis-0 .route-path{stroke-width:2.3}
.demo-card .stop text{font-size:11px}
.demo-card.sage{--paper-tone:#315323}
.demo-card.lilac{--paper-tone:#63308e}
.demo-card.blueprint{--paper-tone:#1f3c9e}
.demo-card.acid{--paper-tone:#485708}
.demo-card.ice{--paper-tone:#075b66}
/* Editorial cards are ink on paper, even when the surrounding page is dark. */
.demo-card.frame-2{--tone:var(--paper-tone);--map:#f7efdf;--block:#e6dcc8;--street:#b5a58a;--river:#ede2cb;--tone-wash:#e6dbc4;--chosen-bg:var(--tone);--chosen-text:#fffaf0;background:var(--map);color:#282118;border-color:#b6a58e;border-radius:14px 14px 3px 3px}
.demo-card.frame-2 .label-circle{font:italic 36px Georgia,serif;width:auto}
.demo-card.frame-2 .card-header{height:58px;border-bottom:1px solid #cabca6}
.demo-card.frame-2 .route-flow{stroke:#fff;opacity:.8}
.demo-card.frame-2 .courier{fill:var(--tone);stroke:var(--map);filter:none}
.demo-card.frame-2 .route-glow{opacity:.12}
.demo-card.frame-1{border-style:solid;border-radius:0}
.demo-card.frame-1 .card-header{border-bottom:3px double var(--tone)}
.demo-card.frame-1 .map-corner{opacity:.9;stroke-width:1.5}
.demo-card.frame-1 .grid-line{opacity:.7}
.demo-card.frame-1 .stop circle{r:5;stroke-width:2.5}
.demo-card .map-0 .contours{display:none}
.demo-card .map-1 .buildings,.demo-card .map-1 .river,.demo-card .map-1 .avenue{display:none}
.demo-card .map-1 .grid-line{opacity:0}
.demo-card .map-1 .contours{opacity:.8;stroke-width:1.2}
.demo-card .map-2 .buildings,.demo-card .map-2 .river,.demo-card .map-2 .avenue{display:none}
.demo-card .map-2 .grid-line{stroke-dasharray:1 8;stroke-width:2;opacity:.9}
.demo-card .map-3 .grid-line{opacity:0}
.demo-card .map-3 .map-corner{opacity:.8}
.demo-card.reality-card{--chosen-bg:#243323;--chosen-text:#fffdf4}
.no-colour .demo-card.frame-2{--tone:#282828;--map:#f1f1ed;--block:#ddd;--street:#a1a1a1;--river:#e5e5e5;--chosen-text:#fff}
.play-title-row h1{font-size:clamp(40px,4.5vw,60px);max-width:none}
.play-subtitle{font-size:16px}
.generation-counter{align-self:flex-end}
.stage-toolbar{justify-content:flex-end;min-height:44px;margin:16px 0}
.text-button{font-size:13px;min-height:44px;padding:10px 14px}
.choice-mini .city{width:100%;height:100%;overflow:hidden}
.choice-mini .map-coordinate,.choice-mini .north,.choice-mini .map-corner{display:none}
.decision-options table{font-size:15px}.decision-options caption,.decision-options th{font-size:13px}.decision-options td{padding-block:12px}
.trace-total{font-size:14px}.trace-total b{font-size:18px}
.map-footnote{font-size:11px}
@media(max-width:760px){
 .play-title-row{align-items:flex-end;gap:10px}
 .play-title-row h1{font-size:clamp(32px,8.5vw,48px);max-width:none}
 .generation-counter b{font-size:29px;white-space:nowrap}.generation-counter b>span{font-size:14px}
 .play-subtitle{font-size:14px;max-width:32ch}
 .demo-card .card-header,.demo-card.frame-2 .card-header{height:48px;padding:8px 14px}
 .demo-card .label-circle{font-size:16px;width:29px;height:29px}
 .demo-card.frame-2 .label-circle{font-size:32px}
 .demo-card .map-wrap{height:210px;background:var(--map)}
 .demo-card .map-overlay{font-size:11px;padding:8px;max-width:46%}
 .demo-card .overlay-number{font-size:28px}
 .stage-toolbar{margin:14px 0;gap:12px}
 .text-button{font-size:12px;padding:10px 12px}
 .map-footnote{font-size:10px}
}
#stage-title:focus{outline:none}
.reality-card .stop text{font-size:14px}
/* Select and confirm at the same point. No separate advance control. */
.select-button{position:absolute;inset:0;z-index:3;width:100%;height:100%;padding:12px;border:0;border-radius:inherit;background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--chosen-text)}
.select-button:focus-visible{outline:3px solid var(--tone);outline-offset:-5px}
.confirm-prompt{display:inline-flex;align-items:center;justify-content:center;gap:12px;max-width:100%;padding:15px 20px;border-radius:6px;background:var(--chosen-bg);color:var(--chosen-text);box-shadow:0 3px 24px #0005;font:600 16px Arial,sans-serif;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .12s,transform .12s,visibility .12s;pointer-events:none}
.select-button[aria-pressed=true] .confirm-prompt{opacity:1;visibility:visible;transform:translateY(0)}
.select-button:disabled{opacity:1;cursor:default}
.demo-card.frame-1 .confirm-prompt{font-family:'Courier New',monospace}
.stage-toolbar{align-items:center;gap:20px}
.choice-history{min-width:0;flex:1;margin-right:auto}
.history-track{display:flex;align-items:flex-start;gap:24px;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;padding:6px 3px 10px}
.history-round{flex:none}
.history-round-label{display:block;margin-bottom:8px;font:10px 'Courier New',monospace;letter-spacing:.07em;color:var(--muted)}
.history-options{display:flex;gap:8px}
.history-option{margin:0;width:66px;flex:none}
.choice-mini{width:66px;height:55px;border-radius:5px;pointer-events:none;background:var(--map);overflow:hidden}
.history-option figcaption{display:flex;align-items:center;justify-content:center;gap:6px;font:12px Arial,sans-serif;color:var(--muted);margin-top:7px}
.history-selected .choice-mini{outline:2px solid var(--accent);outline-offset:1px}
.history-selected figcaption{color:var(--cream);font-weight:600}
.history-selected figcaption span{color:var(--accent)}
.choice-mini .stop text{display:none}
.choice-flight{position:fixed;z-index:50;pointer-events:none;transform-origin:0 0;overflow:hidden;border:0!important;border-radius:5px!important;background:var(--map);box-shadow:0 5px 20px #0003;will-change:transform,opacity}
.choice-flight .map-wrap{height:100%!important;width:100%;max-height:none;background:var(--map)}
.choice-flight .city{width:100%;height:100%;overflow:hidden}
.demo-grid{transition:opacity .2s}
body[data-transitioning=true] .demo-grid{opacity:0;transition:none}
body[data-transitioning=true] .selectable-card{pointer-events:none}
.plain-results{margin-top:30px}
.plain-results .card-header{justify-content:space-between}
.solution-status{font-size:13px;color:#293625}
.solution-distance{padding:18px;display:flex;flex-direction:column;gap:8px;border-top:1px solid #c4cbbd;background:#e9ebe3;color:#1c2919}
.solution-distance strong{font-size:30px;letter-spacing:-.04em;font-weight:500;font-variant-numeric:tabular-nums}
.solution-distance small{font-size:16px;letter-spacing:0}
.solution-distance>span{font-size:14px}
.plain-results~.choice-history{margin-top:24px}
.reality-card .depot rect{fill:#293625}
@media(max-width:760px){
 .stage-toolbar{gap:12px;min-height:44px}
 .history-track{gap:18px;padding-bottom:10px}
 .history-option,.choice-mini{width:58px}.choice-mini{height:49px}
 .history-options{gap:7px}
 .history-round-label{font-size:10px}
 .confirm-prompt{font-size:15px;padding:13px 16px}
 .solution-distance{padding:15px}.solution-distance strong{font-size:27px}
}
/* The result describes the visitor's choices before it opens the algorithms. */
.insight-hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px;padding:48px 0 30px}
.insight-intro h1{font-size:clamp(44px,5.3vw,76px);margin:18px 0 22px;letter-spacing:-.055em}
.insight-intro h1 em{color:var(--accent);letter-spacing:-.055em}
.insight-description{font-size:19px;max-width:43ch;line-height:1.55;color:var(--cream)}
.insight-facts{display:flex;gap:36px;flex-wrap:wrap;margin-top:26px}
.insight-facts>div{display:flex;flex-direction:column;gap:6px}
.insight-facts strong{font-size:30px;font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:-.035em}
.insight-facts strong>span{color:var(--muted);font-size:24px;margin-inline:6px}
.insight-facts div>span{font-size:13px;color:var(--muted)}
.insight-note{font-size:13px;color:var(--muted);line-height:1.6;margin-top:18px;max-width:65ch}
.choice-portrait{padding:32px 24px 24px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--cream) 3%,transparent)}
.choice-portrait>.eyebrow{font-size:11px;color:var(--muted);margin-bottom:28px}
.portrait-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.portrait-step{min-width:0;background:none;border:0;color:var(--cream);padding:0;display:flex;flex-direction:column;align-items:stretch;gap:10px;text-align:center;font-size:12px}
.portrait-step>span:first-child{font-family:'Courier New',monospace;color:var(--muted);white-space:nowrap}
.portrait-map{display:block;width:100%;aspect-ratio:6/5;border-radius:5px!important}
.portrait-map .city{width:100%;height:100%;overflow:hidden}
.portrait-map .map-coordinate,.portrait-map .north,.portrait-map .map-corner,.portrait-map .stop text{display:none}
.portrait-step b{font-size:18px;font-weight:500}
button.portrait-step[aria-pressed=true] .portrait-map{outline:2px solid var(--accent);outline-offset:2px}
button.portrait-step:hover .portrait-map{border-color:var(--accent)}
.portrait-plain{border-left:1px dashed var(--line);padding-left:8px}
.portrait-hint{font-size:12px;color:var(--muted);margin-top:22px}
.insight-nav{display:flex;align-items:center;gap:26px;padding:18px 0;border-block:1px solid var(--line);font-size:14px;flex-wrap:wrap}
.insight-nav a:hover{color:var(--accent)}
.insight-nav .text-button{margin-left:auto}
.insight-section{padding:38px 0;border-bottom:1px solid var(--line);scroll-margin-top:24px}
.section-heading{margin-bottom:24px}
.section-heading>.eyebrow{color:var(--accent);margin-bottom:12px;font-size:11px}
.section-heading h2{font-size:clamp(26px,2.7vw,36px);font-weight:500;letter-spacing:-.04em}
.section-heading>p:last-child{color:var(--muted);font-size:15px;max-width:70ch;margin-top:12px}
.pattern-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pattern-card{padding:22px;border:1px solid var(--line);border-radius:7px;background:color-mix(in srgb,var(--cream) 3%,transparent)}
.pattern-card h3{font:26px Georgia,serif;letter-spacing:-.025em}
.pattern-count{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:22px 0 12px}
.pattern-count strong{font-size:32px;white-space:nowrap;font-weight:500}
.pattern-count small{font-size:14px;font-weight:400;color:var(--muted)}
.pattern-dots{display:flex;gap:6px}
.pattern-dots i{width:12px;height:12px;border:1px solid var(--muted);border-radius:50%}
.pattern-dots i.filled{background:var(--accent);border-color:var(--accent)}
.pattern-card>p{font-size:13px;color:var(--muted)}
.cue-inspector{max-width:none;grid-template-columns:minmax(260px,420px) 1fr;gap:48px;margin-top:0}
#cue-context{margin-bottom:14px;color:var(--muted);font-size:11px}
.cue-inspector h3{font-size:23px;margin-bottom:14px}
.cue-switches{max-width:470px;gap:10px;margin-top:0}
.cue-switches label{font-size:15px;padding:12px 15px;min-height:48px}
.cue-switches input{width:17px;height:17px}
#plan-evidence .plain-results{margin-top:0}
.full-history{margin-top:28px}
.full-history h3{font-size:15px;font-weight:400;margin-bottom:14px;color:var(--muted)}
#workbench .bench-controls{margin-top:30px}
@media(max-width:1000px){.insight-hero{gap:30px}.choice-portrait{padding:24px 16px}.pattern-card{padding:18px}.pattern-count{gap:8px;flex-wrap:wrap}}
@media(max-width:760px){
 .insight-hero{grid-template-columns:1fr;gap:26px;padding:30px 0 24px}
 .insight-intro h1{font-size:clamp(40px,10vw,60px);margin:16px 0}
 .insight-description{font-size:17px;max-width:34ch}
 .insight-facts{gap:24px;margin-top:20px}.insight-facts strong{font-size:28px}.insight-facts div>span{font-size:12px}
 .insight-note{font-size:12px;margin-top:14px}
 .choice-portrait{padding:22px 14px 18px}.choice-portrait>.eyebrow{margin-bottom:20px}
 .portrait-steps{gap:7px}.portrait-step{font-size:10px;gap:8px}.portrait-step b{font-size:16px}.portrait-plain{padding-left:5px}.portrait-hint{margin-top:18px}
 .insight-nav{gap:16px 22px;font-size:13px;padding:14px 0}.insight-nav a{min-height:32px;display:inline-flex;align-items:center}
 .insight-nav .text-button{margin-left:0}
 .insight-section{padding:28px 0}.section-heading{margin-bottom:20px}.section-heading h2{font-size:28px}.section-heading>p:last-child{font-size:14px}
 .pattern-grid{grid-template-columns:1fr;gap:10px}.pattern-card{padding:18px}.pattern-card h3{font-size:25px}.pattern-count{margin:14px 0 8px}.pattern-count strong{font-size:28px}
 .cue-inspector{grid-template-columns:1fr;gap:24px}.cue-inspector .map-wrap{height:230px}
 .cue-switches label{font-size:14px;padding:10px 12px}
 .bench-controls .toggle{font-size:13px}
}

.cue-inspector .cue-help{font-size:14px;color:var(--muted);margin:0 0 16px}
.cue-switches label:has(input:disabled){opacity:.65;cursor:default}
.no-frame .demo-card{border:0;border-radius:0;box-shadow:none}
.no-frame .demo-card .card-header{border:0}
.no-frame .demo-card .label-circle{border:0;font:18px Arial,sans-serif}
.no-frame .card-spark{visibility:hidden}