@font-face{font-family:Manrope;src:url('/assets/fonts/manrope-variable.woff2') format('woff2');font-weight:200 800;font-display:swap}@font-face{font-family:Mono;src:url('/assets/fonts/ibm-plex-mono-regular.woff2') format('woff2');font-display:swap}@font-face{font-family:Legal;src:url('/assets/fonts/noto-sans-tc-legal.woff2') format('woff2');font-display:swap}
:root{color-scheme:dark;--void:#09090b;--pearl:#f6f4f7;--orbit:#c4b5fd;--edge:#333138;--muted:#aaa7b1}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--void);color:var(--pearl);font:16px/1.65 Manrope,Arial,sans-serif}a{color:inherit;text-underline-offset:4px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--orbit);outline-offset:6px}img{max-width:100%;display:block}h1,h2,h3,p{margin:0}h1,h2{font-weight:400;letter-spacing:-.055em;line-height:1.02}h1{font-size:clamp(60px,7.8vw,118px)}h1 span{color:var(--orbit)}h2{font-size:clamp(40px,5vw,68px)}h3{font-size:17px;font-weight:500;letter-spacing:-.02em}.skip{position:absolute;top:-100px;left:20px;background:var(--orbit);color:var(--void);padding:10px;z-index:9}.skip:focus{top:10px}header,main,footer{max-width:1440px;margin:auto}header{padding:28px 64px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--edge);gap:24px}header nav{display:flex;gap:28px;font-size:14px}header nav a{text-decoration:none}section{margin:0 64px;padding:100px 0;border-bottom:1px solid var(--edge)}.hero{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding-top:76px}.eyebrow{font:12px/1.6 Mono,monospace;letter-spacing:.08em;color:var(--muted);margin-bottom:30px}.intro{max-width:490px;margin-top:32px;color:var(--muted);font-size:19px}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:30px}.primary,.secondary{padding:14px 24px;min-height:50px;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:50px;text-decoration:none;line-height:1.4;font-size:14px;font-weight:600}.primary{color:var(--void);background:var(--orbit)}.primary:hover{background:#d8ceff}.secondary{color:var(--pearl);background:transparent;border-color:var(--edge)}.secondary:hover{border-color:var(--muted)}.text-link{font-size:13px}.hero-art{align-self:center;display:flex;flex-direction:column;justify-content:center;min-width:0}.hero-art img{width:100%;height:auto;aspect-ratio:1/1.1;object-fit:cover}.hero-art p{font:11px/1.5 Mono,monospace;color:var(--muted);margin-top:22px}.section-title{max-width:780px;margin-bottom:38px}.section-title>p:last-child:not(.eyebrow){color:var(--muted);margin-top:24px;max-width:620px}.swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}.swatch{color:var(--pearl);background:transparent;border:0;padding:0;text-align:left}.swatch>span{display:block;width:100%;height:130px;border:1px solid #45424c;margin-bottom:16px;transition:transform .2s}.swatch:hover>span{transform:translateY(-5px)}.swatch strong{display:block;font-weight:400}.swatch small{display:flex;justify-content:space-between;font:12px/1.7 Mono,monospace;color:var(--muted);margin-top:8px}.note{font-size:13px;color:var(--muted);margin-top:24px}.signature-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:64px}.signature-section>div{min-width:0}.signature-section h2{margin-bottom:28px}.signature-section>div>p:not(.eyebrow):not(.note){max-width:450px;color:var(--muted)}#signature-preview{color-scheme:light;background:white;color:#09090b;padding:28px;border-radius:2px;overflow-wrap:anywhere}#signature-preview table{max-width:100%;width:100%}#signature-preview img{max-width:100%;height:auto}.workspace{display:flex;align-items:center;gap:24px;margin-top:30px}.workspace>img{width:160px;height:66px;object-fit:contain}.workspace p,.workspace a{font-size:12px;color:var(--muted)}.workspace a{display:inline-block;margin-right:14px;margin-top:8px}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters button{color:var(--muted);border:1px solid var(--edge);background:transparent;padding:9px 20px;border-radius:40px;font-size:14px}.filters button[aria-pressed=true]{color:var(--void);background:var(--pearl);border-color:var(--pearl)}.asset-count{font:11px/1.5 Mono,monospace;color:var(--muted);margin:24px 0}.asset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 24px}.asset[hidden]{display:none}.asset{min-width:0}.asset-image{display:flex;align-items:center;justify-content:center;background:#17171b;aspect-ratio:1/1;border:1px solid var(--edge);padding:18px;overflow:hidden}.asset-image.light{background:var(--pearl)}.asset-image img{width:100%;height:100%;object-fit:contain;transition:transform .25s}.asset-image:hover img{transform:scale(1.025)}.asset-caption{display:flex;gap:14px;padding-top:16px;align-items:flex-start}.asset-caption>div{flex:1;min-width:0}.asset-caption p{font:11px/1.6 Mono,monospace;color:var(--muted);margin-top:5px}.asset-caption>a{font-size:11px;white-space:nowrap}.closing{display:flex;align-items:center;justify-content:space-between;gap:40px}.closing h2{font-size:clamp(38px,4.8vw,68px)}footer{padding:38px 64px 60px;color:var(--muted);font-size:12px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between}footer p:nth-child(2){max-width:560px}footer span[lang]{font-family:Legal,sans-serif}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:var(--pearl);color:var(--void);padding:12px 24px;border-radius:30px;box-shadow:0 8px 40px #0006;font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:calc(100vw - 32px);text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}
@media(max-width:1000px){header{padding:24px 32px}section{margin:0 32px;padding:72px 0}.hero{gap:32px}.signature-section{grid-template-columns:1fr;gap:40px}.asset-grid{grid-template-columns:repeat(2,1fr)}footer{padding:32px}.swatches{gap:12px}.swatch>span{height:100px}.closing{flex-wrap:wrap}.closing img{width:64px;height:auto}}
@media(max-width:620px){header{padding:20px;align-items:flex-start}header img{width:160px;height:auto}header nav{flex-direction:column;gap:8px;text-align:right;font-size:12px}.hero{grid-template-columns:1fr;padding-top:48px}.hero-art img{aspect-ratio:4/3}.hero-art p{font-size:10px}section{margin:0 20px;padding:56px 0}.eyebrow{font-size:10px;margin-bottom:22px}.intro{font-size:17px}.swatches{grid-template-columns:repeat(3,1fr);row-gap:24px}.signature-section{gap:32px}#signature-preview{padding:18px}.workspace{align-items:flex-start;gap:16px}.workspace>img{width:120px;height:auto}.asset-grid{gap:32px 16px}.asset-image{padding:8px}.asset-caption{flex-wrap:wrap;gap:10px}.asset-caption>div{flex-basis:100%}.asset-caption h3{font-size:14px}.asset-caption p{font-size:10px}.filters{gap:8px}.filters button{padding:8px 15px;font-size:12px}.closing{gap:24px}.closing h2{flex:1}.closing .primary{width:100%}footer{padding:30px 20px}.primary,.secondary{font-size:13px}.actions{align-items:stretch}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
