/* Part 4 of 4 — split from the original styles.css (2026-08-27) to keep every file
   under 500 lines. Order matters; all four are linked from index.html in sequence. */
/* ============== RESPONSIVE / MOBILE ============== */
@media(max-width:860px){
  /* off-canvas sidebar */
  .shell{grid-template-columns:1fr}
  .sidebar{position:fixed;top:0;left:0;bottom:0;width:min(280px,82vw);z-index:60;transform:translateX(-100%);transition:transform .26s cubic-bezier(.4,0,.2,1);box-shadow:0 0 50px rgba(0,0,0,.4);overflow-y:auto}
  .shell.nav-open .sidebar{transform:translateX(0)}
  .nav-backdrop{display:block;position:fixed;inset:0;background:rgba(20,36,27,.5);z-index:55;opacity:0;pointer-events:none;transition:opacity .26s}
  .shell.nav-open .nav-backdrop{opacity:1;pointer-events:auto}
  .tb-burger{display:flex}
  .topbar{padding:11px 16px;gap:12px}
  .page{padding:22px 16px 56px}
  .page-head h1{font-size:24px}
  .tb-search{max-width:none}
  /* collapse multi-column grids */
  .ov-grid,.dash-top,.pillar-grid,.dash-bottom,.report-grid,.two-col,.general-grid,.tr-grid,.monthly-grid,.stat-grid,.audit-summary{grid-template-columns:1fr}
  .ov-attention{flex-wrap:wrap}.ova-sep{display:none}.ova-item{flex:1 1 42%}
  /* wide data tables scroll horizontally instead of breaking */
  .doc-table,.repo-fs,.permit-table,.crit-table,.crit-admin-table,.depts-table,.repo-admin-table,.adm-table,.tr-list{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .doc-table .dt-row{min-width:800px}
  .permit-table .permit-row{min-width:730px}
  .crit-table .crit-row{min-width:790px}
  .repo-fs .fs-row,.repo-fs .fs-head{min-width:660px}
  .adm-table .adm-row{min-width:640px}
  .tr-list .trl-row{min-width:820px}
  .act-table{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .act-table .act-row{min-width:880px}
  .perm-table{min-width:540px}
}
@media(max-width:560px){
  .tb-search{display:none}
  .ub-text{display:none}
  .lang-toggle{display:none}
  .notif-row{flex-wrap:wrap;row-gap:8px}
  .notif-row-main{margin-left:auto}
  .rq-actions{flex-wrap:wrap;gap:10px}
  .admin-toolbar{flex-wrap:wrap;gap:10px}
  .topbar{gap:8px}
  .page-head{flex-direction:column;align-items:stretch}
  .page-head .btn{align-self:flex-start}
  .ova-item{flex:1 1 100%}
  .modal,.modal-wide{width:96vw;max-height:92vh}
  .drawer{width:100vw !important}
  .ms-cstat{display:none}
  .filter-sel,.search-inline{flex:1 1 100%}
  .doc-filters,.repo-bar{flex-wrap:wrap}
  .qa-row{grid-template-columns:1fr}
}

/* ============== AUTO-GENERATED REPORT MODAL ============== */
.report-modal{width:min(940px,96vw);max-width:96vw;max-height:92vh;padding:0}
.rm-topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:20px 24px;border-bottom:1px solid var(--border)}
.rm-titlewrap{display:flex;gap:13px;align-items:flex-start}
.rm-icon{width:38px;height:38px;border-radius:10px;background:var(--ok-bg);color:var(--green-700);display:flex;align-items:center;justify-content:center;flex:none}
.rm-topbar h2{font-family:var(--serif);font-weight:500;font-size:20px;line-height:1.25}
.rm-meta{font-size:12px;color:var(--muted);margin-top:3px}
.rm-body{padding:20px 24px;overflow-y:auto;flex:1}
.rm-summary{display:flex;align-items:center;gap:26px;padding:16px 18px;background:var(--chip);border-radius:12px;margin-bottom:20px;flex-wrap:wrap}
.rm-counts{display:flex;gap:26px;flex-wrap:wrap}
.rm-counts>div{display:flex;flex-direction:column}
.rm-counts b{font-family:var(--serif);font-size:22px;color:var(--ink);line-height:1}
.rm-counts span{font-size:11.5px;color:var(--muted);margin-top:4px}
.rm-foot{display:flex;justify-content:flex-end;gap:10px;padding:15px 24px;border-top:1px solid var(--border)}

.rm-table{width:100%;font-size:13px}
.rm-row{display:grid;align-items:center;gap:12px;padding:9px 4px;border-bottom:1px solid var(--border)}
.rm-row:last-child{border-bottom:none}
.rm-head{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);border-bottom:1.5px solid var(--border-d)}
.rm-name{line-height:1.35}
.rm-ev{display:inline-flex;align-items:center;gap:5px;color:var(--ink-2);justify-content:flex-end}

