@charset "UTF-8";
:root{--paper:var(--primary);--ink:var(--primary-invert);--muted:var(--tertiary);--blue:var(--app-600);--line:var(--quinary-invert);--space:clamp(24px,5vw,80px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.55}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--blue);outline-offset:6px}::selection{background:var(--blue);color:var(--ink-light)}.wrap{width:min(1200px,calc(100% - var(--space)*2));margin-inline:auto}.skip-link{position:fixed;left:16px;top:-100px;padding:12px 20px;background:var(--ink-light);z-index:10}.skip-link:focus{top:16px}.preview-note{background:var(--app-50);color:var(--app-900);padding:10px var(--space);font-size:14px;display:flex;gap:24px}.preview-note span{color:var(--app-900)}.header{display:flex;align-items:center;justify-content:space-between;padding-block:34px}.wordmark{display:inline-flex;align-items:baseline;font-size:25px;line-height:1;font-weight:800;letter-spacing:-1.2px}.wordmark span{font-weight:400;margin-left:5px}.wordmark i{font-size:12px;align-self:start;margin-left:5px;font-style:normal}.header nav{display:flex;gap:36px;font-size:14px}.header nav a:hover,.footer a:hover{text-decoration:underline;text-underline-offset:6px}.hero{padding-top:70px}.eyebrow{text-transform:uppercase;font-size:14px;letter-spacing:.1em;line-height:1.5;font-weight:500}h1,h2,h3,p{margin:0}h1{font-size:clamp(58px,8.5vw,116px);line-height:1.02;letter-spacing:-.065em;margin-block:28px 42px;font-weight:600}h1 span{color:var(--blue)}.hero-bottom{display:flex;justify-content:space-between;align-items:center;gap:40px}.hero-bottom p{font-size:20px;max-width:440px;line-height:1.5;color:var(--muted)}.actions{display:flex;gap:12px;flex-wrap:wrap}.button{padding:16px 26px;min-height:56px;font-size:16px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--ink);transition:background .15s,color .15s}.primary{background:var(--ink);color:var(--ink-light)}.primary:hover{background:var(--blue);border-color:var(--blue)}.secondary:hover{background:var(--ink-light)}.hero-meta{margin-top:72px;padding-block:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:14px;color:var(--muted)}.expertise,.work{padding-block:100px}.section-heading{display:grid;grid-template-columns:1fr 2fr;gap:40px;margin-bottom:28px}h2{font-size:clamp(34px,4vw,54px);line-height:1.1;letter-spacing:-.045em;font-weight:500}.draft-caption{font-size:14px;color:var(--muted)}.focus-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin-top:48px}.focus-grid article{border-top:1px solid var(--ink);padding-top:22px}.index{font-size:14px;color:var(--blue)}h3{font-size:25px;font-weight:500;letter-spacing:-.03em;line-height:1.2}.focus-grid h3{margin-block:30px 16px}.focus-grid p{color:var(--muted);max-width:310px}.building{background:var(--ink);color:var(--paper);padding-block:90px}.building-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.building h2{margin-block:26px}.building p{color:var(--senary-invert);max-width:400px}.draft-label{display:inline-block;font-size:14px;border:1px solid var(--divider);padding:6px 12px;margin-top:28px}.project-brief{border:1px solid var(--tertiary);padding:32px}.project-brief h3{font-size:20px}.project-brief dl{margin:24px 0}.project-brief dl div{padding-block:16px;border-top:1px solid var(--secondary)}.project-brief dt{font-size:14px;color:var(--senary-invert);margin-bottom:5px}.project-brief dd{margin:0;font-size:16px}.project-brief>p{font-size:14px}.work-placeholder{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:60px 36px;display:grid;grid-template-columns:1fr 2fr;gap:40px;align-items:center;margin-top:48px}.placeholder-plus{font-size:94px;font-weight:200;color:var(--blue);line-height:1;text-align:center}.work-placeholder h3{font-size:32px;margin-bottom:16px}.work-placeholder p{max-width:430px;color:var(--muted);margin-bottom:20px}.about{display:grid;grid-template-columns:1fr 2fr;gap:40px;border-top:1px solid var(--line);padding-block:80px 100px}.about h2{margin-bottom:28px}.about p{max-width:600px;font-size:20px;color:var(--muted)}.about .draft-caption{font-size:14px;margin-top:22px}.contact{background:var(--blue);color:var(--ink-light);padding-block:72px 28px}.contact h2{font-size:clamp(48px,6vw,82px);margin-block:36px;letter-spacing:-.055em}.email{font-size:clamp(18px,2.7vw,32px);display:inline-block;border-bottom:1px solid var(--app-200);padding-bottom:5px;overflow-wrap:anywhere}.email:hover{border-color:var(--ink-light)}.contact a:focus-visible{outline-color:var(--ink-light)}.contact-bottom{display:flex;justify-content:space-between;border-top:1px solid var(--app-400);margin-top:72px;padding-top:20px;font-size:14px}.footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:34px}.footer .wordmark{font-size:20px}.footer p,.footer>a:last-child{font-size:14px;color:var(--muted)}
@media(max-width:800px){.hero{padding-top:44px}.hero-bottom{align-items:flex-start;flex-direction:column;gap:28px}.hero-meta span:nth-child(2){display:none}.section-heading,.about{grid-template-columns:1fr;gap:24px}.focus-grid{gap:24px}.building-grid{gap:40px}.expertise,.work{padding-block:70px}.building{padding-block:64px}.project-brief{padding:24px}.building h2{font-size:36px}}
@media(max-width:560px){:root{--space:24px}.preview-note{flex-direction:column;gap:2px;padding-block:10px}.header{padding-block:26px}.wordmark{font-size:21px}.header nav{gap:16px}.hero{padding-top:36px}.hero .eyebrow{font-size:12px;letter-spacing:.06em}h1{font-size:clamp(48px,12.8vw,72px);margin-block:24px 30px}.hero-bottom p{font-size:18px}.actions{width:100%}.button{padding-inline:20px}.hero-meta{margin-top:48px;font-size:12px}.focus-grid,.building-grid{grid-template-columns:1fr}.focus-grid{gap:32px}.focus-grid h3{margin-top:16px}.focus-grid p{max-width:none}.work-placeholder{grid-template-columns:1fr;padding:36px 0;gap:24px}.placeholder-plus{text-align:left;font-size:64px}.about{padding-block:60px}.about p{font-size:18px}.contact{padding-top:60px}.contact-bottom{gap:20px;margin-top:56px}.footer{flex-wrap:wrap;padding-block:28px}.footer .wordmark{width:100%}.footer>a:last-child{margin-left:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.portfolio-overview{margin:48px 0 0}.portfolio-overview img{display:block;width:100%;height:auto}.portfolio-overview figcaption{font-size:14px;color:var(--muted);margin-top:14px}.project-list{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:36px}.project-list article{border-top:1px solid var(--line);padding-top:20px}.project-list h3{margin:16px 0 12px}.project-list p{color:var(--muted);font-size:14px}@media(max-width:800px){.project-list{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.project-list{grid-template-columns:1fr}}

.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:48px}.case-visual{display:flex;justify-content:center;align-items:center;background:var(--secondary-invert);padding:32px;min-height:430px;margin-bottom:24px}.case-visual img{display:block;width:100%;max-width:240px;height:auto}.case .eyebrow{font-size:12px;color:var(--muted);margin-bottom:12px}.case h3{font-size:30px;margin-bottom:12px}.case>p:last-child{color:var(--muted)}@media(max-width:800px){.case-grid{grid-template-columns:1fr}.case-visual{min-height:0;padding:36px}.case-visual img{max-width:280px}}

.data-landscape{margin:52px 0 0;color:var(--blue);border-top:1px solid var(--line);padding-top:20px}.landscape-label{display:flex;justify-content:space-between;gap:16px;font-size:14px}.data-landscape svg{display:block;width:100%;height:auto;margin:24px 0}.data-landscape figcaption{font-size:14px;color:var(--muted)}.data-landscape+.hero-meta{margin-top:28px}.research-flow{list-style:none;padding:0;margin:28px 0;display:grid;grid-template-columns:1fr 1fr;gap:16px;counter-reset:flow}.research-flow li{counter-increment:flow;border-left:2px solid var(--app-300);padding:8px 12px;font-size:14px}.research-flow li:before{content:"0" counter(flow);display:block;color:var(--app-200);margin-bottom:6px;font-size:14px}@media(max-width:560px){.landscape-label{flex-direction:column;gap:8px}.data-landscape svg{min-height:100px}.research-flow{grid-template-columns:1fr}.hero .eyebrow{font-size:14px}}

button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid var(--blue);outline-offset:5px}.network-controls{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}.network-controls button{border:1px solid var(--line);background:transparent;color:var(--ink);padding:10px 16px;font-size:14px;min-height:44px}.network-controls button[aria-pressed=true]{background:var(--blue);border-color:var(--blue);color:var(--ink-light)}.data-landscape svg{transform:translateX(var(--pointer-x,0px));transition:transform .2s}.data-landscape circle{transition:opacity .2s,stroke-width .2s}.node-muted{opacity:.18}.node-selected{stroke:var(--blue);stroke-width:8;stroke-opacity:.2}.research-flow button{color:inherit;background:transparent;border:0;text-align:left;padding:8px 0;width:100%;min-height:44px}.research-flow button[aria-pressed=true]{color:var(--app-100);text-decoration:underline;text-underline-offset:6px}.research-flow button:focus-visible{outline-color:var(--app-100)}.flow-detail{min-height:80px;border-bottom:1px solid var(--secondary);padding-bottom:20px}.case-visual{transition:background .2s}.case-visual:hover{background:var(--app-100)}.case-visual img{transition:transform .25s}.case-visual:hover img{transform:translateY(-6px)}.work-dialog{width:min(900px,calc(100% - 32px));max-height:90dvh;padding:24px;background:var(--paper);color:var(--ink);border:0;overflow:auto}.work-dialog::backdrop{background:color-mix(in srgb, var(--primary) 80%, transparent)}.viewer-toolbar,.viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:20px}.viewer-toolbar h2{font-size:26px}.work-dialog button{background:transparent;border:1px solid var(--line);padding:10px 16px;min-height:44px}.work-dialog button:hover{background:var(--ink);color:var(--ink-light)}.viewer-image{display:flex;justify-content:center;padding:24px 0}.viewer-image img{max-width:100%;max-height:65dvh;object-fit:contain}.viewer-count{font-size:14px}@media(prefers-reduced-motion:reduce){.data-landscape svg,.case-visual:hover img{transform:none}}
/* Dark opening inspired by the immersive contrast of the Crow reference. */
body{background:var(--secondary-invert)}.preview-note{background:var(--primary);color:var(--app-100)}.preview-note span{color:var(--senary-invert)}.header{width:100%;padding-inline:max(var(--space),calc((100vw - 1200px)/2));background:var(--primary);color:var(--primary-invert);border-bottom:1px solid var(--app-950)}.hero{width:100%;padding-inline:max(var(--space),calc((100vw - 1200px)/2));background:var(--primary);color:var(--primary-invert);padding-bottom:20px;overflow:hidden}.hero>.eyebrow{color:var(--app-300);font-family:monospace;letter-spacing:.12em}.hero h1{font-size:clamp(52px,8vw,110px);font-weight:700;letter-spacing:-.06em}.hero h1 span{color:var(--app-300);text-shadow:0 0 44px color-mix(in srgb, var(--app-500) 22.0%, transparent)}.hero-bottom p{color:var(--quinary-invert)}.hero .primary{background:var(--app-300);border-color:var(--app-300);color:var(--primary)}.hero .primary:hover{background:var(--app-100)}.hero .secondary{border-color:var(--divider);color:var(--primary-invert)}.hero .secondary:hover{background:var(--app-950)}.hero a:focus-visible,.hero button:focus-visible,.header a:focus-visible{outline-color:var(--app-200)}.hero .data-landscape{border-color:var(--divider);color:var(--app-300);background-image:linear-gradient(color-mix(in srgb, var(--app-400) 4.7%, transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb, var(--app-400) 4.7%, transparent) 1px,transparent 1px);background-size:32px 32px;padding:22px 0 14px}.hero .data-landscape svg{filter:drop-shadow(0 0 10px color-mix(in srgb, var(--app-300) 33.3%, transparent))}.hero .data-landscape figcaption{color:var(--quinary-invert)}.hero .network-controls button{border-color:var(--divider);color:var(--app-100);background:var(--primary)}.hero .network-controls button:hover{border-color:var(--app-200)}.hero .network-controls button[aria-pressed=true]{background:var(--app-300);color:var(--primary);border-color:var(--app-300)}.hero .node-selected{stroke:var(--app-200)}.hero-meta{border-color:var(--divider);color:var(--quinary-invert)}.landscape-label{font-family:monospace}.building{background:var(--secondary)}.contact{background:var(--app-700)}.case-visual{background:var(--secondary-invert)}.contact h2{font-weight:600}@media(max-width:560px){.hero h1{font-size:clamp(44px,11.8vw,66px)}.header{padding-block:26px}.hero{padding-top:36px}}
/* Unified dark palette across every section and interaction state. */
:root{--paper:var(--primary);--ink:var(--primary-invert);--muted:var(--quinary-invert);--blue:var(--app-300);--line:var(--divider)}body{background:var(--paper);color:var(--ink)}::selection{background:var(--app-300);color:var(--primary)}.skip-link{background:var(--app-950);color:var(--primary-invert)}.expertise,.work,.about,.footer{background:var(--paper)}.expertise .focus-grid article{border-color:var(--divider)}.index{color:var(--app-300)}.building{background:var(--secondary);border-block:1px solid var(--divider)}.building p{color:var(--quinary-invert)}.project-brief{background:var(--app-950);border-color:var(--divider)}.project-brief dl div{border-color:var(--divider)}.project-brief dt{color:var(--quinary-invert)}.draft-label{border-color:var(--divider);color:var(--app-100)}.case-visual{background:var(--secondary);border:1px solid var(--divider)}.case-visual:hover{background:var(--app-900);border-color:var(--app-300)}.case-visual:focus-visible{outline-color:var(--app-200)}.contact{background:var(--app-950);border-block:1px solid var(--app-800)}.contact .eyebrow{color:var(--app-100)}.email{border-color:var(--app-300);color:var(--app-100)}.contact-bottom{border-color:var(--app-800);color:var(--app-200)}.footer{color:var(--app-100)}.work-dialog{background:var(--secondary);color:var(--primary-invert);border:1px solid var(--divider);box-shadow:0 24px 100px color-mix(in srgb, var(--primary) 53.3%, transparent)}.work-dialog::backdrop{background:color-mix(in srgb, var(--primary) 87.5%, transparent)}.work-dialog button{border-color:var(--divider);color:var(--app-100)}.work-dialog button:hover{background:var(--app-300);border-color:var(--app-300);color:var(--primary)}.viewer-image{background:var(--app-950);margin-block:20px}.viewer-count{color:var(--quinary-invert)}.network-controls button{background:var(--app-950);color:var(--app-100);border-color:var(--divider)}.network-controls button[aria-pressed=true]{background:var(--app-300);color:var(--primary);border-color:var(--app-300)}.research-flow button[aria-pressed=true]{color:var(--app-100)}.flow-detail{border-color:var(--divider)}.focus-grid article:hover{border-color:var(--app-300)}.footer a:hover,.header nav a:hover{color:var(--app-200)}.hero .primary:hover{color:var(--primary)}.primary{background:var(--app-300);color:var(--primary);border-color:var(--app-300)}.primary:hover{background:var(--app-100);color:var(--primary);border-color:var(--app-100)}.secondary:hover{background:var(--app-900)}.preview-note{border-bottom:1px solid var(--divider)}
/* Dark surfaces must use foreground tokens, never the background token. */
:root{color-scheme:dark}.building,.project-brief,.building h2,.project-brief h3,.project-brief dd,.research-flow{color:var(--primary-invert)}.project-brief dt,.building p{color:var(--quinary-invert)}

