/* Bindin — umumiy uslublar. Burchaklar to'g'ri (border-radius: 0). Yorug' rejim — standart. */
:root{
  --bg:#ffffff;--surface:#ffffff;--surface-2:#f3f7fd;--surface-3:#e9f0fb;--border:#dce4f0;--border-strong:#c3cfe1;
  --text:#0b1b3a;--muted:#4f5f7a;--soft:#8592a7;
  --brand:#016dfe;--brand-hover:#0059d4;--brand-ink:#ffffff;--brand-soft:#e7f0ff;--link:#016dfe;
  --ok:#0f7b47;--ok-bg:#e3f5ec;--warn:#9a5a00;--warn-bg:#fff3dc;--err:#c8231f;--err-bg:#fde9e8;--info:#016dfe;--info-bg:#e7f0ff;--mute-bg:#eef1f6;
  --shadow:0 1px 0 rgba(11,27,58,.04);--overlay:rgba(11,27,58,.45);
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --bg:#000000;--surface:#0a0a0b;--surface-2:#121214;--surface-3:#1a1a1d;--border:#26262b;--border-strong:#3a3a41;
  --text:#ffffff;--muted:#b9bcc6;--soft:#80838e;
  --brand:#016dfe;--brand-hover:#2a84ff;--brand-ink:#ffffff;--brand-soft:rgba(1,109,254,.16);--link:#4d9bff;
  --ok:#3ccf7f;--ok-bg:rgba(60,207,127,.12);--warn:#ffb547;--warn-bg:rgba(255,181,71,.12);--err:#ff5d57;--err-bg:rgba(255,93,87,.13);--info:#4d9bff;--info-bg:rgba(1,109,254,.16);--mute-bg:#1a1a1d;
  --shadow:none;--overlay:rgba(0,0,0,.7);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box;border-radius:0}
html,body{margin:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font:14px/1.5 var(--font);-webkit-font-smoothing:antialiased}
a{color:var(--link);text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;display:block}
h1{font-size:24px;line-height:1.25;margin:0;font-weight:700;letter-spacing:-.015em}
h2{font-size:16px;margin:0 0 12px;font-weight:650}
h3{font-size:14px;margin:0 0 8px;font-weight:650}
code,.mono{font-family:var(--mono);font-size:12.5px}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ikonlar */
.i{width:18px;height:18px;flex:none;display:inline-block;vertical-align:middle}
.i-sm{width:15px;height:15px}.i-lg{width:22px;height:22px}

/* tugmalar */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 16px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font:600 14px var(--font);cursor:pointer;white-space:nowrap;text-decoration:none;transition:background .12s,border-color .12s,color .12s}
.btn:hover{background:var(--surface-2);text-decoration:none}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}.btn-primary:hover{background:var(--brand-hover);border-color:var(--brand-hover)}
.btn-danger{color:var(--err);border-color:var(--border-strong)}.btn-danger:hover{background:var(--err-bg);border-color:var(--err)}
.btn-danger-solid{background:var(--err);border-color:var(--err);color:#fff}.btn-danger-solid:hover{filter:brightness(1.08);background:var(--err)}
.btn-ghost{border-color:transparent;background:transparent}.btn-ghost:hover{background:var(--surface-2)}
.btn-sm{height:32px;padding:0 11px;font-size:13px;gap:6px}
.btn-lg{height:46px;padding:0 22px;font-size:15px}
.btn-icon{width:38px;padding:0}.btn-icon.btn-sm{width:32px}
.btn-block{width:100%}

/* formalar */
.input,select.input,textarea.input{height:38px;padding:0 12px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font:14px var(--font);width:100%;transition:border-color .12s}
textarea.input{height:auto;padding:9px 12px;min-height:76px;resize:vertical}
.input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.input:disabled{background:var(--surface-2);color:var(--muted)}
.input-static{display:flex;align-items:center;gap:4px;background:var(--surface-2);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field>label{font-weight:600;font-size:13px}
.field .hint{color:var(--soft);font-size:12px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.check{display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer}
.check input{width:16px;height:16px;accent-color:var(--brand)}

/* nishonlar */
.badge{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;font-size:12px;font-weight:600;background:var(--mute-bg);color:var(--muted);white-space:nowrap}
.badge::before{content:"";width:6px;height:6px;background:currentColor}
.b-ok{background:var(--ok-bg);color:var(--ok)}.b-warn{background:var(--warn-bg);color:var(--warn)}.b-err{background:var(--err-bg);color:var(--err)}.b-info{background:var(--info-bg);color:var(--info)}

/* karta/panel */
.card{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow)}
.card-pad{padding:20px}

/* ogohlantirishlar (custom alert) */
.alerts{position:fixed;top:16px;right:16px;display:flex;flex-direction:column;gap:10px;z-index:100;width:min(420px,calc(100vw - 32px))}
.alert-toast{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--brand);padding:12px 12px 12px 14px;box-shadow:0 10px 30px rgba(11,27,58,.14);animation:alert-in .18s ease-out}
.alert-toast.is-err{border-left-color:var(--err)}.alert-toast.is-ok{border-left-color:var(--ok)}.alert-toast.is-warn{border-left-color:var(--warn)}
.alert-toast .alert-icon{flex:none;margin-top:1px}
.alert-toast.is-err .alert-icon{color:var(--err)}.alert-toast.is-ok .alert-icon{color:var(--ok)}.alert-toast.is-warn .alert-icon{color:var(--warn)}
.alert-toast .alert-body{flex:1;min-width:0;font-size:13.5px;word-break:break-word}
.alert-toast .alert-title{font:700 11.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;margin-bottom:2px}
.alert-toast.is-err .alert-title{color:var(--err)}.alert-toast.is-ok .alert-title{color:var(--ok)}
.alert-toast .alert-close{flex:none;border:0;background:transparent;color:var(--soft);cursor:pointer;padding:2px;line-height:0}
.alert-toast.leaving{opacity:0;transform:translateX(12px);transition:all .2s}
@keyframes alert-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.notice{padding:12px 14px;margin-bottom:14px;font-size:13px;border-left:3px solid var(--brand);background:var(--info-bg);color:var(--text)}
.notice-err{border-left-color:var(--err);background:var(--err-bg)}
.notice-err b{color:var(--err);font-family:var(--mono);font-size:12px;letter-spacing:.04em}
.notice-warn{border-left-color:var(--warn);background:var(--warn-bg)}

/* logo */
.brand{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:-.02em;color:var(--text);text-decoration:none}
.brand:hover{text-decoration:none}
.brand img{width:30px;height:30px}

/* til va mavzu tugmalari */
.seg{display:inline-flex;border:1px solid var(--border-strong)}
.seg button{border:0;background:transparent;color:var(--muted);font:600 12px var(--font);height:30px;padding:0 10px;cursor:pointer}
.seg button+button{border-left:1px solid var(--border-strong)}
.seg button.on{background:var(--brand);color:#fff}

@media (max-width:720px){.row{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}