/* Direct language and appearance controls, available on every Web screen. */
:root .topbar{gap:24px}
:root .topbar nav{margin-left:auto;gap:24px}
:root .header-preferences{display:flex;align-items:center;gap:8px;flex-shrink:0}
:root .language-control{position:relative;display:flex;align-items:center;margin:0;color:var(--muted)}
:root .header-preferences svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
:root .language-control>svg{position:absolute;left:10px;pointer-events:none;z-index:1}
:root #language-select{appearance:none;margin:0;padding:8px 24px 8px 34px;width:125px;border:1px solid var(--line);border-radius:10px;background:var(--soft);color:var(--ink);font-size:12px;cursor:pointer;line-height:1.6}
:root .language-control:after{content:"⌄";position:absolute;right:9px;pointer-events:none;font-size:12px}
:root .theme-menu{position:relative}
:root .theme-menu summary{display:grid;place-items:center;list-style:none;width:36px;height:36px;border-radius:10px;cursor:pointer;color:var(--muted)}
:root .theme-menu summary::-webkit-details-marker{display:none}
:root .theme-menu summary:hover,:root .theme-menu[open] summary{background:var(--soft);color:var(--ink)}
:root .theme-menu summary:focus-visible{outline:2px solid var(--green);outline-offset:3px}
:root .theme-menu .theme-sun{display:none;color:var(--gold)}
:root[data-palette="dark"] .theme-menu .theme-sun{display:block}
:root[data-palette="dark"] .theme-menu .theme-moon{display:none}
:root .theme-options{position:absolute;top:45px;right:0;width:175px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:6px;box-shadow:0 12px 40px #00000018;z-index:20}
:root .theme-options button{display:flex;align-items:center;gap:8px;width:100%;border:0;border-radius:7px;padding:9px 12px;text-align:left;background:transparent;color:var(--ink);font-size:12px;font-weight:400;box-shadow:none}
:root .theme-options button:hover{background:var(--soft)}
:root .theme-options button[aria-pressed="true"]{background:var(--soft);color:var(--green);font-weight:600}
:root .theme-options button[aria-pressed="true"]:after{content:"✓";margin-left:auto}
:root .theme-dot{width:12px;height:12px;flex-shrink:0;border:1px solid var(--line);border-radius:50%}
:root .theme-dot.light{background:#f8f9f5}
:root .theme-dot.dark{background:#222737}
:root .theme-dot.vivid{background:#5546e8}
html[data-palette="classic"]{color-scheme:light}
html[data-palette="vivid"]{color-scheme:light}
html[lang="en"] #landing .hero h1{font-size:clamp(35px,3.5vw,49px);letter-spacing:-1.8px}
html[lang="en"] #landing .demo-branch strong{font-size:11px;line-height:1.5}
html[lang="en"] #landing .checkpoint-tag{max-width:72px;white-space:normal;line-height:1.4}
html[lang="en"] #landing .demo-stages button{white-space:normal;line-height:1.5}
html[lang="en"] #landing .checkpoint-heading{flex-wrap:wrap}
@media(max-width:1000px){:root .topbar{gap:12px}:root .topbar nav{gap:12px}:root .brand-cn{display:none}}
@media(max-width:700px){:root .topbar{padding:12px 20px;height:auto;min-height:74px;flex-wrap:wrap}:root .brand{font-size:18px}:root .header-preferences{margin-left:auto}:root .topbar nav{order:3;width:100%;justify-content:flex-end;margin:0}:root #language-select{width:123px}:root .theme-options{width:175px}html[lang="en"] #landing .hero h1{font-size:38px;letter-spacing:-1px}html[lang="en"] #landing .demo-heading h2{font-size:13px}html[lang="en"] #landing .demo-canvas{min-height:438px}}
@media(max-width:360px){:root .topbar{padding-left:14px;padding-right:14px}:root .topbar .brand{font-size:16px}:root .brand-mark{width:27px;height:30px}:root #language-select{width:113px;font-size:11px}}

html[lang="en"] .brand-cn{display:none}