/* Дизайн-код «Терминал» — bloblog.ru
   Только тёмная тема. Подключение: <link rel="stylesheet" href="https://bloblog.ru/ds/terminal.css">
   Шрифт Kibernetyk Mono — SIL OFL 1.1 (fonts/OFL.txt). */

@font-face {
  font-family: "Kibernetyk Mono";
  src: url("fonts/KibernetykMono-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Kibernetyk Mono";
  src: url("fonts/KibernetykMono-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Kibernetyk Mono";
  src: url("fonts/KibernetykMono-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ---------- Токены ---------- */
:root {
  color-scheme: dark;

  /* фон и поверхности */
  --t-bg: #0a0c0b;
  --t-surface-1: #111513;
  --t-surface-2: #161b18;
  --t-surface-hover: #1b221e;
  --t-overlay: rgba(0, 0, 0, 0.72);

  /* границы */
  --t-border: #24302a;
  --t-border-strong: #5a6f62; /* границы полей: >= 3:1 на фонах */

  /* текст */
  --t-text: #d7e3da; /* 14.9:1 на фоне, 13.2:1 на поверхности 2 */
  --t-text-2: #7f9186; /* 5.9:1 на фоне, 5.2:1 на поверхности 2 */
  --t-muted: #5f7066; /* только декор и disabled; не для читаемого текста */

  /* акцент */
  --t-accent: #4ade80;
  --t-accent-hover: #6ee79a;
  --t-accent-text: #06110a; /* текст на акценте, 11:1 */
  --t-accent-dim: #12301f; /* фон выделения */

  /* состояния (все >= 6:1 на тёмных поверхностях) */
  --t-danger: #f87171;
  --t-danger-hover: #fa9a9a;
  --t-danger-dim: #2e1517;
  --t-warning: #fbbf24;
  --t-warning-dim: #2c2208;
  --t-info: #60a5fa;
  --t-info-dim: #12233a;

  /* фокус */
  --t-focus: #4ade80;
  --t-focus-ring: 0 0 0 2px #0a0c0b, 0 0 0 4px #4ade80;

  /* типографика */
  --t-font: "Kibernetyk Mono", ui-monospace, "JetBrains Mono", Consolas, monospace;
  --t-fs-xs: 0.75rem;
  --t-fs-sm: 0.8125rem;
  --t-fs-md: 0.9375rem;
  --t-fs-lg: 1.125rem;
  --t-fs-xl: 1.5rem;
  --t-lh: 1.55;

  /* геометрия */
  --t-radius: 3px;
  --t-radius-sm: 2px;
  --t-s1: 4px;
  --t-s2: 8px;
  --t-s3: 12px;
  --t-s4: 16px;
  --t-s5: 24px;
  --t-s6: 32px;
  --t-s7: 48px;
  --t-container: 1120px;
  --t-control-h: 36px;
}

/* ---------- База ---------- */
.t-app,
.t-app *,
.t-app *::before,
.t-app *::after {
  box-sizing: border-box;
}

html {
  background: var(--t-bg);
  -webkit-text-size-adjust: 100%;
}

.t-app {
  margin: 0;
  min-height: 100vh;
  background: var(--t-bg);
  color: var(--t-text);
  font-family: var(--t-font);
  font-size: var(--t-fs-md);
  line-height: var(--t-lh);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.t-app ::selection {
  background: var(--t-accent);
  color: var(--t-accent-text);
}

.t-app h1,
.t-app h2,
.t-app h3,
.t-app h4,
.t-h1,
.t-h2,
.t-h3 {
  margin: 0 0 var(--t-s3);
  font-weight: 700;
  line-height: 1.25;
  color: var(--t-text);
}
.t-app h1,
.t-h1 { font-size: var(--t-fs-xl); }
.t-app h2,
.t-h2 { font-size: var(--t-fs-lg); }
.t-app h3,
.t-h3 { font-size: var(--t-fs-md); }
.t-app h4 { font-size: var(--t-fs-sm); color: var(--t-text-2); text-transform: uppercase; letter-spacing: 0.06em; }

.t-app p { margin: 0 0 var(--t-s3); }
.t-app hr { border: 0; border-top: 1px solid var(--t-border); margin: var(--t-s5) 0; }

.t-app a,
.t-link {
  color: var(--t-accent);
  text-decoration: underline;
  text-decoration-color: var(--t-border-strong);
  text-underline-offset: 3px;
}
.t-app a:hover,
.t-link:hover {
  color: var(--t-accent-hover);
  text-decoration-color: currentColor;
}

.t-app code,
.t-code {
  font-family: var(--t-font);
  font-size: 0.92em;
  background: var(--t-surface-2);
  border: 1px solid var(--t-border);
  border-radius: var(--t-radius-sm);
  padding: 0 var(--t-s1);
}
.t-pre {
  margin: 0;
  padding: var(--t-s3) var(--t-s4);
  background: var(--t-surface-1);
  border: 1px solid var(--t-border);
  border-radius: var(--t-radius);
  font-family: var(--t-font);
  font-size: var(--t-fs-sm);
  overflow-x: auto;
  white-space: pre;
}

.t-app :focus { outline: none; }
.t-app :focus-visible {
  outline: none;
  box-shadow: var(--t-focus-ring);
  border-radius: var(--t-radius);
}

.t-muted { color: var(--t-text-2); }
.t-accent { color: var(--t-accent); }
.t-danger-text { color: var(--t-danger); }
.t-warning-text { color: var(--t-warning); }
.t-small { font-size: var(--t-fs-sm); }
.t-xs { font-size: var(--t-fs-xs); }
.t-bold { font-weight: 700; }
.t-mono-num { font-variant-numeric: tabular-nums; }
.t-prompt::before { content: "> "; color: var(--t-accent); }

.t-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.t-app [hidden] { display: none !important; }

.t-skip {
  position: absolute;
  left: var(--t-s2);
  top: -100px;
  z-index: 100;
  padding: var(--t-s2) var(--t-s3);
  background: var(--t-accent);
  color: var(--t-accent-text) !important;
  border-radius: var(--t-radius);
}
.t-skip:focus { top: var(--t-s2); }

/* ---------- Раскладка ---------- */
.t-container {
  width: 100%;
  max-width: var(--t-container);
  margin: 0 auto;
  padding: 0 var(--t-s4);
}
.t-main { padding: var(--t-s5) 0 var(--t-s7); }
.t-stack > * + * { margin-top: var(--t-s4); }
.t-stack-sm > * + * { margin-top: var(--t-s2); }
.t-row { display: flex; align-items: center; gap: var(--t-s3); flex-wrap: wrap; }
.t-row--between { justify-content: space-between; }
.t-row--end { justify-content: flex-end; }
.t-grow { flex: 1 1 auto; min-width: 0; }
.t-grid {
  display: grid;
  gap: var(--t-s4);
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr));
}
.t-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.t-cols {
  display: grid;
  gap: var(--t-s4);
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}
@media (min-width: 860px) {
  .t-cols--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .t-grid--2 { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Шапка приложения ---------- */
.t-header {
  border-bottom: 1px solid var(--t-border);
  background: var(--t-surface-1);
}
.t-header__inner {
  display: flex;
  align-items: center;
  gap: var(--t-s3);
  min-height: 52px;
  flex-wrap: wrap;
  padding-top: var(--t-s2);
  padding-bottom: var(--t-s2);
}
.t-brand,
.t-app a.t-brand {
  display: inline-flex;
  align-items: baseline;
  gap: var(--t-s2);
  font-weight: 700;
  font-size: var(--t-fs-lg);
  color: var(--t-text);
  text-decoration: none;
}
.t-brand:hover { color: var(--t-text); }
.t-brand__prompt { color: var(--t-accent); }
.t-brand__app {
  font-weight: 400;
  font-size: var(--t-fs-sm);
  color: var(--t-text-2);
}
.t-brand__app::before { content: "/ "; color: var(--t-muted); }
.t-header__spacer { flex: 1 1 auto; }
.t-header__nav {
  display: flex;
  align-items: center;
  gap: var(--t-s3);
  flex-wrap: wrap;
  font-size: var(--t-fs-sm);
}
.t-header__user { color: var(--t-text-2); font-size: var(--t-fs-sm); }
.t-footer {
  border-top: 1px solid var(--t-border);
  padding: var(--t-s4) 0;
  color: var(--t-text-2);
  font-size: var(--t-fs-xs);
}

/* ---------- Кнопки ---------- */
.t-btn,
.t-app a.t-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--t-s2);
  min-height: var(--t-control-h);
  padding: 0 var(--t-s4);
  font-family: var(--t-font);
  font-size: var(--t-fs-sm);
  font-weight: 500;
  line-height: 1;
  color: var(--t-text);
  background: var(--t-surface-2);
  border: 1px solid var(--t-border-strong);
  border-radius: var(--t-radius);
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  user-select: none;
}
.t-btn:hover { background: var(--t-surface-hover); border-color: var(--t-text-2); color: var(--t-text); }
.t-btn:active { transform: translateY(1px); }
.t-btn--primary,
.t-app a.t-btn--primary {
  background: var(--t-accent);
  border-color: var(--t-accent);
  color: var(--t-accent-text);
  font-weight: 700;
}
.t-btn--primary:hover { background: var(--t-accent-hover); border-color: var(--t-accent-hover); color: var(--t-accent-text); }
.t-btn--danger,
.t-app a.t-btn--danger {
  background: transparent;
  border-color: var(--t-danger);
  color: var(--t-danger);
}
.t-btn--danger:hover { background: var(--t-danger-dim); border-color: var(--t-danger-hover); color: var(--t-danger-hover); }
.t-btn--ghost,
.t-app a.t-btn--ghost {
  background: transparent;
  border-color: transparent;
  color: var(--t-text-2);
}
.t-btn--ghost:hover { background: var(--t-surface-2); border-color: var(--t-border); color: var(--t-text); }
.t-btn--sm { min-height: 28px; padding: 0 var(--t-s3); font-size: var(--t-fs-xs); }
.t-btn--icon { padding: 0; width: var(--t-control-h); }
.t-btn--icon.t-btn--sm { width: 28px; }
.t-btn--block { display: flex; width: 100%; }
.t-btn[disabled],
.t-btn[aria-disabled="true"] {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}
.t-btn[aria-busy="true"]::after { content: "…"; }

/* ---------- Поля ---------- */
.t-field { display: block; margin: 0 0 var(--t-s4); }
.t-label {
  display: block;
  margin-bottom: var(--t-s1);
  font-size: var(--t-fs-sm);
  color: var(--t-text-2);
}
.t-input,
.t-select,
.t-textarea {
  display: block;
  width: 100%;
  min-height: var(--t-control-h);
  padding: 0 var(--t-s3);
  font-family: var(--t-font);
  font-size: var(--t-fs-md);
  color: var(--t-text);
  background: var(--t-bg);
  border: 1px solid var(--t-border-strong);
  border-radius: var(--t-radius);
  caret-color: var(--t-accent);
}
.t-textarea { min-height: 96px; padding: var(--t-s2) var(--t-s3); resize: vertical; }
.t-input::placeholder,
.t-textarea::placeholder { color: var(--t-text-2); opacity: 0.8; }
.t-input:hover,
.t-select:hover,
.t-textarea:hover { border-color: var(--t-text-2); }
.t-input:focus-visible,
.t-select:focus-visible,
.t-textarea:focus-visible {
  border-color: var(--t-accent);
  box-shadow: var(--t-focus-ring);
}
.t-input[aria-invalid="true"],
.t-input.is-invalid { border-color: var(--t-danger); }
.t-input[disabled],
.t-select[disabled],
.t-textarea[disabled] { opacity: 0.5; cursor: not-allowed; }
.t-input--code {
  letter-spacing: 0.3em;
  text-align: center;
  font-size: var(--t-fs-lg);
  font-weight: 500;
}
.t-hint { margin: var(--t-s1) 0 0; font-size: var(--t-fs-xs); color: var(--t-text-2); }
.t-error-text { margin: var(--t-s1) 0 0; font-size: var(--t-fs-xs); color: var(--t-danger); }

.t-check {
  display: inline-flex;
  align-items: flex-start;
  gap: var(--t-s2);
  cursor: pointer;
  min-height: 24px;
}
.t-check__box {
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 3px 0 0;
  background: var(--t-bg);
  border: 1px solid var(--t-border-strong);
  border-radius: var(--t-radius-sm);
  cursor: pointer;
  display: inline-grid;
  place-content: center;
}
.t-check__box::before {
  content: "";
  width: 10px;
  height: 10px;
  background: var(--t-accent-text);
  clip-path: polygon(14% 44%, 0 59%, 40% 100%, 100% 22%, 85% 8%, 40% 68%);
  transform: scale(0);
}
.t-check__box:checked { background: var(--t-accent); border-color: var(--t-accent); }
.t-check__box:checked::before { transform: scale(1); }
.t-check__box:hover { border-color: var(--t-text-2); }
.t-check__box:focus-visible { box-shadow: var(--t-focus-ring); }
.t-check__box:checked + .t-check__text--strike { text-decoration: line-through; color: var(--t-text-2); }

/* ---------- Карточка / панель ---------- */
.t-card {
  background: var(--t-surface-1);
  border: 1px solid var(--t-border);
  border-radius: var(--t-radius);
  padding: var(--t-s4);
}
.t-card--flush { padding: 0; }
.t-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--t-s3);
  margin-bottom: var(--t-s3);
}
.t-card__title {
  margin: 0;
  font-size: var(--t-fs-sm);
  font-weight: 700;
  color: var(--t-text);
  text-transform: lowercase;
}
.t-card__title::before { content: "# "; color: var(--t-accent); }
.t-card--flush .t-card__head { padding: var(--t-s3) var(--t-s4); margin: 0; border-bottom: 1px solid var(--t-border); }
.t-card--accent { border-color: var(--t-accent); }
.t-panel {
  background: var(--t-surface-2);
  border: 1px solid var(--t-border);
  border-radius: var(--t-radius);
  padding: var(--t-s3);
}
.t-auth {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--t-s5) var(--t-s4);
}
.t-auth__card { width: 100%; max-width: 400px; }
.t-auth__brand { margin-bottom: var(--t-s4); text-align: center; }

