:root{color-scheme:light dark;
--bg:#F3F5F8;--surface:#fff;--surface2:#EDF0F5;--tx:#0E1726;--mut:#5B6878;--bd:#DCE2EA;
--acc:#FF5A36;--acc-tx:#1A0B06;--teal:#0B8F80;--bad:#C9302C;--warn:#A86A00;--ok-bg:#DDF4EF;--bad-bg:#FBE3E1;--warn-bg:#FFF0D3;
--r:14px;--sh:0 1px 2px rgba(14,23,38,.05),0 8px 24px -8px rgba(14,23,38,.12);
--font:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
--display:"Segoe UI Variable Display","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif}
@media(prefers-color-scheme:dark){:root{--bg:#0A111C;--surface:#121C2B;--surface2:#1A2638;--tx:#E8EEF6;--mut:#8FA0B5;--bd:#24324A;
--acc:#FF6A47;--teal:#2DD4BF;--bad:#F97066;--warn:#F5B84A;--ok-bg:#0F3B3A;--bad-bg:#4A1E22;--warn-bg:#4A3712;--sh:0 8px 28px -10px rgba(0,0,0,.6)}}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;font:15px/1.5 var(--font);background:var(--bg);color:var(--tx);-webkit-font-smoothing:antialiased}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
h1,h2,h3{font-family:var(--display);margin:0;letter-spacing:-.02em}
button{font-family:inherit}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border:0;border-radius:12px;background:var(--acc);color:var(--acc-tx);font-weight:700;font-size:15px;cursor:pointer;transition:transform .12s,filter .12s}
.btn:hover{filter:brightness(1.06)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.55;cursor:default}
.btn.ghost{background:transparent;color:var(--tx);border:1px solid var(--bd)}.btn.ghost:hover{background:var(--surface2)}
.btn.danger{background:var(--bad-bg);color:var(--bad)}
.btn.sm{height:32px;padding:0 12px;font-size:13px;border-radius:9px}.btn.icon{width:32px;padding:0}
.field{margin-top:16px}.field>label,.lbl{display:block;font-size:13px;font-weight:600;color:var(--mut);margin-bottom:6px}
.inp{width:100%;height:48px;padding:0 14px;border-radius:12px;border:1px solid var(--bd);background:var(--surface);color:var(--tx);font:inherit;transition:border-color .12s,box-shadow .12s}
.inp:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 22%,transparent)}
.inp::placeholder{color:var(--mut);opacity:.7}
.combo,.multi{position:relative}
.dd,.mpanel{position:absolute;z-index:40;left:0;right:0;top:calc(100% + 6px);background:var(--surface);border:1px solid var(--bd);border-radius:14px;box-shadow:var(--sh);max-height:260px;overflow:auto;margin:0;padding:6px;list-style:none}
.dd li{padding:10px 12px;border-radius:9px;cursor:pointer}.dd li:hover,.dd li.act{background:var(--surface2)}
.dd li.none,.none{color:var(--mut);cursor:default;padding:10px 12px;font-size:14px}
.mbtn{width:100%;height:48px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-radius:12px;border:1px solid var(--bd);background:var(--surface);color:var(--tx);font:inherit;cursor:pointer;text-align:left}
.mbtn:hover{border-color:var(--mut)}.mbtn .ph{color:var(--mut);opacity:.85}.mbtn[aria-expanded=true]{border-color:var(--acc)}
.mpanel{position:static;max-height:none;overflow:visible;padding:8px;margin-top:8px;box-shadow:none}.mpanel .inp{height:42px;margin-bottom:6px}
.mlist{max-height:280px;overflow:auto;overscroll-behavior:contain}
.mgrp{position:sticky;top:0;background:var(--surface);padding:10px 10px 4px;font-size:12.5px;font-weight:700;color:var(--mut)}
.mopt{position:relative;display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;cursor:pointer}.mopt:hover{background:var(--surface2)}
.mopt input{position:absolute;opacity:0;pointer-events:none}
.box{flex:none;width:19px;height:19px;border-radius:6px;border:1.5px solid var(--bd);background:var(--surface);display:grid;place-items:center;transition:.12s}
.mopt input:checked+.box{background:var(--acc);border-color:var(--acc)}
.mopt input:checked+.box::after{content:"";width:9px;height:5px;border:solid var(--acc-tx);border-width:0 0 2px 2px;transform:rotate(-45deg) translate(1px,-1px)}
.mopt input:focus-visible+.box{outline:2px solid var(--acc);outline-offset:2px}
.mchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 6px 5px 11px;border-radius:99px;background:var(--surface2);border:1px solid var(--bd);font-size:13px}
.chip button{border:0;background:transparent;color:var(--mut);width:20px;height:20px;border-radius:50%;cursor:pointer;font-size:16px;line-height:1}.chip button:hover{background:var(--bd);color:var(--tx)}
.seg{display:flex;padding:4px;gap:4px;background:var(--surface2);border-radius:12px;border:1px solid var(--bd)}
.seg label{flex:1}.seg input{position:absolute;opacity:0}
.seg span{display:block;text-align:center;padding:10px 6px;border-radius:9px;cursor:pointer;font-weight:600;color:var(--mut);transition:.12s}
.seg input:checked+span{background:var(--surface);color:var(--tx);box-shadow:var(--sh)}
.seg input:focus-visible+span{outline:2px solid var(--acc)}
.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:99px;font-size:12.5px;font-weight:600;background:var(--surface2);color:var(--mut);white-space:nowrap}
.pill.ok{background:var(--ok-bg);color:var(--teal)}.pill.bad{background:var(--bad-bg);color:var(--bad)}.pill.warn{background:var(--warn-bg);color:var(--warn)}
.pill i{width:7px;height:7px;border-radius:50%;background:currentColor}
.switch{position:relative;display:inline-block;width:40px;height:23px}.switch input{opacity:0;width:0;height:0}
.switch span{position:absolute;inset:0;border-radius:99px;background:var(--bd);cursor:pointer;transition:.15s}
.switch span::after{content:"";position:absolute;width:17px;height:17px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.15s}
.switch input:checked+span{background:var(--teal)}.switch input:checked+span::after{transform:translateX(17px)}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:99;background:var(--tx);color:var(--bg);padding:11px 18px;border-radius:12px;font-weight:600;box-shadow:var(--sh);animation:tin .2s}
@keyframes tin{from{opacity:0;transform:translate(-50%,8px)}}
.err{color:var(--bad);font-size:14px;min-height:22px;margin-top:12px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* mobile: 16px inputs stop iOS Safari zooming the page on focus; larger touch targets */
@media(max-width:860px){.inp,.mbtn,.mopt,.dd li{font-size:16px}.mopt{padding:12px 10px}.btn.sm{height:38px}.btn.icon{width:38px}}
.pick .mopt.pk{display:flex;width:100%;text-align:left;border:0;background:none;color:inherit;font:inherit;cursor:pointer;border-radius:10px;padding:10px;align-items:center}
.pick .mopt.pk:hover,.pick .mopt.pk[aria-selected=true]{background:var(--acc-soft,rgba(255,159,10,.12))}
.pick .mopt.pk[aria-selected=true]{font-weight:700}
.pick .mlist{max-height:240px;overflow:auto}
