/* Teacher packs: a worksheet catalogue (teachers/) and print-first worksheets (teachers/<slug>/).
   On screen each pack is a sheet of paper lying on the page (paper in both themes: the "desk" is the theme,
   the worksheet is always paper). In print the sheet is the page: Name / Date / Class lines, ruled lines under
   each discussion question, and the teacher copy on its own page. */

.t-teachers{
  /* paper tokens (page-specific): ink on warm paper, all text ≥ 7:1, rules ≥ 3:1 */
  --paper:#fffdf7; --paper-ink:#14233a; --paper-dim:#465566; --paper-rule:#7e8894; --paper-hair:#d9d5cb; --paper-accent:#1d5f96; --paper-tint:#f3efe4;
  --sheet-shadow:0 1px 0 rgba(20,35,58,.06),0 2px 6px rgba(20,35,58,.08),0 18px 40px -12px rgba(20,35,58,.22);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .t-teachers{--paper:#f6f2e8;--paper-tint:#ebe5d6;--sheet-shadow:0 0 0 1px rgba(0,0,0,.4),0 24px 60px -16px rgba(0,0,0,.7)}}
:root[data-theme="dark"] .t-teachers{--paper:#f6f2e8;--paper-tint:#ebe5d6;--sheet-shadow:0 0 0 1px rgba(0,0,0,.4),0 24px 60px -16px rgba(0,0,0,.7)}

/* ---------- catalogue */
.cat-intro{max-width:62ch;color:var(--dim);margin-bottom:28px}
.cat-intro b{color:var(--ink)}
.cats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:0 40px;border-top:1px solid var(--line-strong)}
@media (min-width:900px){.cats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.cats > li{border-bottom:1px solid var(--line)}
.cat{display:grid;grid-template-columns:84px minmax(0,1fr);gap:20px;align-items:start;padding:20px 0;color:var(--ink);text-decoration:none}
.cat-b{display:flex;flex-direction:column;gap:2px;min-width:0}
.cat-n{font-size:var(--t-xs);color:var(--dim)}
.cat-y{font:400 var(--t-sm) var(--display);color:var(--dim)}
.cat-t{font:400 var(--t-h3)/1.15 var(--display);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:.15em;transition:text-decoration-color var(--d-1)}
.cat:hover .cat-t,.cat:focus-visible .cat-t{text-decoration-color:var(--blue)}
.cat-p{margin-top:6px;font-size:var(--t-sm);color:var(--ink);line-height:1.5}
.cat-c{margin-top:6px;font-size:var(--t-xs);color:var(--dim);font-weight:700}
/* a thumbnail of the worksheet itself */
.thumb{position:relative;display:flex;flex-direction:column;gap:5px;width:84px;aspect-ratio:210/297;padding:10px 9px;background:var(--paper);border-radius:2px;box-shadow:var(--sheet-shadow);
  transition:transform var(--d-2) var(--ease-out)}
.cat:hover .thumb{transform:translateY(-3px) rotate(-1.5deg)}
.thumb .tn{font:400 9px/1.1 var(--display);color:var(--paper-ink);margin-bottom:3px}
.thumb .tl{display:block;height:2px;background:var(--paper-hair);width:100%}
.thumb .tl.s{width:70%}.thumb .tl.m{width:85%;margin-bottom:5px}
.thumb .tq{display:block;height:9px;border-bottom:1px solid var(--paper-rule);opacity:.6}

/* ---------- the desk and the sheet */
.t-teachers .pagehead .wrap{padding-bottom:18px}
.desk{padding-block:24px 32px;background:linear-gradient(var(--bg3),var(--bg) 420px)}
.sheet-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;max-width:210mm;margin:0 auto 20px}
.sheet-tools p{margin:0 0 0 4px;font-size:var(--t-sm)}
@media (max-width:560px){.sheet-tools .btn{font-size:var(--t-sm);padding-inline:16px}.sheet-tools p{flex-basis:100%;margin:0}}
.no-js .sheet-tools .btn{display:none}
.sheet{
  --ink:var(--paper-ink); --dim:var(--paper-dim); --line:var(--paper-hair); --line-strong:var(--paper-rule); --blue:var(--paper-accent); --bg3:var(--paper-tint);
  max-width:210mm;margin:0 auto;padding:clamp(22px,6vw,64px) clamp(18px,6vw,68px) clamp(24px,5vw,48px);background:var(--paper);color:var(--ink);
  box-shadow:var(--sheet-shadow);border-radius:2px;color-scheme:light;font-size:var(--t-body);line-height:1.58}
.sheet + .sheet{margin-top:28px}
.sheet a{color:var(--blue)}
.sheet :focus-visible{outline-color:var(--blue)}
.ws-head{border-bottom:2px solid var(--ink);padding-bottom:16px;margin-bottom:8px}
.ws-kicker{display:flex;justify-content:space-between;gap:12px;margin:0 0 18px;font-size:var(--t-xs);font-weight:700;color:var(--dim)}
.ws-title{margin:0;font-size:clamp(1.875rem,1.4rem + 2vw,2.75rem);line-height:1.05}
.ws-title .num{display:block;margin-top:6px;font-size:var(--t-lg);color:var(--dim)}
.ws-lines{display:grid;grid-template-columns:2.2fr 1fr 1fr;gap:10px 24px;margin-top:26px;font-size:var(--t-sm);font-weight:700}
.ws-lines span{display:flex;align-items:flex-end;gap:8px;padding-bottom:2px}
.ws-lines span::after{content:"";flex:1;border-bottom:1px solid var(--line-strong);height:1.4em}
@media (max-width:560px){.ws-lines{grid-template-columns:1fr 1fr}.ws-lines span:first-child{grid-column:1/-1}}
.ws-s{padding-top:22px}
.ws-s h3{display:flex;align-items:baseline;gap:12px;margin:0 0 10px;font-size:var(--t-h3)}
.ws-s h3::after{content:"";flex:1;border-bottom:1px solid var(--line)}
.ws-s p{max-width:68ch}
.ws-ch{font-size:var(--t-sm)}
.ws-hint{font-size:var(--t-sm);color:var(--dim)}

/* mini-timeline: a two-column table */
.mini{border-collapse:collapse;width:100%;font-size:var(--t-sm);line-height:1.5}
.mini th{width:4.2rem;padding:8px 12px 8px 0;text-align:left;vertical-align:top;font:600 1.0625rem/1.35 var(--display);color:var(--ink);letter-spacing:0;text-transform:none;border-bottom:1px solid var(--line)}
.mini td{padding:8px 0;vertical-align:top;border-bottom:1px solid var(--line)}
.msrc{color:var(--dim);white-space:normal}
.msrc a{color:var(--dim);padding-block:4px}

/* discussion questions with ruled answer lines */
.dq{margin:0;padding-left:1.4em}
.dq > li{padding-left:.3em;margin-bottom:14px}
.dq > li::marker{font-family:var(--display);font-weight:600}
.dq p{margin:0}
.rls{margin-top:2px}
.rl{display:block;height:2.1em;border-bottom:1px solid var(--line-strong)}
.js .rls{opacity:.75}

/* quiz: options laid out as circled letters */
.quiz{margin:0;padding-left:1.4em}
.quiz > li{padding-left:.3em;margin-bottom:16px;break-inside:avoid}
.quiz > li::marker{font-family:var(--display);font-weight:600}
.quiz p{margin:0 0 6px}
.opts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 22px}
.opts li{display:inline-flex;align-items:center;gap:8px;font:400 1.0625rem var(--display);font-variant-numeric:lining-nums tabular-nums}
.opts b{display:inline-grid;place-items:center;flex:none;width:1.7em;height:1.7em;border:1px solid var(--line-strong);border-radius:50%;font:700 .75rem var(--body)}
/* long options (sentences) and ordering items: one per line, in the body face */
.opts.stack{flex-direction:column;gap:6px}
.opts.stack li{align-items:flex-start;font:400 var(--t-body)/1.45 var(--body)}
.opts.stack li b{margin-top:.05em}
/* "Source question" tag: on the sheet and the teacher copy */
.q-tag{display:inline-block;margin-right:6px;padding:1px 8px;border:1px solid var(--line-strong);border-radius:999px;font:700 var(--t-xs)/1.5 var(--body);color:var(--ink);vertical-align:.1em;white-space:nowrap}
/* short answer: ruled lines */
.q-short .rls{margin-top:0}
/* ordering: a row of boxes to fill, earliest to latest */
.ord{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0 0;font-size:var(--t-xs);color:var(--dim);font-weight:700}
.ord-b{display:inline-block;width:2.6em;height:2.1em;border:1px solid var(--line-strong);border-radius:3px}
.ord.wide .ord-b{width:7.5em}
@media (max-width:560px){.ord.wide{flex-wrap:nowrap}.ord.wide .ord-l{display:none}.ord.wide .ord-b{flex:1 1 0;min-width:0;width:auto}}
.ord-a{color:var(--line-strong);font-weight:400}
.ws-foot{margin-top:28px;padding-top:10px;border-top:1px solid var(--line);font-size:var(--t-xs);color:var(--dim)}

/* the teacher copy */
.sheet.key{background:var(--paper);background-image:linear-gradient(90deg,var(--paper-accent) 0 6px,transparent 6px)}
.answers{margin:0;padding-left:1.4em}
.answers > li{padding:12px 0 14px .3em;border-bottom:1px solid var(--line);break-inside:avoid}
.answers > li::marker{font-family:var(--display);font-weight:600}
.answers p{margin:0;max-width:68ch}
.a-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:4px!important;font-size:var(--t-xs);font-weight:700;color:var(--dim)}
.a-meta .q-tag{margin:0}
.a-q{font-size:var(--t-sm);color:var(--dim)}
.a-key{margin-top:6px!important}
.a-note{margin-top:6px!important;font-size:var(--t-sm)}
.a-src{margin-top:6px!important;font-size:var(--t-sm);color:var(--dim)}
.a-src .a-l{font-weight:700}
.a-src a{padding-block:4px}
.a-src .msrc a{color:var(--dim)}