/* ---------- Плитка ---------- */
.t-tile,
.t-app a.t-tile {
  display: flex;
  flex-direction: column;
  gap: var(--t-s2);
  min-width: 0;
  padding: var(--t-s4);
  color: var(--t-text);
  text-decoration: none;
  background: var(--t-surface-1);
  border: 1px solid var(--t-border);
  border-radius: var(--t-radius);
}
.t-tile:hover { background: var(--t-surface-2); border-color: var(--t-accent); color: var(--t-text); }
.t-tile.is-selected { border-color: var(--t-accent); background: var(--t-surface-2); }
.t-tile__head { display: flex; align-items: center; gap: var(--t-s3); min-width: 0; }
.t-tile__icon { font-size: 22px; color: var(--t-accent); flex: 0 0 auto; line-height: 1; }
.t-tile__name {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.t-tile__desc {
  margin: 0;
  font-size: var(--t-fs-sm);
  color: var(--t-text-2);
  overflow-wrap: anywhere;
}
.t-tile__meta {
  display: flex;
  align-items: center;
  gap: var(--t-s2);
  margin-top: auto;
  font-size: var(--t-fs-xs);
  color: var(--t-text-2);
}

/* ---------- Бейдж и статус ---------- */
.t-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--t-s1);
  padding: 0 var(--t-s2);
  min-height: 20px;
  font-size: var(--t-fs-xs);
  line-height: 1;
  color: var(--t-text-2);
  background: var(--t-surface-2);
  border: 1px solid var(--t-border);
  border-radius: var(--t-radius-sm);
  white-space: nowrap;
}
.t-badge--ok { color: var(--t-accent); background: var(--t-accent-dim); border-color: transparent; }
.t-badge--danger { color: var(--t-danger); background: var(--t-danger-dim); border-color: transparent; }
.t-badge--warn { color: var(--t-warning); background: var(--t-warning-dim); border-color: transparent; }
.t-badge--info { color: var(--t-info); background: var(--t-info-dim); border-color: transparent; }

