/* Preparation, reviewed reports and family reading share a calm visual scale. */
.teaching-report {
  color: var(--ink, var(--text, #f1ede5));
  font-size: 14px;
  line-height: 1.75;
  overflow-wrap: anywhere;
  min-width: 0;
}
.tr-headline { padding: 4px 0 20px; }
.tr-headline h2 {
  font-size: clamp(23px, 2.6vw, 32px);
  font-weight: 650;
  letter-spacing: -.035em;
  line-height: 1.35;
  margin: 9px 0 12px;
  font-variant-numeric: tabular-nums;
}
.tr-headline p, .tr-caption {
  color: var(--muted, #aaa69c);
  font-size: 12px;
  line-height: 1.75;
}
.tr-eyebrow { color: var(--brand-ink, var(--gold, #cda65f)); font-size: 12px; font-weight: 600; letter-spacing: .045em; }
.tr-panel {
  padding: 22px;
  border: 1px solid var(--line, rgba(255,255,255,.12));
  border-radius: 22px;
  background: linear-gradient(135deg, var(--shine, rgba(255,255,255,.055)), transparent 42%), var(--paper, rgba(255,255,255,.018));
  box-shadow: inset 0 1px var(--rim, rgba(255,255,255,.08));
  margin: 16px 0;
  min-width: 0;
}
.tr-panel h4 { font-size: 15px; font-weight: 650; line-height: 1.5; margin: 0 0 11px; }
.tr-panel p { margin: 9px 0; }
.tr-panel summary { cursor: pointer; font-weight: 600; min-height: 28px; line-height: 1.7; }
.tr-panel[open] > summary { padding-bottom: 14px; margin-bottom: 8px; border-bottom: 1px solid var(--line, rgba(255,255,255,.1)); }
.tr-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-bottom: 12px;
  border: 1px solid var(--line2, rgba(205,166,95,.25));
  border-radius: 10px;
  background: var(--brand-soft, rgba(205,166,95,.07));
  color: var(--brand-ink, var(--gold, #cda65f));
  font-size: 12px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.tr-stats { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; margin: 8px 0 24px; }
.tr-stats > div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  min-height: 119px;
  padding: 22px 19px 18px;
  border: 1px solid var(--line2, rgba(205,166,95,.22));
  border-radius: 20px;
  background: linear-gradient(145deg, var(--brand-soft, rgba(205,166,95,.06)), transparent 72%), var(--paper, rgba(255,255,255,.02));
  box-shadow: inset 0 1px var(--rim, rgba(255,255,255,.06));
}
.tr-stats b {
  display: block;
  color: var(--brand-ink, var(--gold, #cda65f));
  font-size: clamp(25px, 2.6vw, 34px);
  font-weight: 650;
  letter-spacing: -.035em;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.tr-stats span { display: block; font-size: 11px; margin-top: 15px; line-height: 1.6; color: var(--muted, #aaa69c); }
.tr-field { display: block; font-size: 13px; font-weight: 600; margin: 20px 0; min-width: 0; }
.tr-field .input { display: block; width: 100%; margin-top: 9px; font-weight: 400; resize: vertical; min-width: 0; max-width: 100%; line-height: 1.8; }
.tr-field textarea { padding: 14px 16px; }
.tr-caption { margin: 14px 0; }
.tr-toolbar, .tr-evidence-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: 18px 0 4px; }
.tr-toolbar label { display: flex; align-items: center; gap: 9px; min-width: 0; }
.tr-toolbar select { width: auto !important; }
.tr-evidence-actions .btn { min-height: 38px; white-space: normal; text-align: left; }
.tr-report-list { display: grid; gap: 12px; min-width: 0; }
.tr-report-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  width: 100%;
  align-items: center;
  gap: 20px;
  padding: 22px 24px;
  border-radius: 20px;
  border: 1px solid var(--line, rgba(255,255,255,.12));
  background: linear-gradient(125deg, var(--shine, rgba(255,255,255,.04)), transparent 65%), var(--paper, rgba(255,255,255,.01));
  box-shadow: inset 0 1px var(--rim, rgba(255,255,255,.07));
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition: border-color .18s, background .18s;
}
.tr-report-row > span:first-child { min-width: 0; }
.tr-report-row b { font-size: 15px; font-weight: 650; font-variant-numeric: tabular-nums; }
.tr-report-row small { display: block; color: var(--muted, #aaa69c); font-size: 12px; margin-top: 7px; }
.tr-report-row > span:last-child { color: var(--brand-ink, var(--gold, #cda65f)); font-size: 12px; white-space: nowrap; }
.tr-notice {
  border: 1px solid var(--line2, rgba(205,166,95,.3));
  border-inline-start: 3px solid var(--brand, #cda65f);
  border-radius: 14px;
  background: var(--brand-soft, rgba(205,166,95,.055));
  padding: 14px 17px;
  margin: 16px 0;
  color: var(--brand-ink, var(--gold, #d7b975));
  font-size: 13px;
  line-height: 1.8;
}
.tr-evidence { font-size: 12px; max-height: 310px; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.tr-breakdown { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: baseline; gap: 20px; padding: 13px 3px; border-bottom: 1px solid var(--line, rgba(255,255,255,.09)); }
.tr-breakdown > span { min-width: 0; color: var(--muted, #aaa69c); font-size: 13px; }
.tr-breakdown > b { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; color: var(--ink, var(--text, #f1ede5)); }
.tr-evidence > p { padding: 9px 0; margin: 0; border-bottom: 1px solid var(--line, rgba(255,255,255,.09)); }
.tr-evidence > p:last-child { border-bottom: 0; }
.tr-prose { white-space: pre-wrap; line-height: 1.9; max-width: 76ch; }
.tr-workspace-intro { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 2px 0 6px; }
.tr-workspace-intro p { margin: 0; font-variant-numeric: tabular-nums; }
.tr-prep-layout { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,1fr); gap: 22px; align-items: start; }
.tr-prep-layout > div { min-width: 0; }
.tr-lesson-notes { position: sticky; top: 102px; border-color: var(--line2, rgba(205,166,95,.24)); }
.tr-lesson-notes .tr-field:last-of-type { margin-bottom: 16px; }
.tr-lesson-notes .tr-save-state { padding-top: 14px; margin-bottom: 0; border-top: 1px solid var(--line, rgba(255,255,255,.1)); }
.tr-report-list-tools { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; padding: 0 0 18px; margin: 6px 0 8px; }
.tr-report-list-tools label { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--muted, #aaa69c); }
.tr-report-list-tools select { width: auto; min-width: 144px; }
.teaching-report button:focus-visible, .teaching-report summary:focus-visible { outline: 2px solid var(--brand, var(--gold, #cda65f)); outline-offset: 3px; }
@media (hover:hover) {
  .tr-report-row:hover { border-color: var(--line2, rgba(205,166,95,.4)); background-color: var(--control, rgba(255,255,255,.04)); }
}
@media (max-width:980px) {
  .tr-prep-layout { grid-template-columns: 1fr; gap: 0; }
  .tr-lesson-notes { position: static; }
}
@media (max-width:700px) {
  .tr-stats { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .tr-stats > div { min-height: 112px; padding: 18px 16px; }
  .tr-stats b { font-size: 29px; }
}
@media (max-width:540px) {
  .teaching-report { font-size: 14px; line-height: 1.8; }
  .tr-headline h2 { font-size: 23px; line-height: 1.4; }
  .tr-panel { padding: 17px; border-radius: 18px; margin: 14px 0; }
  .tr-stats { gap: 9px; margin-bottom: 19px; }
  .tr-stats > div { min-height: 111px; padding: 17px 14px; border-radius: 17px; }
  .tr-stats span { margin-top: 13px; }
  .tr-toolbar > .btn { flex: 1; min-height: 44px; white-space: normal; }
  .tr-toolbar > label { width: 100%; }
  .tr-evidence-actions { gap: 7px; }
  .tr-evidence-actions .btn { flex: 1 1 145px; min-height: 42px; }
  .tr-report-row { padding: 18px 16px; gap: 10px; border-radius: 18px; }
  .tr-report-row b { font-size: 13px; line-height: 1.7; }
  .tr-report-row small { font-size: 11px; }
  .tr-field textarea { font-size: 16px !important; padding: 12px 13px; }
  .tr-breakdown { gap: 13px; padding: 12px 1px; }
  .tr-breakdown > span { font-size: 12px; }
  .tr-breakdown > b { font-size: 13px; }
  .tr-workspace-intro { display: block; }
  .tr-workspace-intro p { margin-top: 7px; }
  .tr-report-list-tools { align-items: stretch; gap: 13px; }
  .tr-report-list-tools label { justify-content: space-between; width: 100%; }
  .tr-evidence { max-height: none; }
}
@media (max-width:360px) {
  .tr-stats > div { padding: 15px 12px; }
  .tr-stats b { font-size: 26px; }
  .tr-report-row { grid-template-columns: minmax(0,1fr); gap: 9px; }
  .tr-report-row > span:last-child { justify-self: end; }
}
@media (prefers-reduced-motion:reduce) { .tr-report-row { transition: none; } }