/* Run your own incident exercise (/commons/tabletop, build/pages/tabletop.py). Builds on guides.css (.guide-item,
   .gd-body, .gd-table). On screen: scenarios with their injects, and participant sheets as cards. In print: the
   facilitator pack, each scenario and the close on a new page, then one page per participant sheet. tabletop.js adds
   the "one inject at a time" control (.tt-stepping) and prints one scenario or one sheet (.tt-printing + data-tt-keep). */
html:not(.js) [data-tt-print]{display:none!important}
.tt-hero-btns{margin-top:1.6rem}
.tt-btns{margin:1rem 0 .4rem}
.tt-kicker{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin:0 0 .6rem;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sun-ink)}
.tt-who{font-size:.95rem}
.tt-who strong,.tt-scenario .why strong{color:var(--text)}
.tt-read{margin:.8rem 0 1.2rem;padding:1rem 1.2rem;border-radius:14px;background:var(--callout);border:1px solid var(--callout-line);color:var(--callout-ink)}
.prose .tt-read p{margin:0}
.prose .tt-read p+p{margin-top:.4rem}
.prose .tt-read .tt-label{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--callout-strong);margin-bottom:.3rem}
.tt-inject{margin-top:2rem;padding-top:1.4rem;border-top:1px solid var(--line)}
.tt-inject h3{margin:0 0 .2rem}
.tt-inject h3:focus{outline:none}
.tt-inject h3:focus-visible{outline:2px solid var(--sun-ink);outline-offset:4px}
.tt-inject h4,.tt-sheet h4{font-size:.98rem;font-weight:600;color:var(--text);margin:1.2rem 0 .45rem}
.prose .tt-ask li,.prose .tt-good li{margin-bottom:.4rem}
.tt-good{padding:1rem 1.2rem 1rem 2.4rem!important;border-radius:14px;background:var(--callout-leaf);border:1px solid var(--callout-leaf-line);color:var(--callout-leaf-ink)}
.tt-good a{overflow-wrap:anywhere}
.tt-src{font-size:.85rem;color:var(--muted)}
.tt-src a{overflow-wrap:anywhere}
.tt-scenario>h3{margin-top:1.8rem}
.tt-roles li,.tt-rules li{margin-bottom:.55rem}
.tt-actions td{height:2.4rem;border-bottom:1px solid var(--line-2)}
.tt-actions th:first-child{width:60%}

/* One inject at a time (tabletop.js). Screen only: print always shows every inject. */
.tt-stepbar{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;margin:1.4rem 0 0}
.prose .tt-status{margin:0;font-size:.88rem;color:var(--muted)}
.tt-next{margin-top:1.4rem}
@media screen{.tt-stepping .tt-inject.tt-wait{display:none}}

/* Participant sheets */
.tt-sheet{margin-top:2rem;padding:1.4rem 1.5rem;border-radius:18px;background:var(--paper-3);border:1px solid var(--line)}
.tt-sheet h3{margin:0 0 .4rem}
.prose .tt-banner{margin:0 0 .8rem;padding:.35rem .6rem;border:1px solid var(--line-2);border-radius:8px;text-align:center;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text)}
.tt-sheet-note{font-weight:600;color:var(--text)}
.prose .tt-sheet-rules li,.prose .tt-sheet-links li{margin-bottom:.3rem}
.prose .tt-lines-label{margin-bottom:.3rem;font-size:.93rem}
.tt-lines{height:6.4rem;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(1.6rem - 1px),var(--line-2) calc(1.6rem - 1px),var(--line-2) 1.6rem)}
.tt-addr{display:block;font-family:var(--f-mono);font-size:.75rem;color:var(--muted);overflow-wrap:anywhere}

@media print{
  .gd-note,.tt-stepbar,.tt-next{display:none!important}
  .tt-main .gd-body{max-width:none}
  .tt-main .prose p,.tt-main .prose li,.tt-main .gd-table{font-size:9.5pt;line-height:1.4}
  .tt-main .prose .tt-src{font-size:8pt}
  .tt-kicker{break-after:avoid;page-break-after:avoid;margin-bottom:3pt}
  .tt-main .guide-item{padding:8pt 0}
  .tt-main .why{margin-bottom:6pt}
  .tt-inject h4,.tt-sheet h4,.tt-scenario>h3{font-weight:600;color:#000}
  .tt-read{padding:6pt 9pt;margin:5pt 0 8pt}
  .tt-good{padding:6pt 9pt 6pt 20pt!important}
  .prose .tt-ask li,.prose .tt-good li,.tt-roles li,.tt-rules li{margin-bottom:2pt}
  .tt-main .table-scroll{background:#fff!important;border-radius:0;margin:6pt 0;break-inside:avoid;page-break-inside:avoid}
  .tt-scenario,#closing,#sheets{break-before:page;page-break-before:always}
  .tt-scenario h2{font-size:18pt}
  .tt-read,.tt-good{background:#fff!important;color:#000!important;border:1pt solid #000;border-radius:0}
  .prose .tt-read .tt-label,.tt-kicker,.tt-src,.tt-addr{color:#000!important}
  .tt-read,.tt-ask,.tt-good li,.tt-roles li,.tt-rules li{break-inside:avoid;page-break-inside:avoid}
  .tt-inject{margin-top:12pt;padding-top:8pt;border-color:#999}
  .tt-inject h4,.tt-sheet h4{margin:7pt 0 3pt;font-size:10.5pt}
  .tt-actions td{height:22pt;border-bottom:.75pt solid #000}
  .tt-actions th,.tt-actions td{border-color:#000!important}
  .table-scroll{border-color:#000!important;overflow:visible}
  /* One page per participant sheet */
  .tt-sheet{break-before:page;page-break-before:always;break-inside:avoid;margin:0;padding:0;border:0;border-radius:0;background:#fff!important;font-size:10.5pt}
  .tt-sheet h3{font-size:17pt}
  .tt-sheet p,.tt-sheet li{margin-bottom:3pt}
  .prose .tt-banner{border:1.5pt solid #000;border-radius:0;color:#000!important;font-size:9pt}
  .tt-lines{height:168pt;background:repeating-linear-gradient(to bottom,transparent 0,transparent 23pt,#000 23pt,#000 24pt)}
  #sheets{padding:0;border:0}
  /* One scenario's script, or one sheet (tabletop.js): only the parts marked data-tt-keep */
  .tt-printing main>section:not(.tt-main),.tt-printing .tt-main aside,.tt-printing .tt-part:not([data-tt-keep]){display:none!important}
  .tt-printing .tt-scenario,.tt-printing #closing,.tt-printing #sheets,.tt-printing .tt-sheet{break-before:auto;page-break-before:auto}
  .tt-printing .tt-main{padding-top:0!important}
}