/* self-assessment */
.rm-pillar{margin-bottom:22px}
.rm-pillar-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:6px}
.rm-pillar-head h4{font-size:14.5px;font-weight:700;color:var(--ink)}
.rm-pillar-tot{font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap}
.rm-sa .rm-row{grid-template-columns:56px 1fr 130px 60px}

/* evidence register */
.rm-reg .rm-row{grid-template-columns:2.2fr 1fr 1.3fr 110px 1.2fr}
.rm-doc{display:inline-flex;align-items:center;gap:8px;line-height:1.3}
.rm-codes{display:flex;flex-wrap:wrap;gap:4px}

/* readiness narrative */
.rm-verdict{display:flex;align-items:baseline;gap:14px;padding:14px 18px;background:var(--ok-bg);border-radius:12px;margin-bottom:20px}
.rm-verdict b{font-family:var(--serif);font-size:32px;color:var(--green-700);line-height:1}
.rm-verdict span{font-size:13.5px;color:var(--ink-2);line-height:1.5}
.rm-h{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:20px 0 10px}
.rm-scores{display:flex;flex-direction:column;gap:10px}
.rm-score-row{display:grid;grid-template-columns:230px 1fr 46px;align-items:center;gap:12px}
.rm-score-name{font-size:13px;color:var(--ink-2)}
.rm-score-pct{font-size:12.5px;font-weight:700;text-align:right}
.rm-narr{font-size:13.5px;line-height:1.6;color:var(--ink-2)}
.rm-gaplist,.rm-momentum{list-style:none;display:flex;flex-direction:column;gap:8px}
.rm-gaplist li{font-size:13px;color:var(--ink-2);display:flex;align-items:center;gap:9px}
.rm-momentum li{font-size:13px;color:var(--ink-2);display:inline-flex;align-items:center;gap:8px}

