/* finesse · V5 register=case-first · A=soft-graphite+slate+muted-lilac · B=system-sans · C=case-visual+progressive-details · D=quiet-state+data-bars · E=precision-workbench · SOUL=7 SPECTACLE=4 DENSITY=5 */
:root{--page:#141a20;--surface:#1b222a;--panel:#222b34;--ink:#dce4eb;--muted:#a1adb8;--edge:#33404c;--map-edge:#52616e;--accent:#8db2cb;--active-bg:#2a3c4b;--commerce:#8db2cb;--ai:#a0bba8;--enterprise:#c3b298;--button-bg:#35556b;--button-text:#e3ebf2;--brand-bg:#2a3c4b;--brand-text:#8db2cb;--shadow:rgba(0,0,0,.16);--overlay:rgba(5,10,14,.72);--grid:rgba(161,173,184,.06);--font:-apple-system,BlinkMacSystemFont,"Microsoft YaHei","Segoe UI",sans-serif;color-scheme:dark}
*{box-sizing:border-box}html,body{overflow-x:clip}html{scroll-behavior:smooth}body{margin:0;background:var(--page);font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:4px}h1,h2,h3,p{margin:0}button:active{opacity:.8}.site-shell{max-width:1480px;margin:auto;padding:0 44px}.site-header{height:94px;display:flex;align-items:center;gap:22px;border-bottom:1px solid var(--edge)}.brand{display:flex;align-items:center;font-size:24px;font-weight:720;letter-spacing:-1px;min-height:44px}.brand-dot{color:var(--accent)}.brand-icon{width:32px;height:32px;background:var(--ink);color:var(--surface);display:grid;place-items:center;border-radius:10px;font-size:18px;letter-spacing:-1px;margin-right:10px}.header-title{border-left:1px solid var(--map-edge);padding-left:22px;color:var(--muted);font-size:12px}.header-link{margin-left:auto;display:flex;align-items:center;gap:20px;font-size:12px;min-height:44px;white-space:nowrap}.header-link span{color:var(--accent);font-size:19px}
.intro{padding:46px 0 34px;display:flex;align-items:center;justify-content:space-between;gap:24px}.eyebrow{font-size:10px;letter-spacing:2.3px;color:var(--muted);margin-bottom:16px}.intro h1{font-size:35px;font-weight:580;letter-spacing:-1.3px;line-height:1.35;overflow-wrap:anywhere;min-width:0}.intro-copy{font-size:13px;color:var(--muted);margin-top:15px;line-height:1.9}.intro-count{display:flex;align-items:center;gap:15px;padding-right:9px}.intro-count strong{font-size:46px;font-weight:400;letter-spacing:-2px}.intro-count>span{font-size:11px;color:var(--muted);border-left:1px solid var(--map-edge);padding-left:15px;line-height:2}
.workspace{border:1px solid var(--edge);border-radius:20px;overflow:clip;background:var(--surface);box-shadow:0 18px 50px var(--shadow);scroll-margin-top:24px}.workspace-header{height:58px;border-bottom:1px solid var(--edge);display:flex;justify-content:space-between;align-items:center;padding:0 24px;background:var(--panel);gap:15px}.workspace-label{display:flex;align-items:center;gap:11px;font-size:12px;font-weight:550}.tiny-symbol{font-size:23px;color:var(--accent)}.view-label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:10px}.status-dot{width:6px;height:6px;border-radius:100%;background:var(--ai)}.board{display:grid;grid-template-columns:minmax(0,1fr) 322px}.map-column{min-width:0;padding:20px 20px 16px;background-image:radial-gradient(var(--grid) .75px,transparent .75px);background-size:18px 18px}.map-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px}.filters{display:flex;gap:3px;flex-wrap:wrap;border:1px solid var(--edge);padding:4px;border-radius:10px;background:var(--panel)}.filters button{border:0;background:transparent;border-radius:7px;font-size:10px;min-height:34px;padding:0 12px;white-space:nowrap;color:var(--muted);transition:background .2s,color .2s}.filters button[aria-pressed=true]{background:var(--active-bg);color:var(--accent);box-shadow:0 1px 3px var(--shadow)}.map-count{font-size:10px;color:var(--muted);white-space:nowrap;padding-right:3px}.map-viewport{padding:16px 0 10px}.graph-plane{position:relative;width:100%;aspect-ratio:840/620;min-height:480px}.connections{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;color:var(--map-edge)}.connections path{fill:none;stroke:var(--map-edge);stroke-width:1;vector-effect:non-scaling-stroke;transition:stroke .3s,stroke-width .3s}.connections path.active{stroke:var(--accent);stroke-width:1.7;stroke-dasharray:5 4;animation:connection-flow 4s linear infinite}
.caps-node{position:absolute;left:4%;top:calc(50% + 22px);width:13%;transform:translateY(-50%);display:flex;align-items:center;flex-direction:column;gap:8px}.caps-mark{width:57px;height:57px;border-radius:50%;background:var(--panel);border:1px solid var(--map-edge);color:var(--accent);display:grid;place-items:center;font-size:27px;font-weight:600;box-shadow:0 0 0 8px var(--surface),0 0 0 9px var(--edge);z-index:1}.caps-node strong{font-weight:620;font-size:15px}.caps-node>span:last-child{font-size:8px;white-space:nowrap;color:var(--muted)}.caps-orbit{position:absolute;width:106px;height:106px;border:1px dashed var(--edge);border-radius:100%;top:-24px;pointer-events:none}.domain-node{position:absolute;left:28%;width:16%;padding:12px 8px;border:1px solid var(--edge);border-radius:11px;background:var(--panel);display:grid;grid-template-columns:24px minmax(0,1fr);gap:6px 3px;align-items:center;transform:translateY(-50%);transition:opacity .25s}.domain-node.commerce{top:30%}.domain-node.ai{top:70.323%}.domain-node.enterprise{top:90.323%}.domain-icon{grid-row:1/3;font-size:19px;color:var(--accent)}.domain-node.ai .domain-icon{color:var(--ai)}.domain-node.enterprise .domain-icon{color:var(--enterprise)}.domain-node strong{font-size:10px;font-weight:580;white-space:nowrap}.domain-node small{font-size:8px;color:var(--muted)}.project-node{position:absolute;left:65%;width:32%;transform:translateY(-50%);min-height:49px;padding:9px 12px;border:1px solid var(--edge);background:var(--panel);border-radius:10px;display:flex;align-items:center;gap:9px;text-align:left;font-size:10px;line-height:1.7;box-shadow:0 3px 8px var(--shadow);transition:background .25s,border-color .25s,opacity .25s,box-shadow .25s}.node-dot{width:5px;height:5px;border-radius:100%;background:var(--commerce);flex-shrink:0}.project-node.ai .node-dot{background:var(--ai)}.project-node.enterprise .node-dot{background:var(--enterprise)}.project-node[aria-pressed=true]{border-color:var(--accent);background:var(--active-bg);box-shadow:0 0 0 3px var(--surface),0 0 0 4px var(--map-edge)}.dimmed{opacity:.24}.project-node:disabled{cursor:default}.map-footer{display:flex;justify-content:space-between;align-items:center;gap:14px;font-size:9px;color:var(--muted);padding:14px 4px 0;border-top:1px solid var(--edge)}.map-footer p{display:flex;align-items:center;gap:8px}.legend-line{width:20px;height:1px;background:var(--map-edge)}.mobile-projects{display:none}
.detail-panel{background:var(--panel);border-left:1px solid var(--edge);padding:24px;display:flex;flex-direction:column;min-width:0}.detail-top{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:var(--muted);padding-bottom:27px}.detail-index{font-size:9px;letter-spacing:1px}.category-pill{align-self:start;border:1px solid var(--edge);border-radius:5px;padding:4px 7px;font-size:9px;color:var(--accent);background:var(--surface);margin-bottom:13px}.detail-panel h2{font-size:23px;line-height:1.45;font-weight:580;letter-spacing:-.8px;overflow-wrap:anywhere}.detail-tagline{font-size:11px;color:var(--muted);line-height:1.9;margin-top:14px}.detail-divider{height:1px;background:var(--edge);margin:23px 0}.detail-panel h3{font-size:10px;font-weight:550;margin-bottom:12px}.highlight-list{list-style:none;padding:0;margin:0 0 23px;display:grid;gap:10px}.highlight-list li{font-size:10px;color:var(--muted);line-height:1.8;display:flex;gap:8px}.highlight-list li::before{content:'↗';color:var(--accent)}.stack-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:23px}.stack-tags>span{font-size:9px;border:1px solid var(--edge);background:var(--surface);padding:5px 7px;border-radius:5px}.detail-role{font-size:10px;color:var(--muted);line-height:1.85;margin-bottom:25px}.case-button{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;background:var(--ink);color:var(--panel);border:0;border-radius:9px;padding:13px 16px;min-height:44px;font-size:11px;white-space:nowrap;transition:transform .2s}.case-button span{font-size:17px}.panel-note{font-size:8px;text-align:center;color:var(--muted);margin-top:11px}.bottom-note{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:24px 5px 34px;color:var(--muted);font-size:10px;line-height:1.9}.bottom-note>span{font-size:9px;white-space:nowrap}footer{border-top:1px solid var(--edge);padding:22px 0 25px;display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:9px}footer>span:first-child{font-size:16px;font-weight:650;color:var(--ink)}
dialog{border:1px solid var(--edge);background:var(--panel);color:var(--ink);border-radius:20px;width:min(640px,calc(100% - 32px));max-height:85dvh;padding:28px;box-shadow:0 20px 70px var(--overlay)}dialog::backdrop{background:var(--overlay)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted);margin-bottom:20px}.dialog-heading button{border:1px solid var(--edge);border-radius:50%;background:var(--surface);width:44px;height:44px;font-size:24px}dialog h2{font-size:26px;line-height:1.45;font-weight:600}dialog section{margin-top:27px}dialog h3{font-size:13px;margin-bottom:10px}dialog section p{font-size:13px;line-height:1.95;color:var(--muted)}.dialog-note{border-top:1px solid var(--edge);padding-top:18px;margin-top:26px;font-size:10px;line-height:1.9;color:var(--muted)}body:has(dialog[open]){overflow-y:hidden}.skip{position:fixed;top:-100px;left:20px;background:var(--panel);padding:14px;z-index:100}.skip:focus{top:10px}.no-js-note{padding:20px;text-align:center}
@keyframes connection-flow{to{stroke-dashoffset:-36}}
@media(hover:hover) and (pointer:fine){.project-node:not(:disabled):hover{border-color:var(--accent);background:var(--active-bg)}.case-button:hover{transform:translateY(-2px)}.header-link:hover{color:var(--accent)}}
@media(max-width:1180px){.site-shell{padding:0 28px}.board{grid-template-columns:minmax(0,1fr) 285px}.detail-panel{padding:22px}.map-column{padding:18px 14px 16px}.filters button{padding:0 8px;font-size:9px}.map-count{display:none}.domain-node{grid-template-columns:minmax(0,1fr);padding:10px}.domain-icon{display:none}.graph-plane{min-height:480px}.project-node{font-size:9px;padding:8px}.caps-node>span:last-child{font-size:7px}}
@media(max-width:950px){.board{grid-template-columns:minmax(0,1fr)}.detail-panel{border-left:0;border-top:1px solid var(--edge);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 28px;padding:28px}.detail-top,.category-pill,.detail-panel h2,.detail-tagline,.detail-divider,.case-button,.panel-note{grid-column:1/-1}.detail-top{padding-bottom:10px}.detail-divider{margin:15px 0}.detail-panel h3,.highlight-list,.stack-tags,.detail-role{grid-column:1/-1}.case-button{margin-top:10px}.graph-plane{min-height:0}.project-node{font-size:11px;padding:9px 12px}.domain-node{grid-template-columns:24px minmax(0,1fr);padding:12px 8px}.domain-icon{display:block}.map-toolbar{justify-content:start}.filters button{font-size:11px;min-height:40px;padding:0 12px}}
@media(max-width:640px){.site-shell{padding:0 16px}.site-header{height:76px;gap:12px}.header-title{display:none}.header-link{font-size:11px;gap:12px}.brand{font-size:22px}.intro{padding:32px 3px 27px;align-items:start}.intro h1{font-size:27px;line-height:1.45;letter-spacing:-1px}.intro-copy{font-size:12px;margin-top:13px}.intro-count{display:none}.eyebrow{font-size:9px;margin-bottom:14px}.workspace{border-radius:15px}.workspace-header{height:52px;padding:0 15px}.workspace-label{font-size:10px}.view-label{font-size:8px}.map-column{padding:15px 12px}.filters{gap:2px;width:100%;border:0;padding:0;background:transparent}.filters button{padding:0 9px;font-size:9px;min-height:44px}.map-viewport,.map-footer{display:none}.mobile-projects{display:flex;gap:10px;overflow-x:auto;padding:18px 2px 10px;scroll-snap-type:x proximity}.mobile-project{min-width:188px;max-width:210px;min-height:83px;scroll-snap-align:start;border:1px solid var(--edge);border-radius:12px;background:var(--panel);padding:15px;text-align:left;font-size:12px;line-height:1.8}.mobile-project[aria-pressed=true]{border-color:var(--accent);background:var(--active-bg)}.mobile-project[hidden]{display:none}.detail-panel{display:flex;padding:23px 20px}.detail-panel h2{font-size:24px}.detail-tagline{font-size:12px}.detail-panel h3{font-size:11px}.highlight-list li,.detail-role{font-size:11px}.stack-tags>span{font-size:10px}.category-pill{margin:12px 0}.detail-top{padding-bottom:5px}.case-button{font-size:12px}.bottom-note{padding:21px 4px 25px;display:block;font-size:10px}.bottom-note>span{display:block;margin-top:12px}dialog{padding:23px}dialog h2{font-size:23px}.caps-orbit{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.brand-icon{background:var(--brand-bg);color:var(--brand-text)}.case-button{background:var(--button-bg);color:var(--button-text)}

/* content expansion: reading surfaces keep the existing graphite system */
.case-link{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:10px 14px;border:1px solid var(--edge);border-radius:9px;background:var(--surface);color:var(--accent);font-size:11px;line-height:1.5}.case-link span{font-size:17px}.case-link:hover{border-color:var(--accent);background:var(--active-bg)}.detail-panel .case-link{margin-top:10px}.dialog-case-link{margin-top:24px}
.portfolio-extra{display:grid;gap:16px;margin:16px 0}.extra-section{border:1px solid var(--edge);border-radius:18px;background:var(--surface);padding:30px}.section-heading{max-width:760px}.section-heading h2{font-size:26px;line-height:1.45;font-weight:600;letter-spacing:-.6px}.section-heading>p:last-child{margin-top:12px;color:var(--muted);font-size:14px;line-height:1.9}.featured-grid,.method-grid,.boundary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}.featured-case{position:relative;display:grid;gap:9px;min-height:184px;padding:20px;border:1px solid var(--edge);border-radius:13px;background:var(--panel);color:var(--muted);font-size:12px;line-height:1.8;transition:border-color .2s,background .2s,transform .2s}.featured-case:hover{border-color:var(--accent);background:var(--active-bg);transform:translateY(-2px)}.featured-case strong{color:var(--ink);font-size:16px;font-weight:600;line-height:1.5;padding-right:24px}.featured-case small{color:var(--accent);font-size:11px}.featured-index{font-size:10px;letter-spacing:1px;color:var(--accent)}.featured-arrow{position:absolute;top:18px;right:20px;color:var(--accent);font-size:20px}.method-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.method-card,.boundary-card{padding:20px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.method-card>span{color:var(--accent);font-size:10px;letter-spacing:1px}.method-card h3,.boundary-card h3{margin-top:13px;font-size:16px;font-weight:600}.method-card p,.boundary-card p{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.9}.boundary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.boundary-card p+p{margin-top:16px}
.case-page{min-height:100vh}.case-shell{max-width:1480px;margin:auto;padding:0 44px}.case-header{height:94px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--edge)}.case-back-link{display:inline-flex;align-items:center;gap:14px;min-height:44px;color:var(--accent);font-size:12px}.case-back-link span{font-size:18px}.case-main{padding:34px 0 48px}.case-breadcrumb{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;line-height:1.8}.case-breadcrumb a{color:var(--accent)}.case-hero{padding:40px 0 48px;max-width:940px}.case-hero h1{margin-top:10px;font-size:42px;line-height:1.3;font-weight:600;letter-spacing:-1.3px;overflow-wrap:anywhere}.case-lede{max-width:780px;margin-top:18px;color:var(--muted);font-size:18px;line-height:1.9}.case-meta-row{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:22px;color:var(--muted);font-size:12px}.case-layout{display:grid;grid-template-columns:minmax(190px,220px) minmax(0,900px);gap:50px;align-items:start}.case-toc{position:sticky;top:22px;display:grid;gap:2px;padding:12px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.case-toc p{padding:8px 10px 12px;color:var(--muted);font-size:11px;letter-spacing:.4px}.case-toc a{display:flex;align-items:center;min-height:44px;padding:8px 10px;border-radius:7px;color:var(--muted);font-size:12px;line-height:1.5}.case-toc a:hover{background:var(--active-bg);color:var(--accent)}.case-reading{min-width:0;max-width:900px}.case-section{padding:0 0 54px;scroll-margin-top:24px}.case-section+.case-section{padding-top:8px}.section-kicker{color:var(--accent);font-size:10px;letter-spacing:2px}.case-section h2{margin-top:9px;font-size:28px;line-height:1.45;font-weight:600;letter-spacing:-.6px}.case-section h3{font-size:16px;line-height:1.5;font-weight:600}.case-section p,.case-section li{font-size:14px;line-height:1.95}.case-section>p:not(.section-note):not(.history-note):not(.media-note):not(.demo-description){margin-top:18px}.section-note,.history-note,.media-note{color:var(--muted);font-size:14px!important;line-height:1.9!important}.section-note{margin-top:12px}.overview-grid,.capability-grid,.evidence-grid,.version-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:24px}.overview-grid article,.capability-grid>div,.evidence-grid>div,.version-card{padding:20px;border:1px solid var(--edge);border-radius:12px;background:var(--panel);min-width:0}.overview-grid article h3,.capability-grid h3,.evidence-grid h3{margin-bottom:10px}.overview-wide{grid-column:1/-1}.case-list{display:grid;gap:10px;list-style:none;margin:14px 0 0;padding:0}.case-list li{position:relative;padding-left:19px;color:var(--muted);overflow-wrap:anywhere}.case-list li::before{content:'↗';position:absolute;left:0;color:var(--accent)}.architecture-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:24px}.architecture-card{padding:20px;border:1px solid var(--edge);border-radius:12px;background:var(--panel);min-width:0}.architecture-card>span,.module-card>span{color:var(--accent);font-size:10px;letter-spacing:1px}.architecture-card h3{margin-top:13px}.architecture-card p{margin-top:10px;color:var(--muted);overflow-wrap:anywhere}.evidence-grid{margin-bottom:20px}.status-stack{display:grid;gap:12px}.status-card{display:grid;gap:6px;padding:16px;border:1px solid var(--edge);border-radius:10px;background:var(--surface)}.status-card span{color:var(--muted);font-size:11px}.status-card strong{font-size:14px;line-height:1.6;font-weight:600}.status-card code{color:var(--accent);font:11px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}.history-note{border-top:1px solid var(--edge);padding-top:18px}.media-note{margin-top:16px!important;padding:16px;border-left:2px solid var(--accent);background:var(--panel)}.version-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.version-card h3{font-size:18px}.version-card>p{margin-top:12px;color:var(--muted)}.version-card>div{margin-top:18px;padding-top:16px;border-top:1px solid var(--edge)}.version-card strong{font-size:12px;color:var(--accent)}.version-card>div p{margin-top:8px;color:var(--muted)}.subheading{margin-top:32px!important}.module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px}.module-card{padding:16px;border:1px solid var(--edge);border-radius:10px;background:var(--panel);min-width:0}.module-card h4{margin-top:10px;font-size:14px;line-height:1.5}.module-card p{margin-top:7px;color:var(--muted);font-size:13px!important;line-height:1.75!important}.demo-step-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.demo-step{min-height:44px;padding:9px 13px;border:1px solid var(--edge);border-radius:8px;background:var(--panel);color:var(--muted);font-size:12px;cursor:pointer}.demo-step[aria-pressed=true],.demo-step.is-active{border-color:var(--accent);background:var(--active-bg);color:var(--accent)}.demo-description{margin-top:18px;padding:16px;border:1px solid var(--edge);border-radius:10px;background:var(--panel);color:var(--ink);font-size:15px!important;line-height:1.9!important}.demo-step-panel{margin-top:16px;padding:20px;border:1px solid var(--edge);border-radius:12px;background:var(--surface)}.demo-step-panel h3{font-size:18px}.demo-step-description{margin-top:10px;color:var(--muted)}.has-demo-js .demo-step-panel .demo-step-description{display:none}.storyboard-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:18px}.storyboard-card{padding:15px;border:1px solid var(--edge);border-radius:9px;background:var(--panel);min-width:0}.storyboard-card>span{color:var(--accent);font-size:10px;letter-spacing:.7px}.storyboard-card h4{margin-top:9px;font-size:14px;line-height:1.6}.storyboard-card p{margin-top:7px;color:var(--muted);font-size:13px!important;line-height:1.75!important}.other-cases-section{padding-bottom:30px}.other-cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:20px}.other-case{display:flex;align-items:center;min-height:44px;padding:9px 12px;border:1px solid var(--edge);border-radius:8px;background:var(--panel);color:var(--muted);font-size:12px;line-height:1.5}.other-case:hover,.other-case.is-current{border-color:var(--accent);background:var(--active-bg);color:var(--accent)}.case-footer{display:flex;justify-content:space-between;gap:20px;padding:22px 0 28px;border-top:1px solid var(--edge);color:var(--muted);font-size:11px}.case-footer a{color:var(--accent)}
@media(max-width:950px){.extra-section{padding:24px}.featured-grid,.method-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.case-shell{padding:0 28px}.case-layout{grid-template-columns:1fr;gap:24px}.case-toc{position:static;display:flex;align-items:center;gap:3px;overflow-x:auto;padding:5px}.case-toc p{flex:0 0 auto;padding:8px 10px}.case-toc a{flex:0 0 auto;white-space:nowrap}.case-reading{max-width:none}.module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.storyboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.portfolio-extra{margin-top:12px}.extra-section{padding:20px;border-radius:15px}.section-heading h2{font-size:22px}.featured-grid,.method-grid,.boundary-grid{grid-template-columns:1fr;gap:10px}.featured-case{min-height:0}.case-shell{padding:0 16px}.case-header{height:76px}.case-header .brand{font-size:22px}.case-back-link{font-size:11px;gap:8px}.case-main{padding-top:24px}.case-breadcrumb{font-size:11px}.case-hero{padding:28px 0 34px}.case-hero h1{font-size:30px}.case-lede{font-size:15px;line-height:1.85}.case-section{padding-bottom:42px}.case-section h2{font-size:23px}.overview-grid,.capability-grid,.evidence-grid,.version-grid,.architecture-grid{grid-template-columns:1fr;gap:10px}.overview-wide{grid-column:auto}.case-section p,.case-section li{font-size:14px}.module-grid{grid-template-columns:1fr}.demo-step-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.demo-step{width:100%;font-size:11px}.storyboard-grid{grid-template-columns:1fr}.other-cases{grid-template-columns:1fr}.case-footer{display:block}.case-footer span{display:block;margin-top:12px}}
.module-card p,.storyboard-card p{font-size:14px!important}
.case-showcase-gallery{display:grid;gap:24px;margin-top:24px}.case-showcase-gallery figure{margin:0;overflow:hidden;border:1px solid var(--edge);border-radius:14px;background:var(--surface)}.case-showcase-gallery figure>a{display:block}.case-showcase-gallery img{display:block;width:100%;height:auto;border-bottom:1px solid var(--edge)}.case-showcase-gallery figcaption{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 16px;align-items:center;padding:14px 18px}.case-showcase-gallery figcaption strong{font-size:14px}.case-showcase-gallery figcaption span{font-size:12px;color:var(--muted);grid-column:1}.case-showcase-gallery figcaption>a{display:flex;align-items:center;grid-column:2;grid-row:1/3;min-height:44px;color:var(--accent);font-size:12px}@media(max-width:640px){.case-showcase-gallery figcaption{grid-template-columns:minmax(0,1fr);padding:12px 14px}.case-showcase-gallery figcaption>a{grid-column:1;grid-row:auto}.case-showcase-gallery{gap:16px}}

