* { box-sizing: border-box; margin: 0; padding: 0; }

  body {
    background: var(--n1);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    color: var(--n13);
    padding: 16px;
  }

  .dashboard { max-width: 1440px; margin: 0 auto; display: flex; flex-direction: column; gap: 14px; }

  .cards-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; align-content: start; min-height: 92px; }

  /* ---- period cards ---- */
  .card { background: var(--n2); border-radius: 6px; display: flex; flex-direction: column; min-width: 0; overflow: hidden; container-type: inline-size; }
  .card.selectable { cursor: pointer; transition: outline-color .15s; outline: 2px solid transparent; }
  .card.selectable:hover { outline-color: color-mix(in srgb, var(--accent) 50%, transparent); }
  .card.active { outline: 2px solid var(--accent); }

  .card-header { padding: 9px 11px 10px; color: var(--on-fill); border-radius: 6px 6px 0 0; }
  .card-header .title { font-weight: 700; font-size: 13px; margin-bottom: 7px; }

  .card-dates { display: flex; flex-direction: column; gap: 3px; }
  .dpair { display: flex; align-items: baseline; gap: 5px; min-width: 0; }
  .dlab { font-size: 10px; font-weight: 600; color: color-mix(in srgb, var(--on-fill) 80%, transparent); min-width: 62px; flex-shrink: 0; }
  .dval { font-size: 10px; font-weight: 700; color: var(--on-fill); min-width: 0; }

  .card-body { padding: 0 11px; }

  .metric { display: grid; grid-template-columns: 1fr auto auto; align-items: baseline; gap: 2px 6px; padding: 8px 0 9px; border-bottom: 1px solid var(--n4); }
  .metric:last-child { border-bottom: none; }
  .metric-label { font-size: 11px; color: var(--n11); min-width: 0; grid-column: 1; }
  .metric-value { font-size: 14px; font-weight: 700; color: var(--n14); font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; grid-column: 2; grid-row: 1; }
  .metric-value.neg { color: var(--red); }
  .metric-value.warn { color: var(--red); }
  .metric-prev  { font-size: 11px; color: var(--n9); font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; grid-column: 2; grid-row: 2; }
  .metric > .badge { grid-column: 3; grid-row: 1; align-self: center; }
  .badge {
    flex-shrink: 0; min-width: 48px; text-align: center;
    font-size: 10px; line-height: 1.35; padding: 1px 5px; border-radius: 3px; font-weight: 600;
    font-variant-numeric: tabular-nums;
  }
  .badge.bad  { background: var(--amber-fill); color: var(--on-fill); }
  .badge.good { background: var(--green-fill); color: var(--on-fill); }
  .badge.neutral { background: var(--n6); color: var(--n12); }
  .badge.pp { min-width: 56px; font-size: 9px; letter-spacing: -.01em; }

  .metric.metric-warn {
    background: color-mix(in srgb, var(--red-strong) 18%, transparent);
    margin: 0 -11px;
    padding-left: 11px;
    padding-right: 11px;
    border-left: 3px solid var(--red);
    border-bottom-color: color-mix(in srgb, var(--red) 35%, transparent);
  }
  .warn-tri {
    display: inline-block;
    color: var(--red);
    font-size: 10px;
    margin-left: 4px;
    vertical-align: middle;
    line-height: 1;
    text-shadow: 0 0 6px color-mix(in srgb, var(--red) 55%, transparent);
  }
  .block-row.block-warn {
    background: color-mix(in srgb, var(--red-strong) 16%, transparent);
    margin: 0 -8px;
    padding: 2px 8px;
    border-radius: 3px;
    border-left: 2px solid var(--red);
  }
  .block-row.block-warn .bl-val.warn { color: var(--red); }

  .notice { background: var(--amber-tint); color: var(--amber); border: 1px solid var(--amber-strong); border-radius: 6px; padding: 9px 12px; font-size: 13px; }
  .empty { color: var(--n10); font-size: 13px; padding: 16px; }

  /* ---- regional sub-blocks under each card ---- */
  .blocks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--n4); margin-top: 2px; }
  .block { background: var(--n2); padding: 7px 8px 8px; min-width: 0; container-type: inline-size; }
  .block-title { font-size: 10px; font-weight: 700; letter-spacing: .03em; color: var(--blue); margin-bottom: 5px; text-transform: uppercase; }
  .block-row { display: grid; grid-template-columns: 1fr auto auto; align-items: baseline; gap: 2px 4px; margin-bottom: 3px; }
  .block-row:last-child { margin-bottom: 0; }
  .bl-label { font-size: 9px; color: var(--n10); min-width: 0; }
  .bl-val { font-size: 11px; font-weight: 700; color: var(--n14); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .bl-val.neg { color: var(--red); }
  .block-row .badge { font-size: 8px; padding: 0 3px; min-width: 38px; line-height: 1.3; }

  /* узкая карточка: регионы столбиком, а не 3 в ряд */
  @container (max-width: 560px) {
    .blocks { grid-template-columns: 1fr; }
    .block { padding: 8px 10px; }
    .bl-val { font-size: 12px; }
    .block-row .badge { font-size: 9px; min-width: 42px; }
  }

  /* узкий регион (4 в ряд на широкой карточке): значение на отдельной строке */
  @container (max-width: 200px) {
    .block-row { grid-template-columns: 1fr auto; }
    .bl-label { grid-column: 1; }
    .block-row .badge { grid-column: 2; grid-row: 1; }
    .bl-val { grid-column: 1 / -1; text-align: left; font-size: 10px; }
  }

  /* ---- forecast card placeholder (карточка-заглушка) ---- */
  .skel { height: 14px; border-radius: 4px; background: linear-gradient(90deg, var(--n3) 25%, var(--n5) 50%, var(--n3) 75%); background-size: 200% 100%; animation: shimmer 1.4s ease-in-out infinite; }
  @keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
  .forecast-note { color: var(--n10); font-size: 11px; padding: 10px 8px 12px; text-align: center; }
  .metric-value.q { color: var(--n9); }

  /* ---- topbar / filters ---- */
  .app-header {
    display: none; align-items: center; gap: 14px; min-width: 0;
    padding: 8px; border: 1px solid var(--n5); border-radius: 10px;
    background: linear-gradient(135deg, var(--n2), var(--n2));
    box-shadow: 0 8px 24px color-mix(in srgb, var(--shadow) 20%, transparent);
  }
  .app-header.on { display: flex; }
  .module-nav {
    display: flex; align-items: center; gap: 4px; min-width: 0; overflow-x: auto;
    padding: 4px; border: 1px solid var(--n5); border-radius: 8px; background: var(--n1);
    scrollbar-width: thin;
  }
  .module-tab {
    min-width: max-content; border: 1px solid transparent; border-radius: 6px;
    background: transparent; color: var(--n10); padding: 8px 14px; font: inherit;
    font-size: 13px; font-weight: 750; cursor: pointer; transition: .15s ease;
  }
  .module-tab:hover { color: var(--n13); background: var(--n4); }
  .module-tab.on { border-color: var(--teal); background: var(--n6); color: var(--n14); }
  .module-tab:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
  .topbar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; min-height: 38px; }
  .sub { font-size: 12px; color: var(--n9); }
  .freshness { text-align: left; line-height: 1.25; flex-shrink: 0; }
  .freshness .fl { font-size: 10px; color: var(--n9); text-transform: uppercase; letter-spacing: .04em; }
  .freshness .fv { font-size: 13px; font-weight: 700; color: var(--n13); }
  .gmroi { text-align: left; line-height: 1.25; flex-shrink: 0; }
  .gmroi .fl { font-size: 10px; color: var(--n9); text-transform: uppercase; letter-spacing: .04em; }
  .gmroi .fv { font-size: 13px; font-weight: 700; color: var(--n13); cursor: help; }
  .loading {
    display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px;
    min-width: 102px; margin-left: auto; color: var(--n11); font-size: 13px;
    visibility: hidden; opacity: 0; transition: opacity .15s;
  }
  .loading.on { visibility: visible; opacity: 1; }
  .spin { width: 15px; height: 15px; border: 2px solid var(--n5); border-top-color: var(--blue); border-radius: 50%; animation: spin .7s linear infinite; }
  @keyframes spin { to { transform: rotate(360deg); } }

  /* ---- user chip / logout ---- */
  .user-chip { display: none; align-items: center; gap: 9px; flex: 0 0 auto; background: var(--n4); border: 1px solid var(--n7); border-radius: 8px; padding: 7px 10px; font-size: 13px; }
  .user-chip.on { display: inline-flex; }
  .user-avatar { display: inline-flex; align-items: center; justify-content: center; width: 25px; height: 25px; border-radius: 7px; background: var(--teal-strong); color: var(--n14); font-size: 12px; font-weight: 850; text-transform: uppercase; }
  .user-chip .uname { font-weight: 700; color: var(--n14); }
  .logout-btn { background: none; border: none; color: var(--blue); font: inherit; font-size: 12px; cursor: pointer; padding: 0; }
  .logout-btn:hover { color: var(--n13); text-decoration: underline; }

  .filter-panel {
    position: sticky; top: 0; z-index: 40; overflow: visible;
    background: color-mix(in srgb, var(--n2) 96%, transparent); border: 1px solid var(--n5); border-radius: 8px;
    box-shadow: 0 8px 24px color-mix(in srgb, var(--shadow) 26%, transparent); backdrop-filter: blur(10px);
  }
  .filter-toolbar { display: flex; align-items: center; gap: 12px; padding: 10px 12px 8px; flex-wrap: wrap; }
  .filter-scope { display: flex; align-items: center; gap: 8px; min-width: 0; }
  .filter-scope-products { flex: 1; }
  .filter-scope-label {
    color: var(--n9); font-size: 10px; font-weight: 700; letter-spacing: .055em;
    text-transform: uppercase; white-space: nowrap;
  }
  .filter-divider { align-self: stretch; width: 1px; min-height: 30px; background: var(--n5); }
  .filters { display: flex; gap: 8px; flex-wrap: nowrap; }
  .filter-slot, .sku-country-slot { min-width: 0; }
  .filter-summary {
    display: flex; align-items: center; gap: 8px; min-height: 39px;
    padding: 0 12px 9px; border-top: 1px solid var(--n5);
  }
  .filter-summary-label { color: var(--n9); font-size: 11px; white-space: nowrap; }
  .active-filters {
    display: flex; align-items: center; gap: 6px; min-width: 0; flex: 1;
    overflow-x: auto; overflow-y: hidden; padding: 5px 0 1px; scrollbar-width: thin;
  }
  .active-filter-empty { color: var(--n8); font-size: 12px; white-space: nowrap; }
  .active-filter-chip {
    display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto;
    max-width: 280px; border: 1px solid var(--n7); border-radius: 999px;
    background: var(--n4); color: var(--n13); padding: 5px 8px 5px 10px;
    font: inherit; font-size: 11px; cursor: pointer;
  }
  .active-filter-chip:hover { border-color: var(--sky); background: var(--n5); }
  .active-filter-chip:focus-visible, .filter-reset:focus-visible, .ms-trigger:focus-visible, .ms-action:focus-visible {
    outline: 2px solid var(--blue); outline-offset: 2px;
  }
  .active-filter-chip-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .active-filter-chip-x { color: var(--sky); font-size: 14px; line-height: 1; }
  .filter-reset {
    flex: 0 0 auto; background: none; border: none; color: var(--blue);
    font: inherit; font-size: 12px; font-weight: 600; padding: 6px 2px; cursor: pointer;
  }
  .filter-reset:hover:not(:disabled) { color: var(--n13); text-decoration: underline; }
  .filter-reset:disabled { color: var(--on-fill); cursor: default; }
  .filter-progress {
    position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; overflow: hidden;
    border-radius: 0 0 8px 8px; opacity: 0; pointer-events: none;
  }
  .filter-progress::after {
    content: ""; display: block; width: 38%; height: 100%; background: var(--sky-fill);
    transform: translateX(-120%);
  }
  .filter-panel.updating .filter-progress { opacity: 1; }
  .filter-panel.updating .filter-progress::after { animation: filter-progress 1s ease-in-out infinite; }
  @keyframes filter-progress { to { transform: translateX(360%); } }

  .ms { position: relative; }
  .ms-trigger {
    display: inline-flex; align-items: center; gap: 8px; width: 205px; max-width: 100%;
    background: var(--n2); border: 1px solid var(--n5); border-radius: 6px;
    padding: 8px 12px; color: var(--n14); font: inherit; font-size: 13px; cursor: pointer; transition: border-color .15s;
  }
  .ms-trigger:hover { border-color: var(--n7); }
  .ms.open .ms-trigger { border-color: var(--accent); }
  .ms-label { color: var(--n10); }
  .ms-label::after { content: ":"; }
  .ms-value { color: var(--n14); font-weight: 600; margin-right: auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ms-caret { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid var(--n11); transition: transform .15s; }
  .ms.open .ms-caret { transform: rotate(180deg); }
  .ms-menu {
    position: absolute; top: calc(100% + 5px); left: 0; min-width: max(100%, 220px);
    background: var(--n3); border: 1px solid var(--n5); border-radius: 6px; padding: 4px;
    box-shadow: 0 8px 22px color-mix(in srgb, var(--shadow) 45%, transparent); z-index: 50; display: none;
    max-height: min(360px, calc(100vh - 92px)); overflow-y: auto; overscroll-behavior: contain;
  }
  .ms.open .ms-menu { display: block; }
  .ms-opt { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 4px; font-size: 13px; color: var(--n13); cursor: pointer; white-space: nowrap; }
  .ms-opt:hover { background: var(--n4); }
  .ms-opt input { width: 15px; height: 15px; accent-color: var(--accent); cursor: pointer; }
  .ms-actions { display: flex; gap: 6px; padding: 2px 2px 6px; margin-bottom: 4px; border-bottom: 1px solid var(--n5); }
  .ms-action { flex: 1; background: var(--n4); border: 1px solid var(--n6); border-radius: 4px; color: var(--n13); font: inherit; font-size: 12px; padding: 5px 8px; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
  .ms-action:hover { background: var(--n5); border-color: var(--accent); color: var(--n14); }
  .ms-empty { color: var(--n9); font-size: 12px; padding: 9px; white-space: nowrap; }
  .ms-section { margin-top: 6px; padding-top: 8px; border-top: 1px solid var(--design-border, var(--n5)); }
  .ms-section-title { padding: 0 9px 7px; color: var(--design-muted, var(--n10)); font-size: 12px; font-weight: 600; }

  /* ---- products: одна общая таблица под карточками ---- */
  .products { background: var(--n2); border-radius: 6px; --accent: var(--sky); }
  .products-head { display: flex; align-items: center; gap: 12px; padding: 13px 14px 0; flex-wrap: wrap; min-height: 48px; }
  .products-title { font-size: 14px; font-weight: 700; color: var(--n14); }
  .products-dates { font-size: 12px; color: var(--n10); }
  .sku-host { min-height: 92px; padding: 2px 14px 10px; }
  .sku-head .sort { cursor: pointer; user-select: none; }
  .sku-head .sort:hover { color: var(--blue); }

  .sku-head, .sku-row {
    display: grid;
    grid-template-columns: 32px 38px minmax(70px,1fr) 96px 72px 70px minmax(60px,160px) 70px 94px 70px 72px 110px 80px 110px 112px;
    align-items: center; gap: 10px;
  }
  .sku-head > *, .sku-row > * { min-width: 0; }
  .sku-head { padding: 9px 0; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--n9); border-bottom: 1px solid var(--n4); }
  .sku-head .r { text-align: right; }
  .sku-row { padding: 7px 0; border-bottom: 1px solid var(--n4); }
  .sku-row:last-child { border-bottom: none; }
  .sku-total-row {
    margin: 7px 0 2px; padding: 9px 0; background: var(--n2);
    border: 0; border-radius: 6px; box-shadow: inset 0 0 0 1px var(--blue);
  }
  .sku-total-label { color: var(--blue); font-weight: 800; font-size: 13px; }
  .sku-total-symbol { color: var(--blue); font-size: 18px; font-weight: 800; text-align: center; }
  .sku-total-rate { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
  .sku-total-rate .badge { min-width: 0; }
  .sku-name .code { color: var(--n13); font-weight: 700; font-size: 13px; }
  .sku-img { width: 34px; height: 34px; object-fit: contain; border-radius: 4px; background: var(--paper); display: block; }
  .sku-num { text-align: right; font-weight: 700; font-size: 14px; color: var(--n14); }
  .sku-num.sub { font-weight: 600; font-size: 13px; color: var(--n12); }
  .sku-num.neg { color: var(--red); }
  .margin-breakdown { position: relative; display: inline-flex; justify-content: flex-end; cursor: help; outline: none; }
  .margin-breakdown.neg { color: var(--red); }
  .margin-breakdown:focus-visible { outline: 1px solid var(--blue); outline-offset: 2px; border-radius: 3px; }
  .margin-breakdown-popover {
    display: none; position: absolute; right: 0; bottom: calc(100% + 7px); z-index: 35;
    width: 300px; max-width: calc(100vw - 32px); padding: 10px 11px; background: var(--n0);
    border: 1px solid var(--n6); border-radius: 6px; color: var(--n13);
    box-shadow: 0 8px 24px color-mix(in srgb, var(--shadow) 55%, transparent); font-size: 11px; font-weight: 500; line-height: 1.35;
  }
  .margin-breakdown:hover .margin-breakdown-popover, .margin-breakdown:focus .margin-breakdown-popover { display: block; }
  .margin-breakdown-title { display: block; color: var(--n14); font-weight: 700; margin-bottom: 7px; text-align: left; }
  .margin-breakdown-row { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; padding: 3px 0; font-variant-numeric: tabular-nums; }
  .margin-breakdown-row span:first-child { color: var(--n10); text-align: left; }
  .margin-breakdown-row span:not(:first-child) { text-align: right; white-space: nowrap; }
  .margin-breakdown-head { color: var(--n9); font-size: 9px; text-transform: uppercase; letter-spacing: .03em; border-bottom: 1px solid var(--n4); margin-bottom: 2px; }
  .trend-cell {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 70px; padding: 3px 6px; border-radius: 4px;
    font-variant-numeric: tabular-nums;
  }
  .trend-cell.bad {
    color: var(--red); background: color-mix(in srgb, var(--red-strong) 20%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--red) 35%, transparent);
  }
  .trend-cell.new { color: var(--blue); font-size: 12px; }
  .trend-cell.none { color: var(--n9); }
  .sku-num.rt { display: flex; justify-content: flex-end; }
  .sku-num.bb { display: flex; justify-content: flex-end; }
  .buy-box-cell {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 55px; padding: 3px 5px; border-radius: 4px;
    font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums;
    box-sizing: border-box;
  }
  .buy-box-cell.active { color: var(--green); background: color-mix(in srgb, var(--teal-strong) 18%, transparent); }
  .buy-box-cell.missing { color: var(--red); background: color-mix(in srgb, var(--red-strong) 20%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--red) 35%, transparent); }
  .buy-box-cell.unavailable, .buy-box-period.none { color: var(--n9); }
  .buy-box-asin-head, .buy-box-asin-row { display: grid; grid-template-columns: minmax(84px, 1fr) 58px 42px 72px; gap: 6px; }
  .buy-box-asin-head { margin-top: 5px; color: var(--n10); font-size: 10px; text-transform: uppercase; letter-spacing: .03em; }
  .buy-box-asin-head span:not(:first-child), .buy-box-asin-row span:not(:first-child) { text-align: right; }
  .buy-box-asin-row { padding-top: 3px; font-variant-numeric: tabular-nums; }
  .buy-box-result.active { color: var(--green); }
  .buy-box-result.missing { color: var(--red); }
  .buy-box-result.unknown { color: var(--amber); }
  .buy-box-period { font-weight: 700; font-variant-numeric: tabular-nums; }
  .buy-box-note { margin-top: 9px; color: var(--n11); font-size: 11px; white-space: normal; }
  .rating-cell {
    display: inline-flex; align-items: center; justify-content: center; gap: 3px;
    min-width: 58px; padding: 3px 6px; border-radius: 4px;
    font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums;
  }
  .rating-cell.bad {
    color: var(--red); background: color-mix(in srgb, var(--red-strong) 20%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--red) 35%, transparent);
  }
  .rating-cell.warn {
    color: var(--amber); background: color-mix(in srgb, var(--amber-fill) 16%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--amber) 32%, transparent);
  }
  .rating-cell.ok { color: var(--n13); }
  .rating-cell.none { color: var(--n9); font-weight: 600; }
  .rating-trigger {
    position: relative; display: inline-flex; justify-content: flex-end;
    outline: none;
  }
  .rating-toggle { appearance: none; border: 0; background: none; padding: 0; color: inherit; font: inherit; cursor: pointer; }
  .rating-toggle:focus-visible { outline: 1px solid var(--blue); outline-offset: 2px; border-radius: 4px; }
  .rating-popover {
    display: none; position: absolute; right: 0; bottom: 100%; z-index: 30;
    width: max-content; min-width: 270px; max-width: min(390px, calc(100vw - 36px));
    max-height: min(360px, calc(100vh - 28px)); overflow-y: auto;
    padding: 10px; border: 1px solid var(--n7); border-radius: 6px;
    background: var(--n1); box-shadow: 0 8px 22px color-mix(in srgb, var(--shadow) 42%, transparent);
    color: var(--n13); text-align: left; font-size: 12px; font-weight: 400;
    line-height: 1.35; cursor: default;
  }
  .rating-trigger.open .rating-popover { display: block; }
  .rating-trigger.open-down .rating-popover { top: 100%; bottom: auto; }
  .rating-trigger[data-rating-kind="buy_box"] .rating-popover { position: fixed; right: auto; bottom: auto; }
  .rating-detail-title { margin-bottom: 7px; color: var(--n14); font-weight: 700; }
  .rating-country + .rating-country { margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--n5); }
  .rating-country-head { display: flex; justify-content: space-between; gap: 16px; color: var(--n13); }
  .rating-country-head span { color: var(--n12); white-space: nowrap; }
  .rating-asin-head, .rating-asin-row { display: grid; grid-template-columns: minmax(80px, 1fr) 64px 62px; gap: 8px; }
  .rating-asin-head { margin-top: 5px; color: var(--n10); font-size: 10px; text-transform: uppercase; letter-spacing: .03em; }
  .rating-asin-head span:not(:first-child), .rating-asin-row span:not(:first-child) { text-align: right; }
  .rating-asin-row { padding-top: 3px; color: var(--n12); font-variant-numeric: tabular-nums; }
  .rating-asin-link { display: inline-block; min-height: 18px; color: var(--blue); cursor: pointer; pointer-events: auto; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--blue) 45%, transparent); text-underline-offset: 2px; }
  .rating-asin-link:hover, .rating-asin-link:focus-visible { color: var(--blue); text-decoration-color: currentColor; }
  .rating-popover-empty, .rating-popover-loading { color: var(--n11); white-space: nowrap; }
  .sku-num.rr { display: flex; justify-content: flex-end; padding: 0; }
  .rr-cell {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 3px;
    min-width: 58px;
    padding: 2px 5px;
    border-radius: 4px;
    box-sizing: border-box;
  }
  .rr-cell.warn {
    color: var(--red);
    background: color-mix(in srgb, var(--red-strong) 20%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--red) 35%, transparent);
  }
  .rr-val {
    font-variant-numeric: tabular-nums;
    text-align: right;
    min-width: 38px;
  }
  .rr-tri-slot {
    width: 10px;
    flex-shrink: 0;
    text-align: center;
    line-height: 1;
  }
  .rr-tri-slot .warn-tri { margin-left: 0; }
  .rr-tri-slot .warn-tri.ph { visibility: hidden; }
  .sku-row.sku-row-warn { background: color-mix(in srgb, var(--red-strong) 10%, transparent); border-radius: 4px; }

  /* ---- per-SKU drill-down ---- */
  .sku-toggle {
    background: none; border: none; cursor: pointer; padding: 0; width: 100%;
    color: var(--blue); font-size: 10px; line-height: 1; text-align: center;
    transition: transform .15s, color .15s;
  }
  .sku-toggle:hover { color: var(--blue); }
  .sku-toggle.open { transform: rotate(90deg); color: var(--blue); }
  .sku-detail { border-bottom: 1px solid var(--n4); padding: 0 0 12px; overflow-x: auto; }
  .sku-detail-loading, .sku-detail .empty { color: var(--n11); font-size: 13px; padding: 10px 2px; }
  .sku-detail-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 10px; padding: 10px 0 4px; min-width: 0; width: 100%;
  }
  .sku-detail-grid .card { min-width: 0; }

  /* ---- margin info tooltip ---- */
  .info {
    display: inline-flex; align-items: center; justify-content: center;
    width: 13px; height: 13px; border-radius: 50%; border: 1px solid currentColor;
    font-size: 9px; font-style: normal; font-weight: 700; line-height: 1; cursor: help;
    opacity: .55; position: relative; vertical-align: middle; margin-left: 4px;
  }
  .info:hover, .info:focus { opacity: 1; outline: none; }
  .info:hover::after, .info:focus::after {
    content: attr(data-tip); position: absolute; bottom: 160%; left: 50%; transform: translateX(-50%);
    background: var(--n0); color: var(--n14); border: 1px solid var(--n6); border-radius: 5px;
    padding: 6px 9px; font-size: 11px; font-weight: 600; line-height: 1.4; width: max-content; max-width: 260px;
    white-space: pre-line; text-align: left;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--shadow) 50%, transparent); z-index: 30; pointer-events: none;
  }
  /* для значков у верхней кромки (шапка) — раскрываем тултип вниз, чтобы не обрезался */
  .info.down:hover::after, .info.down:focus::after { top: 160%; bottom: auto; left: 0; right: auto; transform: none; }

  /* ---- login overlay ---- */
  .login-overlay {
    position: fixed; inset: 0; z-index: 100; display: none;
    align-items: center; justify-content: center; background: var(--n1);
  }
  .login-overlay.on { display: flex; }
  .login-card {
    width: 320px; background: var(--n2); border: 1px solid var(--n5); border-radius: 8px;
    padding: 26px 24px; display: flex; flex-direction: column; gap: 12px;
    box-shadow: 0 18px 50px color-mix(in srgb, var(--shadow) 50%, transparent);
  }
  .login-title { font-size: 16px; font-weight: 700; color: var(--n14); text-align: center; }
  .login-sub { font-size: 12px; color: var(--n10); text-align: center; margin-top: -6px; }
  .login-input {
    background: var(--n1); border: 1px solid var(--n6); border-radius: 6px;
    color: var(--n14); font: inherit; font-size: 14px; padding: 10px 12px; width: 100%;
  }
  .login-input:focus { outline: none; border-color: var(--blue); }
  .login-btn {
    background: var(--blue-strong); border: 1px solid var(--blue); border-radius: 6px; color: var(--n14);
    font: inherit; font-size: 14px; font-weight: 700; padding: 10px 12px; cursor: pointer;
  }
  .login-btn:hover { background: var(--blue-strong); }
  .login-btn:disabled { opacity: .6; cursor: default; }
  .login-error { color: var(--red); font-size: 12px; text-align: center; min-height: 15px; }

  /* ---- admin: пользователи и история выгрузок ---- */
  .admin-btn {
    background: var(--n4); border: 1px solid var(--n7); border-radius: 6px; color: var(--n13);
    font: inherit; font-size: 12px; padding: 4px 9px; cursor: pointer; margin-left: 4px;
  }
  .admin-btn:hover { background: var(--n5); color: var(--n14); }
  .admin-overlay {
    position: fixed; inset: 0; z-index: 110; display: none;
    align-items: flex-start; justify-content: center; background: color-mix(in srgb, var(--n0) 72%, transparent);
    padding: 44px 16px; overflow-y: auto;
  }
  .admin-overlay.on { display: flex; }
  .admin-card {
    width: 900px; max-width: 100%; background: var(--n2); border: 1px solid var(--n5);
    border-radius: 8px; padding: 20px; box-shadow: 0 18px 50px color-mix(in srgb, var(--shadow) 60%, transparent); height: max-content;
  }
  .admin-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
  .admin-head span { font-size: 15px; font-weight: 700; color: var(--n14); }
  .admin-x { background: none; border: none; color: var(--n11); font-size: 18px; cursor: pointer; line-height: 1; }
  .admin-x:hover { color: var(--n14); }
  .admin-error { color: var(--red); font-size: 12px; min-height: 16px; }
  .admin-tabs { display: flex; gap: 6px; margin: 4px 0 12px; border-bottom: 1px solid var(--n5); }
  .admin-tab { background: none; border: none; border-bottom: 2px solid transparent; color: var(--n10); font: inherit; font-size: 13px; font-weight: 600; padding: 8px 10px; cursor: pointer; }
  .admin-tab:hover { color: var(--n13); }
  .admin-tab.on { color: var(--n14); border-bottom-color: var(--blue); }
  .admin-row { display: flex; align-items: center; gap: 8px; padding: 9px 0; border-top: 1px solid var(--n4); }
  .admin-row .who { flex: 1; min-width: 0; }
  .admin-row .login { font-size: 13px; color: var(--n14); font-weight: 600; }
  .admin-row .meta { font-size: 11px; color: var(--n10); margin-top: 2px; }
  .admin-badge {
    display: inline-block; font-size: 10px; font-weight: 700; color: var(--green);
    border: 1px solid var(--green-strong); border-radius: 4px; padding: 0 5px; margin-left: 6px; vertical-align: middle;
  }
  .admin-ico { background: var(--n4); border: 1px solid var(--n6); border-radius: 5px; color: var(--n13); font-size: 13px; padding: 5px 8px; cursor: pointer; }
  .admin-ico:hover { background: var(--n5); }
  .admin-ico.danger:hover { background: var(--red-tint); border-color: var(--red-strong); }
  .admin-add { margin-top: 14px; }
  .admin-add > button { width: 100%; background: var(--blue-strong); border: 1px solid var(--blue); border-radius: 6px; color: var(--n14); font: inherit; font-weight: 700; padding: 9px; cursor: pointer; }
  .admin-add > button:hover { background: var(--blue-strong); }
  .admin-form { display: flex; flex-direction: column; gap: 10px; padding-top: 6px; }
  .admin-form .login { font-size: 14px; margin-bottom: 2px; }
  .admin-form label { font-size: 12px; color: var(--n12); display: flex; align-items: center; gap: 7px; }
  .admin-form input[type=text], .admin-form input[type=password] {
    background: var(--n1); border: 1px solid var(--n6); border-radius: 6px; color: var(--n14);
    font: inherit; font-size: 13px; padding: 8px 10px; width: 100%;
  }
  .admin-form select { flex: 1; background: var(--n1); border: 1px solid var(--n6); border-radius: 6px; color: var(--n14); font: inherit; font-size: 13px; padding: 8px 10px; }
  .admin-form input:focus { outline: none; border-color: var(--blue); }
  .admin-cats { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px; max-height: 220px; overflow-y: auto; padding: 9px; border: 1px solid var(--n4); border-radius: 6px; }
  .admin-cats.off { opacity: .35; pointer-events: none; }
  .admin-form-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 4px; }
  .admin-form-actions button { border-radius: 6px; font: inherit; font-size: 13px; font-weight: 600; padding: 8px 14px; cursor: pointer; }
  .btn-save { background: var(--blue-strong); border: 1px solid var(--blue); color: var(--n14); }
  .btn-save:hover { background: var(--blue-strong); }
  .btn-cancel { background: var(--n4); border: 1px solid var(--n7); color: var(--n13); }
  .btn-cancel:hover { background: var(--n5); }
  .history-empty { color: var(--n10); font-size: 13px; padding: 24px 0; text-align: center; }
  .history-list { display: flex; flex-direction: column; gap: 7px; }
  .history-run { display: grid; grid-template-columns: 150px 105px 1fr auto; gap: 12px; align-items: center; background: var(--n2); border: 1px solid var(--n5); border-radius: 7px; color: inherit; font: inherit; padding: 10px 12px; text-align: left; cursor: pointer; }
  .history-run:hover { border-color: var(--blue); background: var(--n3); }
  .history-time { font-size: 12px; color: var(--n13); }
  .history-time small { display: block; color: var(--n9); margin-top: 2px; }
  .history-status { display: inline-flex; width: max-content; border: 1px solid var(--n7); border-radius: 10px; padding: 2px 7px; font-size: 10px; font-weight: 700; text-transform: uppercase; }
  .history-status.success, .history-status.ok, .history-status.loaded { color: var(--green); border-color: var(--green-strong); }
  .history-status.warning { color: var(--amber); border-color: var(--amber); }
  .history-status.failed, .history-status.fail { color: var(--red); border-color: var(--red-strong); }
  .history-status.running, .history-status.skip, .history-status.skipped, .history-status.unchanged { color: var(--blue); border-color: var(--blue-strong); }
  .history-summary { min-width: 0; font-size: 12px; color: var(--n12); }
  .history-summary strong { color: var(--n14); }
  .history-summary small { display: block; color: var(--n9); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .history-open { color: var(--blue); font-size: 18px; }
  .history-back { background: none; border: none; color: var(--blue); font: inherit; font-size: 12px; padding: 0 0 10px; cursor: pointer; }
  .history-back:hover { color: var(--n13); }
  .history-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
  .history-detail-title { color: var(--n14); font-size: 14px; font-weight: 700; }
  .history-detail-meta { color: var(--n10); font-size: 11px; margin-top: 4px; }
  .history-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(125px,1fr)); gap: 7px; margin: 10px 0 14px; }
  .history-kpi { background: var(--n1); border: 1px solid var(--n5); border-radius: 6px; padding: 9px; min-width: 0; }
  .history-kpi span { display: block; color: var(--n9); font-size: 10px; margin-bottom: 4px; }
  .history-kpi strong { color: var(--n14); font-size: 13px; overflow-wrap: anywhere; }
  .history-section { margin-top: 14px; }
  .history-section h3 { color: var(--n12); font-size: 12px; margin: 0 0 7px; }
  .history-table-wrap { overflow-x: auto; border: 1px solid var(--n5); border-radius: 6px; }
  .history-table { width: 100%; border-collapse: collapse; font-size: 11px; }
  .history-table th { color: var(--n9); font-weight: 600; text-align: right; padding: 7px 8px; border-bottom: 1px solid var(--n5); white-space: nowrap; }
  .history-table th:first-child, .history-table td:first-child { text-align: left; }
  .history-table td { color: var(--n12); text-align: right; padding: 7px 8px; border-top: 1px solid var(--n4); white-space: nowrap; }
  .history-table .pos { color: var(--green); }
  .history-table .neg { color: var(--red); }
  .history-meta-table td:nth-child(2) { text-align: left; white-space: normal; overflow-wrap: anywhere; }
  .history-table tr.core-fail td { background: color-mix(in srgb, var(--red-strong) 13%, transparent); color: var(--red); }
  .history-table tr.core-fail td:first-child { font-weight: 700; }
  .history-note { background: var(--n1); border: 1px solid var(--n5); border-radius: 6px; color: var(--n11); font-size: 11px; line-height: 1.45; padding: 9px; overflow-wrap: anywhere; }

  /* ---- custom period popup ---- */
  .period-overlay {
    position: fixed; inset: 0; z-index: 105; display: none;
    align-items: center; justify-content: center; background: color-mix(in srgb, var(--n0) 72%, transparent);
    padding: 16px;
  }
  .period-overlay.on { display: flex; }
  .period-card {
    width: 620px; max-width: 100%; background: var(--n2); border: 1px solid var(--n5);
    border-radius: 8px; padding: 20px; box-shadow: 0 18px 50px color-mix(in srgb, var(--shadow) 60%, transparent);
  }
  .period-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
  .period-head span { font-size: 15px; font-weight: 700; color: var(--n14); }
  .period-x { background: none; border: none; color: var(--n11); font-size: 18px; cursor: pointer; line-height: 1; }
  .period-x:hover { color: var(--n14); }
  .period-error { color: var(--red); font-size: 12px; min-height: 16px; margin-bottom: 8px; }
  .period-hint { font-size: 12px; color: var(--n10); margin-bottom: 14px; line-height: 1.4; }
  .period-calendars { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 14px; }
  .period-cal-block { background: var(--n2); border: 1px solid var(--n4); border-radius: 8px; padding: 12px; }
  .period-cal-block.cur { --cal-accent: var(--sky); }
  .period-cal-block.prev { --cal-accent: var(--orange); }
  .period-section-title { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--n10); margin-bottom: 6px; }
  .period-cal-summary { font-size: 13px; font-weight: 600; color: var(--n14); min-height: 18px; margin-bottom: 10px; }
  .cal-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
  .cal-nav-btn {
    background: var(--n4); border: 1px solid var(--n6); border-radius: 5px; color: var(--n13);
    width: 28px; height: 28px; cursor: pointer; font-size: 16px; line-height: 1; padding: 0;
  }
  .cal-nav-btn:hover { background: var(--n5); border-color: var(--cal-accent, var(--blue)); color: var(--n14); }
  .cal-month { font-size: 13px; font-weight: 700; color: var(--n14); }
  .cal-weekdays, .cal-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
  .cal-weekdays { margin-bottom: 4px; }
  .cal-weekdays span { font-size: 10px; font-weight: 600; color: var(--n8); text-align: center; padding: 2px 0; }
  .cal-day {
    aspect-ratio: 1; border: none; border-radius: 4px; background: transparent;
    color: var(--n13); font: inherit; font-size: 12px; cursor: pointer; padding: 0;
    position: relative; z-index: 1;
  }
  .cal-day:hover:not(.empty) { background: var(--n4); color: var(--n14); }
  .cal-day.empty { pointer-events: none; }
  .cal-day.today { font-weight: 700; color: var(--cal-accent, var(--blue)); }
  .cal-day.in-range { background: color-mix(in srgb, var(--cal-accent, var(--sky-fill)) 22%, var(--n2)); border-radius: 0; }
  .cal-day.start, .cal-day.end { background: var(--cal-accent, var(--sky-fill)); color: var(--on-fill); font-weight: 700; }
  .cal-day.start { border-radius: 4px 0 0 4px; }
  .cal-day.end { border-radius: 0 4px 4px 0; }
  .cal-day.start.end { border-radius: 4px; }
  .cal-day.pending { outline: 1px dashed var(--cal-accent, var(--sky)); outline-offset: -1px; }
  .period-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 4px; }
  .period-actions button { border-radius: 6px; font: inherit; font-size: 13px; font-weight: 600; padding: 8px 14px; cursor: pointer; }
  .period-clear { margin-right: auto; background: none; border: none; color: var(--n10); font: inherit; font-size: 12px; cursor: pointer; padding: 8px 0; }
  .period-clear:hover { color: var(--n13); text-decoration: underline; }
  .period-trigger .ms-value { max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  @media (max-width: 680px) {
    .period-calendars { grid-template-columns: 1fr; }
  }

  @media (max-width: 1300px) {
    .filter-divider { display: none; }
    .filter-scope-products { flex-basis: 100%; }
  }
  @media (max-width: 1100px) {
    .cards-row, .sku-detail-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
  }
  @media (max-width: 760px) {
    .filter-panel { position: static; }
    .filter-toolbar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .filter-scope { display: contents; }
    .filter-scope-label { grid-column: 1 / -1; margin-top: 0; }
    .filter-scope-products .filter-scope-label { margin-top: 6px; }
    .filters { display: contents; }
    .filter-slot, .sku-country-slot, .filter-slot .ms, .sku-country-slot .ms { width: 100%; }
    .filter-slot .ms-trigger, .sku-country-slot .ms-trigger, .filters .ms-trigger { width: 100%; }
    #marketplaceSlot { grid-column: 1 / -1; }
    .filter-summary-label { display: none; }
    .active-filter-chip { max-width: 230px; }
  }
  @media (max-width: 640px) {
    .cards-row, .sku-detail-grid { grid-template-columns: minmax(0, 1fr); }
  }
  @media (max-width: 600px) {
    .history-run { grid-template-columns: 1fr auto; }
    .history-run .history-status { justify-self: end; }
    .history-summary { grid-column: 1 / -1; }
    .history-open { display: none; }
    .history-kpis { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .products-head { align-items: center; flex-wrap: wrap; }
    .products-dates { flex-basis: 100%; }
    .sku-host { overflow-x: auto; }
    .sku-head, .sku-row { min-width: 430px; grid-template-columns: 18px 24px minmax(58px,1fr) 44px 38px 57px 52px 65px; gap: 4px; }
    .sku-num { font-size: 12px; }
    .trend-cell { min-width: 0; padding: 3px 4px; }
    .sku-num.b, .sku-head .b, .sku-num.u, .sku-head .u, .sku-num.rf, .sku-head .rf, .sku-num.rr, .sku-head .rr, .sku-num.rev, .sku-head .sort[data-sort="revenue"], .sku-num.avg, .sku-head .sort[data-sort="avg_price"], .sku-num.mr, .sku-head .mr { display: none; }
    .buy-box-cell { min-width: 0; padding: 2px 3px; }
    .sku-num.bb .rating-popover { position: fixed; z-index: 60; left: 12px; right: 12px; top: 15vh; bottom: auto; width: auto; min-width: 0; max-width: none; max-height: 70vh; overflow: auto; }
  }
  @media (max-width: 460px) {
    body { padding: 10px; }
    .app-header { align-items: stretch; flex-direction: column; }
    .user-chip { align-self: flex-start; max-width: 100%; }
    .module-nav { width: 100%; }
    .filter-toolbar { grid-template-columns: minmax(0, 1fr); }
    .filter-scope-label, #marketplaceSlot { grid-column: auto; }
    .filter-summary { padding-left: 10px; padding-right: 10px; }
    .filter-reset { font-size: 11px; }
  }

  .rating-cell.seo { color: var(--blue); background: color-mix(in srgb, var(--blue-strong) 12%, transparent); border: 1px solid var(--blue-strong); }
  .seo-rating-note { margin-top: 8px; max-width: 280px; font-size: 11px; color: var(--n11); white-space: normal; }
  @media (max-width: 600px) {
    .sku-name { font-size: 12px; }
    .rating-cell { min-width: 0; padding: 2px 4px; white-space: nowrap; }
    .sku-num.seo .rating-popover { position: fixed; z-index: 60; left: 12px; right: 12px; top: 15vh; bottom: auto; width: auto; min-width: 0; max-width: none; max-height: 70vh; overflow: auto; }
  }

  /* ---- TV mode ---- */
  .tv-mode-enter, .tv-mode-button {
    border: 1px solid var(--teal); border-radius: 7px; background: var(--n6); color: var(--n14);
    padding: 8px 13px; font: inherit; font-size: 13px; font-weight: 750; cursor: pointer;
  }
  .tv-mode-enter { margin-left: auto; flex: 0 0 auto; }
  .tv-mode-enter:hover, .tv-mode-button:hover { border-color: var(--teal); background: var(--teal-tint); }
  .tv-mode-enter:focus-visible, .tv-mode-button:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
  .tv-mode-actions { display: flex; justify-content: flex-end; gap: 8px; flex: 0 0 auto; }
  .tv-mode-actions[hidden] { display: none; }
  .tv-mode-button:disabled { cursor: not-allowed; opacity: .55; }
  .tv-mode-exit { border-color: var(--n7); background: var(--n4); color: var(--n13); }

  body.tv-mode {
    width: 100vw; height: 100vh; overflow: hidden;
    padding: clamp(8px, 1vw, 18px); background: var(--n1);
  }
  body.tv-mode .dashboard { width: 100%; max-width: none; height: 100%; gap: clamp(6px, .7vw, 12px); }
  body.tv-mode .dashboard > :not(#cardsRow):not(#tvModeActions) { display: none !important; }
  body.tv-mode > .login-overlay,
  body.tv-mode > .admin-overlay,
  body.tv-mode > .period-overlay { display: none !important; }
  body.tv-mode #cardsRow {
    flex: 1 1 auto; min-height: 0; height: auto;
    grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(8px, .8vw, 16px);
  }
  body.tv-mode #cardsRow > .card { height: 100%; min-height: 0; border-radius: 9px; pointer-events: none; outline: none; }
  body.tv-mode #cardsRow > .card[data-period="custom"],
  body.tv-mode #cardsRow > .card[data-period="last_month"] { display: none !important; }
  body.tv-mode .card-header { padding: clamp(10px, 1vh, 18px) clamp(12px, 1vw, 20px); }
  body.tv-mode .card-header .title { font-size: clamp(18px, 1.35vw, 27px); margin-bottom: clamp(7px, .7vh, 12px); }
  body.tv-mode .card-dates { gap: clamp(3px, .4vh, 7px); }
  body.tv-mode .dlab { min-width: clamp(72px, 4.6vw, 90px); font-size: clamp(12px, .8vw, 16px); }
  body.tv-mode .dval { font-size: clamp(12px, .88vw, 18px); }
  body.tv-mode .card-body { padding: 0 clamp(12px, 1vw, 20px); }
  body.tv-mode .metric { gap: 3px clamp(6px, .5vw, 10px); padding: clamp(5px, .6vh, 10px) 0; }
  body.tv-mode .metric-label { font-size: clamp(13px, .9vw, 18px); }
  body.tv-mode .metric-value { font-size: clamp(21px, 1.55vw, 31px); }
  body.tv-mode .metric-prev { display: none; }
  body.tv-mode .badge { min-width: clamp(48px, 3.4vw, 68px); font-size: clamp(11px, .73vw, 15px); }
  body.tv-mode .blocks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.tv-mode .block { padding: clamp(6px, .5vw, 10px); }
  body.tv-mode .block-title { font-size: clamp(13px, .95vw, 19px); margin-bottom: 3px; }
  body.tv-mode .block-row { grid-template-columns: minmax(0, 1fr) auto; gap: 0 clamp(4px, .35vw, 7px); margin-bottom: 0; }
  body.tv-mode .bl-label { grid-column: 1; grid-row: 1; font-size: clamp(12px, .78vw, 16px); }
  body.tv-mode .bl-val { grid-column: 1 / -1; grid-row: 2; text-align: left; font-size: clamp(16px, 1.1vw, 22px); }
  body.tv-mode .block-row .badge { grid-column: 2; grid-row: 1; min-width: clamp(44px, 3.1vw, 62px); font-size: clamp(11px, .72vw, 14px); }
  body.tv-mode .forecast-note { font-size: clamp(12px, .78vw, 16px); padding: clamp(7px, .8vh, 12px); }
  @media (max-height: 850px) {
    body.tv-mode .card-header { padding-top: 8px; padding-bottom: 8px; }
    body.tv-mode .metric { padding: 1px 0; }
    body.tv-mode .block { padding: 5px 7px; }
    body.tv-mode .forecast-note { padding: 4px 8px; }
  }
  @media (max-height: 740px) {
    body.tv-mode .card-header { padding-top: 6px; padding-bottom: 6px; }
    body.tv-mode .metric-value { font-size: 18px; }
    body.tv-mode .block { padding: 3px 7px; }
    body.tv-mode .block-title { font-size: 12px; }
    body.tv-mode .bl-label { font-size: 11px; }
    body.tv-mode .bl-val { font-size: 15px; }
    body.tv-mode .forecast-note { padding: 2px 8px; }
  }
  /* ---- end TV mode ---- */

/* Account without dashboard sections (for example only SEO MCP). */
body.no-sections-mode #filterPanel, body.no-sections-mode #cardsRow, body.no-sections-mode #products, body.no-sections-mode .topbar { display: none !important; }
#noSections[hidden] { display: none !important; }
.no-sections { max-width: 560px; margin: 72px auto; padding: 0 16px; text-align: center; color: var(--n11); }
.no-sections h2 { margin: 0 0 8px; color: var(--n14); font-size: 18px; font-weight: 650; }
.no-sections p { margin: 0; font-size: 13px; line-height: 1.6; }