.t-dot {
  display: inline-block;
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--t-muted);
  vertical-align: middle;
}
.t-dot--up { background: var(--t-accent); }
.t-dot--down { background: var(--t-danger); }
.t-dot--unknown { background: transparent; border: 1px solid var(--t-text-2); }

/* ---------- Полоска прогресса ---------- */
.t-progress {
  appearance: none;
  -webkit-appearance: none;
  display: block;
  width: 100%;
  height: 8px;
  border: 0;
  border-radius: var(--t-radius-sm);
  background: var(--t-surface-2);
  overflow: hidden;
  accent-color: var(--t-accent);
}
.t-progress::-webkit-progress-bar { background: var(--t-surface-2); border: 1px solid var(--t-border); border-radius: var(--t-radius-sm); }
.t-progress::-webkit-progress-value { background: var(--t-accent); border-radius: var(--t-radius-sm); }
.t-progress::-moz-progress-bar { background: var(--t-accent); }
.t-progress--warn::-webkit-progress-value { background: var(--t-warning); }
.t-progress--warn::-moz-progress-bar { background: var(--t-warning); }
.t-progress--danger::-webkit-progress-value { background: var(--t-danger); }
.t-progress--danger::-moz-progress-bar { background: var(--t-danger); }
.t-meter { display: grid; gap: var(--t-s1); }
.t-meter__row { display: flex; justify-content: space-between; gap: var(--t-s3); font-size: var(--t-fs-sm); }
.t-meter__value { color: var(--t-text-2); font-variant-numeric: tabular-nums; }