.case-topics { margin-top: 20px; }

/* V3 content surfaces: keep the graphite map quiet while giving the reading blocks room to breathe. */
.header-nav{display:flex;align-items:center;gap:12px;overflow-x:auto;scrollbar-width:none}.header-nav::-webkit-scrollbar{display:none}.header-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 2px;color:var(--muted);font-size:11px;white-space:nowrap}.header-nav a:hover{color:var(--accent)}
.about-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(340px,.88fr);gap:24px;margin-top:24px}.about-copy{max-width:700px}.about-copy>p:not(.section-note){margin-top:0;color:var(--ink);font-size:16px;line-height:1.95}.about-copy>p+p{margin-top:16px!important}.about-copy .section-note{margin-top:18px}.focus-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}.focus-tags span{padding:7px 10px;border:1px solid var(--edge);border-radius:999px;color:var(--accent);background:var(--panel);font-size:12px;line-height:1.5}.metrics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.metric-card{padding:17px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.metric-card strong{display:block;color:var(--accent);font:600 23px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace}.metric-card h3{margin-top:10px;font-size:14px;font-weight:600}.metric-card p{margin-top:6px;color:var(--muted);font-size:12px;line-height:1.7}.capabilities-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:24px}.capability-card{display:flex;min-width:0;flex-direction:column;padding:18px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.card-index{color:var(--accent);font:10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1px}.capability-card h3{margin-top:12px;font-size:16px;line-height:1.5}.capability-card>p{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.8}.capability-scene,.capability-cases{margin-top:auto;padding-top:14px}.capability-scene{margin-top:20px;border-top:1px solid var(--edge)}.capability-card strong{color:var(--accent);font-size:11px}.capability-card .capability-scene p,.capability-card .capability-cases p{margin-top:6px;color:var(--muted);font-size:13px;line-height:1.7}.featured-case em{color:var(--muted);font-size:12px;line-height:1.7;font-style:normal}.method-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.method-output{display:block;margin-top:auto;padding-top:14px;color:var(--accent);font-size:11px;line-height:1.7;font-weight:500}.portability-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}.portability-card{display:flex;min-width:0;flex-direction:column;padding:20px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.portability-card h3{margin-top:13px;font-size:17px}.portability-card>p{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.85}.portability-card>div{margin-top:auto;padding-top:16px}.portability-card>div strong{color:var(--accent);font-size:11px}.portability-card>div p{margin-top:7px;color:var(--muted);font-size:13px;line-height:1.75}.boundary-note{margin-top:18px;padding:14px 16px;border-left:2px solid var(--accent);color:var(--muted);font-size:14px;line-height:1.8}.faq-list{display:grid;gap:9px;margin-top:24px;max-width:980px}.faq-item{border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.faq-item summary{display:flex;align-items:center;min-height:52px;padding:12px 16px;color:var(--ink);font-size:15px;font-weight:600;cursor:pointer;list-style:none}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary::after{content:'+';margin-left:auto;color:var(--accent);font:20px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.faq-item[open] summary::after{content:'−'}.faq-item p{padding:0 16px 16px;color:var(--muted);font-size:14px;line-height:1.9}
.scenario-grid,.decision-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}.scenario-card,.decision-card{min-width:0;padding:20px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.scenario-card>span,.decision-card>span{color:var(--accent);font:10px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1px}.scenario-card h3,.decision-card h3{margin-top:11px;font-size:17px;line-height:1.55}.scenario-card p,.decision-card p{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.9}.decision-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.handoff-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none;margin:24px 0 0;padding:0;counter-reset:handoff}.handoff-list li{display:flex;min-width:0;gap:12px;padding:20px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.handoff-list li>span{flex:0 0 auto;color:var(--accent);font:10px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1px}.handoff-list h3{font-size:16px;line-height:1.5}.handoff-list p{margin-top:9px;color:var(--muted);font-size:14px;line-height:1.9}
@media(max-width:1180px){.capabilities-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.method-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.about-grid{grid-template-columns:1fr}.portability-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.scenario-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:950px){.site-header{height:auto;min-height:76px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}.header-nav{order:3;flex-basis:100%;gap:18px}.header-nav a{font-size:12px}.portability-grid{grid-template-columns:1fr}.scenario-grid,.handoff-list{grid-template-columns:1fr}.decision-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.about-grid{gap:18px}.about-copy>p:not(.section-note){font-size:15px;line-height:1.9}.metrics-grid{grid-template-columns:1fr 1fr}.capabilities-grid,.method-grid,.decision-grid{grid-template-columns:1fr;gap:10px}.capability-card,.method-card,.portability-card,.scenario-card,.decision-card,.handoff-list li{padding:17px}.featured-case em{font-size:13px}.faq-item summary{font-size:14px}.faq-item p,.scenario-card p,.decision-card p,.handoff-list p{font-size:14px}.header-nav{gap:14px}.header-nav a{font-size:11px}.metric-card strong{font-size:20px}}

/* V4 experience surfaces: functional scaffolding only, using the existing graphite tokens. */
.featured-case{display:flex;flex-direction:column;gap:12px}.featured-main{position:relative;display:grid;flex:1;gap:9px;color:var(--muted);font-size:12px;line-height:1.8}.featured-main strong{color:var(--ink);font-size:16px;font-weight:600;line-height:1.5;padding-right:24px}.featured-main small{color:var(--accent);font-size:11px}.featured-main em{color:var(--muted);font-size:12px;line-height:1.7;font-style:normal}.featured-demo{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:9px 12px;border-top:1px solid var(--edge);color:var(--accent);font-size:12px}.featured-demo:hover{color:var(--ink)}.principles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}.principle-card{padding:20px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.principle-card h3{margin-top:13px;font-size:17px;line-height:1.5}.principle-card p{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.9}.experience-preview{scroll-margin-top:24px}.experience-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:24px}.experience-card{display:flex;min-width:0;min-height:190px;flex-direction:column;padding:18px;border:1px solid var(--edge);border-radius:12px;background:var(--panel);color:var(--muted)}.experience-card:hover{border-color:var(--accent);background:var(--active-bg);transform:translateY(-2px)}.experience-card strong{margin-top:13px;color:var(--ink);font-size:16px;line-height:1.5}.experience-card p{margin-top:10px;font-size:13px;line-height:1.8}.experience-card-link{margin-top:auto;padding-top:15px;color:var(--accent);font-size:12px}.walkthrough-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(220px,.5fr);gap:12px;margin-top:18px}.walkthrough-video{margin:0;overflow:hidden;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.walkthrough-video video{display:block;width:100%;max-height:360px;background:#070a0f}.walkthrough-video figcaption{display:flex;justify-content:space-between;gap:12px;padding:13px 16px;font-size:12px}.walkthrough-video figcaption span{color:var(--muted)}.media-entry-list{display:grid;align-content:start;gap:8px;padding:18px;border:1px solid var(--edge);border-radius:12px;background:var(--panel);font-size:12px}.media-entry-list>a,.media-entry-list>span{display:flex;justify-content:space-between;gap:10px;min-height:44px;align-items:center;padding:8px 0;border-top:1px solid var(--edge);color:var(--muted)}.media-entry-list>a:hover{color:var(--accent)}
.demo-page{min-height:100vh}.demo-shell{max-width:1480px;margin:auto;padding:0 44px}.demo-header{height:94px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--edge)}.demo-main{padding:36px 0 58px}.demo-identity{display:flex;align-items:center;justify-content:space-between;gap:20px}.demo-proof{display:inline-flex;align-items:center;min-height:36px;padding:7px 11px;border:1px solid var(--accent);border-radius:999px;color:var(--accent);font-size:12px}.demo-hero{max-width:880px;padding:48px 0 30px}.demo-hero h1{margin-top:10px;font-size:42px;line-height:1.35;font-weight:600;letter-spacing:-1.2px}.demo-hero>p:not(.eyebrow){margin-top:16px;color:var(--muted);font-size:17px;line-height:1.9}.demo-hero .demo-boundary-note{max-width:760px;padding:14px 16px;border-left:2px solid var(--accent);background:var(--surface);font-size:14px}.demo-scene-nav{display:flex;flex-wrap:wrap;gap:8px;padding:10px;border:1px solid var(--edge);border-radius:12px;background:var(--surface)}.demo-scene-button,.guide-step-button{min-height:44px;padding:9px 14px;border:1px solid var(--edge);border-radius:8px;background:var(--panel);color:var(--muted);font-size:13px;cursor:pointer}.demo-scene-button:hover,.demo-scene-button[aria-pressed=true],.guide-step-button:hover,.guide-step-button[aria-pressed=true]{border-color:var(--accent);background:var(--active-bg);color:var(--accent)}.guide-panel{margin-top:16px;padding:24px;border:1px solid var(--edge);border-radius:16px;background:var(--surface)}.guide-heading{display:flex;justify-content:space-between;gap:24px}.guide-heading h2{margin-top:8px;font-size:25px;line-height:1.5}.guide-heading>div>p:last-child{max-width:720px;margin-top:10px;color:var(--muted);font-size:14px;line-height:1.85}.guide-readout{display:grid;align-content:start;justify-items:end;gap:8px;min-width:140px}.guide-readout strong{color:var(--accent);font-size:14px;text-align:right}.guide-readout span{color:var(--muted);font:14px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}.guide-controls{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.demo-primary-button,.demo-secondary-button{min-height:44px;padding:9px 14px;border-radius:8px;font-size:13px;cursor:pointer}.demo-primary-button{border:1px solid var(--accent);background:var(--button-bg);color:var(--button-text)}.demo-secondary-button{border:1px solid var(--edge);background:var(--panel);color:var(--muted)}.demo-primary-button:hover,.demo-secondary-button:hover{border-color:var(--accent);color:var(--accent)}.guide-stage-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:22px 0 0;padding:0;list-style:none}.guide-stage-list li{min-width:0;padding:14px;border:1px solid var(--edge);border-radius:10px;background:var(--panel)}.guide-step-button{display:flex;width:100%;align-items:center;gap:10px;text-align:left}.guide-step-button span{color:var(--accent);font:10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}.guide-stage-list li p{margin-top:10px;color:var(--muted);font-size:13px;line-height:1.8}.demo-scene-panel{margin-top:16px;padding:26px;border:1px solid var(--edge);border-radius:16px;background:var(--surface)}.demo-scene-heading{display:flex;justify-content:space-between;gap:24px}.demo-scene-heading h2{margin-top:8px;font-size:28px;line-height:1.45}.demo-scene-description{max-width:520px;color:var(--muted);font-size:14px;line-height:1.9}.demo-kicker{color:var(--accent);font-size:10px;letter-spacing:1.8px}.demo-toolbar{display:flex;flex-wrap:wrap;align-items:end;gap:10px;margin-top:22px}.demo-field{display:grid;gap:7px;min-width:210px;color:var(--muted);font-size:12px}.demo-field input,.demo-field select{min-height:44px;padding:9px 11px;border:1px solid var(--edge);border-radius:8px;background:var(--panel);color:var(--ink);font:14px/1.4 inherit}.demo-field input:focus,.demo-field select:focus,.demo-primary-button:focus-visible,.demo-secondary-button:focus-visible,.demo-scene-button:focus-visible,.guide-step-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.demo-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:20px}.demo-metric{display:grid;gap:7px;min-width:0;padding:16px;border:1px solid var(--edge);border-radius:10px;background:var(--panel)}.demo-metric strong{color:var(--accent);font:600 22px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}.demo-metric small{color:var(--muted);font-size:12px;line-height:1.5}.demo-muted{color:var(--muted);font-size:12px}.demo-split-layout{display:grid;grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr);gap:12px;margin-top:22px}.demo-list-column,.demo-detail-column{min-width:0}.demo-column-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.demo-column-heading h3,.demo-column-heading h4{font-size:16px;line-height:1.5}.demo-card-list{display:grid;gap:8px;margin-top:12px}.demo-card-button,.demo-ticket-card,.demo-session-card,.demo-script-card,.demo-customer-card{display:grid;width:100%;gap:6px;min-height:78px;padding:13px 14px;border:1px solid var(--edge);border-radius:9px;background:var(--panel);color:var(--muted);text-align:left;cursor:pointer}.demo-card-button:hover,.demo-card-button[aria-pressed=true],.demo-ticket-card:hover,.demo-ticket-card[aria-pressed=true],.demo-session-card:hover,.demo-session-card[aria-pressed=true],.demo-script-card:hover,.demo-script-card[aria-pressed=true],.demo-customer-card:hover,.demo-customer-card[aria-pressed=true]{border-color:var(--accent);background:var(--active-bg)}.demo-card-button strong,.demo-ticket-card strong,.demo-session-card strong,.demo-script-card strong,.demo-customer-card strong{color:var(--ink);font-size:14px;line-height:1.5}.demo-card-button small,.demo-ticket-card small,.demo-session-card small,.demo-script-card small,.demo-customer-card small{font-size:12px;line-height:1.6}.demo-card-kicker{color:var(--accent);font-size:11px}.demo-detail-column{display:grid;align-content:start;gap:12px}.demo-detail-card,.demo-task-panel{min-width:0;padding:20px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}.demo-detail-card h3{margin-top:10px;font-size:21px;line-height:1.5}.demo-detail-copy{margin-top:12px;color:var(--muted);font-size:14px;line-height:1.9}.demo-detail-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:18px}.demo-detail-stats span{display:grid;gap:5px;padding:10px;border:1px solid var(--edge);border-radius:8px;color:var(--muted);font-size:11px}.demo-detail-stats b{color:var(--ink);font-size:14px;overflow-wrap:anywhere}.demo-signal{margin-top:16px;padding:12px;border-left:2px solid var(--accent);color:var(--muted);font-size:14px;line-height:1.8}.demo-signal strong{color:var(--accent)}.demo-detail-card>.demo-primary-button{margin-top:18px}.demo-empty{padding:18px;border:1px dashed var(--edge);border-radius:9px;color:var(--muted);font-size:14px;line-height:1.8}.demo-task-panel{margin-top:0}.demo-task-list{display:grid;gap:8px;margin-top:12px}.demo-task-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid var(--edge);border-radius:8px}.demo-task-item strong{font-size:13px;line-height:1.5}.demo-task-item small{display:block;margin-top:4px;color:var(--muted);font-size:11px}.demo-status-button{min-height:40px;padding:7px 10px;border:1px solid var(--edge);border-radius:7px;background:var(--surface);color:var(--accent);font-size:12px;cursor:pointer}.demo-status-button:hover{border-color:var(--accent)}.demo-definition-list{display:grid;gap:10px;margin-top:18px}.demo-definition-list div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;padding-bottom:10px;border-bottom:1px solid var(--edge)}.demo-definition-list dt{color:var(--accent);font-size:12px}.demo-definition-list dd{margin:0;color:var(--muted);font-size:14px;line-height:1.7}.demo-boundary-note{margin-top:18px;padding:12px 14px;border-left:2px solid var(--accent);background:var(--surface);color:var(--muted);font-size:13px;line-height:1.8}.demo-brief{margin-top:18px;padding:15px;border:1px solid var(--edge);border-radius:9px;background:var(--surface)}.demo-brief>p{margin-top:9px;color:var(--muted);font-size:14px;line-height:1.85}.demo-hook{padding-top:10px;border-top:1px solid var(--edge)}.demo-hook b{color:var(--accent)}.demo-quality-list{display:grid;gap:8px;margin-top:10px}.demo-quality-item{display:flex;align-items:flex-start;gap:10px;padding:11px;border:1px solid var(--edge);border-radius:8px;background:var(--surface);cursor:pointer}.demo-quality-item input{flex:0 0 auto;width:18px;height:18px;margin-top:2px;accent-color:var(--accent)}.demo-quality-item span{display:grid;gap:4px}.demo-quality-item strong{font-size:13px}.demo-quality-item small{color:var(--muted);font-size:12px;line-height:1.6}.demo-erp-tasks{margin-top:18px;padding-top:15px;border-top:1px solid var(--edge)}.demo-erp-tasks>strong{color:var(--accent);font-size:12px}.demo-erp-tasks ul{display:grid;gap:5px;margin:9px 0 0;padding-left:18px;color:var(--muted);font-size:14px;line-height:1.7}.demo-static-reading{margin-top:16px;padding:26px;border:1px solid var(--edge);border-radius:16px;background:var(--surface)}.demo-static-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:22px}.demo-static-grid article{padding:16px;border:1px solid var(--edge);border-radius:10px;background:var(--panel)}.demo-static-grid h3{font-size:15px;line-height:1.5}.demo-static-grid p{margin-top:8px;color:var(--muted);font-size:14px;line-height:1.8}.no-js-note{max-width:720px;margin:20px auto;padding:16px;border:1px solid var(--edge);color:var(--muted);font-size:14px;line-height:1.8}
@media(max-width:1180px){.experience-grid,.demo-static-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.principles-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.demo-detail-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:950px){.demo-shell{padding:0 28px}.demo-header{height:76px}.demo-hero h1{font-size:34px}.guide-heading,.demo-scene-heading{display:grid;gap:18px}.guide-readout{justify-items:start}.guide-stage-list{grid-template-columns:1fr}.experience-grid,.demo-static-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.walkthrough-grid{grid-template-columns:1fr}.demo-split-layout{grid-template-columns:1fr}}
@media(max-width:640px){.demo-shell{padding:0 16px}.demo-header{gap:12px}.demo-header .header-title{display:none}.demo-header .case-back-link{font-size:11px}.demo-main{padding-top:25px}.demo-identity{align-items:flex-start;display:grid;gap:12px}.demo-proof{justify-self:start}.demo-hero{padding:34px 0 24px}.demo-hero h1{font-size:28px}.demo-hero>p:not(.eyebrow){font-size:15px}.demo-scene-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.demo-scene-button{width:100%;padding:9px 8px;font-size:12px}.guide-panel,.demo-scene-panel,.demo-static-reading{padding:19px}.guide-heading h2,.demo-scene-heading h2{font-size:23px}.guide-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.guide-controls button{padding:9px 6px;font-size:12px}.experience-grid,.demo-static-grid{grid-template-columns:1fr}.demo-toolbar{display:grid;align-items:stretch}.demo-field{min-width:0}.demo-toolbar .demo-secondary-button{width:100%}.demo-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-metric{padding:12px}.demo-metric strong{font-size:18px}.demo-detail-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-definition-list div{grid-template-columns:78px minmax(0,1fr)}.walkthrough-video figcaption{display:grid}.principles-grid{grid-template-columns:1fr}.featured-demo{font-size:13px}}