/* Bilingual navigation and Traditional Chinese typography. */
.header nav{align-items:center;flex-wrap:wrap}.language-switch{border:1px solid var(--divider);padding:8px 12px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
html[lang="zh-Hant"] body{font-family:Arial,"PingFang TC","Microsoft JhengHei",sans-serif}
html[lang="zh-Hant"] h1,html[lang="zh-Hant"] h2,html[lang="zh-Hant"] h3{letter-spacing:.01em;line-height:1.25}
html[lang="zh-Hant"] .hero h1{font-size:clamp(36px,6.3vw,84px)}
html[lang="zh-Hant"] .eyebrow{letter-spacing:.05em}
@media(max-width:560px){.header{flex-wrap:wrap;gap:20px}.header nav{gap:18px;width:100%;justify-content:space-between}.header nav a{min-height:44px;display:inline-flex;align-items:center}html[lang="zh-Hant"] .hero h1{font-size:clamp(27px,7vw,40px)}html[lang="zh-Hant"] .contact h2{font-size:clamp(36px,10vw,52px)}}

/* Site colour roles mapped to the supplied kit; layout and type stay unchanged. */
:root{--paper:var(--primary);--ink:var(--primary-invert);--muted:var(--quinary-invert);--blue:var(--app-300);--line:var(--divider)}
body,.header,.hero{background:var(--primary);color:var(--primary-invert)}
.hero-bottom p,.data-landscape figcaption,.building p,.project-brief dt,.hero-meta{color:var(--quinary-invert)}
.primary,.hero .primary,.network-controls button[aria-pressed=true],.hero .network-controls button[aria-pressed=true]{background:var(--app-700);border-color:var(--app-700);color:var(--ink-on-app)}
.primary:hover,.hero .primary:hover{background:var(--app-800);border-color:var(--app-800);color:var(--ink-on-app)}
.work-dialog button:hover{background:var(--app-700);color:var(--ink-on-app)}
.hero h1 span{color:var(--app-300)}
.data-landscape svg{filter:none}.hero .node-selected{stroke:var(--app-300)}
.product-preview{padding-block:90px;border-bottom:1px solid var(--divider)}.preview-intro{max-width:680px;color:var(--quinary-invert);font-size:18px;margin-bottom:32px}.product-demo{border:1px solid var(--divider);background:var(--app-950);padding:28px;border-radius:var(--radius-8)}.demo-top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid var(--divider)}.demo-top strong{font-size:20px}.demo-top span,.preview-caption{font-size:14px;color:var(--quinary-invert)}.demo-tabs{display:flex;gap:12px;flex-wrap:wrap;margin-block:24px 16px}.demo-tabs button{padding:10px 16px;min-height:44px;background:var(--secondary);color:var(--primary-invert);border:1px solid var(--divider);border-radius:var(--radius-4)}.demo-tabs button[aria-pressed=true]{background:var(--app-700);color:var(--ink-on-app);border-color:var(--app-700)}.demo-guide{color:var(--quinary-invert);min-height:48px;margin-bottom:20px}.demo-layout{display:grid;gap:24px}.demo-layout.with-detail{grid-template-columns:2fr 1fr}.demo-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.demo-group h3{font-size:18px;margin-bottom:20px}.demo-group h3 span{color:var(--app-300);font-family:var(--font-mono);font-size:14px}.demo-node{display:flex;flex-direction:column;gap:12px;width:100%;padding:20px;text-align:left;background:var(--primary);color:var(--primary-invert);border:1px solid var(--divider);border-radius:var(--radius-8);margin-bottom:16px;min-height:150px}.demo-node strong{font-size:18px}.demo-node small,.demo-node-role{font-size:14px;color:var(--quinary-invert)}.demo-node:hover{background:var(--app-900)}.demo-node[data-relation=selected]{outline:2px solid var(--app-300);outline-offset:2px}.demo-node[data-relation=upstream]{border:2px solid var(--chart-1)}.demo-node[data-relation=downstream]{border:2px solid var(--chart-2)}.demo-node[data-relation=unrelated]{opacity:.5}.demo-detail{padding:24px;background:var(--secondary);border:1px solid var(--divider);border-radius:var(--radius-8)}.demo-detail h3{font-size:24px;margin-block:16px}.demo-detail p,.demo-detail dt{color:var(--quinary-invert)}.demo-detail dt{font-size:14px;margin-top:24px}.demo-detail dd{margin:8px 0}.demo-legend{display:flex;gap:24px;flex-wrap:wrap;font-size:14px;margin-top:20px}.demo-legend span{border-left:3px solid var(--app-300);padding-left:8px}.demo-legend span:nth-child(2){border-color:var(--chart-1)}.demo-legend span:nth-child(3){border-color:var(--chart-2)}.preview-caption{margin-top:16px;max-width:800px}[hidden]{display:none!important}@media(max-width:900px){.demo-layout.with-detail{grid-template-columns:1fr}.demo-node{padding:16px}.demo-map{gap:12px}}@media(max-width:560px){.product-preview{padding-block:60px}.product-demo{padding:20px}.demo-map{grid-template-columns:1fr}.demo-group{display:grid;grid-template-columns:1fr 1fr;gap:12px}.demo-group h3{grid-column:1/-1;margin-bottom:0}.demo-node{min-height:140px;margin-bottom:8px}.demo-node strong{font-size:16px}}