:root{--bg:#f2f2f5;--card:#fff;--text:#0b0b0b;--muted:#6e6e76;--line:#e6e6ea;--soft:#f4f4f7;--blue:#5b2bff;--blue-hover:#4a1fe6;--green:#1d8a3f;--green-bg:#e3f5e8;--orange:#c26800;--orange-bg:#ffefd9;--red:#d93025;--red-bg:#fde8e6;--shadow:0 1px 2px rgba(0,0,0,.04),0 10px 30px rgba(0,0,0,.05);--radius:28px;--aside:#f8f8fa;--brand:#0b0b0b;--tint:rgba(0,0,0,.05);--input:#f4f4f7;--input-line:#e6e6ea;--go-hover:#4a1fe6;--switch-off:#e1e1e6;--seg:#f1f1f4;--seg-hover:rgba(0,0,0,.04);--seg-active:#5b2bff;--chip-bg:#ffefd9;--chip:#c26800;--info-bg:#efeaff;--info:#4a1fe6;--row-hover:#f8f8fa;--row-alt:#f8f8fa;--picked:#f3f0ff;--warn-bg:#fff7ec;--warn-line:#ffd6a0;--danger-hover:#ffd9dd;--purple-bg:#f8f8fa;--purple-line:#e6e6ea;--th:#fff;--toast:rgba(11,11,11,.92);--accent:#5b2bff;--on-accent:#fff;--pill:#f1f1f4;--pill-hover:#e7e7ec;--ring:rgba(91,43,255,.25);color-scheme:light;--ease:cubic-bezier(.25,.1,.25,1);}
/* dark is the main look; "Avto" follows the device */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#000;--card:#1b1b1b;--text:#fff;--muted:#8d8d8d;--line:#2b2b2b;--soft:#262626;--blue:#a08bff;--blue-hover:#b7a6ff;--green:#30d158;--green-bg:rgba(48,209,88,.15);--orange:#ff9a1f;--orange-bg:rgba(255,154,31,.15);--red:#ff5b4f;--red-bg:rgba(255,91,79,.15);--shadow:none;--radius:28px;--aside:#000;--brand:#fff;--tint:rgba(255,255,255,.06);--input:#262626;--input-line:#303030;--go-hover:#6c40ff;--switch-off:#3a3a3a;--seg:#262626;--seg-hover:rgba(255,255,255,.07);--seg-active:#5b2bff;--chip-bg:rgba(255,154,31,.15);--chip:#ff9a1f;--info-bg:rgba(91,43,255,.22);--info:#b7a6ff;--row-hover:#222;--row-alt:#202020;--picked:rgba(91,43,255,.14);--warn-bg:rgba(255,154,31,.07);--warn-line:rgba(255,154,31,.35);--danger-hover:rgba(255,91,79,.28);--purple-bg:rgba(255,255,255,.035);--purple-line:#303030;--th:#1b1b1b;--toast:rgba(38,38,38,.97);--accent:#5b2bff;--on-accent:#fff;--pill:#262626;--pill-hover:#313131;--ring:rgba(91,43,255,.38);color-scheme:dark;}}
:root[data-theme="dark"]{--bg:#000;--card:#1b1b1b;--text:#fff;--muted:#8d8d8d;--line:#2b2b2b;--soft:#262626;--blue:#a08bff;--blue-hover:#b7a6ff;--green:#30d158;--green-bg:rgba(48,209,88,.15);--orange:#ff9a1f;--orange-bg:rgba(255,154,31,.15);--red:#ff5b4f;--red-bg:rgba(255,91,79,.15);--shadow:none;--radius:28px;--aside:#000;--brand:#fff;--tint:rgba(255,255,255,.06);--input:#262626;--input-line:#303030;--go-hover:#6c40ff;--switch-off:#3a3a3a;--seg:#262626;--seg-hover:rgba(255,255,255,.07);--seg-active:#5b2bff;--chip-bg:rgba(255,154,31,.15);--chip:#ff9a1f;--info-bg:rgba(91,43,255,.22);--info:#b7a6ff;--row-hover:#222;--row-alt:#202020;--picked:rgba(91,43,255,.14);--warn-bg:rgba(255,154,31,.07);--warn-line:rgba(255,154,31,.35);--danger-hover:rgba(255,91,79,.28);--purple-bg:rgba(255,255,255,.035);--purple-line:#303030;--th:#1b1b1b;--toast:rgba(38,38,38,.97);--accent:#5b2bff;--on-accent:#fff;--pill:#262626;--pill-hover:#313131;--ring:rgba(91,43,255,.38);color-scheme:dark;}
.themeBtn{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;margin:0 0 10px;padding:5px 10px;border-radius:980px;background:var(--tint);color:var(--text);font-size:12px}
.themeBtn:hover{background:var(--seg)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.47 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI Variable","Segoe UI",Inter,Roboto,sans-serif;letter-spacing:-.01em}

/* sidebar */
aside{position:fixed;inset:0 auto 0 0;width:232px;padding:22px 14px;display:flex;flex-direction:column;background:var(--aside);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-right:1px solid var(--line);z-index:5}
.brand{padding:4px 10px 28px}
.brand .word{font-size:34px;line-height:1;font-weight:800;letter-spacing:-.06em;color:var(--brand)}
.brand .word b{color:#5b2bff;font-weight:800}
.brand small{display:block;margin-top:9px;font-size:9px;font-weight:600;letter-spacing:.28em;color:#8e8e93}
nav{display:grid;gap:2px}
nav a{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;padding:8px 10px;border-radius:9px;font-size:14px;transition:background .2s var(--ease)}
nav a:hover{background:var(--tint)}
nav a.active{background:rgba(255,122,47,.1);color:var(--blue);font-weight:500}
aside footer .badge{display:inline-block;margin:0 0 10px}
.ico{width:18px;text-align:center;opacity:.8}
aside footer{margin-top:auto;color:var(--muted);font-size:11px;padding:0 10px}

/* layout */
main{margin-left:232px;padding:40px 48px 80px;max-width:1440px}
header{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:28px}
h1{font-size:40px;line-height:1.1;font-weight:700;letter-spacing:-.03em;margin:0}
.lead{color:var(--muted);font-size:17px;margin:8px 0 0}
h2{font-size:22px;font-weight:600;letter-spacing:-.02em;margin:0}
h3{font-size:17px;font-weight:600;margin:32px 0 12px}
p{color:var(--muted);margin:6px 0 16px}
.headRight{display:flex;align-items:flex-end;gap:12px}
.card{background:var(--card);border-radius:var(--radius);padding:28px;margin-bottom:20px;box-shadow:var(--shadow);animation:rise .35s var(--ease)}
.narrowCard{max-width:520px}
.cardHead{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:18px}
.cardHead p{margin-bottom:0}
@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
[hidden]{display:none!important}

/* controls */
label{display:block;font-size:13px;color:var(--muted);font-weight:500}
label>span{display:block;margin-bottom:6px}
input:not([type=checkbox]),select{display:block;width:100%;font:inherit;font-size:15px;color:var(--text);background:var(--input);border:1px solid var(--input-line);border-radius:11px;padding:10px 13px;transition:border-color .2s,box-shadow .2s;appearance:none;-webkit-appearance:none}
select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2386868b' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:36px}
input:focus,select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(255,122,47,.15)}
.search{background:var(--soft)!important;border-color:transparent!important;margin:14px 0 6px}
.search:focus{background:var(--input)!important;border-color:var(--blue)!important}
button{font:inherit;font-size:14px;font-weight:500;border:0;border-radius:980px;padding:9px 20px;background:var(--blue);color:#fff;cursor:pointer;transition:background .2s,transform .1s,opacity .2s}
button:hover{background:var(--blue-hover)}
button:active{transform:scale(.97)}
button:disabled{opacity:.4;cursor:default;transform:none}
button.secondary{background:rgba(255,122,47,.1);color:var(--blue)}
button.secondary:hover{background:rgba(255,122,47,.16)}
button.ghost{background:none;color:var(--blue);padding:6px 0}
button.ghost:hover{text-decoration:underline}
button.go{background:var(--green);padding:12px 26px;font-size:15px}
button.go:hover{background:var(--go-hover)}
input[type=checkbox]{width:18px;height:18px;accent-color:var(--blue);cursor:pointer;margin:0}
.switch{display:flex;align-items:center;gap:10px;color:var(--text);font-size:14px;cursor:pointer;user-select:none}
.switch input{position:absolute;opacity:0;pointer-events:none}
.switch i{position:relative;width:42px;height:25px;border-radius:20px;background:var(--switch-off);transition:background .25s var(--ease);flex:none}
.switch i::after{content:"";position:absolute;top:2px;left:2px;width:21px;height:21px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.2);transition:transform .25s var(--ease)}
.switch input:checked+i{background:#34c759}
.switch input:checked+i::after{transform:translateX(17px)}
.switch input:focus-visible+i{box-shadow:0 0 0 4px rgba(255,122,47,.2)}
.switch.inline{align-self:end;padding-bottom:10px}
.segmented{display:inline-flex;background:var(--seg);border-radius:10px;padding:2px;gap:2px}
.segmented button{background:none;color:var(--text);border-radius:8px;padding:6px 14px;font-size:13px}
.segmented button:hover{background:var(--seg-hover)}
.segmented button.active{background:var(--seg-active);box-shadow:0 1px 3px rgba(0,0,0,.12);font-weight:600}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0 4px}
.grid3{display:grid;grid-template-columns:1.3fr 1.3fr .7fr;gap:16px;margin-bottom:16px}
.actions{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.shopPick{min-width:230px}

/* badges, chips, pills */
.badge{white-space:nowrap;background:var(--orange-bg);color:var(--orange);border-radius:980px;padding:6px 12px;font-size:12px;font-weight:500;margin-bottom:6px}
.badge.good{background:var(--green-bg);color:var(--green)}
.chip{white-space:nowrap;background:var(--soft);color:var(--muted);border-radius:980px;padding:6px 12px;font-size:12px}
.chip.on{background:var(--chip-bg);color:var(--chip)}
.pill{display:inline-block;border-radius:980px;padding:2px 10px;font-size:12px;font-weight:500;background:var(--soft);color:var(--muted)}
.pill.active,.pill.good{background:var(--green-bg);color:var(--green)}
.pill.created,.pill.announced{background:var(--info-bg);color:var(--blue)}
.pill.bad{background:var(--red-bg);color:var(--red)}
.note{color:var(--muted)}
p.note{background:var(--soft);border-radius:12px;padding:12px 16px;margin:0 0 16px}
.muted{color:var(--muted)}.small{font-size:13px}.strong{font-weight:600}
.red{color:var(--red)}.orange{color:var(--orange)}.warn{color:var(--orange);font-weight:600}
.summary{color:var(--text);font-size:14px;margin:16px 0 8px}

/* sale cards */
.saleGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.saleCard{all:unset;cursor:pointer;display:flex;flex-direction:column;background:var(--card);border-radius:16px;overflow:hidden;box-shadow:0 0 0 1px var(--line);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.saleCard:hover{background:var(--card);transform:translateY(-3px);box-shadow:0 0 0 1px var(--line),0 12px 30px rgba(0,0,0,.08)}
.saleCard:focus-visible{box-shadow:0 0 0 3px rgba(255,122,47,.4)}
.saleCard .pic{aspect-ratio:16/8;background:linear-gradient(135deg,#ece9ff,#e3f0ff) center/cover no-repeat}
.saleBody{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px}
.saleBody strong{font-size:15px;line-height:1.3;font-weight:600}
.saleBody small{color:var(--muted);font-size:12px}
.saleMeta{display:flex;align-items:center;gap:8px;font-size:12px}
.detailHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
#saleDetail{animation:rise .3s var(--ease)}

/* tables */
.tablewrap{overflow:auto;max-height:560px;border-radius:12px;border:1px solid var(--line)}
.tablewrap.tall{max-height:68vh}
table{border-collapse:separate;border-spacing:0;width:100%;font-size:13.5px}
th{position:sticky;top:0;z-index:1;background:var(--th);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--muted);font-weight:500;font-size:12px;text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:9px 12px;border-bottom:1px solid #f0f0f3;vertical-align:middle}
tbody tr{transition:background .15s}
tbody tr:hover{background:var(--row-hover)}
tr.group td{background:var(--row-alt);border-top:1px solid var(--line);padding-top:11px;padding-bottom:11px}
tr.group.picked td{background:var(--picked)}
td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
td span,td small{display:block}
td small{color:var(--muted);font-size:11.5px}
td .pill{display:inline-block}
td.sku{padding-left:58px}
td.chk,th.chk{width:44px;text-align:center}
.pc{display:flex;gap:12px;align-items:center}
.pc img{width:36px;height:36px;object-fit:cover;border-radius:8px;flex:none;background:var(--soft)}
table.plan td.note{font-size:12.5px;min-width:170px}
td.note.red{color:var(--red);font-weight:600}td.note.orange{color:var(--orange);font-weight:500}td.note.err{color:var(--red);font-weight:600}
input.price{width:118px;margin-left:auto;text-align:right;padding:6px 10px;border-radius:9px;font-variant-numeric:tabular-nums;font-weight:600}
input.price.red,input.price.err{border-color:var(--red);background:var(--red-bg);color:var(--red)}
input.price.orange{border-color:#ffb340;background:var(--orange-bg)}
.sendBar{position:sticky;bottom:0;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:14px;padding:14px 0 2px;background:linear-gradient(transparent,var(--card) 30%)}

/* pages */
.page{animation:rise .3s var(--ease)}
.warnCard{border:1px solid var(--warn-line);background:var(--warn-bg)}
.segmented.scroll{max-width:100%;overflow-x:auto;scrollbar-width:none}
.segmented.scroll::-webkit-scrollbar{display:none}
.segmented button{white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.segmented .count{font-weight:600;font-size:11px;color:var(--muted);background:var(--tint);border-radius:980px;padding:1px 7px}
.segmented button.active .count{background:var(--blue);color:#fff}
.toolbar.top{margin-top:0}
.btns{display:flex;gap:8px;align-items:center}.btns button,.sendBar button{white-space:nowrap}
select.compact{width:auto;padding:7px 34px 7px 12px;font-size:13px;border-radius:980px}
.center{text-align:center;margin-top:14px}
th.num{text-align:right}
input.price.changed{border-color:var(--blue);background:var(--info-bg)}
.pc.item+.pc.item{margin-top:8px}.pc.item{min-width:300px}
.clamp{display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
td.order{white-space:nowrap}
td small.red{color:var(--red);font-weight:600}td small.orange{color:var(--orange);font-weight:500}

/* price shown as text, edited on click */
.priceText{background:none;color:var(--text);padding:4px 8px;border-radius:8px;font-variant-numeric:tabular-nums;font-size:13.5px;cursor:text;border:1px dashed transparent}
.priceText:hover{background:var(--soft);border-color:var(--input-line)}
.priceText:active{transform:none}
.priceText.changed{background:var(--info-bg);color:var(--blue)}
.priceText.red,.priceText.err{background:var(--red-bg);color:var(--red)}
.priceText.orange{background:var(--orange-bg);color:var(--orange)}
.priceWrap input.price{width:118px}
button.danger{background:var(--red-bg);color:var(--red)}button.danger:hover{background:var(--danger-hover)}
button.mini{padding:5px 12px;font-size:12px;background:rgba(255,122,47,.1);color:var(--blue);white-space:nowrap}
button.mini:hover{background:rgba(255,122,47,.18)}
.pc.small img{width:30px;height:30px;border-radius:7px}
img.blank{visibility:hidden}
td.sku{padding-left:44px}
tbody tr.picked td{background:var(--picked)}
.printBar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 10px}
td.actions,th.actions{text-align:right;white-space:nowrap}

/* header print options */
.printOpts{display:flex;gap:10px;align-items:flex-end}
.printOpts select{min-width:170px}

/* invoices */
.invList{display:grid;gap:10px}
.invRow{display:flex;align-items:center;gap:12px;border-radius:14px;box-shadow:0 0 0 1px var(--line);padding:4px 14px 4px 4px;transition:box-shadow .2s var(--ease)}
.invRow:hover{box-shadow:0 0 0 1px var(--line),0 8px 24px rgba(0,0,0,.06)}
.invMain{all:unset;cursor:pointer;flex:1;display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:12px;color:var(--text);transition:background .15s}
.invMain:hover{background:var(--soft);color:var(--text)}
.invMain:focus-visible{box-shadow:0 0 0 3px rgba(255,122,47,.35)}
.invMain small{color:var(--muted);font-size:12px}
.invHead{display:flex;align-items:center;gap:10px}.invHead strong{font-size:16px}
.invActions{margin:10px 0 6px}
td.big{font-size:18px;font-weight:700}
tr.totalRow td{background:var(--row-alt);font-weight:600;border-top:1px solid var(--line)}

/* new invoice + slot hunter */
.grid2{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end;margin:14px 0}
.btns.end{justify-content:flex-end}
.slotGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.slot{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:14px;box-shadow:0 0 0 1px var(--line);background:var(--card)}
.slot strong{font-size:14px}.slot span{font-variant-numeric:tabular-nums}.slot small{color:var(--green);font-size:12px}
.slot button{margin-top:8px;align-self:flex-start}
.slot.full{opacity:.5}.slot.full small{color:var(--muted)}
.hunt{margin-top:22px;padding:18px 20px;border-radius:16px;background:var(--purple-bg);box-shadow:0 0 0 1px var(--purple-line)}
.hunt h3{margin-top:0}
.huntBox{margin:6px 0 18px}.huntBox h3{margin:0 0 10px}
.huntRow{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 16px;border-radius:14px;box-shadow:0 0 0 1px var(--line);margin-bottom:8px}
.huntRow>div{display:flex;flex-direction:column;gap:3px}.huntRow small{color:var(--muted);font-size:12px}
.huntRow.live{box-shadow:0 0 0 1px var(--purple-line);background:var(--purple-bg)}
.huntRow.live .pill::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;margin-right:6px;animation:pulse 1.4s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
.moveBox{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 14px;border-radius:12px;background:var(--soft);margin:8px 0}

/* autopilot */
.autoCard .cardHead{margin-bottom:10px}
.switch.big span{font-weight:600}
.autoStatus{white-space:pre-line;margin:0 0 6px;padding:12px 16px;border-radius:12px;background:var(--soft);color:var(--text);font-size:14px}
.autoStatus.live{background:var(--info-bg);color:var(--info)}.autoStatus.good{background:var(--green-bg);color:var(--green)}
.autoStatus.orange{background:var(--orange-bg);color:var(--orange)}.autoStatus.red{background:var(--red-bg);color:var(--red);font-weight:600}
.autoStatus.off{color:var(--muted)}
#autoMore .grid3{margin-top:14px}
.days>span{display:block;margin-bottom:6px;font-size:13px;color:var(--muted);font-weight:500}
#autoDays{display:flex;gap:6px;flex-wrap:wrap}
.day{display:inline-flex!important;align-items:center;cursor:pointer}
.day input{position:absolute;opacity:0;pointer-events:none}
.day span{display:inline-block;min-width:38px;text-align:center;padding:7px 8px;border-radius:9px;background:var(--soft);color:var(--text);font-size:13px;transition:background .15s}
.day input:checked+span{background:var(--red-bg);color:var(--red);font-weight:600}
.day input:focus-visible+span{box-shadow:0 0 0 3px rgba(255,122,47,.3)}

/* FBO */
tr.fboRow{cursor:pointer}
tr.fboDetail td{background:var(--row-alt);padding:12px 16px 16px 56px}
.fboItems{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px}
td.actions .mini+.mini{margin-left:6px}
.inlineDate{display:flex;align-items:center;gap:8px;font-size:13px}
.inlineDate input{width:auto;padding:7px 10px}

/* products + AI */
td .up{color:var(--green);font-weight:600}td .down{color:var(--red);font-weight:600}
.md h3{font-size:17px;margin:18px 0 6px}.md h4{font-size:15px;margin:14px 0 4px}
.md p{color:var(--text);margin:6px 0}.mdTable{margin:8px 0 14px;max-height:none}.mdTable th{position:static}.md ul,.md ol{margin:6px 0 10px;padding-left:22px}.md li{margin:3px 0}
.compGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:12px}
.comp{display:flex;gap:10px;align-items:flex-start;padding:10px;border-radius:12px;box-shadow:0 0 0 1px var(--line);color:var(--text);text-decoration:none;font-size:12.5px;line-height:1.35}
.comp:hover{box-shadow:0 0 0 1px var(--blue)}
.comp img{width:54px;height:54px;object-fit:cover;border-radius:8px;flex:none;background:var(--soft)}
.aiUpload{display:grid;grid-template-columns:minmax(220px,340px) 1fr;gap:20px}
.drop{position:relative;display:grid;place-items:center;min-height:260px;border:2px dashed var(--input-line);border-radius:16px;cursor:pointer;background:var(--soft);overflow:hidden;text-align:center;padding:16px;color:var(--muted)}
.drop.over{border-color:var(--blue);background:var(--info-bg)}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer}
.drop img{max-width:100%;max-height:320px;border-radius:10px}
.aiSide{display:flex;flex-direction:column;gap:12px}
textarea{display:block;width:100%;font:inherit;font-size:15px;color:var(--text);background:var(--input);border:1px solid var(--input-line);border-radius:11px;padding:10px 13px;resize:vertical}
textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(255,122,47,.15)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.histList{display:grid;gap:6px}
.histRow{all:unset;cursor:pointer;display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:12px;box-shadow:0 0 0 1px var(--line);color:var(--text)}
.histRow:hover{background:var(--soft)}.histRow small{color:var(--muted)}
@media(max-width:680px){.aiUpload{grid-template-columns:1fr}}

/* daily review */
.autoGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;align-items:end;margin-bottom:14px}
.suggList{display:grid;gap:12px}
.sugg{padding:16px 18px;border-radius:14px;box-shadow:0 0 0 1px var(--line)}
.sugg h3{font-size:15px;margin:0 0 4px}
.sugg .was{color:var(--muted);font-size:13px;margin:0 0 10px}
.sugg .new{display:flex;gap:8px;align-items:flex-start;margin:4px 0;font-size:14px}
.sugg .new b{flex:none;width:28px;color:var(--muted);font-weight:600}
.sugg .new span{flex:1}
.sugg .reason{font-size:13px;color:var(--text);margin:8px 0 4px}
.sugg .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.sugg button.mini.go{background:var(--green);color:#fff}.sugg button.mini.go:hover{background:var(--go-hover)}
.sugg button.mini.ghost{background:var(--soft);color:var(--text)}
.sugg a.mini{display:inline-block;padding:5px 12px;font-size:12px;border-radius:980px;background:rgba(255,122,47,.1);color:var(--blue);text-decoration:none;font-weight:500}
.sugg a.mini:hover{background:rgba(255,122,47,.18)}
.prio{font-size:11px;border-radius:980px;padding:3px 9px;margin-left:8px;vertical-align:2px;background:var(--soft);color:var(--muted)}
.prio.yuqori{background:var(--red-bg);color:var(--red)}.prio.o\'rta{background:var(--orange-bg);color:var(--orange)}
.rHead{display:flex;gap:12px;align-items:flex-start;margin-bottom:8px}
.rHead img{width:48px;height:48px;object-fit:cover;border-radius:10px;flex:none;background:var(--soft)}
.stars{letter-spacing:1px;color:#f5a623}.stars.r1,.stars.r2{color:var(--red)}.stars.r3{color:var(--orange)}
.rHead small{color:var(--muted)}
.rBody p{margin:4px 0;font-size:14px}
.rCard textarea{margin-top:6px}
.dialog{display:flex;flex-direction:column;gap:6px;margin:6px 0}
.bubble{max-width:80%;padding:8px 12px;border-radius:14px;font-size:14px;white-space:pre-wrap}
.bubble.them{background:var(--soft);align-self:flex-start;border-bottom-left-radius:4px}
.bubble.me{background:var(--info-bg);color:var(--info);align-self:flex-end;border-bottom-right-radius:4px}
.sentReply{background:var(--green-bg);color:var(--green);padding:8px 12px;border-radius:10px}
.lTiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-top:6px}
.lTile{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:14px;background:var(--soft)}
.lTile small{color:var(--muted);font-size:12px}.lTile b{font-size:22px;font-weight:600;letter-spacing:-.02em}.lTile span{font-size:12.5px;color:var(--muted)}
button.lTile,button.lTile:hover,button.lTile:focus{background:var(--soft);color:var(--text)}
button.lTile:hover{background:var(--seg)}
.lTile.on{box-shadow:0 0 0 2px var(--blue) inset}.lTile.total{cursor:default;background:var(--red-bg)}.lTile.total b{color:var(--red);font-size:18px}
.lCard .rHead{align-items:center}.lCard .rHead>div:nth-child(2){flex:1}
.lValue{text-align:right;flex:none}.lValue b{display:block}.lValue small{color:var(--muted)}
.lCard.marked{opacity:.6}
.aiConn{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.aiConn input{flex:1;min-width:220px}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin-top:10px}
.kpi{padding:14px 16px;border-radius:14px;background:var(--soft);display:flex;flex-direction:column;gap:3px}
.kpi small{color:var(--muted);font-size:12px}.kpi b{font-size:22px;font-weight:600;letter-spacing:-.02em}
.kpi span{font-size:12px;color:var(--muted)}.kpi em{font-style:normal;font-weight:600}.kpi em.up{color:var(--green)}.kpi em.down{color:var(--red)}
.chart{width:100%}
svg.bars{display:block;max-width:100%}
svg.bars rect{fill:var(--blue);opacity:.85}svg.bars rect:hover{opacity:1;fill:var(--blue-hover)}
svg.bars text{font-size:11px;fill:var(--muted);font-family:inherit}
svg.bars line.grid{stroke:var(--line);stroke-width:1}
td.prod{min-width:280px}.pcell{display:flex;gap:10px;align-items:center}
.pcell img{width:40px;height:40px;object-fit:cover;border-radius:8px;flex:none;background:var(--soft)}
.pcell small{color:var(--muted);font-size:11.5px}
.share{display:flex;align-items:center;gap:6px;justify-content:flex-end}.share i{display:block;height:6px;border-radius:3px;background:var(--blue);max-width:60px}
.report{padding:14px 18px;border-radius:14px;box-shadow:0 0 0 1px var(--line);margin-bottom:10px}
.report summary{color:var(--text);font-weight:600}

/* status page bits used by app.js */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:20px}
.stats .card{margin:0}
.stats label{font-size:12px;color:var(--muted)}
.stats strong{display:block;font-size:26px;font-weight:600;letter-spacing:-.02em;margin:8px 0 4px}
.stats small{color:var(--muted);font-size:12px}
#settingsForm>label{margin-bottom:16px}
.columns{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 18px}
.columns label{display:flex;align-items:center;gap:8px;background:var(--soft);color:var(--text);padding:7px 12px;border-radius:980px}
.empty{text-align:center;padding:36px 10px}.empty h3{margin:0 0 4px}
#accessForm{display:flex;gap:10px}#accessForm input{flex:1}
/* sign-in screen: own full page, no menu or page header */
body.booting aside,body.booting main{visibility:hidden}
body.locked aside,body.locked header{display:none}
body.locked main{margin:0;max-width:none;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px}
body.locked #access{width:100%;max-width:400px;margin:0;padding:36px 32px}
.loginBrand{display:none;padding:0 0 26px;text-align:center}body.locked .loginBrand{display:block}
body.locked #access h2,body.locked #access>p{text-align:center}
body.locked .loginForm button{align-self:stretch}
.loginForm{display:flex;flex-direction:column;gap:10px}.loginForm button{align-self:flex-start;min-width:120px}
.keyLogin{margin-top:18px;font-size:13px;color:var(--muted)}.keyLogin summary{cursor:pointer;margin-bottom:10px}
.acctForm{display:flex;flex-direction:column;gap:12px;margin-bottom:14px}.acctForm label{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--muted)}
.acctForm label[hidden]{display:none}.acctForm button{align-self:flex-start;min-width:120px}
#authFields{max-width:460px}#authFields label{margin-bottom:12px}#authFields button{margin:0 8px 10px 0}
details{margin-top:16px}summary{cursor:pointer;color:var(--blue)}
#screen{width:100%;margin-top:14px;border-radius:12px;border:1px solid var(--line)}#showScreen{margin-top:12px}
#notice{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);max-width:460px;background:var(--toast);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:#fff;padding:12px 22px;border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.2);font-size:14px;z-index:20;animation:rise .25s var(--ease)}
section{scroll-margin-top:24px}

@media(max-width:1000px){aside{width:200px}main{margin-left:200px;padding:28px}.stats{grid-template-columns:1fr}.grid3{grid-template-columns:1fr}header{flex-direction:column;align-items:flex-start}}
@media(max-width:680px){aside{position:static;width:auto;border:0;padding:14px 16px}nav,aside footer{display:none}.brand{padding:0}main{margin-left:0;padding:16px}h1{font-size:30px}.card{padding:20px;border-radius:16px}.headRight{width:100%;flex-direction:column;align-items:stretch}.cardHead{flex-direction:column}td.sku{padding-left:16px}}
/* invoice scanner */
.scanBox{background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:18px;margin:0 0 16px}
.scanTop{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.scanInput{flex:1;min-width:220px;font-size:20px!important;padding:14px 16px!important;letter-spacing:.02em}
.scanProgress{height:8px;border-radius:980px;background:var(--soft);overflow:hidden;margin:16px 0 8px}
.scanBar{height:100%;width:0;background:var(--green);border-radius:980px;transition:width .3s var(--ease)}
.scanStats{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}.scanStats strong{font-size:22px}
.scanLast{margin-top:12px;padding:14px 16px;border-radius:12px;background:var(--soft);font-size:17px;font-weight:600}
.scanLast.ok{background:var(--green-bg);color:var(--green)}
.scanLast.bad{background:var(--red-bg);color:var(--red)}
.scanLast.again{background:var(--orange-bg);color:var(--orange)}
.scanLast.flash{animation:scanFlash .45s var(--ease)}
@keyframes scanFlash{0%{transform:scale(1.03)}100%{transform:scale(1)}}
.scanCamBox{position:relative;width:100%;max-width:460px;aspect-ratio:1;margin-top:12px;border-radius:20px;overflow:hidden;background:#000}
.scanVideo{display:block;width:100%;height:100%;object-fit:cover}
.scanAim{position:absolute;inset:10%;border:3px solid rgba(255,255,255,.9);border-radius:18px;box-shadow:0 0 0 100vmax rgba(0,0,0,.35);pointer-events:none}
.scanCamBtn{white-space:nowrap}
tr.scanned td{background:var(--green-bg)!important}
tr.scanned .scanState{color:var(--green);font-weight:700}
tr.cancelled td{background:var(--red-bg)!important}
tr.cancelled .scanState{color:var(--red);font-weight:700}
.scanState{white-space:nowrap}
/* lost goods claim */
.claimTop{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:8px}
.claimTop h2{margin:0}
.claimTools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.cShops{display:flex;gap:6px;flex-wrap:wrap}
.cShop{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:13px}
.cShop.on{background:var(--info-bg);color:var(--blue)}
.cShop input{margin:0}
.claimTable{min-width:820px}.claimTable td{vertical-align:middle}
.claimTable th{white-space:normal;line-height:1.25}.claimTable th.num{max-width:120px}
.claimTable td:nth-child(3){min-width:260px}.claimTable td.num,.claimTable td:nth-child(4){white-space:nowrap}
.claimTable .cPh{width:52px}.claimTable .cPh img{width:44px;height:44px;object-fit:cover;border-radius:8px;display:block}
.claimTable td b{display:block;font-weight:600}
.cSub{display:block;font-family:ui-monospace,Consolas,monospace;font-size:11.5px;margin-top:2px}
.claimTable tr.off td{opacity:.45}
.claimTable tfoot td{border-top:1px solid var(--line);padding-top:12px;font-size:15px}
.claimDialog{border:0;border-radius:18px;padding:0;width:min(760px,calc(100vw - 32px));max-height:calc(100vh - 32px);background:var(--card);color:var(--text);box-shadow:0 30px 80px rgba(0,0,0,.35)}
.claimDialog::backdrop{background:rgba(0,0,0,.45);backdrop-filter:blur(2px)}
.claimDialog form{display:flex;flex-direction:column;gap:14px;padding:22px 24px}
.dlgHead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.dlgHead h2{margin:0 0 2px}
.dlgX{font-size:18px;padding:4px 10px}
.claimDialog fieldset{border:1px solid var(--line);border-radius:12px;padding:12px 14px 14px;margin:0}
.claimDialog legend{font-weight:600;font-size:13px;padding:0 6px}
.fGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px}
.fGrid label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.fGrid label.wide{grid-column:1/-1}
.fGrid input{width:100%}
.dlgFoot{display:flex;justify-content:flex-end;gap:10px}
@media (max-width:640px){.fGrid{grid-template-columns:1fr}}

/* ===== skin: black cards, lime + orange accents, condensed bold headings, round pills ===== */
/* the logo's typeface (Inter), served by the panel itself so every device shows the same letters */
@font-face{font-family:"Inter usync";src:url("/static/fonts/Inter-Bold.woff2") format("woff2");font-weight:700 900;font-style:normal;font-display:swap}
/* used only for page and card titles (like "ANALITIKA"); body text keeps the system font */
:root{--display:"Inter usync",Inter,"Segoe UI",sans-serif}
body{background:var(--bg)}
h1,h2{font-family:var(--display);font-weight:800}
h1{font-size:50px;text-transform:uppercase;letter-spacing:-.035em;line-height:1}
h2{font-size:20px;text-transform:uppercase;letter-spacing:-.01em}
.kpi b,.lTile b,.stats strong,td.big,.scanStats strong{font-weight:700;letter-spacing:-.02em}
.lead{font-size:15px;max-width:720px}

/* sidebar: black column, pill links with round icon chips */
aside{background:var(--aside);border-right:0;backdrop-filter:none;-webkit-backdrop-filter:none;padding:26px 16px;width:256px}
main{margin-left:256px}
nav a{white-space:nowrap}
nav{gap:6px}
nav a{padding:6px 14px 6px 6px;border-radius:999px;font-size:14px;font-weight:500;color:var(--text);transition:background .2s var(--ease),color .2s}
nav a .ico{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--pill);opacity:1;font-size:15px;flex:none;transition:background .2s,color .2s}
nav a:hover{background:var(--pill)}
nav a:hover .ico{background:var(--pill-hover)}
nav a.active{background:var(--accent);color:var(--on-accent);font-weight:700}
nav a.active .ico{background:var(--on-accent);color:var(--accent)}
.themeBtn{background:var(--pill);padding:8px 14px}
.themeBtn:hover{background:var(--pill-hover)}

/* cards */
.card{border-radius:var(--radius);padding:30px;box-shadow:var(--shadow);border:0}
.card .cardHead h2,.card>h2{margin-bottom:2px}
main{padding:44px 48px 80px}
header{margin-bottom:32px}

/* buttons */
button{background:var(--pill);color:var(--text);font-weight:600;padding:11px 22px;border-radius:999px}
button:hover{background:var(--pill-hover)}
button.go{background:var(--accent);color:var(--on-accent);padding:13px 26px;font-weight:700}
button.go:hover{background:var(--go-hover)}
button.secondary,button.mini{background:var(--pill);color:var(--text)}
button.secondary:hover,button.mini:hover{background:var(--pill-hover)}
button.mini{padding:6px 14px}
button.ghost{color:var(--blue)}
button.danger{background:var(--red-bg);color:var(--red)}
.sugg a.mini{background:var(--pill);color:var(--text)}
.sugg a.mini:hover{background:var(--pill-hover)}
.sugg button.mini.go{background:var(--accent);color:var(--on-accent)}

/* inputs */
input:not([type=checkbox]),select,textarea{background:var(--input);border:1px solid transparent;border-radius:16px;padding:11px 15px}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--ring)}
select.compact{border-radius:999px}
input[type=checkbox]{accent-color:var(--accent)}
.switch input:checked+i{background:var(--accent)}
.switch input:checked+i::after{background:var(--on-accent)}

/* segmented: dark pill, lime active */
.segmented{background:var(--seg);border-radius:999px;padding:4px;gap:4px}
.segmented button{border-radius:999px;padding:8px 18px;font-weight:600;color:var(--text);background:none}
.segmented button.active{background:var(--seg-active);color:var(--on-accent);box-shadow:none}
.segmented button.active .count{background:var(--on-accent);color:var(--accent)}

/* chips, pills, badges */
.badge{border-radius:999px;font-weight:700;padding:7px 14px}
.badge.good{background:var(--accent);color:var(--on-accent)}
.pill{font-weight:600}
.pill.active,.pill.good{background:var(--accent);color:var(--on-accent)}
.pill.created,.pill.announced{background:var(--orange);color:#0b0b0b}
.chip.on{background:var(--orange);color:#0b0b0b}
.cShop.on{background:var(--accent);color:var(--on-accent)}

/* tables */
.tablewrap{border:0;border-radius:20px;background:var(--card)}
th{background:var(--th);text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-weight:700;border-bottom:1px solid var(--line)}
td{border-bottom:1px solid var(--line)}
tr.totalRow td{background:var(--soft)}

/* tiles / KPIs: big condensed numbers */
.kpi,.lTile{border-radius:22px;padding:18px 20px;background:var(--soft)}
.kpi b,.lTile b{font-size:34px;font-weight:700;letter-spacing:0;line-height:1.05}
.kpi small,.lTile small{text-transform:uppercase;letter-spacing:.06em;font-weight:700;font-size:11px}
.lTile.on{box-shadow:0 0 0 2px var(--accent) inset}
.lTile.total{background:var(--orange-bg)}.lTile.total b{color:var(--orange);font-size:30px}
.stats strong{font-size:34px}

/* charts */
svg.bars rect{fill:var(--accent);opacity:.95}
svg.bars rect:hover{fill:var(--orange);opacity:1}
.share i{background:var(--accent)}

/* lists and rows */
.invRow,.slot,.huntRow,.sugg,.comp,.histRow,.report{border-radius:20px}
.invMain:hover{background:var(--soft)}
.autoStatus,.moveBox,p.note{border-radius:16px}
.scanBox{border-radius:24px}
.scanLast.ok{background:var(--accent);color:var(--on-accent)}
.bubble.me{background:var(--accent);color:var(--on-accent)}
.sentReply{background:var(--accent);color:var(--on-accent)}
.warnCard{border:1px solid var(--warn-line)}

/* login screen */
body.locked #access{border-radius:32px}
.brand .word b,.loginBrand .word b{color:#5b2bff}

/* smaller screens (these come after the skin so they win) */
@media (max-width:1000px){aside{width:214px}main{margin-left:214px;padding:28px}nav a{font-size:13px}h1{font-size:42px}}
@media (max-width:680px){aside{position:static;width:auto;padding:14px 16px}main{margin-left:0;padding:16px}nav,aside footer{display:none}
  .card{padding:20px;border-radius:22px}h1{font-size:34px}}
.kpi.warnTile{background:var(--orange-bg)}.kpi.warnTile b{color:var(--orange)}
.loginForm>button{background:var(--accent);color:var(--on-accent);font-weight:700}.loginForm>button:hover{background:var(--go-hover)}
/* motion: charts grow, tiles and rows slide in, numbers count up (app.js) */
@keyframes barUp{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes growW{from{width:0}}
@keyframes popIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes rowIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
svg.bars rect{transform-box:fill-box;transform-origin:50% 100%;animation:barUp .75s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 18ms)}
.share i,.scanBar{animation:growW .9s cubic-bezier(.2,.8,.2,1) both}
.kpi,.lTile{animation:popIn .5s cubic-bezier(.2,.8,.2,1) both}
.kpis>:nth-child(2),.lTiles>:nth-child(2){animation-delay:.05s}.kpis>:nth-child(3),.lTiles>:nth-child(3){animation-delay:.1s}
.kpis>:nth-child(4),.lTiles>:nth-child(4){animation-delay:.15s}.kpis>:nth-child(5),.lTiles>:nth-child(5){animation-delay:.2s}
.kpis>:nth-child(6),.lTiles>:nth-child(6){animation-delay:.25s}.kpis>:nth-child(n+7),.lTiles>:nth-child(n+7){animation-delay:.3s}
:is(#aTop,#aMonths,#cRows,#arRows) tr:nth-child(-n+25){animation:rowIn .4s ease both}
:is(#aTop,#aMonths,#cRows,#arRows) tr:nth-child(2){animation-delay:.03s}:is(#aTop,#aMonths,#cRows,#arRows) tr:nth-child(3){animation-delay:.06s}
:is(#aTop,#aMonths,#cRows,#arRows) tr:nth-child(4){animation-delay:.09s}:is(#aTop,#aMonths,#cRows,#arRows) tr:nth-child(5){animation-delay:.12s}
:is(#aTop,#aMonths,#cRows,#arRows) tr:nth-child(n+6):nth-child(-n+25){animation-delay:.15s}
.invRow,.slot{animation:popIn .45s cubic-bezier(.2,.8,.2,1) both}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.kpi.still,.lTile.still{animation:none}
/* print panel: slides in from the right, pages as white cards */
.printDrawer{position:fixed;inset:0;z-index:50}
.printShade{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .25s ease}
.printPanel{position:absolute;top:0;right:0;bottom:0;width:min(760px,100vw);display:flex;flex-direction:column;background:var(--bg);
  border-left:1px solid var(--line);box-shadow:-30px 0 80px rgba(0,0,0,.45);transform:translateX(100%);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.printDrawer.open .printShade{opacity:1}.printDrawer.open .printPanel{transform:none}
.printHead{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;border-bottom:3px solid var(--accent);background:var(--card)}
.printHead h2{margin:0}.printHead p{margin:4px 0 0}
.printX{font-size:18px;padding:6px 12px}
.printPages{flex:1;overflow:auto;padding:22px;display:flex;flex-direction:column;align-items:center;gap:14px}
.printCard{background:#fff;border-radius:14px;padding:10px;box-shadow:0 8px 30px rgba(0,0,0,.35);max-width:560px;width:100%;
  animation:popIn .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 50ms)}
.printCard img{display:block;width:100%;height:auto;border-radius:6px;min-height:120px;background:#f4f4f4}
.printFrame{position:fixed;right:0;bottom:0;width:1px;height:1px;border:0;opacity:0;pointer-events:none}
/* supply plan */
.rCfg{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;align-items:end;margin:6px 0 16px}
.rTable td{vertical-align:middle}.rTable td:nth-child(2){min-width:260px}
.minInput{width:76px!important;text-align:right;padding:7px 10px!important;margin-left:auto}
td.sendBig{font-size:20px;font-weight:800;color:var(--blue)}
.daysBar{width:110px;height:6px;border-radius:99px;background:var(--soft);overflow:hidden;margin-bottom:4px}
.daysBar i{display:block;height:100%;border-radius:99px;background:var(--green);animation:growW .8s cubic-bezier(.2,.8,.2,1) both}
.daysBar i.urgent{background:var(--red)}.daysBar i.soon{background:var(--orange)}.daysBar i.excess{background:var(--blue)}
.pill.warnPill{background:var(--orange-bg);color:var(--orange)}
.kpi.badTile{background:var(--red-bg)}.kpi.badTile b{color:var(--red)}
.kpi.accentTile{background:var(--accent)}.kpi.accentTile b,.kpi.accentTile small,.kpi.accentTile span{color:var(--on-accent)}
/* product thumbnails in any table, supply table fits the screen */
td.cPh{width:52px}td.cPh img{width:44px;height:44px;object-fit:cover;border-radius:8px;display:block;background:var(--soft)}
.rTable th{white-space:normal;line-height:1.25}
.rTable th,.rTable td{padding-left:8px;padding-right:8px}
.rTable td:nth-child(2){min-width:220px;max-width:340px}
.rTable .daysBar{width:72px}
.rTable td.num{white-space:nowrap}
.kpi.clickTile{cursor:pointer;transition:transform .15s}.kpi.clickTile:hover{transform:translateY(-2px)}
.kpi.goodTile b{color:var(--green)}
/* effect of an applied title */
.effect{margin:10px 0 6px;padding:12px 14px;border-radius:16px;background:var(--soft)}
.effect p{margin:0 0 8px}
.effectHead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}.effectHead small{color:var(--muted)}
.effectGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.effectGrid div{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border-radius:12px;background:var(--card)}
.effectGrid small{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.effectGrid b{font-size:15px}.effectGrid span{font-size:12px;font-weight:600}
.green{color:var(--green)}
@media (max-width:680px){.effectGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- phone: top bar + menu drawer, cards instead of wide tables, big tap targets ---------- */
.navBtn{display:none}
@media (max-width:680px){
  aside{position:sticky;top:0;inset:auto;width:auto;height:auto;z-index:30;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;
    justify-content:space-between;padding:10px 16px;padding-top:max(10px,env(safe-area-inset-top));border-right:0;border-bottom:1px solid var(--line)}
  aside .brand{padding:0}aside .brand .word{font-size:26px}aside .brand small{display:none}
  .navBtn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;font-size:20px;border-radius:14px;background:var(--pill);color:var(--text)}
  body.navOpen{overflow:hidden}
  body.navOpen aside{position:fixed;inset:0;height:100dvh;align-content:flex-start;overflow-y:auto;background:var(--bg)}
  body.navOpen main{padding-top:84px}
  body.navOpen nav{display:grid;width:100%;gap:4px;margin-top:14px}
  body.navOpen nav a{font-size:17px;padding:13px 14px;border-radius:14px}
  body.navOpen aside footer{display:block;width:100%;margin-top:18px;padding:0 4px 20px}
  main{padding:14px 12px 60px;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  header{flex-direction:column;align-items:stretch;gap:12px;margin-bottom:18px}
  h1{font-size:28px}.lead{font-size:14px}h2{font-size:19px}
  .card{padding:16px;border-radius:20px;margin-bottom:14px}
  .shopPick,.printOpts,.printOpts label{min-width:0;width:100%}.printOpts{flex-direction:column;align-items:stretch}.printOpts select{min-width:0;width:100%}
  .cardHead,.actions,.toolbar,.detailHead,.headRight{flex-direction:column;align-items:stretch;gap:10px}
  .btns{flex-wrap:wrap}.btns>button{flex:1 1 auto}
  button{min-height:44px}button.ghost{min-height:0}button.mini{min-height:36px}
  input:not([type=checkbox]),select,textarea{font-size:16px}  /* iPhone does not zoom into 16px fields */
  .segmented{display:flex;max-width:100%;overflow-x:auto;scrollbar-width:none}.segmented::-webkit-scrollbar{display:none}
  .segmented button{flex:1 0 auto;min-height:40px}
  /* tables: every row is a card, each value under its column name */
  .tablewrap,.tablewrap.tall{max-height:none;overflow:visible;background:none;border-radius:0}
  .tablewrap table,.tablewrap tbody,.tablewrap tfoot{display:block;width:100%}
  .tablewrap thead{display:none}
  .tablewrap tr{display:block;background:var(--card);border-radius:18px;padding:8px 14px;margin:0 0 10px;box-shadow:var(--shadow)}
  .tablewrap td{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0!important;border-bottom:1px solid var(--line);
    text-align:right;white-space:normal;min-width:0!important;width:auto!important;background:none!important}
  .tablewrap td:last-child{border-bottom:0}
  .tablewrap td::before{content:attr(data-label);flex:0 0 auto;max-width:45%;text-align:left;color:var(--muted);font-size:11px;font-weight:700;
    text-transform:uppercase;letter-spacing:.05em}
  .tablewrap td[data-label=""]::before,.tablewrap td:not([data-label])::before{display:none}
  .tablewrap td[data-label=""],.tablewrap td:not([data-label]){justify-content:flex-start;text-align:left}
  .tablewrap td>*{min-width:0}.tablewrap td .pc,.tablewrap td .pcell{text-align:left}
  .tablewrap td:has(.pc,.pcell,textarea,.bubble){flex-direction:column;align-items:stretch;text-align:left}
  .tablewrap .pc.item,td.prod{min-width:0!important}
  .tablewrap table{min-width:0!important}.tablewrap td{white-space:normal!important}
  main{overflow-x:clip}
  .printOpts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.printOpts label span{font-size:12px}
  .tablewrap tr.scanned{background:var(--green-bg)}.tablewrap tr.cancelled{background:var(--red-bg)}
  .tablewrap td.chk{justify-content:flex-end}
  .tablewrap input.price{margin-left:0}
  /* scanner: camera first, big */
  .scanBox{padding:14px}
  .scanTop{flex-direction:column;align-items:stretch}
  .scanCamBtn{order:-1;font-size:17px;min-height:54px}
  .scanInput{min-width:0;font-size:18px!important}
  .scanCamBox{max-width:none}
  .scanLast{font-size:16px}
  .printHead{padding:14px 16px;padding-top:max(14px,env(safe-area-inset-top))}.printPages{padding:14px}
}

/* drop-off points map (new invoice) */
.dopMapBox{margin:14px 0 6px}
.dopMapHead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}.dopMapHead button{margin-left:auto}
.dopMap{height:440px;border-radius:20px;overflow:hidden;background:var(--soft);z-index:0}
.dopPicked{margin-top:8px;font-weight:600;min-height:1.4em}
.dopPop{display:grid;gap:6px;font:14px/1.35 inherit}.dopPop strong{font-weight:600}.dopPop .mini{justify-self:start;margin-top:2px}
.leaflet-container{font:inherit}
.darkTiles{filter:invert(1) hue-rotate(180deg) brightness(.9) contrast(.85) saturate(.6)}
.dopMap .leaflet-popup-content-wrapper,.dopMap .leaflet-popup-tip{background:var(--card);color:var(--text);box-shadow:0 8px 30px rgba(0,0,0,.35)}
.dopMap .leaflet-popup-content-wrapper{border-radius:16px}
.dopMap.leaflet-container a.leaflet-popup-close-button{color:var(--muted)}
.dopMap .leaflet-control-attribution{background:rgba(0,0,0,.45)!important;color:#ccc!important}.dopMap .leaflet-control-attribution a{color:#ddd!important}
.dopMap .leaflet-bar a{background:var(--card);color:var(--text);border-color:var(--line)}.dopMap .leaflet-bar a:hover{background:var(--soft)}
@media (max-width:680px){.dopMap{height:360px}.dopMapHead button{margin-left:0}}

/* Natija page: one card per title change */
.nHow{margin:12px 0 0}
.nList{display:grid;gap:14px}
.nCard{background:var(--card);border-radius:var(--radius);padding:20px 22px;box-shadow:var(--shadow);animation:popIn .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 40ms)}
.nTop{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.nTop img{width:56px;height:56px;border-radius:14px;object-fit:cover;background:var(--soft);flex:none}
.nHead{display:flex;flex-direction:column;gap:6px;min-width:0}
.nVerdict{align-self:flex-start;font-weight:800;font-size:16px;padding:7px 14px;border-radius:999px;background:var(--soft);color:var(--text)}
.nVerdict.vBetter{background:var(--green-bg);color:var(--green)}.nVerdict.vWorse{background:var(--red-bg);color:var(--red)}
.nVerdict.vSame{background:var(--orange-bg);color:var(--orange)}.nVerdict.vNone{background:var(--soft);color:var(--muted)}
.nVerdict.vEarly{background:var(--info-bg,var(--soft));color:var(--blue)}
.nTitles{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:stretch;margin-bottom:12px}
.nTitles>div:not(.nArrow){display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:16px;background:var(--soft)}
.nTitles small,.nSide small{color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.nWas span{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(255,91,79,.6)}
.nNow span{font-weight:600}
.nArrow{align-self:center;color:var(--muted);font-size:20px;font-weight:700}
.nWarn{margin:0 0 10px}
.nBig{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;margin:4px 0 12px}
.nSide{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:16px;background:var(--soft)}
.nSide b{font-size:28px;font-weight:800;line-height:1.1}
.nWrap{max-height:none}.nTable td.nLabel{color:var(--muted)}
.kpi.nGood b{color:var(--green)}.kpi.nBad b{color:var(--red)}
@media (max-width:680px){
  .nCard{padding:16px;border-radius:20px}
  .nTitles,.nBig{grid-template-columns:1fr}.nArrow{transform:rotate(90deg);justify-self:center;line-height:1}
  .nSide b{font-size:24px}
}
.nBadges{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.nVerdict.small2{font-size:13px;padding:5px 12px;font-weight:700}
.nSide strong{font-size:18px;font-weight:800;margin-top:4px}
.ddForm{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;margin:8px 0 12px}
@media (max-width:680px){.ddForm{grid-template-columns:1fr}}
.nSeo{margin:4px 0 12px;padding:12px 14px;border-radius:16px;background:var(--soft)}
.nSeoHead{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px}
.nChip{font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--card)}
.nSeoTable td small{display:block}.nSeo .tablewrap{background:var(--card)}

/* Reyting / Nishalar / Raqobatchilar */
.mInfo{margin:0}
.rankBadge{display:inline-block;font-weight:800;padding:4px 10px;border-radius:999px;background:var(--soft);white-space:nowrap}
.rankBadge.r1{background:#ffd43b;color:#1b1b1b}.rankBadge.r3{background:var(--orange-bg);color:var(--orange)}.rankBadge.r10{background:var(--green-bg);color:var(--green)}
.nGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.nItem{display:flex;gap:12px;padding:12px;border-radius:18px;background:var(--soft)}
.nItem img{width:76px;height:76px;border-radius:12px;object-fit:cover;flex:none;background:var(--card)}
.nItemBody{display:flex;flex-direction:column;gap:4px;min-width:0}
.nItemTitle{font-weight:600;color:var(--text);text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nItemTitle:hover{text-decoration:underline}
.nItemGrowth{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:2px}
.kList{display:grid;gap:14px}
.kCard{background:var(--card);border-radius:var(--radius);padding:20px 22px;box-shadow:var(--shadow)}
.kCard .nTop img{width:56px;height:56px;border-radius:14px;object-fit:cover;background:var(--soft)}
.kTitle{font-weight:700;color:var(--text);text-decoration:none}.kTitle:hover{text-decoration:underline}
.kRecs{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:8px}
.kRecs li{display:flex;gap:10px;padding:10px 12px;border-radius:14px;background:var(--soft);line-height:1.4}
.kRecs li.k-ok{background:var(--green-bg)}.kIco{flex:none}
.kRivals{margin-top:12px}.kRivals summary{cursor:pointer;font-weight:600;color:var(--blue)}
.kRival{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.kRival img{width:44px;height:44px;border-radius:10px;object-fit:cover;flex:none;background:var(--soft)}
.kRival a{color:var(--text);font-weight:600;text-decoration:none}.kRival small{display:block}
#kSearch{max-width:360px}
@media (max-width:680px){.kCard{padding:16px;border-radius:20px}.nGrid{grid-template-columns:1fr}}

.ozChecks{list-style:none;padding:0;margin:8px 0;display:grid;gap:6px;font-weight:600}

/* AI yordamchi: card texts from a photo */
.aiBtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.aiBtns button{flex:1 1 160px}
.lsCats{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0 12px;font-size:14px;color:var(--muted)}
.lsLang{display:flex;gap:6px;margin:4px 0 12px}.lsLang .chip{cursor:pointer;border:0;font:inherit}
.lsField{margin-bottom:16px}
.lsHead{display:flex;align-items:center;gap:10px;margin-bottom:6px}.lsHead b{color:var(--text)}
.lsCount{margin-left:auto;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.lsCount.over{color:var(--red);font-weight:700}
.lsField textarea{width:100%;box-sizing:border-box;font:inherit;line-height:1.45;resize:vertical}
.lsRivals{display:grid;gap:6px;margin-top:8px}
.lsRivals a{display:block;padding:8px 12px;border-radius:14px;background:var(--soft);color:var(--text);text-decoration:none}
.lsRivals a small{display:block;color:var(--muted)}

/* Hisob: all connections in one place */
.pageSub{margin:28px 4px 12px;font-size:20px}
.loginBar{display:block;margin-bottom:16px;padding:14px 20px;text-decoration:none;color:var(--text)}
/* Tovar yuklash */
.tyGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px 12px;margin:10px 0}
.tyGrid .tyWide{grid-column:span 2}
.tyThumbs{display:flex;gap:8px;flex-wrap:wrap}
.tyThumbs figure{position:relative;margin:0;width:78px;height:104px;border-radius:10px;overflow:hidden;background:var(--soft)}
.tyThumbs img{width:100%;height:100%;object-fit:cover}
.tyThumbs figure.main{outline:2px solid var(--blue)}
.tyThumbs button{position:absolute;top:3px;right:3px;width:22px;height:22px;padding:0;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;font-size:13px;line-height:22px;cursor:pointer}
.tyLang{display:flex;gap:6px;margin:14px 0 12px}.tyLang .chip{cursor:pointer;border:0;font:inherit}
@media (max-width:640px){.tyGrid .tyWide{grid-column:auto}.tyGrid{grid-template-columns:1fr 1fr}}
/* AI rasmlar */
.prodCell{display:flex;gap:10px;align-items:center;min-width:220px}.prodCell img{width:42px;height:56px;object-fit:cover;border-radius:8px;flex:none}
.prodCell span{display:flex;flex-direction:column;gap:2px}.prodCell small{color:var(--muted)}
.rmJob{border:1px solid var(--input-line);border-radius:16px;padding:14px;margin:12px 0}
.rmHead{display:flex;gap:12px;align-items:center}.rmHead img{width:54px;height:72px;object-fit:cover;border-radius:10px}.rmHead p{margin:4px 0 0;color:var(--muted);font-size:13px}
.rmWhy{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 16px;margin:12px 0}.rmList ul{margin:6px 0 0;padding-left:18px;font-size:13px}
.rmRivals{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.rmRivals a{display:flex;flex-direction:column;width:84px;font-size:11px;color:var(--muted);text-decoration:none}
.rmRivals img{width:84px;height:112px;object-fit:cover;border-radius:8px}.rmRivals a.weak img{opacity:.6}
.rmShots{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px;margin:12px 0}
.rmShot{display:flex;gap:8px;align-items:flex-start;background:var(--soft);border-radius:12px;padding:10px;cursor:pointer}.rmShot span{display:flex;flex-direction:column;gap:3px;color:var(--text)}.rmShot small{color:var(--muted)}
.rmDraw{display:flex;gap:8px;flex-wrap:wrap}.rmDraw input{flex:1 1 260px}.rmDraw button{flex:0 0 auto}
.rmImgs{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.rmImgs figure{margin:0;width:150px}.rmImgs img{width:150px;height:200px;object-fit:cover;border-radius:10px;cursor:zoom-in;display:block}
.rmImgs label{display:flex;gap:6px;align-items:center;margin-top:6px;color:var(--text);font-size:12px}
.rmImgs figure.wait{display:grid;place-items:center;height:200px;background:var(--soft);border-radius:10px;padding:8px;font-size:12px;color:var(--muted);text-align:center}
@media (max-width:640px){.rmImgs figure,.rmImgs img{width:calc(50vw - 40px)}.rmImgs img{height:calc((50vw - 40px)*4/3)}}
.tyPhotos{margin:18px 0;padding:14px;border-radius:14px;background:var(--soft)}.tyPhotos h3{margin:0 0 6px}
.rmColor{flex:1 1 220px}.rmColor select{margin-top:2px}
.rmShot{flex-direction:column;cursor:default}.rmShot label{display:flex;gap:8px;align-items:flex-start;cursor:pointer}.rmShot input:not([type=checkbox]),.rmShot textarea{font-size:13px;padding:7px 10px}
.rmShot textarea{width:100%;box-sizing:border-box;font:inherit;font-size:13px;resize:vertical}
.rmDraw select{flex:1 1 240px}
.rmImgs figure small{display:block;font-size:11px;margin-top:4px}.rmBad{color:var(--red)}.rmOk{color:var(--green,#1a7f37)}
.rmImgs details{margin-top:6px;font-size:12px}.rmImgs details input,.rmImgs details textarea,.rmImgs details select{font-size:12px;padding:6px 8px;margin:4px 0;width:100%;box-sizing:border-box}
/* staff: pickers see only the picking pages */
body.staffMode .ownerOnly{display:none!important}
.pickBox{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:10px 0}
.whoShade{position:fixed;inset:0;background:rgba(0,0,0,.55);display:grid;place-items:center;z-index:200;padding:16px}
.whoBox{background:var(--card,#1c1c1e);color:var(--text);border-radius:20px;padding:20px;width:min(520px,100%);max-height:90vh;overflow:auto}
.whoBox h3{margin:0 0 6px}
.whoGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin:14px 0}
.whoName{font-size:18px;font-weight:700;padding:18px 10px;border-radius:14px;min-height:64px}
.whoName.me{outline:3px solid var(--blue)}
.mini.goMini{background:var(--blue);color:#fff}.mini.doneMini{background:var(--soft);color:var(--green,#1a7f37)}
.hdPeriod{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:8px 0 12px}.hdPeriod input{display:inline-block;width:auto}
.hdRow{cursor:pointer}.hdRow.open{background:var(--soft)}.hdRow.off{opacity:.55}.hdRow td small{display:block;color:var(--muted);font-size:11px}
.hdAdd{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin:10px 0}
.hdPeople{display:flex;flex-direction:column;gap:6px;margin:8px 0 14px}
.hdPerson{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:8px 12px;border-radius:12px;background:var(--soft)}.hdPerson span{color:var(--muted);font-size:13px;margin-right:auto}.hdPerson.off{opacity:.55}
.hdRates{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;align-items:end}
.hdFineSum{width:110px;display:inline-block;text-align:right}
#hdDetail h3{margin:18px 0 8px}
.loginForm[hidden]{display:none!important}
/* Kartochka matni */
#mtFind{flex:1;min-width:220px}#mtResult h3{margin:22px 0 6px}#mtWarn div+div{margin-top:6px}#mtVarOut .chip{cursor:default}
#screen.clickable{cursor:pointer;outline:3px solid var(--orange,#ff6a00);border-radius:8px;max-width:100%}.checkHelp{margin:10px 0}
/* the Uzum tab on the whole screen (Hisob) */
.screenBox{position:relative;margin-top:10px}.screenBox img{max-width:100%}
.screenBox .fullClose{display:none}
.screenBox:fullscreen,.screenBox.fakeFull{position:fixed;inset:0;z-index:300;margin:0;display:flex;align-items:center;justify-content:center;background:#000}
.screenBox:fullscreen img,.screenBox.fakeFull img{max-width:100vw;max-height:100vh;width:auto;height:auto;border-radius:0;outline:none}
.screenBox:fullscreen .fullClose,.screenBox.fakeFull .fullClose{display:block;position:absolute;top:12px;right:12px}

/* 2026-11-12: the menu grew to 23 items and its end fell off the screen (owner's screenshot, 931 px high).
   On desktop the menu now scrolls inside the side bar and its rows are tighter; the phone menu is untouched. */
@media (min-width:681px){
  aside{padding-top:18px;padding-bottom:12px}
  aside .brand{padding-bottom:14px}
  nav{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;gap:2px;align-content:start;
      scrollbar-width:thin;scrollbar-color:var(--pill) transparent;padding-right:4px;margin-right:-6px}
  nav::-webkit-scrollbar{width:6px}
  nav::-webkit-scrollbar-thumb{background:var(--pill);border-radius:3px}
  nav a{padding:3px 12px 3px 4px;font-size:13.5px}
  nav a .ico{width:28px;height:28px;font-size:13px}
  aside footer{margin-top:10px;flex:none}
}/* Analitika: per-shop lines + hover box (like Uzum's own chart) */
#aChart .shopLine{fill:none;stroke-width:2;stroke-linejoin:round}
#aChart .totalLine{fill:none;stroke:var(--text);stroke-width:2.2;stroke-linejoin:round;opacity:.85}
#aChart .cursorLine{stroke:var(--muted);stroke-dasharray:3 3}
#aChart .hoverDot{stroke:var(--card,#1c1c1e);stroke-width:2}
#aChart .hitCol{fill:transparent;cursor:crosshair}
.chartTip{position:absolute;top:8px;z-index:5;min-width:220px;background:#1f1f24;color:#fff;border-radius:12px;padding:10px 12px;box-shadow:0 8px 24px rgba(0,0,0,.35);pointer-events:none;font-size:13px}
.chartTip b{display:block;margin-bottom:6px}
.chartTip .tipRow{display:flex;align-items:center;gap:8px;padding:2px 0}.chartTip .tipRow i{width:9px;height:9px;border-radius:50%;flex:none}
.chartTip .tipRow span{flex:1}.chartTip .tipRow em{font-style:normal;font-variant-numeric:tabular-nums;font-weight:600}
.chartLegend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:6px}.chartLegend span{display:flex;align-items:center;gap:6px}.chartLegend i{width:9px;height:9px;border-radius:50%}
/* Sof foyda */
.pfTable td small{display:block;font-size:11px}
.pfTable tr.minus td.num{color:var(--muted)}.pfTable tr.plus td.num{color:var(--green,#1a7f37)}
.pfTable tr.sub td{font-weight:600;border-top:1px solid var(--input-line)}
.pfTable tr.total td{font-weight:800;font-size:17px;border-top:2px solid var(--text)}.pfTable tr.total.neg td.num{color:var(--red)}
.pfAdd{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:8px 0 12px}
nav .ico svg{width:17px;height:17px;display:block;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
/* Xarajatlar */
#xTiles .kpi.picked{outline:2px solid var(--blue)}
#xRows td small.xName{display:block;font-size:11px;margin-top:2px;max-width:520px}
#xRows .pill.x-fines{background:var(--warn-bg,#fde2e1);color:var(--red)}#xRows .pill.x-income{color:var(--green,#1a7f37)}
#xCustom input{display:inline-block;width:auto}
/* Pul oqimi */
.cChart{display:flex;align-items:flex-end;gap:6px;height:150px;margin:10px 0 14px;overflow-x:auto;padding-bottom:18px}
.cBar{position:relative;flex:1 0 34px;height:100%;display:flex;align-items:flex-end}
.cBar i{display:block;width:100%;background:var(--blue);border-radius:6px 6px 2px 2px}.cBar.today i{background:var(--orange,#ff6a00)}
.cBar small{position:absolute;bottom:-17px;left:0;right:0;text-align:center;font-size:10px;color:var(--muted)}
#cComing tr.today td{background:var(--soft);font-weight:600}

/* ================= 2026-11-13: warm look from the owner's reference =================
   brown-black background with an orange glow, orange accent, mint green for "good", cards with a thin edge,
   the side bar as a floating panel, and the menu folded into sections (pages of a section hang on a tree line).
   Everything below only overrides what is above; the old blocks are left as they were. */
:root{--bg:#f6f1ec;--bg-glow:radial-gradient(900px 520px at 88% -8%,rgba(242,107,29,.12),transparent 62%);--card:#fff;--card-hi:transparent;--card-line:#ece3da;--text:#1c130d;--muted:#75685e;--line:#eae1d9;--soft:#f7f1eb;--blue:#b8480a;--blue-hover:#973a07;--green:#15803d;--green-bg:#e2f5e8;--orange:#c26800;--orange-bg:#ffefd9;--red:#d93025;--red-bg:#fde8e6;--shadow:0 1px 2px rgba(60,30,10,.04),0 14px 34px rgba(60,30,10,.07);--radius:24px;--aside:#fffdfb;--brand:#1c130d;--tint:rgba(60,30,10,.06);--input:#f8f3ee;--input-line:#e6dcd2;--go-hover:#e05d12;--switch-off:#e3d9cf;--seg:#f1e9e2;--seg-hover:rgba(60,30,10,.05);--seg-active:#f26b1d;--chip-bg:#ffefd9;--chip:#c26800;--info-bg:#ffeadb;--info:#973a07;--row-hover:#faf5f0;--row-alt:#faf5f0;--picked:#fff1e6;--warn-bg:#fff7ec;--warn-line:#ffd6a0;--danger-hover:#ffd9dd;--purple-bg:#faf5f0;--purple-line:#eae1d9;--th:#fff;--toast:rgba(28,19,13,.94);--accent:#f26b1d;--accent-hi:#ff8f4a;--on-accent:#1a0d04;--pill:#f1e9e2;--pill-hover:#e8ddd3;--ring:rgba(242,107,29,.28);--tree:#d9cdc2;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0e0a08;--bg-glow:radial-gradient(900px 520px at 88% -8%,rgba(255,122,47,.20),transparent 62%),radial-gradient(720px 480px at 6% 108%,rgba(255,122,47,.10),transparent 60%);--card:#1a1410;--card-hi:rgba(255,255,255,.035);--card-line:rgba(255,255,255,.07);--text:#f7f2ed;--muted:#a3968c;--line:#2e241d;--soft:#241b15;--blue:#ffa366;--blue-hover:#ffbb8c;--green:#4ade80;--green-bg:rgba(74,222,128,.14);--orange:#fbbf24;--orange-bg:rgba(251,191,36,.14);--red:#ff6b5e;--red-bg:rgba(255,107,94,.15);--shadow:0 24px 60px rgba(0,0,0,.35);--radius:24px;--aside:#15100c;--brand:#fff;--tint:rgba(255,255,255,.06);--input:#221a14;--input-line:#34281f;--go-hover:#ff8f4d;--switch-off:#3b2e25;--seg:#241b15;--seg-hover:rgba(255,255,255,.07);--seg-active:#ff7a2f;--chip-bg:rgba(251,191,36,.14);--chip:#fbbf24;--info-bg:rgba(255,122,47,.16);--info:#ffbb8c;--row-hover:#211913;--row-alt:#1e1712;--picked:rgba(255,122,47,.13);--warn-bg:rgba(251,191,36,.07);--warn-line:rgba(251,191,36,.35);--danger-hover:rgba(255,107,94,.28);--purple-bg:rgba(255,255,255,.03);--purple-line:#34281f;--th:#1a1410;--toast:rgba(40,30,23,.97);--accent:#ff7a2f;--accent-hi:#ffa05c;--on-accent:#1a0d04;--pill:#271e17;--pill-hover:#34281f;--ring:rgba(255,122,47,.34);--tree:#40332a;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0e0a08;--bg-glow:radial-gradient(900px 520px at 88% -8%,rgba(255,122,47,.20),transparent 62%),radial-gradient(720px 480px at 6% 108%,rgba(255,122,47,.10),transparent 60%);--card:#1a1410;--card-hi:rgba(255,255,255,.035);--card-line:rgba(255,255,255,.07);--text:#f7f2ed;--muted:#a3968c;--line:#2e241d;--soft:#241b15;--blue:#ffa366;--blue-hover:#ffbb8c;--green:#4ade80;--green-bg:rgba(74,222,128,.14);--orange:#fbbf24;--orange-bg:rgba(251,191,36,.14);--red:#ff6b5e;--red-bg:rgba(255,107,94,.15);--shadow:0 24px 60px rgba(0,0,0,.35);--radius:24px;--aside:#15100c;--brand:#fff;--tint:rgba(255,255,255,.06);--input:#221a14;--input-line:#34281f;--go-hover:#ff8f4d;--switch-off:#3b2e25;--seg:#241b15;--seg-hover:rgba(255,255,255,.07);--seg-active:#ff7a2f;--chip-bg:rgba(251,191,36,.14);--chip:#fbbf24;--info-bg:rgba(255,122,47,.16);--info:#ffbb8c;--row-hover:#211913;--row-alt:#1e1712;--picked:rgba(255,122,47,.13);--warn-bg:rgba(251,191,36,.07);--warn-line:rgba(251,191,36,.35);--danger-hover:rgba(255,107,94,.28);--purple-bg:rgba(255,255,255,.03);--purple-line:#34281f;--th:#1a1410;--toast:rgba(40,30,23,.97);--accent:#ff7a2f;--accent-hi:#ffa05c;--on-accent:#1a0d04;--pill:#271e17;--pill-hover:#34281f;--ring:rgba(255,122,47,.34);--tree:#40332a;color-scheme:dark}

body{background:var(--bg-glow),var(--bg);background-attachment:fixed}
h1,h2{text-transform:none}
h2{font-size:19px;letter-spacing:-.015em}
.brand .word b,.loginBrand .word b{color:var(--accent)}

/* cards, tiles, fields */
.card{background:linear-gradient(180deg,var(--card-hi),transparent 140px),var(--card);border:1px solid var(--card-line)}
.kpi,.lTile{border:1px solid var(--card-line)}
.kpi.accentTile{background:linear-gradient(135deg,var(--accent-hi),var(--accent));border-color:transparent}
input:not([type=checkbox]),select,textarea{border-color:var(--input-line)}
.badge.good{background:var(--green-bg);color:var(--green)}

/* buttons: the main one glows orange */
button.secondary,button.mini{box-shadow:inset 0 0 0 1px var(--card-line)}
button.go,button.go:hover{background:linear-gradient(135deg,var(--accent-hi),var(--accent));color:var(--on-accent);box-shadow:0 8px 22px var(--ring)}
button.go:hover{filter:brightness(1.07)}
button.go:disabled{box-shadow:none;filter:none}

/* side bar: a floating panel */
@media (min-width:681px){
  aside{inset:14px auto 14px 14px;width:252px;border-radius:26px;border:1px solid var(--card-line);background:var(--aside);padding:20px 12px 14px;box-shadow:var(--shadow)}
  main{margin-left:280px;padding:36px 40px 80px}
  h1{font-size:36px;letter-spacing:-.03em;line-height:1.1}
}
@media (min-width:681px) and (max-width:1000px){aside{width:218px}main{margin-left:240px;padding:26px 22px 60px}h1{font-size:30px}}

/* menu rows: top-level pages and section heads look the same */
nav{gap:4px}
nav>a,nav .navHead{display:flex;align-items:center;gap:10px;width:100%;box-sizing:border-box;padding:5px 10px 5px 5px;border:0;border-radius:14px;background:none;box-shadow:none;
  font:inherit;font-size:14px;font-weight:600;color:var(--text);text-align:left;cursor:pointer;transition:background .2s var(--ease)}
nav>a:hover,nav .navHead:hover{background:var(--tint)}
nav .navHead:active{transform:none}
nav a .ico,nav .navHead .ico{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--pill);color:var(--text);opacity:1;flex:none;transition:background .2s,color .2s,box-shadow .2s}
nav a:hover .ico,nav .navHead:hover .ico{background:var(--pill-hover)}
.navLabel{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
nav .chev{display:grid;color:var(--muted);transition:transform .25s var(--ease)}
nav .chev svg{width:16px;height:16px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.navGroup.open .chev{transform:rotate(180deg)}
nav>a.active{background:var(--tint);color:var(--text);font-weight:700}
nav>a.active .ico,.navGroup.current .navHead .ico,nav>a.active:hover .ico,.navGroup.current .navHead:hover .ico{background:linear-gradient(135deg,var(--accent-hi),var(--accent));color:var(--on-accent);box-shadow:0 6px 16px var(--ring)}
.navGroup.current .navHead{font-weight:700}

/* pages of a section: fold open, hang on a tree line */
.navSub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s var(--ease)}
.navGroup.open .navSub{grid-template-rows:1fr}
.navSubIn{min-height:0;overflow:hidden;margin-left:20px}
.navSubIn::before,.navSubIn::after{content:"";display:block;height:4px}
.navSub a{position:relative;z-index:0;display:block;padding:7px 10px 7px 24px;border-radius:0;background:none;font-size:13.5px;font-weight:500;color:var(--muted);white-space:nowrap;transition:color .2s}
.navSub a::before{content:"";position:absolute;left:0;top:-50%;height:100%;width:13px;box-sizing:border-box;border-left:1.5px solid var(--tree);border-bottom:1.5px solid var(--tree);border-bottom-left-radius:9px;pointer-events:none}
.navSub a:first-child::before{top:-4px;height:calc(50% + 4px)}
.navSub a:hover{background:none;color:var(--text)}
.navSub a.active{background:none;color:var(--blue);font-weight:700}
.navSub a.active::after{content:"";position:absolute;z-index:-1;inset:2px 0 2px 17px;border-radius:9px;background:var(--info-bg)}
@media (max-width:680px){
  body.navOpen nav>a,body.navOpen nav .navHead{font-size:17px;padding:8px 10px 8px 8px}
  body.navOpen nav a .ico,body.navOpen nav .navHead .ico{width:38px;height:38px;border-radius:12px}
  body.navOpen .navSubIn{margin-left:26px}
  body.navOpen .navSub a{font-size:16px;padding:12px 12px 12px 28px;border-radius:0}
}

/* charts: orange line with a glow under it, white hover box, capped bars */
svg.bars line.grid{stroke:var(--line);stroke-dasharray:2 5}
#aChart .totalLine{stroke:var(--accent);stroke-width:2.4;stroke-linecap:round;opacity:1}
#aChart .totalArea{stroke:none;pointer-events:none}
.aStopTop{stop-color:var(--accent);stop-opacity:.42}.aStopBottom{stop-color:var(--accent);stop-opacity:0}
#aChart .shopLine{stroke-width:1.5;opacity:.8}
#aChart .hoverDot.totalDot{stroke:#fff;filter:drop-shadow(0 0 6px var(--accent))}
.chartTip{background:#fff;color:#1c130d;border-radius:14px;box-shadow:0 14px 36px rgba(0,0,0,.45)}
.share i{background:linear-gradient(90deg,var(--accent),var(--accent-hi))}
.cBar i{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 55%,transparent),color-mix(in srgb,var(--accent) 8%,transparent));border-top:3px solid var(--accent);border-radius:8px 8px 3px 3px;box-sizing:border-box}
.cBar.today i{background:linear-gradient(180deg,color-mix(in srgb,var(--green) 70%,transparent),color-mix(in srgb,var(--green) 8%,transparent));border-top-color:var(--green);box-shadow:0 0 26px color-mix(in srgb,var(--green) 28%,transparent)}
.cRange{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0}.cRange input{display:inline-block;width:auto}