/* ============================================================================
   Team Craft Skills — тема приложения «Ink Navy» (light «тёплая бумага» + dark Ink Navy)
   ПОДКЛЮЧАЕТСЯ ПОСЛЕ bootstrap.min.css. Все правила scoped под body.app-theme,
   поэтому лендинг (index.html без этого класса) НЕ затрагивается.
   Переключатель light/dark: html[data-theme="dark"].
   Токены сверены с дизайн-системой эскизов design/mockups/tcs.css (Ink Navy).
   Логика 8 групп (A–H) не трогается — переопределяются только цвета.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

/* Кнопка темы скрыта вне приложения (на лендинге нет body.app-theme) */
.theme-toggle{ display:none; }

body.app-theme{
  /* Ink Navy — светлая «тёплая бумага» (айвори/шампань), синий акцент. Сверено с tcs.css :root */
  --tc-bg:#F4EFE6; --tc-bg2:#EDE6D8; --tc-surf:#FFFDF9; --tc-surf2:#F8F3EA; --tc-surf3:#F1EBDD;
  --tc-text:#241E17; --tc-text2:#4A4034; --tc-muted:#7C7161; --tc-line:#E6DDCC;
  --tc-accent:#2563EB; --tc-accent-hover:#1D4ED8; --tc-accent2:#7C5CF6; --tc-ui:#241E17;
  --tc-ok:#1E9A63; --tc-info:#2563EB; --tc-warn:#B8791A; --tc-danger:#C0392B;
  --tc-tg:#229ED9; --tc-tg-hover:#1B8FC6; --tc-star1:#E0A63C; --tc-star2:#C98A1E; --tc-star-ink:#2A1E05;
  /* 8 групп поведения A–H (сигналы Ink Navy + расширение E–H) */
  --g-a:#6B7B99; --g-b:#C55A3A; --g-c:#C7952E; --g-d:#1E9A63;
  --g-e:#7B4FA6; --g-f:#CB6A2A; --g-g:#2A8C7A; --g-h:#B84A7D;

  background:var(--tc-bg) !important; color:var(--tc-text);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI','Noto Sans SC',sans-serif;
}
html[data-theme="dark"] body.app-theme{
  /* Ink Navy (выбор заказчика): сине-чернильный GitHub-dark, синий акцент, живые цветные сигналы */
  --tc-bg:#0B1220; --tc-bg2:#0F1728; --tc-surf:#141D30; --tc-surf2:#1B2740; --tc-surf3:#243352;
  --tc-text:#EAF0F9; --tc-text2:#B7C3D6; --tc-muted:#7E8CA3; --tc-line:#263450;
  --tc-accent:#3B82F6; --tc-accent-hover:#5B9BFF; --tc-accent2:#8B72F0; --tc-ui:#EAF0F9;
  --tc-ok:#3DD68C; --tc-info:#58A6FF; --tc-warn:#E3B341; --tc-danger:#E7563A;
  --tc-tg:#3AA8DE; --tc-tg-hover:#54B6E6; --tc-star1:#E0A63C; --tc-star2:#C98A1E; --tc-star-ink:#2A1E05;
  --g-a:#58A6FF; --g-b:#E8734A; --g-c:#E3B341; --g-d:#3DD68C;
  --g-e:#9B8FBF; --g-f:#E39152; --g-g:#5CB9AA; --g-h:#D989B8;
}

/* ——— типографика заголовков ——— */
body.app-theme h1, body.app-theme h2, body.app-theme h3,
body.app-theme .h1, body.app-theme .h2, body.app-theme .h3{ font-family:'Space Grotesk',system-ui,'Noto Sans SC',sans-serif; letter-spacing:-.02em; color:var(--tc-text); }

/* ——— навбар: тёплый surface вместо синего bg-primary ——— */
body.app-theme .navbar.bg-primary{ background:var(--tc-surf) !important; border-bottom:1px solid var(--tc-line); }
body.app-theme .navbar-dark .navbar-brand,
body.app-theme .navbar-dark .navbar-nav .nav-link{ color:var(--tc-text) !important; }
body.app-theme .navbar-dark .navbar-nav .nav-link:hover,
body.app-theme .navbar-dark .navbar-nav .nav-link:focus{ color:var(--tc-accent) !important; }
body.app-theme .navbar-dark .navbar-toggler{ border-color:var(--tc-line); }
body.app-theme .navbar-dark .navbar-toggler-icon{ filter:invert(.6) sepia(1) saturate(3) hue-rotate(-10deg); }

