/* Тибетский календарь и энергия Ла.

   Как и остальные новые блоки, файл собран на токенах, которые есть во всех
   трёх темах проекта: --panel, --panel2, --brd, --brd2, --head, --txt,
   --muted, --gold, --aura, --jade. Переназначение на границе листа
   справочника — в конце файла. */

/* ---------- тибетский год ---------- */

.tib-year { padding: 18px 20px; margin: 0 0 1.4rem; }
.tib-year-cap {
  display: block; font-size: 10px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--muted); font-weight: 700;
  margin-bottom: 6px;
}
.tib-year b {
  display: block; font-size: 25px; font-weight: 700; color: var(--head);
  line-height: 1.15;
}
.tib-year-sub {
  display: block; font-size: 12.5px; color: var(--gold); font-weight: 650;
  margin: 3px 0 12px; font-variant-numeric: tabular-nums;
}
.tib-year p { margin: 0 0 .5rem; font-size: 14px; line-height: 1.6; }
.tib-year p:last-child { margin-bottom: 0; }

/* ---------- энергия Ла на сегодня ---------- */

.tib-la {
  display: grid; grid-template-columns: 132px minmax(0, 1fr);
  gap: 18px; align-items: start;
  padding: 16px 18px; margin: 0 0 1.2rem;
  border: 1px solid var(--brd); border-radius: 16px; background: var(--panel);
}
.tib-la-score {
  text-align: center; padding: 12px 8px;
  border: 1px solid var(--brd2); border-radius: 14px;
  background: var(--panel2);
}
.tib-la-score b {
  display: block; font-size: 32px; font-weight: 750; color: var(--head);
  line-height: 1; font-variant-numeric: tabular-nums;
}
.tib-la-score span {
  display: block; margin-top: 5px; font-size: 12px; font-weight: 650;
  color: var(--gold);
}
.tib-la-text p { margin: 0 0 .55rem; font-size: 14px; line-height: 1.6; }
.tib-la-text p:last-child { margin-bottom: 0; }

/* ---------- неделя вперёд ---------- */

.tib-week {
  display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px; margin: 0 0 .8rem;
}
.tib-day {
  padding: 9px 6px 10px; text-align: center;
  border: 1px solid var(--brd); border-radius: 12px; background: var(--panel2);
  display: flex; flex-direction: column; gap: 3px;
}
.tib-day.now { border-color: var(--gold); }
.tib-day-dow {
  font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--muted); font-weight: 700;
}
.tib-day b {
  font-size: 12px; font-weight: 650; color: var(--head);
  font-variant-numeric: tabular-nums;
}
.tib-day-score {
  font-size: 16px; font-weight: 750; color: var(--head);
  font-variant-numeric: tabular-nums; line-height: 1.1;
}
.tib-day-name {
  font-size: 9.5px; line-height: 1.25; color: var(--muted); font-weight: 600;
}
.tib-day-bar {
  display: block; height: 4px; border-radius: 999px;
  background: var(--brd); overflow: hidden; margin: 2px 0 1px;
}
.tib-day-bar > i { display: block; height: 100%; border-radius: 999px; }
/* Цвет по состоянию, а не по числу: пять исходов, и у каждого свой смысл.
   Классы совпадают с ключами в core/seo/tibet.OTNOSHENIYA. */
.tib-day-bar.feeds > i { background: #4FBFA8; }
.tib-day-bar.same > i { background: var(--gold); }
.tib-day-bar.overcomes > i { background: #C79A3A; }
.tib-day-bar.drains > i { background: #B4864A; }
.tib-day-bar.presses > i { background: #B4564A; }

@media (max-width: 620px) {
  .tib-la { grid-template-columns: minmax(0, 1fr); }
  /* Семь колонок на 390 px дают клетки по 47 px — числа в них не влезают.
     Четыре в ряд читаются, а порядок дней при этом сохраняется. */
  .tib-week { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .tib-day-name { display: none; }
}

/* ---------- пять сил списком ---------- */

.tib-sily { display: grid; gap: 12px; margin: 0; }
.tib-sila {
  padding: 15px 17px;
  border: 1px solid var(--brd); border-radius: 14px; background: var(--panel);
}
.tib-sila-head {
  display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap;
  margin-bottom: .5rem;
}
.tib-sila-head b { font-size: 17px; font-weight: 700; color: var(--head); }
.tib-sila-head span { font-size: 12.5px; color: var(--muted); }
.tib-sila-head em {
  font-style: normal; font-size: 11px; font-weight: 700;
  padding: 3px 9px; border-radius: 999px;
  border: 1px solid var(--brd2); background: var(--panel2); color: var(--gold);
}
.tib-sila p { margin: 0 0 .5rem; font-size: 14px; line-height: 1.62; }
.tib-sila p:last-child { margin-bottom: 0; }

/* Сила, которую мы считаем, выделена: остальные четыре только описаны, и
   человек должен видеть разницу, а не искать её в тексте. */
.tib-sila.counted { border-color: var(--gold); }

/* ---------- внутри листа справочника ---------- */
.layout .tib-year,
.layout .tib-la,
.layout .tib-week,
.layout .tib-sily {
  --panel: var(--paper-raised);
  --panel2: var(--paper);
  --brd: var(--rule);
  --brd2: var(--rule-strong);
  --head: var(--ink);
  --txt: var(--ink);
  --muted: var(--ink-soft);
  --gold: var(--gold-ink);
}