/* Personal accent palettes. Semantic error/success colors stay stable. */
.brand-mark{display:block;flex-shrink:0;--brand-top:var(--accent-top);--brand-bottom:var(--accent)}
.brand-stop-top{stop-color:var(--brand-top)}.brand-stop-bottom{stop-color:var(--brand-bottom)}
.brand-edge{stroke:#fff;stroke-opacity:.35}
:root[data-palette=graphite] .brand-mark{--brand-top:#292c32;--brand-bottom:#111216}
:root[data-palette=graphite][data-theme=dark] .brand-edge{stroke:#d6dbe3;stroke-opacity:.45}
:root{--accent:#1763e6;--accent-top:#2469df;--accent-night:#91baff;--on-accent:#fff;--accent-soft:color-mix(in srgb,var(--accent) 12%,transparent);--accent-ring:color-mix(in srgb,var(--accent) 24%,transparent);--text-link:var(--accent);--blue:var(--accent)}
:root[data-palette=violet]{--accent:#7040cc;--accent-top:#8150d5;--accent-night:#c7acff}
:root[data-palette=emerald]{--accent:#08765d;--accent-top:#12836b;--accent-night:#7bdcbd}
:root[data-palette=rose]{--accent:#b93670;--accent-top:#c13b77;--accent-night:#ffabce}
:root[data-palette=amber]{--accent:#99620b;--accent-top:#a36a10;--accent-night:#f3ca7e}
:root[data-palette=graphite]{--accent:#25282e;--accent-top:#383d45;--accent-night:#d6dbe3}
:root[data-palette=graphite] .wallpaper{filter:grayscale(1)}
:root[data-theme=dark][data-palette=graphite]{--accent:#cbd1d9;--accent-top:#e3e6eb;--on-accent:#20242c}
.submit-button,.settings-module-icon{color:var(--on-accent,#fff)}
:root[data-theme=dark][data-palette=graphite] .category-switch-row input:checked+.category-switch-track:after{background:#20242c}
#palette-toggle{color:var(--text-link);background:color-mix(in srgb,var(--surface-field) 65%,var(--accent-soft));border-color:var(--accent-ring);box-shadow:0 3px 12px var(--accent-soft),inset 0 1px 1px #ffffff30;transition:color .25s,background .25s,border-color .25s,box-shadow .25s,transform .18s}
#palette-toggle:hover{background:var(--accent-soft);box-shadow:0 3px 15px var(--accent-ring)}
.language-flag{display:block;width:30px;height:22px;flex-shrink:0;border-radius:3px;box-shadow:0 0 0 1px #00000012;object-fit:contain}
#language-toggle .language-flag{width:26px;height:20px}
.palette-graphite{--swatch:#25282e;--swatch-light:#cbd1d9}
.wallpaper .orb{filter:blur(2px)}.wallpaper .orb-three{filter:blur(60px)}
:root[data-theme=dark] .wallpaper .orb-one,:root[data-theme=dark] .wallpaper .orb-two{filter:grayscale(1) brightness(.45)}
:root[data-theme=dark]{--text-link:var(--accent-night);--blue:var(--accent-night);--accent-soft:color-mix(in srgb,var(--accent-night) 12%,transparent);--accent-ring:color-mix(in srgb,var(--accent-night) 24%,transparent)}
.submit-button{background:linear-gradient(var(--accent-top),var(--accent));border-color:var(--accent);box-shadow:0 6px 15px var(--accent-ring),inset 0 1px 1px #ffffff4d}
body.in-workspace .settings-module-icon{background:linear-gradient(145deg,var(--accent-top),var(--accent));box-shadow:inset 0 1px 1px #ffffff70,0 8px 18px var(--accent-ring)}
.settings-module-card:nth-child(2) .settings-module-icon{background:linear-gradient(145deg,var(--accent-top),var(--accent))}
#module-navigation a[aria-current=page],.category-tag[aria-pressed=true],.unit-option[aria-pressed=true]{background:var(--accent-soft);border-color:var(--accent-ring);color:var(--text-link)}
.unit-trigger-icon,.unit-dialog-icon,.settings-group-icon,.category-list-icon,.user-avatar{background:var(--accent-soft);color:var(--text-link)}
.person-type input,.customer-active input,.category-active input{accent-color:var(--accent)}
.category-switch-row input:checked+.category-switch-track{background:var(--accent)}
.input-wrap:focus-within,:root[data-theme=dark] .input-wrap:focus-within,.customer-fields input:focus,.customer-fields textarea:focus{border-color:var(--text-link);box-shadow:0 0 0 3px var(--accent-ring)}
button:focus-visible,a:focus-visible{outline-color:var(--text-link)}
.preference-dialog{width:440px;max-width:calc(100% - 28px);animation:feedback-enter .2s ease-out}
.preference-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.preference-symbol{width:48px;height:48px;border-radius:17px;display:grid;place-items:center;background:var(--accent-soft);color:var(--text-link)}
.preference-symbol .icon{width:25px;height:25px}.preference-close{width:44px;height:44px;padding:0;border-radius:50%}
.preference-dialog h2{margin:0 0 8px}.preference-description{margin:0 0 24px;font-size:13px}
.preference-options{display:grid;gap:10px}.palette-options{grid-template-columns:repeat(3,minmax(0,1fr))}
.preference-option{position:relative;display:flex;align-items:center;gap:14px;min-height:62px;padding:16px;border:1px solid var(--line);border-radius:17px;background:var(--surface-field);color:var(--text-primary);text-align:left;transition:border-color .18s,background .18s,transform .18s}
.preference-option strong{font-size:13px;font-weight:600}.preference-option:hover{border-color:var(--text-link)}.preference-option[aria-pressed=true]{background:var(--accent-soft);border-color:var(--text-link)}
.preference-check{display:grid;place-items:center;margin-left:auto;color:var(--text-link)}.preference-check .icon{width:18px;height:18px}
.palette-options .preference-option{flex-direction:column;gap:12px;padding:13px 8px}.palette-options .preference-check{position:absolute;right:5px;top:5px;border-radius:50%;background:var(--surface-field);width:22px;height:22px}
.palette-swatch{display:block;width:36px;height:36px;border-radius:50%;box-shadow:inset 0 1px 2px #ffffff70,0 4px 10px #0001;background:linear-gradient(135deg,var(--swatch-light) 0 50%,var(--swatch) 50%)}
.palette-blue{--swatch:#1763e6;--swatch-light:#91baff}.palette-violet{--swatch:#7040cc;--swatch-light:#c7acff}.palette-emerald{--swatch:#08765d;--swatch-light:#7bdcbd}.palette-rose{--swatch:#b93670;--swatch-light:#ffabce}.palette-amber{--swatch:#99620b;--swatch-light:#f3ca7e}
.preference-dialog .feedback{margin-top:16px;margin-bottom:0}
@media(max-width:600px){.topbar{flex-wrap:wrap;gap:12px}.header-actions{width:100%;justify-content:flex-end}.header-actions .unit-trigger{margin-right:auto;min-width:0;flex:1;max-width:220px}.header-actions .unit-trigger-copy{min-width:0}.palette-options{gap:8px}}
@media(prefers-reduced-motion:reduce){.preference-dialog{animation:none}.preference-option{transition:none}}
@media(prefers-reduced-motion:reduce){#palette-toggle{transition:none}}

/* Shared interaction surfaces and scrollbars follow every personal palette. */
.field-help-wrap{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:end;gap:4px;min-width:0}
.field-help-wrap>label{min-width:0;margin:0}
.field-help-wrap>.field-help-button{display:grid;place-items:center;width:44px;min-width:44px;height:44px;min-height:44px;margin:0;padding:0;border:0;border-radius:10px;background:transparent;color:var(--text-secondary);box-shadow:none;cursor:help}
.field-help-button>.icon{width:15px;height:15px}
.field-help-wrap>.field-help-button:hover{background:var(--surface-hover)}
.field-help-wrap>.field-help-button:active{background:var(--surface-pressed)}
.field-help-wrap>.field-help-button:focus-visible{outline:2px solid var(--text-link);outline-offset:-2px}
:root,:root[data-theme=dark]{
    --surface-hover:color-mix(in srgb,var(--text-link) 9%,transparent);
    --surface-pressed:color-mix(in srgb,var(--text-link) 16%,transparent);
    --scroll-thumb:color-mix(in srgb,var(--text-link) 45%,transparent);
    --scroll-thumb-hover:color-mix(in srgb,var(--text-link) 70%,transparent);
    --surface-field:color-mix(in srgb,var(--text-link) 2%,#fff);
    --surface-field-focus:color-mix(in srgb,var(--text-link) 1%,#fff);
}
:root[data-theme=dark]{
    --surface-field:#242424;
    --surface-field-focus:#2b2b2b;
}
:root[data-theme=dark] #unit-dialog::backdrop{background:#00000080}
:root[data-theme=dark] dialog.settings-panel-detail::backdrop{background:transparent}
#module-navigation a:hover,.settings-row:hover,.category-list-item:hover,
.customer-results tbody tr:hover,.unit-option:hover,.part-supplier-option:hover,
.customer-filter button:not([aria-pressed=true]):hover,.mobile-toast-close:hover{
    background:var(--surface-hover);
}
.settings-row:active{background:var(--surface-pressed)}
:root .glass-button:hover,:root[data-theme=dark] .glass-button:hover{
    background:color-mix(in srgb,var(--text-link) 9%,var(--surface-field));
}
.unit-option:hover,.module-card:hover{border-color:var(--accent-ring)}
#module-navigation a[aria-current]{box-shadow:inset 0 0 0 1px var(--accent-ring)}
.avatar,.module-icon,.unit-option[aria-pressed=true] .unit-option-icon{background:var(--accent-soft)}
.customer-settings input{accent-color:var(--accent)}
.settings-module-card:hover{box-shadow:0 18px 40px var(--accent-soft)}
*{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}
*::-webkit-scrollbar{width:6px;height:6px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:8px}
*::-webkit-scrollbar-thumb:hover,.mobile-dialog-scroll::-webkit-scrollbar-thumb:hover{background:var(--scroll-thumb-hover)}
*::-webkit-scrollbar-button{display:none;width:0;height:0}
/* Neutral primary interactions have a paired foreground/background. Other controls
   retain their semantic foregrounds instead of recoloring every nested badge. */
:root :is(.submit-button,button.primary):is(:disabled,[aria-disabled=true]):not(.mobile-feedback-danger){
    color:var(--text-secondary);
    background:var(--surface-field);
    border-color:var(--line);
    box-shadow:none;
    opacity:1;
    filter:none;
}
:root :is(.submit-button,button.primary):not(:disabled):not([aria-disabled=true]):not(.mobile-feedback-danger):hover{
    color:var(--text-link);
    background:linear-gradient(var(--surface-hover),var(--surface-hover)),var(--surface-field);
    border-color:var(--text-link);
    filter:none;
}
:root :is(.submit-button,button.primary):not(:disabled):not([aria-disabled=true]):not(.mobile-feedback-danger):active{
    color:var(--text-link);
    background:linear-gradient(var(--surface-pressed),var(--surface-pressed)),var(--surface-field);
    border-color:var(--text-link);
    filter:none;
}

/* Compact preference pickers on phones, preserving current-state semantics. */
@media(max-width:700px){
 dialog.preference-dialog{box-sizing:border-box;width:400px;max-width:calc(100vw - 20px);max-height:calc(100dvh - 24px);padding:8px;border-radius:20px}
 .preference-dialog .mobile-dialog-scroll{position:relative;padding:12px;max-height:calc(100dvh - 44px)}
 .preference-dialog .preference-head{position:absolute;right:8px;top:6px;margin:0}
 .preference-dialog .preference-symbol{display:none}
 .preference-dialog .preference-close{width:44px;height:44px;border-radius:12px;box-shadow:none}
 .preference-dialog h2{font-size:20px;line-height:1.3;letter-spacing:-.4px;margin:0 44px 6px 0}
 .preference-dialog .preference-description{font-size:12px;line-height:1.45;margin:0 40px 14px 0}
 .preference-dialog .preference-options{gap:7px}
 .preference-dialog .palette-options{grid-template-columns:repeat(2,minmax(0,1fr))}
 .preference-dialog .preference-option{min-width:0;min-height:48px;padding:10px;gap:10px;border-radius:12px}
 .preference-dialog .preference-option strong{font-size:12px;line-height:1.35;min-width:0;overflow-wrap:anywhere}
 .preference-dialog .palette-options .preference-option{display:grid;grid-template-columns:22px minmax(0,1fr) 16px;gap:6px;padding:9px 8px;min-height:52px}
 .preference-dialog .palette-swatch{width:22px;height:22px;box-shadow:inset 0 1px 2px #ffffff70}
 .preference-dialog .palette-options .preference-check{position:static;width:16px;height:16px;margin:0;background:transparent}
 .preference-dialog .preference-check .icon{width:16px;height:16px}
 .preference-dialog .preference-check[hidden]{display:none}
 .preference-dialog .preference-option[aria-pressed=true]{background:var(--accent-soft);border-color:var(--text-link);box-shadow:inset 0 0 0 1px var(--accent-ring)}
 .preference-dialog .preference-option:focus-visible{outline:2px solid var(--text-link);outline-offset:1px}
 .preference-dialog .preference-option:hover{background:var(--surface-hover)}
 .preference-dialog .preference-option:active{background:var(--surface-pressed)}
 .preference-dialog .language-flag{width:26px;height:20px}
}

/* Persistent, compact context for shortcut filters (not a transient alert). */
.applied-filter-bar{display:flex;align-items:center;justify-content:space-between;gap:8px 12px;padding:4px 10px;border:1px solid var(--accent-ring);border-radius:12px;background:var(--accent-soft);color:var(--text-primary);min-width:0;margin:8px 0}
.applied-filter-bar[hidden]{display:none!important}
.applied-filter-bar>span{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;min-width:0;font-size:12px;line-height:1.4;overflow-wrap:anywhere}
.applied-filter-bar>a{display:flex;align-items:center;justify-content:center;min-height:44px;flex-shrink:0;padding:8px;font-size:11px;color:var(--text-link);text-decoration:none;border-radius:9px}
.applied-filter-bar>a:hover{background:var(--surface-hover)}.applied-filter-bar>a:active{background:var(--surface-pressed)}.applied-filter-bar>a:focus-visible{outline:2px solid var(--text-link);outline-offset:1px}
@media(max-width:700px){.applied-filter-bar{gap:6px;padding:2px 8px}.applied-filter-bar>span{font-size:11px}.applied-filter-bar .os-status{max-width:100%;white-space:normal;overflow-wrap:anywhere}}