/**
 * @file: dashboard-widgets.css
 * @description: Сетка и карточки виджетов пользовательских дашбордов (pgt-dash-*)
 * @dependencies: variables.css, design-system.css
 * @created: 2026-06-25
 */

@layer components {
  .pgt-dash-page {
    max-width: 1200px;
  }

  .pgt-dash-page__header {
    padding-bottom: 0.25rem;
    border-bottom: 1px solid var(--border-color);
  }

  .pgt-dash-page__title {
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: 0.03em;
    color: var(--text-primary);
  }

  .pgt-dash-page__subtitle {
    font-size: 0.9375rem;
    color: var(--text-muted);
  }

  .pgt-dash-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 1rem;
  }

  .pgt-dash-grid--stacked-cols {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
  }

  @media (min-width: 768px) {
    .pgt-dash-grid--stacked-cols {
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: 1.25rem;
    }
  }

  .pgt-dash-col {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
  }

  @media (min-width: 992px) {
    .pgt-dash-grid--stacked-cols {
      gap: 1.25rem;
    }

    .pgt-dash-col {
      gap: 1.25rem;
    }
  }

  .pgt-dash-col > .pgt-dash-card {
    width: 100%;
    max-width: 100%;
  }

  @media (max-width: 767px) {
    .pgt-dash-grid--stacked-cols {
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }

    .pgt-dash-col {
      display: contents;
    }

    .pgt-dash-mobile-order-1 { order: 1; }
    .pgt-dash-mobile-order-2 { order: 2; }
    .pgt-dash-mobile-order-3 { order: 3; }
    .pgt-dash-mobile-order-4 { order: 4; }
    .pgt-dash-mobile-order-5 { order: 5; }
    .pgt-dash-mobile-order-6 { order: 6; }
    .pgt-dash-mobile-order-7 { order: 7; }
    .pgt-dash-mobile-order-8 { order: 8; }
    .pgt-dash-mobile-order-9 { order: 9; }
    .pgt-dash-mobile-order-10 { order: 10; }
  }

  @media (min-width: 992px) {
    .pgt-dash-grid {
      gap: 1.25rem;
    }
  }

  .pgt-dash-span-12 {
    grid-column: span 12;
  }

  .pgt-dash-span-8 {
    grid-column: span 12;
  }

  .pgt-dash-span-6 {
    grid-column: span 12;
  }

  .pgt-dash-span-4 {
    grid-column: span 12;
  }

  @media (min-width: 768px) {
    .pgt-dash-span-6 {
      grid-column: span 6;
    }

    .pgt-dash-span-8 {
      grid-column: span 8;
    }

    .pgt-dash-span-4 {
      grid-column: span 4;
    }
  }

  .pgt-dash-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--surface-1);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  }

  .pgt-dash-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(
      90deg,
      transparent 0%,
      color-mix(in srgb, var(--primary) 70%, transparent) 50%,
      transparent 100%
    );
    opacity: 0.75;
    pointer-events: none;
  }

  .pgt-dash-card:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--primary) 28%, var(--border-color));
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  }

  /* ——— Акцентные тона виджетов (личная панель) ——— */
  .pgt-dash-card--tone-attention { --pgt-dash-tone: var(--warning); }
  .pgt-dash-card--tone-profile { --pgt-dash-tone: #5b8def; }
  .pgt-dash-card--tone-teams { --pgt-dash-tone: #a78bfa; }
  .pgt-dash-card--tone-forum { --pgt-dash-tone: #2dd4bf; }
  .pgt-dash-card--tone-race-next { --pgt-dash-tone: var(--primary); }
  .pgt-dash-card--tone-calendar { --pgt-dash-tone: var(--info); }
  .pgt-dash-card--tone-results { --pgt-dash-tone: #d4a24c; }
  .pgt-dash-card--tone-championships { --pgt-dash-tone: #0077b6; }
  .pgt-dash-card--tone-races { --pgt-dash-tone: var(--warning); }
  .pgt-dash-card--tone-tools { --pgt-dash-tone: #94a3b8; }
  .pgt-dash-card--tone-equipment { --pgt-dash-tone: #38bdf8; }

  .pgt-dash-card[class*="pgt-dash-card--tone-"]::before {
    height: 3px;
    opacity: 1;
    background: linear-gradient(
      90deg,
      color-mix(in srgb, var(--pgt-dash-tone) 35%, transparent) 0%,
      var(--pgt-dash-tone) 50%,
      color-mix(in srgb, var(--pgt-dash-tone) 35%, transparent) 100%
    );
  }

  .pgt-dash-card[class*="pgt-dash-card--tone-"] .pgt-dash-card__header {
    background: color-mix(in srgb, var(--pgt-dash-tone) 9%, var(--surface-2));
    border-bottom-color: color-mix(in srgb, var(--pgt-dash-tone) 20%, var(--border-color));
  }

  .pgt-dash-card[class*="pgt-dash-card--tone-"] .pgt-dash-card__header.ds-cardHeader {
    --ds-header-bg: color-mix(in srgb, var(--pgt-dash-tone) 9%, var(--surface-2));
    background: color-mix(in srgb, var(--pgt-dash-tone) 9%, var(--surface-2));
  }

  .pgt-dash-card[class*="pgt-dash-card--tone-"] .pgt-dash-card__icon {
    background: color-mix(in srgb, var(--pgt-dash-tone) 14%, var(--surface-1));
    border-color: color-mix(in srgb, var(--pgt-dash-tone) 28%, var(--border-color));
  }

  .pgt-dash-card[class*="pgt-dash-card--tone-"]:hover {
    border-color: color-mix(in srgb, var(--pgt-dash-tone) 32%, var(--border-color));
  }

  [data-theme="dark"] .pgt-dash-card[class*="pgt-dash-card--tone-"]:hover {
    box-shadow: var(--shadow-lg), 0 0 18px color-mix(in srgb, var(--pgt-dash-tone) 22%, transparent);
  }

  [data-theme="dark"] .pgt-dash-card--tone-championships {
    --pgt-dash-tone: #58a6ff;
  }

  .pgt-dash-card__header {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.8rem 1rem;
    border-bottom: 1px solid var(--border-color);
    background: var(--surface-2);
    color: var(--text-primary);
  }

  .pgt-dash-card__header.ds-cardHeader {
    --ds-header-bg: var(--surface-2);
    --ds-header-fg: var(--text-primary);
    background: var(--surface-2);
    color: var(--text-primary);
  }

  .pgt-dash-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--primary) 12%, var(--surface-1));
    border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--border-color));
  }

  .pgt-dash-card__icon .bi {
    color: var(--primary) !important;
    font-size: 1rem;
    line-height: 1;
  }

  .pgt-dash-card__header .bi,
  .pgt-dash-card__header i.bi {
    color: var(--primary) !important;
    font-size: 1.1rem;
    flex-shrink: 0;
  }

  .pgt-dash-card__title {
    margin: 0;
    font-family: var(--font-display);
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    flex: 1;
    color: var(--text-primary);
  }

  .pgt-dash-card__badge {
    margin-left: auto;
    flex-shrink: 0;
  }

  .pgt-dash-card__body {
    flex: 1;
    padding: 1rem 1.1rem 1.1rem;
    color: var(--text-primary);
  }

  .pgt-dash-card__footer {
    padding: 0.65rem 1.1rem 0.9rem;
    text-align: right;
    border-top: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--surface-2) 55%, transparent);
  }

  .pgt-dash-card__action {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-decoration: none;
    text-transform: uppercase;
    color: var(--link);
    transition: color 0.15s ease, gap 0.15s ease;
  }

  .pgt-dash-card__action::after {
    content: "→";
    font-size: 0.9em;
    transition: transform 0.15s ease;
  }

  .pgt-dash-card__action:hover {
    color: var(--link-hover);
    gap: 0.5rem;
  }

  .pgt-dash-card__action:hover::after {
    transform: translateX(2px);
  }

  .pgt-dash-card__footer a {
    font-size: 0.875rem;
    text-decoration: none;
  }

  .pgt-dash-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 0.55rem;
    padding: 1.35rem 1rem;
    color: var(--text-muted);
    border: 1px dashed var(--border-color);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--surface-2) 65%, transparent);
  }

  .pgt-dash-empty__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--surface-2);
    border: 1px solid var(--border-color);
  }

  .pgt-dash-empty__icon .bi,
  .pgt-dash-empty .bi {
    font-size: 1.25rem;
    opacity: 0.55;
  }

  .pgt-dash-empty__text {
    font-size: 0.875rem;
    max-width: 18rem;
  }

  .pgt-dash-empty--compact {
    padding: 0.75rem 0.85rem;
    gap: 0.4rem;
  }

  .pgt-dash-empty--compact .pgt-dash-empty__icon {
    width: 2rem;
    height: 2rem;
  }

  .pgt-dash-empty--compact .pgt-dash-empty__icon .bi,
  .pgt-dash-empty--compact .pgt-dash-empty .bi {
    font-size: 1rem;
  }

  .pgt-dash-ok {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-md);
    font-size: 0.875rem;
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--success) 10%, var(--surface-2));
    border: 1px solid color-mix(in srgb, var(--success) 28%, var(--border-color));
  }

  .pgt-dash-ok__icon {
    color: var(--success) !important;
    font-size: 1rem;
    flex-shrink: 0;
  }

  .pgt-dash-kpi {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.02em;
    color: var(--primary);
  }

  .pgt-dash-kpi-label {
    margin-top: 0.2rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-muted);
  }

  .pgt-dash-card--compact,
  .pgt-dash-card--fit {
    align-self: start;
  }

  .pgt-dash-card--compact .pgt-dash-card__body,
  .pgt-dash-card--fit .pgt-dash-card__body {
    flex: 0 1 auto;
    padding: 0.875rem 1rem;
  }

  .pgt-dash-kpi--sm {
    font-size: 1.35rem;
  }

  /* ——— Ленты ссылок и строки ——— */
  .pgt-dash-feed {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
  }

  .pgt-dash-feed__link {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.65rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--surface-2);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
  }

  .pgt-dash-feed__link:hover {
    border-color: color-mix(in srgb, var(--primary) 32%, var(--border-color));
    background: color-mix(in srgb, var(--primary) 7%, var(--surface-2));
    color: inherit;
    transform: translateX(1px);
  }

  .pgt-dash-feed__link--static {
    cursor: default;
  }

  .pgt-dash-feed__link--static:hover {
    transform: none;
    border-color: var(--border-color);
    background: var(--surface-2);
  }

  .pgt-dash-feed__link--danger {
    border-left: 3px solid var(--danger);
  }

  .pgt-dash-feed__link--warning {
    border-left: 3px solid var(--warning);
  }

  .pgt-dash-feed__link--info {
    border-left: 3px solid var(--info);
  }

  .pgt-dash-feed__link--primary {
    border-left: 3px solid var(--primary);
  }

  .pgt-dash-feed__link--success {
    border-left: 3px solid var(--success);
  }

  .pgt-dash-attention-notification__row {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md, 0.5rem);
    background: var(--surface-2);
    overflow: hidden;
  }

  .pgt-dash-attention-notification__row--info {
    border-left: 3px solid var(--info);
  }

  .pgt-dash-attention-notification__main {
    flex: 1 1 auto;
    min-width: 0;
    display: block;
    padding: 0.65rem 0.75rem;
    color: inherit;
    text-decoration: none;
  }

  .pgt-dash-attention-notification__main:hover {
    background: color-mix(in srgb, var(--primary) 6%, transparent);
    color: inherit;
    text-decoration: none;
  }

  .pgt-dash-attention-mark-read {
    flex: 0 0 auto;
    align-self: center;
    margin-right: 0.5rem;
    padding: 0.25rem 0.5rem;
    line-height: 1;
  }

  .pgt-dash-attention-more {
    font-size: 0.8rem;
    text-align: center;
  }

  .pgt-dash-feed__meta--time {
    opacity: 0.85;
  }

  .pgt-dash-feed__body {
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
    min-width: 0;
  }

  .pgt-dash-feed__title {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.3;
  }

  .pgt-dash-feed__meta {
    font-size: 0.75rem;
    color: var(--text-muted);
    line-height: 1.35;
  }

  .pgt-dash-feed__chevron {
    font-size: 0.75rem;
    color: var(--text-muted);
    opacity: 0.5;
    transition: opacity 0.15s ease, transform 0.15s ease;
  }

  .pgt-dash-feed__link:hover .pgt-dash-feed__chevron {
    opacity: 1;
    transform: translateX(2px);
  }

  .pgt-dash-feed__link .position-result {
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 0.35rem;
    width: auto !important;
    align-self: center;
    flex-shrink: 0;
  }

  .pgt-dash-feed__link .position-result__medal {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    font-size: 1rem;
    line-height: 1;
  }

  .pgt-dash-feed__link .position-result .position-badge {
    flex: 0 0 auto;
  }

  /* ——— Hero / spotlight блоки ——— */
  .pgt-dash-hero {
    padding: 0.15rem 0 0.1rem;
  }

  .pgt-dash-hero__date {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--primary);
    margin-bottom: 0.35rem;
  }

  .pgt-dash-hero__title {
    font-family: var(--font-display);
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.02em;
    color: var(--text-primary);
  }

  .pgt-dash-hero__link {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
  }

  .pgt-dash-hero__link:hover {
    color: var(--primary);
  }

  .pgt-dash-hero__meta {
    font-size: 0.8125rem;
    color: var(--text-muted);
  }

  /* ——— Моя ближайшая гонка ——— */
  .pgt-dash-next-race {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
  }

  .pgt-dash-next-race__hero {
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--pgt-dash-tone, var(--primary)) 7%, var(--surface-2));
    border: 1px solid color-mix(in srgb, var(--pgt-dash-tone, var(--primary)) 20%, var(--border-color));
  }

  .pgt-dash-next-race__hero-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.35rem;
  }

  .pgt-dash-next-race__countdown {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--primary);
  }

  .pgt-dash-next-race__countdown--urgent { color: var(--danger); }
  .pgt-dash-next-race__countdown--soon { color: color-mix(in srgb, var(--warning) 90%, #000); }
  .pgt-dash-next-race__countdown--started { color: var(--success); }
  .pgt-dash-next-race__countdown--none { color: var(--text-muted); }

  .pgt-dash-next-race__badge {
    font-size: 0.625rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  .pgt-dash-next-race__title {
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--text-primary);
  }

  .pgt-dash-next-race__link {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
  }

  .pgt-dash-next-race__link:hover {
    color: var(--primary);
  }

  .pgt-dash-next-race__meta {
    margin-top: 0.2rem;
    font-size: 0.75rem;
    color: var(--text-muted);
    line-height: 1.35;
  }

  .pgt-dash-next-race__meta--time {
    margin-top: 0.15rem;
    color: var(--text-secondary);
  }

  .pgt-dash-next-race__meta--time .bi {
    margin-right: 0.2rem;
    color: var(--primary);
  }

  .pgt-dash-next-race__sep {
    margin: 0 0.15rem;
    opacity: 0.55;
  }

  .pgt-dash-next-race__line {
    font-size: 0.75rem;
    color: var(--text-secondary);
    line-height: 1.4;
  }

  .pgt-dash-next-race__line .bi {
    margin-right: 0.2rem;
    color: var(--text-muted);
  }

  .pgt-dash-next-race__elo {
    display: inline-block;
    margin-left: 0.25rem;
    padding: 0.05rem 0.35rem;
    border-radius: 999px;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--primary);
    background: color-mix(in srgb, var(--primary) 12%, var(--surface-2));
    border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--border-color));
    vertical-align: middle;
  }

  .pgt-dash-next-race__mine {
    padding-top: 0.15rem;
  }

  .pgt-dash-next-race__mine .pgt-dash-section__title {
    margin-bottom: 0.2rem;
  }

  .pgt-dash-next-race__sessions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding-top: 0.1rem;
  }

  .pgt-dash-next-race__session {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.2rem 0.35rem;
    padding: 0.22rem 0.5rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    color: var(--text-secondary);
    background: var(--surface-2);
    border: 1px solid var(--border-color);
  }

  .pgt-dash-next-race__session-type {
    font-weight: 700;
    color: var(--text-primary);
  }

  .pgt-dash-next-race__session-time {
    font-variant-numeric: tabular-nums;
  }

  .pgt-dash-next-race__session-detail {
    color: var(--text-muted);
  }

  .pgt-dash-spotlight {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.75rem 0.85rem;
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--border-color));
    background: color-mix(in srgb, var(--primary) 8%, var(--surface-2));
  }

  .pgt-dash-spotlight__label {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
  }

  .pgt-dash-spotlight__title {
    font-family: var(--font-display);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.2;
  }

  .pgt-dash-spotlight__meta {
    font-size: 0.8125rem;
    color: var(--text-secondary);
  }

  .pgt-dash-spotlight__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    flex-wrap: wrap;
  }

  .pgt-dash-spotlight__role {
    flex-shrink: 0;
  }

  .pgt-dash-spotlight__link {
    color: inherit;
    text-decoration: none;
  }

  .pgt-dash-spotlight__link:hover {
    color: var(--primary);
  }

  .pgt-dash-section {
    margin-top: 0.75rem;
  }

  .pgt-dash-section:first-child {
    margin-top: 0;
  }

  .pgt-dash-spotlight + .pgt-dash-section {
    margin-top: 0.75rem;
  }

  .pgt-dash-section__title {
    margin: 0 0 0.4rem;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
  }

  .pgt-dash-member-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
  }

  .pgt-dash-member-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-secondary);
    background: var(--surface-2);
    border: 1px solid var(--border-color);
    text-decoration: none;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
  }

  a.pgt-dash-member-chip:hover {
    color: var(--text-primary);
    border-color: color-mix(in srgb, var(--primary) 40%, var(--border-color));
    background: color-mix(in srgb, var(--primary) 8%, var(--surface-2));
  }

  .pgt-dash-member-chip--more {
    font-weight: 700;
    color: var(--text-muted);
  }

  /* ——— Профиль на панели ——— */
  .pgt-dash-profile-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--primary) 7%, var(--surface-2));
    border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border-color));
  }

  .pgt-dash-profile-hero__main {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
  }

  .pgt-dash-profile-hero__value {
    font-family: var(--font-display);
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.02em;
    color: var(--primary);
  }

  .pgt-dash-profile-hero__rank {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-muted);
    white-space: nowrap;
  }

  .pgt-dash-profile-progress {
    margin-top: 0.65rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
  }

  .pgt-dash-profile-progress__track {
    height: 0.35rem;
    border-radius: 999px;
    background: var(--surface-2);
    border: 1px solid var(--border-color);
    overflow: hidden;
  }

  .pgt-dash-profile-progress__track--inline {
    width: 100%;
    margin-top: 0.35rem;
  }

  .pgt-dash-profile-progress__fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
      90deg,
      color-mix(in srgb, var(--primary) 80%, transparent),
      var(--primary)
    );
  }

  .pgt-dash-profile-progress__label {
    font-size: 0.6875rem;
    color: var(--text-muted);
  }

  .pgt-dash-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.4rem;
    margin-top: 0.65rem;
  }

  @media (max-width: 420px) {
    .pgt-dash-stat-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  .pgt-dash-stat-grid__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.1rem;
    padding: 0.45rem 0.25rem;
    border-radius: var(--radius-md);
    background: var(--surface-2);
    border: 1px solid var(--border-color);
    text-align: center;
  }

  .pgt-dash-stat-grid__item--hint {
    cursor: help;
  }

  .pgt-dash-stat-grid__value {
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--text-primary);
  }

  .pgt-dash-stat-grid__label {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-muted);
  }

  .pgt-dash-exp-snapshot {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.55rem 0.65rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--surface-2);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, background 0.15s ease;
  }

  .pgt-dash-exp-snapshot:hover {
    color: inherit;
    border-color: color-mix(in srgb, var(--primary) 32%, var(--border-color));
    background: color-mix(in srgb, var(--primary) 6%, var(--surface-2));
  }

  .pgt-dash-exp-snapshot__level {
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--text-primary);
  }

  .pgt-dash-exp-snapshot__division {
    font-size: 0.75rem;
    color: var(--text-secondary);
  }

  .pgt-dash-exp-snapshot__hint {
    font-size: 0.6875rem;
    color: var(--text-muted);
  }

  .pgt-dash-rating-ladder {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
  }

  .pgt-dash-rating-ladder__row {
    display: grid;
    grid-template-columns: 2.25rem 1fr auto auto;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.55rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--surface-2);
    font-size: 0.8125rem;
  }

  .pgt-dash-rating-ladder__row--self {
    border-color: color-mix(in srgb, var(--primary) 35%, var(--border-color));
    background: color-mix(in srgb, var(--primary) 8%, var(--surface-2));
  }

  .pgt-dash-rating-ladder__pos {
    font-weight: 700;
    color: var(--text-muted);
    font-size: 0.75rem;
  }

  .pgt-dash-rating-ladder__name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .pgt-dash-rating-ladder__name a {
    color: inherit;
    text-decoration: none;
  }

  .pgt-dash-rating-ladder__name a:hover {
    color: var(--primary);
  }

  .pgt-dash-rating-ladder__elo {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--text-primary);
  }

  .pgt-dash-rating-ladder__gap {
    min-width: 2rem;
    text-align: right;
    font-size: 0.75rem;
    color: var(--text-muted);
  }

  .pgt-dash-profile {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.85rem;
  }

  @media (min-width: 420px) {
    .pgt-dash-profile {
      grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
      align-items: center;
    }
  }

  .pgt-dash-profile__main {
    text-align: center;
    padding: 0.35rem 0.5rem;
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--primary) 6%, var(--surface-2));
    border: 1px solid var(--border-color);
  }

  .pgt-dash-profile__rank {
    margin-top: 0.45rem;
    font-size: 0.75rem;
    color: var(--text-muted);
  }

  .pgt-dash-profile__aside {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
  }

  .pgt-dash-mini-stat {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.55rem 0.65rem;
    border-radius: var(--radius-md);
    background: var(--surface-2);
    border: 1px solid var(--border-color);
  }

  .pgt-dash-mini-stat__label {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--text-muted);
  }

  .pgt-dash-mini-stat__value {
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--info);
  }

  .pgt-dash-mini-stat__hint {
    font-size: 0.75rem;
    color: var(--text-muted);
  }

  /* ——— Toolbar / chip links ——— */
  .pgt-dash-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--border-color);
  }

  .pgt-dash-toolbar--inline {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }

  .pgt-dash-chip-link {
    display: inline-flex;
    align-items: center;
    padding: 0.3rem 0.65rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    text-decoration: none;
    color: var(--primary);
    background: color-mix(in srgb, var(--primary) 10%, var(--surface-2));
    border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--border-color));
    transition: background 0.15s ease, border-color 0.15s ease;
  }

  .pgt-dash-chip-link:hover {
    color: var(--primary);
    background: color-mix(in srgb, var(--primary) 16%, var(--surface-2));
    border-color: color-mix(in srgb, var(--primary) 38%, var(--border-color));
  }

  .pgt-dash-chip-link--muted {
    color: var(--text-secondary);
    background: var(--surface-2);
    border-color: var(--border-color);
  }

  .pgt-dash-chip-link--muted:hover {
    color: var(--text-primary);
    background: color-mix(in srgb, var(--primary) 6%, var(--surface-2));
  }

  /* ——— Календарь-таймлайн ——— */
  .pgt-dash-timeline {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .pgt-dash-timeline__item {
    display: grid;
    grid-template-columns: 4.5rem 1fr;
    gap: 0.65rem;
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--border-light);
  }

  .pgt-dash-timeline__item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
  }

  .pgt-dash-timeline__item:first-child {
    padding-top: 0;
  }

  .pgt-dash-timeline__item--past {
    opacity: 0.62;
  }

  .pgt-dash-timeline__date {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--primary);
    line-height: 1.35;
    padding-top: 0.1rem;
  }

  .pgt-dash-timeline__body {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
  }

  .pgt-dash-timeline__title {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--text-primary);
    line-height: 1.3;
  }

  .pgt-dash-timeline__link {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
  }

  .pgt-dash-timeline__link:hover {
    color: var(--primary);
  }

  .pgt-dash-timeline__meta {
    font-size: 0.75rem;
    color: var(--text-muted);
  }

  /* ——— Список инструментов ——— */
  .pgt-dash-tool-list {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
  }

  .pgt-dash-tool-list__item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.65rem;
    padding: 0.6rem 0.7rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--surface-2);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
  }

  .pgt-dash-tool-list__item:hover {
    border-color: color-mix(in srgb, var(--primary) 30%, var(--border-color));
    background: color-mix(in srgb, var(--primary) 7%, var(--surface-2));
    color: inherit;
    transform: translateX(1px);
  }

  .pgt-dash-tool-list__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--primary) 12%, var(--surface-1));
    border: 1px solid color-mix(in srgb, var(--primary) 18%, transparent);
  }

  .pgt-dash-tool-list__icon .bi {
    color: var(--primary) !important;
    font-size: 0.9rem;
  }

  .pgt-dash-tool-list__label {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-primary);
  }

  .pgt-dash-tool-list__chevron {
    font-size: 0.75rem;
    color: var(--text-muted);
    opacity: 0.5;
    transition: opacity 0.15s ease, transform 0.15s ease;
  }

  .pgt-dash-tool-list__item:hover .pgt-dash-tool-list__chevron {
    opacity: 1;
    transform: translateX(2px);
  }

  /* ——— Safety Rating panel ——— */
  .pgt-dash-safety-panel {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
  }

  .pgt-dash-safety-panel__hero {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
  }

  .pgt-dash-safety-panel__value {
    font-family: 'Rajdhani', sans-serif;
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.02em;
  }

  .pgt-dash-safety-panel__label {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding-bottom: 0.15rem;
    min-width: 0;
  }

  .pgt-dash-safety-panel__class {
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }

  .pgt-dash-safety-panel__desc {
    font-size: 0.8125rem;
    color: var(--text-muted);
  }

  .pgt-dash-safety-panel__track {
    height: 4px;
    border-radius: 999px;
    background: var(--surface-2);
    overflow: hidden;
  }

  .pgt-dash-safety-panel__fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    transition: width 0.35s ease;
  }

  .pgt-dash-safety-panel--class-a .pgt-dash-safety-panel__value,
  .pgt-dash-safety-panel--class-a .pgt-dash-safety-panel__class {
    color: var(--success);
  }

  .pgt-dash-safety-panel--class-a .pgt-dash-safety-panel__fill {
    background: var(--success);
  }

  .pgt-dash-safety-panel--class-b .pgt-dash-safety-panel__value,
  .pgt-dash-safety-panel--class-b .pgt-dash-safety-panel__class {
    color: var(--info);
  }

  .pgt-dash-safety-panel--class-b .pgt-dash-safety-panel__fill {
    background: var(--info);
  }

  .pgt-dash-safety-panel--class-c .pgt-dash-safety-panel__value,
  .pgt-dash-safety-panel--class-c .pgt-dash-safety-panel__class {
    color: var(--warning);
  }

  .pgt-dash-safety-panel--class-c .pgt-dash-safety-panel__fill {
    background: var(--warning);
  }

  .pgt-dash-safety-panel--class-d .pgt-dash-safety-panel__value,
  .pgt-dash-safety-panel--class-d .pgt-dash-safety-panel__class,
  .pgt-dash-safety-panel--class-e .pgt-dash-safety-panel__value,
  .pgt-dash-safety-panel--class-e .pgt-dash-safety-panel__class {
    color: var(--danger);
  }

  .pgt-dash-safety-panel--class-d .pgt-dash-safety-panel__fill,
  .pgt-dash-safety-panel--class-e .pgt-dash-safety-panel__fill {
    background: var(--danger);
  }

  .pgt-dash-safety-panel__chips {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .pgt-dash-safety-chip {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.45rem 0.6rem;
    border-radius: var(--radius-md);
    background: var(--surface-2);
    border: 1px solid var(--border-color);
  }

  .pgt-dash-safety-chip__label {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-muted);
  }

  .pgt-dash-safety-chip__value {
    font-family: 'Rajdhani', sans-serif;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--text-primary);
  }

  .pgt-dash-safety-panel__hint {
    font-size: 0.8125rem;
    line-height: 1.35;
    color: var(--text-muted);
    padding: 0.45rem 0.6rem;
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--surface-2) 88%, var(--info) 12%);
    border-left: 3px solid var(--info);
  }

  .pgt-dash-safety-panel--compact {
    gap: 0.45rem;
    padding: 0.55rem 0.65rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--surface-2);
  }

  .pgt-dash-safety-panel--compact .pgt-dash-safety-panel__hero {
    gap: 0.5rem;
  }

  .pgt-dash-safety-panel--compact .pgt-dash-safety-panel__value {
    font-size: 1.25rem;
  }

  .pgt-dash-safety-panel--compact .pgt-dash-safety-panel__desc {
    font-size: 0.75rem;
  }

  .pgt-dash-safety-panel--compact .pgt-dash-safety-panel__hint {
    font-size: 0.75rem;
    padding: 0.35rem 0.5rem;
  }

  /* ——— Лучшие чемпионаты ——— */
  .pgt-dash-achieve-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
  }

  .pgt-dash-achieve-item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.65rem;
    padding: 0.5rem 0.6rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--surface-2);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, background 0.15s ease;
  }

  .pgt-dash-achieve-item:hover {
    border-color: color-mix(in srgb, var(--primary) 35%, var(--border-color));
    background: color-mix(in srgb, var(--primary) 6%, var(--surface-2));
    color: inherit;
  }

  .pgt-dash-achieve-medal {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Rajdhani', sans-serif;
    font-size: 0.8125rem;
    font-weight: 700;
    flex-shrink: 0;
    line-height: 1;
  }

  .pgt-dash-achieve-medal--gold {
    background: linear-gradient(145deg, #f5d76e, #c9a227);
    color: #3d2f00;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
  }

  .pgt-dash-achieve-medal--silver {
    background: linear-gradient(145deg, #e8ecef, #9aa3ad);
    color: #2a3038;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
  }

  .pgt-dash-achieve-medal--bronze {
    background: linear-gradient(145deg, #e8a87c, #a8643a);
    color: #3d2210;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
  }

  .pgt-dash-achieve-medal--other {
    background: var(--surface-3);
    color: var(--text-secondary);
    border: 1px solid var(--border-color);
  }

  .pgt-dash-achieve-item__body {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
  }

  .pgt-dash-achieve-item__title {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .pgt-dash-achieve-item__year {
    font-size: 0.75rem;
    color: var(--text-muted);
  }

  .pgt-dash-achieve-item__chevron {
    font-size: 0.75rem;
    color: var(--text-muted);
    opacity: 0.55;
    transition: opacity 0.15s ease, transform 0.15s ease;
  }

  .pgt-dash-achieve-item:hover .pgt-dash-achieve-item__chevron {
    opacity: 1;
    transform: translateX(2px);
  }

  .pgt-dash-page .driver-extended-stats {
    margin-bottom: 0;
  }

  .pgt-dash-stub-note {
    margin: 0;
    font-size: 0.875rem;
    color: var(--text-muted);
  }

  .pgt-dash-skeleton {
    height: 1rem;
    border-radius: var(--radius-sm);
    background: linear-gradient(
      90deg,
      var(--surface-2) 25%,
      var(--surface-3) 50%,
      var(--surface-2) 75%
    );
    background-size: 200% 100%;
    animation: pgt-dash-skeleton-pulse 1.2s ease-in-out infinite;
  }

  @keyframes pgt-dash-skeleton-pulse {
    0% {
      background-position: 100% 0;
    }
    100% {
      background-position: -100% 0;
    }
  }

  .pgt-dash-row-highlight {
    background: color-mix(in srgb, var(--primary) 12%, transparent);
    border-left: 3px solid var(--primary);
  }

  .pgt-dash-text-win {
    color: var(--success);
  }

  .pgt-dash-game-badge {
    display: inline-block;
    margin-left: 0.35rem;
    padding: 0.1rem 0.45rem;
    border-radius: 0.25rem;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.3;
    color: #475569;
    background: #e2e8f0;
    white-space: nowrap;
  }

  [data-theme="dark"] .pgt-dash-game-badge {
    color: #cbd5e1;
    background: #334155;
  }

  .pgt-dash-text-loss {
    color: var(--danger);
  }

  /*
   * Иконки Bootstrap Icons в light.css по умолчанию белые (var(--bg-primary));
   * исключение есть для .card, но виджеты — article.pgt-dash-card.
   */
  [data-theme="light"] .pgt-dash-page i.bi,
  [data-theme="dark"] .pgt-dash-page i.bi {
    color: var(--text-secondary);
  }

  [data-theme="light"] .pgt-dash-page .pgt-dash-card__header i.bi,
  [data-theme="dark"] .pgt-dash-page .pgt-dash-card__header i.bi,
  [data-theme="light"] .pgt-dash-page .pgt-dash-card__icon .bi,
  [data-theme="dark"] .pgt-dash-page .pgt-dash-card__icon .bi,
  [data-theme="light"] .pgt-dash-page .pgt-dash-page__title i.bi,
  [data-theme="dark"] .pgt-dash-page .pgt-dash-page__title i.bi {
    color: var(--primary) !important;
  }

  [data-theme="light"] .pgt-dash-page [class*="pgt-dash-card--tone-"] .pgt-dash-card__icon .bi,
  [data-theme="dark"] .pgt-dash-page [class*="pgt-dash-card--tone-"] .pgt-dash-card__icon .bi {
    color: var(--pgt-dash-tone) !important;
  }

  [data-theme="light"] .pgt-dash-page .pgt-dash-empty i.bi,
  [data-theme="dark"] .pgt-dash-page .pgt-dash-empty i.bi {
    color: var(--text-muted) !important;
    opacity: 0.65;
  }

  .pgt-dash-page .pgt-dash-text-win i.bi {
    color: var(--success) !important;
  }

  .pgt-dash-page .pgt-dash-text-loss i.bi {
    color: var(--danger) !important;
  }

  .pgt-dash-page .btn i.bi,
  .pgt-dash-page .btn .bi {
    color: inherit !important;
  }

  [data-theme="light"] .pgt-dash-page .accordion-button i.bi {
    color: inherit !important;
  }

  .pgt-dash-page .pgt-dash-card__footer a {
    color: var(--link);
    font-weight: 600;
  }

  .pgt-dash-page .pgt-dash-card__footer a:hover {
    color: var(--link-hover);
  }

  .pgt-dash-page .pgt-dash-card__footer .pgt-dash-card__action {
    color: var(--link);
  }

  .pgt-dash-page .pgt-dash-card__footer .pgt-dash-card__action:hover {
    color: var(--link-hover);
  }

  .pgt-dash-page .pgt-dash-stub-note code {
    color: var(--text-primary);
    background: var(--surface-2);
  }

  [data-theme="dark"] .pgt-dash-card {
    box-shadow: var(--shadow-panel);
  }

  [data-theme="dark"] .pgt-dash-card:hover {
    box-shadow: var(--shadow-lg), var(--glow-red-sm);
  }

  /*
   * Тёмная тема: заголовки блоков на pgt-dash-page (профиль, /dashboard/*)
   * surface-2 заметно светлее фона страницы (surface-0).
   */
  [data-theme="dark"] .pgt-dash-page .pgt-dash-card {
    border-color: rgba(255, 40, 40, 0.14);
    background: linear-gradient(
      165deg,
      rgba(17, 22, 29, 0.96) 0%,
      rgba(11, 15, 20, 0.98) 100%
    );
  }

  [data-theme="dark"] .pgt-dash-page .pgt-dash-card__header,
  [data-theme="dark"] .pgt-dash-page .pgt-dash-card__header.ds-cardHeader {
    --ds-header-bg: rgba(31, 36, 43, 0.72);
    background: linear-gradient(
      180deg,
      rgba(31, 36, 43, 0.88) 0%,
      rgba(17, 22, 29, 0.92) 100%
    ) !important;
    background-image: none !important;
    border-bottom-color: rgba(255, 255, 255, 0.08);
  }

  [data-theme="dark"] .pgt-dash-page .pgt-dash-card__icon {
    background: color-mix(in srgb, var(--primary) 16%, rgba(17, 22, 29, 0.9));
    border-color: rgba(255, 43, 43, 0.28);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  }

  [data-theme="dark"] .pgt-dash-page .pgt-dash-card__body {
    background: transparent;
  }

  [data-theme="dark"] .pgt-dash-page .pgt-dash-card__footer {
    background: rgba(13, 17, 23, 0.55);
    border-top-color: rgba(255, 255, 255, 0.08);
  }

  [data-theme="dark"] .pgt-dash-page .pgt-dash-feed__link,
  [data-theme="dark"] .pgt-dash-page .pgt-dash-mini-stat,
  [data-theme="dark"] .pgt-dash-page .pgt-dash-tool-list__item {
    background: rgba(22, 27, 34, 0.72);
    border-color: rgba(255, 255, 255, 0.08);
  }

  [data-theme="dark"] .pgt-dash-page .pgt-dash-feed__link:hover,
  [data-theme="dark"] .pgt-dash-page .pgt-dash-tool-list__item:hover {
    background: color-mix(in srgb, var(--primary) 9%, rgba(22, 27, 34, 0.85));
    border-color: rgba(255, 43, 43, 0.22);
  }

  [data-theme="dark"] .pgt-dash-page .pgt-dash-profile__main,
  [data-theme="dark"] .pgt-dash-page .pgt-dash-spotlight {
    background: color-mix(in srgb, var(--primary) 10%, rgba(22, 27, 34, 0.8));
    border-color: rgba(255, 43, 43, 0.18);
  }

  [data-theme="dark"] .pgt-dash-page .pgt-dash-empty {
    background: rgba(22, 27, 34, 0.45);
    border-color: rgba(255, 255, 255, 0.1);
  }

  [data-theme="dark"] .pgt-dash-page .pgt-dash-page__header {
    border-bottom-color: rgba(255, 40, 40, 0.18);
  }

  [data-theme="dark"] .pgt-dash-page .accordion-item {
    border-color: var(--border-dark);
  }

  [data-theme="dark"] .pgt-dash-page .accordion-button,
  [data-theme="dark"] .pgt-dash-page .accordion-button:not(.collapsed) {
    background-color: var(--surface-2) !important;
    background-image: none !important;
    color: var(--text-primary);
    font-weight: 600;
    box-shadow: none;
  }

  [data-theme="dark"] .pgt-dash-page .accordion-button:focus {
    box-shadow: inset 0 0 0 1px var(--border-dark);
  }

  [data-theme="dark"] .pgt-dash-page .accordion-button i.bi {
    color: var(--primary) !important;
  }

  [data-theme="dark"] .pgt-dash-page .card {
    border-color: var(--border-dark) !important;
  }

  [data-theme="dark"] .pgt-dash-page .card > .card-header:not([class*="bg-"]) {
    background-color: var(--surface-2) !important;
    background-image: none !important;
    background: var(--surface-2) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
  }

  [data-theme="dark"] .pgt-dash-page .card > .card-header:not([class*="bg-"]) i.bi {
    color: var(--primary) !important;
  }

  /* ——— Виджеты сетапа (симрейсинг / ПК) ——— */
  .pgt-dash-equipment-setup {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  .pgt-dash-equipment-setup__summary {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 0.2rem 0.75rem;
    align-items: center;
  }

  .pgt-dash-equipment-setup__summary-label {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-muted);
  }

  .pgt-dash-equipment-setup__summary-value {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
  }

  .pgt-dash-equipment-setup__track {
    grid-column: 1 / -1;
    height: 5px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--pgt-dash-tone, var(--primary)) 12%, var(--surface-1));
    overflow: hidden;
  }

  .pgt-dash-equipment-setup__fill {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(
      90deg,
      color-mix(in srgb, var(--pgt-dash-tone, var(--primary)) 75%, #fff) 0%,
      var(--pgt-dash-tone, var(--primary)) 100%
    );
  }

  .pgt-dash-equipment-setup__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
  }

  .pgt-dash-equipment-setup__row {
    display: grid;
    grid-template-columns: minmax(6.5rem, 32%) minmax(0, 1fr) auto;
    gap: 0.5rem 0.75rem;
    align-items: center;
    padding: 0.5rem 0.65rem;
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--pgt-dash-tone, var(--primary)) 5%, var(--surface-1));
    border: 1px solid color-mix(in srgb, var(--pgt-dash-tone, var(--primary)) 14%, var(--border-color));
  }

  .pgt-dash-equipment-setup__type {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--text-muted);
    line-height: 1.35;
  }

  .pgt-dash-equipment-setup__value {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.2rem 0.35rem;
    line-height: 1.35;
  }

  .pgt-dash-equipment-setup__brand {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-primary);
  }

  .pgt-dash-equipment-setup__model {
    font-size: 0.8125rem;
    color: var(--text-secondary, var(--text-muted));
    word-break: break-word;
  }

  .pgt-dash-equipment-setup__primary {
    color: #e8b84a;
    font-size: 0.6875rem;
    line-height: 1;
    flex-shrink: 0;
  }

  .pgt-dash-equipment-setup__owners {
    flex: 1 1 100%;
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--text-muted);
    line-height: 1.35;
  }

  a.pgt-dash-equipment-setup__owners,
  a.pgt-dash-equipment-setup__type-link {
    text-decoration: none;
    color: var(--pgt-dash-tone, var(--primary));
  }

  a.pgt-dash-equipment-setup__owners:hover,
  a.pgt-dash-equipment-setup__type-link:hover {
    text-decoration: underline;
  }

  .pgt-dash-card__footer--split {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
  }

  .pgt-dash-card__action--secondary {
    opacity: 0.85;
  }

  .pgt-dash-equipment-setup__forum {
    justify-self: end;
    flex-shrink: 0;
  }

  .pgt-dash-equipment-setup__forum-link {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.5rem;
    border-radius: var(--radius-sm, 0.25rem);
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none;
    white-space: nowrap;
    color: var(--pgt-dash-tone, var(--primary));
    border: 1px solid color-mix(in srgb, var(--pgt-dash-tone, var(--primary)) 35%, var(--border-color));
    background: color-mix(in srgb, var(--pgt-dash-tone, var(--primary)) 8%, var(--surface-1));
  }

  .pgt-dash-equipment-setup__forum-link:hover,
  .pgt-dash-equipment-setup__forum-link:focus {
    text-decoration: none;
    color: var(--pgt-dash-tone, var(--primary));
    background: color-mix(in srgb, var(--pgt-dash-tone, var(--primary)) 14%, var(--surface-1));
  }

  .pgt-dash-equipment-setup__row--primary {
    border-color: color-mix(in srgb, #e8b84a 28%, var(--border-color));
    background: color-mix(in srgb, #e8b84a 6%, var(--surface-1));
  }

  .pgt-dash-equipment-setup__status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
  }

  .pgt-dash-equipment-setup__hint {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--text-muted);
  }

  .pgt-dash-equipment-setup__pending {
    margin: 0;
    flex-shrink: 0;
  }

  @media (max-width: 420px) {
    .pgt-dash-equipment-setup__row {
      grid-template-columns: 1fr auto;
      gap: 0.2rem 0.5rem;
    }

    .pgt-dash-equipment-setup__type {
      grid-column: 1 / -1;
    }
  }
}