/* ---- Guide › For teachers: the teacher handout (T-2666, NAV-806) --------------------
   On screen it sits folded in Guide, in the device's own tokens (every skin, both
   themes). Printed, it is the only thing on the page: js/apps/teacher-handout.js copies
   it to body > .handout-print and marks <html> while the print dialog is open, and the
   rules under @media print leave everything else out. One sheet at Letter and at A4:
   no page size is set, so the margins below hold for either, and the type is sized to
   the shorter of the two printable heights (Letter, 279.4 mm - 2 x 12 mm). */
.nav-guide-teachers { margin-top: 12px; }
.nav-handout-print { align-self: flex-start; min-height: 44px; margin: 8px 0 4px; }
.nav-handout-fold { margin-top: 6px; }
.nav-handout-fold > .handout { padding: 0 0 12px; }

.handout { font-size: 14px; line-height: 1.4; color: var(--ink); }
.handout-head { margin-bottom: 6px; }
.handout-title { margin: 0 0 2px; font: 600 16px/1.25 var(--font-display, inherit); }
.handout-lede, .handout-start, .handout-rule, .handout-foot, .handout-empty { margin: 0 0 4px; color: var(--ink-dim); }
.handout-h { margin: 10px 0 4px; font: var(--label-weight, 400) 10px/1.4 var(--font-label, var(--font-mono, ui-monospace, monospace));
  letter-spacing: .16em; text-transform: uppercase; color: var(--ink-faint, var(--ink-dim)); }
.handout-steps, .handout-jaunts { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.handout-step { display: grid; grid-template-columns: 2.2em minmax(0, 1fr); column-gap: 6px; }
.handout-n { grid-row: span 2; color: var(--accent); font-variant-numeric: tabular-nums; font-family: var(--font-mono, ui-monospace, monospace); }
.handout-task { font-weight: 600; }
.handout-bubble { color: var(--ink-dim); }
.handout-dests { display: grid; gap: 10px; }
.handout-dest-name { margin: 0 0 4px; font-size: 14px; font-weight: 600; }
.handout-jaunt-title { font-weight: 600; }
.handout-stops { color: var(--accent); font-variant-numeric: tabular-nums; white-space: nowrap; }
.handout-stops::before { content: '· '; color: var(--ink-faint, var(--ink-dim)); }
.handout-premise { display: block; color: var(--ink-dim); font-size: 13px; }
.handout-foot { margin-top: 10px; }

/* The print copy never shows on screen. */
.handout-print { display: none; }

@media print {
  @page { margin: 12mm; }
  html.is-printing-handout, html.is-printing-handout body {
    height: auto !important; min-height: 0 !important; overflow: visible !important;
    position: static !important; background: #fff !important; color: #000 !important;
  }
  html.is-printing-handout body > :not(.handout-print) { display: none !important; }
  html.is-printing-handout .handout-print { display: block !important; position: static; }
  .handout-print .handout {
    --ink: #000; --ink-dim: #333; --ink-faint: #555; --accent: #000;
    font: 10pt/1.3 Georgia, 'Times New Roman', serif; color: #000;
    break-inside: avoid; page-break-inside: avoid;
  }
  .handout-print .handout-title { font: 700 17pt/1.15 Georgia, 'Times New Roman', serif; margin-bottom: 3pt; }
  .handout-print .handout-head { border-bottom: 1.5pt solid #000; padding-bottom: 5pt; margin-bottom: 4pt; }
  .handout-print .handout-h { font: 700 8pt/1.3 ui-monospace, Menlo, Consolas, monospace; margin: 9pt 0 4pt; letter-spacing: .14em; color: #000; }
  .handout-print .handout-steps { gap: 4pt; }
  .handout-print .handout-step { grid-template-columns: 2.2em minmax(0, 1fr); border-bottom: .5pt solid #bbb; padding-bottom: 3pt; }
  .handout-print .handout-n { font: 700 11pt/1.2 ui-monospace, Menlo, Consolas, monospace; }
  .handout-print .handout-dests { gap: 6pt; }
  .handout-print .handout-dest { break-inside: avoid; page-break-inside: avoid; }
  .handout-print .handout-dest-name { font-size: 11pt; margin-bottom: 2pt; }
  .handout-print .handout-jaunts { gap: 3pt; padding-left: 1.2em; list-style: decimal; display: block; }
  .handout-print .handout-jaunt { margin-bottom: 2pt; }
  .handout-print .handout-premise { font-size: 8.5pt; line-height: 1.25; color: #333; }
  .handout-print .handout-foot { border-top: .5pt solid #000; padding-top: 4pt; font-size: 8.5pt; }
}
