.appearance-picker{position:relative;flex:none;margin-inline:2px 7px}
.appearance-toggle{display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid #dce7f1;border-radius:10px;background:#eef4fa;color:#375a75;cursor:pointer;transition:background .18s,border-color .18s,color .18s,transform .18s}
.appearance-toggle:hover{background:#e3edf4;border-color:#b8cbdc;transform:translateY(-1px)}
.appearance-toggle:focus-visible,.appearance-options button:focus-visible{outline:3px solid #37a88f;outline-offset:2px}
.appearance-toggle svg,.appearance-options svg{width:18px;height:18px;flex:none}
.appearance-options{position:absolute;z-index:30;top:calc(100% + 8px);inset-inline-end:0;display:grid;gap:3px;width:172px;padding:6px;border:1px solid #d8e2e9;border-radius:12px;background:#fff;box-shadow:0 18px 38px rgba(23,42,60,.17)}
.appearance-options button{display:flex;align-items:center;gap:10px;width:100%;min-height:36px;padding:7px 9px;border-radius:8px;background:transparent;color:#344a5d;text-align:start;font-size:12px;font-weight:650;cursor:pointer}
.appearance-options button:hover{background:#eef5f5}
.appearance-options button.selected{background:#e9f5f1;color:#137666}
.appearance-options button span{flex:1}
.appearance-options button b{opacity:0;font-size:13px}
.appearance-options button.selected b{opacity:1}
html[data-appearance="mist"] .appearance-toggle{background:#dce2e7;border-color:#cbd3dc;color:#344658}

@media screen{
  html[data-appearance="mist"]{--canvas:#f2f4f6;--line:#dce2e7;--shadow:0 12px 30px rgba(36,49,62,.055)}
  html[data-appearance="mist"] body{background:#edf0f2;color:#263442}
  html[data-appearance="mist"] .app{background:linear-gradient(145deg,#e9edf0,#f3f5f6 48%,#e9edf0)}
  html[data-appearance="mist"] .sidebar{border-color:#d3dbe1;background:linear-gradient(155deg,#f5f6f7,#e7ebee);box-shadow:0 16px 36px rgba(42,54,65,.10)}
  html[data-appearance="mist"] .sidebar:before{background:radial-gradient(circle at 0 0,rgba(255,255,255,.75),transparent 45%)}
  html[data-appearance="mist"] .brand{border-bottom-color:#d7dfe5;color:#243848}
  html[data-appearance="mist"] .brand .logo-mark{background:#fff;border-color:#d8e1e6}
  html[data-appearance="mist"] .section-label,html[data-appearance="mist"] .nav-group summary{color:#677b88}
  html[data-appearance="mist"] .nav-group{border-top-color:#d7dfe5}
  html[data-appearance="mist"] .nav button{color:#435767}
  html[data-appearance="mist"] .nav button>span:first-child{background:#dce4e9;color:#536c7b}
  html[data-appearance="mist"] .nav button:hover{color:#183b4a;background:#dde9e8}
  html[data-appearance="mist"] .nav button.active{color:#145c58;border-color:#bad9d3;background:#fff;box-shadow:0 5px 15px rgba(39,71,68,.10)}
  html[data-appearance="mist"] .nav button.active>span:first-child{background:#d8f0e8;color:#117b68}
  html[data-appearance="mist"] .sidebar-footer{border-top-color:#d7dfe5;color:#738693}
  html[data-appearance="mist"] .main{border-color:#dbe2e7;background:#f6f7f8;box-shadow:0 12px 34px rgba(40,54,66,.055)}
  html[data-appearance="mist"] .topbar{border-color:#dce3e8}
  html[data-appearance="mist"] .search{background:#fff;border-color:#dce4e8;color:#6a7f8c}
  html[data-appearance="mist"] .language-switch{background:#e5eaed;border-color:#d1dbe1}
  html[data-appearance="mist"] .language-switch button{color:#5b6f7d}
  html[data-appearance="mist"] .language-switch button.active{color:#145c58;background:#fff}
  html[data-appearance="mist"] .ask{background:linear-gradient(110deg,#188b78,#24a98a)}
  html[data-appearance="mist"] .page-placeholder,
  html[data-appearance="mist"] .customer-page,
  html[data-appearance="mist"] .agent-list-page,
  html[data-appearance="mist"] .shop-list-page,
  html[data-appearance="mist"] .delivery-note-page,
  html[data-appearance="mist"] .movement-page,
  html[data-appearance="mist"] .stagnant-page,
  html[data-appearance="mist"] .comparison-page,
  html[data-appearance="mist"] .issues-page,
  html[data-appearance="mist"] .warranty-page{background:#fbfcfc;border-color:#dce3e7;box-shadow:0 7px 24px rgba(40,54,66,.045)}
  html[data-appearance="mist"] .ops-heading h1,
  html[data-appearance="mist"] .warehouse-heading h1,
  html[data-appearance="mist"] .ops-panel h2,
  html[data-appearance="mist"] .ops-sections h2{color:#263a47}
  html[data-appearance="mist"] .ops-source,
  html[data-appearance="mist"] .ops-kpi,
  html[data-appearance="mist"] .ops-panel,
  html[data-appearance="mist"] .ops-sections,
  html[data-appearance="mist"] .customer-metric,
  html[data-appearance="mist"] .customer-message-card,
  html[data-appearance="mist"] .warehouse-tools,
  html[data-appearance="mist"] .warranty-toolbar{background:#fff;border-color:#dce3e7;box-shadow:0 5px 18px rgba(39,54,66,.04)}
  html[data-appearance="mist"] .ops-alert,
  html[data-appearance="mist"] .ops-actions button,
  html[data-appearance="mist"] .ops-section,
  html[data-appearance="mist"] .warehouse-command>button:not(.warehouse-add){background:#f5f7f7;border-color:#dce3e7;color:#385061}
  html[data-appearance="mist"] .ops-alert:hover,
  html[data-appearance="mist"] .ops-actions button:hover,
  html[data-appearance="mist"] .ops-section:hover{background:#e9f3f0}
  html[data-appearance="mist"] .warehouse-table th,
  html[data-appearance="mist"] .customer-table th,
  html[data-appearance="mist"] .data-table th{background:#eaf0f1;color:#526675}
  html[data-appearance="mist"] .warehouse-table tbody tr:hover td,
  html[data-appearance="mist"] .customer-table tbody tr:hover td{background:#f1f7f5}
  html[data-appearance="mist"] .warehouse-qty-total,
  html[data-appearance="mist"] .warehouse-row-actions button,
  html[data-appearance="mist"] .customer-row-actions button{background:#eff3f4;border-color:#d7e0e4;color:#4d6775}
  html[data-appearance="mist"] .quotation-page{background:#fbfcfc;border-color:#dce3e7;color:#253847}
  html[data-appearance="mist"] .quotation-page .q-card{background:#fff;border-color:#dce3e7}
  html[data-appearance="mist"] .quotation-page .q-card h3{color:#263a47}
  html[data-appearance="mist"] .quotation-page .quote-actions{border-color:#dce3e7}
  html[data-appearance="mist"] .settings .modal{border-color:#dce3e7}
  html[data-appearance="mist"] .settings .modal-head,
  html[data-appearance="mist"] .settings .modal-actions{background:#f8faf9}
  html[data-appearance="mist"] .ai-panel{border-color:#dce3e7}
  html[data-appearance="mist"] .ai-messages{background:#f1f4f5}
  html[data-appearance="mist"] .ai-compose{background:#fbfcfc}
  html[data-appearance="mist"] .summary-hero{background:linear-gradient(115deg,#344e5b,#4e736d)}
  @media(max-width:900px){html[data-appearance="mist"] .nav-group summary{background:#e9eef0;border-color:#d3dde1}html[data-appearance="mist"] .nav-group-items{background:#f8faf9;border-color:#d4e0df;box-shadow:0 16px 30px rgba(36,57,58,.14)}}
}
@media(max-width:600px){.appearance-toggle{width:31px;height:31px;margin-inline:0 3px}}
@media screen{
  html[data-appearance="night"]{--canvas:#192633;--panel:#202e3c;--line:#344656;--shadow:0 14px 35px rgba(0,0,0,.16);color-scheme:dark}
  html[data-appearance="night"] body{background:#121d28;color:#e5edf3}
  html[data-appearance="night"] .app{background:linear-gradient(145deg,#15222f,#1a2935 50%,#13232c)}
  html[data-appearance="night"] .sidebar{background:linear-gradient(155deg,#172b3a,#112432);border-color:#344a58;box-shadow:0 19px 42px rgba(0,0,0,.24)}
  html[data-appearance="night"] .sidebar:before{background:radial-gradient(circle at 0 0,rgba(47,156,146,.16),transparent 46%)}
  html[data-appearance="night"] .brand{color:#f0f6f8;border-color:#3a4e5e}
  html[data-appearance="night"] .section-label,html[data-appearance="night"] .nav-group summary{color:#9db6c2}
  html[data-appearance="night"] .nav-group,html[data-appearance="night"] .sidebar-footer{border-color:#344a58}
  html[data-appearance="night"] .sidebar-footer{color:#9db0bf}
  html[data-appearance="night"] .nav button{color:#c6d8df}
  html[data-appearance="night"] .nav button>span:first-child{background:#304c59;color:#bde4dd}
  html[data-appearance="night"] .nav button:hover{background:#294352;color:#fff}
  html[data-appearance="night"] .nav button.active{background:#dff2ed;border-color:#dff2ed;color:#153d40;box-shadow:0 7px 20px rgba(0,0,0,.17)}
  html[data-appearance="night"] .nav button.active>span:first-child{background:#c5e8db;color:#176b60}
  html[data-appearance="night"] .main{background:#192633;border-color:#344656;color:#e5edf3;box-shadow:0 15px 38px rgba(0,0,0,.14)}
  html[data-appearance="night"] .topbar{border-color:#354656}
  html[data-appearance="night"] .search{background:#223240;border-color:#3b5060;color:#b3c2ca}
  html[data-appearance="night"] .search svg{stroke:#a6bbc6}
  html[data-appearance="night"] .profile small{color:#a6b8c4}
  html[data-appearance="night"] .language-switch{background:#233645;border-color:#3c5363}
  html[data-appearance="night"] .language-switch button{color:#afc5ce}
  html[data-appearance="night"] .language-switch button.active{background:#395264;color:#f7fbfa}
  html[data-appearance="night"] .appearance-toggle{background:#263b49;border-color:#4a6370;color:#d2e5e9}
  html[data-appearance="night"] .appearance-toggle:hover{background:#355161}
  html[data-appearance="night"] .appearance-options{background:#233542;border-color:#465c68;box-shadow:0 18px 40px rgba(0,0,0,.32)}
  html[data-appearance="night"] .appearance-options button{color:#d8e7ec}
  html[data-appearance="night"] .appearance-options button:hover{background:#314b58}
  html[data-appearance="night"] .appearance-options button.selected{background:#244e4c;color:#b4f3dd}
  html[data-appearance="night"] .ask{background:linear-gradient(110deg,#138974,#20a988)}
  html[data-appearance="night"] .main :is(h1,h2,h3):not(.quote-sheet *){color:#f0f5f7}
  html[data-appearance="night"] .main :is(p,small):not(.quote-sheet *){color:#a9bdc9}
  html[data-appearance="night"] .main strong:not(.quote-sheet *){color:#e7f0f2}
  html[data-appearance="night"] .page-placeholder,
  html[data-appearance="night"] .customer-page,
  html[data-appearance="night"] .agent-list-page,
  html[data-appearance="night"] .shop-list-page,
  html[data-appearance="night"] .delivery-note-page,
  html[data-appearance="night"] .movement-page,
  html[data-appearance="night"] .stagnant-page,
  html[data-appearance="night"] .comparison-page,
  html[data-appearance="night"] .issues-page,
  html[data-appearance="night"] .warranty-page,
  html[data-appearance="night"] .quotation-page{background:#202e3b;border-color:#3c5060;color:#e5edf3;box-shadow:0 8px 26px rgba(0,0,0,.12)}
  html[data-appearance="night"] .ops-source,
  html[data-appearance="night"] .ops-kpi,
  html[data-appearance="night"] .ops-panel,
  html[data-appearance="night"] .ops-sections,
  html[data-appearance="night"] .customer-metric,
  html[data-appearance="night"] .customer-message-card,
  html[data-appearance="night"] .warehouse-tools,
  html[data-appearance="night"] .warranty-toolbar,
  html[data-appearance="night"] .quotation-page .q-card{background:#253746;border-color:#405565;color:#e5edf3;box-shadow:0 5px 19px rgba(0,0,0,.10)}
  html[data-appearance="night"] .ops-alert,
  html[data-appearance="night"] .ops-actions button,
  html[data-appearance="night"] .ops-section,
  html[data-appearance="night"] .warehouse-command>button:not(.warehouse-add),
  html[data-appearance="night"] .warehouse-qty-total,
  html[data-appearance="night"] .warehouse-row-actions button,
  html[data-appearance="night"] .customer-row-actions button,
  html[data-appearance="night"] .customer-transfer-button{background:#293c49;border-color:#435968;color:#deeaee}
  html[data-appearance="night"] .ops-alert:hover,
  html[data-appearance="night"] .ops-actions button:hover,
  html[data-appearance="night"] .ops-section:hover{background:#315047}
  html[data-appearance="night"] .ops-kpi-top,
  html[data-appearance="night"] .ops-chart-name,
  html[data-appearance="night"] .customer-metric span,
  html[data-appearance="night"] .customer-list-head span,
  html[data-appearance="night"] .warehouse-result-line{color:#b4c5ce}
  html[data-appearance="night"] .ops-kpi strong,
  html[data-appearance="night"] .customer-metric strong,
  html[data-appearance="night"] .warehouse-qty-total strong{color:#f0f6f6}
  html[data-appearance="night"] .ops-kpi-top i,
  html[data-appearance="night"] .ops-action-icon,
  html[data-appearance="night"] .ops-section-icon,
  html[data-appearance="night"] .customer-card-symbol{background:#304e50;color:#9bedd3}
  html[data-appearance="night"] .ops-chart-track{background:#354953}
  html[data-appearance="night"] .warehouse-table-wrap,
  html[data-appearance="night"] .customer-table-wrap,
  html[data-appearance="night"] .data-table-wrap{border-color:#435766}
  html[data-appearance="night"] :is(.warehouse-table,.customer-table,.data-table,.stagnant-table,.movement-table,.comparison-table,.issues-table,.warranty-table,.agent-table,.shop-list-table) :is(th,td){border-color:#3b4e5d;color:#dce7ec}
  html[data-appearance="night"] :is(.warehouse-table,.customer-table,.data-table,.stagnant-table,.movement-table,.comparison-table,.issues-table,.warranty-table,.agent-table,.shop-list-table) th{background:#304554;color:#dce8ed}
  html[data-appearance="night"] :is(.warehouse-table,.customer-table,.data-table,.stagnant-table,.movement-table,.comparison-table,.issues-table,.warranty-table,.agent-table,.shop-list-table) tbody tr:hover td{background:#2d454b}
  html[data-appearance="night"] .warehouse-table td:first-child,
  html[data-appearance="night"] .customer-table .customer-name{color:#ecf5f6}
  html[data-appearance="night"] .main :is(input:not([type="checkbox"]),select,textarea):not(.quote-sheet *){background:#223544;border-color:#4b6372;color:#f2f7f8}
  html[data-appearance="night"] .main :is(input,textarea)::placeholder{color:#9cb1bd}
  html[data-appearance="night"] .main :is(label,dt):not(.quote-sheet *){color:#b8cbd4}
  html[data-appearance="night"] .main :is(.warehouse-tools button,.warehouse-pager button,.stagnant-pager button,.movement-pager button,.comparison-pager button,.issues-pager button,.warranty-pager button){background:#293c49;border-color:#4a606e;color:#e0edf0}
  html[data-appearance="night"] .customer-notice{background:#493a28;border-color:#806036;color:#ffdfab}
  html[data-appearance="night"] .customer-mobile-card,
  html[data-appearance="night"] .agent-mobile-card{background:#293b49;border-color:#415665;color:#e5eff2}
  html[data-appearance="night"] .movement-metric.movement-stat,
  html[data-appearance="night"] .movement-sort button,
  html[data-appearance="night"] .movement-list{background:#293c49;border-color:#435968;color:#e6eff2}
  html[data-appearance="night"] .movement-metric span{color:#bed0d8}
  html[data-appearance="night"] .movement-metric strong{color:#f0f6f7}
  html[data-appearance="night"] .movement-total-value.movement-stat{background:#214940;border-color:#407b68}
  html[data-appearance="night"] .movement-insight-panel{background:#293c49;border-color:#435968;color:#e6eff2}
  html[data-appearance="night"] .movement-insight-empty{background:#233642;border-color:#4b6170;color:#b7c9d1}
  html[data-appearance="night"] .movement-donut>div{background:#253947}
  html[data-appearance="night"] .movement-donut span,
  html[data-appearance="night"] .movement-legend em,
  html[data-appearance="night"] .movement-leader-meta{color:#a9bec8}
  html[data-appearance="night"] .movement-legend button,
  html[data-appearance="night"] .movement-legend-rest,
  html[data-appearance="night"] .movement-leader-top bdi{color:#dfeaf0}
  html[data-appearance="night"] .movement-legend button:hover,
  html[data-appearance="night"] .movement-leader-list button:hover{background:#315149}
  html[data-appearance="night"] .movement-legend strong,
  html[data-appearance="night"] .movement-donut strong{color:#f1f7f7}
  html[data-appearance="night"] .movement-leader-rank{background:#3a5561;color:#d6e9eb}
  html[data-appearance="night"] .movement-leader-track{background:#3b5460}
  html[data-appearance="night"] .movement-table tbody tr:nth-child(even){background:#293c49}
  html[data-appearance="night"] .movement-table .movement-material,
  html[data-appearance="night"] .movement-table .movement-group{color:#e7f1f3}
  html[data-appearance="night"] .movement-result-line{color:#adbfca}
  html[data-appearance="night"] .customer-dialog,
  html[data-appearance="night"] .warehouse-dialog,
  html[data-appearance="night"] .settings .modal,
  html[data-appearance="night"] .ai-panel,
  html[data-appearance="night"] .usr-modal-card{background:#243543;border-color:#475d6b;color:#e8f1f3}
  html[data-appearance="night"] .settings .modal-head,
  html[data-appearance="night"] .settings .modal-actions,
  html[data-appearance="night"] .ai-panel-head,
  html[data-appearance="night"] .ai-compose{background:#273a48;border-color:#455a69;color:#e8f1f3}
  html[data-appearance="night"] .ai-messages{background:#1d2d39}
  html[data-appearance="night"] .ai-message{background:#2b3e4d;border-color:#455a69;color:#e8f1f3}
  html[data-appearance="night"] .ai-message.user{background:#254f54;border-color:#397171}
  html[data-appearance="night"] .settings :is(input,textarea,select),
  html[data-appearance="night"] .customer-dialog :is(input,textarea,select),
  html[data-appearance="night"] .warehouse-dialog :is(input,textarea,select),
  html[data-appearance="night"] .ai-panel :is(input,textarea){background:#1d2e3b;border-color:#506675;color:#edf4f6}
  html[data-appearance="night"] .settings :is(label,p),
  html[data-appearance="night"] .customer-dialog label,
  html[data-appearance="night"] .warehouse-dialog label{color:#b8cbd4}
  html[data-appearance="night"] .quotation-page .quote-sheet{background:#fff;color:#1a2741}
  html[data-appearance="night"] .quotation-page .quote-sheet :is(h1,h2,h3,strong,p,small,label){color:inherit}
  html[data-appearance="night"] .quotation-page .editor-table th{background:#304554;color:#dce8ed}
  html[data-appearance="night"] .quotation-page .editor-table td{border-color:#405464;color:#e4eef1}
  html[data-appearance="night"] .quotation-page .q-field input,
  html[data-appearance="night"] .quotation-page .q-field select{background:#1f303e;border-color:#4a6070;color:#edf4f6}
  html[data-appearance="night"] .dn-editor,
  html[data-appearance="night"] .dn-preview-panel{background:#263a48;border-color:#486170;color:#e8f1f3}
  html[data-appearance="night"] .dn-editor-section,
  html[data-appearance="night"] .dn-preview-title{border-color:#435968;color:#e3edf1}
  html[data-appearance="night"] .dn-item,
  html[data-appearance="night"] .dn-local-note{background:#293f4d;border-color:#496171;color:#b9cbd4}
  html[data-appearance="night"] .dn-field span,
  html[data-appearance="night"] .dn-item-top strong{color:#dce9ee}
  html[data-appearance="night"] .dn-paper{background:#fff;color:#111;color-scheme:light}
  html[data-appearance="night"] .dn-paper :is(h2,h3,strong,p,small){color:#111!important}
  html[data-appearance="night"] .manual-add,
  html[data-appearance="night"] .shared-appearance{background:#20313e;border-color:#4b6170;color:#e5eef2}
  html[data-appearance="night"] .shared-appearance :is(strong,label,p){color:#dbe9ee}
  html[data-appearance="night"] #quoteSavedDocuments{background:#263a48;border-color:#4b6372;color:#f1f6f8}
  html[data-appearance="night"] .quotation-page .quote-status{background:#293d4b;border-color:#48606d;color:#d9e6eb}
  html[data-appearance="night"] .gate-shell,
  html[data-appearance="night"] .gate-form-wrap{background:#202e3b;color:#eaf2f5}
  html[data-appearance="night"] .gate-form h2{color:#f1f6f8}
  html[data-appearance="night"] .gate-form .gate-sub,
  html[data-appearance="night"] .gate-field label{color:#b9c9d2}
  html[data-appearance="night"] .gate-input input{background:#263b4a;border-color:#496272;color:#f3f7f9}
  @media(max-width:900px){html[data-appearance="night"] .nav-group summary{background:#273f4d;border-color:#435b69}html[data-appearance="night"] .nav-group-items{background:#203543;border-color:#456171}}
}
@media(max-width:600px){.appearance-picker{margin-inline:0 3px}.appearance-toggle{width:31px;height:31px}}
@media print{.appearance-picker{display:none!important}}
