:root{--paper: oklch(96.5% .012 85);--ink: oklch(22% .02 60);--ink-2: oklch(42% .02 60);--rule: oklch(82% .02 80);--accent: oklch(50% .14 35);--accent-ink: oklch(97% .01 85);--gate: oklch(25% .03 55);--gate-line: oklch(88% .035 85);--gate-accent: oklch(70% .15 42);--serif: "Noto Serif TC", "Songti TC", Georgia, serif;--sans: "Noto Sans TC", system-ui, sans-serif;--ease: cubic-bezier(.16, 1, .3, 1);--gutter: clamp(20px, 5vw, 72px);--inset: max(var(--gutter), calc((100vw - 1720px)/2) );color-scheme:light dark}@media (prefers-color-scheme: dark){:root{--paper: oklch(17% .012 60);--ink: oklch(94% .012 85);--ink-2: oklch(76% .014 80);--rule: oklch(32% .015 60);--accent: oklch(72% .13 40);--accent-ink: oklch(17% .012 60);--gate: oklch(30% .03 55)}}:root[data-gate=navy]{--gate: oklch(24% .05 262)}@media (prefers-color-scheme: dark){:root[data-gate=navy]{--paper: oklch(17% .02 262);--rule: oklch(32% .025 262);--accent-ink: oklch(17% .02 262);--gate: oklch(32% .05 262)}}*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font:400 1.0625rem/1.85 var(--sans);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}::selection{background:var(--accent);color:var(--accent-ink)}a{color:inherit;text-underline-offset:.3em}:focus-visible{outline:2px solid var(--accent);outline-offset:4px}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--paper)}::-webkit-scrollbar-thumb{background:var(--rule);border-radius:5px}h1,h2,h3{font-family:var(--serif);text-wrap:balance}.state{padding:20vh var(--inset);color:var(--ink-2)}.retry{margin-top:20px;min-height:44px;padding:0 24px;cursor:pointer;font:500 1rem var(--sans);color:var(--accent-ink);background:var(--accent);border:0;border-radius:999px}.skip{position:absolute;left:16px;top:-64px;z-index:10;padding:10px 18px;border-radius:999px;text-decoration:none;font-weight:500;background:var(--accent);color:var(--accent-ink)}.skip:focus{top:12px}.bar{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:12px var(--inset);background:color-mix(in oklch,var(--paper) 86%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.bar__brand{display:inline-flex;align-items:center;min-height:44px;font:900 1.25rem var(--serif);text-decoration:none;letter-spacing:.02em}.bar nav{display:flex;align-items:center;gap:12px;font-size:.9375rem}.bar nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;color:var(--ink-2);text-decoration:none}.bar nav a:hover{color:var(--ink);text-decoration:underline}.lang{font:500 .8125rem var(--sans);letter-spacing:.06em;color:var(--ink);background:none;border:1px solid var(--rule);border-radius:999px;padding:0 18px;min-height:44px;cursor:pointer;transition:border-color .2s}.lang:hover{border-color:var(--ink)}.hero{position:relative;overflow:hidden;padding:clamp(80px,17vh,200px) var(--inset) clamp(88px,15vh,180px)}.hero__arches{position:absolute;right:calc(var(--inset) - 20px);bottom:0;height:min(92%,640px);width:auto;fill:none;stroke:var(--rule);stroke-width:1.2}.arch-line{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2s var(--ease) forwards;animation-delay:calc(var(--i) * .2s)}.arch-line:nth-of-type(1){stroke:var(--accent)}.hero__sun{fill:var(--accent);opacity:0;animation:fade 1s ease .9s forwards}@keyframes draw{to{stroke-dashoffset:0}}@keyframes fade{to{opacity:1}}.hero__title,.hero__lead,.hero__cta{position:relative;animation:rise .7s var(--ease) both}.hero__title{font-weight:900;font-size:clamp(2rem,6.4vw,5.5rem);line-height:1.2;letter-spacing:-.01em;max-width:min(9.5em,58%);word-break:auto-phrase}.phrase{display:inline-block}.hero__lead{margin-top:clamp(28px,4vw,48px);max-width:min(33em,58%);font-size:1.1875rem;color:var(--ink-2);animation-delay:.08s}.hero__cta{display:inline-flex;align-items:center;min-height:44px;margin-top:28px;font-weight:500;text-decoration:none;color:var(--accent);border-bottom:1px solid var(--accent);animation-delay:.16s}.hero__cta:hover{border-bottom-width:2px}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.projects{padding:clamp(72px,11vw,140px) var(--inset);border-top:1px solid var(--rule);scroll-margin-top:56px}.projects__intro{max-width:40em}.projects__intro h2{font-size:clamp(1.75rem,3.6vw,3rem);line-height:1.3;font-weight:700}.projects__intro p{margin-top:16px;color:var(--ink-2)}.projects__grid{margin-top:clamp(48px,8vw,96px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,7vw,112px);row-gap:clamp(72px,9vw,140px);align-items:start}.project:nth-child(2n){margin-top:clamp(0px,8vw,120px)}.gate{width:min(100%,360px)}@media (min-width: 1760px){.projects__grid{column-gap:clamp(48px,5vw,96px)}.project{display:grid;grid-template-columns:minmax(200px,260px) minmax(0,1fr);column-gap:clamp(28px,3vw,56px);align-items:start}.project>*{grid-column:2}.project>.gate{grid-column:1;grid-row:1 / span 6;position:sticky;top:96px;width:100%}.project__name{margin-top:0;font-size:clamp(2rem,2.6vw,3rem)}}.gate__svg{display:block;width:100%;height:auto;transition:transform .7s var(--ease)}.project:hover .gate__svg{transform:translateY(-6px)}.art-sun{transition:transform .9s var(--ease);transform-box:fill-box}.project:hover .art-sun{transform:translateY(-14px)}.project__name{margin-top:32px;font-weight:900;font-size:clamp(2.25rem,4.6vw,3.75rem);line-height:1.1;letter-spacing:-.01em;overflow-wrap:anywhere}.project__sub{margin-top:8px;color:var(--accent);font-weight:500}.project__summary{margin-top:24px;max-width:32em}.more{margin-top:12px;max-width:32em}.more summary{display:inline-flex;align-items:center;gap:10px;min-height:44px;list-style:none;cursor:pointer;font-weight:500;font-size:.9375rem}.more summary::-webkit-details-marker{display:none}.more summary:after{content:"";width:7px;height:7px;margin-top:-3px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform .3s var(--ease)}.more[open] summary:after{transform:rotate(-135deg);margin-top:3px}.more summary:hover{color:var(--accent)}.facets{margin-top:8px;display:grid;gap:20px}.facets dt{font-weight:700;font-size:.9375rem;letter-spacing:.04em}.facets dd{margin-top:2px;color:var(--ink-2);font-size:.96875rem;line-height:1.8}.enter{display:inline-flex;align-items:center;gap:10px;margin-top:16px;padding:12px 24px;min-height:44px;background:var(--accent);color:var(--accent-ink);font-weight:500;text-decoration:none;border-radius:999px;box-shadow:0 1px 2px color-mix(in oklch,var(--ink) 25%,transparent);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}a.enter:hover{transform:translateY(-2px);box-shadow:0 10px 20px -8px color-mix(in oklch,var(--ink) 45%,transparent)}a.enter svg{transition:transform .3s var(--ease)}a.enter:hover svg{transform:translate(4px)}.enter--off{background:transparent;color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--rule);cursor:default}.enter--off small{font-size:.8125rem;padding-left:10px;border-left:1px solid var(--rule)}.mission{padding:clamp(72px,11vw,140px) var(--inset);border-top:1px solid var(--rule);scroll-margin-top:56px}.mission h2{font-size:clamp(1.5rem,2.6vw,2.25rem);font-weight:700}.mission ol{list-style:none;padding:0;margin-top:48px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.mission li{padding:0 clamp(16px,3vw,40px);border-left:1px solid var(--rule)}.mission li:first-child{padding-left:0;border-left:0}.mission h3{font-size:clamp(1.25rem,2vw,1.625rem);line-height:1.4;font-weight:700}.mission li p{margin-top:14px;color:var(--ink-2);font-size:.96875rem}.foot{padding:36px var(--inset) 48px;color:var(--ink-2);font-size:.875rem;background:var(--paper)}@media (max-width: 860px){.projects__grid{grid-template-columns:1fr}.project:nth-child(2n){margin-top:0}.mission ol{grid-template-columns:1fr;gap:36px}.mission li,.mission li:first-child{padding:28px 0 0;border-left:0;border-top:1px solid var(--rule)}.hero__title,.hero__lead{max-width:none}.hero__arches{opacity:.3;right:-110px;height:62%}.hero__sun{display:none}.bar nav{gap:2px}.bar nav a{padding:0 8px}}@media (max-width: 560px){.gate{width:min(100%,220px)}.project__name{margin-top:24px}}@media (prefers-reduced-motion: reduce){.hero__title,.hero__lead,.hero__cta{animation:none}.arch-line{animation:none;stroke-dashoffset:0}.hero__sun{animation:none;opacity:1}html{scroll-behavior:auto}.gate__svg,.art-sun,.more summary:after{transition:none}}
