:root{--bg:#0c1114;--panel:#11191c;--ink:#e9ece7;--muted:#9eacae;--accent:#ec986d;--line:#abc1c12c;--dark:#151919;color-scheme:dark}
html{scroll-behavior:auto;scroll-padding-top:86px}body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.6 'DM Sans',Arial,sans-serif;overflow-x:clip}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:400;letter-spacing:.13em}
.interface-header,.interface-footer{position:fixed;left:48px;right:48px;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:25px}.interface-header{top:0;height:104px}.interface-header:before{content:'';position:absolute;inset:0 -48px -18px;background:linear-gradient(var(--bg) 40%,#0c111400);z-index:-1;pointer-events:none}.interface-name{display:flex;align-items:center;gap:15px;min-height:44px;font:500 11px/1.2 'Space Grotesk',sans-serif;letter-spacing:.08em;white-space:nowrap}.brand-mark{position:relative;width:20px;height:21px;display:inline-block}.brand-mark i{display:block;position:absolute;width:13px;height:13px;border:1px solid #cddbd6;transform:rotate(45deg);left:3px;top:0}.brand-mark i+i{top:8px;border-color:var(--accent)}
.scene-status{display:flex;align-items:center;gap:12px;font-size:9px;position:absolute;left:50%;transform:translateX(-50%);color:var(--muted)}.status-light{width:4px;height:4px;background:var(--accent);display:block}
.motion-book{min-height:54px;padding:18px 23px;display:inline-flex;align-items:center;justify-content:space-between;gap:42px;border:1px solid var(--accent);border-radius:0;background:var(--accent);color:#11191c;font:500 13px/1 'Space Grotesk',Arial,sans-serif;transition:background .2s,border-color .2s}.motion-book>span{font-size:20px;line-height:.7;display:block;transition:transform .2s}.motion-book:hover{background:#f5b797;border-color:#f5b797}.motion-book:hover>span{transform:translate(2px,-2px)}.header-book{min-height:42px;padding:12px 16px;gap:30px;background:none;border-color:#b4c2bd40;color:var(--ink);font-size:11px}.header-book:hover{background:#ffffff09;border-color:#d8e2df}.header-book>span{font-size:17px}
.journey{position:relative}.pinned-stage{position:relative;isolation:isolate}.scene{position:relative;min-height:100svh}.scene-inner{width:min(1440px,calc(100% - 144px));min-height:100svh;margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center;padding:120px 0 110px;box-sizing:border-box}.scene-copy{min-width:0;position:relative;z-index:2}.scene-kicker{font-size:10px;line-height:1.5;color:var(--muted);margin:0 0 27px}.scene-title{font:500 clamp(48px,5.05vw,78px)/1.045 'Space Grotesk',Arial,sans-serif;letter-spacing:-.065em;margin:0;color:var(--ink);max-width:none}.text-row{display:block;overflow:hidden;padding-bottom:.09em;margin-bottom:-.09em}.text-fragment{display:block;will-change:auto}.scene-title em{font-style:normal;color:var(--accent)}.scene-summary{margin:28px 0 0;color:var(--muted);font-size:16px;line-height:1.65;max-width:360px}.scene-action{margin-top:32px}.scene-display{position:relative;width:100%;aspect-ratio:1;max-width:640px;justify-self:center;min-width:0}.interface-svg{width:100%;height:100%;overflow:visible;display:block}.interface-svg path,.interface-svg circle{vector-effect:non-scaling-stroke}.interface-svg path{fill:none;stroke-width:1}.interface-svg .grid-line{stroke:#8da4a5;opacity:.15}.guide-line{stroke:#9caeab;opacity:.4}.master-frame{fill:none;stroke:#b0c1bd;stroke-width:1;opacity:.42}.corner-marks{fill:none;stroke:var(--accent);stroke-width:1;opacity:.7}.portrait-image{filter:saturate(.45) contrast(1.04) brightness(.8)}.portrait-bars{stroke:#9eb5b8;opacity:.4}.portrait-scan{stroke:#e7f7f0!important;stroke-width:1!important;opacity:0}
.diagram-grid{opacity:.18}.project-frames .panel-fill{fill:#132025;fill-opacity:.75;stroke:none}.project-outline{stroke:#a9c1c1;opacity:.55}.work-brackets{stroke:#6b8b94;opacity:.5}.connection-track{stroke:#5b7b85;opacity:.65}.signal-path{stroke:var(--accent);opacity:.8}.centre-diamond{stroke:#b5c5be;opacity:.65}.core-dot,.flow-dot{fill:var(--accent);stroke:none}.flow-dot{opacity:0}.case-controls{position:absolute;inset:0}.case-card{position:absolute;left:8.75%;right:8.75%;height:23.75%;padding:21px 28px;text-align:left;background:transparent;border:0;color:var(--ink);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px;transition:background .25s}.case-card:before{content:'';position:absolute;top:22px;right:25px;width:4px;height:4px;background:var(--accent);opacity:.6}.case-card:hover{background:#d4eff208}.case-card:focus-visible{outline-offset:-5px}.case-first{top:17.5%}.case-second{top:58.75%}.project-index{font-size:8px;color:#9baeb1}.project-name{font:500 clamp(21px,2.1vw,31px)/1.1 'Space Grotesk',sans-serif;letter-spacing:-.045em}.project-action{font-size:11px;color:var(--muted);display:flex;width:100%;justify-content:space-between;align-items:center}.project-action i{font:400 19px/1 'Space Grotesk',sans-serif;color:var(--accent)}
.scene-work .scene-title,.scene-story .scene-title{font-size:clamp(44px,4.7vw,72px)}.text-action{background:none;border:0;border-bottom:1px solid #a1b5b23d;color:var(--ink);font:400 13px/1.4 'DM Sans',sans-serif;min-height:44px;padding:10px 0;display:inline-flex;align-items:center;gap:36px}.text-action span{font-size:19px;color:var(--accent)}.text-action:hover{border-color:var(--accent)}.career-axis .connection-track{opacity:.5}.career-trace{stroke:var(--accent)}.career-node circle{fill:var(--bg);stroke:#8da9ae;stroke-width:1}.career-node text{fill:#8fa7ac;stroke:none;font:400 10px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em}.career-node .node-tick{stroke:#526b72;opacity:.7}.career-cursor{fill:var(--accent);stroke:none}.career-reticle{stroke:var(--accent);opacity:.75}.career-symbol{stroke:#a2bab9;opacity:.65}.career-symbol .symbol-cross{stroke:var(--accent)}.career-notes{position:relative;margin-top:-77%;padding:0 12% 25%}.career-note{margin-bottom:20px}.career-number{font-size:9px;color:var(--accent);display:block;margin-bottom:20px}.career-note h3{font:500 32px/1.1 'Space Grotesk',Arial,sans-serif;letter-spacing:-.045em;margin:0 0 15px}.career-note p{font-size:14px;color:var(--muted);line-height:1.6;margin:0;max-width:310px}.career-note:last-child{margin-bottom:0}
.scene-contact{position:relative;overflow:hidden}.scene-contact .scene-inner{display:flex;justify-content:center;text-align:center;position:relative;z-index:1}.scene-contact .scene-copy{width:100%;max-width:1060px}.scene-contact .scene-title{font-size:clamp(48px,5.7vw,88px);letter-spacing:-.065em}.scene-contact .scene-summary{max-width:none;margin-top:30px}.scene-contact .scene-kicker{color:var(--accent);margin-bottom:29px}.scene-contact .scene-action{margin-top:35px}.contact-links{display:flex;align-items:center;justify-content:center;gap:30px;margin-top:24px;font-size:11px;color:var(--muted)}.contact-links a{min-height:40px;display:flex;align-items:center}.contact-links a:hover{color:var(--ink)}.contact-svg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(100%,1440px);height:auto;pointer-events:none}.contact-svg path{fill:none;stroke-width:1;vector-effect:non-scaling-stroke}.contact-frame{stroke:#8da9ac;opacity:.36}.contact-guides{opacity:.35}.contact-signal{stroke:var(--accent);opacity:.7}
.interface-footer{bottom:max(20px,env(safe-area-inset-bottom));font-size:9px;color:var(--muted)}.interface-footer:before{content:'';position:absolute;inset:-24px -48px -25px;background:linear-gradient(#0c111400,var(--bg) 70%);z-index:-1;pointer-events:none}.scroll-instruction{display:flex;align-items:center;gap:12px;font-size:8px}.scroll-instruction>i{display:block;width:7px;height:12px;border:1px solid #829a9f;position:relative}.scroll-instruction>i:after{content:'';width:1px;height:3px;background:var(--accent);position:absolute;top:3px;left:2px}.chapter-nav{display:flex;gap:14px;position:absolute;left:50%;transform:translateX(-50%)}.chapter-nav a{display:flex;align-items:center;gap:8px;min-height:44px;padding-block:10px;font-family:ui-monospace,SFMono-Regular,monospace;font-size:8px;color:#82989e}.nav-track{display:block;width:43px;height:1px;background:#667b824d;position:relative}.nav-track i{height:100%;width:100%;transform:scaleX(0);transform-origin:left;background:var(--accent);position:absolute;left:0}.chapter-nav a[aria-current]{color:var(--ink)}.chapter-nav a[aria-current] .nav-track{background:#c1d0cd8c}.motion-control{background:none;border:0;min-height:44px;font-size:8px;color:var(--muted);display:flex;align-items:center;gap:10px;padding:10px 0 10px 12px}.motion-symbol{font-size:11px;letter-spacing:-.12em;color:var(--accent)}.motion-control:hover{color:var(--ink)}.motion-control:disabled{cursor:default;opacity:.7}.stage-rules{display:none}
/* Enhanced layout is opt-in. The source remains a conventional page without JS. */
.motion-ready{scroll-padding-top:0}.motion-ready .journey{height:600svh}.motion-ready .pinned-stage{position:sticky;top:0;height:100svh;overflow:hidden}.motion-ready .scene{position:absolute;inset:0;height:100%;min-height:0;will-change:opacity}.motion-ready .scene-inner{height:100%;min-height:0}.motion-ready .scene:not(.scene-intro){visibility:hidden}.motion-ready .scene-display{max-height:min(76svh,720px)}.motion-ready .career-notes{position:absolute;inset:29% 12% auto;margin:0;padding:0}.motion-ready .career-note{position:absolute;top:0;left:0;width:100%;margin:0}.motion-ready .career-note:not(:first-child){visibility:hidden}.motion-ready .stage-rules{display:block;position:absolute;inset:100px 24px 90px;pointer-events:none;z-index:0}.stage-rules i{position:absolute;width:14px;height:14px;border:solid #829a9a35;border-width:1px 0 0 1px}.stage-rules i:nth-child(2){right:0;transform:rotate(90deg)}.stage-rules i:nth-child(3){bottom:0;right:0;transform:rotate(180deg)}.stage-rules i:nth-child(4){bottom:0;transform:rotate(270deg)}
/* Shared reading and sandbox panels keep the approved content available. */
.detail-window{background:#11191c;border-color:#93a9ab4d;border-radius:3px}.detail-header>button{border-radius:0;min-height:44px;min-width:44px}.detail-pane .proof-status{background:#30251d;border-color:#ec986d44;color:#d8bead}#detail-tabs button{border-radius:0;min-height:44px}#detail-tabs button[aria-pressed=true]{background:#ec986d16;color:#f0bf9f;border-color:#ec986d35}.detail-pane .system{border-radius:0}.detail-pane .demo-shell{background:#e7ebe8;color:#253135}.detail-pane .demo-shell .mono{color:#50646a}.detail-pane .sample-tabs button{border-radius:0}.detail-pane .sample-tabs button.active{background:#26383e}.detail-pane .pipeline li.current{color:#182024}.detail-pane .demo-output dl>div{grid-template-columns:80px minmax(0,1fr)}#booking-dialog{background:#11191c;border-color:#8b9fa14d;border-radius:3px}.detail-pane pre{min-width:0;max-width:100%;overflow-x:auto}
@media(min-width:1600px){.scene-inner{gap:100px}.scene-display{max-width:660px}.scene-title{font-size:86px}.scene-work .scene-title,.scene-story .scene-title{font-size:77px}}
@media(max-width:1100px){.interface-header,.interface-footer{left:32px;right:32px}.scene-inner{width:calc(100% - 96px);gap:35px}.scene-title{font-size:5.05vw}.scene-work .scene-title,.scene-story .scene-title{font-size:4.8vw}.scene-summary{font-size:15px}.case-card{padding:16px 22px;gap:8px}.project-name{font-size:24px}.career-note h3{font-size:29px}.career-note p{font-size:13px}.career-number{margin-bottom:14px}.scene-status{font-size:8px}}
@media(max-width:900px){
 .interface-header,.interface-footer{left:26px;right:26px}.interface-header{height:82px}.interface-name{font-size:10px;gap:12px}.scene-status{display:none}.header-book{padding:11px 13px;gap:23px;font-size:10px;min-height:40px}.scene-inner{width:calc(100% - 80px);display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:24px;padding:105px 0 95px;min-height:100svh}.scene-copy{width:100%;max-width:560px;margin-inline:auto}.scene-title{font-size:clamp(30px,7.6vw,57px);line-height:1.045;letter-spacing:-.06em}.scene-intro .row-2,.scene-intro .row-3{display:inline-block;vertical-align:top}.scene-intro .row-2{margin-right:.2em}.scene-kicker{font-size:9px;margin-bottom:20px}.scene-summary{font-size:14px;margin-top:21px;max-width:none}.scene-action{margin-top:24px}.motion-book{min-height:48px;padding:15px 20px;font-size:12px;gap:38px}.header-book{min-height:40px;padding:11px 13px;font-size:10px;gap:23px}.scene-display{width:min(100%,390px);margin:0 auto;aspect-ratio:1;flex-shrink:0}.portrait-display{width:min(100%,360px,36svh)}.scene-work .scene-title,.scene-story .scene-title{font-size:clamp(31px,6.8vw,51px)}.scene-work .scene-summary{margin-top:17px}.projects-display{width:min(100%,410px)}.project-name{font-size:25px}.case-card{padding:14px 24px;gap:8px}.project-index{font-size:7px}.project-action{font-size:10px}.case-card:before{top:17px;right:21px}.scene-story .scene-action{margin-top:20px}.story-display{width:min(100%,390px)}.career-note h3{font-size:30px}.career-note p{font-size:14px;max-width:275px}.career-number{font-size:8px;margin-bottom:16px}.scene-contact .scene-inner{padding-block:130px 110px}.scene-contact .scene-copy{max-width:650px}.scene-contact .scene-title{font-size:clamp(34px,7.4vw,62px)}.scene-contact .scene-summary{font-size:14px;margin-top:25px}.scene-contact .scene-kicker{margin-bottom:27px}.contact-svg{width:140%;max-width:none}.interface-footer{bottom:max(15px,env(safe-area-inset-bottom))}.scroll-instruction{font-size:7px;gap:9px}.chapter-nav{gap:11px}.nav-track{width:27px}.nav-number{display:none}.motion-control{font-size:7px;gap:8px}.motion-ready .stage-rules{inset:88px 15px 75px}.motion-ready .scene-display{max-height:none}
}
@media(max-width:500px){
 .interface-header,.interface-footer{left:20px;right:20px}.interface-name{font-size:9px;letter-spacing:.02em;gap:9px}.brand-mark{transform:scale(.8);width:18px}.header-book{gap:18px;font-size:10px;padding-inline:12px}.scene-inner{width:calc(100% - 44px);gap:16px;padding:96px 0 80px}.scene-kicker{font-size:8px;margin-bottom:16px}.scene-title{font-size:clamp(28px,8.3vw,42px)}.scene-summary{font-size:13px;line-height:1.55;margin-top:18px}.scene-action{margin-top:20px}.motion-book{min-height:46px;padding:14px 19px;gap:34px;font-size:11px}.header-book{min-height:40px;padding:12px;font-size:10px;gap:18px}.portrait-display{width:min(100%,280px,35svh)}.scene-work .scene-title,.scene-story .scene-title{font-size:clamp(29px,8.1vw,39px)}.scene-work .scene-summary{font-size:13px;margin-top:15px}.projects-display,.story-display{width:min(100%,340px)}.project-name{font-size:22px}.case-card{padding:11px 18px;gap:5px}.project-index{font-size:6px;letter-spacing:.12em}.project-action{font-size:9px}.project-action i{font-size:16px}.case-card:before{top:14px;right:15px;width:3px;height:3px}.career-note h3{font-size:27px;margin-bottom:12px}.career-note p{font-size:12px}.career-number{font-size:7px;margin-bottom:14px}.text-action{min-height:40px;font-size:11px;gap:26px}.scene-story .scene-action{margin-top:16px}.scene-contact .scene-inner{width:calc(100% - 44px)}.scene-contact .scene-title{font-size:clamp(30px,8.1vw,40px)}.scene-contact .scene-summary{font-size:13px;max-width:270px;margin-inline:auto}.scene-contact .scene-action{margin-top:28px}.scene-contact .scene-kicker{font-size:7px}.contact-links{font-size:10px;margin-top:20px}.contact-svg{width:190%}.scroll-instruction{max-width:74px;font-size:6px;letter-spacing:.08em;gap:8px;line-height:1.6}.scroll-instruction>i{flex-shrink:0}.chapter-nav{gap:9px}.nav-track{width:20px}.motion-control{font-size:6px;gap:7px;letter-spacing:.07em}.motion-symbol{font-size:10px}.interface-footer{bottom:max(12px,env(safe-area-inset-bottom))}.motion-ready .stage-rules{inset:86px 11px 68px}
}
@media(max-width:360px){.interface-header,.interface-footer{left:17px;right:17px}.interface-name{font-size:8px;gap:7px}.header-book{font-size:9px;gap:12px}.scene-inner{width:calc(100% - 36px);padding-block:91px 76px;gap:12px}.scene-title{font-size:28px}.scene-kicker{font-size:7px}.scene-summary{font-size:12px;margin-top:16px}.scene-action{margin-top:18px}.scene-work .scene-title,.scene-story .scene-title{font-size:29px}.case-card{padding:9px 16px;gap:3px}.project-name{font-size:19px}.project-action{font-size:8px}.project-index{font-size:6px}.career-note h3{font-size:24px}.career-note p{font-size:11px}.career-number{margin-bottom:10px}.scene-contact .scene-title{font-size:30px}.chapter-nav{gap:7px}.nav-track{width:18px}.scroll-instruction{max-width:66px;font-size:6px}.motion-control{font-size:6px}.motion-control-label{max-width:45px;line-height:1.5}.scene-contact .scene-inner{width:calc(100% - 32px)}}
/* Calm mode is also the no-library and no-JS layout. */
html:not(.motion-ready) .scene{border-bottom:1px solid #829a9a18}html:not(.motion-ready) .scene-story .scene-inner{align-items:start}html:not(.motion-ready) .story-display{aspect-ratio:auto;padding-top:4%}html:not(.motion-ready) .career-svg{display:none}html:not(.motion-ready) .career-notes{margin:0;padding:0}html:not(.motion-ready) .career-note{padding:22px;border-top:1px solid var(--line);margin:0}html:not(.motion-ready) .career-number{margin-bottom:10px}html:not(.motion-ready) .career-note h3{font-size:28px}html:not(.motion-ready) .career-note p{font-size:14px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

.scroll-instruction{border:0;background:none;color:inherit;text-align:left;padding:0;min-height:44px}.scene-title:focus{outline:none}

.scene-title .text-row,.scene-title .text-fragment{color:var(--ink)}.scene-title em{color:var(--accent)}
html:has(dialog[open]){overflow-y:hidden}