/* ——— кнопки ——— */
body.app-theme .btn-primary{ background:var(--tc-accent) !important; border-color:var(--tc-accent) !important; color:#fff !important; }
body.app-theme .btn-primary:hover{ background:var(--tc-accent-hover) !important; border-color:var(--tc-accent-hover) !important; color:#fff !important; }
body.app-theme .btn-outline-primary{ color:var(--tc-accent) !important; border-color:var(--tc-accent) !important; }
body.app-theme .btn-outline-primary:hover{ background:var(--tc-accent) !important; color:#fff !important; }
body.app-theme .btn-success{ background:var(--tc-ok) !important; border-color:var(--tc-ok) !important; }
body.app-theme .btn-secondary{ background:var(--tc-ui) !important; border-color:var(--tc-ui) !important; }

/* ——— поверхности ——— */
body.app-theme .card,
body.app-theme .dropdown-menu,
body.app-theme .list-group-item,
body.app-theme .modal-content{ background:var(--tc-surf); border-color:var(--tc-line); color:var(--tc-text); }
body.app-theme .card-header, body.app-theme .card-footer{ background:var(--tc-surf2); border-color:var(--tc-line); }
body.app-theme .bg-light{ background:var(--tc-surf2) !important; }
body.app-theme .dropdown-item{ color:var(--tc-text); }
body.app-theme .dropdown-item:hover{ background:var(--tc-surf2); color:var(--tc-text); }
body.app-theme hr{ border-color:var(--tc-line); }

/* ——— текстовые утилиты ——— */
body.app-theme .text-primary{ color:var(--tc-accent) !important; }
body.app-theme .text-success{ color:var(--tc-ok) !important; }
body.app-theme .text-info{ color:var(--tc-info) !important; }
body.app-theme .text-warning{ color:var(--tc-warn) !important; }
body.app-theme .text-danger{ color:var(--tc-danger) !important; }
body.app-theme .text-muted{ color:var(--tc-muted) !important; }

/* ——— формы ——— */
body.app-theme .form-control, body.app-theme .form-select{ background:var(--tc-surf); border-color:var(--tc-line); color:var(--tc-text); }
body.app-theme .form-control::placeholder{ color:var(--tc-muted); }
/* Bootstrap floating-label: placeholder должен быть прозрачным (иначе двоится с label) */
body.app-theme .form-floating > .form-control::placeholder,
body.app-theme .form-floating > .form-control:not(:focus)::placeholder{ color:transparent; }
body.app-theme .form-control:focus, body.app-theme .form-select:focus{ background:var(--tc-surf); border-color:var(--tc-accent); box-shadow:0 0 0 .2rem color-mix(in srgb,var(--tc-accent) 22%,transparent); color:var(--tc-text); }
body.app-theme .form-label, body.app-theme label{ color:var(--tc-text2); }

/* ——— таблицы ——— */
body.app-theme .table{ color:var(--tc-text); }
body.app-theme .table > :not(caption) > * > *{ border-color:var(--tc-line); }
body.app-theme .table-hover > tbody > tr:hover > *{ background:var(--tc-surf2); }

/* ——— алерты (нейтрализуем захардкоженный зелёный в register) ——— */
body.app-theme .alert-success{ background:var(--tc-surf2); border-color:var(--tc-line); color:var(--tc-text); }
body.app-theme .alert-info{ background:var(--tc-surf2); border-color:var(--tc-line); color:var(--tc-text); }

/* ——— бейджи ——— */
body.app-theme .badge.bg-primary{ background:var(--tc-accent) !important; }
body.app-theme .badge.bg-success{ background:var(--tc-ok) !important; }

/* ——— 8 групп поведения A–H (только цвет полосы, логика не трогается) ——— */
body.app-theme .group-A{ border-left-color:var(--g-a) !important; }
body.app-theme .group-B{ border-left-color:var(--g-b) !important; }
body.app-theme .group-C{ border-left-color:var(--g-c) !important; }
body.app-theme .group-D{ border-left-color:var(--g-d) !important; }
body.app-theme .group-E{ border-left-color:var(--g-e) !important; }
body.app-theme .group-F{ border-left-color:var(--g-f) !important; }
body.app-theme .group-G{ border-left-color:var(--g-g) !important; }
body.app-theme .group-H{ border-left-color:var(--g-h) !important; }

/* ——— переключатель темы (кнопка в навбаре) ——— */
body.app-theme .theme-toggle{ background:transparent; border:1px solid var(--tc-line); color:var(--tc-text); border-radius:999px; width:38px; height:38px; display:inline-grid; place-items:center; cursor:pointer; transition:.2s; }
body.app-theme .theme-toggle:hover{ border-color:var(--tc-accent); color:var(--tc-accent); }
body.app-theme .theme-toggle .ico-sun{ display:none; }
html[data-theme="dark"] body.app-theme .theme-toggle .ico-sun{ display:inline; }
html[data-theme="dark"] body.app-theme .theme-toggle .ico-moon{ display:none; }

/* ═══════════════ Дизайн-фиксы по ревью команды (P0/P1) ═══════════════ */

/* Sticky footer: прижать футер к низу при коротком контенте */
body.app-theme{ display:flex; flex-direction:column; min-height:100vh; }
body.app-theme main, body.app-theme main#main-content{ flex:1 0 auto; }
body.app-theme footer{ flex-shrink:0; margin-top:auto !important; }

/* Фокус полей — синий акцент Ink Navy */
body.app-theme .form-control:focus, body.app-theme .form-select:focus{ border-color:var(--tc-accent) !important; box-shadow:0 0 0 .2rem color-mix(in srgb,var(--tc-accent) 22%,transparent) !important; }
html[data-theme="dark"] body.app-theme .form-control:focus, html[data-theme="dark"] body.app-theme .form-select:focus{ box-shadow:0 0 0 .2rem color-mix(in srgb,var(--tc-accent) 34%,transparent) !important; }

/* Лейблы форм читаемы в обеих темах */
body.app-theme .form-label, body.app-theme label{ color:var(--tc-text2) !important; }

/* Градиенты акцента: тёмный коралл (accent→accent-hover), чтобы белый текст читался (WCAG AA). Включая stats-card. */
body.app-theme .hero-section, body.app-theme .results-hero, body.app-theme .cta-section, body.app-theme .stats-card{ background:linear-gradient(135deg, var(--tc-accent), var(--tc-accent-hover)) !important; color:#fff !important; }
body.app-theme .stats-card *, body.app-theme .hero-section *, body.app-theme .results-hero *{ color:#fff !important; }

/* Бейджи: тёмный текст на светлых фонах (warning/info) — белый нечитаем */
body.app-theme .badge.bg-warning, body.app-theme .badge.bg-info{ color:#1F1A14 !important; }
body.app-theme .badge.text-bg-warning, body.app-theme .badge.text-bg-info{ color:#1F1A14 !important; }

/* Иконки в кнопках/ссылках — выровнять по центру (baseline shift) */
body.app-theme .btn i, body.app-theme .nav-link i, body.app-theme .dropdown-item i{ vertical-align:middle; }

/* Габариты: единая шкала радиусов и размеров кнопок (app-scoped, лендинг не тронут) */
body.app-theme .btn{ border-radius:10px; }
body.app-theme .btn-sm{ border-radius:8px; }
body.app-theme .btn-lg{ border-radius:12px; }
body.app-theme .badge{ border-radius:8px; }
body.app-theme .card, body.app-theme .modal-content, body.app-theme .dropdown-menu, body.app-theme .list-group-item{ border-radius:14px; }
body.app-theme .form-control:not(.input-group *), body.app-theme .form-select:not(.input-group *){ border-radius:10px; }
body.app-theme .btn:not(.btn-sm):not(.btn-lg){ min-height:42px; display:inline-flex; align-items:center; justify-content:center; gap:.4rem; }

/* ═══════════════ Фикс «белых» пятен (хардкод #fff/#f8f9fa/#e9ecef → тема) ═══════════════ */
/* !important перебивает inline-стили и <style>-блоки шаблонов */
body.app-theme .score-card, body.app-theme .ai-followup-block, body.app-theme .ai-step-body,
body.app-theme .ai-followup-answer, body.app-theme .ai-followup-meta, body.app-theme .ai-report-card,
body.app-theme .referral-step, body.app-theme .plans-modal, body.app-theme .interpretation-item,
body.app-theme .info-box, body.app-theme .hint-box, body.app-theme .help-text{ background:var(--tc-surf) !important; color:var(--tc-text) !important; border-color:var(--tc-line) !important; }
body.app-theme .survey-progress, body.app-theme .step:not(.active):not(.completed){ background:var(--tc-surf3) !important; }
body.app-theme .progress{ background:var(--tc-surf3) !important; }
body.app-theme .progress-bar:not([class*="bg-"]){ background:var(--tc-accent) !important; }
body.app-theme .card-header, body.app-theme .table thead th, body.app-theme .table th{ background:var(--tc-surf2) !important; color:var(--tc-text) !important; }
body.app-theme .option-card, body.app-theme .form-control, body.app-theme .form-select{ border-color:var(--tc-line) !important; }
body.app-theme .ai-step-header, body.app-theme .ai-followup-question, body.app-theme .option-card.selected{ background:linear-gradient(135deg, var(--tc-surf2), var(--tc-surf3)) !important; color:var(--tc-text) !important; }
body.app-theme .referral-note{ background:var(--tc-surf2) !important; color:var(--tc-warn) !important; border-color:var(--tc-line) !important; }
body.app-theme .pagination .page-link{ background:var(--tc-surf) !important; color:var(--tc-text) !important; border-color:var(--tc-line) !important; }
body.app-theme .pagination .page-item.active .page-link{ background:var(--tc-accent) !important; border-color:var(--tc-accent) !important; color:#fff !important; }
body.app-theme .response-details .p-2 small, body.app-theme .ai-followup-meta, body.app-theme .ai-analysis-content li{ background:var(--tc-surf2) !important; }
/* Мягкий белый вместо чистого #fff в тексте */
body.app-theme, body.app-theme p, body.app-theme li, body.app-theme td, body.app-theme span{ }

/* ═══════════════ Glassmorphism (матовое стекло): dropdown / modal / navbar ═══════════════ */
body.app-theme .dropdown-menu, body.app-theme .modal-content, body.app-theme .glass-surface{
  background:rgba(255,255,255,0.80) !important; backdrop-filter:blur(16px) saturate(1.4); -webkit-backdrop-filter:blur(16px) saturate(1.4);
  border:1px solid rgba(255,255,255,0.5) !important; box-shadow:0 12px 40px -8px rgba(31,26,20,0.18) !important; }
body.app-theme .navbar.bg-primary{ position:relative; z-index:1030; background:rgba(255,255,255,0.72) !important; backdrop-filter:blur(14px) saturate(1.3); -webkit-backdrop-filter:blur(14px) saturate(1.3); }
html[data-theme="dark"] body.app-theme .dropdown-menu, html[data-theme="dark"] body.app-theme .modal-content, html[data-theme="dark"] body.app-theme .glass-surface{
  background:rgba(20,29,48,0.82) !important; backdrop-filter:blur(16px) saturate(1.5); -webkit-backdrop-filter:blur(16px) saturate(1.5);
  border:1px solid rgba(255,255,255,0.10) !important; box-shadow:0 14px 44px -8px rgba(0,0,0,0.5) !important; }
html[data-theme="dark"] body.app-theme .navbar.bg-primary{ background:rgba(11,18,32,0.74) !important; backdrop-filter:blur(14px) saturate(1.4); -webkit-backdrop-filter:blur(14px) saturate(1.4); }
/* Fallback без backdrop-filter — сплошной фон (читаемость) */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  body.app-theme .dropdown-menu, body.app-theme .modal-content, body.app-theme .glass-surface{ background:var(--tc-surf) !important; }
  body.app-theme .navbar.bg-primary{ background:var(--tc-surf) !important; }
}

/* ═══════════════ Премиум-детали: мягкий hover карточек ═══════════════ */
body.app-theme .card, body.app-theme .feature-card, body.app-theme .survey-card{ transition:transform .22s cubic-bezier(.2,.7,.2,1), box-shadow .22s cubic-bezier(.2,.7,.2,1); }
body.app-theme .card:hover, body.app-theme .feature-card:hover, body.app-theme .survey-card:hover{ transform:translateY(-3px); box-shadow:0 18px 44px -18px rgba(31,26,20,.28); }
html[data-theme="dark"] body.app-theme .card:hover, html[data-theme="dark"] body.app-theme .feature-card:hover, html[data-theme="dark"] body.app-theme .survey-card:hover{ box-shadow:0 20px 50px -18px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.06); }

/* Таблицы: более заметный hover */
body.app-theme .table-hover > tbody > tr:hover > *{ background:var(--tc-surf3) !important; }

/* Тени карточек — мягкие, из системы (вместо резкого 0 20px 60px) */
body.app-theme .login-card, body.app-theme .register-card,
body.app-theme .card.shadow, body.app-theme .card.shadow-sm{ box-shadow:0 10px 30px -14px rgba(31,26,20,.20) !important; }
html[data-theme="dark"] body.app-theme .login-card, html[data-theme="dark"] body.app-theme .register-card,
html[data-theme="dark"] body.app-theme .card.shadow, html[data-theme="dark"] body.app-theme .card.shadow-sm{ box-shadow:0 14px 36px -16px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.05) !important; }

/* Telegram dev-кнопка (btn-outline-info) в теме */
body.app-theme .btn-outline-info{ color:var(--tc-info) !important; border-color:var(--tc-info) !important; }
body.app-theme .btn-outline-info:hover{ background:var(--tc-info) !important; color:#0F1115 !important; }

/* Иконки пустого состояния — не тонуть в muted */
body.app-theme .fa-3x.text-muted, body.app-theme .fa-4x.text-muted{ color:var(--tc-accent) !important; opacity:.65; }

/* ═══════════════════════════════════════════════════════════════════════
   КОМПОНЕНТЫ ДИЗАЙН-СИСТЕМЫ (портированы из эскизов design/, привязаны к теме)
   Мост «крутой эскиз → реальный шаблон»: composition, а не только цвет.
   ═══════════════════════════════════════════════════════════════════════ */

/* Надзаголовок-eyebrow — сверено с tcs .kicker */
body.app-theme .tc-kicker{ font-family:'JetBrains Mono',ui-monospace,'SFMono-Regular',Menlo,monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--tc-muted); font-weight:500; display:block; }

/* Hero-блок страницы */
body.app-theme .tc-hero{ padding:clamp(.6rem,3vw,1.4rem) 0 .2rem; }
body.app-theme .tc-hero-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
body.app-theme .tc-hero h1{ margin:.35rem 0 0; }
body.app-theme .tc-hero-lead{ color:var(--tc-muted); margin:.35rem 0 0; max-width:52ch; }

/* Метрики — сверено с tcs .metric: крупная градиентная цифра */
body.app-theme .tc-stat{ display:flex; gap:1.8rem; flex-wrap:wrap; margin-top:1.2rem; }
body.app-theme .tc-stat .n{ font-family:'Space Grotesk',sans-serif; font-size:clamp(2.2rem,5vw,3.4rem); font-weight:600; line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums; background:linear-gradient(135deg,#60A5FA,#7C5CF6); -webkit-background-clip:text; background-clip:text; color:transparent; }
body.app-theme .tc-stat .l{ font-size:.86rem; color:var(--tc-muted); margin-top:.4rem; }

/* Сетка карточек — заполняет ширину (в отличие от узкого col-lg-4) */
body.app-theme .tc-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:1.3rem; margin-top:1.4rem; }

/* Карточка — сверено с tcs .card: r-lg 20px, тень sh-2, паддинг эскиза */
body.app-theme .tc-card{ background:var(--tc-surf); border:1px solid var(--tc-line); border-radius:var(--r-lg,20px); padding:clamp(1.4rem,3.2vw,2rem); display:flex; flex-direction:column; gap:.9rem; box-shadow:var(--sh-2,0 12px 34px -18px rgba(60,45,25,.16)); transition:transform .22s cubic-bezier(.2,.7,.2,1), box-shadow .22s; }
body.app-theme .tc-card:hover{ transform:translateY(-3px); box-shadow:var(--sh-3,0 34px 70px -38px rgba(60,45,25,.24)); }
body.app-theme .tc-card-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:.6rem; }
/* Заголовок карточки — акцент-бар слева (tcs .section-title) */
body.app-theme .tc-card-top h3{ margin:0; font-size:1.15rem; padding-inline-start:12px; border-inline-start:3px solid var(--tc-accent); line-height:1.2; }
body.app-theme .tc-card-sub{ font-size:.82rem; color:var(--tc-muted); margin-top:.15rem; }

/* Профиль-бар сигналов — сверено с tcs .sigbar: 10px + рамка */
body.app-theme .tc-sigbar{ display:flex; height:10px; border-radius:99px; overflow:hidden; background:var(--tc-surf3); border:1px solid var(--tc-line); }
body.app-theme .tc-sigbar > span{ display:block; height:100%; min-width:2px; }

/* Чип-сигнал — сверено с tcs .chip: weight 700, точка .6rem */
body.app-theme .tc-chip{ display:inline-flex; align-items:center; gap:.4rem; padding:.28rem .7rem; border-radius:99px; font-size:.78rem; font-weight:700; background:var(--tc-surf2); color:var(--tc-text2); border:1px solid var(--tc-line); }
body.app-theme .tc-chip .dot{ width:.6rem; height:.6rem; border-radius:50%; background:currentColor; flex:none; }
body.app-theme .tc-meta{ display:flex; gap:.5rem; flex-wrap:wrap; }

/* Статус-чип (активен/сбор) */
body.app-theme .tc-status{ display:inline-flex; align-items:center; gap:.4rem; padding:.28rem .7rem; border-radius:99px; font-size:.78rem; font-weight:700; border:1px solid var(--tc-line); background:var(--tc-surf2); }
body.app-theme .tc-status .dot{ width:.55rem; height:.55rem; border-radius:50%; background:currentColor; }
body.app-theme .tc-status.is-active{ color:var(--tc-ok); background:color-mix(in srgb, var(--tc-ok) 13%, transparent); border-color:color-mix(in srgb, var(--tc-ok) 30%, transparent); }
body.app-theme .tc-status.is-idle{ color:var(--tc-muted); }

/* Подсказка / disclaimer — сверено с tcs .disclaimer (без warn-акцента) */
body.app-theme .tc-disclaimer{ display:flex; gap:.6rem; align-items:flex-start; background:var(--tc-surf2); border:1px solid var(--tc-line); border-radius:10px; padding:.8rem 1rem; font-size:.86rem; color:var(--tc-muted); }
body.app-theme .tc-disclaimer b, body.app-theme .tc-disclaimer strong{ color:var(--tc-text); }

/* Разделитель и ряд действий */
body.app-theme .tc-sep{ border:0; border-top:1px solid var(--tc-line); margin:.3rem 0; }
body.app-theme .tc-link-row{ display:flex; gap:.6rem; align-items:center; }

/* Ghost-кнопка (вторичное действие) */
body.app-theme .tc-btn-ghost{ background:transparent; border:1px solid var(--tc-line); color:var(--tc-text); }
body.app-theme .tc-btn-ghost:hover{ background:var(--tc-surf2); border-color:var(--tc-accent); color:var(--tc-accent); }

/* Пунктирная карточка «создать» — сверено с tcs .newcard: r-lg, 220px */
body.app-theme .tc-newcard{ display:grid; place-items:center; text-align:center; gap:.3rem; border:1.5px dashed var(--tc-line); background:transparent; border-radius:var(--r-lg,20px); min-height:220px; color:var(--tc-muted); cursor:pointer; transition:border-color .2s, color .2s; text-decoration:none; }
body.app-theme .tc-newcard:hover{ border-color:var(--tc-accent); color:var(--tc-accent); }