.demo-guide-callout{margin-top:16px;padding:12px 14px;border:1px solid var(--accent);border-radius:8px;color:var(--accent);font-size:14px;line-height:1.7;background:var(--active-bg)}

.demo-guide-stage-note{align-self:end;max-width:260px;margin:0;padding:10px 12px;border:1px solid var(--edge);border-radius:8px;color:var(--muted);font-size:13px;line-height:1.7}.demo-guide-stage-note.is-active{border-color:var(--accent);color:var(--accent);background:var(--active-bg)}.demo-guide-focus{border-color:var(--accent);box-shadow:inset 2px 0 0 var(--accent)}.demo-guide-focus-copy{margin-top:14px;color:var(--muted);font-size:14px;line-height:1.9}.demo-guide-task-placeholder{border-style:dashed}
@media(max-width:950px){.demo-guide-stage-note{align-self:start;max-width:none}}

/* V5 refinement: quiet graphite surfaces, readable case hierarchy, and compact data views. */
:root{--page:#17191f;--surface:#1e2128;--panel:#262a33;--ink:#ececf0;--muted:#afb3be;--edge:rgba(236,236,240,.14);--map-edge:#626775;--accent:#b9aff0;--active-bg:rgba(185,175,240,.13);--commerce:#b9aff0;--ai:#abd1bd;--enterprise:#dfc39f;--button-bg:#ececf0;--button-text:#17191f;--brand-bg:#b9aff0;--brand-text:#17191f;--shadow:rgba(0,0,0,.24);--overlay:rgba(8,9,13,.78);--grid:rgba(175,179,190,.07)}
body{background:var(--page);color:var(--ink)}
.case-hero-visual{width:min(100%,900px);margin:30px 0 0;overflow:hidden;border:1px solid var(--edge);border-radius:16px;background:var(--surface)}
.case-hero-visual img{display:block;width:100%;height:auto;max-height:420px;object-fit:cover;object-position:top center}
.case-hero-visual figcaption{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 16px;color:var(--muted);font-size:13px;line-height:1.7}
.case-hero-visual figcaption strong{color:var(--ink);font-size:14px;font-weight:600}
.case-hero-architecture{padding:14px 14px 0}
.case-hero-architecture svg{display:block;width:100%;height:auto;min-height:160px}
.case-hero-architecture .case-hero-connections path{fill:none;stroke:var(--map-edge);stroke-width:2;vector-effect:non-scaling-stroke}
.case-hero-architecture .case-hero-node rect{fill:var(--panel);stroke:var(--edge);stroke-width:1;vector-effect:non-scaling-stroke}
.case-hero-architecture .case-hero-node text{fill:var(--ink);font:600 14px/1.4 var(--font)}
.case-hero-architecture .case-hero-node .case-hero-node-index{fill:var(--muted);font-size:11px;font-weight:400}
.case-hero-architecture figcaption{padding-left:2px;padding-right:2px}
.case-contribution{border-color:rgba(185,175,240,.32);background:rgba(185,175,240,.04)}
.case-contribution .case-list{margin-top:18px}
.case-reading p,.case-reading li{font-size:15px;line-height:1.85}
.case-reading .section-note,.case-reading .history-note,.case-reading .media-note{font-size:14px}
.case-details{margin-top:14px;border:1px solid var(--edge);border-radius:14px;background:var(--surface);scroll-margin-top:24px}
.case-details>summary{display:flex;align-items:center;min-height:56px;padding:14px 18px;color:var(--ink);font-size:17px;font-weight:600;line-height:1.5;cursor:pointer;list-style:none}
.case-details>summary::-webkit-details-marker{display:none}
.case-details>summary::after{content:'+';margin-left:auto;color:var(--accent);font:22px/1 ui-monospace,SFMono-Regular,Consolas,monospace}
.case-details[open]>summary::after{content:'−'}
.case-details-body{padding:0 18px 20px}
.case-details-body>.section-kicker{padding-top:2px}
.case-details-body .case-list{margin-top:16px}
.featured-visual{display:block;overflow:hidden;aspect-ratio:16/9;border:1px solid var(--edge);border-radius:10px;background:var(--surface)}
.featured-visual img{display:block;width:100%;height:100%;object-fit:cover}
.featured-case:has(.featured-visual){gap:10px}
.demo-hero{max-width:780px;padding:30px 0 20px}
.demo-hero h1{font-size:38px}
.demo-hero>p:not(.eyebrow){font-size:15px;line-height:1.8}
.demo-capture{margin-top:16px;padding:10px;border:1px solid var(--edge);border-radius:16px;background:var(--surface)}
.demo-capture-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:34px;padding:0 8px 8px;color:var(--muted);font-size:12px;line-height:1.6}
.demo-capture-bar span:first-child{color:var(--ink);font-size:14px;font-weight:600}
.demo-capture>[data-scene-mount]>.demo-scene-panel{margin-top:0}
[data-guide-only][hidden]{display:none!important}
.guide-only-controls{display:flex;flex-wrap:wrap;gap:8px}
.demo-chart-card{margin-top:16px;padding:17px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}
.demo-chart-card h3{font-size:16px;line-height:1.5}
.demo-chart-card .demo-column-heading>div{min-width:0}
.demo-chart-scale{color:var(--muted);font-size:12px;white-space:nowrap}
.demo-chart-rows{display:grid;gap:11px;margin-top:18px}
.demo-chart-row{display:grid;grid-template-columns:minmax(112px,.62fr) minmax(90px,1fr) minmax(84px,auto);align-items:center;gap:12px;min-width:0}
.demo-chart-label{min-width:0;overflow-wrap:anywhere;color:var(--muted);font-size:13px;line-height:1.5}
.demo-chart-track{display:block;width:100%;height:12px;min-width:0;overflow:hidden;border-radius:999px;background:var(--surface)}
.demo-chart-bar{display:block;width:0;height:100%;border-radius:999px;background:var(--accent);transition:none}
.demo-chart-value{color:var(--ink);font:600 13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;text-align:right;overflow-wrap:anywhere}
.demo-list-column .demo-card-list{max-height:420px;overflow-y:auto;padding-right:4px;overscroll-behavior:contain}
.demo-primary-button:hover,.demo-primary-button:focus-visible{background:var(--button-bg);color:var(--button-text);border-color:var(--accent)}
.demo-field input::placeholder{color:var(--muted);opacity:1}
@media(prefers-reduced-motion:reduce){.demo-chart-bar{transition:none}.experience-card{transition:none!important}}
@media(max-width:950px){.case-hero-visual{margin-top:24px}.demo-hero h1{font-size:34px}.demo-chart-row{grid-template-columns:minmax(100px,.58fr) minmax(80px,1fr) minmax(74px,auto)}}
@media(max-width:640px){.case-hero-visual figcaption{display:grid;gap:4px;padding:11px 13px}.case-hero-architecture{padding:10px 10px 0}.case-hero-architecture svg{min-height:120px}.case-hero-architecture .case-hero-node text{font-size:11px}.case-hero-architecture .case-hero-node .case-hero-node-index{font-size:9px}.case-details>summary{min-height:52px;padding:12px 14px;font-size:15px}.case-details-body{padding:0 14px 16px}.demo-hero{padding:24px 0 16px}.demo-hero h1{font-size:29px}.demo-capture{padding:7px}.demo-capture-bar{padding:0 5px 7px;font-size:11px}.demo-capture-bar span:first-child{font-size:13px}.demo-chart-card{padding:14px}.demo-chart-row{grid-template-columns:minmax(82px,.58fr) minmax(48px,1fr) minmax(70px,auto);gap:8px}.demo-chart-label,.demo-chart-value{font-size:12px}.demo-chart-track{height:10px}.guide-only-controls{display:grid;grid-template-columns:1fr 1fr;width:100%}}

