:root{color-scheme:dark;font-family:'Avenir Next',Avenir,system-ui,sans-serif;color:#f1f7ff;background:#07111f;font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:5px}button,input{font:inherit}button{color:inherit;background:transparent;border:1px solid #496077;cursor:pointer;min-height:42px;padding:8px 13px;border-radius:4px}button:hover{border-color:#63f5b0;background:#18362f}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #ffcb75;outline-offset:4px}[hidden]{display:none!important}.masthead{height:72px;padding:0 36px;display:flex;align-items:center;justify-content:space-between;font-size:13px;border-bottom:1px solid #23394e}.brand{text-decoration:none;font-size:19px;font-weight:650;letter-spacing:2px}.brand span{font-size:10px;letter-spacing:1.8px;margin-left:12px;color:#a9c0d7}.masthead>span{color:#a9c0d7}#experience{position:relative;height:min(900px,calc(100svh - 72px));min-height:700px;overflow:hidden;background:#07111f}#world{position:absolute;inset:0}canvas{width:100%;height:100%;display:block}.intro{position:absolute;left:36px;top:28px;width:425px;pointer-events:none}.eyebrow{font-size:10px;font-weight:650;letter-spacing:2px;color:#80cbff;margin:0 0 16px}h1{font-size:clamp(28px,3vw,45px);line-height:1.1;letter-spacing:-1.5px;font-weight:500;margin:0 0 16px}.intro>p:last-child{font-size:14px;color:#b9cee0;line-height:1.55;max-width:350px;margin:0}.context{position:absolute;left:36px;top:295px;width:255px;border-left:1px solid #385169;padding-left:17px;pointer-events:none}.context .eyebrow{color:#9eb5c9;margin-bottom:12px}.identity{font-size:13px;margin:0 0 16px}.identity span{display:block;color:#ffcb75;font-size:11px;margin-top:5px}#context-fields{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}#context-fields li{font-size:12px;color:#63f5b0;line-height:1.3}#context-fields li:before{content:'→';margin-right:9px}#context-fields .inherited{color:#ffcb75}#context-fields .excluded{color:#8495a7;text-decoration:line-through}#context-fields .evidence{color:#80cbff}#retained{font-size:12px;line-height:1.5;color:#ffcb75;margin:18px 0}.legend{display:flex;gap:10px;font-size:9px;flex-wrap:wrap}.legend span:first-child{color:#63f5b0}.legend span:nth-child(2){color:#ffcb75}.legend span:last-child{color:#80cbff}.spectrum{position:absolute;right:27px;top:160px;width:148px;display:grid;gap:11px}.spectrum button{display:flex;align-items:center;gap:10px;text-align:left;border-color:transparent;border-left:2px solid #334b63;padding:12px 9px;border-radius:0;min-height:55px}.spectrum button b{font-size:21px;font-weight:500}.spectrum button span{font-size:10px;line-height:1.4;color:#a9c0d7}.spectrum button[aria-pressed=true]{border-left-color:#63f5b0;background:#102a2a}.spectrum button[aria-pressed=true] b{color:#63f5b0}.spectrum label{font-size:10px;color:#a9c0d7;margin-top:9px}input[type=range]{accent-color:#63f5b0;width:100%;cursor:pointer;min-height:32px;margin:0}.scene-caption{position:absolute;bottom:122px;left:35%;pointer-events:none}.scene-caption p{margin:0 0 7px}.scene-caption #direction{font-size:10px;text-transform:uppercase;letter-spacing:2px;color:#ffcb75}.scene-caption #level-name{font-size:20px}.scene-caption span{color:#a9c0d7;font-size:10px}.action-line{position:absolute;bottom:64px;left:36px;right:36px;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:14px 0;border-top:1px solid #30465a;font-size:14px}.action-line small{font-size:8px;letter-spacing:1px;color:#a9c0d7}.transport{position:absolute;bottom:10px;left:36px;right:36px;display:flex;align-items:center;gap:13px}.transport input[type=range]{flex:1;min-width:30px}.transport button{white-space:nowrap;font-size:11px}.transport #play{min-width:90px}.transport #mode{font-size:10px;color:#a9c0d7;white-space:nowrap}.transport output{font:11px ui-monospace,monospace;white-space:nowrap}.repeat{font-size:11px;white-space:nowrap;display:flex;align-items:center;gap:5px;min-height:42px}input[type=checkbox]{accent-color:#63f5b0}.readthrough{padding:80px 7%;border-top:1px solid #30465a;display:grid;grid-template-columns:1fr 1.3fr;gap:10%;max-width:1600px;margin:auto}.readthrough h2{font-size:36px;line-height:1.1;letter-spacing:-1px;font-weight:500;max-width:370px}.readthrough p{font-size:14px;line-height:1.65;color:#b9cee0}.readthrough a{display:inline-block;font-size:13px;margin-top:14px}.readthrough ol{margin:0;padding:0;list-style:none}.readthrough li{padding:17px 0;border-bottom:1px solid #30465a}.readthrough li:first-child{padding-top:0}.readthrough li button{text-align:left;border:none;padding:0;font-size:16px}.readthrough li button span{font:11px ui-monospace,monospace;color:#80cbff;margin-right:18px}.readthrough li p{margin:5px 0 0 53px;font-size:12px}footer{padding:30px 36px;display:flex;justify-content:space-between;gap:24px;border-top:1px solid #30465a;font-size:11px;color:#a9c0d7}#inspection,#fallback{position:absolute;z-index:5;background:#102336;border:1px solid #52708a;padding:24px}#inspection{bottom:190px;left:36%;width:360px}#inspection h2{font-size:20px;font-weight:500;padding-right:35px}#inspection p,#fallback p{font-size:13px;line-height:1.55;color:#b9cee0}#close-inspect{position:absolute;right:10px;top:10px}#fallback{inset:25% 25%;height:230px}#code-detail{position:absolute;bottom:183px;left:36%;max-width:470px;background:#07111fed;border-left:2px solid #80cbff;padding:13px 17px;pointer-events:none}#code-detail .eyebrow{font-size:9px;margin-bottom:9px}#code-detail code{font-size:12px;color:#f1f7ff}#code-detail p:last-child{font-size:11px;line-height:1.5;color:#a9c0d7;margin:9px 0 0}.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}#experience:fullscreen{height:100vh;width:100vw;min-height:0}body[data-capture=true] .masthead,body[data-capture=true] .readthrough,body[data-capture=true] footer,body[data-capture=true] .transport{display:none}body[data-capture=true] #experience{height:100vh;min-height:0}body[data-capture=true] .intro{top:60px;left:60px;width:560px}body[data-capture=true] h1{font-size:54px}body[data-capture=true] .intro>p:last-child{font-size:19px;max-width:465px}body[data-capture=true] .context{top:410px;left:60px;width:300px}body[data-capture=true] .context li,body[data-capture=true] #retained{font-size:16px}body[data-capture=true] .identity{font-size:17px}body[data-capture=true] .identity span{font-size:14px}body[data-capture=true] .eyebrow{font-size:13px}body[data-capture=true] .spectrum{top:220px;right:55px;width:180px;pointer-events:none}body[data-capture=true] .spectrum label,body[data-capture=true] .spectrum input{display:none}body[data-capture=true] .spectrum button b{font-size:30px}body[data-capture=true] .spectrum button span{font-size:13px}body[data-capture=true] .scene-caption{bottom:140px}body[data-capture=true] .scene-caption span{display:none}body[data-capture=true] .scene-caption #level-name{font-size:28px}body[data-capture=true] .action-line{bottom:35px;left:60px;right:60px;font-size:22px}body[data-capture=true] .action-line small{font-size:11px}body[data-capture=true] #code-detail{bottom:220px}body[data-capture=true] #code-detail code{font-size:18px}body[data-capture=true] #code-detail p:last-child{font-size:15px}@media(min-width:1600px){body:not([data-capture=true]) .intro{width:460px}.context{top:315px}}@media(max-width:800px){.masthead{height:60px;padding:0 18px}.masthead>span,.brand span{display:none}.masthead>a:last-child{font-size:11px}#experience{height:1080px;min-height:0}.intro{left:20px;right:20px;top:24px;width:auto}.intro h1{font-size:33px;max-width:460px}.intro>p:last-child{max-width:460px;font-size:13px}#world{top:195px;bottom:310px}.spectrum{top:205px;right:15px;width:68px;gap:4px}.spectrum button{padding:8px 5px;min-height:40px}.spectrum button span,.spectrum label,.spectrum input{display:none}.spectrum button b{font-size:17px}.context{top:auto;bottom:145px;left:20px;width:calc(100% - 40px);padding-left:12px}.context .eyebrow{margin-bottom:8px}.identity{font-size:12px;margin-bottom:10px}.identity span{display:inline;margin-left:10px;font-size:10px}#context-fields{flex-direction:row;gap:8px 14px;flex-wrap:wrap}#context-fields li{font-size:10px}#retained{font-size:11px;margin:10px 0}.legend{display:none}.scene-caption{left:20px;bottom:340px}.scene-caption #level-name{font-size:17px}.scene-caption span{font-size:9px}.action-line{left:20px;right:20px;bottom:91px;padding:11px 0;display:block;font-size:12px}.action-line small{display:block;margin-top:6px;font-size:7px}.transport{left:20px;right:20px;bottom:12px;gap:8px;flex-wrap:wrap}.transport #mode{display:none}.transport #time{order:7;flex-basis:calc(100% - 110px)}.transport #clock{order:8}.transport button{font-size:10px;min-height:34px}.transport .repeat{margin-left:auto;font-size:10px;min-height:34px}.transport #play{min-width:80px}.readthrough{grid-template-columns:1fr;gap:35px;padding:48px 22px}.readthrough h2{font-size:29px}footer{padding:24px 22px;flex-direction:column}.readthrough li button{font-size:14px}.readthrough li p{margin-left:0}#inspection{left:20px;right:20px;bottom:370px;width:auto}#code-detail{left:20px;right:90px;bottom:403px;max-width:none;padding:10px}#code-detail code{font-size:10px;overflow-wrap:anywhere}#code-detail .eyebrow{font-size:7px}#code-detail p:last-child{font-size:9px}#fallback{inset:270px 20px auto;height:auto}#experience:fullscreen{height:100svh;overflow:auto;min-height:1080px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* Keep code and transport captions in separate reading zones. */
#code-detail{bottom:220px;left:auto;right:190px;max-width:410px}#code-source{font:11px/1.6 ui-monospace,SFMono-Regular,monospace;color:#80cbff;margin:0 0 12px;white-space:pre-wrap}body[data-capture=true] #code-detail{bottom:235px;right:240px}body[data-capture=true] #code-source{font-size:15px}@media(max-width:800px){#code-detail{left:20px;right:90px;bottom:410px;max-width:none}#code-source{font-size:9px;line-height:1.35;margin-bottom:8px}.transport button{min-height:42px}.transport{bottom:9px}.transport .repeat{min-height:42px}}
.node-guide{margin-top:30px}.node-guide summary{font-size:13px;cursor:pointer;padding:12px 0;color:#80cbff}.node-guide dt{margin-top:20px;font-size:13px}.node-guide dd{margin:8px 0;font-size:12px;line-height:1.6;color:#b9cee0}