:root, html[data-theme="night"] {
  --bg:#0d1117; --side:#161b22; --card:#21262d; --fg:#e6edf3; --muted:#8b949e;
  --acc:#58a6ff; --acc2:#3fb950; --warn:#d29922; --err:#f85149; --line:#30363d;
  --input:#010409; --btn:#30363d; --nav-on:#1f6feb33; --alert-bg:#3d2f00; --alert-bd:#9e6a03;
  --top:#161b22;
}
html[data-theme="day"] {
  --bg:#f3f6fb; --side:#ffffff; --card:#ffffff; --fg:#1a2332; --muted:#5b6b80;
  --acc:#1b74d4; --acc2:#0f9d6e; --warn:#b58100; --err:#c0392b; --line:#d9e2ee;
  --input:#f7f9fc; --btn:#e8eef6; --nav-on:#e8f2ff; --alert-bg:#fff8e6; --alert-bd:#f0d48a;
  --top:#ffffff;
}
* { box-sizing:border-box; }
html, body { margin:0; min-height:100%; font-family:"Segoe UI",system-ui,sans-serif; background:var(--bg); color:var(--fg); }
.has-nav { display:flex; }
.side { width:228px; min-height:100vh; background:var(--side); border-right:1px solid var(--line); padding:18px 12px; position:sticky; top:0; }
.side .brand { font-weight:700; font-size:16px; padding:0 8px; }
.side-tag { color:var(--muted); font-size:12px; padding:4px 8px 12px; margin:0; }
.nav-group { color:var(--muted); font-size:11px; letter-spacing:.08em; padding:14px 8px 6px; }
.side nav a { display:block; color:var(--fg); text-decoration:none; padding:8px 10px; border-radius:8px; font-size:14px; opacity:.85; }
.side nav a:hover, .side nav a.on { background:var(--nav-on); color:var(--fg); opacity:1; }
.main { flex:1; min-width:0; display:flex; flex-direction:column; }
.top { display:flex; justify-content:space-between; align-items:center; padding:10px 22px; background:var(--top); border-bottom:1px solid var(--line); }
.top-actions { display:flex; align-items:center; gap:12px; }
.brand-row { display:flex; align-items:center; gap:10px; }
.brand-logo { width:28px; height:28px; border-radius:6px; object-fit:contain; background:#fff; }
.chk-row { display:flex; flex-wrap:wrap; gap:8px 16px; margin:10px 0 12px; }
.chk-row label { display:flex; align-items:center; gap:6px; margin:0; color:var(--fg); }
.chk-row input { width:auto; }
.theme-ico { margin:0; width:36px; height:36px; padding:0; border-radius:10px; font-size:16px; line-height:36px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); background:var(--card); }
.theme-ico:hover { background:var(--nav-on); }
.theme-ico svg { width:18px; height:18px; display:block; fill:none; stroke:currentColor; stroke-width:1.8; }
html[data-theme="night"] .ico-sun { display:none; }
html[data-theme="day"] .ico-moon { display:none; }
.pay-card { text-align:center; }
.pay-card .qr { margin:12px auto; display:block; }
.qr-lg { width:220px; height:220px; margin:12px auto; display:block; background:#fff; padding:8px; border-radius:8px; }
button.linkish { background:none; border:0; padding:0; margin:0 6px 0 0; color:var(--acc); cursor:pointer; font:inherit; }
.wrap { max-width:none; margin:0; padding:22px 22px 48px; }
.page { display:none; }
.page.on { display:block; }
h1 { font-size:22px; margin:0 0 6px; }
h2 { font-size:15px; margin:0 0 12px; }
.sub { color:var(--muted); margin:0 0 18px; font-size:13px; }
.kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:16px; }
.kpi { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px; }
.kpi .lab { color:var(--muted); font-size:12px; }
.kpi .num { font-size:22px; font-weight:700; margin-top:6px; }
.kpi .hint { color:var(--muted); font-size:12px; margin-top:4px; }
.kpi.warn .num { color:var(--warn); }
.kpi.ok .num { color:var(--acc2); }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:18px; margin-bottom:16px; }
.narrow { max-width:420px; margin:48px auto; }
.login-hero { text-align:center; margin-bottom:18px; }
.login-logo { width:72px; height:72px; border-radius:16px; object-fit:contain; background:#fff; margin:0 auto 10px; display:block; }
.login-hero .brand { font-size:22px; font-weight:700; }
.login-slogan { color:var(--muted); margin:8px 0 0; font-size:14px; line-height:1.5; }
label { display:block; margin:10px 0 4px; color:var(--muted); font-size:13px; }
input, select, textarea { width:100%; padding:8px 10px; border-radius:8px; border:1px solid var(--line); background:var(--input); color:var(--fg); }
button { margin-top:10px; margin-right:8px; padding:8px 14px; border:0; border-radius:8px; background:var(--btn); color:var(--fg); cursor:pointer; }
button.primary { background:var(--acc); color:#fff; font-weight:600; }
button.danger { background:var(--err); color:#fff; }
button.sm { margin-top:0; padding:4px 8px; font-size:12px; }
.muted { color:var(--muted); }
.err { color:var(--err); }
.ok { color:var(--acc2); }
.hidden { display:none; }
.hp { position:absolute; left:-9999px; height:0; overflow:hidden; }
.doc pre { white-space:pre-wrap; word-break:break-all; background:var(--input); padding:12px; border-radius:8px; overflow:auto; }
.doc h2 { margin-top:18px; }
.doc ul { color:var(--muted); line-height:1.6; }
.mono, code { font-family:Consolas,ui-monospace,monospace; word-break:normal; overflow-wrap:normal; white-space:nowrap; font-size:12px; }
.filters { display:flex; flex-wrap:wrap; gap:8px 12px; align-items:flex-end; margin-bottom:12px; }
.filters label { margin:0; font-size:12px; }
.filters input, .filters select { width:auto; min-width:128px; max-width:220px; }
.filters button { margin-top:0; }
.pager { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:12px; }
.pager button[disabled] { opacity:.45; cursor:not-allowed; }
.table-wrap { overflow-x:auto; overflow-y:visible; max-width:100%; }
table { width:max-content; min-width:100%; border-collapse:collapse; font-size:13px; }
th, td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:middle; white-space:nowrap; }
th.ops, td.ops { position:sticky; right:0; background:var(--card); white-space:nowrap; min-width:168px; box-shadow:-8px 0 8px -8px rgba(0,0,0,.35); z-index:1; }
td.ops button { margin:2px 4px 2px 0; }
.badge { display:inline-block; padding:2px 8px; border-radius:999px; font-size:12px; background:var(--btn); }
.badge.nile { background:#163a2a; color:var(--acc2); }
html[data-theme="day"] .badge.nile { background:#d8f3e8; }
.badge.mock { background:#3a3216; color:var(--warn); }
a.link { color:var(--acc); text-decoration:none; }
.qr { background:#fff; padding:8px; border-radius:8px; width:160px; height:160px; }
.danger-zone { margin-top:32px; padding-top:16px; border-top:1px solid var(--line); }
.alert { background:var(--alert-bg); border:1px solid var(--alert-bd); color:var(--warn); padding:10px 12px; border-radius:8px; margin-bottom:12px; font-size:13px; }
.tg-kind { margin-bottom:14px; }
.tg-kind textarea { width:100%; min-height:88px; font-family:ui-monospace,Consolas,monospace; font-size:13px; }
.tg-kind .tg-head { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:6px; }
.tg-dot { width:10px; height:10px; border-radius:50%; display:inline-block; flex:0 0 10px; }
.tg-dot.urgent { background:var(--err); box-shadow:0 0 0 3px color-mix(in srgb, var(--err) 28%, transparent); }
.tg-dot.warn { background:var(--warn); box-shadow:0 0 0 3px color-mix(in srgb, var(--warn) 28%, transparent); }
.tg-dot.info { background:#6b7280; }
.tg-ph { display:inline-block; margin:0 8px 6px 0; font-size:12px; color:var(--muted); }
.tg-ph code { color:var(--acc); }
.tg-kind .tg-meta { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:8px 16px; margin:8px 0; }
.modal { position:fixed; inset:0; background:rgba(0,0,0,.45); display:none; align-items:flex-start; justify-content:center; padding:40px 16px; z-index:20; overflow:auto; }
.modal.on { display:flex; }
.modal .card { width:min(640px,100%); }
#gwToast {
  position:fixed; left:50%; bottom:28px; transform:translateX(-50%);
  z-index:80; display:none; padding:10px 18px; border-radius:10px;
  background:var(--card); border:1px solid var(--acc2); color:var(--fg);
  box-shadow:0 10px 28px rgba(0,0,0,.28); font-size:14px; max-width:min(520px,90vw);
}
#gwToast.on { display:block; }
#gwToast.err { border-color:var(--err); }
@media (max-width:1000px) {
  .kpis, .grid2 { grid-template-columns:1fr 1fr; }
  .has-nav { display:block; }
  .side { width:auto; min-height:0; position:static; }
}
@media (max-width:640px) { .kpis, .grid2 { grid-template-columns:1fr; } }
