/* ====== Админ-дизайн (светлая/тёмная тема, кнопки, карточки, форм-контролы) ====== */
:root{
    --bg:#f5f7fb; --surface:#fff; --text:#0f172a; --muted:#6b7280; --border:#e5e7eb;
    --primary:#2563eb; --primary-600:#1d4ed8; --danger:#dc2626; --warn:#f59e0b; --success:#16a34a;
    --radius:14px; --shadow:0 8px 30px rgba(2,6,23,.08);
}
@media (prefers-color-scheme: dark){
    :root{
        --bg:#0b1220; --surface:#0f172a; --text:#e5e7eb; --muted:#94a3b8; --border:#233044;
        --primary:#3b82f6; --primary-600:#2563eb; --danger:#ef4444; --warn:#f59e0b; --success:#22c55e;
        --shadow:0 8px 30px rgba(0,0,0,.35);
    }
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 Inter, system-ui, Segoe UI, Roboto, Arial, sans-serif}

.container{max-width:1100px;margin:0 auto;padding:24px}
.page-header{position:sticky;top:0;background:var(--bg);z-index:10;border-bottom:1px solid var(--border)}
.head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0}
h1,h2,h3{margin:0 0 .25em 0;font-weight:600}

.breadcrumbs{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:.95rem}
.breadcrumbs a{color:var(--primary);text-decoration:none}

.btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:10px 14px;border:1px solid var(--border);
    border-radius:12px;background:var(--surface);color:var(--text);cursor:pointer;transition:.15s}
.btn:hover{box-shadow:var(--shadow)}
.btn:focus-visible{outline:2px solid color-mix(in oklab, var(--primary) 40%, transparent);outline-offset:2px}
.btn[disabled]{opacity:.6;pointer-events:none}
.btn-primary{background:var(--primary);color:#fff;border-color:transparent}
.btn-primary:hover{background:var(--primary-600)}
.btn-danger{background:transparent;color:var(--danger);border-color:color-mix(in oklab, var(--danger) 30%, var(--border))}
.btn-success{background:var(--success);color:#fff;border-color:transparent}
.btn-sm{min-height:30px;padding:6px 10px;border-radius:10px}

.input, textarea, select{
    width:100%;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text)
}
.input:focus, textarea:focus, select:focus{outline:none;border-color:color-mix(in oklab, var(--primary) 35%, var(--border));
    box-shadow:0 0 0 4px color-mix(in oklab, var(--primary) 18%, transparent)}
label span{display:block;margin-bottom:6px;color:var(--muted);font-size:.9rem}

.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.grid{display:grid;gap:18px}
.grid.cards{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}

.table-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
table{width:100%;border-collapse:separate;border-spacing:0}
thead th{position:sticky;top:0;background:color-mix(in oklab, var(--surface) 92%, #fff 8%);color:color-mix(in oklab, var(--text) 75%, #000 25%);
    font-weight:600;text-align:left;border-bottom:1px solid var(--border);padding:12px}
tbody td{border-bottom:1px solid var(--border);padding:10px 12px;vertical-align:top}
tbody tr:last-child td{border-bottom:none}

.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 10px;border:1px solid var(--border);
    background:color-mix(in oklab, var(--surface) 90%, var(--bg) 10%);color:var(--muted);font-size:.78rem}

.empty{border:1px dashed var(--border);border-radius:var(--radius);padding:28px;text-align:center}
.muted{color:var(--muted);font-size:.9rem}
.hidden{display:none!important}
.sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

/* Dialog (<dialog>) */
dialog{border:none;border-radius:16px;padding:0;background:var(--surface);color:var(--text);box-shadow:var(--shadow);width:min(860px,96vw)}
dialog::backdrop{background:rgb(0 0 0 / .45)}
.dlg-h{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--border)}
.dlg-b{padding:18px;display:grid;gap:18px}
.dlg-f{display:flex;gap:10px;justify-content:flex-end;padding:16px 18px;border-top:1px solid var(--border)}
fieldset{border:1px solid var(--border);border-radius:12px;padding:14px;margin:0}
legend{padding:0 8px;color:var(--primary);font-weight:600}

/* Toasts */
.toasts{position:fixed;top:16px;right:16px;display:grid;gap:10px;z-index:99}
.toast{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--primary);color:var(--text);
    padding:10px 12px;border-radius:10px;box-shadow:var(--shadow)}
.toast.error{border-left-color:var(--danger)}
.toast.success{border-left-color:var(--success)}

/* Misc */
.searchbar{display:flex;gap:10px;align-items:center}
.kbd{font:inherit;background:color-mix(in oklab, var(--surface) 85%, var(--bg) 15%);border:1px solid var(--border);padding:2px 6px;border-radius:6px}