:root{
  color-scheme:dark;
  --bg:#08080A;--raise:#111114;--raise-2:#18181C;--ink:#F2F0EE;--ink-2:#C9C7C4;--muted:#8E8D95;--line:#26262B;--line-2:#36363D;
  --pink:#DC1F82;--pink-hi:#E8338F;--blue:#07ADE7;--red:#E60012;--tally:#FF2B2B;--green:#19C37D;
  --en:"Archivo","Noto Sans TC",system-ui,sans-serif;
  --zh:"Archivo","Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif; /* Latin letters and digits always come from Archivo; CJK falls through to Noto */
  --mono:"JetBrains Mono","SFMono-Regular",Menlo,Consolas,monospace;
  --ease:cubic-bezier(.7,0,.2,1);--out:cubic-bezier(.16,1,.3,1);
  --gut:max(clamp(16px,3.6vw,56px),env(safe-area-inset-left,0px));
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink)}
body{font-family:var(--zh);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3,p{margin:0}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
img{display:block;max-width:100%}

/* bilingual lockup: EN + ZH share one optical size */
.lk{display:flex;flex-direction:column;gap:.08em;line-height:1}
.lk .en{font-family:var(--en);font-weight:800;font-stretch:112%;letter-spacing:-.015em;font-size:var(--s,48px);text-transform:uppercase}
.lk .zh{font-family:var(--zh);font-weight:900;letter-spacing:.02em;font-size:calc(var(--s,48px)*.8)}

/* concept navigation bar */
.kb{position:fixed;z-index:900;top:0;left:0;right:0;height:56px;display:flex;align-items:center;gap:14px;padding:0 var(--gut);pointer-events:none;
  background:linear-gradient(rgba(8,8,10,.78),rgba(8,8,10,0))}
.kb>*{pointer-events:auto}
.kb .logo img{height:22px;width:auto}
.kb .nm{display:flex;align-items:baseline;gap:10px;font-size:13px;color:var(--ink-2);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kb .nm b{font-family:var(--en);font-weight:800;color:var(--ink);font-size:13px;letter-spacing:.02em}
.kb .nm i{font-style:normal;color:var(--pink-hi);font-family:var(--en);font-weight:700}
.kb .sp{flex:1}
.kb nav{display:flex;gap:2px}
.kb nav a{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;height:34px;min-width:34px;padding:0 10px;font-size:13px;text-decoration:none;background:rgba(24,24,28,.8);box-shadow:inset 0 0 0 1px var(--line-2)}
.kb nav a:hover{background:var(--pink);box-shadow:none}
@media (max-width:640px){.kb .nm span{display:none}.kb .logo img{height:18px}.kb nav a.all span{display:none}}