.case-hero-fullsize{display:block;min-height:44px}
.case-hero-fullsize:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.case-hero-fullsize-link{display:inline-flex;align-items:center;min-height:44px;color:var(--accent);font-size:12px;white-space:nowrap}
.case-hero-fullsize-link:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.demo-overview-card,.demo-status-path{margin-top:16px;padding:17px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}
.demo-overview-card h3,.demo-status-path h3{font-size:16px;line-height:1.5}
.demo-overview-note{margin-top:5px;color:var(--muted);font-size:12px;line-height:1.7}
.demo-overview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:15px}
.demo-overview-stat{display:grid;gap:5px;min-width:0;padding:11px 12px;border:1px solid var(--edge);border-radius:8px;background:var(--surface)}
.demo-overview-stat strong{color:var(--accent);font:600 20px/1.25 ui-monospace,SFMono-Regular,Consolas,monospace}
.demo-overview-stat span{color:var(--muted);font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.demo-status-path-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.demo-message-thread{display:grid;gap:10px;margin-top:17px}
.demo-message-bubble{max-width:92%;padding:13px 14px;border:1px solid var(--edge);border-radius:12px;background:var(--surface)}
.demo-message-incoming{justify-self:start;border-top-left-radius:4px}
.demo-message-suggestion{justify-self:end;border-color:rgba(185,175,240,.35);background:var(--active-bg);border-top-right-radius:4px}
.demo-message-label{display:block;color:var(--accent);font-size:11px;line-height:1.5;font-weight:600}
.demo-message-bubble p{margin-top:7px;color:var(--ink);font-size:14px;line-height:1.8}
.demo-message-bubble small{display:block;margin-top:7px;color:var(--muted);font-size:12px;line-height:1.7}
.demo-video-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}
.demo-video-stage{min-width:0;padding:14px;border:1px solid var(--edge);border-radius:10px;background:var(--surface)}
.demo-video-stage h4{margin-top:8px;color:var(--ink);font-size:15px;line-height:1.5}
.demo-video-stage>p{margin-top:9px;color:var(--muted);font-size:14px;line-height:1.8}
.demo-stage-kicker{color:var(--accent);font:10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1px}
.demo-video-stage-quality .demo-column-heading{align-items:start}
.demo-video-stage-quality .demo-quality-list{margin-top:12px}
.demo-erp-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}
.demo-erp-subsection{min-width:0;padding:14px;border:1px solid var(--edge);border-radius:10px;background:var(--surface)}
.demo-erp-subsection h4{margin-top:8px;font-size:15px;line-height:1.5}
.demo-erp-subsection p{margin-top:8px;color:var(--muted);font-size:14px;line-height:1.8}
@media(min-width:1100px){.demo-capture{min-width:min(1100px,100%);min-height:450px;max-height:1200px;overflow:auto}}
@media(max-width:950px){.demo-overview-grid,.demo-status-path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-video-flow{grid-template-columns:1fr}.demo-erp-sections{grid-template-columns:1fr}}
@media(max-width:640px){.demo-overview-card,.demo-status-path{padding:14px}.demo-overview-stat{padding:10px}.demo-message-bubble{max-width:100%}.case-hero-fullsize-link{white-space:normal}}

/* V5 final spacing pass: keep the five ticket counters and three video stages legible at desktop widths. */
@media(min-width:951px){.demo-overview-card .demo-overview-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.demo-video-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-video-stage-quality{grid-column:1/-1}.demo-video-stage-quality .demo-quality-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:950px){.demo-overview-card .demo-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-video-flow{grid-template-columns:1fr}.demo-video-stage-quality{grid-column:auto}.demo-video-stage-quality .demo-quality-list{grid-template-columns:1fr}}
@media(max-width:640px){.demo-overview-card .demo-column-heading,.demo-status-path .demo-column-heading{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:8px}.demo-overview-card .demo-column-heading>div,.demo-status-path .demo-column-heading>div{width:100%;min-width:0}.demo-overview-card .demo-column-heading>span,.demo-status-path .demo-column-heading>span{justify-self:start;white-space:nowrap}}