/* ---------- Таблица и список ---------- */
.t-table-wrap { overflow-x: auto; }
.t-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--t-fs-sm);
}
.t-table th,
.t-table td {
  padding: var(--t-s2) var(--t-s3);
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--t-border);
}
.t-table th {
  font-weight: 500;
  font-size: var(--t-fs-xs);
  color: var(--t-text-2);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.t-table tbody tr:hover { background: var(--t-surface-2); }
.t-table tr:last-child td { border-bottom: 0; }
.t-table .t-num { text-align: right; font-variant-numeric: tabular-nums; }

.t-list { list-style: none; margin: 0; padding: 0; }
.t-list__item {
  display: flex;
  align-items: center;
  gap: var(--t-s3);
  padding: var(--t-s2) 0;
  border-bottom: 1px solid var(--t-border);
  min-width: 0;
}
.t-list__item:last-child { border-bottom: 0; }
.t-list__main { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.t-list__meta { font-size: var(--t-fs-xs); color: var(--t-text-2); white-space: nowrap; }
.t-list__actions { display: flex; gap: var(--t-s1); flex: 0 0 auto; }
.t-dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--t-s1) var(--t-s4); margin: 0; font-size: var(--t-fs-sm); }
.t-dl dt { color: var(--t-text-2); }
.t-dl dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }

