/* ================================================================
   HUB DARK RESKIN (Claude Design handoff "hub-dark-reskin")
   Applies only on the hub, in dark mode, on desktop >= 1240px.
   Light mode and mobile keep the existing hub. Everything here is an
   override layer on existing markup/IDs, so the hub's JS is unchanged.
   ================================================================ */

/* Reskin-only elements are hidden everywhere else. */
.rs-only { display: none !important; }
.rs-hero-row { display: contents; }

@media (min-width: 1240px) {
  body.dark-mode.device-desktop {
    --rs-bg: #100F0D;
    --rs-card: #1A1815;
    --rs-elev: #16140F;
    --rs-text: #F3F0EA;
    --rs-text2: #B6B1A8;
    --rs-muted: #9C978D;
    --rs-faint: #8C877E;
    --rs-faint2: #6E695F;
    --rs-indigo: #5468ff;
    --rs-indigo-tint: #aab4ff;
    --rs-violet: #7c3aed;
    --rs-green: #34d399;
    --rs-red: #EB8A8A;
    --rs-gold: #f59e0b;
    --rs-cyan: #5BC9E0;
    --rs-border: rgba(255,255,255,0.08);
    --rs-border-soft: rgba(255,255,255,0.07);
    --rs-mono: 'JetBrains Mono', ui-monospace, monospace;
    --rs-sans: 'Satoshi', system-ui, sans-serif;
    background: var(--rs-bg) !important;
    color: var(--rs-text);
    font-family: var(--rs-sans);
    -webkit-font-smoothing: antialiased;
  }
  body.dark-mode.device-desktop .bg-overlay { display: none !important; }
  /* Loader: solid reskin background and a short fade, so it doesn't sit half-transparent over the page. */
  body.dark-mode.device-desktop #loading-screen { background: var(--rs-bg) !important; }
  body.dark-mode.device-desktop #loading-screen.fade-out { transition: opacity .2s ease, visibility .2s ease !important; }
  body.dark-mode.device-desktop .loader-content { background: var(--rs-card) !important; backdrop-filter: none !important; box-shadow: none !important; }

  body.dark-mode.device-desktop .rs-only { display: revert !important; }
  body.dark-mode.device-desktop .rs-only.rs-flex { display: flex !important; }
  body.dark-mode.device-desktop .rs-only.rs-off { display: none !important; }

  /* ── Layout ── */
  body.dark-mode.device-desktop #desktop-layout { max-width: none !important; gap: 0 !important; }
  body.dark-mode.device-desktop #desktop-layout > #app {
    max-width: 920px !important;
    margin: 0 auto !important;
    padding: 26px 30px 60px !important;
    background: transparent !important;
  }

  /* ── Sidebar ── */
  body.dark-mode.device-desktop #p56-sidebar {
    width: 256px !important; min-width: 256px !important;
    background: var(--rs-bg) !important;
    border: 0 !important; border-right: 1px solid var(--rs-border-soft) !important;
    border-radius: 0 !important; box-shadow: none !important;
    padding: 22px 16px !important;
    position: sticky !important; top: 0 !important;
    height: 100vh !important; max-height: 100vh !important; overflow-y: auto !important;
  }
  body.dark-mode.device-desktop .sb-brand { display: flex !important; align-items: center; gap: 11px; padding: 0 6px 18px; }
  body.dark-mode.device-desktop .sb-brand-tile {
    width: 30px; height: 30px; border-radius: 8px; background: var(--rs-text); color: var(--rs-bg);
    display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; letter-spacing: -0.5px;
  }
  body.dark-mode.device-desktop .sb-brand-name { font-weight: 700; font-size: 15px; letter-spacing: -0.2px; color: var(--rs-text); }
  body.dark-mode.device-desktop .sb-brand-beta {
    font-family: var(--rs-mono); font-size: 9px; font-weight: 600; color: var(--rs-indigo);
    background: rgba(84,104,255,0.14); border: 1px solid rgba(84,104,255,0.3); padding: 2px 6px; border-radius: 5px; letter-spacing: 1px;
  }
  body.dark-mode.device-desktop .sb-profile {
    background: var(--rs-card) !important; border: 1px solid var(--rs-border-soft) !important;
    border-radius: 14px !important; padding: 14px !important; box-shadow: none !important;
  }
  body.dark-mode.device-desktop .sb-avatar {
    width: 38px !important; height: 38px !important; border-radius: 11px !important;
    background: linear-gradient(150deg, #F2933C, #E0603C) !important; color: #fff !important; font-weight: 700 !important;
  }
  body.dark-mode.device-desktop .sb-user-name { font-weight: 600 !important; font-size: 14px !important; color: var(--rs-text) !important; }
  body.dark-mode.device-desktop .sb-user-email { font-size: 11px !important; color: var(--rs-faint) !important; }
  body.dark-mode.device-desktop .sb-stats { display: flex !important; gap: 8px !important; margin-top: 14px !important; }
  body.dark-mode.device-desktop .sb-stat {
    flex: 1; text-align: center; background: rgba(255,255,255,0.03) !important; border: 0 !important;
    border-radius: 9px !important; padding: 8px 4px !important;
  }
  body.dark-mode.device-desktop .sb-stat-val { font-family: var(--rs-sans) !important; font-weight: 600 !important; font-size: 16px !important; }
  body.dark-mode.device-desktop .sb-stat-label {
    font-family: var(--rs-mono) !important; font-size: 8px !important; color: var(--rs-faint) !important;
    letter-spacing: 0.5px !important; text-transform: uppercase;
  }
  body.dark-mode.device-desktop .sb-heading {
    font-family: var(--rs-mono) !important; font-size: 9px !important; color: var(--rs-faint2) !important;
    letter-spacing: 1.5px !important; text-transform: uppercase; padding: 16px 10px 8px !important;
  }
  body.dark-mode.device-desktop .sb-nav-item {
    display: flex !important; align-items: center; gap: 11px !important;
    padding: 9px 11px !important; border-radius: 10px !important; border: 1px solid transparent !important;
    color: var(--rs-text2) !important; font-size: 13.5px !important; background: transparent !important;
  }
  body.dark-mode.device-desktop .sb-nav-item:hover { background: rgba(255,255,255,0.04) !important; }
  body.dark-mode.device-desktop .sb-nav-item.active {
    background: rgba(84,104,255,0.13) !important; border-color: rgba(84,104,255,0.22) !important;
    color: var(--rs-indigo-tint) !important; font-weight: 600 !important;
  }
  body.dark-mode.device-desktop .sb-nav-icon { font-size: 15px !important; width: auto !important; }
  body.dark-mode.device-desktop .sb-footer { border-top: 1px solid rgba(255,255,255,0.06) !important; }
  body.dark-mode.device-desktop .sb-toggle-link { font-size: 12px !important; color: var(--rs-faint2) !important; }

  /* ── Top bar: greeting left, gems / dark toggle / avatar right ── */
  body.dark-mode.device-desktop .hub-topbar {
    background: transparent !important; border: 0 !important; box-shadow: none !important;
    padding: 0 !important; margin: 0 0 26px !important; position: static !important;
    backdrop-filter: none !important; display: flex !important; align-items: center; justify-content: space-between; gap: 20px;
  }
  body.dark-mode.device-desktop .topbar-brand,
  body.dark-mode.device-desktop .topbar-streak { display: none !important; }
  body.dark-mode.device-desktop .rs-eyebrow {
    font-family: var(--rs-mono); font-size: 11px; color: var(--rs-indigo); letter-spacing: 1.5px; text-transform: uppercase;
  }
  body.dark-mode.device-desktop .rs-greeting h1 {
    font-family: var(--rs-sans); font-weight: 500; font-size: 27px; letter-spacing: -0.4px; margin: 6px 0 0; color: var(--rs-text);
  }
  body.dark-mode.device-desktop .topbar-right { gap: 10px !important; flex-direction: row-reverse; }
  body.dark-mode.device-desktop #hub-gem-pill {
    display: flex !important; align-items: center; gap: 8px; background: var(--rs-card) !important;
    border: 1px solid var(--rs-border) !important; border-radius: 11px !important; padding: 7px 12px !important;
  }
  body.dark-mode.device-desktop #hub-gem-pill-val { font-family: var(--rs-mono); font-weight: 600; font-size: 13px; color: var(--rs-cyan); }
  body.dark-mode.device-desktop .topbar-dark-toggle {
    width: 38px !important; height: 38px !important; border-radius: 11px !important;
    background: var(--rs-card) !important; border: 1px solid var(--rs-border) !important; font-size: 16px !important;
  }
  body.dark-mode.device-desktop .topbar-avatar {
    width: 38px !important; height: 38px !important; border-radius: 11px !important;
    background: linear-gradient(150deg, #F2933C, #E0603C) !important; color: #fff !important; font-weight: 700 !important;
  }

  /* ── Announcement ── */
  body.dark-mode.device-desktop .announcement-banner {
    background: var(--rs-card) !important; border: 1px solid var(--rs-border) !important;
    border-radius: 14px !important; box-shadow: none !important; color: var(--rs-text2) !important; margin-bottom: 16px !important;
  }

  /* ── Session selector ── */
  body.dark-mode.device-desktop .rs-session:not(.rs-off) {
    display: flex !important; align-items: center; justify-content: space-between; gap: 16px;
    background: var(--rs-card); border: 1px solid var(--rs-border); border-radius: 14px; padding: 12px 16px; margin-bottom: 16px;
  }
  body.dark-mode.device-desktop .rs-session-label { display: flex; align-items: center; gap: 11px; min-width: 0; }
  body.dark-mode.device-desktop .rs-session-title { font-size: 13.5px; font-weight: 600; }
  body.dark-mode.device-desktop .rs-session-sub { font-size: 11.5px; color: var(--rs-faint); }
  body.dark-mode.device-desktop .rs-session-btns { display: flex; align-items: center; gap: 6px; background: rgba(0,0,0,0.25); border-radius: 11px; padding: 4px; }
  body.dark-mode.device-desktop .rs-session-btn {
    font-family: var(--rs-mono); font-weight: 600; font-size: 12px; padding: 7px 11px; border-radius: 8px;
    cursor: pointer; white-space: nowrap; background: transparent; border: 1px solid rgba(255,255,255,0.10); color: var(--rs-muted);
  }
  body.dark-mode.device-desktop .rs-session-btn:hover { color: var(--rs-text2); }
  body.dark-mode.device-desktop .rs-session-btn.active {
    background: rgba(84,104,255,0.16); border-color: rgba(84,104,255,0.45); color: var(--rs-indigo-tint);
  }

  /* ── Hero row: today's goal + countdown ── */
  body.dark-mode.device-desktop .rs-hero-row {
    display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; align-items: stretch;
  }
  body.dark-mode.device-desktop .daily-mission {
    margin: 0 !important; background: linear-gradient(135deg, #1C1A2E, #1A1815 60%) !important;
    border: 1px solid rgba(84,104,255,0.22) !important; border-radius: 16px !important;
    padding: 22px !important; box-shadow: none !important; gap: 20px !important;
  }
  body.dark-mode.device-desktop .daily-mission::before { display: none !important; }
  body.dark-mode.device-desktop .daily-mission-days {
    font-family: var(--rs-mono) !important; font-size: 11px !important; color: var(--rs-indigo) !important; letter-spacing: 1px !important;
  }
  body.dark-mode.device-desktop .daily-mission-title {
    font-family: var(--rs-sans) !important; font-weight: 600 !important; font-size: 22px !important; letter-spacing: -0.3px; color: var(--rs-text) !important;
  }
  body.dark-mode.device-desktop .daily-mission-sub { font-size: 13px !important; color: var(--rs-muted) !important; }
  body.dark-mode.device-desktop .exam-banner {
    margin: 0 !important; background: var(--rs-card) !important; border: 1px solid var(--rs-border) !important;
    border-radius: 16px !important; padding: 22px !important; box-shadow: none !important;
    display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: flex-start !important; gap: 14px !important;
  }
  body.dark-mode.device-desktop .exam-banner-icon { font-size: 15px !important; background: none !important; width: auto !important; height: auto !important; }
  body.dark-mode.device-desktop .exam-banner-title {
    font-family: var(--rs-mono) !important; font-size: 10.5px !important; color: var(--rs-gold) !important;
    letter-spacing: 1px !important; text-transform: uppercase; font-weight: 500 !important;
  }
  body.dark-mode.device-desktop .exam-banner-sub { font-size: 12px !important; color: var(--rs-faint) !important; }
  body.dark-mode.device-desktop .exam-banner-right { width: 100%; justify-content: space-between !important; }
  body.dark-mode.device-desktop .exam-banner-countdown {
    font-family: var(--rs-mono) !important; font-weight: 700 !important; font-variant-numeric: tabular-nums !important;
    color: var(--rs-text) !important;
  }
  body.dark-mode.device-desktop .exam-banner-days,
  body.dark-mode.device-desktop .exam-banner-time { font-size: 30px !important; font-weight: 700 !important; }
  body.dark-mode.device-desktop #cd-secs-vis { color: var(--rs-gold) !important; }
  body.dark-mode.device-desktop .exam-banner-unit { font-size: 13px !important; color: var(--rs-faint) !important; margin: 0 6px 0 2px; }

  /* ── Streak + level ── */
  body.dark-mode.device-desktop .streak-hero { gap: 14px !important; margin-bottom: 14px !important; }
  body.dark-mode.device-desktop .streak-hero-card {
    background: var(--rs-card) !important; border: 1px solid var(--rs-border) !important;
    border-radius: 16px !important; padding: 20px !important; box-shadow: none !important; text-align: left !important;
  }
  body.dark-mode.device-desktop .streak-hero-label {
    font-family: var(--rs-mono) !important; font-size: 10px !important; color: var(--rs-faint) !important;
    letter-spacing: 1.5px !important; text-transform: uppercase;
  }
  body.dark-mode.device-desktop .streak-hero-val {
    font-family: var(--rs-sans) !important; font-weight: 700 !important; font-size: 32px !important; color: var(--rs-text) !important;
  }
  body.dark-mode.device-desktop #streak-hero-level { color: var(--rs-indigo) !important; }
  body.dark-mode.device-desktop .streak-xp-bar { height: 8px !important; background: rgba(255,255,255,0.06) !important; border-radius: 99px !important; }
  body.dark-mode.device-desktop .streak-xp-fill {
    background: linear-gradient(90deg, var(--rs-indigo), var(--rs-violet)) !important;
    transition: width 1.1s cubic-bezier(.4,0,.2,1) !important; border-radius: 99px !important;
  }
  body.dark-mode.device-desktop .streak-xp-text { font-family: var(--rs-mono) !important; font-size: 11px !important; color: var(--rs-faint) !important; }

  /* ── Search ── */
  body.dark-mode.device-desktop #ls-wrap { max-width: none !important; }
  body.dark-mode.device-desktop #ls-bar {
    background: var(--rs-card) !important; border: 1px solid var(--rs-border) !important; border-radius: 13px !important; box-shadow: none !important;
  }
  body.dark-mode.device-desktop #ls-input { color: var(--rs-text) !important; background: transparent !important; }
  body.dark-mode.device-desktop #ls-input::placeholder { color: var(--rs-faint2) !important; }

  /* ── Section labels ── */
  body.dark-mode.device-desktop .section-label {
    font-family: var(--rs-sans) !important; font-weight: 600 !important; font-size: 19px !important;
    letter-spacing: 0 !important; text-transform: none !important; color: var(--rs-text) !important; margin: 40px 0 14px !important;
  }

  /* ── Subjects ── */
  body.dark-mode.device-desktop .subject-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  body.dark-mode.device-desktop .subject-card {
    min-width: 0; background: var(--rs-card) !important; border: 1px solid var(--rs-border) !important;
    border-radius: 14px !important; box-shadow: none !important;
  }
  body.dark-mode.device-desktop .subject-card::before { display: none !important; }
  body.dark-mode.device-desktop .subject-card:hover { border-color: rgba(255,255,255,0.16) !important; transform: none !important; }
  body.dark-mode.device-desktop .subject-card-name {
    color: var(--rs-text) !important; font-weight: 600 !important; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  body.dark-mode.device-desktop .subject-card-count { font-family: var(--rs-mono) !important; font-size: 11px !important; color: var(--rs-faint) !important; white-space: nowrap; }
  body.dark-mode.device-desktop .subject-status-chip { font-family: var(--rs-mono) !important; border-radius: 999px !important; }
  body.dark-mode.device-desktop .subject-micro-bar { background: rgba(255,255,255,0.06) !important; }
  body.dark-mode.device-desktop .subject-micro-fill { background: var(--rs-indigo) !important; }

  /* ── Study toolkit ── */
  body.dark-mode.device-desktop .study-phase-guide { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; margin-top: 40px !important; }
  body.dark-mode.device-desktop .study-phase-guide-title {
    font-family: var(--rs-sans) !important; font-weight: 600 !important; font-size: 19px !important;
    letter-spacing: 0 !important; text-transform: none !important; color: var(--rs-text) !important; margin-bottom: 14px !important;
  }
  body.dark-mode.device-desktop .study-phase-guide-title::after {
    content: "learn \2192  practise \2192  test"; font-family: var(--rs-mono); font-size: 11px; font-weight: 400; color: var(--rs-faint); margin-left: 12px;
  }
  body.dark-mode.device-desktop .study-phases { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 12px !important; }
  body.dark-mode.device-desktop .study-phase {
    background: var(--rs-card) !important; border: 1px solid var(--rs-border) !important; border-radius: 14px !important; padding: 18px !important; box-shadow: none !important;
  }
  body.dark-mode.device-desktop .study-phase:first-child {
    background: linear-gradient(135deg, #1C1A2E, #1A1815 60%) !important; border-color: rgba(84,104,255,0.30) !important;
  }
  body.dark-mode.device-desktop .study-phase-num { font-family: var(--rs-mono) !important; font-size: 10px !important; color: var(--rs-faint) !important; letter-spacing: 1px; text-transform: uppercase; }
  body.dark-mode.device-desktop .study-phase-name { font-family: var(--rs-sans) !important; font-weight: 600 !important; font-size: 17px !important; color: var(--rs-text) !important; }
  body.dark-mode.device-desktop .study-phase-links { display: flex !important; flex-direction: column !important; gap: 6px !important; margin-top: 12px; }
  body.dark-mode.device-desktop .study-phase-link {
    display: flex !important; justify-content: space-between; background: rgba(255,255,255,0.05) !important; border: 0 !important;
    border-radius: 9px !important; padding: 9px 11px !important; color: var(--rs-text2) !important; font-size: 13px !important; text-decoration: none !important;
  }
  body.dark-mode.device-desktop .study-phase-link::after { content: "\203A"; color: var(--rs-faint); }
  body.dark-mode.device-desktop .study-phase-link:hover { background: rgba(255,255,255,0.08) !important; }

  /* ── Footer ── */
  body.dark-mode.device-desktop .hub-footer { background: transparent !important; border-top: 1px solid var(--rs-border-soft) !important; color: var(--rs-faint) !important; margin-top: 44px !important; padding-top: 22px !important; }
  body.dark-mode.device-desktop .hub-footer .stat-val { color: var(--rs-text2) !important; }
  body.dark-mode.device-desktop .rs-signature { font-family: 'Caveat', cursive; font-size: 20px; color: var(--rs-muted); text-align: center; margin-top: 14px; }
  body.dark-mode.device-desktop .rs-signature + div,
  body.dark-mode.device-desktop .hub-footer .rs-plain-signature { display: none !important; }

  /* ── Right rail ── */
  body.dark-mode.device-desktop #p56-right-sidebar {
    width: 320px !important; min-width: 320px !important; padding: 26px 18px 40px !important;
    border-left: 1px solid var(--rs-border-soft); top: 0 !important; max-height: 100vh !important; gap: 14px !important;
  }
  body.dark-mode.device-desktop .sb-daily-challenge,
  body.dark-mode.device-desktop .sb-weekly-challenges {
    margin: 0 !important; padding: 18px !important; border-left: 1px solid var(--rs-border) !important;
  }
  body.dark-mode.device-desktop .sb-daily-challenge,
  body.dark-mode.device-desktop .sb-weekly-challenges,
  body.dark-mode.device-desktop .rs-ai-meter {
    background: var(--rs-card) !important; border: 1px solid var(--rs-border) !important; border-radius: 16px !important; box-shadow: none !important;
  }
  body.dark-mode.device-desktop .rs-ai-meter { padding: 18px; display: block !important; }
  body.dark-mode.device-desktop .rs-ai-head { display: flex; justify-content: space-between; align-items: baseline; }
  body.dark-mode.device-desktop .rs-ai-label { font-family: var(--rs-mono); font-size: 10px; color: var(--rs-faint); letter-spacing: 1.5px; }
  body.dark-mode.device-desktop .rs-ai-left { font-family: var(--rs-mono); font-weight: 700; font-size: 13px; color: var(--rs-gold); }
  body.dark-mode.device-desktop .rs-ai-bar { height: 7px; background: rgba(255,255,255,0.06); border-radius: 99px; margin: 12px 0 14px; overflow: hidden; }
  body.dark-mode.device-desktop .rs-ai-fill { height: 100%; width: 0; background: linear-gradient(90deg, #f59e0b, #E0603C); border-radius: 99px; transition: width .6s ease; }
  body.dark-mode.device-desktop .rs-ai-note { font-size: 12px; color: var(--rs-faint); margin-bottom: 12px; }
  body.dark-mode.device-desktop .rs-ai-upgrade {
    display: block; text-align: center; font-weight: 600; font-size: 13px; padding: 10px; border-radius: 10px; text-decoration: none;
    background: rgba(84,104,255,0.12); border: 1px solid rgba(84,104,255,0.28); color: var(--rs-indigo-tint);
  }
  body.dark-mode.device-desktop .rs-ai-upgrade:hover { background: rgba(84,104,255,0.18); }
  body.dark-mode.device-desktop .dc-title,
  body.dark-mode.device-desktop .wc-title { font-family: var(--rs-sans) !important; font-weight: 600 !important; color: var(--rs-text) !important; }
  body.dark-mode.device-desktop .dc-reward,
  body.dark-mode.device-desktop .wc-reward { color: var(--rs-green) !important; font-family: var(--rs-mono) !important; font-size: 11px !important; }
  body.dark-mode.device-desktop .dc-option {
    background: rgba(255,255,255,0.04) !important; border: 1px solid var(--rs-border) !important;
    border-radius: 10px !important; color: var(--rs-text2) !important;
  }
  body.dark-mode.device-desktop .dc-option.correct { background: rgba(16,185,129,0.14) !important; color: var(--rs-green) !important; border-color: rgba(52,211,153,0.4) !important; }
  body.dark-mode.device-desktop .dc-option.wrong { background: rgba(224,100,100,0.12) !important; color: var(--rs-red) !important; border-color: rgba(235,138,138,0.35) !important; }
  body.dark-mode.device-desktop .wc-item { background: rgba(255,255,255,0.03) !important; border: 0 !important; }
  body.dark-mode.device-desktop .dc-completed { color: var(--rs-muted) !important; }
  body.dark-mode.device-desktop .wc-item-bar { background: rgba(255,255,255,0.06) !important; border-radius: 99px !important; }
  body.dark-mode.device-desktop .wc-item-name { color: var(--rs-text) !important; }
  body.dark-mode.device-desktop .wc-item-desc { color: var(--rs-faint) !important; }

  /* Invite-a-study-buddy modal */
  body.dark-mode.device-desktop #ref-card {
    background: var(--rs-elev) !important; border: 1px solid var(--rs-border) !important; border-radius: 20px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.5) !important; color: var(--rs-text) !important;
  }
  body.dark-mode.device-desktop .ref-share-btn,
  body.dark-mode.device-desktop .ref-copy-btn {
    background: rgba(255,255,255,0.05) !important; border: 1px solid var(--rs-border) !important; color: var(--rs-text2) !important; border-radius: 10px !important;
  }
  body.dark-mode.device-desktop .ref-link-input {
    background: rgba(0,0,0,0.25) !important; border: 1px solid var(--rs-border) !important; color: var(--rs-text2) !important;
    font-family: var(--rs-mono) !important; font-size: 12px !important; border-radius: 10px !important;
  }
  body.dark-mode.device-desktop .ref-stats { color: var(--rs-faint) !important; }
  body.dark-mode.device-desktop .ref-dismiss { color: var(--rs-faint) !important; }
}