/* action plan */
.rm-ap-sum{display:flex;gap:26px;flex-wrap:wrap;margin-bottom:16px}
.rm-ap-sum span{font-size:12.5px;color:var(--muted)}
.rm-ap-sum b{font-family:var(--serif);font-size:18px;color:var(--ink);margin-right:5px}
.rm-ap-sum span.over b{color:var(--risk-d)}
.rm-aptable .rm-row{grid-template-columns:1.8fr 74px 70px 82px 108px 96px 128px}
.rm-over{color:var(--risk-d);font-weight:600}
.rm-prog{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.rm-prog .bar{width:60px}
.rm-empty{padding:36px;text-align:center;color:var(--muted);font-size:13.5px}

@media (max-width:880px){
  .rm-sa .rm-row,.rm-reg .rm-row,.rm-aptable .rm-row{grid-template-columns:1fr;gap:6px;padding:12px 4px}
  .rm-score-row{grid-template-columns:1fr 60px 40px}
  .rm-head{display:none}
}

/* scoped print: only the open report content prints */
@media print{
  body.printing-report{background:#fff}
  body.printing-report *{visibility:hidden !important}
  body.printing-report .report-modal,body.printing-report .report-modal *{visibility:visible !important}
  body.printing-report .drawer-wrap{position:static !important;background:none !important;backdrop-filter:none !important;display:block !important}
  body.printing-report .report-modal{position:absolute;left:0;top:0;width:100%;max-width:100%;max-height:none;box-shadow:none;border-radius:0;overflow:visible}
  body.printing-report .report-modal .rm-body{overflow:visible;max-height:none}
  body.printing-report .rm-foot,body.printing-report .rm-close{display:none !important}
}

/* ---- Certification year cycles (item 3) ---- */
/* Year selector in each certification's nav group header. */
.sb-cycle{display:flex;align-items:center;gap:6px;margin:2px 12px 6px;padding:4px 8px;border-radius:7px;
  font-size:11.5px;color:var(--muted);background:color-mix(in srgb,var(--muted) 8%,transparent)}
.sb-cycle svg{flex:0 0 auto;opacity:.75}
.sb-cycle-select{flex:1 1 auto;min-width:0;border:0;background:transparent;color:inherit;
  font:inherit;font-size:11.5px;cursor:pointer;padding:0;outline:none}
.sb-cycle-static{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Past / next-year cycles are tinted so the sidebar itself signals you are off the current year. */
.sb-cycle-past{color:var(--amber);background:color-mix(in srgb,var(--amber) 13%,transparent)}
.sb-cycle-next{color:var(--sC);background:color-mix(in srgb,var(--sC) 13%,transparent)}

/* Full-width banner on every per-audit screen when the year shown is not the current one. */
.cycle-banner{display:flex;align-items:center;gap:10px;margin:0 0 18px;padding:11px 15px;
  border-radius:10px;font-size:13.5px;line-height:1.4}
.cycle-banner svg{flex:0 0 auto}
.cycle-banner b{font-weight:600}
.cycle-banner-past{color:var(--amber);background:color-mix(in srgb,var(--amber) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--amber) 32%,transparent)}
.cycle-banner-next{color:var(--sC);background:color-mix(in srgb,var(--sC) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--sC) 32%,transparent)}
.cycle-banner-btn{margin-left:auto;flex:0 0 auto;border:1px solid currentColor;background:transparent;
  color:inherit;font:inherit;font-size:12.5px;padding:4px 11px;border-radius:7px;cursor:pointer}
.cycle-banner-btn:hover{background:color-mix(in srgb,currentColor 12%,transparent)}

/* Close-year control in Certifications admin. */
.cy-close-row{display:flex;align-items:flex-start;gap:12px;margin-top:14px;padding-top:14px;
  border-top:1px solid var(--line)}
.cy-close-copy{flex:1 1 auto;min-width:0}
.cy-close-copy .cy-sub{display:block;margin-top:3px;font-size:12px;color:var(--muted);line-height:1.45}
/* Month/day selects sit inline, not stretched full-width. */
.cy-close-row .mini-select{flex:0 0 auto;width:auto;min-width:92px}
/* Small explanatory hint under a form field (used by the backdatable document date). */
.field-hint{display:block;margin-top:5px;font-size:11.5px;color:var(--muted);line-height:1.45}

/* ---- Notifications tab (split out of Preferences 2026-08-24) ---- */
/* Events lay out in a responsive grid so 10 of them no longer make one 1761px column. */
.notif-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;align-items:start}
.notif-card{padding:15px 17px}
.notif-card.on{border-color:color-mix(in srgb,var(--green-700) 30%,var(--border))}
.notif-card-opts{display:flex;flex-wrap:wrap;gap:12px;margin-top:13px;align-items:flex-end}
.notif-card-opts .nopt .mini-select{min-width:0;width:100%}
.notif-card-opts .nopt{flex:1 1 128px;min-width:0}
.notif-mail-flag{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;font-size:11px;
  font-weight:600;color:var(--gold-d);background:color-mix(in srgb,var(--gold-d) 13%,transparent);
  padding:4px 9px;border-radius:20px;margin-top:2px}