/* ---------- kbd ---------- */
.t-kbd,
.t-app kbd {
  display: inline-block;
  min-width: 20px;
  padding: 1px 6px;
  font-family: var(--t-font);
  font-size: var(--t-fs-xs);
  line-height: 1.4;
  text-align: center;
  color: var(--t-text);
  background: var(--t-surface-2);
  border: 1px solid var(--t-border-strong);
  border-bottom-width: 2px;
  border-radius: var(--t-radius-sm);
}

/* ---------- Сообщения ---------- */
.t-alert {
  display: flex;
  gap: var(--t-s3);
  align-items: flex-start;
  margin: 0 0 var(--t-s4);
  padding: var(--t-s3) var(--t-s4);
  font-size: var(--t-fs-sm);
  color: var(--t-text);
  background: var(--t-surface-2);
  border: 1px solid var(--t-border);
  border-left-width: 3px;
  border-radius: var(--t-radius);
}
.t-alert__icon { flex: 0 0 auto; font-size: 18px; line-height: 1.4; }
.t-alert__body { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.t-alert--error { border-color: var(--t-danger); background: var(--t-danger-dim); }
.t-alert--error .t-alert__icon { color: var(--t-danger); }
.t-alert--warn { border-color: var(--t-warning); background: var(--t-warning-dim); }
.t-alert--warn .t-alert__icon { color: var(--t-warning); }
.t-alert--info { border-color: var(--t-info); background: var(--t-info-dim); }
.t-alert--info .t-alert__icon { color: var(--t-info); }
.t-alert--ok { border-color: var(--t-accent); background: var(--t-accent-dim); }
.t-alert--ok .t-alert__icon { color: var(--t-accent); }

.t-empty {
  padding: var(--t-s5) var(--t-s4);
  text-align: center;
  color: var(--t-text-2);
  font-size: var(--t-fs-sm);
  border: 1px dashed var(--t-border-strong);
  border-radius: var(--t-radius);
}
.t-empty__icon { display: block; margin-bottom: var(--t-s2); font-size: 28px; color: var(--t-muted); }
.t-empty__title { display: block; margin-bottom: var(--t-s1); color: var(--t-text); font-weight: 500; }
.t-error-page { text-align: center; padding: var(--t-s7) 0; }
.t-error-page__code {
  font-size: 72px;
  line-height: 1;
  font-weight: 700;
  color: var(--t-danger);
  margin: 0 0 var(--t-s3);
}
.t-loading { color: var(--t-text-2); font-size: var(--t-fs-sm); }
.t-loading::after { content: "_"; animation: t-blink 1s steps(1) infinite; }
@keyframes t-blink { 50% { opacity: 0; } }

/* ---------- Модальное окно и палитра команд ---------- */
.t-modal {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 12vh var(--t-s4) var(--t-s4);
  background: var(--t-overlay);
}
.t-modal__dialog {
  width: 100%;
  max-width: 560px;
  max-height: 76vh;
  display: flex;
  flex-direction: column;
  background: var(--t-surface-1);
  border: 1px solid var(--t-border-strong);
  border-radius: var(--t-radius);
}
.t-modal__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--t-s3);
  padding: var(--t-s3) var(--t-s4);
  border-bottom: 1px solid var(--t-border);
}
.t-modal__title { margin: 0; font-size: var(--t-fs-md); }
.t-modal__body { padding: var(--t-s4); overflow-y: auto; }
.t-modal__foot {
  display: flex;
  justify-content: flex-end;
  gap: var(--t-s2);
  padding: var(--t-s3) var(--t-s4);
  border-top: 1px solid var(--t-border);
}
.t-palette__input-wrap {
  display: flex;
  align-items: center;
  gap: var(--t-s2);
  padding: 0 var(--t-s4);
  border-bottom: 1px solid var(--t-border);
}
.t-palette__prompt { color: var(--t-accent); font-weight: 700; }
.t-palette__input {
  flex: 1 1 auto;
  min-width: 0;
  height: 48px;
  padding: 0;
  font-family: var(--t-font);
  font-size: var(--t-fs-md);
  color: var(--t-text);
  background: transparent;
  border: 0;
  caret-color: var(--t-accent);
}
.t-palette__input:focus-visible { box-shadow: none; outline: none; }
.t-palette__list { list-style: none; margin: 0; padding: var(--t-s1); overflow-y: auto; }
.t-palette__group {
  padding: var(--t-s2) var(--t-s3) var(--t-s1);
  font-size: var(--t-fs-xs);
  color: var(--t-text-2);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.t-palette__item {
  display: flex;
  align-items: center;
  gap: var(--t-s3);
  padding: var(--t-s2) var(--t-s3);
  border-radius: var(--t-radius);
  cursor: pointer;
  color: var(--t-text);
  min-width: 0;
}
.t-palette__item.is-active,
.t-palette__item[aria-selected="true"] { background: var(--t-accent-dim); box-shadow: inset 2px 0 0 var(--t-accent); }
.t-palette__item-icon { color: var(--t-accent); font-size: 18px; flex: 0 0 auto; }
.t-palette__item-text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t-palette__item-hint { font-size: var(--t-fs-xs); color: var(--t-text-2); flex: 0 0 auto; }
.t-palette__foot {
  display: flex;
  gap: var(--t-s4);
  padding: var(--t-s2) var(--t-s4);
  border-top: 1px solid var(--t-border);
  font-size: var(--t-fs-xs);
  color: var(--t-text-2);
  flex-wrap: wrap;
}

/* ---------- Адаптив ---------- */
@media (max-width: 560px) {
  :root { --t-fs-xl: 1.3125rem; }
  .t-main { padding-top: var(--t-s4); }
  .t-modal { padding-top: var(--t-s4); }
  .t-list__item { flex-wrap: wrap; }
  .t-palette__foot { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .t-loading::after { animation: none; }
  .t-btn:active { transform: none; }
}

/* ---------- QR-код (единственное светлое место: сканер требует контраста) ---------- */
.t-qr {
  display: inline-block;
  padding: var(--t-s3);
  background: #ffffff;
  border-radius: var(--t-radius);
  line-height: 0;
}
.t-qr svg { display: block; width: 200px; height: 200px; max-width: 100%; }
.t-codes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--t-s2) var(--t-s4);
  margin: 0;
  padding: var(--t-s3) var(--t-s4);
  list-style: none;
  background: var(--t-bg);
  border: 1px solid var(--t-border-strong);
  border-radius: var(--t-radius);
  font-size: var(--t-fs-md);
  font-weight: 500;
  letter-spacing: 0.05em;
}
.t-secret {
  display: block;
  padding: var(--t-s2) var(--t-s3);
  background: var(--t-bg);
  border: 1px solid var(--t-border-strong);
  border-radius: var(--t-radius);
  font-weight: 500;
  letter-spacing: 0.08em;
  overflow-wrap: anywhere;
  user-select: all;
}

