/* Appearance semantics and controls; business modules consume color tokens. */
:root{color-scheme:light;--panel:#fff;--action-fill:#245dde;--overlay-fill:#202b3c;--scroll-track:#edf1f6;--scroll-thumb:#7c899e;--scroll-thumb-hover:#566880;--focus-ring:#245dde66}
@media screen{
  html[data-theme="dark"]{color-scheme:dark;--accent:#8db2ff;--accent-soft:#213757;--ink:#dce5f2;--muted:#a8b6ca;--line:#384659;--surface:#121a25;--sidebar:#101824;--panel:#1c2634;--action-fill:#245dde;--overlay-fill:#28364b;--scroll-track:#17202c;--scroll-thumb:#62738d;--scroll-thumb-hover:#8092ad;--focus-ring:#8db2ff77}
  html[data-theme="dark"] dialog::backdrop{background:rgb(0 0 0 / .65)}
}
html,body,:where(*){scrollbar-color:var(--scroll-thumb) var(--scroll-track)!important;scrollbar-width:thin}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:var(--scroll-track)!important}
::-webkit-scrollbar-thumb{background:var(--scroll-thumb)!important;border:3px solid var(--scroll-track)!important;border-radius:8px;min-height:24px;min-width:24px;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:var(--scroll-thumb-hover)!important}
::-webkit-scrollbar-corner{background:var(--scroll-track)!important}
input[type="range"]{appearance:none;accent-color:var(--accent);background:transparent;cursor:pointer}
input[type="range"]::-webkit-slider-runnable-track{height:5px;border-radius:5px;background:var(--scroll-thumb)}
input[type="range"]::-webkit-slider-thumb{appearance:none;width:17px;height:17px;margin-top:-6px;border:2px solid var(--panel);border-radius:50%;background:var(--action-fill);box-shadow:0 0 0 1px var(--accent)}
input[type="range"]::-moz-range-track{height:5px;border-radius:5px;background:var(--scroll-thumb)}
input[type="range"]::-moz-range-progress{height:5px;background:var(--accent)}
input[type="range"]::-moz-range-thumb{width:14px;height:14px;border:2px solid var(--panel);border-radius:50%;background:var(--action-fill)}
input[type="checkbox"],input[type="radio"]{accent-color:var(--action-fill)}
input::file-selector-button{color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:5px 9px;margin-right:10px;cursor:pointer}
.appearance-picker{position:relative;color:var(--ink);flex-shrink:0;font-size:13px}
.appearance-picker summary{display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;list-style:none;min-height:36px;padding:5px 9px;border:1px solid transparent;border-radius:5px;white-space:nowrap}
.appearance-picker summary::-webkit-details-marker{display:none}
.appearance-picker summary:hover,.appearance-picker[open] summary{background:var(--accent-soft);color:var(--accent)}
.appearance-picker summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.appearance-picker [data-appearance-icon]{width:18px;font-size:19px;line-height:1;text-align:center}
.appearance-options{position:absolute;top:calc(100% + 8px);right:0;min-width:176px;z-index:90;padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:7px;box-shadow:0 8px 24px rgb(0 0 0 / .18)}
.appearance-options fieldset{border:0;margin:0;padding:0}
.appearance-options legend{font-size:12px;color:var(--muted);margin-bottom:8px}
.appearance-options label{display:flex;align-items:center;gap:10px;min-height:40px;margin:0;cursor:pointer;white-space:nowrap}
.appearance-options input[type="radio"]{width:16px;height:16px;min-height:0;margin:0;flex-shrink:0}
.appearance-options small{display:block;color:var(--muted);font-size:11px;min-height:18px}
.login-shell{position:relative}
.login-appearance{display:flex;justify-content:flex-end;margin-top:-8px;margin-bottom:8px}
@media(max-width:720px){.appearance-picker summary{min-height:40px;padding:5px 7px}.appearance-caption{display:none}.appearance-options{min-width:180px}.appearance-options label{min-height:44px}}
@media(forced-colors:active){html,body,:where(*){scrollbar-color:auto!important}input[type="range"]{appearance:auto}.appearance-options{border:1px solid CanvasText}}
@media print{html{color-scheme:light}.appearance-picker{display:none!important}}
