/* ═══════════ FOI V5 · Yo'nalish A «TUN» ═══════════
   G'oya: taom — sahnadagi yulduz. Qop-qora sahna, har taom o'z nurida; shisha panellar; bitta yorqin harakat (To'lov).
   O'q: <html data-brand="foi|inlavash" data-theme="dark|light">. O'lchamlar rem'da: 1366 → 16px, 1920 → 20px (monoblok). */
:root{
  --font: Geist, Inter, system-ui, sans-serif; --mono: 'Geist Mono', ui-monospace, monospace;
  --r-1: .625rem; --r-2: 1rem; --r-3: 1.5rem; --r-pill: 99rem;
  --tap: 3rem; --ease: cubic-bezier(.2,.8,.2,1); --dur: 160ms;
  /* FOI · qorong'i */
  --bg: #050608; --bg-2: #0B0D11;
  --aur-1: rgba(34,193,241,.20); --aur-2: rgba(64,96,255,.14);
  --sf: rgba(255,255,255,.045); --sf-2: rgba(255,255,255,.075); --sf-3: rgba(255,255,255,.12); --sf-solid: #111419;
  --line: rgba(255,255,255,.08); --line-2: rgba(255,255,255,.16);
  --fg: #F3F5F8; --fg-2: #A6AEBB; --fg-3: #6E7786;
  --br: #62DDFF; --br-a: #5FE3FF; --br-b: #1FA5F5; --on-br: #02131C; --br-soft: rgba(95,227,255,.12); --br-glow: rgba(47,190,245,.45);
  --acc: #FFD166;
  --ok: #46E5A0; --ok-soft: rgba(70,229,160,.12); --warn: #FFB84D; --warn-soft: rgba(255,184,77,.13); --bad: #FF7A7A; --bad-soft: rgba(255,122,122,.13);
  --ch-1: #5FE3FF; --ch-2: #FFB84D; --ch-3: #A994FF; --ch-dim: rgba(255,255,255,.09); --ch-ghost: rgba(255,255,255,.28);
  --tile: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)); --tile-glow: rgba(255,176,82,.22);
  --img-shadow: drop-shadow(0 1rem .9rem rgba(0,0,0,.55));
  --sh: 0 0 0 1px var(--line); --sh-up: 0 0 0 1px var(--line-2), 0 2rem 5rem rgba(0,0,0,.6);
  --scrim: rgba(3,4,6,.72); color-scheme: dark;
}
[data-brand="inlavash"]{
  --bg: #070505; --bg-2: #100B0B; --aur-1: rgba(255,58,40,.22); --aur-2: rgba(255,170,0,.10);
  --fg: #F7F3F0; --fg-2: #B7ADA8; --fg-3: #80746E; --sf-solid: #161010;
  --br: #FF8A7A; --br-a: #FF4B36; --br-b: #D81818; --on-br: #FFFFFF; --br-soft: rgba(255,90,70,.14); --br-glow: rgba(255,60,40,.5);
  --acc: #FFC700; --ch-1: #FF6A55; --ch-2: #FFC700; --ch-3: #8FB8FF; --tile-glow: rgba(255,120,60,.24);
}
[data-theme="light"]{
  --bg: #ECEFF3; --bg-2: #E3E7ED; --aur-1: rgba(34,170,230,.20); --aur-2: rgba(120,110,255,.12);
  --sf: rgba(255,255,255,.72); --sf-2: #FFFFFF; --sf-3: rgba(12,20,30,.07); --sf-solid: #FFFFFF;
  --line: rgba(12,20,30,.08); --line-2: rgba(12,20,30,.17);
  --fg: #0B1016; --fg-2: #4A5564; --fg-3: #788392;
  --br: #086C92; --br-a: #0F97C9; --br-b: #0A62B8; --on-br: #FFFFFF; --br-soft: rgba(15,151,201,.11); --br-glow: rgba(15,130,200,.35);
  --acc: #B37A00; --ok: #0E7C45; --ok-soft: rgba(14,124,69,.10); --warn: #9A5B00; --warn-soft: rgba(200,130,0,.13); --bad: #C02626; --bad-soft: rgba(192,38,38,.09);
  --ch-1: #0F97C9; --ch-2: #D9820F; --ch-3: #6E5BD6; --ch-dim: rgba(12,20,30,.09); --ch-ghost: rgba(12,20,30,.32);
  --tile: linear-gradient(180deg, #FFFFFF, rgba(255,255,255,.6)); --tile-glow: rgba(255,170,70,.30);
  --img-shadow: drop-shadow(0 .9rem .7rem rgba(40,30,20,.28));
  --sh: 0 0 0 1px var(--line), 0 1px 2px rgba(12,20,30,.04); --sh-up: 0 0 0 1px var(--line), 0 2rem 5rem rgba(12,20,30,.25);
  --scrim: rgba(12,18,26,.5); color-scheme: light;
}
[data-brand="inlavash"][data-theme="light"]{
  --bg: #F3EEE9; --bg-2: #EAE3DC; --aur-1: rgba(255,80,50,.16); --aur-2: rgba(255,190,0,.16);
  --fg: #1A1210; --fg-2: #5A4A43; --fg-3: #8B7C74; --line: rgba(40,20,10,.09); --line-2: rgba(40,20,10,.18); --sf-3: rgba(40,20,10,.07);
  --br: #B00E0E; --br-a: #E0291C; --br-b: #B50D0D; --br-soft: rgba(200,20,20,.09); --br-glow: rgba(210,30,20,.35);
  --acc: #9A6B00; --ch-1: #D21F1F; --ch-2: #C98A00; --ch-3: #2A78D6;
}

*{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%}
@media (min-width:1800px){html{font-size:20px}}
body{font:400 .9375rem/1.4 var(--font);color:var(--fg);background:var(--bg);min-height:100vh;-webkit-font-smoothing:antialiased;font-feature-settings:'tnum','ss01';overflow-x:hidden}
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(60rem 34rem at 12% -8%, var(--aur-1), transparent 62%),
  radial-gradient(52rem 30rem at 104% 108%, var(--aur-2), transparent 60%)}
