/* dashboard.css — extracted from dashboard.html's inline <style> on 2026-06-18 per Standards §1.5 (code separation). Loaded via <link> in <head>. */
  :root{
    --bg:#eaf0f8; --panel:#ffffff; --panel2:#f2f6fc; --line:#dbe3ef;
    --text:#1b2740; --muted:#69748b; --accent:#2563eb;
    --green:#15924f; --green-bg:rgba(21,146,79,.12);
    --amber:#b9810c; --amber-bg:rgba(185,129,12,.15);
    --red:#d23b3b;  --red-bg:rgba(210,59,59,.10);
    --grey:#7b8699; --grey-bg:rgba(123,134,153,.13);
    --track:#e6ecf5; --ringnavy:#1c3c74;
  }
  html[data-theme="dark"]{
    --bg:#0f1420; --panel:#171e2e; --panel2:#1d2638; --line:#2a3650;
    --text:#e8edf6; --muted:#93a0b8; --accent:#5b8cff;
    --green:#2fbf71; --green-bg:rgba(47,191,113,.14);
    --amber:#f5b740; --amber-bg:rgba(245,183,64,.14);
    --red:#ef5b5b;  --red-bg:rgba(239,91,91,.14);
    --grey:#5b6680; --grey-bg:rgba(91,102,128,.12);
    --track:#0c111c; --ringnavy:#0e2247;
  }
  html{transition:background .25s}
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;background:var(--bg);color:var(--text);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    -webkit-font-smoothing:antialiased;line-height:1.45}
  /* Use the screen. 94vw fills the viewport with ~3% margin on each side
     on any monitor; capped at 1600px so 4K displays don't go oceanic.
     Banner, recs panel, and 8-card grid all inherit and grow together. */
  .wrap{width:94vw;max-width:1600px;margin:0 auto;padding:0 22px;box-sizing:border-box}

  /* ---------- COVER (title page, fills viewport, no scroll needed) ---------- */
  .cover{min-height:100vh;display:flex;flex-direction:column;padding:14px 0 24px;position:relative}
  /* LOCKED CENTERING: cover-top is a positioning context. cover-left and auditor are
     pinned to the corners with position:absolute (removed from flow). cover-title is the
     ONLY in-flow child, centered via margin:auto within the .wrap container. cover-center
     below shares the same .wrap parent, so its centered children sit on the exact same
     vertical axis as cover-title. Nothing in the flanks can shift the title left or right. */
  .cover-top{position:relative;min-height:150px;display:block;padding:0}
  .cover-left{position:absolute;top:0;left:0;display:flex;flex-direction:column;align-items:flex-start;gap:12px;z-index:2;max-width:180px}
  .brandblock{display:inline-block;text-align:center}
  .brandblock .sb-mark{display:none}
  .brandblock .sb-mark{flex:none}
  .brandblock > div{text-align:center}
  .brandblock .brandname{font-size:13px;letter-spacing:.05em;color:var(--accent);font-weight:700;line-height:1.1}
  .brandblock .brandsub{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:2px}
  /* Customer-visible dashboard version. Visible enough to confirm a deploy
     went through; sits in the brandsub line between "Security Health Audit"
     and "A JJS Partners Solution". Bumped by 0.01 on every edit. */
  .sb-ver{font-weight:700;color:#E4B53D;letter-spacing:.06em}
  /* OLD: absolute-positioned 240px below buttons for the big-PGT design.
     Repositioned 2026-06-04 to flow inline below the Audit buttons per
     Johnnie's mockup — now compact and lives directly under the audit row. */
  .pgt-panel{position:relative;display:block;z-index:5;width:auto;margin-top:4px;perspective:none}
  .pgt-img{display:block;width:280px;max-width:100%;height:auto;border-radius:12px;margin-left:22px;transform:rotateY(14deg) rotateX(-3deg) rotateZ(-1.5deg);transform-origin:left center}
  .pgt-svg{display:none;flex-direction:column;gap:22px;padding:24px 22px;background:transparent;border-radius:12px;transform:rotateY(14deg) rotateX(-3deg) rotateZ(-1.5deg);transform-origin:left center}
  /* PGT shrunk dramatically 2026-06-04 per Johnnie's mockup — they were
     dominating the left margin and stealing focus from the executive view.
     Now a compact strip directly under Audit Upload/Export. */
  .pgt-row{display:flex;align-items:center;gap:7px;margin:0}
  .pgt-row svg{width:18px;height:18px;flex:none}
  .pgt-row .pgt-lbl{font-family:Montserrat,Arial,sans-serif;font-size:11px;font-weight:700;letter-spacing:1.4px;color:#B88914;border-bottom:1px solid #B88914;padding:1px 0}
  .pgt-panel{margin-top:6px}
  .pgt-svg{display:flex;flex-direction:column;gap:4px}
  /* Hide the dark-mode raster PGT image — it was sized for the old big block.
     In compact mode we always render the SVG strip so it scales cleanly. */
  .pgt-img{display:none !important}
  .pgt-light-only{display:block !important}
  [data-theme="light"] .pgt-dark-only{display:none}
  [data-theme="light"] .pgt-light-only{display:flex}
  [data-theme="dark"] .pgt-light-only,html:not([data-theme="light"]) .pgt-light-only{display:none}
  /* Dark-mode adjustments to PGT panel for illuminated signage consistency */
  [data-theme="dark"] .pgt-panel{filter:saturate(1.05)}

  .conf-pill{display:inline-block;padding:5px 16px;border-radius:20px;background:rgba(184,137,20,.08);color:#B88914;font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;margin:12px 0 4px;border:1px solid #B88914}
  [data-theme="dark"] .conf-pill{background:rgba(184,137,20,.12);color:#E8C97A;border-color:#B88914}
  .logo{background:#fff;border:1px solid var(--line);border-radius:11px;padding:10px 15px;display:inline-flex;align-items:center;justify-content:center;
    box-shadow:0 1px 0 rgba(0,0,0,.25)}
  .logo img{height:46px;width:auto;display:block}
  .logo svg{height:46px;width:auto;display:block}
  .logo.needload{border-color:var(--red);box-shadow:0 0 0 1.5px var(--red)}
  .logo-load{cursor:pointer;display:inline-flex;flex-direction:column;align-items:center;gap:5px;
    border:none;background:none;padding:0}
  .logo-load:hover .logo{outline:2px solid var(--accent);outline-offset:2px}
  /* Audit Upload / Audit Save buttons shrunk ~25% vs the brand-logo frame.
     The brand .logo on the left of the dashboard keeps its full size; only
     the action buttons inside .logo-load get scaled down. */
  .logo-load .logo{padding:7px 11px;border-radius:9px}
  .logo-load .logo img,
  .logo-load .logo svg{height:35px}
  .load-caption{font-size:9px;color:var(--red);letter-spacing:.09em;text-transform:uppercase;font-weight:700}
  .load-caption.loaded{color:var(--green)}
  /* Audit Save button — visible only after a scan, glows to call attention. */
  .logo-export{display:none}
  .logo-export .load-caption{color:var(--accent)}
  .logo-export .logo{border-color:var(--accent);color:var(--accent);animation:export-glow 2.2s ease-in-out infinite;transition:border-color .25s,color .25s}
  body.audit-loaded .logo-export{display:inline-flex}
  /* After a successful export, stop the glow and show the green "done" color.
     The class is cleared at the start of every new scan so the glow resumes. */
  .logo-export.exported .logo{animation:none;border-color:var(--green);color:var(--green)}
  .logo-export.exported .load-caption{color:var(--green)}
  @keyframes export-glow{
    0%, 100%{box-shadow:0 0 0 0 rgba(76,201,240,0.0)}
    50%{box-shadow:0 0 0 10px rgba(76,201,240,0), 0 0 24px 6px rgba(76,201,240,0.35)}
  }
  body.pdfgen .logo-export{display:none !important}
  .auditor{position:absolute;top:0;right:0;display:flex;flex-direction:row;align-items:center;gap:12px;z-index:20;max-width:240px}
  .auditor .logo{background:transparent;border:none;box-shadow:none;padding:0}
  .auditor .logo img{height:78px;width:auto;display:block;filter:drop-shadow(0 1px 2px rgba(0,0,0,.06))}
  .logo.logo-upload{background:transparent;border:1px dashed var(--line);box-shadow:none;padding:14px 22px;color:var(--muted)}
  .logo.logo-upload:hover{border-color:var(--accent);color:var(--accent)}
  .menubtn{margin-top:2px;background:transparent;border:1px solid var(--line);border-radius:8px;padding:0;cursor:pointer;transition:.12s;display:inline-flex;align-items:center;justify-content:center;width:38px;height:32px}
  .menubtn:hover{border-color:var(--accent);background:rgba(91,140,255,.08)}
  .menubtn .bars{display:inline-flex;flex-direction:column;gap:4px;width:18px}
  .menubtn .bars span{display:block;height:2px;background:var(--text);border-radius:1px;width:100%;transition:.12s}
  .menubtn:hover .bars span{background:var(--accent)}
  .menu-pop{position:absolute;right:0;top:100%;margin-top:8px;display:none;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 6px 24px rgba(0,0,0,.18);padding:6px;min-width:180px;z-index:80;flex-direction:column;gap:2px}
  .menu-pop.show{display:flex}
  .menu-item{background:transparent;border:none;color:var(--text);font-size:13px;text-align:left;padding:9px 13px;border-radius:6px;cursor:pointer;font-family:inherit}
  .menu-item:hover{background:rgba(91,140,255,.12);color:var(--accent)}
  .menu-sep{height:1px;background:var(--line);margin:4px 6px;opacity:.7}
  .logo-fallback{font-weight:750;font-size:20px;color:#0f1420;white-space:nowrap}

  .cover-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
    text-align:center;gap:9px;padding:0 0 16px;position:relative}
  .brand{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
  .cover-title{display:block;max-width:calc(100% - 420px);margin:0 auto;text-align:center;padding-top:4px}
  .cover-title .brand{font-size:13px;letter-spacing:.2em}
  .cover-title .brandname{font-size:15px;letter-spacing:.05em;color:var(--accent);font-weight:700}
  .cover-title .brandsub{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:3px}
  .cover-title h1.tenant{font-size:24px;margin:6px 0 0}
  h1.tenant{font-size:30px;margin:0;font-weight:700;color:var(--accent)}
  /* 2026-06-04: min-height bumped 440 → 540 to fully contain the satellite
     ring (radius 232px from center). At 440px the top satellite (Secure
     Score) was rendering ABOVE the scorering boundary into the gauge-toggle
     row, and the bottom satellite (Identity) was rendering BELOW the boundary
     onto the heroTitle "Overall posture" line. 540 gives the ring proper
     containment with ~24px of buffer on each side. */
  .scorering{margin:2px 0;min-height:540px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:relative}
  /* (v1.72) Boot-loader — spinning VerityPoint logo, shown until
     integration.js's mountHalo() wipes #scorering and takes over.
     The wrapper sets `perspective` so the child's rotateY renders as
     a true 3D coin-spin around the vertical axis (NOT a 2D z-rotation
     that would look like a clock face). preserve-3d on the logo so
     the back face renders cleanly when it rotates past 180°. */
  .sb-boot{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:18px;padding-top:140px;width:100%;min-height:480px;
    /* perspective gives the logo's rotateY visual depth. Larger value =
       flatter spin; smaller = more dramatic foreshortening. 800px is
       cinematic-but-credible for a 96px logo. */
    perspective:800px;
  }
  .sb-boot-logo-wrap{
    width:96px;height:96px;display:flex;align-items:center;justify-content:center;
    /* Preserve 3D context for the child so rotateY isn't flattened by
       the wrapper's default `transform-style: flat`. */
    transform-style:preserve-3d;
  }
  .sb-boot-logo{
    width:100%;height:100%;object-fit:contain;display:block;
    /* Coin-spin around the vertical Y axis — left-to-right rotation.
       transform-origin defaults to center, which is what we want here.
       2.4s per revolution is the "calm but unmistakably alive" speed
       (faster reads as urgent, slower reads as broken). `linear` keeps
       the rotation perceptually constant — eased curves would look like
       the spin is "catching" each revolution. */
    animation:sb-coin-spin 2.4s linear infinite;
    backface-visibility:visible;
    transform-style:preserve-3d;
  }
  @keyframes sb-coin-spin{
    0%  { transform: rotateY(0deg); }
    100%{ transform: rotateY(360deg); }
  }
  /* Boot logo failed to load (404 / slow deploy): hide it so the spinner area
     is empty rather than a broken-image box. Toggled by boot.js. */
  .sb-boot-logo.sb-asset-broken{ display:none !important; }
  .sb-boot-label{
    font-size:12px;letter-spacing:0.16em;text-transform:uppercase;
    color:var(--muted);font-weight:600;
    /* Subtle pulse so the label feels paired with the spinning logo
       rather than a static caption stranded beneath an active animation. */
    animation:sb-boot-pulse 2.4s ease-in-out infinite;
  }
  @keyframes sb-boot-pulse{
    0%,100% { opacity: 0.55; }
    50%     { opacity: 1; }
  }
  /* Honor user preference for reduced motion — replace continuous rotation
     and pulse with a single fade-in so the screen still doesn't look dead. */
  @media (prefers-reduced-motion: reduce) {
    .sb-boot-logo{ animation: sb-boot-fadein 0.5s ease-out both; }
    .sb-boot-label{ animation: sb-boot-fadein 0.8s ease-out both; }
    @keyframes sb-boot-fadein { from { opacity: 0; } to { opacity: 1; } }
  }
  /* (v1.73) Stalled-boot state — applied to .sb-boot by the 25s watchdog
     in integration.js when #scanHalo never appears. Three deliberate moves:
     (1) Kill the coin-spin and the label pulse — a stalled boot must NOT
         look like healthy progress; the visual cue is what tells the user
         to act.
     (2) Drop the logo opacity so the eye is drawn to the new refresh button
         instead of staying on the (now-static) logo.
     (3) Reveal the refresh button + support pointer that were hidden in
         the markup. Never auto-reloads — manual only, per design. */
  .sb-boot.sb-boot-stalled .sb-boot-logo{ animation: none; opacity: 0.55; }
  .sb-boot.sb-boot-stalled .sb-boot-label{ animation: none; opacity: 0.85; }
  .sb-boot-stalled-block{
    display:flex;flex-direction:column;align-items:center;gap:10px;
    margin-top:6px;max-width:360px;text-align:center;
  }
  .sb-boot-refresh-btn{
    font-family:inherit;font-size:14px;font-weight:600;
    padding:10px 22px;border-radius:10px;cursor:pointer;
    background:var(--accent,#4cc9f0);color:#001525;border:0;
    transition:filter 0.15s ease, transform 0.05s ease;
  }
  .sb-boot-refresh-btn:hover{ filter:brightness(1.08); }
  .sb-boot-refresh-btn:active{ transform:translateY(1px); }
  .sb-boot-refresh-btn:focus-visible{ outline:2px solid var(--accent,#4cc9f0); outline-offset:3px; }
  .sb-boot-stalled-help{
    font-size:12px;color:var(--muted);line-height:1.5;
  }
  .sb-boot-stalled-help a{ color:var(--accent,#4cc9f0); text-decoration:underline; }

  /* ============================================================
     FIRST-SCAN ORIENTATION OVERLAY (_showFirstScanOrientationIfNew)
     ============================================================
     Styling moved off inline style= attributes per Standards §1.5.2. */
  .sb-orient-backdrop{position:fixed;inset:0;background:rgba(0,0,0,0.78);z-index:400;display:flex;align-items:center;justify-content:center;padding:24px}
  .sb-orient-card{background:var(--panel,#122849);border:1px solid var(--accent,#4cc9f0);border-radius:14px;max-width:560px;width:100%;padding:28px 32px;box-shadow:0 24px 60px rgba(0,0,0,0.5)}
  .sb-orient-eyebrow{font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--accent,#4cc9f0);font-weight:700;text-align:center;margin-bottom:8px}
  .sb-orient-h{margin:0 0 14px;color:var(--text,#e7ecf3);font-size:22px;font-weight:700;text-align:center;line-height:1.3}
  .sb-orient-accent{color:var(--accent,#4cc9f0)}
  .sb-orient-lede{margin:0 0 18px;font-size:14.5px;color:var(--ink-2,#cfd8e6);line-height:1.6}
  .sb-orient-list{margin:0 0 22px;padding-left:22px;font-size:14px;color:var(--ink-2,#cfd8e6);line-height:1.75}
  .sb-orient-actions{display:flex;justify-content:center;gap:10px}
  .sb-orient-go{background:var(--accent,#4cc9f0);color:#001525;border:0;border-radius:9px;padding:10px 22px;font-weight:700;font-size:14px;cursor:pointer}
  .sb-orient-foot{text-align:center;margin-top:14px;font-size:11.5px;color:var(--muted,#8aa0bf)}

  /* ============================================================
     TRIAL MODE — Phase 4 Free Snapshot (v1.78)
     ============================================================
     Applied when window.SB_TRIAL_STATE.active is true. The worst-scoring
     satellite pill stays visible as the teaser; the other seven get the
     blur filter, severity label overlay, lock icon, and a click-to-upgrade
     handler. A persistent banner sits above the scoring area driving
     conversion. */
  .sb-trial-blurred .ssat-pill{ filter: blur(10px); opacity: 0.85; }
  .sb-trial-blurred .ssat-pill .ssat-name,
  .sb-trial-blurred .ssat-pill .ssat-score{ pointer-events: none; }
  /* Overlay anchors to .scan-sat (position:absolute already, serves as
     containing block) and sits above .ssat-pill so the severity label and
     lock stay sharp while the pill underneath is blurred. */
  .sb-trial-blurred .sb-trial-overlay{
    position:absolute; inset:0; display:flex; flex-direction:column;
    align-items:center; justify-content:center; gap:4px;
    background: rgba(8,18,28,0.78);
    border-radius: 16px; cursor: pointer;
    border: 1px solid rgba(255,255,255,0.06); padding: 6px 8px;
    color:#fff; font-family:inherit; font-size:11px; font-weight:700;
    letter-spacing:0.04em; line-height:1.2;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.05s ease;
  }
  .sb-trial-blurred .sb-trial-overlay:hover{
    background: rgba(8,18,28,0.86);
    border-color: rgba(228,181,61,0.55);
  }
  .sb-trial-blurred .sb-trial-overlay:active{ transform: scale(0.985); }
  .sb-trial-blurred .sb-trial-sev{
    text-transform: uppercase; font-size:10.5px; letter-spacing:0.10em; font-weight:800;
  }
  .sb-trial-blurred .sb-trial-lock{ font-size:14px; }
  .sb-trial-blurred .sb-trial-cta{
    font-size:9.5px; opacity:0.85; text-transform:uppercase; letter-spacing:0.10em;
    border-bottom: 1px dotted rgba(255,255,255,0.55); padding-bottom: 1px;
  }
  /* Severity colors mirror the existing tier palette. */
  .sb-trial-sev-critical .sb-trial-sev{ color:#FF6B72; }
  .sb-trial-sev-moderate .sb-trial-sev{ color:#E4B53D; }
  .sb-trial-sev-watch    .sb-trial-sev{ color:#F0CB58; }
  .sb-trial-sev-ok       .sb-trial-sev{ color:#5BD17E; }
  .sb-trial-sev-unknown  .sb-trial-sev{ color:#8AA1B3; }

  /* (v1.88) Organizational Posture card-level blur — twin to the satellite
     pill blur. The Org Posture view is the post-scan destination, so this
     is the surface a trial visitor spends the most time on. Cards have richer
     content than pills (grade + label + "so what" + Ask AI), so the overlay
     is larger and the severity label more prominent. */
  .biz-card.sb-trial-blurred-card{ position:relative; overflow:hidden; }
  .biz-card.sb-trial-blurred-card > *:not(.sb-trial-card-overlay){
    filter: blur(7px); opacity: 0.55;
    transition: filter 0.15s ease, opacity 0.15s ease;
  }
  .sb-trial-card-overlay{
    position:absolute; inset:0; z-index:5;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px;
    background: rgba(8,18,28,0.65);
    border:1px solid rgba(255,255,255,0.06); border-radius: inherit;
    cursor:pointer; padding:16px; text-align:center;
    color:#fff; font-family:inherit;
    transition: background 0.15s ease, border-color 0.15s ease;
  }
  .sb-trial-card-overlay:hover{
    background: rgba(8,18,28,0.78);
    border-color: rgba(228,181,61,0.55);
  }
  .sb-trial-card-sev{
    display:inline-block; font-size:12px; letter-spacing:0.14em;
    text-transform:uppercase; font-weight:800; padding:5px 12px;
    border-radius:999px; border:1px solid currentColor;
  }
  .sb-trial-card-lock{ font-size:28px; }
  .sb-trial-card-cta{
    font-size:12px; letter-spacing:0.08em; text-transform:uppercase; font-weight:700;
    color: var(--gold, #E4B53D);
    border-bottom: 1px dotted rgba(228,181,61,0.55); padding-bottom:1px;
  }
  /* Severity-color variants for the card overlay — same palette as satellites. */
  .sb-trial-blurred-card.sb-trial-sev-critical .sb-trial-card-sev{ color:#FF6B72; }
  .sb-trial-blurred-card.sb-trial-sev-moderate .sb-trial-card-sev{ color:#E4B53D; }
  .sb-trial-blurred-card.sb-trial-sev-watch    .sb-trial-card-sev{ color:#F0CB58; }
  .sb-trial-blurred-card.sb-trial-sev-ok       .sb-trial-card-sev{ color:#5BD17E; }
  .sb-trial-blurred-card.sb-trial-sev-unknown  .sb-trial-card-sev{ color:#8AA1B3; }
  /* Teaser card — the worst-scoring biz-card, shown in full. Gold ring tells
     the user "this is what you can see; the others are locked." */
  .biz-card.sb-trial-teaser-card{
    box-shadow: 0 0 0 2px rgba(228,181,61,0.55), 0 0 22px rgba(228,181,61,0.18);
    border-color: rgba(228,181,61,0.55) !important;
  }

  /* ============================================================
     TRIAL MODE — STRIPPED-DOWN UI LOCKDOWN (v1.89)
     ============================================================
     The Free Snapshot must NOT give away anything beyond:
       - One Organizational Posture card (worst-domain teaser)
       - The other 7 cards severity-labeled + blurred + click-to-upgrade
       - The persistent subscribe banner
     Hide every other premium surface so trial users can't navigate around
     the lockdown or download premium artifacts. */
  /* Tabs other than Organizational Posture — hide Tech Telemetry + Scorecard. */
  body.sb-trial-mode .gauge-toggle .gt-btn[data-g="octa"],
  body.sb-trial-mode .gauge-toggle .gt-btn[data-g="bars"]{ display:none !important; }
  /* Leadership Briefing pill (opens premium PDF/preview window). */
  body.sb-trial-mode #briefTogglePill{ display:none !important; }
  /* MS Licensing Utilization pill (premium analytics). */
  body.sb-trial-mode .gauge-toggle-row .pill-licensing,
  body.sb-trial-mode .lic-toggle-pill,
  body.sb-trial-mode #licUtilPill{ display:none !important; }
  /* Audit Upload + Audit Save buttons (left brand column). */
  body.sb-trial-mode #loadBtn,
  body.sb-trial-mode #exportBtn{ display:none !important; }
  /* Print / Save PDF dropdown (entire wrap, not just the button). */
  body.sb-trial-mode .printbtn-wrap,
  body.sb-trial-mode #printbtnMain{ display:none !important; }
  /* Next Steps modal trigger — premium action plan. */
  body.sb-trial-mode .next-steps-btn{ display:none !important; }
  /* Hamburger menu — kill the whole thing in trial; nothing in there is
     accessible to a non-customer (Cloud audit storage, Personalization,
     User Manual, Leadership Briefing). Subscribe to unlock. */
  body.sb-trial-mode #menuBtn,
  body.sb-trial-mode .menubtn{ display:none !important; }
  /* Demo mode + theme buttons (bottom-left) — trial isn't demo. */
  body.sb-trial-mode #demoBtn,
  body.sb-trial-mode #themeBtn{ display:none !important; }
  /* Ask AI buttons on each biz-card — premium analysis surface. */
  body.sb-trial-mode .biz-card .ask-ai-btn,
  body.sb-trial-mode .biz-card-ai{ display:none !important; }
  /* Hide detail-link affordance on blurred cards (clicking the lock overlay
     handles the upgrade modal; the corner link would conflict). */
  body.sb-trial-mode .biz-card.sb-trial-blurred-card .biz-card-detail{
    pointer-events:none; opacity:0.35;
  }
  /* "Top Recommendations" — per-item lockdown (v1.92 per Johnnie 2026-06-18).
     Show #1 as a teaser (most-impactful action visible), blur #2 and #3 each
     with their own click-to-upgrade overlay. Header + #1 are fully visible
     to anchor the prospect; #2 and #3 are the conversion hooks. */
  body.sb-trial-mode .biz-rec.sb-trial-rec-blurred{
    position: relative; overflow: hidden;
  }
  body.sb-trial-mode .biz-rec.sb-trial-rec-blurred > *:not(.sb-trial-rec-overlay){
    filter: blur(6px); opacity: 0.55; pointer-events: none;
    transition: filter 0.15s ease, opacity 0.15s ease;
  }
  .sb-trial-rec-overlay{
    position:absolute; inset:0; z-index:5;
    display:flex; flex-direction:row; align-items:center; justify-content:center; gap:10px;
    background: rgba(8,18,28,0.74); border:1px solid rgba(228,181,61,0.40);
    border-radius: inherit; cursor:pointer; padding:10px 14px; text-align:center;
    color:#fff; font-family:inherit;
    transition: background 0.15s ease, border-color 0.15s ease;
  }
  .sb-trial-rec-overlay:hover{
    background: rgba(8,18,28,0.86); border-color: rgba(228,181,61,0.65);
  }
  .sb-trial-rec-overlay .sb-trial-rec-lock{ font-size: 16px; }
  .sb-trial-rec-overlay .sb-trial-rec-cta{
    font-size:11.5px; letter-spacing:0.10em; text-transform:uppercase; font-weight:800;
    color: var(--gold, #E4B53D);
    border-bottom: 1px dotted rgba(228,181,61,0.55); padding-bottom:1px;
  }

  /* (v1.92) Overall grade — blur the LETTER but keep the parent's tier
     color showing through. The `filter: blur()` doesn't change the rendered
     color, only smudges the letterform — so a red F becomes an unreadable
     red blob, signalling "critical grade" without disclosing what grade. */
  body.sb-trial-mode .scan-halo-grade{
    filter: blur(8px);
    /* keep position + sizing; preserve the data-tier color via the parent's
       existing rule (.scan-halo[data-tier="red"] .scan-halo-grade { color:red } */
  }
  /* Hero title with "Overall posture — 55/100 (F)" — keep the score readable
     but blur the letter-grade parenthetical. Easiest path: blur the whole
     string then re-render via JS without the (F) parenthetical. Simpler
     fallback used here: blur the entire hero text grade portion. */
  body.sb-trial-mode #heroTitle{
    /* leave the prose visible; only the parenthetical grade gets stripped
       in JS (see _stripHeroGradeForTrial in integration.js). No blur here. */
  }

  /* Board Deck preview thumbnail — option 4B per Johnnie 2026-06-18.
     A landscape card sized like a single slide, showing a stylized preview
     image with "Subscribe to download" overlay. Lives below the org posture
     cards (the one exception to "nothing below the cards" because Johnnie
     wants the prospect to know the board deck exists). */
  .sb-trial-board-preview{ display:none; }
  body.sb-trial-mode .sb-trial-board-preview{
    display:block; max-width: 760px; margin: 28px auto 18px;
    background: rgba(8,18,28,0.45); border: 1px solid rgba(228,181,61,0.40);
    border-radius: 14px; padding: 18px 20px;
  }
  .sb-trial-board-eyebrow{
    font-size: 11px; letter-spacing: 0.20em; text-transform: uppercase;
    font-weight: 800; color: #E4B53D; margin-bottom: 8px;
  }
  .sb-trial-board-title{
    font-size: 17px; font-weight: 700; color: #fff; margin: 0 0 12px;
  }
  .sb-trial-board-thumb-wrap{
    position: relative; aspect-ratio: 16/9; border-radius: 10px;
    overflow: hidden; background: #0e2540; border: 1px solid rgba(120,170,220,0.18);
    cursor: pointer; margin-bottom: 10px;
  }
  .sb-trial-board-thumb-wrap svg{ width: 100%; height: 100%; display: block; }
  .sb-trial-board-thumb-overlay{
    position: absolute; inset: 0; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 10px;
    background: rgba(8,18,28,0.55); transition: background 0.15s;
  }
  .sb-trial-board-thumb-wrap:hover .sb-trial-board-thumb-overlay{
    background: rgba(8,18,28,0.72);
  }
  .sb-trial-board-thumb-overlay .sb-trial-board-lock{ font-size: 32px; }
  .sb-trial-board-thumb-overlay .sb-trial-board-cta{
    display: inline-block; background: var(--gold, #E4B53D); color: #1a1206;
    font-weight: 800; font-size: 13px; letter-spacing: 0.04em;
    padding: 9px 18px; border-radius: 8px; text-decoration: none;
  }
  .sb-trial-board-fine{
    font-size: 12px; color: var(--ink-2, #C7D5E0); line-height: 1.5; margin: 0;
  }
  /* (v1.91 — Johnnie 2026-06-18) Domain Breakdown section is KEPT VISIBLE
     in trial mode, but every card inside it is blurred with a domain-named
     severity overlay. Gives the prospect proof that the deeper detail
     exists ("Microsoft Secure Score · 46% · LOCKED") without leaking the
     numbers themselves. Everything *below* the Domain Breakdown (insurance
     scaffolds, trend print, the detail-section footer) stays hidden. */
  body.sb-trial-mode .more-below,
  body.sb-trial-mode #moreBelow,
  body.sb-trial-mode .below-fold,
  body.sb-trial-mode .footer-export,
  body.sb-trial-mode .audit-footer,
  body.sb-trial-mode .detail > footer,
  body.sb-trial-mode #insNotesPrint,
  body.sb-trial-mode #insPrintFull,
  body.sb-trial-mode #trendPrintFull,
  body.sb-trial-mode #pdfScaffold{ display:none !important; }

  /* Domain Breakdown — blur every card with a per-domain severity overlay. */
  body.sb-trial-mode .detail .grid > .card,
  body.sb-trial-mode .detail .grid > div{
    position: relative; overflow: hidden;
  }
  body.sb-trial-mode .detail .grid > .card > *:not(.sb-trial-domain-overlay),
  body.sb-trial-mode .detail .grid > div > *:not(.sb-trial-domain-overlay){
    filter: blur(7px); opacity: 0.50; pointer-events: none;
    transition: filter 0.15s ease, opacity 0.15s ease;
  }
  .sb-trial-domain-overlay{
    position:absolute; inset:0; z-index:5;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
    background: rgba(8,18,28,0.72); border:1px solid rgba(228,181,61,0.40);
    border-radius: inherit; cursor:pointer; padding:18px; text-align:center;
    color:#fff; font-family:inherit;
    transition: background 0.15s ease, border-color 0.15s ease;
  }
  .sb-trial-domain-overlay:hover{
    background: rgba(8,18,28,0.84);
    border-color: rgba(228,181,61,0.70);
  }
  .sb-trial-domain-title{
    font-size:14px; font-weight:800; color:#fff; letter-spacing:0.02em;
    margin-bottom:4px;
  }
  .sb-trial-domain-sev{
    display:inline-block; font-size:11px; letter-spacing:0.14em; text-transform:uppercase;
    font-weight:800; padding:4px 11px; border-radius:999px;
    border:1px solid currentColor;
  }
  .sb-trial-domain-lock{ font-size:24px; }
  .sb-trial-domain-cta{
    font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; font-weight:700;
    color: var(--gold, #E4B53D);
    border-bottom: 1px dotted rgba(228,181,61,0.55); padding-bottom:1px;
  }
  .sb-trial-domain-overlay.sb-trial-sev-critical .sb-trial-domain-sev{ color:#FF6B72; }
  .sb-trial-domain-overlay.sb-trial-sev-moderate .sb-trial-domain-sev{ color:#E4B53D; }
  .sb-trial-domain-overlay.sb-trial-sev-watch    .sb-trial-domain-sev{ color:#F0CB58; }
  .sb-trial-domain-overlay.sb-trial-sev-ok       .sb-trial-domain-sev{ color:#5BD17E; }
  .sb-trial-domain-overlay.sb-trial-sev-unknown  .sb-trial-domain-sev{ color:#8AA1B3; }

  /* Sticky floating "Subscribe to see the Full Report" CTA — bottom-center,
     fixed position, follows the user as they scroll the trial dashboard.
     Always visible so the prospect never has to scroll to find the next
     action. Z-index above the cards but below the upgrade modal. */
  .sb-trial-sticky-cta{ display:none; }
  body.sb-trial-mode .sb-trial-sticky-cta{
    display:inline-flex; align-items:center; gap:10px;
    position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%);
    z-index: 9000;
    background: var(--gold, #E4B53D); color: #1a1206;
    font-family: inherit; font-size: 15px; font-weight: 800; letter-spacing: 0.02em;
    padding: 14px 28px; border-radius: 999px; text-decoration: none;
    border: 0; cursor: pointer;
    box-shadow: 0 10px 28px rgba(0,0,0,0.45), 0 0 0 1px rgba(228,181,61,0.55), 0 0 28px rgba(228,181,61,0.20);
    animation: sb-trial-sticky-pulse 3.6s ease-in-out infinite;
  }
  body.sb-trial-mode .sb-trial-sticky-cta:hover{ filter: brightness(1.06); }
  body.sb-trial-mode .sb-trial-sticky-cta:active{ transform: translateX(-50%) translateY(1px); }
  body.sb-trial-mode .sb-trial-sticky-cta .sb-trial-sticky-icon{
    display:inline-block; width:18px; height:18px; line-height:1; font-size:16px;
  }
  @keyframes sb-trial-sticky-pulse{
    0%   { box-shadow: 0 10px 28px rgba(0,0,0,0.45), 0 0 0 1px rgba(228,181,61,0.55), 0 0 12px rgba(228,181,61,0.10); }
    50%  { box-shadow: 0 10px 28px rgba(0,0,0,0.45), 0 0 0 1px rgba(228,181,61,0.85), 0 0 36px rgba(228,181,61,0.30); }
    100% { box-shadow: 0 10px 28px rgba(0,0,0,0.45), 0 0 0 1px rgba(228,181,61,0.55), 0 0 12px rgba(228,181,61,0.10); }
  }
  @media (prefers-reduced-motion: reduce) {
    body.sb-trial-mode .sb-trial-sticky-cta{ animation: none; }
  }
  /* PGT (Protect / Grow / Thrive) strip in the brand row — premium framing. */
  body.sb-trial-mode .pgt-strip,
  body.sb-trial-mode .pgt-band{ display:none !important; }
  /* Scan halo "Print/save PDF" floating button bottom-right. */
  body.sb-trial-mode #printPdfFloat,
  body.sb-trial-mode .print-pdf-float{ display:none !important; }

  /* Teaser pill — the worst-scoring domain, shown in full. Gold ring tells the
     user "this is what you can see; the others are locked." */
  .sb-trial-teaser .ssat-pill{
    box-shadow: 0 0 0 2px rgba(228,181,61,0.55), 0 0 22px rgba(228,181,61,0.18);
  }

  /* Persistent subscribe banner */
  .sb-trial-banner{
    background: linear-gradient(90deg, rgba(228,181,61,0.18), rgba(228,181,61,0.06));
    border: 1px solid rgba(228,181,61,0.45);
    border-radius: 12px;
    margin: 12px auto 20px;
    padding: 12px 18px;
    max-width: 1200px;
    display: none;
  }
  .sb-trial-banner.sb-trial-banner-visible{ display: block; }
  .sb-trial-banner-inner{
    display:flex; align-items:center; justify-content:space-between;
    gap: 18px; flex-wrap: wrap;
  }
  .sb-trial-banner-text{
    color: var(--ink, #fff); font-size: 14px; line-height: 1.4;
  }
  .sb-trial-banner-text strong{ color: var(--gold, #E4B53D); letter-spacing: 0.02em; }
  .sb-trial-banner-cta{
    display:inline-block; background: var(--gold, #E4B53D); color: #1a1206;
    font-weight: 800; font-size: 13.5px; letter-spacing: 0.02em;
    padding: 10px 18px; border-radius: 10px; text-decoration: none;
    transition: filter 0.15s ease, transform 0.05s ease;
  }
  .sb-trial-banner-cta:hover{ filter: brightness(1.08); }
  .sb-trial-banner-cta:active{ transform: translateY(1px); }

  /* Upgrade modal — fires on click of any blurred satellite */
  .sb-trial-modal{
    position: fixed; inset: 0; z-index: 10001;
    background: rgba(2,8,16,0.78); backdrop-filter: blur(4px);
    display:flex; align-items:center; justify-content:center;
    padding: 20px; animation: sb-trial-modal-fadein 0.18s ease-out;
  }
  @keyframes sb-trial-modal-fadein{ from{ opacity:0; } to{ opacity:1; } }
  .sb-trial-modal-card{
    background: var(--panel, #0d1a26); color: var(--ink, #fff);
    border: 1px solid rgba(228,181,61,0.40);
    border-radius: 16px; padding: 28px 30px; max-width: 460px; width: 100%;
    box-shadow: 0 24px 64px rgba(0,0,0,0.55); position: relative;
    font-family: inherit;
  }
  .sb-trial-modal-close{
    position: absolute; top: 10px; right: 14px;
    background: transparent; border: 0; color: var(--muted, #8AA1B3);
    font-size: 24px; line-height: 1; cursor: pointer; padding: 4px 8px;
  }
  .sb-trial-modal-close:hover{ color: var(--ink, #fff); }
  .sb-trial-modal-sev{
    display: inline-block; font-size: 11px; letter-spacing: 0.14em;
    text-transform: uppercase; font-weight: 800; padding: 5px 10px;
    border-radius: 999px; margin-bottom: 12px;
    border: 1px solid currentColor;
  }
  .sb-trial-modal-sev.sb-trial-sev-critical{ color:#FF6B72; }
  .sb-trial-modal-sev.sb-trial-sev-moderate{ color:#E4B53D; }
  .sb-trial-modal-sev.sb-trial-sev-watch   { color:#F0CB58; }
  .sb-trial-modal-sev.sb-trial-sev-ok      { color:#5BD17E; }
  .sb-trial-modal-h{
    font-size: 22px; font-weight: 700; margin: 0 0 14px;
    color: var(--ink, #fff);
  }
  .sb-trial-modal-p{
    font-size: 14px; line-height: 1.55; color: var(--ink-2, #C7D5E0); margin: 0 0 16px;
  }
  .sb-trial-modal-bullets{
    background: rgba(255,255,255,0.04); border-radius: 10px;
    padding: 12px 14px; margin: 0 0 18px;
    font-size: 13.5px; line-height: 1.8; color: var(--ink-2, #C7D5E0);
  }
  .sb-trial-modal-cta{
    display:block; text-align:center; background: var(--gold, #E4B53D);
    color: #1a1206; font-weight: 800; font-size: 15px;
    padding: 13px 22px; border-radius: 12px; text-decoration: none;
    letter-spacing: 0.02em;
  }
  .sb-trial-modal-cta:hover{ filter: brightness(1.08); }
  .sb-trial-modal-foot{ text-align: center; margin-top: 12px; }
  .sb-trial-modal-foot a{
    color: var(--muted, #8AA1B3); font-size: 12.5px; text-decoration: none;
    border-bottom: 1px dotted var(--muted, #8AA1B3);
  }
  .sb-trial-modal-foot a:hover{ color: var(--gold, #E4B53D); border-color: var(--gold, #E4B53D); }

  /* Reduced-motion users get no modal fade */
  @media (prefers-reduced-motion: reduce){
    .sb-trial-modal{ animation: none; }
  }
  /* Reorder cover-center so the gauge toggle sits directly under the conf-pill, then the scorering.
     Everything else (meta line, registrars, scope pills, scroll hint) sits BELOW the telemetry diagram
     in the order they appear in the HTML. */
  /* Center vertically between the Confidential pill (above, in cover-top)
     and the Secure Score satellite (below, top of halo). Cover-top extends
     further below the conf-pill than expected, so we trim top margin and
     add bottom margin to push the halo down — net effect: equal gap above
     and below the gauge-toggle row. */
  /* 2026-06-04: 38px → 14px bottom margin to tighten the gap between the
     gauge-toggle pills and the tenant strip. With gt-tenant's 6px top
     margin, total visible gap is now 20px (was 46px). */
  .cover-center .gauge-toggle-row{order:-1;margin:12px auto 14px}
  .cover-center .gauge-toggle{order:-1;margin:0}
  .cover-center .gauge-toggle-row .gauge-toggle{margin:0}
  .cover-center .demo-flag{order:-2}
  .cover-center .scorering{order:1}
  .cover-center .heroTitle{order:2}
  .cover-center .hero-summary{order:3}
  /* "More below" chevron sits directly under hero-summary, before the
     action button row, so it lands right under "Overall posture — X/100". */
  .cover-center .posture-more{order:4}
  /* Last-scan line — shown only when the bundle came from Azure cloud storage
     (auto-load on sign-in OR a Cloud audit storage Load). Slips between
     postureMore and the pill row without displacing the Secure Score ring. */
  .cover-center .last-scan-line{order:5;display:none;margin:6px 0 8px;font-size:12px;color:var(--muted);text-align:center;letter-spacing:.02em}
  .cover-center .last-scan-line b{color:var(--text);font-weight:600}
  .cover-center .last-scan-line .cloud-badge{display:inline-block;margin-left:8px;padding:1px 8px;border:1px solid var(--accent);border-radius:10px;color:var(--accent);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;vertical-align:1px}
  .cover-center .pillrow{order:6}
  .cover-center .bigpill-row{order:7}
  .cover-center .lic-matrix-wrap{order:8}
  .cover-center .meta{order:9}
  .cover-center .registrar-row{order:10}
  .cover-center .scope{order:11}
  .cover-center .scrollhint{order:12}

  /* License matrix: single column, 15 rows. Anchored at the right edge of the
     cover-center so the halo+pills stay exactly centered. Narrow enough that
     the Defender pill (3 o'clock at radius 210) clears the panel's left edge
     with plenty of breathing room. Stacks below on narrow screens. */
  .lic-matrix-wrap{
    position:absolute;top:62px;right:-30px;
    z-index:6;
    width:220px;
    padding:14px 16px;
    background:var(--panel2);border:1px solid var(--line);border-radius:14px;
    text-align:left;
  }
  @media (max-width:1100px){
    .lic-matrix-wrap{
      position:static;top:auto;right:auto;
      width:100%;max-width:480px;
      margin:24px auto 8px;
      order:6;
    }
  }
  .lic-matrix-title{
    font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;
    color:#E4B53D;text-align:center;font-weight:700;
    margin-bottom:12px;
  }
  .lic-matrix{
    display:flex;flex-direction:column;
    gap:3px;
    font-size:12px;
  }
  .lic-row{display:flex;align-items:center;gap:7px;padding:3px 2px;line-height:1.3;border-radius:5px}
  .lic-mark{
    display:inline-flex;align-items:center;justify-content:center;
    width:16px;height:16px;border-radius:50%;
    font-size:11px;font-weight:800;flex-shrink:0;
  }
  .lic-mark.yes{color:#fff;background:var(--green)}
  .lic-mark.no{color:#fff;background:var(--red)}
  .lic-mark.unk{color:var(--muted);background:transparent;border:1px dashed var(--line)}
  .lic-name{color:var(--text);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .lic-row.no .lic-name{color:var(--muted);font-weight:400}
  .lic-more{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);text-align:center}
  .lic-more-btn{
    background:transparent;border:0;color:var(--accent);cursor:pointer;
    font-size:11.5px;font-weight:600;letter-spacing:0.04em;
    font-family:inherit;padding:4px;
  }
  .lic-more-btn:hover{text-decoration:underline}
  body:not(.audit-loaded) .lic-matrix-wrap{display:none}
  @media print{body.pdfgen .lic-matrix-wrap{display:none}}
  @media (max-width:680px){.lic-matrix{grid-template-columns:1fr;gap:5px 0}}
  /* For the halo+pills octa view, let scorering span the full cover-center width
     and use flex centering. The halotel inside has a fixed 480px width so the
     pills cluster centers precisely on the page's horizontal midline. */
  .scorering.gauge-octa{width:100%;max-width:none;display:flex;align-items:center;justify-content:center;padding:0}
  .scorering.gauge-bars{width:min(560px,94vw);display:block;text-align:left;margin:6px 0 2px}
  /* 2026-06-04: removed legacy `width:606px; margin-left:279px` constraint
     that was pinning the Organizational Posture view to a narrow strip
     to the right of the old PGT block. The biz view now uses the full
     width of cover-center so the banner + recs + cards fill the screen. */
  .scorering.gauge-biz{width:100%;max-width:none;margin:0;display:block;text-align:left;padding:0;align-self:stretch}
  .biz-view{width:100%}
  /* Business Exposure / Operational Confidence banner card.
     Uses flex column so the Ask-AI pill at the bottom can be pushed to the
     card's footer via margin-top:auto regardless of how long the narrative is. */
  .biz-banner{border-radius:14px;padding:16px 20px;margin:4px 0 12px;color:#fff;text-align:left;box-shadow:0 4px 16px rgba(0,0,0,.18);display:flex;flex-direction:column}
  .biz-banner-green{background:linear-gradient(135deg,#1A7A4A 0%,#2FB36B 60%,#1A7A4A 100%)}
  .biz-banner-amber{background:linear-gradient(135deg,#8C6515 0%,#D49A2A 55%,#8C6515 100%)}
  .biz-banner-red{background:linear-gradient(135deg,#7E2828 0%,#C84B4B 55%,#7E2828 100%)}
  .biz-banner-grey{background:linear-gradient(135deg,#3A4458 0%,#6B7689 55%,#3A4458 100%)}
  .biz-banner-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:8px}
  .biz-banner h2{margin:0;font-size:23px;font-weight:700;letter-spacing:.01em;line-height:1.25}
  .biz-banner p{margin:8px 0 0;font-size:16px;line-height:1.55;opacity:.96}
  .biz-trend{font-size:12px;padding:4px 11px;border-radius:14px;background:rgba(255,255,255,.20);font-weight:700;letter-spacing:.05em;white-space:nowrap}
  .biz-trend .biz-arrow{margin-right:5px;font-size:13px}
  /* Cards take the full wrap width so they align left/right with the
     banner-row above. Card width scales with the screen via 1fr. */
  /* position:relative so the Next Steps button can be centered over it. */
  .biz-grid{display:grid;grid-template-columns:repeat(4,minmax(200px,1fr));gap:14px;margin:14px auto 0;width:100%;justify-content:stretch;position:relative}

  /* Next Steps button — circular, halo-sized, dead-center of the 4×2 grid.
     Appears only after a scan completes (body.audit-loaded). Same dimensions
     as the Initiate Scan halo (168px) so the visual rhyme is intentional:
     scan starts at a circle in the middle, workflow continues at a circle
     in the middle. */
  .next-steps-btn{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    width:168px;height:168px;border-radius:50%;
    background:var(--panel);border:3px solid var(--accent);
    display:none;flex-direction:column;align-items:center;justify-content:center;
    cursor:pointer;z-index:10;text-align:center;padding:0 12px;
    box-shadow:0 0 0 6px rgba(91,140,255,0.10), 0 8px 28px rgba(0,0,0,0.45);
    color:var(--text);font-family:inherit;
    transition:transform .15s ease, box-shadow .25s ease;
  }
  body.audit-loaded .next-steps-btn{display:flex;animation:nextStepsGlow 2.8s ease-in-out infinite}
  .next-steps-btn:hover{transform:translate(-50%,-50%) scale(1.04)}
  .next-steps-btn:active{transform:translate(-50%,-50%) scale(0.98)}
  .next-steps-label{font-size:18px;font-weight:700;letter-spacing:0.01em;line-height:1.2;color:var(--accent)}
  .next-steps-sub{font-size:11px;color:var(--muted);margin-top:6px;letter-spacing:0.08em;text-transform:uppercase;line-height:1.3}
  @keyframes nextStepsGlow{
    0%,100%{box-shadow:0 0 0 6px rgba(91,140,255,0.10), 0 8px 28px rgba(0,0,0,0.45)}
    50%{box-shadow:0 0 0 10px rgba(91,140,255,0.22), 0 12px 36px rgba(91,140,255,0.20)}
  }
  /* Card uses an explicit grid template so the LABEL, STATUS, GRADE, and
     TECHSUB rows always occupy the same vertical band — status and grade
     line up perfectly across all 8 cards regardless of how long a label
     wraps. Card height shrunk by ~30px via tighter padding and rows. */
  .biz-card{
    background:var(--panel2);border:1px solid var(--line);border-radius:10px;
    padding:18px 13px 8px;border-left:3px solid var(--muted);
    text-align:left;transition:.12s;cursor:pointer;
    display:grid;grid-template-rows:28px 14px 32px 16px;
    grid-template-areas: "label" "status" "grade" "techsub";
    align-content:start;row-gap:4px
  }

  /* Column 3 cards (Workforce Protection, Communications Risk) sit directly
     behind the Next Steps button on their left side. Right-justify everything
     so label / status / grade / sub stay visible regardless of the button.
     Targeted by domain key so the rule survives any future card re-ordering. */
  .biz-card[data-key="defender"],
  .biz-card[data-key="email"]{
    text-align:right;border-left:none;border-right:3px solid var(--muted)
  }
  .biz-card[data-key="defender"].biz-card-green,
  .biz-card[data-key="email"].biz-card-green{border-right-color:#2FB36B}
  .biz-card[data-key="defender"].biz-card-amber,
  .biz-card[data-key="email"].biz-card-amber{border-right-color:#D49A2A}
  .biz-card[data-key="defender"].biz-card-red,
  .biz-card[data-key="email"].biz-card-red{border-right-color:#C84B4B}
  .biz-card[data-key="defender"] .biz-card-label,
  .biz-card[data-key="email"] .biz-card-label{justify-content:flex-end;text-align:right}
  /* Cue stays at top-RIGHT corner on these cards — that's the side furthest
     from the Next Steps button, so it stays visible. */
  .biz-card:hover{transform:translateY(-1px);border-color:var(--accent)}
  .biz-card-soon{cursor:default}
  /* "More →" affordance — bottom-right of a biz-card (introduced v4.12, now opens the v4.14 9-column matrix). Only injected
     when CURRENT.sections.email.siteHeaders.results.length > 0. Click opens
     the multi-domain Site Headers modal via openModal('siteHeaders'). */
  .biz-card-more{
    position:absolute; bottom:7px; right:10px;
    background:rgba(76,201,240,0.06); border:1px solid var(--accent);
    color:var(--accent); padding:3px 9px; border-radius:10px;
    font-size:10.5px; font-weight:600; cursor:pointer;
    transition:background 0.15s; z-index:3;
  }
  .biz-card-more:hover{background:rgba(76,201,240,0.16)}
  .biz-card-green{border-left-color:#2FB36B}
  .biz-card-amber{border-left-color:#D49A2A}
  .biz-card-red{border-left-color:#C84B4B}
  .biz-card-grey{border-left-color:var(--muted)}
  .biz-card{position:relative}
  .biz-card-tip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--panel);border:1px solid var(--accent);border-radius:8px;padding:9px 12px;width:220px;max-width:280px;font-size:11.5px;color:var(--text);box-shadow:0 6px 20px rgba(0,0,0,.32);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s,visibility .15s;z-index:50;text-align:left}
  .biz-card-tip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:var(--accent)}
  .biz-card:hover .biz-card-tip{opacity:1;visibility:visible}
  .biz-tip-tech{font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;margin-bottom:3px}
  .biz-tip-score{font-size:14px;font-weight:800;color:var(--text);margin-bottom:4px}
  .biz-tip-desc{font-size:11px;color:var(--muted);line-height:1.4}
  .biz-card-soon{opacity:.55;border-style:dashed}
  .biz-card-soon:hover{transform:none;border-color:var(--line)}
  /* "Cannot Assess" card — domain came back unavailable (no license, consent
     gap, or scan error). Dashed border + muted color separates it visually
     from a real-but-bad score (which is solid red). The executive needs to
     see "we couldn't measure this" as different from "we measured this and
     it failed." */
  .biz-card-unavail{border-style:dashed;border-left-color:#D49A2A;opacity:.85}
  .biz-card-unavail .biz-card-status{color:#D49A2A}
  .biz-card-unavail .biz-card-sub{color:var(--muted)}
  .biz-card-unavail:hover{opacity:1;transform:translateY(-1px);border-color:#D49A2A}
  /* Coverage caveat inside the banner when one or more domains are unavailable.
     Renders as a soft warning so the executive doesn't read the headline grade
     as a complete assessment. */
  .biz-coverage{
    margin-top:10px;padding:9px 13px;border-radius:7px;
    background:rgba(0,0,0,.18);border-left:3px solid #D49A2A;
    font-size:13px;line-height:1.4;color:var(--text);text-align:left
  }
  .biz-coverage b{color:#E4B53D;font-weight:700}
  .biz-coverage-icon{margin-right:6px;color:#E4B53D;font-weight:700}

  /* Banner-row + biz-grid both use the full width of .wrap so the executive
     view fills the available screen. Aligned left/right edges per the
     2026-06-04 mockup. */
  .biz-banner-row{
    display:flex;gap:20px;align-items:stretch;
    width:100%;margin:0 auto
  }
  .biz-banner-row .biz-banner{flex:1 1 50%;min-width:0;margin:0}
  .biz-recs{flex:1 1 50%;display:flex;flex-direction:column;gap:10px;min-width:0}
  .biz-rec-title{
    font-size:11px;letter-spacing:.14em;text-transform:uppercase;
    color:var(--muted);font-weight:700;margin:0 0 2px;padding:0 2px
  }
  /* Larger recommendation cards per 2026-06-04 mockup — these now match the
     visual weight of the banner so the page reads "what's wrong / what to do"
     side-by-side. Natural height (no flex:1 1 0) so the meta row at the
     bottom never gets squeezed and bleed-through behind the next card. */
  .biz-rec{
    background:var(--panel2);border:1px solid var(--line);border-left:4px solid var(--accent);
    border-radius:10px;padding:14px 18px;cursor:pointer;transition:.12s;
    display:flex;flex-direction:column;gap:6px;
    flex:0 0 auto;overflow:hidden
  }
  .biz-rec:hover{transform:translateY(-1px);border-color:var(--accent);box-shadow:0 6px 18px rgba(0,0,0,0.35)}
  .biz-rec-red{border-left-color:#C84B4B}
  .biz-rec-amber{border-left-color:#D49A2A}
  .biz-rec-grey{border-left-color:var(--muted)}
  .biz-rec-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
  .biz-rec-name{
    font-size:14px;font-weight:700;color:var(--text);line-height:1.3;flex:1 1 auto;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis
  }
  .biz-rec-status{
    flex:0 0 auto;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
    padding:3px 9px;border-radius:5px;white-space:nowrap
  }
  .biz-rec-status-gap    {background:rgba(200,75,75,0.22);color:#F09595}
  .biz-rec-status-partial{background:rgba(212,154,42,0.22);color:#E4B53D}
  .biz-rec-status-unknown{background:rgba(91,102,128,0.22);color:#9AA6BD}
  /* Line 2: detail text on the left, framework tag on the right, single row. */
  .biz-rec-meta{
    display:flex;justify-content:space-between;align-items:baseline;gap:12px;
    font-size:12.5px;line-height:1.35
  }
  .biz-rec-detail{
    color:var(--muted);flex:1 1 auto;min-width:0;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis
  }
  .biz-rec-fw{
    flex:0 0 auto;font-size:10.5px;letter-spacing:.08em;color:var(--accent);
    font-weight:700;text-align:right;white-space:nowrap
  }
  .biz-rec-empty{
    background:rgba(47,179,107,0.10);border:1px solid rgba(47,179,107,0.40);
    border-radius:8px;padding:14px;text-align:center;font-size:12px;color:#7FD7A6;line-height:1.5
  }
  @media (max-width: 980px){
    .biz-banner-row{flex-direction:column}
    .biz-banner-row .biz-banner, .biz-recs{flex:1 1 auto}
  }

  /* "Ask AI" pill — appears at the bottom of every Organizational Posture card
     and on the overall banner. Click → modal with prompt + Claude/Copilot/ChatGPT
     buttons. Customer uses their own AI account; SignalBoard never sees the chat. */
  .askai-pill{
    display:inline-flex;align-items:center;gap:5px;
    margin-top:8px;padding:5px 11px;border-radius:14px;
    background:rgba(91,140,255,0.10);border:1px solid rgba(91,140,255,0.40);
    color:var(--accent);font-size:10.5px;font-weight:600;letter-spacing:.04em;
    cursor:pointer;transition:.12s;font-family:inherit;line-height:1
  }
  .askai-pill:hover{background:rgba(91,140,255,0.18);border-color:var(--accent)}
  .askai-pill-icon{font-size:11px}
  .biz-card .askai-pill{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);font-size:9.5px;padding:3px 9px}
  .biz-card{padding-bottom:26px;position:relative}  /* room for the pill, position:relative for absolute pill */
  /* margin-top:auto pushes the pill to the bottom edge of the flex column,
     keeping the narrative anchored to the top and the AI prompt as a footer.
     align-self:flex-start keeps the pill compact instead of stretching wide. */
  .biz-banner .askai-pill{margin-top:auto;align-self:flex-start;background:rgba(255,255,255,0.14);color:#fff;border-color:rgba(255,255,255,0.35);font-size:11.5px;padding:6px 12px}
  .biz-banner .askai-pill:hover{background:rgba(255,255,255,0.22);border-color:#fff}

  /* Ask AI modal — full overlay, editable prompt, three vendor buttons. */
  .askai-overlay{
    position:fixed;inset:0;background:rgba(0,0,0,0.72);z-index:200;
    display:none;align-items:center;justify-content:center;padding:24px
  }
  .askai-overlay.show{display:flex}
  .askai-modal{
    background:var(--panel);border:1px solid var(--accent);border-radius:12px;
    width:100%;max-width:680px;max-height:90vh;overflow:auto;
    box-shadow:0 18px 60px rgba(0,0,0,0.5);
    padding:22px 26px
  }
  .askai-modal h2{margin:0 0 6px;font-size:18px;color:var(--accent);letter-spacing:.02em;font-weight:700;text-align:center}
  .askai-modal .askai-sub{font-size:12.5px;color:var(--muted);margin-bottom:10px;line-height:1.5}
  .askai-modal .askai-paste-hint{
    background:rgba(91,140,255,0.10);border:1px solid rgba(91,140,255,0.32);
    border-radius:8px;padding:9px 13px;margin-bottom:14px;
    font-size:11.5px;line-height:1.55;color:var(--text)
  }
  .askai-modal .askai-paste-hint b{color:var(--accent)}
  .askai-modal .askai-disclosure{
    background:rgba(228,181,61,0.10);border:1px solid rgba(228,181,61,0.40);
    border-radius:8px;padding:12px 14px;margin-bottom:14px;font-size:12.5px;line-height:1.5;color:var(--text)
  }
  .askai-modal .askai-disclosure b{color:#E4B53D}
  .askai-modal .askai-disclosure ul{margin:6px 0 0 18px;padding:0}
  .askai-modal .askai-disclosure li{margin:3px 0}
  .askai-modal .askai-disclosure label{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:11.5px;color:var(--muted);cursor:pointer}
  .askai-modal .askai-warn{
    background:rgba(200,75,75,0.10);border-left:3px solid #C84B4B;
    padding:6px 9px;margin:6px 0;border-radius:4px;list-style:none;margin-left:-18px
  }
  .askai-modal .askai-warn-icon{
    display:inline-block;color:#E47D7D;font-weight:700;font-size:14px;margin-right:4px
  }
  .askai-modal .askai-warn b{color:#E47D7D}
  .askai-modal textarea{
    width:100%;min-height:220px;padding:12px;
    background:var(--panel2);border:1px solid var(--line);border-radius:8px;
    color:var(--text);font-family:inherit;font-size:12.5px;line-height:1.55;
    resize:vertical;box-sizing:border-box
  }
  .askai-modal textarea:focus{outline:none;border-color:var(--accent)}
  .askai-modal .askai-vendor-row{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
  .askai-modal .askai-vendor{
    flex:1 1 auto;min-width:160px;
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    padding:11px 16px;border-radius:9px;cursor:pointer;
    font-family:inherit;font-size:13px;font-weight:600;letter-spacing:.02em;
    border:1px solid var(--line);background:var(--panel2);color:var(--text);
    transition:.15s
  }
  .askai-modal .askai-vendor:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,0.3)}
  .askai-modal .askai-vendor-claude{border-color:#D97757;color:#D97757}
  .askai-modal .askai-vendor-claude:hover{background:rgba(217,119,87,0.10)}
  .askai-modal .askai-vendor-copilot{border-color:#0078D4;color:#0078D4}
  .askai-modal .askai-vendor-copilot:hover{background:rgba(0,120,212,0.10)}
  .askai-modal .askai-vendor-chatgpt{border-color:#10A37F;color:#10A37F}
  .askai-modal .askai-vendor-chatgpt:hover{background:rgba(16,163,127,0.10)}
  .askai-modal .askai-footer{
    display:flex;justify-content:space-between;align-items:center;gap:10px;
    margin-top:14px;padding-top:12px;border-top:1px solid var(--line);
    font-size:11.5px;color:var(--muted);flex-wrap:wrap
  }
  .askai-modal .askai-footer-actions{display:flex;gap:14px;flex-wrap:wrap}
  .askai-modal .askai-copyonly{
    background:none;border:none;color:var(--accent);
    cursor:pointer;font-family:inherit;font-size:11.5px;font-weight:600;padding:0
  }
  .askai-modal .askai-copyonly:hover{text-decoration:underline}
  .askai-modal .askai-close{
    background:none;border:1px solid var(--line);color:var(--muted);
    padding:5px 10px;border-radius:6px;cursor:pointer;
    font-family:inherit;font-size:11.5px
  }
  .askai-modal .askai-close:hover{color:var(--text);border-color:var(--text)}
  .askai-toast{
    position:fixed;bottom:28px;left:50%;transform:translateX(-50%);
    background:var(--accent);color:#fff;padding:10px 18px;border-radius:8px;
    font-size:12.5px;font-weight:600;z-index:300;
    box-shadow:0 6px 20px rgba(0,0,0,0.35);
    opacity:0;pointer-events:none;transition:opacity .25s
  }
  .askai-toast.show{opacity:1}

  /* ===== SAVE DISCLOSURE MODAL =====
     Shown the first time a user clicks any Save button. Explains where
     their audit goes, that it's encrypted at rest in cloud storage, and
     the three use cases (share with IT, trend over time, insurance Qs).
     Has a "Don't show again" checkbox stored in localStorage. */
  .save-disc-overlay{
    position:fixed;inset:0;background:rgba(0,0,0,0.74);z-index:240;
    display:none;align-items:center;justify-content:center;padding:24px
  }
  .save-disc-overlay.show{display:flex}
  .save-disc-modal{
    background:var(--panel);border:1px solid var(--accent);border-radius:12px;
    width:100%;max-width:560px;padding:24px 28px 22px;
    box-shadow:0 18px 60px rgba(0,0,0,0.5)
  }
  .save-disc-modal h2{
    margin:0 0 4px;font-size:20px;font-weight:700;color:var(--accent);
    letter-spacing:.01em;text-align:center
  }
  .save-disc-modal .save-disc-eyebrow{
    text-align:center;margin:0 0 14px;
    font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
    color:#E4B53D;font-weight:700
  }
  .save-disc-modal p{
    font-size:13.5px;line-height:1.55;color:var(--text);margin:0 0 12px
  }
  .save-disc-modal .save-disc-bullets{
    margin:0 0 14px;padding:0;list-style:none
  }
  .save-disc-modal .save-disc-bullets li{
    font-size:13px;color:var(--text);line-height:1.55;padding:5px 0 5px 22px;
    position:relative
  }
  .save-disc-modal .save-disc-bullets li::before{
    content:"\2713";color:var(--accent);font-weight:700;font-size:14px;
    position:absolute;left:0;top:5px
  }
  .save-disc-modal .save-disc-bullets b{color:var(--accent)}
  .save-disc-modal .save-disc-note{
    background:rgba(91,140,255,0.08);border-left:3px solid var(--accent);
    padding:10px 14px;border-radius:6px;
    font-size:12.5px;line-height:1.5;color:var(--text);margin:0 0 14px
  }
  .save-disc-modal .save-disc-note b{color:var(--accent)}
  .save-disc-modal label.save-disc-dontshow{
    display:flex;align-items:center;gap:8px;
    font-size:12px;color:var(--muted);cursor:pointer;
    margin:0 0 16px
  }
  .save-disc-modal .save-disc-actions{
    display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap
  }
  .save-disc-modal button{
    font-family:inherit;font-size:13px;font-weight:600;
    padding:9px 18px;border-radius:8px;cursor:pointer;
    transition:.15s
  }
  .save-disc-modal .save-disc-cancel{
    background:transparent;border:1px solid var(--line);color:var(--muted)
  }
  .save-disc-modal .save-disc-cancel:hover{color:var(--text);border-color:var(--text)}
  .save-disc-modal .save-disc-confirm{
    background:var(--accent);border:none;color:#fff
  }
  .save-disc-modal .save-disc-confirm:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(91,140,255,0.35)}

  /* ===== EXECUTIVE ACTION PLAN ("Next Steps" modal) ===== */
  /* This page is the executive's call to action. NEVER add technical to-do
     items here — they belong behind domain card tiles. The four steps
     (Validate / Assess / Build Narrative / Track) define how leadership
     uses the scorecard, not how IT remediates it. */
  /* Compressed ~25% on 2026-06-05 so the 2x2 grid fits on a 720p laptop
     (the daughter's-laptop case where only steps 1 and 2 showed before
     the user had to scroll). Padding, fonts, and gaps all came down;
     no content was dropped. */
  .nextsteps-overlay{
    position:fixed;inset:0;background:rgba(0,0,0,0.78);z-index:220;
    display:none;align-items:flex-start;justify-content:center;
    padding:20px;overflow:auto
  }
  .nextsteps-overlay.show{display:flex}
  .nextsteps-modal{
    background:var(--panel);border:1px solid var(--accent);border-radius:12px;
    width:100%;max-width:960px;
    box-shadow:0 24px 80px rgba(0,0,0,0.6);
    padding:22px 28px 20px;position:relative
  }
  .nextsteps-close{
    position:absolute;top:10px;right:14px;
    background:none;border:1px solid var(--line);color:var(--muted);
    width:28px;height:28px;border-radius:50%;cursor:pointer;
    font-size:15px;line-height:1;font-family:inherit;
    display:flex;align-items:center;justify-content:center
  }
  .nextsteps-close:hover{color:var(--text);border-color:var(--text)}
  .nextsteps-eyebrow{
    font-size:10px;letter-spacing:.18em;text-transform:uppercase;
    color:#E4B53D;font-weight:700;margin:0 0 3px
  }
  .nextsteps-header h2{
    margin:0;font-size:23px;font-weight:700;color:var(--accent);
    letter-spacing:.01em;line-height:1.15
  }
  .nextsteps-tag{
    margin-top:6px;font-size:12.5px;color:var(--muted);font-style:italic;
    line-height:1.45;max-width:780px
  }
  .nextsteps-tag b{color:var(--text);font-style:normal;font-weight:700}
  .nextsteps-grid{
    display:grid;grid-template-columns:repeat(2, 1fr);gap:12px;
    margin:16px 0 14px
  }
  @media (max-width: 820px){ .nextsteps-grid{grid-template-columns:1fr} }
  .nextsteps-step{
    background:var(--panel2);border:1px solid var(--line);
    border-left:3px solid #E4B53D;border-radius:10px;
    padding:13px 16px 12px;display:flex;flex-direction:column;gap:8px;
    position:relative;transition:.12s
  }
  .nextsteps-step:hover{border-color:var(--accent);box-shadow:0 6px 22px rgba(0,0,0,0.32)}
  .nextsteps-step-head{display:flex;align-items:flex-start;gap:10px}
  .nextsteps-step-num{
    flex:0 0 auto;width:28px;height:28px;border-radius:50%;
    background:rgba(228,181,61,0.18);border:1.5px solid #E4B53D;
    color:#E4B53D;font-weight:800;font-size:13px;
    display:flex;align-items:center;justify-content:center;
    font-family:Georgia,'Times New Roman',serif
  }
  .nextsteps-step-titleblock{flex:1 1 auto;min-width:0}
  .nextsteps-step-title{
    font-size:15px;font-weight:700;color:var(--text);
    line-height:1.2;margin:1px 0 2px;letter-spacing:.01em
  }
  .nextsteps-step-purpose{
    font-size:11px;color:var(--muted);line-height:1.35;font-style:italic
  }
  .nextsteps-step-label{
    font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
    color:var(--accent);font-weight:700;margin:1px 0 0
  }
  .nextsteps-step ul{
    margin:0 0 0 15px;padding:0;font-size:12px;color:var(--text);
    line-height:1.45
  }
  .nextsteps-step ul li{margin:2px 0}
  .nextsteps-step-question{
    background:rgba(228,181,61,0.10);border-left:3px solid #E4B53D;
    padding:7px 11px;border-radius:5px;
    font-size:12px;font-style:italic;color:var(--text);line-height:1.4
  }
  .nextsteps-step-question b{font-style:normal;font-weight:700;color:#E4B53D}
  .nextsteps-step-cta{
    align-self:flex-start;margin-top:auto;
    background:var(--accent);border:none;color:#fff;
    padding:7px 13px;border-radius:7px;cursor:pointer;
    font-family:inherit;font-size:12.5px;font-weight:600;
    transition:.15s;display:inline-flex;align-items:center;gap:5px
  }
  .nextsteps-step-cta:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(91,140,255,0.35)}
  .nextsteps-step-cta-soon{
    background:transparent;border:1px dashed var(--muted);color:var(--muted);
    cursor:default;font-size:11.5px
  }
  .nextsteps-step-cta-soon:hover{transform:none;box-shadow:none}

  /* Save button anchored in the upper-right corner of the "Decide and Track"
     step card. Same download icon as the Audit Save button at the top of the
     page, scaled down to fit a card. */
  .nextsteps-save-btn{
    position:absolute;top:14px;right:14px;
    display:inline-flex;align-items:center;gap:6px;
    padding:6px 11px;border-radius:7px;cursor:pointer;
    background:transparent;border:1px solid var(--accent);color:var(--accent);
    font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.04em;
    transition:.15s
  }
  .nextsteps-save-btn:hover{background:rgba(91,140,255,0.12);transform:translateY(-1px)}
  .nextsteps-save-btn svg{flex:0 0 auto}

  /* Footer — the four future deliverables (the moat). */
  .nextsteps-moat{
    background:linear-gradient(135deg, rgba(228,181,61,0.10), rgba(91,140,255,0.08));
    border:1px solid rgba(228,181,61,0.32);border-radius:10px;
    padding:18px 22px;margin-top:6px
  }
  .nextsteps-moat-head{
    font-size:11px;letter-spacing:.16em;text-transform:uppercase;
    color:#E4B53D;font-weight:700;margin:0 0 6px
  }
  .nextsteps-moat-title{
    font-size:16px;font-weight:700;color:var(--text);margin:0 0 6px
  }
  .nextsteps-moat-sub{font-size:12.5px;color:var(--muted);line-height:1.5;margin:0 0 12px}
  .nextsteps-deliverables{
    display:grid;grid-template-columns:repeat(2,1fr);gap:8px 18px;
    margin:0;padding:0;list-style:none
  }
  .nextsteps-deliverables li{
    font-size:13px;color:var(--text);padding:6px 0;
    display:flex;align-items:center;gap:8px
  }
  .nextsteps-deliverables li::before{
    content:"\2728";color:#E4B53D;font-size:13px
  }
  @media (max-width: 700px){ .nextsteps-deliverables{grid-template-columns:1fr} }
  /* Grid-anchored rows — labels can wrap to 2 lines and the status/grade
     below still land at the same vertical position across cards. */
  .biz-card-label{grid-area:label;font-size:12.5px;font-weight:700;color:var(--text);line-height:1.18;margin:0;display:flex;align-items:flex-start;overflow:hidden}
  /* "So what" line — the business translation rendered after the grade so
     an executive scanning the card knows what's actually at stake. Sized
     small enough to not crowd the card but visible enough to be the first
     thing they read after the label. */
  .biz-card-sowhat{font-size:10.5px;color:var(--muted-2,#7a8eab);line-height:1.4;margin-top:4px;font-style:italic;letter-spacing:0.01em;grid-column:1/-1}
  .biz-card-status{grid-area:status;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:600;margin:0;line-height:1.2}
  .biz-card-green .biz-card-status{color:#2FB36B}
  .biz-card-amber .biz-card-status{color:#D49A2A}
  .biz-card-red .biz-card-status{color:#C84B4B}
  .biz-card-green .biz-card-sub{color:#2FB36B}
  .biz-card-amber .biz-card-sub{color:#D49A2A}
  .biz-card-red .biz-card-sub{color:#C84B4B}
  .biz-card-sub{grid-area:grade;font-size:26px;font-weight:800;color:var(--muted);letter-spacing:.01em;text-align:center;margin:0;line-height:1}
  /* Item B: subtle technical source line under each card grade so the executive
     can read both labels without hovering. Always visible, smaller weight than
     the executive label to preserve the boardroom feel. */
  .biz-card-techsub{grid-area:techsub;font-size:10px;color:var(--muted);text-align:center;margin:0;letter-spacing:.04em;font-style:italic;line-height:1.25}
  /* Item A: small "click for detail" cue in the top-right corner so the
     interactive affordance is discoverable without hovering. */
  .biz-card-cue{position:absolute;top:6px;right:8px;font-size:10px;color:var(--muted);opacity:.55;font-weight:600;pointer-events:none;letter-spacing:.04em}
  .biz-card:hover .biz-card-cue{opacity:.95;color:var(--accent)}
  /* Item C: pulse the Telemetry card briefly after a drill-down so the
     executive's eye lands on the right card. */
  @keyframes drillPulse{
    0%{box-shadow:0 0 0 0 rgba(91,140,255,.55), 0 0 22px 4px rgba(91,140,255,.40)}
    60%{box-shadow:0 0 0 8px rgba(91,140,255,0), 0 0 28px 8px rgba(91,140,255,.18)}
    100%{box-shadow:0 0 0 0 rgba(91,140,255,0), 0 0 0 0 rgba(91,140,255,0)}
  }
  .card.drill-highlight{animation:drillPulse 1.6s ease-out;border-color:var(--accent) !important}
  .scorering svg{display:block;max-width:100%;height:auto}
  .scorering svg a{cursor:pointer}
  .scorering svg a:hover circle{stroke-opacity:.78}
  /* ===== Halo-centered Initiate Scan (replaces the old cover-left button) ===== */
  .scan-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:1}
  .scan-stage > *{pointer-events:auto}
  /* Post-scan halo container (buildHaloPostScanHtml). Dimensions moved off the
     element's inline style= attribute per Standards §1.5.2. */
  .halotel{position:relative;width:560px;max-width:96vw;height:440px;margin:0 auto;flex-shrink:0}
  /* Utility: force-hide a premium surface in trial mode via classList (was an
     inline style.display='none' set in integration.js _applyTrialUILockdown). */
  .sb-force-hidden{display:none !important}
  .scan-halo{
    width:168px;height:168px;border-radius:50%;
    background:var(--panel);
    border:3px solid var(--accent);
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    cursor:pointer;position:relative;z-index:3;
    transition:transform .15s ease, border-color .25s ease, background .25s ease;
    user-select:none;font-family:inherit;color:var(--text);
    text-align:center;padding:0 12px;
  }
  .scan-halo:hover{transform:scale(1.04)}
  .scan-halo:active{transform:scale(0.99)}
  .scan-halo-label{font-size:18px;font-weight:700;letter-spacing:0.01em;line-height:1.2}
  .scan-halo-sub{font-size:11px;color:var(--muted);margin-top:5px;letter-spacing:0.05em;text-transform:uppercase;line-height:1.3}
  /* Post-scan "done" halo: tier-colored border + big grade letter inside */
  .scan-halo-grade{font-size:54px;font-weight:800;line-height:1;font-family:Georgia,'Times New Roman',serif}
  .scan-halo-pct{font-size:13.5px;font-weight:700;letter-spacing:0.04em;color:var(--muted);margin-top:3px}
  .scan-halo-overall{font-size:9.5px;font-weight:700;letter-spacing:1.6px;color:var(--muted);margin-top:5px}
  .scan-halo-cap{font-size:8px;font-weight:600;letter-spacing:1.4px;color:var(--muted);margin-top:3px;opacity:0.75}
  .scan-halo[data-mode="signin"], .scan-halo[data-mode="ready"]{animation:halo-glow 2.6s ease-in-out infinite}
  .scan-halo[data-mode="scanning"]{animation:halo-pulse 1.2s ease-in-out infinite;border-color:#fbbf24;cursor:wait}
  .scan-halo[data-mode="unlicensed"]{border-color:#fbbf24;animation:none}
  .scan-halo[data-mode="done"]{animation:none}
  .scan-halo[data-mode="done"][data-tier="green"]{border-color:var(--green)}
  .scan-halo[data-mode="done"][data-tier="amber"]{border-color:var(--amber)}
  .scan-halo[data-mode="done"][data-tier="red"]{border-color:var(--red)}
  .scan-halo[data-mode="done"][data-tier="green"] .scan-halo-grade{color:var(--green)}
  .scan-halo[data-mode="done"][data-tier="amber"] .scan-halo-grade{color:var(--amber)}
  .scan-halo[data-mode="done"][data-tier="red"] .scan-halo-grade{color:var(--red)}
  @keyframes halo-glow{
    0%, 100%{box-shadow:0 0 0 0 rgba(76,201,240,0.0), 0 0 24px 0 rgba(76,201,240,0.10)}
    50%{box-shadow:0 0 0 14px rgba(76,201,240,0), 0 0 42px 10px rgba(76,201,240,0.32)}
  }
  @keyframes halo-pulse{
    0%, 100%{box-shadow:0 0 0 0 rgba(251,191,36,0.45)}
    50%{box-shadow:0 0 0 18px rgba(251,191,36,0)}
  }
  /* 2026-06-05: previous rule hid the halo label + sub during scanning, which
     meant mobile users (and many desktop users) saw nothing happen — the JS
     was correctly setting "Scanning" + per-domain narrative, but CSS was
     hiding both elements. The label and sub now stay visible during scan
     so the user always has a textual cue that work is in progress. The
     dots after "Scanning" animate via .scan-dots below.

     Empty rule retained as a hook for any future scanning-mode tweaks. */
  .scan-halo[data-mode="scanning"] .scan-halo-label{
    color: var(--accent);
  }
  .scan-halo[data-mode="scanning"] .scan-halo-sub{
    color: var(--text);
    opacity: 0.85;
    /* Slightly larger on mobile so the per-domain narrative is readable
       without zooming the page. */
  }
  @media (max-width: 540px){
    .scan-halo[data-mode="scanning"] .scan-halo-label{font-size:20px}
    .scan-halo[data-mode="scanning"] .scan-halo-sub{font-size:12px}
  }
  /* Animated trailing dots after "Scanning" — pure CSS, no JS overhead.
     The .scan-dots span lives inside .scan-halo-label and cycles through
     "" "." ".." "..." over 1.5 seconds so the user has motion to lock onto
     even when the per-domain narrative hasn't ticked over yet.
     -----------------------------------------------------------------
     ANCHORING "Scanning" PRECISELY AT HALO CENTER (Johnnie 2026-06-10):
     The trick is to take .scan-dots OUT of layout flow (position:absolute)
     and shrink .scan-halo-label to just "Scanning"'s width (max-content).
     Flex then centers the label based on "Scanning" alone, and the dots
     float to the right without nudging the word. */
  .scan-halo[data-mode="scanning"] .scan-halo-label{
    position: relative;
    width: max-content;       /* label width = "Scanning" width only */
    max-width: 100%;
  }
  .scan-halo[data-mode="scanning"] .scan-dots{
    position: absolute;
    left: 100%;               /* anchor at the right edge of "Scanning" */
    top: 0;
    width: 1.6em;
    text-align: left;
    pointer-events: none;
  }
  .scan-halo[data-mode="scanning"] .scan-dots::after{
    content: '';
    display: inline-block;
    width: 100%;
    text-align: left;
    animation: sb-scan-dots 1.5s steps(4, end) infinite;
  }
  @keyframes sb-scan-dots{
    0%   {content: '';}
    25%  {content: '.';}
    50%  {content: '..';}
    75%  {content: '...';}
    100% {content: '';}
  }
  /* Hide dots when NOT scanning so "Initiate Scan" / "Sign in" / "Get access"
     don't get trailing animated dots. */
  .scan-halo:not([data-mode="scanning"]) .scan-dots{display:none}
  .scan-status-out{
    position:absolute;left:50%;top:calc(50% + 112px);
    transform:translateX(-50%);text-align:center;
    display:none;z-index:4;min-width:200px;pointer-events:none;
  }
  /* 2026-06-04: status moved INTO the halo center per Johnnie's instruction.
     The below-halo status box stays defined for legacy edge cases but is no
     longer shown during scanning. */
  .scan-halo[data-mode="scanning"] ~ .scan-status-out{display:none}
  .scan-status-label{font-size:14px;font-weight:700;color:var(--text);letter-spacing:0.02em}
  .scan-status-sub{font-size:11px;color:var(--muted);margin-top:5px;letter-spacing:0.06em;text-transform:uppercase}

  /* Connecting lines from halo edge to each satellite — appear in sync with their pill. */
  .scan-lines{position:absolute;inset:0;pointer-events:none;z-index:1}
  .scan-line{
    position:absolute;top:50%;left:50%;height:1.5px;
    background:linear-gradient(to right, transparent 0%, transparent 42%, rgba(76,201,240,0.55) 50%, rgba(76,201,240,0.30) 100%);
    transform-origin:0 50%;
    opacity:0;transition:opacity 0.5s ease-in;
    border-radius:1px;
  }
  .scan-line.shown{opacity:1}
  /* 2026-06-03: 8 satellites at 45° spacing (was 7 at 360/7 ≈ 51.4°).
     Identity Modernization is the 8th, sitting in the top-left position. */
  .scan-line[data-idx="0"]{width:210px;transform:rotate(-90deg)}
  .scan-line[data-idx="1"]{width:210px;transform:rotate(-45deg)}
  .scan-line[data-idx="2"]{width:210px;transform:rotate(0deg)}
  .scan-line[data-idx="3"]{width:210px;transform:rotate(45deg)}
  .scan-line[data-idx="4"]{width:210px;transform:rotate(90deg)}
  .scan-line[data-idx="5"]{width:210px;transform:rotate(135deg)}
  .scan-line[data-idx="6"]{width:210px;transform:rotate(180deg)}
  .scan-line[data-idx="7"]{width:210px;transform:rotate(-135deg)}
  .scan-line[data-status="ok"]{background:linear-gradient(to right, transparent 0%, transparent 42%, rgba(91,209,126,0.65) 50%, rgba(91,209,126,0.30) 100%)}
  .scan-line[data-status="warn"]{background:linear-gradient(to right, transparent 0%, transparent 42%, rgba(232,201,122,0.65) 50%, rgba(232,201,122,0.30) 100%)}
  .scan-line[data-status="err"]{background:linear-gradient(to right, transparent 0%, transparent 42%, rgba(248,113,113,0.65) 50%, rgba(248,113,113,0.30) 100%)}

  /* Satellite ring: 7 absolutely-positioned slots around the halo center */
  .scan-sats{position:absolute;inset:0;pointer-events:none;z-index:5}
  .scan-sat{position:absolute;top:50%;left:50%;opacity:0;transition:opacity .55s ease;will-change:opacity,transform;pointer-events:auto;z-index:1}
  /* Hovered pill jumps above its siblings so its tooltip isn't covered by adjacent pills. */
  .scan-sat:hover{z-index:30}
  .scan-sat.shown{opacity:1;animation:sat-in .55s ease}
  @keyframes sat-in{from{opacity:0;transform:translate(var(--tx,0),var(--ty,0)) scale(0.6)}to{opacity:1;transform:translate(var(--tx,0),var(--ty,0)) scale(1)}}
  /* Clockwise positions, 8 slots at 45° apart, radius 232px. Math:
       sin(45°)=cos(45°)≈0.7071 → 232 * 0.7071 ≈ 164.
     idx 0: top, 1: top-right, 2: right, 3: bottom-right,
     4: bottom, 5: bottom-left, 6: left, 7: top-left.
     Was 7-slot; idx 7 (Identity Modernization) now fills the top-left. */
  .scan-sat[data-idx="0"]{--tx:-50%;--ty:calc(-50% - 232px);transform:translate(var(--tx),var(--ty))}
  .scan-sat[data-idx="1"]{--tx:calc(-50% + 164px);--ty:calc(-50% - 164px);transform:translate(var(--tx),var(--ty))}
  .scan-sat[data-idx="2"]{--tx:calc(-50% + 232px);--ty:-50%;transform:translate(var(--tx),var(--ty))}
  .scan-sat[data-idx="3"]{--tx:calc(-50% + 164px);--ty:calc(-50% + 164px);transform:translate(var(--tx),var(--ty))}
  .scan-sat[data-idx="4"]{--tx:-50%;--ty:calc(-50% + 232px);transform:translate(var(--tx),var(--ty))}
  .scan-sat[data-idx="5"]{--tx:calc(-50% - 164px);--ty:calc(-50% + 164px);transform:translate(var(--tx),var(--ty))}
  .scan-sat[data-idx="6"]{--tx:calc(-50% - 232px);--ty:-50%;transform:translate(var(--tx),var(--ty))}
  .scan-sat[data-idx="7"]{--tx:calc(-50% - 164px);--ty:calc(-50% - 164px);transform:translate(var(--tx),var(--ty))}
  /* When the satellite is a clickable <a> (post-scan), strip default link styling. */
  a.scan-sat{text-decoration:none;color:inherit}
  .ssat-pill{
    display:inline-flex;align-items:center;gap:9px;
    padding:10px 16px;
    background:var(--panel);
    border:2px solid var(--line);
    border-radius:16px;
    font-size:13px;font-weight:700;letter-spacing:0.06em;
    color:var(--text);white-space:nowrap;
    box-shadow:0 6px 18px rgba(0,0,0,0.22);
  }
  .ssat-name{color:var(--text)}
  .ssat-score{font-size:14.5px;font-weight:800;letter-spacing:0;color:var(--accent);margin-left:2px}
  .scan-sat[data-status="ok"] .ssat-score{color:var(--green)}
  .scan-sat[data-status="warn"] .ssat-score{color:var(--amber)}
  .scan-sat[data-status="err"] .ssat-score{color:var(--red)}
  .ssat-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(76,201,240,0.18)}
  /* Hover tooltip explaining what each domain pill represents. */
  .ssat-tip{
    position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);
    width:240px;padding:10px 12px;
    background:var(--panel);border:1px solid var(--accent);border-radius:9px;
    font-size:11.5px;line-height:1.5;color:var(--text);font-weight:400;letter-spacing:0;
    text-transform:none;white-space:normal;text-align:left;
    box-shadow:0 8px 24px rgba(0,0,0,0.45);
    opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,visibility .15s;
    z-index:60;
  }
  .ssat-tip::before{
    content:"";position:absolute;bottom:100%;left:50%;transform:translateX(-50%);
    border:6px solid transparent;border-bottom-color:var(--accent);
  }
  .scan-sat:hover .ssat-tip,.scan-sat:focus-visible .ssat-tip{opacity:1;visibility:visible}
  .ssat-tip b{color:var(--accent);font-weight:700;display:block;margin-bottom:3px;font-size:11.5px;text-transform:uppercase;letter-spacing:0.06em}
  .scan-sat[data-status="ok"] .ssat-tip{border-color:var(--green)} .scan-sat[data-status="ok"] .ssat-tip::before{border-bottom-color:var(--green)} .scan-sat[data-status="ok"] .ssat-tip b{color:var(--green)}
  .scan-sat[data-status="warn"] .ssat-tip{border-color:var(--amber)} .scan-sat[data-status="warn"] .ssat-tip::before{border-bottom-color:var(--amber)} .scan-sat[data-status="warn"] .ssat-tip b{color:var(--amber)}
  .scan-sat[data-status="err"] .ssat-tip{border-color:var(--red)} .scan-sat[data-status="err"] .ssat-tip::before{border-bottom-color:var(--red)} .scan-sat[data-status="err"] .ssat-tip b{color:var(--red)}
  .scan-sat[data-status="ok"] .ssat-pill{border-color:var(--green)}
  .scan-sat[data-status="ok"] .ssat-dot{background:var(--green);box-shadow:0 0 0 3px rgba(91,209,126,0.20)}
  .scan-sat[data-status="warn"] .ssat-pill{border-color:var(--amber)}
  .scan-sat[data-status="warn"] .ssat-dot{background:var(--amber);box-shadow:0 0 0 3px rgba(232,201,122,0.20)}
  .scan-sat[data-status="err"] .ssat-pill{border-color:var(--red)}
  .scan-sat[data-status="err"] .ssat-dot{background:var(--red);box-shadow:0 0 0 3px rgba(248,113,113,0.20)}
  /* N/A satellite — explicitly marked so the ring stays complete and the
     executive sees "we couldn't measure this" instead of an empty placeholder.
     Dashed grey border + italic N/A score + grey dot. Tooltip on hover
     explains the reason. */
  .scan-sat[data-status="na"] .ssat-pill{border-color:var(--muted);border-style:dashed;opacity:.78}
  .scan-sat[data-status="na"] .ssat-dot{background:var(--muted);box-shadow:0 0 0 3px rgba(91,102,128,0.20)}
  .scan-sat[data-status="na"] .ssat-score{color:var(--muted);font-style:italic;font-weight:700}
  .scan-line[data-status="na"]{background:linear-gradient(to right, transparent 0%, transparent 42%, rgba(91,102,128,0.45) 50%, rgba(91,102,128,0.20) 100%);opacity:.7}
  /* Floating "re-scan" button stacked above the print button, visible after a scan loads. */
  .rescan-btn{
    position:fixed;bottom:74px;right:22px;z-index:40;
    width:42px;height:42px;border-radius:50%;
    background:var(--panel);border:1px solid var(--line);color:var(--muted);
    display:none;align-items:center;justify-content:center;cursor:pointer;
    box-shadow:0 6px 20px rgba(0,0,0,.4);transition:.15s;
  }
  .rescan-btn svg{width:18px;height:18px}
  .rescan-btn:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}
  body.audit-loaded .rescan-btn{display:flex}
  body.pdfgen .rescan-btn{display:none !important}
  /* Pre-scan: gray out the gauge-toggle tabs — there's nothing to switch between yet. */
  body:not(.audit-loaded) .gauge-toggle{opacity:0.45;pointer-events:none}
  /* Hide the legacy cover-left primary button — the halo replaces it */
  .sb-cta{display:none !important}

  .gauge-toggle{display:flex;align-items:stretch;width:fit-content;margin:2px auto 0;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--panel);box-sizing:border-box;height:30px}
  .gauge-toggle .gt-btn{display:inline-flex;align-items:center;height:100%;border:none;background:none;color:var(--muted);font-family:inherit;font-size:12px;font-weight:400;padding:0 16px;cursor:pointer;transition:.12s;position:relative;line-height:1;box-sizing:border-box}
  .gauge-toggle .gt-btn:hover{color:var(--text)}
  .gauge-toggle .gt-btn.active{background:var(--accent);color:#fff}
  /* Tenant name shown under the gauge-toggle on Scorecard + Organizational Posture
     views only. Hidden on Technology Telemetry (which already shows tenant info
     in the halo+pills view above). Controlled via body[data-gauge] attribute. */
  .gt-tenant{display:none;margin:6px auto 0;text-align:center;font-size:12.5px;letter-spacing:.06em;color:var(--muted);font-weight:500}
  .gt-tenant b{color:var(--text);font-weight:700;letter-spacing:0}
  body[data-gauge="bars"] .gt-tenant,
  body[data-gauge="biz"] .gt-tenant{display:block}
  /* On Scorecard + Organizational Posture views, hide "Scan complete · ready
     to export" — the visible page state already communicates that. Keeps the
     MORE BELOW chevron closer to the "Overall posture" line where it belongs. */
  body[data-gauge="bars"] .cover-center .hero-summary,
  body[data-gauge="biz"] .cover-center .hero-summary{display:none}

  /* Row that holds the gauge-toggle + the MS Licensing Utilization pill.
     Both use min-height:28px + box-sizing:border-box + identical font and
     padding properties so they are pixel-identical regardless of internal
     content. The only visible difference: the pill has a gold-accent border
     because it's a standalone action button (open overlay), not part of
     the segmented view-toggle. */
  .gauge-toggle-row{display:flex;align-items:center;justify-content:center;gap:10px;margin:2px auto 0;flex-wrap:wrap}
  .lic-toggle-pill{
    display:none;
    align-items:center;
    box-sizing:border-box;
    height:30px;
    border:1px solid rgba(228,181,61,0.45);
    border-radius:20px;
    background:var(--panel);
    color:#E4B53D;
    font-family:inherit;
    font-size:12px;
    font-weight:400;
    padding:0 16px;
    line-height:1;
    cursor:pointer;
    transition:background 0.15s, border-color 0.15s, color 0.15s;
  }
  body[data-gauge="bars"] .lic-toggle-pill,
  body[data-gauge="biz"] .lic-toggle-pill{display:inline-flex}
  .lic-toggle-pill:hover{background:rgba(228,181,61,0.10);border-color:#E4B53D;color:#E4B53D}
  /* Show the pill only on Scorecard + Organizational Posture views. Hidden on
     Technology Telemetry because the always-visible matrix lives there. */
  body[data-gauge="bars"] .lic-toggle-pill,
  body[data-gauge="biz"] .lic-toggle-pill{display:inline-flex}

  /* Leadership Briefing pill — sits in the gauge-toggle row right of the
     licensing pill. Outlined accent (not gold like licensing) so executives
     can distinguish "open the exec one-pager" from "show me licensing".
     The ↗ glyph signals it opens externally (new tab) — different from the
     gauge-toggle buttons which swap content in place. */
  .brief-toggle-pill{
    display:none;
    align-items:center;
    box-sizing:border-box;
    height:30px;
    border:1px solid rgba(76,201,240,0.55);
    border-radius:20px;
    background:var(--panel);
    color:var(--accent);
    font-family:inherit;
    font-size:12px;
    font-weight:600;
    padding:0 16px;
    line-height:1;
    cursor:pointer;
    transition:background 0.15s, border-color 0.15s, color 0.15s;
  }
  .brief-toggle-pill:hover{background:rgba(76,201,240,0.10);border-color:var(--accent);color:var(--accent)}
  /* Visible on all three views — executives may want to jump to the briefing
     regardless of which dashboard panel they're looking at. */
  body[data-gauge="bars"] .brief-toggle-pill,
  body[data-gauge="biz"] .brief-toggle-pill,
  body[data-gauge="halo"] .brief-toggle-pill{display:inline-flex}
  /* Hide the always-visible matrix on Scorecard + Organizational Posture so the
     main screen stays clean. It's accessible via the pill+overlay instead. */
  body[data-gauge="bars"] .lic-matrix-wrap,
  body[data-gauge="biz"] .lic-matrix-wrap{display:none !important}

  /* Licensing overlay — opens when the pill is clicked. */
  .lic-overlay{
    position:fixed;inset:0;background:rgba(5,12,24,0.78);
    backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
    display:none;align-items:flex-start;justify-content:center;
    padding:48px 24px 24px;z-index:150;overflow-y:auto;
  }
  .lic-overlay.show{display:flex}
  .lic-overlay-card{
    width:100%;max-width:780px;background:var(--panel);
    border:1px solid var(--line);border-radius:14px;overflow:hidden;
    box-shadow:0 30px 80px rgba(0,0,0,0.55);
    animation:lic-pop 0.18s ease-out;
  }
  @keyframes lic-pop{from{transform:scale(0.97);opacity:0}to{transform:scale(1);opacity:1}}
  .lic-overlay-head{
    display:flex;justify-content:space-between;align-items:flex-start;
    padding:18px 22px;border-bottom:1px solid var(--line);gap:16px;
  }
  .lic-overlay-head h2{margin:0;font-size:16px;font-weight:700;color:#E4B53D;letter-spacing:0.04em;text-transform:uppercase}
  .lic-overlay-head .sub{margin:4px 0 0;color:var(--muted);font-size:12.5px;font-weight:400;letter-spacing:0;text-transform:none;line-height:1.5;max-width:520px}
  .lic-overlay-close{
    background:none;border:0;color:var(--muted);font-size:22px;cursor:pointer;
    padding:0 6px;line-height:1;flex-shrink:0;
  }
  .lic-overlay-close:hover{color:var(--text)}
  .lic-overlay-body{padding:18px 22px 22px}
  .lic-overlay-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;
    font-size:12.5px;
  }
  @media (max-width:600px){.lic-overlay-grid{grid-template-columns:1fr}}
  .lic-overlay .lic-row{display:flex;align-items:center;gap:9px;padding:5px 2px;line-height:1.3;border-radius:5px}
  .lic-overlay .lic-mark{
    display:inline-flex;align-items:center;justify-content:center;
    width:18px;height:18px;border-radius:50%;
    font-size:12px;font-weight:800;flex-shrink:0;
  }
  .lic-overlay .lic-mark.yes{color:#fff;background:var(--green)}
  .lic-overlay .lic-mark.no{color:#fff;background:var(--red)}
  .lic-overlay .lic-mark.unk{color:var(--muted);background:transparent;border:1px dashed var(--line)}
  .lic-overlay .lic-name{color:var(--text);font-weight:500}
  .lic-overlay .lic-row.no .lic-name{color:var(--muted);font-weight:400}
  .lic-overlay-summary{
    margin:0 0 14px;padding:10px 14px;border-radius:10px;
    background:var(--panel2);border:1px solid var(--line);
    color:var(--text);font-size:13px;text-align:center;
  }
  .lic-overlay-summary b{color:var(--accent);font-weight:700}
  .lic-overlay-section{margin-top:18px}
  .lic-overlay-section:first-child{margin-top:0}
  .lic-overlay-section-title{
    font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;
    color:var(--accent);font-weight:700;margin:0 0 8px;
    padding-bottom:6px;border-bottom:1px solid var(--line);
  }
  /* Post-scan: the two NON-active view-tabs pulse green to invite the click.
     The active one stays calm. Click another tab → glow shifts automatically
     because the .active class moves. */
  body.audit-loaded .gauge-toggle .gt-btn:not(.active){
    color:#7ed9a3;
    animation:gtGlow 1.8s ease-in-out infinite;
  }
  @keyframes gtGlow{
    0%,100%{box-shadow:inset 0 0 0 0 rgba(46,204,113,0), 0 0 0 0 rgba(46,204,113,0);}
    50%{box-shadow:inset 0 0 12px 0 rgba(46,204,113,0.35), 0 0 10px 0 rgba(46,204,113,0.55);}
  }
  .gb-wrap{display:flex;flex-direction:column;gap:9px;width:100%}
  .gb-row{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
  .gb-name{flex:0 0 170px;font-size:13px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gb-name b{font-weight:700;margin-right:5px}
  .gb-track{flex:1;height:13px;border-radius:7px;background:var(--track);overflow:hidden}
  .gb-track i{display:block;height:100%;border-radius:7px}
  .gb-val{flex:0 0 64px;text-align:right;font-size:13px;font-weight:600}
  .gb-row.gb-res{opacity:.75}
  .gb-res .gb-name,.gb-res .gb-val{color:var(--muted);font-weight:500}
  .gb-overall{margin-top:4px;padding-top:9px;border-top:1px solid var(--line)}
  .gb-overall .gb-name{font-weight:700}
  .gb-overall .gb-track{height:15px}
  .gb-overall .gb-val{font-size:14px;font-weight:700}
  a.gb-row:hover .gb-name{color:var(--accent)}
  .ringlegend{display:flex;flex-wrap:wrap;gap:5px 16px;justify-content:center;max-width:640px;margin:4px auto 2px}
  .lgd{font-size:12px;color:var(--text);white-space:nowrap;border:1px solid var(--line);border-radius:20px;padding:3px 12px;background:var(--panel)}
  .lgd b{font-weight:700}
  .scorering .inner{width:148px;height:148px;border-radius:50%;background:var(--bg);
    display:grid;place-items:center;text-align:center}
  .scorering .grade{font-size:58px;font-weight:760;line-height:1}
  .scorering .lbl{font-size:11px;color:var(--muted);letter-spacing:.13em;text-transform:uppercase;margin-top:5px}
  .heroTitle{font-size:17px;font-weight:600;color:var(--text)}
  .hero-summary{font-size:14.5px;color:var(--muted);max-width:64ch}
  /* Peer benchmark anchor — small contextual line that gives the overall
     grade meaning for executive consumption. Order:4 places it just below
     the hero-summary in the cover-center flex layout. */
  .peer-anchor{order:4;font-size:13px;color:var(--muted-2);max-width:72ch;line-height:1.5;margin-top:6px;text-align:center}
  .peer-band{font-weight:700;padding:2px 9px;border-radius:10px;display:inline-block;font-size:12px;letter-spacing:0.02em;text-transform:uppercase}
  .peer-band-red{color:#FF7A7A;background:rgba(255,122,122,0.10);border:1px solid rgba(255,122,122,0.30)}
  .peer-band-amber{color:#E4B53D;background:rgba(228,181,61,0.10);border:1px solid rgba(228,181,61,0.30)}
  .peer-band-green{color:#5BD17E;background:rgba(91,209,126,0.10);border:1px solid rgba(91,209,126,0.30)}
  .peer-cmp{color:var(--muted)}
  body[data-gauge="biz"] .cover-center .peer-anchor{display:none}
  /* Pillrow hidden — the halo+satellite cluster already shows the same domain
     scores, so this duplicate strip below "Overall posture" was removed. */
  .pillrow{display:none !important}
  .pill{font-size:12.5px;padding:6px 12px;border-radius:20px;border:1px solid var(--line);color:var(--muted);text-decoration:none;cursor:pointer;transition:.12s;display:flex;align-items:center;justify-content:center;gap:4px;text-align:center}
  .pill:hover{background:var(--panel2);color:var(--text);transform:translateY(-1px)}
  .pill b{font-weight:650}
  .meta{color:var(--muted);font-size:12px;margin-top:4px}
  .demo-flag{font-size:11px;color:var(--amber);border:1px solid var(--amber);border-radius:20px;
    padding:3px 10px;background:var(--amber-bg);display:none}
  .scope{margin-top:16px;max-width:780px}
  .scope-title{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#E4B53D;text-align:center;margin-bottom:8px;font-weight:700}
  .scope-list{display:flex;gap:7px 9px;flex-wrap:wrap;justify-content:center}
  .scope-item{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--text);
    border:1px solid var(--line);border-radius:20px;padding:4px 12px;background:var(--panel)}
  .scope-item svg{width:13px;height:13px;flex:none}
  .scope-item.pending{color:var(--muted)}
  .scrollhint{margin-top:14px;color:#E4B53D;font-size:12px;letter-spacing:.05em;font-weight:600;
    animation:bob 1.8s ease-in-out infinite}
  @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}

  /* "More below" indicator that sits directly under "Overall posture — X/100 (X)"
     so the executive knows the visible page isn't the end of the briefing.
     Animated bob + chevron. Shown only after a scan loads (audit-loaded). */
  .posture-more{
    display:none;margin:8px auto 0;text-align:center;
    color:#E4B53D;font-size:12.5px;letter-spacing:.08em;font-weight:700;
    text-transform:uppercase;cursor:pointer;
    animation:bob 1.8s ease-in-out infinite;user-select:none;
  }
  body.audit-loaded .posture-more{display:block}
  .posture-more-chevron{display:block;font-size:18px;margin-top:2px;line-height:1}
  .posture-more:hover{color:#F0CE5C}

  /* ---------- DETAIL ---------- */
  .detail{padding:34px 0 60px}
  .detail h2.sec{font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
    margin:0 0 16px;text-align:center}
  .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
  @media(max-width:760px){.grid{grid-template-columns:1fr}h1.tenant{font-size:24px}}
  .card{background:var(--panel);border:1px solid var(--line);border-radius:14px;
    padding:17px 18px;position:relative;overflow:hidden;scroll-margin-top:80px;transition:box-shadow .3s,border-color .3s,transform .3s}
  .card:target{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent),0 16px 44px rgba(91,140,255,.4);transform:translateY(-2px);animation:cardpulse 1.1s ease-out 2}
  @keyframes cardpulse{0%{box-shadow:0 0 0 0 rgba(91,140,255,.6),0 16px 44px rgba(91,140,255,.4)}70%{box-shadow:0 0 0 18px rgba(91,140,255,0),0 16px 44px rgba(91,140,255,.4)}100%{box-shadow:0 0 0 3px var(--accent),0 16px 44px rgba(91,140,255,.4)}}
  .card.unavail{opacity:.55}
  .card .accentbar{position:absolute;left:0;top:0;bottom:0;width:4px}
  .card h3{margin:0;font-size:15px;font-weight:640;display:flex;align-items:center;gap:9px}
  .cardhead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:13px}
  .badge{font-size:12px;font-weight:700;padding:4px 11px;border-radius:8px;white-space:nowrap}
  .icon{width:19px;height:19px;flex:none;opacity:.92}
  .metrics{display:flex;flex-direction:column;gap:9px;margin-bottom:6px}
  .metric{font-size:13px}
  .metric .ml{display:flex;justify-content:space-between;margin-bottom:3px}
  .metric .ml span:last-child{color:var(--muted);font-variant-numeric:tabular-nums}
  .bar{height:7px;border-radius:5px;background:var(--track);overflow:hidden}
  .bar i{display:block;height:100%;border-radius:5px}
  .findings{margin:12px 0 0;padding:11px 0 0;border-top:1px solid var(--line);list-style:none}
  .findings li{font-size:12.7px;color:var(--muted);padding:3px 0 3px 17px;position:relative}
  .findings li::before{content:"";position:absolute;left:2px;top:8px;width:6px;height:6px;border-radius:50%}
  .findings li.f-red::before{background:var(--red)}
  .findings li.f-amber::before{background:var(--amber)}
  .findings li.f-green::before{background:var(--green)}
  .findings li.f-info::before{background:var(--grey)}
  .empty{font-size:13px;color:var(--muted);padding:8px 0}
  footer{margin-top:26px;color:var(--muted);font-size:12px;text-align:center}
  .drop{position:fixed;inset:0;background:rgba(10,14,22,.85);display:none;
    place-items:center;z-index:50;border:3px dashed var(--accent)}
  .drop.show{display:grid}.drop div{font-size:18px;color:var(--text)}
  .printbtn-wrap{position:fixed;bottom:22px;right:22px;z-index:40}
  .printbtn{display:inline-flex;align-items:center;gap:9px;
    background:var(--accent);color:#fff;border:none;border-radius:11px;padding:12px 18px;font-size:14px;
    font-weight:600;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.4);transition:.15s}
  .printbtn:hover{filter:brightness(1.08);transform:translateY(-1px)}
  .printbtn svg{width:17px;height:17px}
  .printmenu{position:absolute;bottom:calc(100% + 8px);right:0;background:var(--panel);
    border:1px solid var(--line);border-radius:11px;padding:6px;min-width:280px;
    box-shadow:0 10px 30px rgba(0,0,0,.5);display:none;flex-direction:column;gap:2px}
  .printmenu.show{display:flex}
  .printmenu-item{background:transparent;border:none;color:var(--text);text-align:left;
    padding:11px 14px;border-radius:8px;cursor:pointer;font-family:inherit;transition:.12s;display:block;width:100%}
  .printmenu-item:hover{background:rgba(91,140,255,.14)}
  .printmenu-item .pmi-title{font-size:13.5px;font-weight:600;color:var(--text);margin-bottom:3px}
  .printmenu-item .pmi-sub{font-size:11.5px;color:var(--muted);line-height:1.4}
  .themebtn{position:fixed;bottom:22px;left:22px;z-index:40;display:inline-flex;align-items:center;gap:8px;
    background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:22px;padding:10px 16px;
    font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 4px 16px rgba(20,40,80,.14);transition:.15s}
  .themebtn:hover{border-color:var(--accent);color:var(--accent)}
  .demobtn{position:fixed;bottom:66px;left:22px;z-index:40;display:inline-flex;align-items:center;gap:7px;
    background:var(--panel);color:var(--muted);border:1px solid var(--line);border-radius:22px;padding:8px 15px;
    font-size:12.5px;font-weight:700;letter-spacing:.04em;cursor:pointer;box-shadow:0 4px 16px rgba(20,40,80,.14);transition:.15s}
  .demobtn:hover{border-color:var(--accent);color:var(--accent)}
  .demobtn.on{background:var(--accent);color:#fff;border-color:var(--accent)}
  .demobtn .dot{width:8px;height:8px;border-radius:50%;background:var(--muted)}
  .demobtn.on .dot{background:#fff}
  .themeic{display:inline-flex}.themeic svg{width:16px;height:16px}
  .headright{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}
  .cardpill{font-size:11px;font-weight:600;color:var(--accent);background:rgba(91,140,255,.12);
    border:1px solid var(--accent);border-radius:8px;padding:3px 9px;cursor:pointer;transition:.12s;white-space:nowrap}
  .cardpill:hover{background:rgba(91,140,255,.24)}
  .modal-overlay{position:fixed;inset:0;background:rgba(8,11,18,.74);display:none;place-items:center;z-index:95;padding:24px}
  .modal-overlay.show{display:grid}
  .modal{background:var(--panel);border:1px solid var(--line);border-radius:14px;max-width:780px;width:100%;
    max-height:80vh;display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(0,0,0,.55)}
  .modal-head{display:flex;justify-content:space-between;align-items:center;padding:15px 18px;
    border-bottom:1px solid var(--line);font-size:15px;font-weight:650}
  .modal-x{background:none;border:none;color:var(--muted);font-size:23px;line-height:1;cursor:pointer}
  .modal-x:hover{color:var(--text)}
  .backbtn{background:var(--panel2);border:1px solid var(--accent);color:var(--accent);font-size:13px;font-weight:600;
    border-radius:8px;padding:6px 14px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.12s}
  .backbtn:hover{background:rgba(91,140,255,.14);transform:translateY(-1px)}
  .modal-body{padding:6px 18px 16px;overflow:auto}
  .mrow{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px}
  .mrow:last-child{border-bottom:none}
  .mrow .msub{color:var(--muted);font-size:12.5px;text-align:right}
  .mtable{width:100%;border-collapse:collapse;font-size:12.5px}
  .mtable th{text-align:left;color:var(--muted);font-weight:600;font-size:10px;text-transform:uppercase;letter-spacing:.05em;padding:6px 8px;border-bottom:1px solid var(--line)}
  .mtable td{padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--text)}
  .mtable tr:last-child td{border-bottom:none}
  .mtable .psub{color:var(--muted);font-size:11px;margin-top:2px}
  .cardpill.cfg{color:var(--muted);border-color:var(--line);background:transparent}
  .cardpill.cfg:hover{border-color:var(--accent);color:var(--accent);background:rgba(91,140,255,.10)}
  .sstable{width:100%;border-collapse:collapse;margin-top:8px;font-size:12.7px}
  .sstable th{text-align:left;color:var(--muted);font-weight:600;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;padding:6px 0;border-bottom:1px solid var(--line)}
  .sstable th:last-child,.sstable td:last-child{text-align:right;white-space:nowrap;width:1%}
  .sstable td{padding:7px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--text)}
  .sstable tr:last-child td{border-bottom:none}
  .pts{color:var(--muted);font-size:11px}
  .val{font-weight:600;font-size:11.5px;padding:2px 9px;border-radius:6px;white-space:nowrap}
  .val-green{color:var(--green);background:var(--green-bg)}
  .val-amber{color:var(--amber);background:var(--amber-bg)}
  .val-red{color:var(--red);background:var(--red-bg)}
  .val-grey{color:var(--muted);background:var(--grey-bg)}
  .registrar-row{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;align-items:center;margin-top:10px;max-width:780px}
  .reg-dns{color:var(--accent-strong,#5BD17E);font-weight:600;font-size:0.92em;letter-spacing:0.01em}
  .reg-title{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#E4B53D;width:100%;font-weight:700;text-align:center}
  .regpill{font-size:11.5px;color:var(--muted);border:1px solid var(--line);border-radius:20px;padding:3px 11px}
  .regpill b{color:var(--text);font-weight:650}
  a.reglink{text-decoration:none;cursor:pointer;transition:.12s}
  a.reglink:hover{border-color:var(--accent);color:var(--text)}
  .bigpill{margin-top:4px;background:var(--panel2);border:1px solid var(--accent);color:var(--accent);
    font-size:12.5px;font-weight:600;border-radius:9px;padding:8px 16px;cursor:pointer;transition:.12s}
  .bigpill:hover{background:rgba(91,140,255,.16);transform:translateY(-1px)}
  .bigpill-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:4px}
  /* Pre-scan state: hide the export pills and the floating PDF button until
     setLoaded(true) fires after a successful scan/audit load. */
  body:not(.audit-loaded) .bigpill-row,
  body:not(.audit-loaded) .printbtn,
  body:not(.audit-loaded) .printbtn-wrap { display: none !important; }

  .policy-page{position:fixed;inset:0;background:var(--bg);z-index:70;display:none;flex-direction:column}
  .policy-page.show{display:flex}
  .policy-head{display:flex;justify-content:space-between;align-items:center;padding:18px 26px;
    border-bottom:1px solid var(--line);font-size:17px;font-weight:650}
  /* Back button on every policy-page head. The old "Home" breadcrumb link
     was too easy to miss. This is the executive's primary way out. */
  .policy-head-left{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
  .policy-back-btn{
    display:inline-flex;align-items:center;gap:6px;
    background:var(--panel2);border:1px solid var(--accent);color:var(--accent);
    font-family:inherit;font-size:13px;font-weight:700;letter-spacing:.02em;
    padding:8px 16px;border-radius:8px;cursor:pointer;transition:.12s
  }
  .policy-back-btn:hover{background:rgba(91,140,255,0.14);transform:translateY(-1px);box-shadow:0 4px 12px rgba(91,140,255,0.25)}
  .policy-back-btn svg{flex:0 0 auto}
  .crumbs{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--muted);font-weight:500;flex-wrap:wrap}
  .crumbs a{color:var(--accent);cursor:pointer;text-decoration:none;border-bottom:1px solid transparent;padding:2px 0;transition:.12s}
  .crumbs a:hover{border-bottom-color:var(--accent);color:var(--accent)}
  .crumbs .sep{color:var(--muted);font-size:14px;opacity:.7}
  .crumbs .here{color:var(--text);font-weight:600}
  .tlegend{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;margin:8px 0 4px;padding:10px 14px;background:var(--panel2);border:1px solid var(--line);border-radius:8px}
  .tlegitem{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--text)}
  .tlegitem .tldot{width:10px;height:10px;border-radius:50%;flex:none}
  .tlegitem .tllbl{font-weight:600}
  .tlegitem .tlcur{color:var(--text)}
  .tlegitem .tdelta{font-size:12px}
  .tlegitem .tlref{color:var(--muted);font-size:11px;letter-spacing:.04em}
  .ctlnote{width:100%;min-width:140px;font-family:inherit;font-size:12.5px;color:var(--text);background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:4px 8px;box-sizing:border-box}
  .ctlnote:focus{border-color:var(--accent);outline:none;background:var(--panel)}
  .ptable td .ctlnote{margin:0}
  .policy-body{overflow:auto;padding:14px 26px 50px;max-width:1400px;margin:0 auto;width:100%}
  .pgrp{font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);margin:22px 0 6px;display:flex;align-items:center;gap:9px}
  .pcount{font-size:11px;color:var(--muted);background:var(--panel2);border-radius:10px;padding:1px 9px;letter-spacing:0}
  .insctl{font-size:11px;border:1px solid var(--line);background:var(--panel);color:var(--accent);border-radius:14px;padding:2px 11px;margin-left:8px;cursor:pointer;font-weight:600;letter-spacing:0;text-transform:none}
  .insctl:hover{border-color:var(--accent);background:rgba(91,140,255,.10)}
  .ptable{width:100%;border-collapse:collapse;font-size:12.7px}
  .ptable th{text-align:left;color:var(--muted);font-weight:600;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;padding:7px 10px;border-bottom:1px solid var(--line)}
  .ptable td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--text)}
  .ptable td.psub{color:var(--muted)}
  .effwrap{display:flex;align-items:center;gap:8px;min-width:120px}
  .effbar{flex:1;height:7px;border-radius:5px;background:var(--track);overflow:hidden;min-width:64px}
  .effbar i{display:block;height:100%}
  .effpct{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
  .pflag{font-size:11px;color:var(--red);margin-top:3px}
  .insscore{display:flex;align-items:center;gap:26px;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 22px;margin:0 0 10px;position:sticky;top:0;z-index:5;box-shadow:0 8px 20px rgba(20,40,80,.14)}
  .insbig{display:flex;align-items:center;gap:14px}
  .insnum{font-size:40px;font-weight:760;line-height:1}
  .inslbl{font-size:11.5px;color:var(--muted);letter-spacing:.04em;line-height:1.3}
  .insbreak{font-size:13px;color:var(--text);display:flex;flex-direction:column;gap:3px}
  .inschk{width:16px;height:16px;cursor:pointer;accent-color:var(--accent)}
  .insstatus{padding:5px 26px 5px 10px !important;border-radius:6px !important;font-weight:700 !important;font-size:12px !important;cursor:pointer !important;border:1px solid currentColor !important;font-family:inherit !important;-webkit-appearance:none !important;-moz-appearance:none !important;appearance:none !important;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' stroke='%23ffffff' stroke-width='1.6' fill='none' stroke-linecap='round'/></svg>") !important;background-repeat:no-repeat !important;background-position:right 7px center !important;min-width:84px;text-align-last:center}
  .insstatus.insst-full{background-color:var(--green) !important;color:#ffffff !important;border-color:var(--green) !important}
  .insstatus.insst-partial{background-color:var(--amber) !important;color:#ffffff !important;border-color:var(--amber) !important}
  .insstatus.insst-gap{background-color:var(--red) !important;color:#ffffff !important;border-color:var(--red) !important}
  .insstatus.insst-none{background-color:var(--panel) !important;color:var(--muted) !important;border-color:var(--line) !important;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' stroke='%23708090' stroke-width='1.6' fill='none' stroke-linecap='round'/></svg>") !important}
  .insstatus option{background:var(--panel) !important;color:var(--text) !important}
  .inscards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px;margin:10px 0 18px}
  .inscard{display:flex;gap:10px;background:linear-gradient(135deg,rgba(18,115,184,0.10) 0%,rgba(18,115,184,0.02) 100%);border:1px solid rgba(18,115,184,0.35);border-radius:10px;padding:12px}
  .inscard-letter{flex-shrink:0;width:34px;height:34px;border-radius:50%;background:#1273B8;color:#fff;font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(18,115,184,0.4)}
  .inscard-body{flex:1;min-width:0}
  .inscard-title{font-weight:700;color:#1273B8;font-size:14px;margin-bottom:4px}
  .inscard-sub{font-size:12.5px;color:var(--text);line-height:1.45}
  .inscard.inscard-lic{background:linear-gradient(135deg,rgba(184,137,20,0.10) 0%,rgba(184,137,20,0.02) 100%);border-color:rgba(184,137,20,0.35)}
  .inscard.inscard-lic .inscard-letter{background:#B88914}
  .inscard.inscard-lic .inscard-title{color:#B88914}
  .inscard-lictag{display:inline-block;margin-top:5px;padding:2px 8px;border-radius:4px;background:rgba(184,137,20,0.18);color:#B88914;font-size:11px;font-weight:600}
  .inscard{position:relative;padding-bottom:34px}
  .inscard-lic-mark{position:absolute;bottom:8px;right:8px;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;line-height:1;cursor:default}
  .inscard-lic-yes{background:var(--green);color:#fff}
  .inscard-lic-no{background:var(--red);color:#fff}
  .inscard-lic-manual{background:var(--muted);color:#fff;font-size:11px}



  input[type=file]{display:none}

  /* ---------- METHODOLOGY & SCOPE APPENDIX ---------- */
  .appx{padding:10px 0 60px}
  .appx h3{font-size:16px;margin:26px 0 8px;color:var(--text)}
  .appx h3:first-of-type{margin-top:6px}
  .appx p{font-size:13.5px;color:var(--muted);max-width:92ch;margin:0 0 10px;line-height:1.62}
  .appx .two{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:6px 0 4px}
  .appx .col h4{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
  .appx .lst{list-style:none;padding:0;margin:0}
  .appx .lst li{font-size:13px;color:var(--text);padding:5px 0 5px 25px;position:relative;line-height:1.45}
  .appx .lst li::before{position:absolute;left:0;top:5px;font-weight:700}
  .appx .lst.in li::before{content:"\2713";color:var(--green)}
  .appx .lst.out li::before{content:"\2014";color:var(--grey)}
  .appx table.wt{width:100%;border-collapse:collapse;font-size:13px;margin:4px 0 8px}
  .appx table.wt th,.appx table.wt td{text-align:left;padding:8px 11px;border-bottom:1px solid var(--line);vertical-align:top}
  .appx table.wt th{color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.05em}
  .appx table.wt td.w{text-align:center;font-weight:700;color:var(--text);width:78px;white-space:nowrap}
  .appx table.wt td.dom{font-weight:600;color:var(--text);width:210px}
  .appx .scale{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 12px}
  .appx .scale span{font-size:12px;padding:5px 11px;border-radius:7px;font-weight:700}
  .appx .note{font-size:12.5px;color:var(--text);background:var(--panel2);border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:8px;padding:10px 13px;margin:7px 0;line-height:1.55;max-width:92ch}
  .appx .note b{color:var(--text)}
  .appx code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;background:var(--panel2);border:1px solid var(--line);border-radius:4px;padding:1px 5px;color:var(--text)}
  .appx .scopes{line-height:2.2;max-width:92ch}
  .callout{font-size:12.8px;color:var(--text);background:var(--panel2);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;padding:11px 14px;margin:8px 0;line-height:1.55;max-width:94ch}
  .callout.amber{border-left-color:var(--amber)}
  .callout b{color:var(--text)}
  .abtabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:2px 0 14px}
  .abtab{font-size:13px;border:none;background:none;color:var(--muted);padding:9px 15px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;font-weight:600}
  .abtab:hover{color:var(--text)}
  .abtab.active{color:var(--accent);border-bottom-color:var(--accent)}
  .abpanel{display:none}
  .abpanel.show{display:block}
  .tgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:14px 0}
  .tcell{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:11px 13px}
  .tname{font-size:12px;color:var(--muted);margin-bottom:3px}
  .trow{display:flex;align-items:baseline;gap:8px;margin-bottom:5px}
  .tcur{font-size:21px;font-weight:700;color:var(--text)}
  .tdelta{font-weight:700;font-size:12px}
  .tchart{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin:12px 0}
  .tchart h4{margin:0 0 8px;font-size:13px;color:var(--text);font-weight:600;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
  .tchart svg{display:block;width:100%;height:auto}
  .trange{font-size:12px;color:var(--muted);margin:2px 0 6px}
  .trendbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
  .howstep{display:flex;gap:12px;margin:12px 0;align-items:flex-start}
  .howstep .hnum{flex:none;width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;margin-top:1px}
  .howstep .hbody{font-size:13.5px;color:var(--text);line-height:1.55}
  .hbtns{display:flex;gap:8px;flex-wrap:wrap;margin:9px 0 2px;align-items:center}
  .hnote{font-size:12px;color:var(--muted)}
  .cmd{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:11px 13px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;color:var(--text);white-space:pre;overflow:auto;margin:9px 0 4px}
  .copybtn,.dlbtn{font-size:12.5px;font-weight:600;border-radius:8px;padding:6px 13px;cursor:pointer;border:1px solid var(--accent);color:var(--accent);background:var(--panel);text-decoration:none;display:inline-flex;align-items:center;gap:5px;transition:.12s}
  .copybtn:hover,.dlbtn:hover{background:rgba(91,140,255,.12)}
  .dlbtn{border-color:var(--green);color:var(--green)}
  .dlbtn:hover{background:rgba(21,146,79,.12)}
  .pricewrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:14px;margin:14px 0}
  .pcard{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
  .pcard.feature{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
  .pcard .ptag{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700}
  .pcard.feature .ptag{color:var(--accent)}
  .pcard h4{margin:4px 0 6px;font-size:16px;color:var(--text);font-weight:600}
  .pcard .price{font-size:22px;font-weight:700;color:var(--text)}
  .pcard .per{font-size:12px;color:var(--muted);margin-bottom:6px}
  .pcard .lst li{font-size:12.5px;padding:3px 0 3px 22px}
  .appx .rrow{font-size:13px;color:var(--text);line-height:1.55;padding:8px 0;border-bottom:1px solid var(--line)}
  .appx .rrow .rw{color:var(--accent);font-weight:700}
  .pcard{cursor:pointer}
  .pcard:hover{box-shadow:0 4px 16px rgba(20,40,80,.12)}
  .pcard .pmore{font-size:11.5px;color:var(--accent);font-weight:600;margin-top:9px}
  .pcard.pc-green{border:1.5px solid var(--green);box-shadow:0 0 0 1.5px var(--green)}
  .pcard.pc-green .ptag{color:var(--green)}
  .pcard.pc-blue{border:1.5px solid var(--accent)}
  .pcard.pc-blue .ptag{color:var(--accent)}
  .pcard.pc-orange{border:1.5px solid #E08A2F}
  .pcard.pc-orange .ptag{color:#E08A2F}
  .pcard.pc-yellow{border:1px solid #C9A227}
  .pcard.pc-yellow .ptag{color:#A98910}
  .buyer-steer{font-size:13px;color:var(--text);background:var(--panel2);border-left:3px solid var(--green);border-radius:8px;padding:10px 14px;margin:6px 0 16px}
  .whyworth{font-style:italic;font-size:15px;line-height:1.62;color:var(--text);background:var(--panel2);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:10px;padding:16px 20px;margin:14px 0;width:100%}
  .compbox{font-size:13px;line-height:1.6;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 18px;margin:12px 0;width:100%}
  .compbox h4{margin:0 0 6px;font-size:14px;color:var(--text);font-weight:600}
  .histline{font-size:12.5px;color:var(--muted);margin-top:6px}
  /* Mobile clutter cleanup — hide the historical-comparison count on phones.
     It's reference info, not actionable, and it crowds an already-narrow
     header on small screens. */
  @media (max-width: 640px){
    .histline{display:none}
  }
  .insnotesarea{width:100%;min-height:96px;box-sizing:border-box;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);font-family:inherit;font-size:13px;padding:10px 12px;resize:vertical}
  .pkg h5{margin:13px 0 4px;font-size:13px;color:var(--accent);font-weight:600}
  .pkg p,.pkg li{font-size:13px;color:var(--text);line-height:1.5}
  .pkg ul{margin:4px 0 0;padding-left:20px}
  .printonly{display:none}
  @media print{ .printonly{display:block !important} }
  body.pdfgen .printonly{display:block !important}
  body.pdfgen .printbtn,body.pdfgen .printbtn-wrap,body.pdfgen .demobtn,body.pdfgen .themebtn,body.pdfgen .modal-overlay,body.pdfgen .policy-page{display:none !important}
  .ppl{margin:24px 0 6px;font-size:18px;font-weight:700;color:var(--accent);border-bottom:2px solid var(--accent);padding-bottom:4px}
  .pinsrow{margin:8px 0;padding:8px 10px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;font-size:12.5px;page-break-inside:avoid}
  .pinsrow .ptt{font-weight:600;color:var(--text);font-size:13px}
  .pinsrow .pst{display:inline-block;font-size:11px;padding:1px 8px;border-radius:10px;margin-left:6px;color:#fff}
  .pinsrow .pst-green{background:var(--green)} .pinsrow .pst-amber{background:var(--amber)} .pinsrow .pst-red{background:var(--red)} .pinsrow .pst-grey{background:var(--muted)}
  .pinsrow .pmt{color:var(--muted);font-size:11.5px;margin:3px 0}
  .pinsrow .pnt{margin-top:4px;color:var(--text);font-size:12.5px;border-left:2px solid var(--accent);padding-left:8px}
  .logoprev{display:flex;align-items:center;gap:16px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin:10px 0;min-height:64px}
  .logoprev img{max-height:60px;max-width:220px;display:none}

  /* ---------- PRINT / PDF ---------- */
  @page{ margin:12mm; }
  @media print{
    html,body{background:#fff !important;-webkit-print-color-adjust:exact;print-color-adjust:exact;color-adjust:exact}
    html[data-theme="dark"]{--bg:#fff;--panel:#fff;--panel2:#f4f6fb;--line:#dbe3ef;--text:#1b2740;--muted:#69748b;--track:#e6ecf5;--green:#15924f;--amber:#b9810c;--red:#d23b3b;--grey:#7b8699;--green-bg:rgba(21,146,79,.12);--amber-bg:rgba(185,129,12,.15);--red-bg:rgba(210,59,59,.10);--grey-bg:rgba(123,134,153,.13)}
    .wrap{max-width:none;padding:0}
    /* cover becomes its own first page, no forced viewport height */
    .cover{min-height:auto;padding:0 0 8px;page-break-after:always;break-after:page}
    .cover-center{padding:14px 0}
    .scrollhint{display:none !important}
    .gauge-toggle{display:none !important}
    .appx{break-before:page;page-break-before:always}
    .appx .two{break-inside:avoid}
    .load-caption{display:none !important}
    .demo-flag{display:none !important}
    .drop{display:none !important}
    .printbtn,.printbtn-wrap,.cardpill,.modal-overlay,.policy-page,.bigpill,.themebtn,.demobtn{display:none !important}
    /* keep each card whole; never split across pages */
    .card{break-inside:avoid;page-break-inside:avoid}
    .detail{padding:0}
    .detail h2.sec{page-break-before:avoid;page-break-after:avoid;margin-top:4px}
    .grid{gap:13px}
    footer{break-inside:avoid;page-break-before:avoid;margin-top:14px}
    /* ensure ring + bars render their colors */
    .scorering,.bar,.bar i,.badge,.accentbar,.logo{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  }
  .prereq-card{background:var(--panel2);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;padding:13px 16px;margin:10px 0 18px}
  .prereq-card h4{margin:0 0 10px;font-size:12px;color:var(--accent);letter-spacing:.1em;text-transform:uppercase;font-weight:700}
  .prereq-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 22px}
  .prereq-item b{display:block;color:var(--text);font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}
  .prereq-item div{font-size:13px;color:var(--muted);line-height:1.5}
  .prereq-item code{font-size:12px;background:var(--panel);padding:1px 5px;border-radius:4px}
  .saveloc-card{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin:8px 0 14px}
  .saveloc-row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:8px 0;font-size:13px;color:var(--text)}
  .saveloc-row + .saveloc-row{border-top:1px dashed var(--line)}
  .saveloc-row .hbtns{display:flex;gap:8px;margin:0}
  .saveloc-toggle{display:flex;align-items:center;gap:8px;cursor:pointer;color:var(--muted)}
  .saveloc-note{margin-top:8px;font-size:12px;color:var(--amber);background:var(--panel);padding:8px 10px;border-radius:6px;border:1px dashed var(--amber)}
  .printbtn.is-disabled, .bigpill.is-disabled{opacity:.42;cursor:not-allowed;pointer-events:none;filter:saturate(.4)}
  @media print {
    body > *:not(#pdfScaffold){display:none !important}
    #pdfScaffold{display:block !important}
    body{background:#fff !important;margin:0 !important;padding:0 !important}
    .pdf-scaffold{display:block !important}
    .pdf-scaffold .pdf-page{padding:0.55in 0.55in !important}
  }
  @page{margin:0;size:letter portrait}
  #saveLocName{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--accent)}

  /* ===== PDF scaffold (rendered into PDF only) ===== */
  .pdf-scaffold{display:none;width:8.5in;background:#fff;color:#0B1B3A;font-family:Arial,Helvetica,sans-serif;font-size:11pt;line-height:1.45;padding:0;margin:0 auto;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body.pdfgen .pdf-scaffold{display:block !important}
  body.pdfgen > *:not(#pdfScaffold){display:none !important}
  body.pdfgen #pdfScaffold *{display:revert}
  /* Insurance-only PDF mode: drop pages that don't belong in an insurance report. */
  body.pdfgen.pdfgen-ins #pdfScaffold .pdf-page[data-pdf-section="breakdown"],
  body.pdfgen.pdfgen-ins #pdfScaffold .pdf-page[data-pdf-section="detail"],
  body.pdfgen.pdfgen-ins #pdfScaffold .pdf-page[data-pdf-section="trajectory"],
  body.pdfgen.pdfgen-ins #pdfScaffold .pdf-page[data-pdf-section="appendix"]{display:none !important}

  .pdf-scaffold .pdf-page:last-child{page-break-after:auto}
  .pdf-scaffold h1{font-size:22pt;color:#1862B5;margin:0 0 10pt}
  .pdf-scaffold h2{font-size:17pt;color:#1862B5;margin:0 0 8pt;border-bottom:1pt solid #d0d8e3;padding-bottom:4pt}
  .pdf-scaffold h3{font-size:12.5pt;color:#0B1B3A;margin:12pt 0 6pt}
  .pdf-scaffold .pdf-brand{font-size:9pt;letter-spacing:1.5pt;color:#888;text-transform:uppercase}
  .pdf-scaffold .pdf-meta{font-size:9pt;color:#666;margin:4pt 0 12pt}
  .pdf-scaffold .pdf-page{position:relative;padding:0.25in 0.55in 0.4in 0.55in !important;page-break-after:always;break-after:page;page-break-inside:auto}
  .pdf-scaffold .pdf-cover{text-align:center;padding-top:0.05in !important}
  .pdf-scaffold .pdf-cover h1{font-size:32pt;color:#0B1B3A;margin-top:30pt}
  .pdf-scaffold .pdf-cover .pdf-brand{font-size:10pt;letter-spacing:2.2pt;color:#9aa6bd;margin-top:0;text-align:center}
  .pdf-scaffold .pdf-cover .pdf-meta{font-size:9.5pt;color:#777;margin:3pt 0 0}
  .pdf-scaffold .pdf-cover-logo{position:absolute;top:0;right:0;width:1.4in;height:auto;display:block;z-index:2}
  .pdf-scaffold .pdf-conf-stamp{display:block;width:78%;box-sizing:border-box;margin:16pt auto 10pt;padding:7pt 16pt;border-radius:22pt;background:rgba(184,137,20,.06);color:#B88914;font-size:11pt;font-weight:700;letter-spacing:2pt;text-transform:uppercase;border:0.7pt solid #B88914;text-align:center}
  .pdf-scaffold .pdf-ctrl{margin:3pt 0 !important;padding:4pt 7pt !important}
  .pdf-scaffold .pdf-ctrl .pdf-ctt{font-size:10.5pt !important}
  .pdf-scaffold .pdf-ctrl .pdf-cmt{font-size:9pt !important;margin-top:1pt !important}
  .pdf-scaffold .pdf-cover .pdf-grade{margin:18pt auto 6pt;font-family:Arial,Helvetica,sans-serif}
  .pdf-scaffold .pdf-cover .pdf-gnum{font-size:84pt;font-weight:700;line-height:1}
  .pdf-scaffold .pdf-cover .pdf-gltr{font-size:36pt;font-weight:700;margin-top:4pt}
  .pdf-scaffold .pdf-cover .pdf-glbl{font-size:11pt;color:#666;letter-spacing:1pt;text-transform:uppercase;margin-top:8pt}
  .pdf-scaffold .pdf-cover .pdf-narr{max-width:5.5in;margin:10pt auto 0;font-size:11pt;color:#444;line-height:1.55}
  .pdf-scaffold .pdf-cover .pdf-foot{position:relative;margin-top:60pt;color:#999;font-size:9pt}
  .pdf-scaffold .pdf-dom-row{display:block;padding:8pt 0;border-bottom:1pt solid #e8edf4;page-break-inside:avoid}
  .pdf-scaffold .pdf-dom-row:last-child{border-bottom:none}
  .pdf-scaffold .pdf-dom-top{display:flex;align-items:center;gap:10pt;font-size:12pt;color:#0B1B3A}
  .pdf-scaffold .pdf-dom-name{font-weight:600}
  .pdf-scaffold .pdf-dom-sub{font-size:10pt;color:#888;margin-top:2pt;margin-left:0}
  .pdf-scaffold .pdf-pill{display:inline-block;padding:2pt 8pt;border-radius:9pt;font-size:9pt;font-weight:700;color:#fff}
  .pdf-scaffold .pdf-pill-green{background:#2FB36B} .pdf-scaffold .pdf-pill-amber{background:#E0A14F} .pdf-scaffold .pdf-pill-red{background:#D94B4B} .pdf-scaffold .pdf-pill-grey{background:#9aa6bd}
  .pdf-scaffold .pdf-c-green{color:#2FB36B} .pdf-scaffold .pdf-c-amber{color:#C9842A} .pdf-scaffold .pdf-c-red{color:#D94B4B} .pdf-scaffold .pdf-c-grey{color:#9aa6bd}
  .pdf-scaffold .pdf-ctrl{margin:5pt 0;padding:6pt 8pt;background:#f7f9fc;border-radius:4pt;page-break-inside:avoid}
  .pdf-scaffold .pdf-ctrl .pdf-ctt{font-weight:600;font-size:11pt}
  .pdf-scaffold .pdf-ctrl .pdf-cmt{color:#666;font-size:9.5pt;margin-top:2pt}
  .pdf-scaffold .pdf-ctrl .pdf-cnt{border-left:2pt solid #1862B5;padding-left:8pt;margin-top:4pt;color:#0B1B3A;font-size:10pt}
  .pdf-scaffold .pdf-readiness{display:flex;align-items:center;gap:16pt;background:#f7f9fc;border-radius:6pt;padding:12pt 14pt;margin:8pt 0 14pt}
  /* Licensing Coverage page styles */
  .pdf-scaffold .pdf-lic-intro{font-size:10pt;color:#555;line-height:1.5;margin:0 0 12pt}
  .pdf-scaffold .pdf-lic-grid{display:grid;grid-template-columns:1fr 1fr;gap:8pt 18pt;margin:6pt 0 10pt}
  .pdf-scaffold .pdf-lic-section{break-inside:avoid;page-break-inside:avoid}
  .pdf-scaffold .pdf-lic-section h3{font-size:11pt;color:#0B1B3A;margin:6pt 0 4pt;padding-bottom:2pt;border-bottom:1pt solid #cbd5e7;font-weight:700;letter-spacing:0.04em;text-transform:uppercase}
  .pdf-scaffold .pdf-lic-table{width:100%;border-collapse:collapse;font-size:9.2pt}
  .pdf-scaffold .pdf-lic-table td{padding:3pt 4pt;border-bottom:0.5pt solid #ecf0f6;vertical-align:top}
  .pdf-scaffold .pdf-lic-table .pdf-lic-name{color:#333;width:60%}
  .pdf-scaffold .pdf-lic-table .pdf-lic-mark{width:8%;text-align:center;font-weight:800;font-size:10pt}
  .pdf-scaffold .pdf-lic-table .pdf-lic-mark.pdf-yes{color:#15924f}
  .pdf-scaffold .pdf-lic-table .pdf-lic-mark.pdf-no{color:#d23b3b}
  .pdf-scaffold .pdf-lic-table .pdf-lic-src{color:#777;font-size:8.5pt;width:32%}
  .pdf-scaffold .pdf-lic-summary{display:flex;gap:14pt;margin:8pt 0 0;padding:8pt 12pt;background:#f0f4fa;border-radius:5pt;font-size:10pt;color:#444}
  .pdf-scaffold .pdf-lic-summary b{color:#0B1B3A}
  .pdf-scaffold .pdf-foot-note{font-size:8.5pt;color:#888;margin-top:10pt;line-height:1.5;font-style:italic}
  .pdf-scaffold .pdf-readiness .pdf-rnum{font-size:36pt;font-weight:700;line-height:1}
  .pdf-scaffold .pdf-readiness .pdf-rlbl{font-size:10pt;color:#666;line-height:1.35}
  .pdf-scaffold .pdf-tchart{margin:14pt 0;padding:10pt;background:#fff;border:1pt solid #e0e6ef;border-radius:6pt;page-break-inside:avoid}
  .pdf-scaffold .pdf-tchart .pdf-th{display:flex;justify-content:space-between;font-size:11pt;font-weight:600;color:#0B1B3A;margin-bottom:6pt}
  .pdf-scaffold .pdf-tchart svg{width:100%;height:auto}
  .pdf-scaffold .pdf-tlegend{display:flex;flex-wrap:wrap;gap:18pt;justify-content:center;margin:8pt 0 4pt;padding:8pt 12pt;background:#f7f9fc;border-radius:5pt;font-size:10.5pt}
  .pdf-scaffold .pdf-tli{display:inline-flex;align-items:center;gap:6pt}
  .pdf-scaffold .pdf-tldot{width:8pt;height:8pt;border-radius:50%;display:inline-block}
  .pdf-scaffold .pdf-appdiv{text-align:center;padding-top:2.6in}
  .pdf-scaffold .pdf-appdiv .pdf-aplbl{font-size:11pt;color:#888;letter-spacing:2pt;text-transform:uppercase}
  .pdf-scaffold .pdf-appdiv h1{font-size:38pt;color:#0B1B3A;margin-top:14pt;letter-spacing:1pt}
  .pdf-scaffold .pdf-aplbl{font-size:9pt;color:#888;letter-spacing:2pt;text-transform:uppercase;margin-bottom:2pt;display:block}
  .pdf-scaffold h1.pdf-appdivh{font-size:22pt;color:#0B1B3A;margin:0 0 12pt;border-bottom:1pt solid #d0d8e3;padding-bottom:8pt;letter-spacing:.5pt}
  .pdf-scaffold .pdf-tbl{width:100%;border-collapse:collapse;font-size:10pt;margin-top:6pt}
  .pdf-scaffold .pdf-tbl th{text-align:left;background:#f0f3f8;padding:6pt 8pt;font-size:9.5pt;font-weight:600;color:#444;border-bottom:1pt solid #d0d8e3}
  .pdf-scaffold .pdf-tbl td{padding:6pt 8pt;border-bottom:1pt solid #eef1f5;vertical-align:top;page-break-inside:avoid}
  .pdf-scaffold .pdf-tbl tr{page-break-inside:avoid}
  .pdf-scaffold .pdf-pcenter{font-size:11pt;font-weight:600;color:#1862B5;margin:14pt 0 4pt}
  .pdf-scaffold .pdf-pmt{font-size:10pt;color:#666}
  .pdf-scaffold .pdf-conf{background:#fff8ec;border:1pt solid #ecd9a0;border-radius:5pt;padding:10pt 12pt;color:#5a4a1a;font-size:10pt;margin:10pt 0;page-break-inside:avoid}
  .pdf-scaffold .pdf-opconf{border-radius:8pt;padding:12pt 16pt;margin:14pt auto 6pt;color:#fff;max-width:5.5in;text-align:left;page-break-inside:avoid;box-shadow:0 2pt 8pt rgba(0,0,0,.15)}
  .pdf-scaffold .pdf-opconf-green{background:linear-gradient(135deg,#1A7A4A 0%,#2FB36B 60%,#1A7A4A 100%)}
  .pdf-scaffold .pdf-opconf-amber{background:linear-gradient(135deg,#8C6515 0%,#D49A2A 55%,#8C6515 100%)}
  .pdf-scaffold .pdf-opconf-red{background:linear-gradient(135deg,#7E2828 0%,#C84B4B 55%,#7E2828 100%)}
  .pdf-scaffold .pdf-opconf-grey{background:linear-gradient(135deg,#3A4458 0%,#6B7689 55%,#3A4458 100%)}
  .pdf-scaffold .pdf-opconf-head{display:flex;justify-content:space-between;align-items:center;gap:10pt;flex-wrap:wrap;margin-bottom:5pt}
  .pdf-scaffold .pdf-opconf h3{margin:0;font-size:13pt;font-weight:700;color:#fff}
  .pdf-scaffold .pdf-opconf p{margin:0;font-size:10.5pt;line-height:1.5;color:#fff;opacity:.97}
  .pdf-scaffold .pdf-opconf-trend{font-size:9.5pt;padding:3pt 9pt;border-radius:12pt;background:rgba(255,255,255,.22);font-weight:700;letter-spacing:.04em;white-space:nowrap}
  .pdf-scaffold .pdf-bizgrid{margin:8pt auto 6pt;max-width:6.8in;overflow:hidden;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pdf-scaffold .pdf-bizgrid::after{content:"";display:table;clear:both}
  .pdf-scaffold .pdf-bizcard{float:left;width:calc(25% - 6pt);margin-right:8pt;margin-bottom:8pt;box-sizing:border-box}
  .pdf-scaffold .pdf-bizcard:nth-child(4n){margin-right:0}
  .pdf-scaffold .pdf-bizcard:nth-child(4n+1){clear:left}
  .pdf-scaffold .pdf-bizcard{background:#1A2640;border:0.5pt solid #2D3A55;border-radius:7pt;padding:10pt 12pt;border-left:3pt solid #6B7689;page-break-inside:avoid;text-align:left;-webkit-print-color-adjust:exact;print-color-adjust:exact;float:left;width:calc(25% - 6pt);margin-right:8pt;margin-bottom:8pt;box-sizing:border-box}
  .pdf-scaffold .pdf-bizcard-green{border-left-color:#2FB36B}
  .pdf-scaffold .pdf-bizcard-amber{border-left-color:#D49A2A}
  .pdf-scaffold .pdf-bizcard-red{border-left-color:#C84B4B}
  .pdf-scaffold .pdf-bizcard-grey{border-left-color:#6B7689}
  .pdf-scaffold .pdf-bizcard-soon{opacity:.55;border-style:dashed;background:#141C30}
  .pdf-scaffold .pdf-bizcard-label{font-size:11pt;font-weight:700;color:#FFFFFF;line-height:1.25;min-height:28pt;margin-bottom:5pt}
  .pdf-scaffold .pdf-bizcard-status{font-size:7.5pt;color:#9AA6BD;text-transform:uppercase;letter-spacing:.06em;font-weight:700;margin-bottom:4pt}
  .pdf-scaffold .pdf-bizcard-green .pdf-bizcard-status{color:#2FB36B}
  .pdf-scaffold .pdf-bizcard-amber .pdf-bizcard-status{color:#D49A2A}
  .pdf-scaffold .pdf-bizcard-red .pdf-bizcard-status{color:#C84B4B}
  .pdf-scaffold .pdf-bizcard-sub{font-size:26pt;font-weight:800;text-align:center;line-height:1.05;margin-top:3pt;color:#6B7689}
  .pdf-scaffold .pdf-bizcard-green .pdf-bizcard-sub{color:#2FB36B}
  .pdf-scaffold .pdf-bizcard-amber .pdf-bizcard-sub{color:#D49A2A}
  .pdf-scaffold .pdf-bizcard-red .pdf-bizcard-sub{color:#C84B4B}
  .pdf-scaffold .pdf-detail-card{margin:10pt 0;padding:10pt 12pt;background:#fafbfd;border:1pt solid #e0e6ef;border-radius:6pt;page-break-inside:avoid}
  .pdf-scaffold .pdf-dch{display:flex;justify-content:space-between;align-items:center;margin-bottom:6pt;border-bottom:1pt solid #e8edf4;padding-bottom:6pt}
  .pdf-scaffold .pdf-dch h3{margin:0;font-size:12.5pt;color:#0B1B3A}
  .pdf-scaffold .pdf-metrics{margin:6pt 0}
  .pdf-scaffold .pdf-metric{margin:4pt 0;font-size:10.5pt}
  .pdf-scaffold .pdf-metric .pdf-ml{display:flex;justify-content:space-between;color:#444;margin-bottom:2pt}
  .pdf-scaffold .pdf-bar{height:5pt;background:#e8edf4;border-radius:3pt;overflow:hidden}
  .pdf-scaffold .pdf-bar i{display:block;height:100%}
  .pdf-scaffold .pdf-findings{margin-top:8pt}
  .pdf-scaffold .pdf-findings b{font-size:10.5pt;color:#0B1B3A;display:block;margin-bottom:4pt}
  .pdf-scaffold .pdf-findings ul{margin:0;padding-left:14pt;font-size:10pt;color:#555}
  .pdf-scaffold .pdf-findings li{margin:3pt 0}
  .pdf-scaffold .pdf-f-warn{color:#A37300}
  .pdf-scaffold .pdf-f-bad{color:#A03333}
  .pdf-scaffold .pdf-f-good{color:#1A7A4A}
  .pdf-scaffold .pdf-f-info{color:#555}
  .pdf-scaffold .pdf-cbx{display:inline-block;vertical-align:-2pt;margin-right:4pt}
/* SignalBoard: Secure Score expandable rows */
.sstable tbody tr.sshidden { display: none; }
.sstable.show-more tbody tr.sshidden { display: table-row; }
.sstable-more { display: inline-block; margin-top: 6px; padding: 4px 12px; border: 1px solid var(--line); border-radius: 6px; color: var(--accent); background: transparent; cursor: pointer; font-size: 12px; }
.sstable-more:hover { color: var(--text); border-color: var(--accent); }