.next{max-width:210mm;margin:28px auto 0}
.next a{display:flex;align-items:baseline;gap:14px;min-height:44px;padding:16px 0;border-top:1px solid var(--line-strong);color:var(--ink);text-decoration:none;font:400 var(--t-h3)/1.2 var(--display)}
.next a .num{font-size:var(--t-sm);color:var(--dim)}
.next a:hover{color:var(--blue)}

/* ---------- print: the sheet is the page */
@page{margin:14mm 14mm 16mm}
@media print{
  .t-teachers .pagehead,.sheet-tools,.next{display:none!important}
  .desk{background:none;padding:0}
  .desk .wrap{padding:0;max-width:none}
  .sheet{box-shadow:none;max-width:none;padding:0;background:#fff;font-size:11pt;
    --ink:#000;--dim:#333;--line:#bbb;--line-strong:#777;--blue:#000}
  .sheet + .sheet{margin-top:0}
  .sheet.key{break-before:page;background-image:none}
  .print-nokey .sheet.key{display:none!important}
  .ws-title{font-size:22pt}
  .ws-lines{margin-top:14pt}
  .ws-s{padding-top:12pt;break-inside:auto}
  .ws-s h3{font-size:14pt;break-after:avoid}
  .mini tr{break-inside:avoid}
  .dq > li{break-inside:avoid}
  .rls{opacity:1}
  .rl{height:2.3em}
  .msrc a::after{content:none!important}
  .quiz > li,.answers > li{break-inside:avoid}
  .a-src a[data-url]::after{content:" (" attr(data-url) ")";font-size:8.5pt;color:#444;word-break:break-all}
  .q-tag{border-color:#000}
  .ws-foot{font-size:8.5pt}
  .cite{display:none}
  .sheet.key{background:#fff}
  /* the student worksheet fits two pages (one sheet, photocopied double-sided): tighter type and spacing in print
     only (every row, question and answer line is kept); the screen sheet is unchanged */
  .sheet:not(.key){font-size:9.5pt;line-height:1.4}
  .sheet:not(.key) .ws-title{font-size:19pt}
  .sheet:not(.key) .ws-lines{margin-top:8pt}
  .sheet:not(.key) .ws-s{padding-top:7pt}
  .sheet:not(.key) .ws-s h3{font-size:12pt;margin-bottom:4pt}
  .sheet:not(.key) .ws-s p{margin-bottom:4pt}
  .sheet:not(.key) .mini{font-size:8.5pt;line-height:1.35}
  .sheet:not(.key) .mini th{font-size:9.5pt;padding:2.5pt 8pt 2.5pt 0;width:3.4rem}
  .sheet:not(.key) .mini td{padding:2.5pt 0}
  .sheet:not(.key) .dq > li{margin-bottom:5pt}
  .sheet:not(.key) .rl{height:1.6em}
  .sheet:not(.key) .quiz > li{margin-bottom:6pt}
  .sheet:not(.key) .opts li{font-size:10pt}
  .sheet:not(.key) .opts.stack li{font-size:9.5pt}
  .sheet:not(.key) .ord{margin-top:4pt}
  .sheet:not(.key) .ws-foot{margin-top:8pt;padding-top:4pt}
}