body>*{position:relative;z-index:1}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;text-align:left}
.i{width:1.25em;height:1.25em;flex:none}
.num{font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.logo{height:1.5rem;width:auto;color:var(--fg);display:block}
.wordmark{font:400 1.375rem/1 Pacifico, cursive;color:var(--fg);white-space:nowrap}
.wordmark::first-letter{color:var(--acc)}
h1,h2,h3{font-weight:600;letter-spacing:-.02em;line-height:1.15}

/* ── tugma, chip, belgi ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:var(--tap);padding:0 1.125rem;border-radius:var(--r-2);font-weight:550;white-space:nowrap;background:var(--sf-2);box-shadow:var(--sh)}
.btn.pri{background:linear-gradient(135deg,var(--br-a),var(--br-b));color:var(--on-br);box-shadow:0 .5rem 1.75rem -.375rem var(--br-glow), inset 0 1px 0 rgba(255,255,255,.35);font-weight:650}
.btn.ghost{background:transparent;box-shadow:none;color:var(--fg-2)}
.btn.sq{width:var(--tap);padding:0}
.btn.sm{min-height:2.75rem;padding:0 .875rem;font-size:.875rem;border-radius:var(--r-1)}
.pill{display:inline-flex;align-items:center;gap:.4rem;height:1.75rem;padding:0 .7rem;border-radius:var(--r-pill);font-size:.8125rem;font-weight:550;background:var(--sf-2);color:var(--fg-2);white-space:nowrap}
.pill.ok{background:var(--ok-soft);color:var(--ok)} .pill.warn{background:var(--warn-soft);color:var(--warn)} .pill.bad{background:var(--bad-soft);color:var(--bad)} .pill.br{background:var(--br-soft);color:var(--br)}
.dot{width:.5rem;height:.5rem;border-radius:50%;background:currentColor;box-shadow:0 0 0 .25rem color-mix(in srgb,currentColor 22%,transparent)}
.seg{display:flex;padding:.25rem;gap:.25rem;border-radius:var(--r-2);background:var(--sf);box-shadow:var(--sh)}
.seg button{flex:1;display:flex;align-items:center;justify-content:center;gap:.4rem;min-height:2.75rem;border-radius:.75rem;font-weight:550;font-size:.875rem;color:var(--fg-2);white-space:nowrap}
.seg button.on{background:var(--sf-3);color:var(--fg);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
[data-theme="light"] .seg button.on{background:#fff;box-shadow:0 1px 3px rgba(12,20,30,.14)}
.card{background:var(--sf);box-shadow:var(--sh);border-radius:var(--r-3);backdrop-filter:blur(24px)}
.lbl{font-size:.8125rem;color:var(--fg-3);font-weight:500}
.cap{font:500 .6875rem/1 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--fg-3)}

/* ═══ KASSA (POS) ═══ */
.pos{display:grid;grid-template-columns:4.75rem minmax(0,1fr) 26rem;grid-template-rows:minmax(0,1fr);height:100vh}
.rail{display:flex;flex-direction:column;align-items:center;gap:.375rem;padding:1.125rem 0 1rem;border-right:1px solid var(--line)}
.rail .logo{height:1.25rem;margin-bottom:1.125rem}
.rail .wordmark{font-size:.9375rem;margin-bottom:1.125rem}
.rail a{position:relative;width:3.75rem;height:3.75rem;border-radius:var(--r-2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;font-size:.6875rem;font-weight:550;color:var(--fg-3);text-decoration:none}
.rail a .i{width:1.5rem;height:1.5rem}
.rail a.on{color:var(--fg);background:var(--sf-2);box-shadow:var(--sh)}
.rail a.on .i{color:var(--br)}
.rail a b{position:absolute;top:.3rem;right:.45rem;min-width:1.125rem;height:1.125rem;padding:0 .3rem;border-radius:var(--r-pill);background:var(--br-a);color:var(--on-br);font-size:.6875rem;line-height:1.125rem;text-align:center}
.rail .sp{flex:1}
.ava{width:2.75rem;height:2.75rem;border-radius:50%;display:grid;place-items:center;font-weight:650;font-size:.8125rem;background:linear-gradient(135deg,var(--br-soft),var(--sf-3));box-shadow:var(--sh);color:var(--fg)}

.stage{display:flex;flex-direction:column;min-width:0;min-height:0;padding:1rem 1.25rem 0}
.bar{display:flex;align-items:center;gap:.75rem;height:3rem;flex:none}
.search{flex:1;display:flex;align-items:center;gap:.625rem;height:3rem;padding:0 1rem;border-radius:var(--r-2);background:var(--sf);box-shadow:var(--sh);color:var(--fg-3);min-width:0}
.search span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status{display:flex;align-items:center;gap:.875rem;height:3rem;padding:0 1rem;border-radius:var(--r-2);background:var(--sf);box-shadow:var(--sh);font-size:.8125rem;color:var(--fg-2);white-space:nowrap}
.status span{display:flex;align-items:center;gap:.4rem}
.status .ok{color:var(--ok)} .status .warn{color:var(--warn)}
.status .clock{font:600 1.0625rem var(--font);color:var(--fg);padding-left:.875rem;border-left:1px solid var(--line)}
.cats{display:flex;gap:.5rem;padding:.875rem 0;flex:none;overflow:hidden;mask-image:linear-gradient(90deg,#000 calc(100% - 3rem),transparent)}
.cat{display:flex;align-items:center;gap:.5rem;height:3rem;padding:0 1.125rem;border-radius:var(--r-pill);font-weight:550;color:var(--fg-2);white-space:nowrap;background:var(--sf);box-shadow:var(--sh)}
.cat.on{background:var(--fg);color:var(--bg);box-shadow:none}
.grid{flex:1;display:grid;grid-template-columns:repeat(auto-fill,minmax(11.75rem,1fr));grid-auto-rows:11.5rem;gap:.875rem;overflow:hidden;padding:.25rem .25rem 0;margin:0 -.25rem;mask-image:linear-gradient(180deg,#000 calc(100% - 2.5rem),transparent)}

.tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:.875rem;border-radius:var(--r-3);background:var(--tile);box-shadow:var(--sh);overflow:hidden;isolation:isolate}
.tile::before{content:'';position:absolute;z-index:-1;left:50%;top:1.25rem;width:11rem;height:6.5rem;transform:translateX(-50%);background:radial-gradient(closest-side,var(--tile-glow),transparent);filter:blur(6px)}
.tile img{position:absolute;left:50%;top:.75rem;transform:translateX(-50%);width:calc(100% - 2.5rem);height:5.75rem;object-fit:contain;object-position:center bottom;filter:var(--img-shadow)}
.tile .nm{font-weight:600;font-size:.9375rem;line-height:1.2;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile .row{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem;margin-top:.25rem}
.tile .pr{font-weight:650;font-size:1.0625rem;letter-spacing:-.02em}
.tile .pr small{font-size:.75rem;font-weight:500;color:var(--fg-3);margin-left:.2rem}
.tile .var{font-size:.75rem;color:var(--fg-3);white-space:nowrap}
.tile.on{box-shadow:0 0 0 2px var(--br-a), 0 .75rem 2.5rem -.75rem var(--br-glow)}
.tile .cnt{position:absolute;top:.625rem;right:.625rem;min-width:1.875rem;height:1.875rem;padding:0 .45rem;border-radius:var(--r-pill);display:grid;place-items:center;font-weight:700;font-size:.9375rem;background:linear-gradient(135deg,var(--br-a),var(--br-b));color:var(--on-br);box-shadow:0 .25rem 1rem var(--br-glow)}
.tile.stop img{filter:grayscale(1);opacity:.35}.tile.stop .nm,.tile.stop .row{opacity:.45}.tile.stop::before{display:none}
.tile .stopb{position:absolute;top:.625rem;left:.625rem}

/* Savat */
.cart{display:flex;flex-direction:column;margin:.75rem .75rem .75rem 0;border-radius:var(--r-3);background:var(--sf);box-shadow:var(--sh);backdrop-filter:blur(30px);overflow:hidden;min-height:0}
.cart .hd{padding:1rem 1.125rem .875rem;display:grid;gap:.75rem}
.cart .hd .t{display:flex;align-items:baseline;gap:.625rem}
.cart .hd h2{font-size:1.25rem}
.cart .hd h2 span{color:var(--fg-3);font-weight:500}
.cart .hd .lbl{margin-left:auto}
.lines{flex:1;overflow:hidden;padding:0 .625rem;min-height:0}
.line{display:grid;grid-template-columns:3rem 1fr auto;align-items:center;gap:.75rem;padding:.5rem;border-radius:var(--r-2)}
.line+.line{margin-top:.125rem}
.line.sel{background:var(--sf-2)}
.line .th{width:3rem;height:3rem;border-radius:.75rem;background:var(--sf-2);display:grid;place-items:center;overflow:hidden}
.line .th img{width:2.5rem;height:2.5rem;object-fit:contain}
.line .nm{font-weight:600;font-size:.9375rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.line .sub{font-size:.8125rem;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.line .r{display:flex;align-items:center;gap:.625rem}
.line .sum{font-weight:650;min-width:3.75rem;text-align:right}
.qty{display:flex;align-items:center;border-radius:var(--r-pill);background:var(--sf-2);box-shadow:var(--sh)}
.qty button{width:2.5rem;height:2.75rem;display:grid;place-items:center;color:var(--fg-2)}
.qty span{min-width:1.25rem;text-align:center;font-weight:650}
.cart .ft{padding:.75rem 1.125rem 1.125rem;display:grid;gap:.75rem;border-top:1px solid var(--line);background:linear-gradient(180deg,transparent,var(--sf))}
.mijoz{display:flex;align-items:center;gap:.625rem;min-height:2.75rem;padding:0 .875rem;border-radius:var(--r-2);background:var(--sf-2);font-size:.875rem;color:var(--fg-2)}
.mijoz b{color:var(--fg);font-weight:600}.mijoz .pill{margin-left:auto}
.total{display:flex;align-items:baseline;justify-content:space-between}
.total .v{font-size:2.25rem;font-weight:650;letter-spacing:-.04em;line-height:1}
.total .v small{font-size:.875rem;font-weight:500;color:var(--fg-3);margin-left:.375rem;letter-spacing:0}
.pay{width:100%;display:flex;align-items:center;justify-content:space-between;height:4.25rem;padding:0 1.5rem;border-radius:1.25rem;font-size:1.3125rem;font-weight:700;letter-spacing:-.02em;color:var(--on-br);background:linear-gradient(135deg,var(--br-a),var(--br-b));box-shadow:0 1rem 2.5rem -.5rem var(--br-glow), inset 0 1px 0 rgba(255,255,255,.4)}
.pay span{display:flex;align-items:center;gap:.5rem}
.acts{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
.acts button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;height:3.5rem;border-radius:var(--r-2);font-size:.75rem;font-weight:550;color:var(--fg-2);background:var(--sf-2)}
.acts button .i{width:1.25rem;height:1.25rem;color:var(--fg)}

/* ═══ TO'LOV ═══ */
.scrim{position:fixed;inset:0;z-index:20;background:var(--scrim);backdrop-filter:blur(18px) saturate(1.2);display:grid;place-items:center}
.paysheet{width:min(71rem,calc(100vw - 3rem));height:min(42rem,calc(100vh - 2.5rem));display:grid;grid-template-columns:19rem 1fr 22rem;border-radius:2rem;background:var(--sf-solid);box-shadow:var(--sh-up);overflow:hidden}
.paysheet>div{padding:1.5rem;display:flex;flex-direction:column;min-height:0}
.ps-l{background:var(--sf);border-right:1px solid var(--line)}
.ps-l h3{font-size:1.0625rem;margin-bottom:.25rem}
.ps-l .rows{margin-top:1rem;display:grid;gap:.625rem;font-size:.875rem}
.ps-l .rows div{display:flex;justify-content:space-between;gap:.75rem}
.ps-l .rows span:first-child{color:var(--fg-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ps-l .sumrow{margin-top:auto;padding-top:1rem;border-top:1px dashed var(--line-2);display:grid;gap:.5rem;font-size:.875rem}
.ps-l .sumrow div{display:flex;justify-content:space-between}
.ps-l .sumrow .big{font-size:1.125rem;font-weight:650;color:var(--fg)}
.ps-m h2{font-size:1.5rem;display:flex;align-items:center;gap:.75rem}
.paygrid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:1.25rem}
.payopt{position:relative;display:flex;flex-direction:column;justify-content:space-between;height:6rem;padding:.875rem 1rem;border-radius:var(--r-3);background:var(--sf);box-shadow:var(--sh);font-weight:600}
.payopt .i{width:1.625rem;height:1.625rem;color:var(--fg-2)}
.payopt small{display:block;font-weight:450;font-size:.75rem;color:var(--fg-3)}
.payopt.on{background:var(--br-soft);box-shadow:0 0 0 2px var(--br-a), 0 .75rem 2rem -.75rem var(--br-glow)}
.payopt.on .i{color:var(--br)}
.payopt.on::after{content:'';position:absolute;top:.875rem;right:.875rem;width:1.375rem;height:1.375rem;border-radius:50%;background:var(--br-a) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/70% no-repeat}
[data-brand="inlavash"] .payopt.on::after,[data-theme="light"] .payopt.on::after{filter:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E")}
.ps-m .opts{margin-top:auto;display:grid;gap:.625rem}
.optrow{display:flex;align-items:center;gap:.75rem;min-height:3.25rem;padding:0 1rem;border-radius:var(--r-2);background:var(--sf);box-shadow:var(--sh);font-size:.9375rem}
.optrow .i{color:var(--fg-2)} .optrow b{font-weight:600} .optrow .end{margin-left:auto;display:flex;align-items:center;gap:.625rem;color:var(--fg-2)}
.tog{width:3rem;height:2.75rem;position:relative;flex:none}
.tog::before{content:'';position:absolute;left:0;right:0;top:.5rem;height:1.75rem;border-radius:var(--r-pill);background:var(--sf-3)}
.tog::after{content:'';position:absolute;top:.6875rem;left:.1875rem;width:1.375rem;height:1.375rem;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.tog.on::before{background:linear-gradient(135deg,var(--br-a),var(--br-b))}.tog.on::after{left:1.4375rem}
.ps-r{background:var(--sf);border-left:1px solid var(--line);gap:.75rem}
.due{display:flex;justify-content:space-between;align-items:baseline}
.due .v{font-size:1.25rem;font-weight:650}
.given{padding:.75rem 1rem;border-radius:var(--r-2);box-shadow:0 0 0 2px var(--br-a);background:var(--br-soft)}
.given .v{font-size:2.25rem;font-weight:650;letter-spacing:-.04em;line-height:1.1}
.given .v small{font-size:.875rem;color:var(--fg-3);font-weight:500;margin-left:.375rem;letter-spacing:0}
.quick{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.quick button{height:2.75rem;border-radius:var(--r-pill);background:var(--sf-2);box-shadow:var(--sh);text-align:center;font-weight:600;font-size:.875rem}
.quick button.on{background:var(--fg);color:var(--bg)}
.numpad{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;min-height:0}
.numpad button{border-radius:var(--r-2);background:var(--sf-2);box-shadow:var(--sh);font-size:1.5rem;font-weight:550;text-align:center;display:grid;place-items:center;min-height:3rem}
.numpad button.fn{font-size:1rem;color:var(--fg-2)}
.change{display:flex;justify-content:space-between;align-items:center;padding:0 1rem;height:3rem;border-radius:var(--r-2);background:var(--ok-soft);color:var(--ok);font-weight:600}
.change .num{font-size:1.25rem;font-weight:700}

/* ═══ ADMIN QOBIG'I ═══ */
.app{display:grid;grid-template-columns:15rem minmax(0,1fr);min-height:100vh}
.side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:1.25rem .875rem 1rem;border-right:1px solid var(--line)}
.side .brand{display:flex;align-items:center;gap:.75rem;padding:.25rem .625rem 1.5rem}
.side .brand small{display:block;font-size:.75rem;color:var(--fg-3);line-height:1.2}
.side .brand .logo{height:1.375rem}
.side nav{display:grid;gap:.125rem}
.side nav a{display:flex;align-items:center;gap:.75rem;height:3rem;padding:0 .75rem;border-radius:var(--r-2);font-weight:550;color:var(--fg-2);text-decoration:none}
.side nav a .i{width:1.375rem;height:1.375rem}
.side nav a.on{color:var(--fg);background:var(--sf-2);box-shadow:var(--sh)}
.side nav a.on .i{color:var(--br)}
.side nav a b{margin-left:auto;min-width:1.375rem;height:1.375rem;padding:0 .375rem;border-radius:var(--r-pill);font-size:.75rem;line-height:1.375rem;text-align:center;background:var(--sf-3);color:var(--fg)}
.side nav a b.w{background:var(--warn-soft);color:var(--warn)}
.side .kassa{margin:1.25rem 0 0;height:3.5rem;justify-content:flex-start;padding:0 1rem;gap:.75rem;font-size:1rem}
.side .kassa small{display:block;font-size:.6875rem;font-weight:500;opacity:.75;line-height:1.1}
.side .sp{flex:1}
.side .me{display:flex;align-items:center;gap:.75rem;padding:.75rem .5rem 0;border-top:1px solid var(--line);margin-top:.5rem}
.side .me div{line-height:1.25;min-width:0}.side .me small{color:var(--fg-3);font-size:.75rem;display:block}
.side .me .btn{margin-left:auto}
.main{min-width:0;padding:1.25rem 1.75rem 2rem;max-width:100rem}
.top{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem}
.top h1{font-size:1.75rem}
.top .sub{color:var(--fg-3);font-size:.875rem;margin-top:.125rem}
.top .end{margin-left:auto;display:flex;gap:.625rem;align-items:center}
.tabs{display:flex;gap:.25rem;margin-bottom:1rem;border-bottom:1px solid var(--line)}
.tabs a{position:relative;display:flex;align-items:center;gap:.5rem;height:3rem;padding:0 1rem;font-weight:550;color:var(--fg-3);text-decoration:none;white-space:nowrap}
.tabs a.on{color:var(--fg)}
.tabs a.on::after{content:'';position:absolute;left:.75rem;right:.75rem;bottom:-1px;height:2px;border-radius:2px;background:var(--br-a);box-shadow:0 0 .75rem var(--br-glow)}
.tabs a b{font-size:.75rem;padding:.0625rem .4rem;border-radius:var(--r-pill);background:var(--sf-3);color:var(--fg-2)}

/* ═══ BUGUN ═══ */
.hero{position:relative;display:grid;grid-template-columns:1fr auto;gap:2rem;padding:1.5rem 1.75rem 0;min-height:17.5rem;overflow:hidden}
.hero .l{position:relative;z-index:2;display:flex;flex-direction:column}
.hero .big{font-size:4.5rem;font-weight:650;letter-spacing:-.055em;line-height:1;margin:.625rem 0 .75rem;background:linear-gradient(180deg,var(--fg) 30%,color-mix(in srgb,var(--fg) 62%,var(--br-a)));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .big small{font-size:1.125rem;font-weight:500;letter-spacing:0;margin-left:.5rem;color:var(--fg-3);-webkit-text-fill-color:var(--fg-3)}
.hero .meta{display:flex;align-items:center;gap:.75rem;color:var(--fg-2);font-size:.875rem}
.hero .chart{position:absolute;left:0;right:0;bottom:1.75rem;height:10rem;z-index:1}
.hero .chart svg{position:absolute;inset:0;width:100%;height:100%}
.hero .hozir{position:absolute;width:.75rem;height:.75rem;margin:-.375rem;border-radius:50%;background:var(--ch-1);box-shadow:0 0 0 .3rem color-mix(in srgb,var(--ch-1) 25%,transparent),0 0 1.5rem var(--ch-1)}
.hero .axis{position:absolute;left:1.75rem;right:1.75rem;bottom:.5rem;display:flex;justify-content:space-between;z-index:2;font:500 .6875rem var(--mono);color:var(--fg-3)}
.hero .r{position:relative;z-index:2;display:flex;gap:1.75rem;align-items:flex-start}
.ring{position:relative;display:grid;place-items:center}
.ring>div{position:absolute;text-align:center;line-height:1.1}
.ring b{font-size:1.5rem;font-weight:650;letter-spacing:-.03em;display:block}
.ring small{font-size:.6875rem;color:var(--fg-3)}
.kv{display:grid;gap:.875rem;padding-top:.25rem}
.kv div{display:grid;gap:.125rem}
.kv b{font-size:1.25rem;font-weight:650;letter-spacing:-.02em}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1rem}
.stat{padding:1rem 1.125rem;display:grid;gap:.375rem}
.stat .h{display:flex;align-items:center;gap:.5rem;color:var(--fg-2);font-size:.8125rem;font-weight:500}
.stat .h .uchqun{margin-left:auto;color:var(--br)}
.stat .v{font-size:1.625rem;font-weight:650;letter-spacing:-.03em;line-height:1.1;white-space:nowrap}
.stat .v small{font-size:.8125rem;color:var(--fg-3);font-weight:500;margin-left:.3rem;letter-spacing:0}
.stat .d{font-size:.8125rem;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cols{display:grid;grid-template-columns:1.45fr 1fr;gap:1rem;margin-top:1rem;align-items:start}
.blk{padding:1.25rem 1.375rem}
.blk>.h{display:flex;align-items:baseline;gap:.625rem;margin-bottom:.875rem}
.blk>.h h3{font-size:1.0625rem}.blk>.h .lbl{white-space:nowrap}.blk>.h a{margin:-.75rem 0 -.75rem auto;min-height:2.75rem;display:inline-flex;align-items:center;color:var(--br);font-size:.875rem;font-weight:550;text-decoration:none;white-space:nowrap}
.todo{display:grid;grid-template-columns:2.75rem 1fr auto;gap:.875rem;align-items:center;padding:.625rem 0}
.todo+.todo{border-top:1px solid var(--line)}
.todo .ico{width:2.75rem;height:2.75rem;border-radius:.875rem;display:grid;place-items:center}
.todo .ico .i{width:1.375rem;height:1.375rem}
.todo .ico.bad{background:var(--bad-soft);color:var(--bad)}.todo .ico.warn{background:var(--warn-soft);color:var(--warn)}.todo .ico.br{background:var(--br-soft);color:var(--br)}
.todo b{font-weight:600;display:block}.todo span{font-size:.8125rem;color:var(--fg-3);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.todo>div{min-width:0}
.topf{display:grid;grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr));gap:.75rem}
.topf>div{position:relative;border-radius:var(--r-2);background:var(--sf);box-shadow:var(--sh);padding:.75rem;padding-top:5rem;overflow:hidden;isolation:isolate}
.topf>div::before{content:'';position:absolute;z-index:-1;left:50%;top:.5rem;width:8rem;height:4.5rem;transform:translateX(-50%);background:radial-gradient(closest-side,var(--tile-glow),transparent)}
.topf img{position:absolute;top:.625rem;left:50%;transform:translateX(-50%);height:4rem;width:calc(100% - 1.5rem);object-fit:contain;filter:var(--img-shadow)}
.topf .rk{position:absolute;top:.5rem;left:.625rem;font:600 .6875rem var(--mono);color:var(--fg-3)}
.topf b{display:block;font-size:.875rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topf span{font-size:.75rem;color:var(--fg-3);white-space:nowrap}
.mix{display:flex;height:.625rem;border-radius:var(--r-pill);overflow:hidden;gap:2px;margin-bottom:.875rem}
.mix i{display:block;height:100%}
.leg{display:grid;gap:.5rem;font-size:.875rem}
.leg div{display:flex;align-items:center;gap:.5rem}.leg div i{width:.625rem;height:.625rem;border-radius:.1875rem}.leg div .num{margin-left:auto;font-weight:600}
.leg div em{font-style:normal;color:var(--fg-3);width:2.5rem;text-align:right}
.smena-b{display:grid;gap:.5rem;font-size:.875rem;margin-bottom:1rem}
.smena-b div{display:flex;justify-content:space-between}.smena-b span:first-child{color:var(--fg-2)}.smena-b b{font-weight:600}

/* ═══ JADVAL (Cheklar, Ombor) ═══ */
.split{display:grid;grid-template-columns:minmax(0,1fr) 22rem;gap:1rem;align-items:start}
.filters{display:flex;gap:.5rem;align-items:center;margin-bottom:.875rem;flex-wrap:nowrap}
.filters .cat{height:2.75rem;padding:0 .875rem;font-size:.875rem}
.filters .end{margin-left:auto;display:flex;gap:.5rem}
table{width:100%;border-collapse:collapse;font-size:.875rem}
th{font:500 .6875rem var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--fg-3);text-align:left;padding:.875rem .75rem;white-space:nowrap}
td{padding:0 .75rem;height:3.25rem;border-top:1px solid var(--line);white-space:nowrap}
td.n,th.n{text-align:right}
td b{font-weight:600}
tr.sel td{background:var(--br-soft)}tr.sel td:first-child{box-shadow:inset 3px 0 0 var(--br-a)}
td .mono{font:500 .8125rem var(--mono);color:var(--fg-2)}
.tbl{overflow:hidden}
.tfoot{display:flex;align-items:center;gap:1.5rem;padding:.875rem 1.125rem;border-top:1px solid var(--line);font-size:.875rem;color:var(--fg-2)}
.tfoot b{color:var(--fg);font-weight:650}.tfoot .end{margin-left:auto}
/* Chek ko'rinishi */
.rcpt{padding:1.25rem;display:flex;flex-direction:column;gap:.875rem;position:sticky;top:1.25rem}
.rcpt .paper{background:#FAFAF7;color:#17130F;border-radius:.375rem;padding:1.125rem 1rem 1.375rem;font:500 .75rem/1.5 var(--mono);--z:.5rem;-webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/var(--z) var(--z) repeat-x, linear-gradient(#000 0 0) top/100% calc(100% - var(--z)) no-repeat;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/var(--z) var(--z) repeat-x, linear-gradient(#000 0 0) top/100% calc(100% - var(--z)) no-repeat}
.paper .c{text-align:center}.paper .bn{font:400 1.25rem Pacifico,cursive;line-height:1.3}.paper .bn.f{font:700 1.25rem var(--font);letter-spacing:.04em}
.paper hr{border:0;border-top:1px dashed #9a948c;margin:.5rem 0}
.paper .rw{display:flex;justify-content:space-between;gap:.5rem}
.paper .tt{font-size:.9375rem;font-weight:700}
.paper .qr{width:4rem;height:4rem;margin:.5rem auto 0;background:conic-gradient(#17130F 25%,#FAFAF7 0 50%,#17130F 0 75%,#FAFAF7 0) 0 0/.5rem .5rem;border:.25rem solid #FAFAF7;outline:1px solid #17130F}
.rcpt .acts2{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}

/* Ombor */
.lvl{display:flex;align-items:center;gap:.625rem;min-width:11rem}
.lvl .bar{position:relative;flex:1;height:.5rem;border-radius:var(--r-pill);background:var(--ch-dim)}
.lvl .bar i{position:absolute;left:0;top:0;bottom:0;border-radius:var(--r-pill);background:var(--ok)}
.lvl .bar u{position:absolute;top:-.25rem;bottom:-.25rem;width:2px;background:var(--fg-3);border-radius:1px}
.lvl.warn .bar i{background:var(--warn)}.lvl.bad .bar i{background:var(--bad)}
.alertbar{display:flex;align-items:center;gap:1rem;padding:.875rem 1.125rem;margin-bottom:1rem;border-radius:var(--r-3);background:linear-gradient(90deg,var(--warn-soft),transparent 70%),var(--sf);box-shadow:var(--sh)}
.alertbar .ico{width:2.75rem;height:2.75rem;border-radius:.875rem;background:var(--warn-soft);color:var(--warn);display:grid;place-items:center}
.alertbar b{display:block;font-weight:600}.alertbar span{font-size:.8125rem;color:var(--fg-2)}
.alertbar .end{margin-left:auto;display:flex;gap:.5rem}
.th-img{display:inline-grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:.625rem;background:var(--sf-2);margin-right:.625rem;vertical-align:middle;color:var(--fg-2)}

/* ═══ SOZLAMA ═══ */
.soz{display:grid;grid-template-columns:19rem minmax(0,1fr);gap:1rem;align-items:start}
.sozlist{padding:.5rem;display:grid;gap:.125rem}
.sozlist a{display:grid;grid-template-columns:2.75rem 1fr auto;align-items:center;gap:.75rem;padding:.5rem;border-radius:var(--r-2);text-decoration:none;color:var(--fg)}
.sozlist a .ico{width:2.75rem;height:2.75rem;border-radius:.875rem;background:var(--sf-2);display:grid;place-items:center;color:var(--fg-2)}
.sozlist a b{font-weight:600;display:block;line-height:1.25}.sozlist a small{font-size:.75rem;color:var(--fg-3);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sozlist a>div{min-width:0}
.sozlist a.on{background:var(--sf-2);box-shadow:var(--sh)}.sozlist a.on .ico{background:var(--br-soft);color:var(--br)}
.sozlist a>.i{color:var(--fg-3);width:1rem;height:1rem}
.sgroup{padding:.25rem 1.375rem}
.sgroup+.sgroup{margin-top:1rem}
.srow{display:flex;align-items:center;gap:1rem;min-height:4.25rem;padding:.625rem 0}
.srow:has(>.cap){min-height:2.75rem;padding-bottom:0}
.srow+.srow{border-top:1px solid var(--line)}
.srow b{font-weight:600;display:block}.srow small{font-size:.8125rem;color:var(--fg-3);display:block}
.srow .end{margin-left:auto;display:flex;align-items:center;gap:.625rem}
.themes{display:flex;gap:.625rem}
.themes button{width:5.5rem;height:3.5rem;border-radius:.875rem;position:relative;overflow:hidden;box-shadow:var(--sh)}
.themes button.on{box-shadow:0 0 0 2px var(--br-a)}
.themes button i{position:absolute;inset:0}
.themes button span{position:absolute;left:.5rem;bottom:.3rem;font-size:.6875rem;font-weight:600}

/* ═══ OSHXONA (KDS) ═══ */
.kds{height:100vh;display:flex;flex-direction:column;padding:1rem 1.25rem}
.kds .bar{margin-bottom:1rem}
.kds .bar h1{font-size:1.5rem}
.tickets{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;min-height:0;align-items:start}
.tk{display:flex;flex-direction:column;overflow:hidden}
.tk .h{display:flex;align-items:center;gap:.625rem;padding:.875rem 1rem;border-bottom:1px solid var(--line)}
.tk .h b{font-size:1.375rem;font-weight:650;letter-spacing:-.02em}
.tk .h .tm{margin-left:auto;font:600 1.25rem var(--mono)}
.tk .prog{height:.25rem;background:var(--ch-dim)}.tk .prog i{display:block;height:100%;background:var(--ok)}
.tk.warn .prog i,.tk.warn .tm{background:var(--warn);color:var(--warn)}.tk.warn .tm{background:none}
.tk.bad{box-shadow:0 0 0 2px var(--bad),0 1rem 3rem -1rem var(--bad)}.tk.bad .prog i{background:var(--bad)}.tk.bad .tm{color:var(--bad)}
.tk ul{list-style:none;padding:.5rem 1rem;display:grid}
.tk li{display:grid;grid-template-columns:2.25rem 1fr;gap:.5rem;padding:.5rem 0;font-size:1.0625rem;font-weight:550;align-items:baseline}
.tk li+li{border-top:1px solid var(--line)}
.tk li em{font-style:normal;font-weight:700;color:var(--br)}
.tk li small{grid-column:2;font-size:.8125rem;color:var(--warn);font-weight:500}
.tk li.done{color:var(--fg-3);text-decoration:line-through}
.tk .btn{margin:.5rem 1rem 1rem;height:3.5rem;font-size:1.0625rem}

/* ═══ TELEFON ═══ */
.tabbar{display:none}
@media (max-width:700px){
  .pos{grid-template-columns:1fr;grid-template-rows:auto;height:auto;min-height:100vh;padding-bottom:9.5rem}
  .rail,.cart,.side,.status .x{display:none}
  .stage{padding:.75rem .875rem 0}
  .status{padding:0 .75rem}.status .clock{display:none}
  .cats{overflow:hidden;padding:.75rem 0}
  .grid{grid-template-columns:1fr 1fr;grid-auto-rows:11.5rem;gap:.625rem;mask-image:none;overflow:visible}
  .tabbar{display:grid;position:fixed;left:0;right:0;bottom:0;z-index:10;grid-template-columns:repeat(var(--n,4),1fr);padding:.375rem .5rem calc(.375rem + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(24px);border-top:1px solid var(--line)}
  .tabbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;height:3.25rem;font-size:.6875rem;font-weight:550;color:var(--fg-3);text-decoration:none;position:relative}
  .tabbar a .i{width:1.5rem;height:1.5rem}.tabbar a.on{color:var(--fg)}.tabbar a.on .i{color:var(--br)}
  .cartbar{position:fixed;left:.75rem;right:.75rem;bottom:4.75rem;z-index:11}
  .cartbar .pay{height:3.75rem;font-size:1.0625rem;padding:0 1.125rem}
  .cartbar .pay .q{min-width:1.75rem;height:1.75rem;border-radius:var(--r-pill);background:rgba(0,0,0,.22);display:grid;place-items:center;font-size:.875rem}
  .app{grid-template-columns:1fr;padding-bottom:5rem}
  .main{padding:.875rem .875rem 1.5rem}
  .top{flex-wrap:wrap}.top h1{font-size:1.5rem}.top .end .btn:not(.keep){display:none}
  .hero{grid-template-columns:1fr;padding:1.125rem 1.125rem 0;min-height:19rem}
  .hero .big{font-size:2.875rem}.hero .big small{font-size:.9375rem}
  .hero .r{display:none}.hero .axis{left:1.125rem;right:1.125rem}.hero .chart{height:7rem}.hero .axis span:nth-child(even){display:none}
  .hero .meta{flex-wrap:wrap;gap:.5rem}
  .stats{grid-template-columns:1fr 1fr;gap:.625rem}.stat{padding:.875rem}.stat .v{font-size:1.25rem}.stat .h .uchqun{display:none}
  .cols{grid-template-columns:1fr}
  .todo .btn{padding:0 .75rem}
}
@media (min-width:701px){.cartbar{display:none}}