/*
 * Wochencheck layout. Colours and type come from ui.css tokens, so light and dark stay in step.
 */
.woche-bars { list-style: none; margin: var(--s-4) 0; padding: 0; display: grid; gap: var(--s-3); }
.woche-bar { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr) 3rem auto; gap: var(--s-3); align-items: center; }
.woche-bar__name { font-weight: 600; }
.woche-bar__n { font-variant-numeric: tabular-nums; text-align: end; }
.woche-bar__d { color: var(--muted); font-size: var(--fs-14); }
.woche-sentence { font-size: var(--fs-18); }
.board a.board__focus { display: flex; align-items: center; min-height: var(--touch); padding: var(--s-2) var(--s-5) var(--s-4); color: var(--board-text); font-size: var(--fs-14); text-decoration: underline; text-underline-offset: 0.18em; }
.board a.board__focus:hover { color: var(--board-time); }
.board a.board__focus:focus-visible { outline: var(--focus-w) solid var(--signal); outline-offset: 2px; }

@media (max-width: 720px) {
  .woche-bar { grid-template-columns: 1fr auto; }
  .woche-bar .skill__bar { grid-column: 1 / -1; grid-row: 2; }
}