/* ---- Broadcast tab ---- */
.bc-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.bc-textarea{width:100%;resize:vertical;min-height:170px;font:inherit;line-height:1.55;padding:11px 13px}
.bc-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.bc-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border);background:transparent;
  color:var(--ink);font:inherit;font-size:12.5px;padding:6px 12px;border-radius:20px;cursor:pointer}
.bc-chip:hover{border-color:var(--green-700)}
.bc-chip.on{background:color-mix(in srgb,var(--green-700) 12%,transparent);border-color:var(--green-700);font-weight:600}
.bc-chip-n{font-size:11px;color:var(--muted);background:var(--chip);padding:1px 6px;border-radius:10px}
.bc-people{margin-top:14px}
.bc-people-list{max-height:260px;overflow-y:auto;border:1px solid var(--border);border-radius:9px}
.bc-person{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--border);
  font-size:13px;cursor:pointer}
.bc-person:last-child{border-bottom:none}
.bc-person.on{background:color-mix(in srgb,var(--green-700) 8%,transparent)}
.bc-person-name{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-person-meta{flex:0 0 auto;font-size:11.5px;color:var(--muted)}
.bc-summary{margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}
.bc-count{font-size:13.5px}
.bc-count b{font-size:19px;font-family:var(--serif)}
.bc-warn{display:flex;align-items:center;gap:6px;margin-top:7px;font-size:12px;color:var(--amber)}
.bc-preview{border:1px solid var(--border);border-radius:9px;padding:12px 14px;background:var(--chip)}
.bc-preview-sub{font-weight:600;margin-bottom:6px}
.bc-preview-body{white-space:pre-wrap;font-size:13px;color:var(--muted);line-height:1.55}
@media (max-width:900px){ .bc-grid{grid-template-columns:1fr} }

/* ---- Master email switch ---- */
.email-off-banner{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding:11px 15px;
  border-radius:10px;font-size:13.5px;line-height:1.45;color:var(--amber);
  background:color-mix(in srgb,var(--amber) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--amber) 32%,transparent)}
.email-off-banner svg{flex:0 0 auto}
.owner-hint.email-off{color:var(--amber)}

/* ---- Broadcast: per-recipient failure list ---- */
.bc-failed{margin-top:14px;padding:12px 14px;border-radius:9px;
  color:var(--risk);background:color-mix(in srgb,var(--risk) 9%,transparent);
  border:1px solid color-mix(in srgb,var(--risk) 28%,transparent)}
.bc-failed-head{display:flex;align-items:center;gap:7px;font-weight:600;font-size:13px}
.bc-failed-list{margin:9px 0 0;padding:0;list-style:none;font-size:12.5px}
.bc-failed-list li{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;
  padding:5px 0;border-bottom:1px solid color-mix(in srgb,var(--risk) 15%,transparent)}
.bc-failed-list li:last-child{border-bottom:none}
.bc-failed-who{font-weight:600}
.bc-failed-addr{color:var(--muted);font-size:11.5px}
.bc-failed-why{margin-left:auto;font-size:11.5px;font-style:italic;opacity:.85}
.bc-failed-note{margin-top:9px;font-size:11.5px;color:var(--muted);line-height:1.45}

/* ---- GSTC Risk & Action (RnA) ---- */
.rna-areas{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.rna-area{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border);background:transparent;
  color:var(--ink);font:inherit;font-size:12.5px;padding:7px 13px;border-radius:20px;cursor:pointer}
