/* Theme roles use the supplied kit's explicit light/dark values. */
:root[data-theme="dark"]{color-scheme:dark;--site-muted:var(--quinary-invert);--site-accent:var(--app-300);--site-hover:var(--app-900)}
:root[data-theme="light"]{color-scheme:light;--site-muted:var(--secondary-invert);--site-accent:var(--app-700);--site-hover:var(--app-100)}
:root{--paper:var(--primary);--ink:var(--primary-invert);--muted:var(--site-muted);--blue:var(--site-accent);--line:var(--divider)}
body,.header,.hero,.expertise,.work,.about,.footer{background:var(--primary);color:var(--primary-invert)}
.building,.project-brief,.contact,.work-dialog,.product-demo{background:var(--app-secondary);color:var(--primary-invert)}
.project-brief,.demo-detail,.viewer-image,.case-visual{background:var(--secondary);color:var(--primary-invert)}
.building h2,.project-brief h3,.project-brief dd,.research-flow,.footer,.email,.contact,.secondary,.hero .secondary{color:var(--primary-invert)}
.hero-bottom p,.hero>.eyebrow,.landscape-label,.hero-meta,.building p,.project-brief dt,.draft-label,.contact-bottom,.contact .eyebrow,.viewer-count,.preview-intro,.demo-top span,.preview-caption,.demo-guide,.demo-node small,.demo-node-role,.demo-detail p,.demo-detail dt,.hero .data-landscape figcaption{color:var(--site-muted)}
.hero h1 span,.index,.demo-group h3 span,.research-flow li:before,.research-flow button[aria-pressed=true]{color:var(--site-accent)}
.hero h1 span{text-shadow:none}
.hero .data-landscape{color:var(--site-accent);background-image:none}
.hero .node-selected{stroke:var(--site-accent)}
.header,.building,.contact,.project-brief,.project-brief dl div,.draft-label,.case-visual,.contact-bottom,.email,.flow-detail,.hero .data-landscape,.hero-meta,.hero .secondary,.language-switch,.work-dialog,.work-dialog button,.expertise .focus-grid article{border-color:var(--divider)}
.hero .network-controls button,.network-controls button,.demo-tabs button,.theme-toggle{background:var(--secondary);border:1px solid var(--divider);color:var(--primary-invert)}
.theme-toggle{padding:8px 12px;min-height:44px;font-size:14px}
.primary,.hero .primary,.hero .network-controls button[aria-pressed=true],.network-controls button[aria-pressed=true],.demo-tabs button[aria-pressed=true]{background:var(--app-700);color:var(--ink-on-app);border-color:var(--app-700)}
.primary:hover,.hero .primary:hover,.work-dialog button:hover{background:var(--app-800);color:var(--ink-on-app);border-color:var(--app-800)}
.secondary:hover,.hero .secondary:hover,.case-visual:hover,.demo-node:hover,.theme-toggle:hover{background:var(--site-hover);color:var(--primary-invert)}
.demo-node{background:var(--primary);color:var(--primary-invert)}
.demo-node[data-relation=selected]{outline-color:var(--site-accent)}
.demo-node[data-relation=unrelated]{opacity:1;border-style:dashed}
.skip-link{background:var(--secondary);color:var(--primary-invert)}
.header nav a:hover,.footer a:hover{color:var(--site-accent)}
a:focus-visible,button:focus-visible,.hero a:focus-visible,.hero button:focus-visible,.header a:focus-visible,.contact a:focus-visible,.research-flow button:focus-visible,.case-visual:focus-visible{outline-color:var(--site-accent)}
.work-dialog::backdrop{background:color-mix(in srgb,var(--ink-dark) 85%,transparent)}
@media(max-width:560px){.header nav{justify-content:flex-start;gap:12px 18px}.theme-toggle{margin-left:auto}}
/* Rounded website surfaces and a single segmented preferences capsule. */
:root{--site-radius-control:999px;--site-radius-card:16px;--site-radius-panel:24px}
.preferences-capsule{display:inline-flex;align-items:center;gap:0;padding:4px;border:1px solid var(--divider);border-radius:var(--site-radius-control);background:var(--secondary);flex-shrink:0}
.header nav .preferences-capsule .language-switch,.header nav .preferences-capsule .theme-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;margin:0;border:0;border-radius:var(--site-radius-control);background:transparent;color:var(--primary-invert);font-size:14px;line-height:1.3;text-decoration:none}
.preferences-capsule .language-switch::after{content:"";height:18px;width:1px;background:var(--divider);position:absolute;right:-1px;top:50%;transform:translateY(-50%)}
.preferences-capsule .language-switch{position:relative}
.header nav .preferences-capsule .language-switch:hover,.header nav .preferences-capsule .theme-toggle:hover{background:var(--site-hover)}
.preferences-capsule :focus-visible{outline-offset:-3px}
.button,.network-controls button,.hero .network-controls button,.demo-tabs button,.draft-label,.work-dialog button,.skip-link{border-radius:var(--site-radius-control)}
.project-brief,.product-demo,.work-dialog{border-radius:var(--site-radius-panel)}
.case-visual,.demo-node,.demo-detail,.viewer-image,.portfolio-overview img{border-radius:var(--site-radius-card)}
.case-visual img,.viewer-image img{border-radius:var(--radius-8)}
.case-visual,.viewer-image{overflow:hidden}
@media(max-width:560px){.header nav{gap:12px 18px}.preferences-capsule{margin-left:auto}.header nav .preferences-capsule .language-switch,.header nav .preferences-capsule .theme-toggle{padding-inline:12px}.project-brief,.product-demo,.work-dialog{border-radius:20px}}
@media(max-width:380px){.preferences-capsule{margin-left:0}}