/* Тёмная тема и крупный текст. Подключается последним и только переопределяет переменные и пару цветов. */
html { --zoom: 1; }
html[data-fs="large"] { --zoom: 1.15; }
html[data-fs="xlarge"] { --zoom: 1.32; }
body { zoom: var(--zoom); }
.chat-body { height: calc(100vh / var(--zoom)); height: calc(100dvh / var(--zoom)); }
.auth { min-height: calc(100vh / var(--zoom)); }

html[data-theme="dark"] {
  color-scheme: dark;
  --green: #1c8350;
  --green-d: #5fd197;
  --green-dd: #07130d;
  --green-l: #14392a;
  --green-ll: #10281e;
  --ink: #e7efea;
  --ink2: #b7c8be;
  --ink3: #8fa499;
  --grid: #2d4237;
  --grid2: #233329;
  --hdr: #182720;
  --canvas: #0b1410;
  --white: #111d17;
  --amber-bg: #3a2f10;
  --amber-line: #7d6420;
  --amber-ink: #f1d78a;
  --red-bg: #3b1814;
  --red-line: #85342b;
  --red-ink: #ffb4aa;
  --chatbg: #0e1813;
  --tick: #6d8277;
  --ext-ink: #cdb9ff;
  --ext-bg: #2c2347;
  --dropov: rgba(16, 40, 30, .92);
}
html[data-theme="dark"] body { background: var(--canvas); }
html[data-theme="dark"] a { color: var(--green-d); }
html[data-theme="dark"] .titlebar { background: #0d3a23; }
html[data-theme="dark"] .statusbar, html[data-theme="dark"] .csum { background: #0f4a2b; }
html[data-theme="dark"] .btn { background: var(--white); color: var(--green-d); border-color: #2b7a52; }
html[data-theme="dark"] .btn:hover { background: var(--green-ll); }
html[data-theme="dark"] .btn.primary { background: var(--green); color: #fff; border-color: var(--green); }
html[data-theme="dark"] .btn.primary:hover { background: #249960; }
html[data-theme="dark"] .btn.ghost { color: var(--ink2); border-color: var(--grid); }
html[data-theme="dark"] .btn.ghost:hover { background: var(--hdr); }
html[data-theme="dark"] .btn[disabled] { background: #26362e; border-color: #26362e; color: #7d9186; }
html[data-theme="dark"] .toast { background: #2a4538; color: #f1f7f3; }
html[data-theme="dark"] .toast.err { background: #8a2a20; }
html[data-theme="dark"] .switch { background: #2b3d34; border-color: var(--grid); }
html[data-theme="dark"] .switch[aria-checked="true"] { background: var(--green); border-color: #2fa56a; }
html[data-theme="dark"] .iconbtn:hover { background: rgba(255, 255, 255, .08); }
html[data-theme="dark"] .tbl tr.off td { background: #0e1812; }
html[data-theme="dark"] .pill.off { background: #1d2a23; color: var(--ink3); }
html[data-theme="dark"] .pill.ok, html[data-theme="dark"] .fnote.hist { border-color: #2c6b4a; }
html[data-theme="dark"] .msg.own .bub, html[data-theme="dark"] .chip, html[data-theme="dark"] .callout { border-color: #2c6b4a; }
html[data-theme="dark"] .cred { border-color: #2c6b4a; }
html[data-theme="dark"] .okmsg { background: var(--green-l); border-color: #2c6b4a; color: var(--ink); }
html[data-theme="dark"] .article code, html[data-theme="dark"] .tfa-key { background: var(--hdr); }
html[data-theme="dark"] .badge { background: #e9f6ef; color: #0b5a2f; }
html[data-theme="dark"] .autozone { background: var(--green-ll); border-color: #2b7a52; }
html[data-theme="dark"] .autozone.drag { background: var(--green-l); }
html[data-theme="dark"] .beta { background: #3a2f10; color: #f1d78a; border-color: #7d6420; }
html[data-theme="dark"] .tag { background: var(--red-bg); color: var(--red-ink); }
html[data-theme="dark"] .tfa-qr, html[data-theme="dark"] .thumb { background: #fff; }
html[data-theme="dark"] .umpop, html[data-theme="dark"] dialog.modal { background: var(--white); color: var(--ink); }
html[data-theme="dark"] dialog.modal::backdrop { background: rgba(0, 0, 0, .6); }
html[data-theme="dark"] .field input, html[data-theme="dark"] .field select, html[data-theme="dark"] .panel select,
html[data-theme="dark"] .search input, html[data-theme="dark"] .composer textarea, html[data-theme="dark"] .ctools input,
html[data-theme="dark"] .ctools select, html[data-theme="dark"] .hkeep select { background: var(--hdr); color: var(--ink); border-color: var(--grid); }
html[data-theme="dark"] ::placeholder { color: var(--ink3); }
html[data-theme="dark"] .auth-card { box-shadow: 0 12px 36px rgba(0, 0, 0, .45); }

/* внешний вид: окно выбора */
.look-group { margin-top: 16px; }
.look-group h3 { font-size: 14px; margin-bottom: 8px; }
.look-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.look-opts button { min-height: 40px; padding: 0 16px; border: 1px solid var(--grid); border-radius: 4px; background: var(--white); color: var(--ink); cursor: pointer; }
.look-opts button:hover { background: var(--green-ll); }
.look-opts button[aria-pressed="true"] { background: var(--green); color: #fff; border-color: var(--green); font-weight: 600; }

.look-fab { position: fixed; right: 14px; bottom: 14px; z-index: 5; border: 1px solid var(--grid); background: var(--white); color: var(--ink2); border-radius: 18px; padding: 6px 14px; cursor: pointer; font-size: 13.5px; }
.look-fab:hover { background: var(--green-ll); }

@media (max-width: 560px) {
  html[data-fs="large"] { --zoom: 1.08; }
  html[data-fs="xlarge"] { --zoom: 1.1; }
}
/* шапка остаётся светлым текстом на зелёном и в тёмной теме */
html[data-theme="dark"] .titlebar a, html[data-theme="dark"] .titlebar .brand { color: #e9f6ef; }
html[data-theme="dark"] .titlebar .brand, html[data-theme="dark"] .titlebar .tabs a[aria-current="page"] { color: #fff; }
html[data-theme="dark"] .titlebar .tabpop a { color: var(--ink); }
html[data-theme="dark"] .titlebar .tabpop a[aria-current="page"] { color: var(--green-d); }