/* ---------- Этап 2: вкладки, drop-зона, часы и погода, диаграмма ---------- */
.t-tabs {
  display: flex;
  gap: var(--t-s1);
  flex-wrap: wrap;
  margin-bottom: var(--t-s4);
  border-bottom: 1px solid var(--t-border);
}
.t-tab {
  min-height: 32px;
  padding: 0 var(--t-s3);
  font-family: var(--t-font);
  font-size: var(--t-fs-sm);
  color: var(--t-text-2);
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  cursor: pointer;
}
.t-tab:hover { color: var(--t-text); }
.t-tab[aria-selected="true"] { color: var(--t-accent); border-bottom-color: var(--t-accent); font-weight: 700; }

.t-drop { padding: var(--t-s3); margin-bottom: var(--t-s3); border: 1px dashed var(--t-border-strong); border-radius: var(--t-radius); }
.t-drop .t-hint { margin-bottom: 0; }
.t-drop .t-progress { margin-top: var(--t-s2); }
.t-card.is-drag { border-color: var(--t-accent); background: var(--t-accent-dim); }
.t-card.is-drag .t-drop { border-color: var(--t-accent); }
.t-select--auto { width: auto; }

.t-subhead {
  margin: var(--t-s3) 0 var(--t-s1);
  font-size: var(--t-fs-xs);
  font-weight: 500;
  color: var(--t-text-2);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.t-subhead:first-child { margin-top: 0; }
.t-row--nowrap { flex-wrap: nowrap; }
.t-right { text-align: right; overflow-wrap: anywhere; }
.t-plain-list { list-style: none; margin: 0 0 var(--t-s3); padding: 0; }
.t-cmd { font-size: var(--t-fs-xs); overflow-wrap: anywhere; }
.t-cal-time { min-width: 84px; }
.t-result { margin-top: var(--t-s3); }
.t-pre:focus-visible { box-shadow: var(--t-focus-ring); }
.t-result .t-pre { max-height: 240px; overflow: auto; }

.t-clock { margin-bottom: var(--t-s3); }
.t-clock__time { font-size: 2.25rem; line-height: 1.1; font-weight: 700; color: var(--t-accent); font-variant-numeric: tabular-nums; }
.t-wx { display: flex; align-items: center; gap: var(--t-s3); flex-wrap: wrap; }
.t-wx__icon { font-size: 36px; line-height: 1; color: var(--t-accent); }
.t-wx__temp { font-size: var(--t-fs-xl); font-weight: 700; line-height: 1.1; }
.t-wx__side { margin-left: auto; text-align: right; }
.t-hours {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: var(--t-s1);
  margin: 0;
  padding: 0;
  list-style: none;
}
.t-hours__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: var(--t-s1) 0;
  background: var(--t-surface-2);
  border: 1px solid var(--t-border);
  border-radius: var(--t-radius-sm);
}
.t-hours__icon { font-size: 18px; color: var(--t-accent); line-height: 1; }

.t-chart { display: block; max-width: none; }
.t-chart__bar { fill: var(--t-accent); }
.t-chart__bar--zero { fill: var(--t-border-strong); }
.t-details summary { cursor: pointer; font-size: var(--t-fs-xs); color: var(--t-text-2); }
.t-toplist { margin: var(--t-s1) 0 0; padding-left: var(--t-s4); overflow-wrap: anywhere; }