/* Atelier at night. Shared surfaces, not a filter over the light interface. */
:root{color-scheme:light;--action:#6841be;--action-hover:#56339f;--on-action:#fff;--field-line:var(--line);--selection:#d8cbed}
:root[data-theme=dark]{
 color-scheme:dark;
 --bg:#211e25;--sidebar:#28232e;--surface:#2d2932;--ink:#f3edf4;--muted:#c9bfce;--line:#514957;
 --accent:#d0b7fa;--action:#7850b7;--action-hover:#8960c9;--on-action:#fff;--field-line:#8b7d96;--selection:#665078;
 --green:#2d4037;--success:#a6dec1;--warning:#f0ce9c;
 --pastel-0:#40334f;--pastel-1:#2e4053;--pastel-2:#30483c;--pastel-3:#513647;
 --pastel-4:#4d422e;--pastel-5:#354052;--pastel-6:#493650;--pastel-7:#503c30;
 --pastel-8:#294743;--pastel-9:#414730;--pastel-10:#513831;--pastel-11:#403a45;
 --hover-surface:#38323f;--danger-fill:#4b3039;--danger-ink:#ffc6cf;--danger-line:#b88190;
 --warm-surface:#493d2d;--warm-ink:#f0ce9c;--purple-ink:#e2d3f7;--green-ink:#bee2cb;
 --blue-ink:#c9def1;--olive-ink:#dce7bd;--soft-blue:#344459;--soft-peach:#503c30;
 --translucent-surface:#ffffff09;--scroll-thumb:#80718f;--scroll-track:#27222d;
 --preview-line:#657f6d;--preview-border:#a89ab5;
}
html{background:var(--bg);scrollbar-color:var(--scroll-thumb,#c4b4de) var(--bg)}
::selection{background:var(--selection);color:var(--ink)}
.primary{background:var(--action);color:var(--on-action)}.primary:hover{background:var(--action-hover)}
input,select,textarea{border-color:var(--field-line)}
input[type=checkbox],input[type=radio]{accent-color:var(--action)}
html[data-theme=dark] .sidebar nav img,html[data-theme=dark] .brand img,html[data-theme=dark] .access-brand img,html[data-theme=dark] .onboarding-brand img,html[data-theme=dark] .access-icon img{filter:brightness(0) saturate(100%) invert(85%) sepia(15%) saturate(1100%) hue-rotate(211deg)}
html[data-theme=dark] dialog{box-shadow:0 18px 64px #0006}
html[data-theme=dark] dialog::backdrop{background:#100c17bf}
html[data-theme=dark] .personalization-preview .mark{background:#ffffff09}
html[data-theme=dark]{--project-separator:var(--line)}
.appearance-settings{padding:24px 28px;background:var(--surface);border-radius:16px;margin-bottom:24px}
.appearance-settings h2{font-size:21px;line-height:28px;margin-bottom:6px}
.appearance-settings>p{max-width:65ch}
.appearance-choices{border:0;padding:0;margin:20px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.appearance-choice{align-self:stretch;position:relative;display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;min-height:76px;padding:16px;cursor:pointer}
.appearance-choice:has(input:checked){background:var(--tint);border-color:var(--accent)}
.appearance-choice:has(input:focus-visible){outline:3px solid var(--accent);outline-offset:3px}
.appearance-choice input{width:18px;height:18px;min-height:18px;margin:0;flex:0 0 18px}
.appearance-choice>span{display:grid;gap:3px;min-width:0}.appearance-choice strong{font-size:15px;line-height:22px}
.appearance-choice .small{font-size:13px;line-height:18px}
.appearance-choice svg{width:24px;height:24px;flex:0 0 24px;color:var(--accent)}
.appearance-status{margin-top:14px;color:var(--muted);font-size:14px;line-height:21px}
.identity-tools{display:flex;align-items:center;gap:6px}.identity-tools .identity-settings{flex:1;min-width:0}
.identity-profile-row{display:flex;align-items:center;gap:6px;min-width:0}
.identity-profile-row .identity-profile{flex:1;min-width:0;padding:8px;gap:0}
.identity-profile-row .identity-profile>span{min-width:0}.identity-profile-row .identity-profile strong{max-width:100%;font-size:14px}
.identity .theme-toggle{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:8px;color:var(--accent);background:transparent}
.identity .theme-toggle:hover{background:var(--surface)}.theme-toggle svg{width:20px;height:20px}.theme-toggle .theme-sun{display:none}
:root[data-theme=dark] .theme-toggle .theme-moon{display:none}:root[data-theme=dark] .theme-toggle .theme-sun{display:block}
@media(max-width:1100px){.appearance-choice{padding:14px;gap:10px}.appearance-choice svg{display:none}}
@media(max-width:600px){.appearance-settings{padding:22px 20px}.appearance-choices{grid-template-columns:1fr;gap:10px;margin-top:16px}.appearance-choice{min-height:64px;padding:12px 14px}.appearance-choice svg{display:block}.appearance-choice>span{flex:1}}
@media(forced-colors:active){.appearance-choice:has(input:checked){outline:2px solid Highlight}html[data-theme=dark] .sidebar nav img,html[data-theme=dark] .brand img{filter:none}}