/* Focused teaching workspace. Loaded after the shared catalog/theme layer. */
body.teach[data-teach-design='sample'][data-teach-focus='sample'] { --focus-sidebar: 232px; --focus-guide: 300px; font-family: var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] #t-main { grid-template-rows: auto minmax(0, 1fr); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] #t-class-context { grid-row: 1; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] #t-teach, body.teach[data-teach-design='sample'][data-teach-focus='sample'] #t-prep { grid-row: 2; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] #t-top { grid-template-columns: auto minmax(0, 1fr) auto auto auto auto; gap: 16px; padding: 12px 24px; background: var(--ebony-2); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-crumb { font: 500 12px var(--sans); color: var(--fg-faint); text-transform: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-title { font-size: 16px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-crumb span { display: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-session-time { border: 0; padding: 0 12px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-session-time > span, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-session-time small { font: 12px var(--sans); text-transform: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-settings { position: relative; font-size: 13px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-settings summary, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-guidance-toggle { min-height: 40px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 7px; background: transparent; color: var(--fg-dim); font: 500 13px var(--sans); cursor: pointer; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-settings-body { position: absolute; right: 0; top: calc(100% + 10px); z-index: 40; width: min(320px, calc(100vw - 32px)); display: grid; gap: 10px; padding: 20px; border: 1px solid var(--line-2); border-radius: 12px; background: var(--ebony-3); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-settings-body select { width: 100%; max-width: none; min-height: 44px; font: 13px var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-settings-body label { color: var(--fg-dim); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-views { gap: 2px; padding: 3px; background: var(--ebony-3); border-radius: 8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-views button { font: 500 13px var(--sans); text-transform: none; min-height: 34px; border: 0; box-shadow: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-grid { grid-template-columns: var(--focus-sidebar) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; gap: 0; background: var(--ground); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-left { grid-column: 1; grid-row: 1 / -1; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto; align-items: stretch; padding: 28px 16px 24px; gap: 24px; border-right: 1px solid var(--line); background: var(--ebony); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-outline-head { padding: 0 12px; gap: 8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-outline-head > p:first-child { font-size: 14px; font-weight: 600; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-pacing { font: 12px/1.6 var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow { display: flex; flex-direction: column; gap: 6px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow button { min-height: 48px; border: 0; border-radius: 8px; padding: 12px; gap: 8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow .l { font-size: 13px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow .n, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow .m { font-size: 10px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow li.on button { background: var(--ink-2); box-shadow: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-feedback { margin-left: 12px; font: 12px var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage { grid-column: 2; grid-row: 1; padding: 32px 40px 24px; gap: 20px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage-head { gap: 12px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-beat-h { display: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-beat-title { font: 500 26px/1.25 var(--sans); letter-spacing: -.025em; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-beat-title.long { font: 500 18px/1.45 var(--sans); color: var(--fg); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-step-progress { margin: 0; color: var(--fg-faint); font-size: 12px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage:not(.is-prose) { grid-template-rows: auto minmax(0, 1fr) auto; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage.is-prose { display: flex; flex-direction: column; justify-content: center; padding: 48px max(40px, calc((100% - 780px) / 2)) 32px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .is-prose .t-stage-head { align-self: stretch; padding-bottom: 8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .is-prose .t-beat-title { font-size: 36px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prose { flex: 0 1 auto; padding: 0 0 24px; gap: 24px; align-content: start; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prose-lead { font: 400 22px/1.65 var(--sans); max-width: 65ch; color: var(--fg); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-delivery-notes { max-width: 70ch; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-delivery-notes summary { width: fit-content; padding: 12px 0; color: var(--fg-dim); cursor: pointer; font-size: 14px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-delivery-notes p { font: 16px/1.75 var(--sans); color: var(--fg-dim); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prose-section { border-color: var(--line); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prose-section h3 { font: 600 14px var(--sans); text-transform: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-right { display: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'].t-guidance-open .t-grid { grid-template-columns: var(--focus-sidebar) minmax(0, 1fr) var(--focus-guide); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'].t-guidance-open .t-right { display: grid; grid-column: 3; grid-row: 1; padding: 24px 20px; gap: 24px; border-left: 1px solid var(--line); background: var(--ebony); grid-template-rows: auto minmax(0, 1fr); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-coach-cue, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-solution { border: 0; border-radius: 0; padding: 0; background: transparent; box-shadow: none; animation: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-coach-cue { max-height: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-coach-cue h3, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-solution h3 { font: 500 14px var(--sans); text-transform: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-cue-body { font-size: 14px; line-height: 1.65; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-collapse { width: 36px; height: 36px; box-shadow: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-dock { grid-column: 2 / -1; grid-row: 2; align-self: stretch; margin: 0; padding: 18px 32px; border: 0; border-top: 1px solid var(--line); border-radius: 0; box-shadow: none; background: var(--ebony-2); grid-template-columns: minmax(100px, 1fr) minmax(280px, 1.2fr) minmax(100px, 1fr); grid-template-areas: 'prev clock next'; gap: 24px; align-items: center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prev, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-next { min-height: 48px; max-width: 200px; width: 100%; padding: 10px 16px; border: 1px solid var(--line); box-shadow: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-next { justify-self: end; background: var(--fg); color: var(--ground); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-next span, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-next small { color: var(--ground); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-next:hover:not(:disabled) { background: var(--ivory-2); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prev span, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-next span { font-size: 13px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prev small, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-next small { font: 11px var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-clock-readout > span { display: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-clock-readout small { font: 11px var(--sans); text-transform: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-play { min-height: 44px; font-size: 13px; box-shadow: none; border-color: var(--line-2); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-reset { width: 40px; height: 44px; box-shadow: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] :is(button, summary, select):focus-visible { outline: 2px solid var(--fg); outline-offset: 3px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-settings summary:hover, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-guidance-toggle:hover { background: var(--ebony-3); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-view='present'] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-view='present'] .t-dock { grid-column: 1 / -1; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-view='present'] .t-right { display: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample']:is([data-teach-view='present'], [data-teach-view='prep']) .t-guidance-toggle { display: none; }
@media (min-width: 700px) and (max-width: 1199px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] { --focus-sidebar: 200px; --focus-guide: 260px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] #t-top { display: flex; flex-wrap: wrap; gap: 8px 12px; padding: 10px 16px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-id { flex: 1; flex-basis: 200px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage.is-prose { padding: 24px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prose-lead { font-size: 19px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-dock { padding: 16px 20px; gap: 12px; grid-template-columns: minmax(90px, 1fr) minmax(230px, 1.4fr) minmax(90px, 1fr); }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'].t-guidance-open .t-grid { grid-template-columns: var(--focus-sidebar) minmax(0, 1fr); }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'].t-guidance-open .t-right { grid-column: 2; grid-row: 2; max-height: 240px; overflow: auto; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'].t-guidance-open .t-grid { grid-template-rows: minmax(0, 1fr) auto auto; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'].t-guidance-open .t-dock { grid-row: 3; }
}
@media (max-width: 699px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] #t-top { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 16px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-id { flex-basis: 100%; order: 1; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-views { margin-left: auto; order: 0; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-settings, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-guidance-toggle { order: 2; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-settings-body { left: 0; right: auto; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-session-time { display: none; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-collapse { width: 44px; height: 44px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-settings summary, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-guidance-toggle, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-delivery-notes summary { min-height: 44px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-grid, body.teach[data-teach-design='sample'][data-teach-focus='sample'].t-guidance-open .t-grid { height: auto; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(320px, auto) auto auto; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-left { grid-column: 1; grid-row: 1; padding: 12px 16px; gap: 8px; grid-template-rows: auto auto; border-right: 0; border-bottom: 1px solid var(--line); }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-outline-head { padding: 0; display: flex; align-items: center; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-pacing { display: none; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-feedback { display: none; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow { display: grid; grid-auto-flow: column; grid-auto-columns: 155px; height: auto; overflow-x: auto; overflow-y: hidden; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow button { min-height: 44px; grid-template-columns: 18px 1fr; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow .m { display: none; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-flow button { scroll-margin-top: 220px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage.is-prose { grid-column: 1; grid-row: 2; padding: 28px 24px; min-height: 360px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .is-prose .t-beat-title { font-size: 28px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prose { overflow: visible; padding: 12px 0 24px; align-content: start; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prose-lead { font-size: 18px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'].t-guidance-open .t-right { grid-column: 1; grid-row: 3; padding: 24px; overflow: visible; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-dock { grid-column: 1; grid-row: 4; padding: 16px; gap: 12px; grid-template-columns: 1fr 1fr; grid-template-areas: 'clock clock' 'prev next'; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-clock { grid-template-columns: minmax(0, 1fr) auto; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prev, body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-next { max-width: none; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-view='present'] .t-stage { grid-row: 1; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-view='present'] .t-dock { grid-row: 2; }
}
@media (min-width: 700px) and (max-height: 650px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage.is-prose { padding-block: 20px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-prose { align-content: start; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .is-prose .t-beat-title { font-size: 28px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-dock { padding-block: 12px; }
}


/* Preserve the sample theme switch and restore the dock beneath the workspace. */
body.teach[data-teach-focus='sample'][data-teach-theme='light'] { --ebony: var(--panel); --ebony-2: var(--panel); --ebony-3: var(--panel-hi); --ink-2: var(--panel-hi); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] #t-main { grid-template-rows: auto minmax(0, 1fr); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-grid { padding: 0; height: 100%; align-items: stretch; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-left { height: 100%; max-height: none; align-self: stretch; border-radius: 0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-stage { border: 0; border-radius: 0; background: var(--ground); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-right { border-radius: 0; height: auto; max-height: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-dock { display: grid; width: auto; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-clock { border: 0; padding: 0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-crumb span.t-stage-badge { display: inline-flex; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-view='present'] .t-stage { grid-column: 1 / -1; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-view='present'] .t-left { display: none; }
@media (max-width: 699px) {
 body.teach[data-teach-design='sample'][data-teach-focus='sample'] #t-main { overflow: visible; }
 body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-grid { height: auto; }
 body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-left { height: auto; }
 body.teach[data-teach-design='sample'][data-teach-focus='sample'] .t-dock { position: static; }
}
/* Article-style reading on the free samples. The active section owns the live board. */
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-stage,
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-stage.is-prose { display: block; position: relative; padding: 0; overflow-y: auto; overflow-x: hidden; scroll-behavior: auto; overscroll-behavior-y: contain; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-section { min-height: 100%; padding: 48px max(32px, calc((100% - 780px) / 2)); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 24px; justify-content: center; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-preview { display: grid; gap: 24px; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-preview[hidden] { display: none; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-preview h2 { font: 500 36px/1.25 var(--sans); letter-spacing: -.025em; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-meta { font-size: 12px; color: var(--fg-faint); }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-activate { justify-self: start; width: fit-content; padding: 12px 16px; font: 500 14px var(--sans); border: 1px solid var(--line-2); border-radius: 6px; color: var(--fg); background: var(--panel); cursor: pointer; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-board { width: min(100%, 420px); aspect-ratio: 1; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-board-workspace { min-height: 480px; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-prose { overflow: visible; }
@media (max-width: 699px) {
 body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-stage { height: 65dvh; min-height: 420px; }
 body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-section { padding: 28px 24px; }
 body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-preview h2 { font-size: 28px; }
 body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-board-workspace { min-height: 340px; }
}
/* Swapping the live section must never let browser scroll anchoring move the article. */
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-stage { overflow-anchor: none; }
/* Article content remains mounted and visible while the outline follows scrolling. */
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-live[hidden] { display: none; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-position { margin: 0; display: grid; gap: 20px; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-position-tools { display: flex; flex-wrap: wrap; gap: 12px; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-board { display: grid; grid-template-columns: repeat(8, 1fr); grid-template-rows: repeat(8, 1fr); height: auto; flex: none; }
body.teach[data-teach-focus='sample'] .t-reading-key-guide { display: none; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-key-guide { display: none; }
body.teach[data-teach-focus='sample'][data-teach-reading='true'] .t-reading-key-guide { display: block; margin-top: 12px; font: 12px/1.6 var(--sans); color: var(--fg-dim); }


body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] { --lesson-paper:#fff; --lesson-ink:#151719; --lesson-sidebar:#f3f1ed; --lesson-panel:#f4f2ee; --lesson-track:#eeedeb; --lesson-soft:#edf0e7; --lesson-line:#e1e1de; --lesson-muted:#74777c; --lesson-dim:#65676d; --lesson-outline:#b7bab8; --lesson-soft-line:#c9cebf; --lesson-accent-ink:#2e4633; color-scheme:light; }
/* S001 owner-supplied reference. */

body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] { --fg:var(--lesson-ink); --fg-dim:var(--lesson-dim); --fg-faint:var(--lesson-muted); --ground:#fff; --line:var(--lesson-line); --line-2:var(--lesson-outline); --focus-sidebar:248px; background:var(--lesson-paper); color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-top { margin-left:248px; height:68px; padding:12px 36px; background:var(--lesson-paper); border:0; display:flex; gap:16px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-main { height:calc(100dvh - 68px); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-back { position:fixed; top:24px; left:28px; z-index:2; width:190px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-id { flex:1; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-title { position:fixed; top:118px; left:28px; width:190px; font:500 24px/1.15 var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-crumb { font-size:14px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-crumb span { display:inline; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-stage-badge, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-session-time, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-theme, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-guidance-toggle { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views { border-radius:22px; background:var(--lesson-track); padding:3px; border:0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views button { border-radius:20px; font-size:14px; padding:8px 16px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views button[aria-pressed='true'] { background:var(--lesson-paper); color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  border: 1px solid var(--lesson-soft-line);
  border-radius: 24px;
  background: var(--lesson-soft);
  color: var(--lesson-accent-ink);
  font: 500 14px var(--sans);
  white-space: nowrap;
  list-style: none;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings summary::-webkit-details-marker { display: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings-body > * { order: 0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings summary::after { content: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings[open] summary { background: #2e4633; color: #fff; border-color: #2e4633; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings[open] summary svg { transform: rotate(180deg); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings-body { background:var(--lesson-paper); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-grid { grid-template-columns:248px minmax(0,1fr); grid-template-rows:minmax(0,1fr) 86px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left { grid-column:1; grid-row:1 / 3; padding:156px 16px 24px; background:var(--lesson-sidebar); border:0; overflow:visible; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left::before { content:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left::after { content:''; position:fixed; top:0; left:0; width:248px; height:68px; background:var(--lesson-sidebar); z-index:-1; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-outline-head { padding:0 12px 12px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-outline-head > .mono:first-child { font:14px var(--sans); color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-pacing, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .m, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-step-progress, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-key-guide, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-reading-key-guide { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow { display:flex; flex-direction:column; gap:10px; overflow-y:auto; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow button { grid-template-columns:30px minmax(0,1fr); gap:16px; border:0; padding:10px 14px; min-height:52px; border-radius:12px; background:transparent; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .n { display:grid; place-items:center; border:1px solid #bfc1bf; border-radius:50%; width:29px; height:29px; font:14px var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .l { font:17px/1.3 var(--sans); color:var(--lesson-muted); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .on button { background:var(--lesson-paper); } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .on .n { background:#2e4633; color:white; border-color:var(--lesson-accent-ink); } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .on .l { color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-outline-footer { border-top:1px solid var(--lesson-line); padding:20px 12px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-feedback { font:13px var(--sans); color:var(--lesson-muted); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-stage.is-prose { grid-column:2; grid-row:1; display:flex; flex-direction:column; justify-content:flex-start; padding:6px 36px 28px; overflow-y:auto; background:var(--lesson-paper); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-beat-h { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-beat-title, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-prose .t-beat-title { font:700 clamp(32px,3.7vw,54px)/1.12 var(--sans); letter-spacing:-.04em; margin:0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prose { overflow:visible; padding:0; gap:0; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-right { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-dock { grid-column:2; grid-row:2; background:var(--lesson-paper); border-top:1px solid var(--lesson-line); margin:0 36px; padding:14px 0; grid-template-columns:auto minmax(0,1fr) auto; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prev:disabled { display:none; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-clock { justify-self:start; gap:20px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-clock-readout { display:flex; align-items:center; gap:12px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-clock-readout b { font:500 30px var(--sans); color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-play { border:1px solid var(--lesson-outline); border-radius:16px; color:var(--lesson-ink); background:var(--lesson-paper); padding:10px 20px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-reset { background:var(--lesson-paper); color:var(--lesson-muted); } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-next { background:var(--lesson-ink); color:#fff; border-radius:28px; padding:12px 24px; border:0; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-next small { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-next:hover:not(:disabled) { background:#2e4633; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-bar { background:var(--lesson-line); } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-bar i { background:#2e4633; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-subtitle { margin:6px 0 30px; font:400 clamp(19px,2vw,26px)/1.4 var(--sans); color:var(--lesson-muted); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(260px,1fr); gap:clamp(32px,5vw,80px); align-items:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo { margin:0 0 20px 28px; min-width:0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-tools { display:flex; justify-content:space-between; margin-bottom:8px; color:var(--lesson-dim); font-size:12px; text-transform:uppercase; letter-spacing:.06em; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-tools button { border:0; background:transparent; color:var(--lesson-dim); font:14px var(--sans); cursor:pointer; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board { width:100%; display:grid; grid-template-columns:repeat(8,1fr); aspect-ratio:1; border:1px solid #b7bab0; border-radius:9px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board button { position:relative; border:0; padding:0; border-radius:0; font:22px Georgia,serif; cursor:pointer; color:#fff; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board .light { background:#efe9d9; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board .dark { background:#819170; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board button[aria-pressed='true']::after { content:''; position:absolute; inset:3px; border:3px solid #205c28; box-shadow:inset 0 0 0 2px #c9e2b6; border-radius:2px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-label { visibility:hidden; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] [aria-pressed='true'] .t-demo-label { visibility:visible; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-rank, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-file { position:absolute; color:var(--lesson-dim); font:14px var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-rank { left:-26px; top:50%; transform:translateY(-50%); } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-file { bottom:-27px; left:50%; transform:translateX(-50%); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-eyebrow { font:12px var(--sans); color:var(--lesson-dim); letter-spacing:.07em; text-transform:uppercase; margin:0 0 18px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-guide h3 { font:700 clamp(26px,2.8vw,40px)/1.14 var(--sans); letter-spacing:-.035em; margin:0 0 16px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-description { font:20px/1.45 var(--sans); color:var(--lesson-dim); margin:0 0 28px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-drill { border-top:1px solid var(--lesson-line); padding-top:28px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-square-chips { display:flex; gap:12px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-square-chips button { background:var(--lesson-soft); color:var(--lesson-ink); border:0; border-radius:26px; min-width:80px; padding:12px 24px; font:22px Georgia,serif; cursor:pointer; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-drill > p:not(.t-demo-eyebrow) { font:18px/1.5 var(--sans); color:var(--lesson-dim); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-tip { margin:28px 0 0; padding:18px 22px; border-radius:12px; background:var(--lesson-soft); font:16px/1.5 var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-notes { margin-top:16px; font:13px/1.6 var(--sans); color:var(--lesson-muted); } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-notes summary { cursor:pointer; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board .sq.l { background:#efe9d9; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board .sq.d { background:#819170; }
@media (max-width:1050px) { body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-layout { grid-template-columns:minmax(0,1fr); gap:32px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo { max-width:500px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-stage.is-prose { padding:20px 28px 32px; } }
@media (max-width:699px) {
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] { height:auto; min-height:100dvh; overflow:auto; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-top { margin-left:0; height:auto; padding:16px; flex-wrap:wrap; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-main { height:auto; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-back { position:static; width:auto; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-title { position:static; width:auto; font-size:18px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-id { order:2; flex-basis:100%; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-grid { display:flex; flex-direction:column; height:auto; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left { padding:12px 16px; overflow:hidden; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left::before, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left::after, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-outline-head, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-outline-footer { display:none; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow { flex-direction:row; overflow-x:auto; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow li { flex:0 0 180px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-stage.is-prose { padding:24px 20px 36px; min-height:0; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-dock { margin:0 20px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-clock { display:flex; flex-wrap:wrap; gap:12px; }
}

body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-back, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-title { color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-crumb .t-stage-badge { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views button { background:transparent; color:var(--lesson-dim); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views button[aria-pressed='true'] { background:var(--lesson-paper); color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-beat-title, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-prose .t-beat-title, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-guide h3 { font-family:var(--display); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-subtitle { margin-top:0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prose { display:block; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left { isolation:isolate; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left::after { height:100dvh; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-guidance-toggle { display:block; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'].t-guidance-open .t-right { display:block; position:fixed; top:80px; right:24px; width:min(360px,calc(100vw - 48px)); max-height:calc(100dvh - 180px); overflow:auto; background:var(--lesson-paper); border:1px solid var(--lesson-line); border-radius:12px; padding:24px; z-index:30; box-shadow:0 12px 40px #00000015; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-grid { grid-template-columns:minmax(0,1fr); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-dock { grid-column:1; }

body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-id { border:0; padding-left:0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-crumb::after { content:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views button { box-shadow:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board .light[aria-pressed='true'] { color:#fff; background:#819170; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board button:first-child { border-top-left-radius:8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board button:nth-child(8) { border-top-right-radius:8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board button:nth-child(57) { border-bottom-left-radius:8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board button:last-child { border-bottom-right-radius:8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board button:focus-visible { outline:3px solid var(--lesson-ink); outline-offset:2px; z-index:1; }
@media (max-width:699px) { body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-crumb::after { display:none; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views { width:auto; } }

/* S001 follow-up: readable teaching boards and centered lesson components. */
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-stage { gap:24px; padding:24px 40px 32px; align-items:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-stage-head { width:min(100%,960px); text-align:center; align-self:center; padding:0; display:flex; flex-direction:column; align-items:center; gap:16px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-beat-title { font-size:clamp(28px,2.7vw,42px); line-height:1.16; max-width:30ch; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-beats { justify-content:center; gap:8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-beats button { min-width:40px; height:36px; border-radius:18px; background:var(--lesson-soft); border:0; color:var(--lesson-dim); box-shadow:none; font:14px var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-beats button[aria-current='true'] { background:#2e4633; color:white; box-shadow:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-workspace { display:flex; flex-direction:column; align-items:center; flex:none; width:min(100%,760px); gap:12px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-wrap { container-type:normal; display:block; width:min(100%,max(320px,calc(100dvh - 400px)),720px); flex:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-frame { width:100%; aspect-ratio:1; border-radius:10px; box-shadow:0 0 0 1px #b7bab0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .board2d { border-radius:10px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .board2d .sq img { display:block; opacity:1; visibility:visible; width:90%; height:90%; object-fit:contain; filter:drop-shadow(0 1px 1px #00000024); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .board2d .co { font:clamp(10px,.85vw,14px) var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-tools { order:2; display:flex; flex-direction:row; flex-wrap:wrap; align-self:center; justify-content:center; gap:8px; width:auto; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-tools button, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-tools button[data-copy] { width:auto; min-width:44px; height:40px; border-radius:12px; border:1px solid var(--lesson-line); background:var(--lesson-panel); padding:8px 12px; color:var(--lesson-dim); font:13px var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-tools .t-tool-name { display:inline; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-tools button:hover:not(:disabled) { background:var(--lesson-soft); color:var(--lesson-ink); border-color:#819170; box-shadow:none; transform:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-caption { margin:0; font:13px var(--sans); color:var(--lesson-muted); text-align:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-stage.is-prose { justify-content:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-prose { display:flex; flex-direction:column; align-items:center; gap:28px; width:min(100%,760px); text-align:center; flex:none; padding:0 0 16px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-prose-lead { margin:0; max-width:60ch; font:400 clamp(18px,1.6vw,22px)/1.65 var(--sans); color:var(--lesson-dim); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prose-meta { margin:0; color:var(--lesson-muted); font:12px var(--sans); text-transform:none; letter-spacing:.02em; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-card { width:100%; max-width:none; padding:32px; background:var(--lesson-soft); border:0; border-radius:20px; gap:24px; box-shadow:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-card > .mono { font:12px var(--sans); letter-spacing:.07em; color:var(--lesson-dim); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-card > p:not(.mono) { font:500 clamp(22px,2vw,30px)/1.4 var(--display); color:var(--lesson-ink); max-width:38ch; margin:auto; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-card-controls { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-card-controls button { width:auto; min-height:44px; padding:10px 22px; border:1px solid var(--lesson-soft-line); border-radius:24px; background:transparent; color:var(--lesson-accent-ink); box-shadow:none; font:14px var(--sans); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-card-controls button:last-child { background:#2e4633; color:#fff; border-color:var(--lesson-accent-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-card-controls button:disabled { opacity:.4; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-card-controls button:hover:not(:disabled) { transform:none; box-shadow:none; border-color:var(--lesson-accent-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prose-section, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-steps { width:100%; max-width:none; padding-top:24px; border-color:var(--lesson-line); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prose-section h3, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-steps h3 { margin:0 0 14px; font:500 14px var(--sans); color:var(--lesson-accent-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prose-section p, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prose-section li { font:16px/1.65 var(--sans); color:var(--lesson-dim); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prose-section ul, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-steps ol { text-align:left; max-width:60ch; margin:0 auto; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-steps button { border:1px solid var(--lesson-line); background:var(--lesson-panel); color:var(--lesson-ink); border-radius:12px; padding:14px 18px; box-shadow:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-delivery-notes { width:100%; text-align:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-delivery-notes summary { margin:auto; }
@media (max-height:650px) and (min-width:700px) {
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-stage { gap:18px; padding:16px 28px 24px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-beat-title { font-size:28px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-wrap { width:min(100%,max(320px,calc(100dvh - 240px))); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-stage.is-prose { justify-content:flex-start; }
}
@media (max-width:699px) {
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-stage { padding:24px 20px; gap:24px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-wrap { width:100%; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-tools { gap:6px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-tools button, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-tools button[data-copy] { min-width:44px; height:44px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-board-tools .t-tool-name { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-card { padding:24px 20px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-welcome='false'] .t-stage.is-prose { justify-content:flex-start; }
}

body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-beats { display:flex; width:auto; align-self:center; justify-content:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-stage-head .t-beat-title { color:var(--lesson-ink); }

/* S001 article: persistent pages, bounded diagrams, native scrolling. */
@media (max-width:699px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-stage.t-stage {
    height: max(160px, calc(100dvh - var(--reading-stage-top, 280px)));
    min-height: 0;
  }
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-stage.is-prose { display:block; position:relative; padding:0; overflow-y:auto; overflow-x:hidden; scroll-behavior:auto; overflow-anchor:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-section { min-height:100%; padding:40px 36px; justify-content:center; align-items:center; border-color:var(--lesson-line); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-preview { width:min(100%,880px); display:flex; flex-direction:column; align-items:center; gap:28px; text-align:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-preview h2 { font:700 clamp(28px,2.8vw,42px)/1.18 var(--display); letter-spacing:-.035em; color:var(--lesson-ink); margin:0; max-width:32ch; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-preview > .t-prose-lead { color:var(--lesson-dim); font:400 clamp(18px,1.6vw,22px)/1.65 var(--sans); max-width:60ch; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-preview > .t-welcome-subtitle { margin:0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-section:first-of-type .t-reading-preview { width:min(100%,1060px); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-welcome-layout { width:100%; grid-template-columns:minmax(0,460px) minmax(260px,1fr); gap:48px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-demo { width:calc(100% - 28px); max-width:420px; justify-self:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-demo-board { width:100%; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-welcome-guide { text-align:left; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position { width:100%; justify-items:center; gap:8px; padding:8px 0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position :is(figcaption, .t-reading-meta) { margin:0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position:not(:last-child) { border-bottom:1px solid var(--lesson-line); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position figcaption { text-align:center; max-width:40ch; font:500 24px/1.4 var(--display); color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position .t-reading-board { width:min(100%,500px,var(--reading-board-size,500px)); aspect-ratio:1; border-radius:10px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-board .sq.l { background:#efe9d9; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-board .sq.d { background:#819170; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position-tools { justify-content:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-activate { margin:0 auto; border:1px solid var(--lesson-soft-line); background:var(--lesson-soft); color:var(--lesson-accent-ink); border-radius:24px; padding:12px 22px; min-height:44px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-question { scroll-margin-top:24px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-live[hidden] { display:none; }
@media (max-width:1100px) { body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-welcome-layout { grid-template-columns:minmax(0,1fr); gap:36px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-welcome-guide { width:min(100%,500px); margin:auto; } }
@media (max-width:699px) { body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-stage.is-prose { height:70dvh; min-height:420px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-section { padding:28px 20px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-board { width:min(100%,420px); } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position figcaption { font-size:21px; } }

body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-key-guide { display:block; margin:16px 0 0; font:12px/1.6 var(--sans); color:var(--lesson-muted); }

/* Soft motion: spring settling, connected progress dots, slow drawn ticks. */
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] { --lesson-spring:cubic-bezier(.22,1.2,.36,1); --lesson-settle:cubic-bezier(.22,1,.36,1); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow li { position:relative; flex:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow li:not(:last-child)::after { content:''; position:absolute; left:28px; top:44px; height:calc(100% - 25px); width:2px; border-radius:2px; background:var(--lesson-line); pointer-events:none; transition:background-color 800ms ease; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow li.is-complete::after { background:#819170; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow button { transition:background-color 600ms ease, transform 650ms var(--lesson-spring); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .n { position:relative; z-index:2; transition:transform 750ms var(--lesson-spring), background-color 700ms ease, border-color 700ms ease; background:var(--lesson-sidebar); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .on .n { transform:scale(1.07); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .t-marker-number { grid-area:1 / 1; transition:opacity 350ms ease, transform 700ms var(--lesson-spring); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-marker-tick { position:absolute; inset:4px; width:19px; height:19px; opacity:0; transform:scale(.75); transition:opacity 450ms ease, transform 950ms var(--lesson-spring); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-marker-tick path { fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1100ms var(--lesson-settle) 120ms; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-complete .n { background:var(--lesson-soft); border-color:#819170; color:var(--lesson-accent-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-complete .t-marker-number { opacity:0; transform:scale(.5); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-complete .t-marker-tick { opacity:1; transform:scale(1); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-complete .t-marker-tick path { stroke-dashoffset:0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-complete.on .n { color:white; background:#2e4633; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .l { transition:color 600ms ease; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-reading-preview :is(h2,h3,p,li,summary,figcaption) { transform-origin:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-reading-section.is-active .t-run-card { border-radius:24px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-card { transition:transform 700ms var(--lesson-spring), background-color 600ms ease; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] :is(.t-square-chips button,.t-card-controls button,.t-reading-activate,.t-next,.t-prev,.t-play,.t-views button,.t-demo-tools button) { transition:transform 700ms var(--lesson-spring), background-color 400ms ease, color 400ms ease; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] :is(.t-square-chips button,.t-card-controls button,.t-reading-activate,.t-next,.t-prev,.t-play):active { transform:scale(.96); transition:transform 120ms ease; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board button::after { transform:scale(.92); opacity:0; transition:transform 750ms var(--lesson-spring), opacity 550ms ease; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-demo-board button[aria-pressed='true']::after { transform:scale(1); opacity:1; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-tip { transition:transform 850ms var(--lesson-spring); }
@media (hover:hover) and (pointer:fine) {
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow button:hover { transform:translateX(3px); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] :is(.t-square-chips button,.t-card-controls button,.t-reading-activate,.t-next,.t-prev,.t-play):hover:not(:disabled) { transform:translateY(-2px) scale(1.025); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-tip:hover { transform:translateY(-2px); }
}
@media (max-width:699px) {
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow li:not(:last-child)::after { left:46px; top:25px; width:calc(100% - 24px); height:2px; z-index:0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow button { position:relative; z-index:1; }
}
@media (prefers-reduced-motion:reduce) {
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] *, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] *::before, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .on .n, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-complete .t-marker-tick { transform:none; }
}

/* Use the whole selected tab surface, without the legacy moving plate. */
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views > .ui-selection { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views button[aria-pressed='true'] { background:#2e4633; color:#fff; border-radius:20px; box-shadow:none; }

body.teach[data-teach-focus="sample"] .t-position-copy-status { flex-basis:100%; text-align:center; font:13px/1.5 var(--sans); color:var(--fg-dim); }
body.teach[data-teach-focus="sample"] .t-position-copy-status:empty { display:none; }

body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-copy-position-fen { min-width:142px; transform-origin:center; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-copy-position-fen.is-copied { background:#2e4633; color:#fff; border-color:var(--lesson-accent-ink); }

/* Theme overrides and the top-right switch. */
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-theme='dark'] { --lesson-paper:#111315; --lesson-ink:#f4f5ef; --lesson-sidebar:#191c19; --lesson-panel:#202520; --lesson-track:#262b26; --lesson-soft:#252e23; --lesson-line:#383e37; --lesson-muted:#a4aaa1; --lesson-dim:#bdc2b9; --lesson-outline:#636c60; --lesson-soft-line:#485342; --lesson-accent-ink:#b4d2a2; --fg:var(--lesson-ink); --fg-dim:var(--lesson-dim); --fg-faint:var(--lesson-muted); --ground:var(--lesson-paper); --line:var(--lesson-line); --line-2:var(--lesson-outline); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-mode-toggle { display:grid; place-items:center; width:42px; height:42px; flex:none; padding:0; border:1px solid var(--lesson-line); border-radius:50%; background:var(--lesson-panel); color:var(--lesson-ink); cursor:pointer; transition:transform 650ms var(--lesson-spring),background-color 450ms ease,color 450ms ease; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-mode-toggle[hidden] { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-mode-toggle .t-mode-sun { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-theme='dark'] #t-mode-toggle .t-mode-moon { display:none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-theme='dark'] #t-mode-toggle .t-mode-sun { display:block; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-mode-toggle:active { transform:scale(.92); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-next { color:var(--lesson-paper); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-clock-readout b, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-guidance-toggle { color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .n { color:var(--lesson-muted); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow .on .n, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-complete.on .n { color:white; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .is-complete .n { color:var(--lesson-accent-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-reading-key-guide { color:var(--lesson-muted); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-prep { background:var(--lesson-paper); color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-prep :is(h2,h3) { color:var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-prep :is(p,li,dt,dd) { color:var(--lesson-dim); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] :is(.t-demo-rank,.t-demo-file) { color:var(--lesson-dim); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-top, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-stage, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left::after, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-dock, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-card, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-welcome-tip, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings-body, body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-prep { transition:background-color 450ms ease,color 450ms ease,border-color 450ms ease; }
@media (hover:hover) and (pointer:fine) { body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-mode-toggle:hover { transform:rotate(-12deg) scale(1.06); } }
@media (max-width:699px) { body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-mode-toggle { margin-left:auto; width:44px; height:44px; } body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views { margin-left:0; } }

body.teach[data-teach-reference][data-teach-theme="dark"] { color-scheme:dark; }
@media (max-width:699px) { body.teach[data-teach-reference] .t-back { flex-basis:100%; } }

body.teach[data-teach-reference] .t-next > span { color:inherit; }
body.teach[data-teach-design="sample"][data-teach-focus="sample"][data-teach-reference] .t-next:hover:not(:disabled) { background:var(--lesson-ink); color:var(--lesson-paper); }

/* All-session rollout: data-backed identity and content-safe reference layout. */
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] {
  --lesson-muted: #656a63;
  --ground: var(--lesson-paper);
  --panel: var(--lesson-panel);
  --panel-hi: var(--lesson-soft);
  --accent: var(--lesson-accent-ink);
  --stage-ink: var(--lesson-accent-ink);
  --stage-fill: #2e4633;
  scrollbar-color: var(--lesson-outline) var(--lesson-paper);
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-theme='dark'] {
  --lesson-muted: #a4aaa1;
  color-scheme: dark;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-main {
  height: auto;
  min-height: 0;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left {
  padding: 24px 16px 0;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 0;
  min-height: 0;
  overflow: hidden;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-session-identity {
  padding: 0 12px 20px;
  min-width: 0;
  max-height: min(40dvh, 280px);
  overflow: auto;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-session-eyebrow {
  margin: 0 0 12px;
  font: 12px/1.2 var(--sans);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lesson-muted);
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-title {
  position: static;
  width: auto;
  margin: 0;
  overflow-wrap: anywhere;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-outline-head { padding-bottom: 12px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-id { min-width: 0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-crumb {
  white-space: normal;
  line-height: 1.5;
  margin: 0;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-crumb b { color: var(--lesson-muted); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-lesson-duration {
  font: inherit;
  color: var(--lesson-muted);
  white-space: nowrap;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-lesson-duration:not(:empty)::before { content: '|'; margin: 0 12px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings-body select,
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-class-context select {
  background: var(--lesson-paper);
  color: var(--lesson-ink);
  border: 1px solid var(--lesson-outline);
  color-scheme: inherit;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-class-context {
  padding: 8px 16px;
  gap: 8px;
  background: var(--lesson-panel);
  color: var(--lesson-ink);
  font: 14px/1.5 var(--sans);
  display: block;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-context-fields { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-class-context summary { min-height: 44px; padding: 10px 0; cursor: pointer; font-weight: 500; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-class-context[open] summary { margin-bottom: 8px; }
@media (min-width: 1000px) and (min-height: 500px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-class-context[open] summary { display: none; }
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-class-context :is(select, button, a) {
  min-height: 44px;
  padding: 8px 12px;
  border-radius: 12px;
  background: var(--lesson-paper);
  color: var(--lesson-ink);
  font: inherit;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings summary { min-width: 44px; min-height: 44px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-load-message { color: var(--lesson-ink); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-load-actions :is(a, button) {
  background: var(--lesson-soft);
  color: var(--lesson-accent-ink);
  border-color: var(--lesson-soft-line);
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-guidance-toggle { min-height: 44px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference].t-guidance-open .t-grid { grid-template-columns: 248px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference]:is([data-teach-view='present'], [data-teach-view='prep']) #t-top {
  margin-left: 0;
  height: auto;
  min-height: 68px;
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference]:is([data-teach-view='present'], [data-teach-view='prep']) .t-back { position: static; flex: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference]:is([data-teach-view='present'], [data-teach-view='prep']) .t-title { font-size: 18px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-guidance-toggle { display: block; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='prep'] .t-guidance-toggle { display: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-board-tools { opacity: 1; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] :is(.t-reset, .t-collapse, .t-line-btns button) { min-width: 44px; min-height: 44px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'].t-guidance-open .t-grid { grid-template-columns: minmax(0, 1fr); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-opening-layout { align-items: start; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-opening-layout > .t-reading-position { border: 0; padding: 0; min-width: 0; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-opening-layout .t-reading-board { width: min(100%, 420px, var(--reading-board-size, 420px)); }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-opening-guide > .t-prose-lead { font-size: 20px; line-height: 1.45; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-steps li { margin-bottom: 10px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-steps button { width: 100%; text-align: left; font: 16px/1.65 var(--sans); cursor: pointer; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-run-steps .done button { background: var(--lesson-soft); color: var(--lesson-accent-ink); text-decoration: line-through; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] :is(button, a, select, summary):focus-visible { outline: 3px solid var(--lesson-accent-ink); outline-offset: 3px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] ::selection { background: var(--lesson-accent-ink); color: var(--lesson-paper); }
@media (max-width: 1100px) and (min-width: 700px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-top { padding-inline: 20px; gap: 8px; height: auto; min-height: 68px; flex-wrap: wrap; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] .t-id { display: none; }
}
@media (min-width: 700px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] .t-class-context { margin-left: 248px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left {
    position: fixed;
    top: var(--teach-toolbar-height, 68px);
    bottom: 0;
    left: 0;
    width: 248px;
    height: auto;
    padding: 20px 16px 8px;
  }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left::after { height: var(--teach-toolbar-height, 68px); }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-context-status { flex: 1; min-width: 150px; font-size: 12px; }
}
@media (max-width: 699px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left { padding: 12px 16px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-lesson-duration { display: none; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-top { gap: 8px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-guidance-toggle { padding: 10px 8px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] :is(.t-beats button, .t-board-tools button) { min-width: 44px; min-height: 44px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views button { min-height: 44px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-dock { padding-bottom: max(16px, env(safe-area-inset-bottom)); }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-top { display: grid; grid-template-columns: minmax(0, 1fr) 44px 100px; padding: 12px 16px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-back { grid-column: 1; grid-row: 1; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-back .word { font-size: 24px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-back .mark { width: 28px; height: 28px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-mode-toggle { grid-column: 2; grid-row: 1; justify-self: end; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings { grid-column: 1; grid-row: 2; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-settings summary { padding: 8px; font-size: 12px; gap: 6px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views { grid-column: 3; grid-row: 2; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-views button { padding-inline: 7px; font-size: 12px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-guidance-toggle { grid-column: 2; grid-row: 2; width: 44px; padding: 0; font-size: 0; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-guidance-toggle::before { content: 'Notes'; font: 11px var(--sans); }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-top > .t-tutorial-help:not(#t-return-teach) { grid-column: 3; grid-row: 1; justify-self: end; font-size: 12px; padding: 8px 10px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] .t-id { display: block; position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] #t-return-teach { grid-column: 1 / -1; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position-tools { flex-wrap: nowrap; gap: 6px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-activate { padding: 8px 10px; font-size: 13px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-dock { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding: 8px 0 max(8px, env(safe-area-inset-bottom)); gap: 8px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-clock { grid-column: 1 / -1; grid-row: 1; flex-wrap: nowrap; gap: 8px; justify-content: space-between; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-clock-readout { gap: 6px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-clock-readout b { font-size: 24px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-clock-readout small { font-size: 10px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-play { padding-inline: 10px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-prev { grid-column: 1; grid-row: 2; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-next { grid-column: 2; grid-row: 2; justify-self: end; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] { height: 100dvh; overflow: hidden; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] .t-grid { min-height: 0; height: 100%; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-left { padding: 8px 12px; flex: none; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-stage.t-stage { height: auto; min-height: 0; flex: 1; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-dock { flex: none; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-class-context[open] { max-height: 35dvh; overflow: auto; }
}

/* Presentation keeps every rank visible and places desktop tools beside it. */
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-stage { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; overflow: auto; padding: 8px 20px; gap: 6px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-stage-head { flex: none; gap: 4px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-beat-h { display: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-beat-title { font-size: clamp(20px, 2vw, 28px); line-height: 1.25; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-board-workspace { min-height: 0; width: auto; max-width: 100%; gap: 6px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-board-wrap { width: min(100%, var(--presentation-board-size, 320px)); }
@media (min-width: 700px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-id { display: none; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] #t-top { flex-wrap: wrap; height: auto; min-height: 68px; padding: 8px 20px; gap: 8px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-back { width: auto; margin-right: auto; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-board-workspace { display: grid; grid-template-columns: minmax(0, var(--presentation-board-size, 320px)) 100px; align-items: center; gap: 6px 12px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-board-wrap { grid-column: 1; grid-row: 1; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-caption { grid-column: 1; grid-row: 2; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-board-tools { grid-column: 2; grid-row: 1 / 3; display: grid; grid-template-columns: repeat(2, 44px); gap: 8px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-board-tools button { padding: 6px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-board-tools .t-tool-name { display: none; }
}
@media (min-width: 700px) and (max-width: 1100px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] :is(.t-views, #t-top > .t-tutorial-help:not(#t-return-teach)) { display: none; }
}
@media (min-width: 700px) and (max-height: 450px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] .t-left { padding-bottom: 64px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] .t-class-context { position: fixed; bottom: 0; left: 0; z-index: 5; width: 248px; margin-left: 0; padding: 4px 12px; background: var(--lesson-sidebar); border-top: 1px solid var(--lesson-line); }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] .t-class-context summary { margin: 0; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] .t-class-context[open] .t-context-fields { position: fixed; top: var(--teach-toolbar-height, 68px); left: 248px; right: 0; max-height: 50dvh; overflow: auto; padding: 12px; background: var(--lesson-panel); border-bottom: 1px solid var(--lesson-line); }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='present'] .t-class-context { display: none; }
}

/* Keep the outline and complete chess squares readable in short windows. */
@media (max-width: 699px) and (max-height: 600px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] { height: auto; overflow: auto; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-view='teach'] .t-grid { height: auto; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-stage.t-stage { flex: none; height: 360px; min-height: 360px; }
}
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow { min-height: 0; padding-block: 4px; scroll-padding-block: 4px; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-flow button:hover { transform: none; }
body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-outline-footer { padding: 10px 12px; }
@media (max-height: 700px) and (min-width: 700px) {
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-session-identity { padding-bottom: 16px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-title { font-size: 21px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-session-eyebrow { margin-bottom: 8px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-grid { grid-template-rows: minmax(0, 1fr) 72px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference] .t-dock { padding: 10px 24px; gap: 12px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position { gap: 6px; padding-block: 4px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position figcaption { font-size: 20px; line-height: 1.25; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position .t-reading-meta { font-size: 12px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-position-tools { gap: 8px; }
  body.teach[data-teach-design='sample'][data-teach-focus='sample'][data-teach-reference][data-teach-reading='true'] .t-reading-activate { padding: 8px 16px; }
}
.homework-download{margin:16px 0 24px;padding:16px;border:1px solid var(--teach-border,#b2bdb4);border-radius:10px;max-width:100%}.homework-pdf-button{font:inherit;font-weight:600;min-height:44px;padding:11px 16px;max-width:100%;cursor:pointer}.homework-print-note,.homework-download-status{font-size:13px;line-height:1.5;margin:10px 0 0}.homework-download-status:empty{display:none}