/* The online workbook (workbook.html). Uses the site tokens from site.css. */

.wb-app{display:grid;grid-template-columns:240px minmax(0,1fr);gap:2rem;align-items:start}
.wb-side{position:sticky;top:6rem;display:flex;flex-direction:column;gap:1.25rem}
.wb-nav{display:flex;flex-direction:column;gap:.25rem}
.wb-navh{font-family:var(--mono);font-size:.65rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin:.75rem 0 .25rem}
.wb-navlist{list-style:none;margin:0;padding:0}
.wb-navlist button{display:block;width:100%;text-align:left;background:none;border:0;border-left:2px solid transparent;padding:.4rem .6rem;font:inherit;font-size:.9rem;color:var(--ink-2);cursor:pointer;border-radius:0}
.wb-navlist button:hover{color:var(--ink);background:var(--surface-2)}
.wb-navlist button[aria-current="page"]{border-left-color:var(--accent);color:var(--ink);font-weight:600;background:var(--surface-2)}
.wb-navlist button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.wb-tools{display:flex;flex-direction:column;gap:.5rem;border-top:1px solid var(--rule);padding-top:1rem}
.wb-btn{justify-content:center}
.wb-danger{color:var(--accent-ink)}
.wb-main{min-width:0}
.wb-main:focus{outline:none}
#wb-app{scroll-margin-top:6.5rem}
.wb-gate{max-width:640px}

.wb-sechead{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap}
.wb-h1{font-size:clamp(1.5rem,2.4vw,2rem);margin:0 0 .5rem}
.wb-h2{font-size:1.2rem;margin:2rem 0 .75rem}
.wb-h3{font-size:1rem;margin:1.5rem 0 .5rem;color:var(--ink)}
.wb-p{color:var(--ink-2);max-width:72ch;margin:.5rem 0 1rem}
.wb-empty{color:var(--muted);font-style:italic}
.wb-ok{color:var(--covered)}
.wb-hint{display:block;font-size:.8rem;color:var(--muted);margin:.1rem 0 .3rem;max-width:72ch}
.wb-calc{font-size:.875rem;color:var(--ink-2);background:var(--surface-2);border-left:3px solid var(--rule-strong);padding:.6rem .8rem;margin:1rem 0}
.wb-callout{background:var(--covered-wash);border-left:3px solid var(--covered);padding:.8rem 1rem;margin:1rem 0;max-width:72ch;color:var(--ink-2)}
.wb-steps{max-width:72ch;color:var(--ink-2);padding-left:1.2rem}
.wb-steps li{margin:.3rem 0}
.wb-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin:1rem 0}

.wb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.9rem 1.1rem;margin:.6rem 0}
.wb-field{display:flex;flex-direction:column;min-width:0}
.wb-field.wb-wide{grid-column:1 / -1}
.wb-field.wb-inline{flex-direction:row;align-items:center;gap:.6rem;margin:.5rem 0 1rem}
.wb-field label{font-size:.85rem;font-weight:600;color:var(--ink);margin-bottom:.2rem}
.wb-field input,.wb-field select,.wb-field textarea{font:inherit;font-size:.95rem;color:var(--ink);background:var(--surface);border:1px solid var(--rule-strong);border-radius:6px;padding:.5rem .6rem;width:100%;min-width:0;box-sizing:border-box}
.wb-field.wb-inline select{width:auto}
.wb-field textarea{resize:vertical;min-height:4.5rem}
.wb-field input:focus,.wb-field select:focus,.wb-field textarea:focus{outline:2px solid var(--accent);outline-offset:0;border-color:var(--accent)}

.wb-card{border:1px solid var(--rule);border-radius:8px;padding:.25rem 1rem;margin:.75rem 0;background:var(--surface)}
.wb-card[open]{padding-bottom:.75rem}
.wb-card>summary,.wb-row>summary{cursor:pointer;padding:.7rem 0;font-weight:600;list-style-position:outside}
.wb-row{border-bottom:1px solid var(--rule);padding:0 .25rem}
.wb-row>summary{font-weight:400}
.wb-sumtitle{font-weight:600}
.wb-item{border-top:1px solid var(--rule);padding:.8rem 0}
.wb-item.wb-sub{padding-left:1.25rem}
.wb-q{margin:0 0 .3rem;max-width:80ch}

.wb-tag,.wb-tier{display:inline-block;font-size:.72rem;font-weight:600;border-radius:999px;padding:.1rem .55rem;margin-left:.4rem;background:var(--unknown-wash);color:var(--unknown);vertical-align:middle}
.wb-tier-high,.wb-st-review,.wb-st-exclusion{background:var(--accent-wash);color:var(--accent-ink)}
.wb-tier-moderate,.wb-st-missing,.wb-st-never{background:var(--licence-wash);color:var(--licence)}
.wb-tier-low,.wb-st-met,.wb-st-not{background:var(--covered-wash);color:var(--covered)}

.wb-scroll{overflow-x:auto;margin:.5rem 0 1rem}
.wb-table{border-collapse:collapse;width:100%;font-size:.875rem}
.wb-table th,.wb-table td{border:1px solid var(--rule);padding:.45rem .55rem;text-align:left;vertical-align:top}
.wb-table thead th{background:var(--surface-2);font-weight:600}
.wb-table tbody th{font-weight:500}

.wb-print{display:none}

@media (max-width:860px){
  .wb-app{grid-template-columns:1fr;gap:1rem}
  .wb-side{position:static}
  .wb-nav{flex-direction:row;flex-wrap:wrap;gap:.25rem}
  .wb-navh{width:100%;margin:.5rem 0 0}
  .wb-navlist{display:contents}
  .wb-navlist button{border-left:0;border:1px solid var(--rule);border-radius:999px;padding:.3rem .7rem;font-size:.82rem;width:auto}
  .wb-navlist button[aria-current="page"]{border-color:var(--accent)}
  .wb-tools{flex-direction:row;flex-wrap:wrap;align-items:center;padding-top:.75rem}
  .wb-tools .fine{width:100%;margin:0}
  .wb-tools .wb-btn{flex:1 1 auto;padding:.45rem .7rem;font-size:.85rem}
}

@media print{
  @page{size:landscape;margin:12mm}
  body{background:#fff !important}
  .wb-noprint,.wb-side,.wb-screen,.wb-sechead,.wb-main>div>.wb-p,.skip,.s360-cc,[class^="s360c-"],[class*=" s360c-"]{display:none !important}
  .wb-section{padding:0 !important;border:0 !important}
  .wb-section .wrap{width:100% !important}
  .wb-app{display:block}
  .wb-print{display:block;color:#000;font-size:9pt}
  .wb-print h1{font-size:15pt;margin:0 0 6pt}
  .wb-print h2{font-size:11pt;margin:10pt 0 4pt}
  .wb-pmeta{font-size:7.5pt;color:#444;margin:0 0 6pt}
  .wb-pblock{break-before:page}
  .wb-pblock:first-of-type{break-before:auto}
  .wb-ptable{border-collapse:collapse;width:100%;margin:0 0 8pt}
  .wb-ptable th,.wb-ptable td{border:.5pt solid #777;padding:2.5pt 4pt;text-align:left;vertical-align:top;white-space:pre-wrap;word-break:normal;overflow-wrap:break-word;hyphens:manual}
  .wb-ptable thead th{background:#eee !important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .wb-ptable thead{display:table-header-group}
  .wb-ptable tr{break-inside:avoid}
  .wb-ptable thead tr:has(th:empty:first-child + th:empty){display:none}
}
