/* Правки вида раздела «Списания» — 10.09.2026 (заметки Раиля).
   Файл подключается после общих стилей и перекрывает их только для своего раздела.
   Все классы здесь начинаются с wo- и ставятся только модулем writeoffs.js,
   поэтому другие разделы эти правила не задевают. Только токены. */

/* ── «По дням»: график на две трети ширины, таблица «День | Сумма» на треть ──
   Раиль: «списание по дням — две трети, по дням — одну треть, потому что там
   два столбца: день и сумма». Два класса сильнее общего .half-grid, поэтому
   узкий экран ниже переопределяется своим медиаблоком. */
.half-grid.wo-2to1{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}

/* ── Окно прокрутки, которое тянется ровно до высоты соседа по ряду ─────────
   «Худшие дни» рядом с «Топ причин» и таблица «По дням» рядом с графиком:
   своя высота у окна нулевая (flex-basis 0), поэтому ряд задаёт сосед, а
   окно занимает остаток блока под шапкой и листается внутри. Верх и низ
   парных блоков совпадают (правило «парные блоки одной высоты», S34). */
.half-grid .tblock>.wo-fill{
  flex:1 1 0;height:0;min-height:0;max-height:none;
  overflow-y:auto;overscroll-behavior:contain;
}
/* Липкая шапка таблицы внутри окна — непрозрачная и выше строк. */
.wo-fill>.tbl thead th{position:sticky;top:0;z-index:6;background:var(--surface-head,var(--surface-3))}

/* ── Графики раздела в парных рядах — высота числом ─────────────────────────
   Общее правило пары растягивает график (height:auto; flex:1 1 auto). Холст,
   созданный уже на странице, при такой высоте берёт свои пропорции 2:1 и
   раздувает ряд: «По дням» вырастал до 435–1074 px, график «по месяцам» —
   после переключения «3 · 6 · 9 · 12 мес.». Высота числом это исключает.
   «Сводка», ряд «Норматив | Списания по месяцам»: график задавал ряду
   252 px, и блок норматива рядом был наполовину пустым (146 px белого).
   Компактный график — 136 px: ряд 192 px вместо 252, воздух в блоке норматива
   делится поровну сверху и снизу (по ~20 px). */
.half-grid .tblock>.tblock-body:last-child>.chart-wrap.wo-chart-c{flex:0 0 auto;height:136px;min-height:0}
/* «По дням»: прежняя высота графика раздела — 196 px. */
.half-grid .tblock>.tblock-body:last-child>.chart-wrap.wo-chart-d{flex:0 0 auto;height:196px;min-height:0}

/* Блок норматива: сумма и уровень — строкой, под ней шкала. Содержимое по
   центру блока, чтобы оставшийся воздух делился поровну сверху и снизу. */
.tblock-body.wo-norm{
  display:flex;flex-direction:column;justify-content:center;gap:12px;
  padding:12px 14px;
}
.wo-norm-top{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.wo-norm-sum{
  font-size:18px;font-weight:680;letter-spacing:-.015em;white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
/* Подпись уровня читается с проектора: основной вторичный тон, не бледный. */
.wo-norm-lvl{font-size:12px;font-weight:520;color:var(--text-2)}
/* Метка «сейчас» — прямо над маркером, а не отдельной плашкой у края:
   так видно, к какой точке шкалы она относится. */
.wo-norm-scale{position:relative;padding-top:16px}
.wo-norm-now{
  position:absolute;top:0;transform:translateX(-50%);
  font-size:10.5px;font-weight:700;line-height:13px;white-space:nowrap;
}
.wo-norm-ticks{
  position:relative;height:14px;margin-top:6px;
  font-size:10.5px;line-height:14px;color:var(--text-2);
  font-variant-numeric:tabular-nums;
}
.wo-norm-ticks>span{position:absolute;top:0;white-space:nowrap}
/* Названия зон под порогами — те же слова, что в плашке «Сумма списаний». */
.wo-norm-zones{display:flex;margin-top:3px;font-size:10.5px;line-height:13px;color:var(--text-2)}
.wo-norm-zones>span{flex:0 0 auto;text-align:center;white-space:nowrap;overflow:hidden}

/* ── Узкий экран: пары встают друг под другом ──────────────────────────────
   Правила для телефона стоят ПОСЛЕ базовых: при равной силе побеждает
   последнее (ловушка 09.09). Окно прокрутки без соседа получает свою высоту,
   иначе оно схлопнулось бы до шапки. */
@media (max-width:1080px){
  .half-grid.wo-2to1{grid-template-columns:1fr}
  .half-grid .tblock>.wo-fill{flex:0 0 auto;height:auto;max-height:240px}
}
@media (max-width:560px){
  .wo-norm-zones{font-size:10px}
}
