*{box-sizing:border-box}:root{color-scheme:light dark;--bg:#f7f6fb;--surface:#fff;--text:#15161d;--muted:#565a68;--border:#d9d7e3;--accent:#0b7a75;--focus:#6a3cc9;--soft:#d8efec;--danger:#a01d56}@media(prefers-color-scheme:dark){:root{--bg:#0f1017;--surface:#181a24;--text:#eeeff4;--muted:#a9aebd;--border:#45495f;--accent:#8fe3da;--focus:#cdbbff;--soft:#12302e;--danger:#ffa8ca}}body{margin:0;background:var(--bg);color:var(--text);font:17px/1.55 Arial,Helvetica,sans-serif}.container{max-width:1160px;margin:auto;padding:42px 28px}h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400;line-height:1.12}h1{font-size:clamp(38px,6vw,70px);margin:15px 0 25px}h2{font-size:32px;margin:15px 0}h3{font-size:23px}p{color:var(--muted)}a{color:var(--accent)}.eyebrow,.badge{font:700 12px/1.5 Arial;letter-spacing:1.4px;color:var(--accent);text-transform:uppercase}.scope{border-left:3px solid var(--focus);padding-left:15px;max-width:820px}nav{display:flex;flex-wrap:wrap;gap:8px;border-block:1px solid var(--border);padding:18px 0;margin-top:30px}button{font:700 15px Arial;cursor:pointer;border:1px solid var(--accent);border-radius:6px;padding:12px 17px;background:var(--accent);color:var(--bg)}button.secondary,nav button{background:var(--surface);color:var(--accent)}button[aria-current=true]{background:var(--soft);border:2px solid var(--accent)}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible{outline:3px solid var(--focus);outline-offset:3px}label{display:block;color:var(--text);font-size:15px;margin:16px 0}select,input,textarea{display:block;width:100%;margin-top:6px;padding:11px;border:1px solid var(--border);border-radius:5px;background:var(--surface);color:var(--text);font:16px Arial}textarea{min-height:100px;font-family:'Courier New',monospace}.controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px}.actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.output{padding:20px;border-left:4px solid var(--accent);background:var(--surface);min-height:100px}.why{color:var(--text);max-width:900px}.question{font-family:Georgia,serif;font-size:23px;color:var(--focus)}pre{font:15px/1.5 'Courier New',monospace;white-space:pre-wrap;overflow-wrap:anywhere;margin:12px 0;max-width:100%}iframe{width:100%;height:205px;border:1px solid var(--border);background:white}.evidence{border-top:1px solid var(--border);margin-top:45px;padding-top:20px}footer{margin-top:45px;font-size:14px}#room{padding-block:18px;min-height:520px}.track{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}.slot{padding:16px;min-width:115px;border:1px solid var(--border);background:var(--surface);transition:background .35s}.slot.filled{background:var(--soft);border-color:var(--accent)}.notice{font-size:14px}.error{color:var(--danger)}@media(max-width:600px){.container{padding:24px 18px}.controls{grid-template-columns:1fr 1fr}button{padding:11px}.question{font-size:21px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Visual revision: literal requests, interpreters, records and state; readable holds. */
header h1{font-size:clamp(36px,5vw,58px);margin:12px 0 18px}header .scope{font-size:14px}nav{position:sticky;top:0;background:var(--bg);z-index:5}nav button{font-size:14px}.intro h2{font-size:34px}.question{font-size:21px}.room-detail,.raw{margin:18px 0;font-size:14px}.room-detail summary,.raw summary,.evidence>summary{cursor:pointer;color:var(--accent);font-weight:bold}.mechanism{border-top:2px solid var(--accent);border-bottom:1px solid var(--border);padding:20px 0;margin:22px 0 28px}.scene-meta{display:flex;justify-content:space-between;align-items:center}.scene-meta #phase-count{font:16px 'Courier New',monospace;color:var(--muted)}.mechanism h3{margin:16px 0;font-size:26px;min-height:32px}.flow{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding-top:72px;margin:15px 0 25px}.flow:has(.object:nth-child(2):last-of-type){grid-template-columns:repeat(2,minmax(0,1fr))}.object{position:relative;display:flex;align-items:center;flex-direction:column;gap:10px;min-height:155px;text-align:center}.object:not(:last-of-type):after{content:'→';position:absolute;right:-24px;top:23px;font-size:27px;color:var(--accent)}.object svg{width:74px;height:74px;fill:none;stroke:var(--text);stroke-width:2.3}.object strong{font-family:Georgia,serif;font-size:21px;font-weight:400}.object span{max-width:210px;font-size:14px;color:var(--muted)}.traveller{position:absolute;top:20px;left:12%;max-width:215px;width:max-content;transform:translateX(-50%);padding:8px 12px;border:1px solid var(--accent);border-radius:5px;color:var(--accent);background:var(--soft);font:700 14px 'Courier New',monospace;transition:left .8s ease,top .8s ease;box-shadow:0 5px 20px #0001;text-align:center}.scene-caption{color:var(--text);font-size:20px;line-height:1.4;min-height:56px;max-width:920px}.scene-controls{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.phase-dots{display:flex;gap:6px;margin-left:auto}.phase-dots button{border-radius:50%;padding:0;width:32px;height:32px;background:var(--surface);color:var(--muted);border-color:var(--border)}.phase-dots button[aria-current=true]{color:var(--accent);border-color:var(--accent);background:var(--soft)}.scene-status{font-size:18px;color:var(--accent);font-weight:bold;padding:14px 0 0;border-top:1px solid var(--border);min-height:45px}.direct-action{margin:8px 0 12px}.query-machine{background:var(--surface);border-left:4px solid var(--accent);padding:23px;margin:18px 0}.machine-label{display:block;font:700 12px Arial;letter-spacing:1px;color:var(--accent);margin:0 0 14px}.query-machine>code{font:20px/1.7 'Courier New',monospace;overflow-wrap:anywhere}.input-code{color:var(--danger);text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:8px}.fixed-slot{border:2px solid var(--accent);padding:3px 13px;color:var(--accent)}.value-lane{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-top:27px;color:var(--muted);font-size:14px}.value-lane code{padding:8px 14px;color:var(--focus);border:1px solid var(--focus);font-size:18px;max-width:100%;overflow-wrap:anywhere;transition:transform .8s}.mechanism[data-phase="1"] .value-lane code{transform:translateX(30px)}.database-rows{display:grid;gap:4px}.db-row{display:grid;grid-template-columns:40px 1fr 70px;gap:10px;padding:13px 20px;border-bottom:1px solid var(--border);font-size:16px;transition:background .5s}.db-row span{color:var(--muted)}.db-row.matched{background:var(--soft);border-left:4px solid var(--accent)}.db-row.matched span:last-child{color:var(--accent);font-weight:bold}.row-effect{display:flex;justify-content:space-around;gap:20px;align-items:center;padding:15px;border-block:1px solid var(--border);color:var(--accent)}.row-effect strong{font:32px Georgia}.row-effect.bad-effect{color:var(--danger);border-color:var(--danger)}.queue-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:15px 0 25px}.queue-slot{padding:22px 8px;border:2px solid var(--border);text-align:center;font:14px 'Courier New',monospace;transition:background .5s}.queue-slot.occupied{background:var(--soft);color:var(--accent);border-color:var(--accent)}.rule-machine{display:grid;grid-template-columns:220px 1fr;gap:32px;align-items:center;margin:25px 0}.incoming{display:flex;flex-direction:column;gap:20px;align-items:center}.incoming svg{height:74px;width:74px;fill:none;stroke:var(--text);stroke-width:2}.rule-machine ol{list-style:none;padding:0;margin:0}.rule-machine li{display:grid;grid-template-columns:35px 1fr 110px;gap:14px;padding:22px 16px;border-bottom:1px solid var(--border);transition:background .5s,color .5s}.rule-machine li span{font:13px 'Courier New',monospace}.rule-machine .first-match{background:var(--soft);border-left:4px solid var(--accent);color:var(--accent)}.rule-machine .skipped{opacity:.45}#reader{display:none}#reader.reader-active{display:block;margin:20px 0}.evidence{display:block;padding:20px 0}.evidence:not([open])>summary{padding:12px 0}#slots{display:none}.controls{margin-top:22px}.controls label{margin:8px 0}.room-detail p{max-width:900px}footer{font-size:13px}
@media(max-width:640px){nav{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding:12px 0}nav button{white-space:nowrap;flex-shrink:0}.flow{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:75px;column-gap:24px}.object{min-height:145px}.object strong{font-size:18px}.object span{font-size:13px;max-width:150px}.object:nth-child(2):after{content:'↓';right:50%;top:158px}.object:nth-child(3):after{content:'→'}.traveller{max-width:145px;font-size:12px;padding:6px 8px}.mechanism h3{font-size:24px;min-height:58px}.scene-caption{font-size:18px;min-height:78px}.scene-controls button{font-size:13px;padding:10px}.phase-dots{margin-left:0}.phase-dots button{padding:0;width:29px;height:29px}.query-machine{padding:16px}.query-machine>code{font-size:16px}.value-lane{gap:10px}.value-lane code{font-size:15px}.queue-slots{grid-template-columns:repeat(2,1fr)}.row-effect{flex-wrap:wrap;font-size:14px}.rule-machine{grid-template-columns:1fr;gap:15px}.incoming{flex-direction:row;font-size:17px}.incoming svg{height:48px;width:48px}.rule-machine li{grid-template-columns:28px 1fr;gap:10px;padding:18px 10px}.rule-machine li span:last-child{grid-column:2}.scene-meta .badge{max-width:230px}h1{font-size:36px}.scene-status{font-size:16px}}
.flow:has(.object:nth-child(2)):not(:has(.object:nth-child(3))){grid-template-columns:repeat(2,minmax(0,1fr))}.value-route{position:relative;min-height:120px;margin-top:25px;border-top:1px solid var(--border);padding-top:12px;font-size:13px;color:var(--muted)}.parameter-label{position:absolute;right:15px;top:12px}.sql-value-chip{position:absolute;top:50px;left:0;width:220px;max-width:80%;overflow-wrap:anywhere;border:1px solid var(--focus);color:var(--focus);padding:8px 12px;background:var(--bg);font:16px 'Courier New',monospace;transition:left .8s ease}.mechanism[data-phase="1"] .sql-value-chip,.mechanism[data-phase="2"] .sql-value-chip,.mechanism[data-phase="3"] .sql-value-chip{left:calc(100% - 220px)}@media(max-width:640px){.sql-value-chip{width:160px;font-size:14px}.mechanism[data-phase="1"] .sql-value-chip,.mechanism[data-phase="2"] .sql-value-chip,.mechanism[data-phase="3"] .sql-value-chip{left:calc(100% - 160px)}}
.object-action{font:700 12px Arial;padding:7px 10px;background:var(--surface);color:var(--accent);border-style:dashed;margin-top:3px}.object{min-height:185px}.notice-code{font-size:14px;margin:15px 0}.notice-code summary{color:var(--accent);cursor:pointer}.scene-caption{min-height:54px}.scene-controls{scroll-margin-top:90px}
@media(min-width:800px){#room:has(#sql-value){display:grid;grid-template-columns:minmax(0,1fr) 260px;column-gap:28px}#room:has(#sql-value)>.intro,#room:has(#sql-value)>.room-detail,#room:has(#sql-value)>#mechanism,#room:has(#sql-value)>.raw{grid-column:1/-1}#room:has(#sql-value)>label{grid-column:1;grid-row:3}#room:has(#sql-value)>.actions{grid-column:1;grid-row:4;margin:0 0 15px}#room:has(#sql-value)>.controls{grid-column:2;grid-row:3/5;margin-top:10px}}

.sql-value-chip{max-height:100px;overflow:auto}.value-route{min-height:145px}
.object:nth-last-child(2):after{display:none}.object-action{max-width:100%;white-space:normal;text-align:center;line-height:1.35}@media(max-width:640px){.object:nth-child(3){grid-column:2;grid-row:2}.object:nth-child(4){grid-column:1;grid-row:2}.object:nth-child(3):after{content:'←';right:auto;left:-24px}}