/* Browser theme controls share the same semantic surface tokens. */
:root { color-scheme: light; }
[data-theme="dark"] { color-scheme: dark; }
@media (prefers-color-scheme:dark) { :root:not([data-theme="light"]) { color-scheme:dark; } }
.nav { gap:16px; }
.theme-preference { display:flex; align-items:center; gap:8px; font-size:.85rem; color:var(--ink); order:3; }
.theme-preference select { font:inherit; color:var(--ink); background:var(--card); border:1px solid var(--line); border-radius:8px; padding:8px; min-height:44px; max-width:120px; }
.menu-toggle { background:var(--card); color:var(--ink); }
.btn-ghost-dark { color:var(--ink); border-color:var(--ink); }
@media(max-width:1100px) { .menu { gap:14px; } .brand .bl { display:none; } }
@media(max-width:960px) { .theme-preference { order:0; margin-left:auto; } .theme-preference span { display:none; } .menu { order:4; } .menu-toggle { margin-left:0; } }
@media(max-width:360px) { .nav { gap:8px; } .theme-preference select { width:96px; } .menu-toggle { padding:8px; } }