.rna-area:hover{border-color:var(--green-700)}
.rna-area.active{background:var(--green-700);border-color:var(--green-700);color:#fff;font-weight:600}
.rna-area-n{font-size:11px;padding:1px 6px;border-radius:10px;background:var(--chip);color:var(--muted)}
.rna-area.active .rna-area-n{background:rgba(255,255,255,.22);color:#fff}
.seg-n{margin-left:6px;font-size:11px;opacity:.7}

.rna-table{display:flex;flex-direction:column;font-size:13px}
.rna-row{display:grid;grid-template-columns:44px minmax(0,2.6fr) 92px 104px minmax(0,1.2fr) 108px 96px;
  gap:10px;align-items:center;padding:11px 15px;border-bottom:1px solid var(--border);cursor:pointer}
.rna-row:last-child{border-bottom:none}
.rna-row:hover{background:var(--chip)}
.rna-head{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--muted);cursor:default;background:var(--chip)}
.rna-head:hover{background:var(--chip)}
.rna-row.done .rna-c-risk span{opacity:.6;text-decoration:line-through}
.rna-c-no{color:var(--muted);font-size:12px}
.rna-c-risk{display:flex;align-items:flex-start;gap:7px;min-width:0;font-weight:500;line-height:1.4}
.rna-chev{flex:0 0 auto;margin-top:2px;opacity:.5}
.rna-c-date,.rna-c-pic,.rna-c-result{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:12px;color:var(--muted)}
.rna-overdue{color:var(--risk);font-weight:600}
.rna-result{display:inline-block;padding:2px 8px;border-radius:11px;font-size:11px;font-weight:600;
  background:color-mix(in srgb,var(--green-700) 13%,transparent);color:var(--green-700)}
/* Result carries the state, so it carries the colour (owner, 2026-09-02).
   Identified = light yellow, Ongoing = ember, Implemented = bright green.
   The two warm shades are stated literally — styles.css has no light-yellow or ember token. */
.rna-result-identified{background:#fbf3cd;color:#8a6d12}
.rna-result-ongoing{background:#fae3cd;color:#b4571b}
.rna-result-implemented{background:var(--ok-bg);color:var(--ok)}

.rna-c-act{display:flex;gap:3px;justify-content:flex-end}

.rna-badge{display:inline-block;padding:3px 9px;border-radius:11px;font-size:11px;font-weight:600;white-space:nowrap}
.rna-critical{color:#fff;background:var(--risk)}
.rna-high{color:var(--risk);background:color-mix(in srgb,var(--risk) 15%,transparent)}
.rna-medium{color:var(--amber);background:color-mix(in srgb,var(--amber) 16%,transparent)}
.rna-low{color:var(--ok);background:color-mix(in srgb,var(--ok) 15%,transparent)}
.rna-none{color:var(--muted)}

.rna-detail{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px 22px;
  padding:4px 15px 16px 58px;border-bottom:1px solid var(--border);background:var(--chip)}
.rna-f-l{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.rna-f-v{font-size:12.5px;line-height:1.5;white-space:pre-wrap}

.rna-form .field{margin-bottom:13px}
.rna-ta{width:100%;resize:vertical;font:inherit;line-height:1.5;padding:9px 12px}
.rna-rating-preview{margin:-4px 0 13px;font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:8px}
.rna-err{display:flex;align-items:center;gap:7px;margin-top:6px;font-size:12.5px;color:var(--risk)}

@media (max-width:1100px){
  .rna-row{grid-template-columns:36px minmax(0,2fr) 86px 96px 92px;}
  .rna-c-pic,.rna-c-result{display:none}
  .rna-detail{padding-left:15px}
}

/* ---- User Guide (System → Guide) ---- */
.gd-page{max-width:1080px}
.gd-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:16px}
.gd-search{position:relative;display:flex;align-items:center;gap:9px;flex:1 1 320px;min-width:0;
  border:1px solid var(--border);background:var(--card);border-radius:10px;padding:0 12px;height:42px;color:var(--muted)}
.gd-search:focus-within{border-color:var(--green-700)}
.gd-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:14px;color:var(--ink);height:100%}
.gd-clear{border:0;background:transparent;cursor:pointer;color:var(--muted);display:flex;padding:4px}
.gd-clear:hover{color:var(--ink)}
.gd-roles-filter{display:flex;flex-wrap:wrap;gap:6px}
.gd-rf{border:1px solid var(--border);background:transparent;color:var(--ink);font:inherit;font-size:12.5px;
  padding:7px 13px;border-radius:20px;cursor:pointer;white-space:nowrap}
.gd-rf:hover{border-color:var(--green-700)}
.gd-rf.active{background:var(--green-700);border-color:var(--green-700);color:#fff;font-weight:600}
.gd-you{opacity:.7;font-weight:400}

.gd-resultbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;
  font-size:13px;color:var(--muted)}
.gd-linkbtn{border:0;background:transparent;color:var(--green-700);font:inherit;font-size:12.5px;
  font-weight:600;cursor:pointer;padding:2px 6px}
.gd-linkbtn:hover{text-decoration:underline}

.gd-toc{padding:16px 18px;margin-bottom:16px}
.gd-toc-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;
  font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.gd-toc-actions{display:flex;gap:4px}
.gd-toc-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:2px}
.gd-toc-list button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;border:0;background:transparent;
  font:inherit;font-size:13px;color:var(--ink);padding:7px 8px;border-radius:7px;cursor:pointer}
.gd-toc-list button:hover{background:var(--chip);color:var(--green-700)}
.gd-toc-n{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;flex:0 0 auto}

.gd-sections{display:flex;flex-direction:column;gap:11px}
.gd-sec{overflow:hidden}
.gd-sec-head{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:0;background:transparent;
  font:inherit;padding:15px 18px;cursor:pointer;color:var(--ink)}
.gd-sec-head:hover{background:var(--chip)}
.gd-open .gd-sec-head{border-bottom:1px solid var(--border)}
.gd-ic{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;
  background:var(--chip);color:var(--green-700)}
.gd-sec-title{flex:1;min-width:0;font-size:15px;font-weight:600}
.gd-roles{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.gd-role-chip{font-size:10.5px;padding:2px 8px;border-radius:10px;background:var(--chip);color:var(--muted);white-space:nowrap}
.gd-role-chip.gd-all{color:var(--green-700);font-weight:600}
.gd-chev{flex:0 0 auto;opacity:.55}

.gd-body{padding:6px 20px 20px 64px}
.gd-lead{font-size:14px;line-height:1.65;color:var(--ink-2);margin:12px 0 4px}
.gd-block{margin-top:16px}
.gd-h{font-size:13px;font-weight:700;letter-spacing:.01em;margin:0 0 6px;color:var(--ink)}
.gd-p{font-size:13.5px;line-height:1.68;margin:0 0 8px;color:var(--ink-2)}
.gd-steps,.gd-list{margin:6px 0 8px;padding-left:20px}
.gd-steps li,.gd-list li{font-size:13.5px;line-height:1.62;margin-bottom:5px;color:var(--ink-2)}
.gd-steps{counter-reset:none}
.gd-note,.gd-warn{display:flex;align-items:flex-start;gap:9px;margin-top:10px;padding:11px 13px;
  border-radius:9px;font-size:13px;line-height:1.6}
.gd-note{background:var(--chip);color:var(--ink-2)}
.gd-note svg{flex:0 0 auto;margin-top:2px;color:var(--green-700)}
.gd-warn{background:color-mix(in srgb,var(--risk) 10%,transparent);color:var(--ink-2)}
.gd-warn svg{flex:0 0 auto;margin-top:2px;color:var(--risk)}

.gd-table-wrap{margin-top:10px;overflow-x:auto}
.gd-table{border-collapse:collapse;width:100%;min-width:520px;font-size:13px}
.gd-table th,.gd-table td{padding:9px 11px;border-bottom:1px solid var(--border);text-align:left}
.gd-table th{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);
  background:var(--chip);white-space:nowrap}
.gd-table td{color:var(--ink-2)}
.gd-table .gd-c{text-align:center;width:112px}
.gd-yes{color:var(--ok)}
.gd-no{color:var(--muted);opacity:.5}
.gd-caption{font-size:12px;color:var(--muted);margin:8px 0 0}

.gd-hit{background:color-mix(in srgb,var(--amber) 38%,transparent);color:inherit;border-radius:3px;padding:0 2px}
.gd-empty{display:flex;flex-direction:column;align-items:center;gap:11px;padding:44px 20px;color:var(--muted);text-align:center}
.gd-foot{margin:22px 0 0;font-size:12.5px;color:var(--muted);text-align:center;line-height:1.6}

@media (max-width:820px){
  .gd-body{padding-left:20px}
  .gd-roles{display:none}
}
/* Printing the guide. The shell is a fixed-height grid (.main overflow:hidden, .content
   overflow-y:auto), which clips ANY print to the first viewport — that was the "only page 1
   prints" bug. While the guide is mounted (body.printing-guide) the layout flattens so the
   whole document flows across pages. What prints is exactly what is expanded on screen:
   collapsed sections render no body in the DOM, so nothing needs forcing either way. */
@media print{
  body.printing-guide .sidebar,
  body.printing-guide .topbar,
  body.printing-guide .gd-toolbar,
  body.printing-guide .gd-toc,
  body.printing-guide .gd-resultbar,
  body.printing-guide .gd-chev,
  body.printing-guide .gd-foot,
  body.printing-guide .gd-roles{display:none !important}
  body.printing-guide .shell{display:block;height:auto}
  body.printing-guide .main{display:block;overflow:visible}
  body.printing-guide .content{overflow:visible;height:auto;padding:0}
  body.printing-guide{background:#fff}
  body.printing-guide .gd-page{max-width:none}
  body.printing-guide .gd-sec{border:0;box-shadow:none;break-inside:auto}
  body.printing-guide .gd-sec-head{padding-left:0;cursor:default}
  body.printing-guide .gd-body{padding-left:0}
  body.printing-guide .gd-block{break-inside:avoid}
  body.printing-guide .gd-table-wrap{overflow:visible}
}

/* ---- RnA: rating filter + all-areas view ---- */
.rna-filters{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center}
/* Open/Completed sits UNDER the rating chips (owner, 2026-09-02): the two used to
   share a wrapping row and broke in arbitrary places on a narrow window. */
.rna-filters-stack{flex-direction:column;align-items:flex-start;gap:10px}
.rna-rates{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.rna-rates-l{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--muted);margin-right:2px}
.rna-rate-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);
  background:transparent;color:var(--ink);font:inherit;font-size:12.5px;padding:6px 12px;
  border-radius:20px;cursor:pointer;white-space:nowrap}
