/* Досье преподавателя: лёгкая карточка поверх экрана. Нативный <dialog> —
   модальность и Escape от браузера, клик мимо закрывает сам диалог. */

.who {
  width: min(460px, calc(100vw - 2 * var(--gutter)));
  max-height: min(80dvh, 620px);
  margin: auto;
  padding: 0;
  border: 0;
  border-radius: var(--r-xl);
  background: transparent;
  overflow: visible;
}
.who:not([open]) { display: none; }
.who::backdrop {
  background: color-mix(in srgb, var(--bg) 55%, transparent);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

/* Карточка отдельным слоем внутри диалога: клик по самому диалогу — это уже
   клик мимо, и без внутренней коробки его не отличить от клика по содержимому. */
.who-card {
  display: grid;
  gap: var(--s-4);
  max-height: min(80dvh, 620px);
  overflow-y: auto;
  padding: var(--s-5);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  background: var(--surface-raised);
  box-shadow: var(--shadow-md);
  color: var(--text);
}
.who-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--s-3);
}
.who-card__top .panel__label { margin-bottom: var(--s-1); }
.who-card__name {
  font-family: var(--font-display);
  font-size: var(--fs-24);
  font-weight: 700;
  letter-spacing: -0.02em;
}
/* Тело — свой грид: без него шаг между блоками держался бы только полями
   абзацев, и список фактов слипался бы со строкой про последнюю пару. */
.who-card__body { display: grid; gap: var(--s-4); }
.who-card__tags { display: flex; flex-wrap: wrap; gap: var(--s-2); }

.who-card__facts {
  display: grid;
  gap: var(--s-3);
  margin: 0;
  padding: 0;
  list-style: none;
}
.who-card__fact {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--s-3);
  align-items: start;
  color: var(--text-2);
  font-size: var(--fs-14);
  line-height: 1.6;
}
.who-card__icon {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: var(--r-sm);
  background: var(--surface-2);
  color: var(--accent-text);
}
.who-card__icon svg { width: 15px; height: 15px; }

.who-card__last { color: var(--text-2); font-size: var(--fs-14); line-height: 1.6; }

/* His own words and the terms he repeats (real notes only). */
.who-card__rules { display: grid; gap: var(--s-2); }
.who-card__sub { color: var(--text-3); font-size: var(--fs-12); font-weight: 600; }
.who-card__quote {
  display: grid;
  gap: var(--s-2);
  margin: 0;
  padding: var(--s-3) var(--s-4);
  border-left: 2px solid var(--accent-text);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
  background: var(--surface-2);
  color: var(--text);
  font-size: var(--fs-14);
  line-height: 1.55;
}
.who-card__src {
  justify-self: start;
  padding: 0;
  border: 0;
  background: none;
  color: var(--accent-text);
  font-size: var(--fs-12);
  font-weight: 600;
  cursor: pointer;
}
.who-card__src:hover { text-decoration: underline; }
.who-card__thin {
  padding: var(--s-4);
  border: 1px dashed var(--border-strong);
  border-radius: var(--r-md);
  color: var(--text-2);
  font-size: var(--fs-14);
  line-height: 1.6;
}
.who-card__honest {
  color: var(--text-3);
  font-size: var(--fs-12);
  line-height: 1.6;
}

/* ---------- Кликабельное имя ---------- */
/* Переход по сайту (предмет, преподаватель, связанный конспект, «домашка» на главной) — тонкое ровное
   подчёркивание текста. Пунктир рамкой (border-bottom) лежал криво: рваные штрихи, отступ от букв гулял (Max 19.10).
   Лаймовый маркер Влада не взят: у нас он значит «термин — нажми, объясню», а ссылка уводит на другой экран; одинаковыми
   их делать нельзя. Второй способ показать «это можно нажать» не заводим. */
.who-link,
.db-hello__hw {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--border-strong);
  text-decoration-color: color-mix(in srgb, currentColor 38%, transparent);
  text-underline-offset: 0.24em;
  text-decoration-skip-ink: auto;
  /* Кнопка центрирует текст по умолчанию — длинная ссылка на две строки вставала по центру. */
  text-align: start;
  cursor: pointer;
  transition: text-decoration-color var(--dur-micro) var(--ease-out);
}
.who-link:hover,
.who-link:focus-visible,
.db-hello__hw:hover,
.db-hello__hw:focus-visible {
  text-decoration-color: currentColor;
}

/* A subject name inside a card that is a link as a whole sits above the card's stretched link. */
[data-subject-open] { position: relative; z-index: 1; }

/* На бумаге кликать некуда, а подчёркнутая фамилия читается как пометка. */
@media print {
  .who-link { text-decoration: none; }
}