.rna-rate-chip:hover{border-color:var(--green-700)}
.rna-rate-chip.active{background:var(--green-700);border-color:var(--green-700);color:#fff;font-weight:600}
.rna-rate-chip.active .rna-area-n{background:rgba(255,255,255,.22);color:#fff}
/* Each rating chip carries its own colour when active, so the filter reads like the badges it filters. */
.rna-rc-critical.active{background:var(--risk);border-color:var(--risk)}
.rna-rc-high.active{background:var(--risk);border-color:var(--risk);opacity:.85}
.rna-rc-medium.active{background:var(--amber);border-color:var(--amber);color:#3a2c05}
.rna-rc-medium.active .rna-area-n{background:rgba(0,0,0,.14);color:#3a2c05}
.rna-rc-low.active{background:var(--ok);border-color:var(--ok)}

/* All-areas view adds an AREA column ahead of the risk text. */
.rna-row.rna-wide{grid-template-columns:44px 128px minmax(0,2.3fr) 92px 104px minmax(0,1.1fr) 104px 96px}
.rna-c-area{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;
  color:var(--muted);font-weight:500}

@media (max-width:1200px){
  .rna-row.rna-wide{grid-template-columns:40px 110px minmax(0,2fr) 88px 98px 92px}
  .rna-row.rna-wide .rna-c-pic,.rna-row.rna-wide .rna-c-result{display:none}
}
@media (max-width:900px){
  .rna-row.rna-wide{grid-template-columns:36px minmax(0,2fr) 86px 92px}
  .rna-row.rna-wide .rna-c-area,.rna-row.rna-wide .rna-c-date{display:none}
}