:root{
  /* Design tokens -------------------------------------------------- */
  /* Colors (derived from DMS logo) */
  --color-navy-900:#0b223a;
  --color-navy-700:#15466d;
  --color-navy-500:#226ea5;
  --color-navy-400:#2b7bbd;
  --color-sky-200:#cfe4f7;
  --color-sky-100:#e7f3fc;
  --color-text-strong:#102133;
  --color-text-muted:#54677a;
  --color-surface:#ffffff;
  --color-surface-alt:#f4f8fb;
  --color-border-subtle:#d5e2ed;
  --color-border-strong:#b9c9d6;
  --color-success:#0f9d7a;
  --color-warning:#c37a1e;
  --color-danger:#d64545;
  --color-focus-ring:rgba(34,110,165,.22);

  /* Signal accent — a single brand accent replaces the old per-function rainbow */
  --accent:#10a5a5;          /* deep premium teal */
  --accent-strong:#0c8585;   /* pressed / active */
  --accent-bright:#19c6c6;   /* accent on the dark ink hero */
  --accent-soft:rgba(16,165,165,.12);
  --accent-line:rgba(16,165,165,.34);

  /* Navy commerce/authority tints — used for CTA + purchase surfaces (teal stays data-viz only) */
  --navy-soft:rgba(34,110,165,.12);
  --navy-line:rgba(34,110,165,.34);

  /* Ink — hero band and premium dark surfaces */
  --ink-900:#0b1220;
  --ink-800:#101a30;
  --ink-700:#16223f;
  --ink-line:rgba(255,255,255,.12);

  /* NIST CSF Implementation Tier scale — single-hue progression (no rainbow) */
  --tier-1:#7c8a99;          /* slate — least mature */
  --tier-2:#4d8a9e;
  --tier-3:#23919f;
  --tier-4:#0e9a9a;          /* toward accent — most mature */

  /* Maturity ramp anchors (slate → teal); JS interpolates between these per score */
  --mat-low:#9aa9b6;
  --mat-mid:#3f97a4;
  --mat-high:#0e9090;

  /* Severity scale — reserved for findings ONLY (a traffic-light read is intentional here) */
  --sev-critical:#d6453f;
  --sev-high:#c5811f;
  --sev-medium:#4b7fa3;
  --sev-low:#13a07d;

  /* Hero gradient — ink */
  --gradient-hero:linear-gradient(140deg,#0b1220 0%,#0f2236 55%,#123a4a 100%);

  /* Typography */
  --font-family-base:"Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-size-base:17px;
  --line-height-base:1.65;
  --line-height-tight:1.3;

  /* Spacing (8px scale) */
  --space-0:0;
  --space-1:.5rem;   /* 8px */
  --space-2:1rem;    /* 16px */
  --space-3:1.5rem;  /* 24px */
  --space-4:2rem;    /* 32px */
  --space-5:2.5rem;  /* 40px */
  --space-6:3.5rem;  /* 56px */

  /* Radii */
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:18px;
  --radius-pill:999px;

  /* Shadow */
  --shadow-soft:0 20px 48px -28px rgba(11,34,58,.55);
  --shadow-focus:0 0 0 4px var(--color-focus-ring);
}

*,
*::before,
*::after{box-sizing:border-box}

html,body{min-height:100%}

body{
  margin:0;
  font-family:var(--font-family-base);
  font-size:var(--font-size-base);
  line-height:var(--line-height-base);
  color:var(--color-text-strong);
  background:linear-gradient(180deg,var(--color-surface-alt),#eef4f9);
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block}

main,header,footer{width:100%}

h1,h2,h3,h4{
  color:var(--color-text-strong);
  font-weight:700;
  letter-spacing:-.01em;
  line-height:1.3;
  margin:0;
}

h1{font-size:clamp(1.9rem,3vw,2.2rem)}
h2{font-size:clamp(1.5rem,2.5vw,1.8rem)}
h3{font-size:clamp(1.1rem,1.8vw,1.25rem)}

p{margin:0 0 var(--space-2);color:var(--color-text-muted)}

:focus-visible{
  outline:0;
  box-shadow:var(--shadow-focus);
  border-color:var(--color-navy-500);
}

.site-header{
  background:var(--color-surface);
  color:var(--color-navy-900);
  padding:var(--space-2) 0 var(--space-3);
  box-shadow:0 10px 26px -18px rgba(11,34,58,.8);
}

.header-inner{
  max-width:1080px;
  margin:0 auto;
  padding:0 var(--space-2);
}

.brand{
  display:flex;
  align-items:center;
  gap:var(--space-2);
}

.logo{
  height:52px;
  width:auto;
  margin-top:-27px;
  filter:drop-shadow(0 6px 18px rgba(0,0,0,.2));
}

.brand-text h1{
  color:var(--color-navy-900);
  margin-bottom:4px;
}

.tagline{
  color:var(--color-navy-500);
  font-weight:500;
  margin:0;
}

.progress-bar{
  position:relative;
  width:100%;
  height:.65rem;
  background:rgba(34,110,165,.15);
  border-radius:var(--radius-pill);
  overflow:hidden;
  margin-top:var(--space-2);
}

.progress-fill{
  height:100%;
  background:linear-gradient(90deg,var(--color-navy-500),var(--color-navy-700));
  border-radius:inherit;
  transition:width .35s ease-in-out;
}

.container{
  max-width:1060px;
  margin:0 auto;
  padding:var(--space-4) var(--space-2) var(--space-5);
}

.card{
  background:var(--color-surface);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-soft);
  border:1px solid rgba(11,34,58,.04);
}

.content{
  padding:var(--space-4);
}

.section{
  display:none;
}

.section.active{
  display:block;
  animation:fadeIn .35s ease;
}

.section-title{
  color:var(--color-navy-700);
  margin-bottom:var(--space-1);
}

.section-description{
  margin-bottom:var(--space-3);
  color:var(--color-text-muted);
}

.section-progress{
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  background:var(--color-surface-alt);
  padding:var(--space-3);
  margin-bottom:var(--space-4);
}

.section-progress-header{
  margin-bottom:var(--space-2);
  display:flex;
  flex-direction:column;
  gap:.3rem;
}

.section-progress-header strong{
  font-size:1rem;
  color:var(--color-text-strong);
}

.section-progress-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  flex-wrap:wrap;
}

.section-progress-row .help-text{
  margin:0;
}

.section-progress-links{
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
}

.csf-info-link{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-size:.9rem;
  font-weight:600;
  color:#fff;
  text-decoration:none;
  padding:.55rem 1rem;
  border-radius:var(--radius-pill);
  background:var(--color-navy-700);
  transition:background .15s ease, transform .15s ease;
  white-space:nowrap;
  box-shadow:0 4px 12px -4px rgba(11,34,58,.4);
  position:relative;
  overflow:hidden;
}

/* Shimmer animation for page 1 attention */
@keyframes csf-link-shimmer{
  0%{
    transform:translateX(-100%);
  }
  100%{
    transform:translateX(100%);
  }
}

@keyframes csf-link-glow{
  0%, 100%{
    box-shadow:0 4px 12px -4px rgba(11,34,58,.4);
  }
  50%{
    box-shadow:0 4px 20px -2px rgba(34,110,165,.6), 0 0 12px rgba(34,110,165,.3);
  }
}

.csf-info-link.animate-attention::after{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,0) 40%,
    rgba(255,255,255,.4) 50%,
    rgba(255,255,255,0) 60%,
    transparent 100%
  );
  transform:translateX(-100%);
  animation:csf-link-shimmer .8s ease-out both;
  animation-delay:var(--shimmer-delay, 0s);
}

.csf-info-link.animate-attention{
  animation:csf-link-glow 1s ease-in-out;
  animation-delay:var(--shimmer-delay, 0s);
}

.csf-info-link:hover{
  background:var(--color-navy-900);
  transform:translateY(-1px);
}

.csf-info-link:focus-visible{
  outline:0;
  box-shadow:var(--shadow-focus), 0 4px 12px -4px rgba(11,34,58,.4);
}

.csf-info-link svg{
  flex-shrink:0;
  opacity:.9;
}

@media (max-width:640px){
  .section-progress-row{
    flex-direction:column;
    align-items:flex-start;
  }
  .section-progress-links{
    width:100%;
  }
  .csf-info-link{
    flex:1;
    justify-content:center;
  }
}

.section-nav{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
}

.section-nav-item{
  flex:1 1 220px;
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  padding:.75rem 1rem;
  background:var(--color-surface);
  cursor:pointer;
  display:flex;
  flex-direction:column;
  gap:.15rem;
  text-align:left;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
  min-width:200px;
}

.section-nav-item .section-nav-name{
  font-weight:600;
  color:var(--color-text-strong);
}

.section-nav-item .section-nav-status{
  font-size:.85rem;
  color:var(--color-text-muted);
}

.section-nav-item.is-active{
  border-color:var(--color-navy-500);
  box-shadow:var(--shadow-focus);
}

.section-nav-item.is-complete{
  border-color:var(--color-success);
  background:rgba(15,157,122,.08);
}

.section-nav-item.is-complete .section-nav-status{
  color:var(--color-success);
}

.form-group{
  margin-bottom:var(--space-3);
}

.hidden{display:none!important}

.intake-group-list{
  display:grid;
  gap:var(--space-2);
  margin-top:var(--space-3);
}

.intake-group{
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  background:var(--color-surface-alt);
  transition:border-color .2s ease, box-shadow .2s ease;
}

.intake-group[open]{
  border-color:var(--color-navy-400);
  box-shadow:0 14px 28px -20px rgba(34,110,165,.25);
  background:var(--color-surface);
}

.intake-group summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-1);
  padding:var(--space-2) var(--space-3);
  cursor:pointer;
  font-weight:600;
  color:var(--color-navy-700);
}

.intake-group summary::-webkit-details-marker{display:none}

.intake-group summary::after{
  content:"›";
  font-size:1.3rem;
  transform:rotate(90deg);
  color:var(--color-navy-400);
  transition:transform .2s ease;
}

.intake-group[open] summary::after{
  transform:rotate(270deg);
}

.summary-helper{
  font-size:.88rem;
  font-weight:500;
  color:var(--color-text-muted);
}

.intake-group-body{
  padding:0 var(--space-3) var(--space-3);
}

.rto-rpo-group{
  display:grid;
  grid-template-columns:1fr minmax(120px,160px);
  gap:var(--space-1);
}

.chip-input{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-1);
  border:1px dashed var(--color-border-subtle);
  border-radius:var(--radius-md);
  padding:var(--space-1);
  background:rgba(34,110,165,.03);
}

.chip-input:focus-within{
  border-style:solid;
  border-color:var(--color-navy-500);
  box-shadow:var(--shadow-focus);
  background:var(--color-surface);
}

.chip-list{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}

.chip-input input{
  flex:1;
  min-width:160px;
  border:none;
  background:transparent;
  padding:.45rem .55rem;
  font-size:1rem;
}

.chip-input input:focus{
  outline:none;
}

.chip{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  background:var(--color-sky-100);
  border:1px solid var(--color-navy-400);
  border-radius:var(--radius-pill);
  padding:.35rem .75rem;
  font-size:.9rem;
  color:var(--color-navy-700);
}

.chip.vendor-chip{
  cursor:pointer;
}

.chip.vendor-chip.active{
  background:var(--color-navy-500);
  border-color:var(--color-navy-500);
  color:#fff;
}

.chip.vendor-chip.active button{
  color:#fff;
}

.chip button{
  border:none;
  background:transparent;
  color:var(--color-navy-700);
  font-size:1rem;
  cursor:pointer;
  padding:0;
  line-height:1;
}

.chip button:hover{
  color:var(--color-navy-900);
}

.intake-hint{
  margin:0 0 var(--space-2);
  padding:.6rem var(--space-2);
  font-size:.86rem;
  color:var(--color-text-muted);
  background:var(--color-surface);
  border-left:3px solid var(--color-navy-400);
  border-radius:var(--radius-md);
}

.has-error input,
.has-error select,
.has-error textarea{
  border-color:var(--color-danger)!important;
  background:#fff5f5;
}

.has-error .checkbox-item,
.has-error .radio-item,
.has-error .maturity-option{
  border-color:var(--color-danger)!important;
}

.field-error{
  margin-top:.45rem;
  font-size:.86rem;
  color:var(--color-danger);
}

.insight-message{
  margin-top:.4rem;
  font-size:.86rem;
  color:var(--color-warning);
}

.form-row{
  display:grid;
  gap:var(--space-3);
  grid-template-columns:repeat(2,minmax(0,1fr));
}

label{
  display:block;
  font-weight:600;
  font-size:.98rem;
  color:var(--color-text-strong);
  margin-bottom:.4rem;
}

.label-with-tooltip{
  margin-bottom:.4rem;
}

.label-with-tooltip label{
  margin-bottom:0;
}

.help-text{
  font-size:.88rem;
  margin-top:.4rem;
}

input[type="text"],
input[type="email"],
input[type="number"],
select,
textarea{
  width:100%;
  padding:calc(var(--space-2) - 2px) var(--space-2);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  background:var(--color-surface);
  font-size:1rem;
  color:var(--color-text-strong);
  transition:border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
  box-shadow:inset 0 1px 2px rgba(16,33,51,.06);
  accent-color:var(--color-navy-500);
}

input::placeholder,
textarea::placeholder{color:rgba(84,103,122,.72)}

input:focus,
select:focus,
textarea:focus{
  border-color:var(--color-navy-500);
  background:#fdfefe;
  box-shadow:var(--shadow-focus);
}

textarea{
  min-height:7rem;
  resize:vertical;
}

.inline-inputs{
  display:flex;
  gap:.75rem;
  align-items:center;
}

.inline-inputs input,
.inline-inputs select{
  flex:1;
}

.report-details{
  margin-top:var(--space-3);
  display:grid;
  gap:var(--space-2);
}

.report-section{
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  padding:var(--space-2);
  background:var(--color-surface);
}

.report-section h4{
  margin-top:0;
  margin-bottom:.4rem;
  color:var(--color-navy-700);
}

.report-section ul{
  margin:0;
  padding-left:1.25rem;
  color:var(--color-text-muted);
}

.checkbox-group,
.radio-group,
.maturity-scale{
  display:grid;
  gap:var(--space-2);
}

.chip-toggle-group{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
}

.chip-toggle{
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-pill);
  background:var(--color-surface);
  color:var(--color-text-strong);
  padding:.45rem 1rem;
  font-size:.92rem;
  line-height:1.2;
  cursor:pointer;
  min-height:44px;
  display:flex;
  align-items:center;
  transition:all .2s ease;
}

.chip-toggle:hover{
  border-color:var(--color-navy-500);
  background:rgba(34,110,165,.06);
}

.chip-toggle[aria-pressed="true"],
.chip-toggle.is-selected{
  background:var(--color-navy-500);
  color:#fff;
  border-color:var(--color-navy-500);
  box-shadow:0 6px 16px -12px rgba(11,34,58,.55);
}

.chip-toggle:focus-visible{
  box-shadow:var(--shadow-focus);
}

.lifecycle-grid{
  display:grid;
  gap:var(--space-2);
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}

.lifecycle-stage{
  display:flex;
  align-items:center;
  gap:.6rem;
  border:1px dashed var(--color-border-subtle);
  border-radius:var(--radius-md);
  padding:var(--space-2);
  background:var(--color-surface);
  cursor:pointer;
  transition:border-color .2s ease, box-shadow .2s ease;
}

.lifecycle-stage:hover{
  border-color:var(--color-navy-400);
  box-shadow:0 10px 18px -16px rgba(11,34,58,.4);
}

.lifecycle-stage input{
  accent-color:var(--color-navy-500);
}

.lifecycle-note{
  background:var(--color-surface);
  border-left:3px solid var(--color-navy-400);
  border-radius:var(--radius-md);
  padding:var(--space-2);
  display:grid;
  gap:.35rem;
  grid-column:1 / -1;
}

.vendor-editor{
  border-top:1px solid var(--color-border-subtle);
  margin-top:var(--space-3);
  padding-top:var(--space-3);
  display:grid;
  gap:var(--space-3);
}

.vendor-editor-empty{
  font-size:.88rem;
  color:var(--color-text-muted);
  margin-top:var(--space-1);
}

.checkbox-group{grid-template-columns:repeat(2,minmax(0,1fr))}
.radio-group{grid-template-columns:1fr}
.maturity-scale{grid-template-columns:repeat(4,minmax(0,1fr))}

.checkbox-item,
.radio-item,
.maturity-option{
  display:flex;
  align-items:flex-start;
  gap:var(--space-1);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  padding:var(--space-2);
  background:var(--color-surface);
  line-height:1.5;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.checkbox-item input,
.radio-item input,
.maturity-option input{
  margin-top:.15rem;
  accent-color:var(--color-navy-500);
}

.checkbox-item:hover,
.radio-item:hover,
.maturity-option:hover{
  border-color:var(--color-navy-500);
  background:rgba(34,110,165,.05);
}

.option-content{
  display:flex;
  flex-direction:column;
  gap:.15rem;
}

.checkbox-item .option-content .help-text,
.radio-item .option-content .help-text{
  margin-top:0;
}

.checkbox-item:focus-within,
.radio-item:focus-within,
.maturity-option:focus-within{
  box-shadow:var(--shadow-focus);
  border-color:var(--color-navy-500);
}

.checkbox-item:has(input:checked),
.radio-item:has(input:checked),
.maturity-option:has(input:checked){
  border-color:var(--color-navy-500);
  background:var(--color-sky-100);
}

/* N/A options - subtle styling to distinguish */
.checkbox-item.na-option,
.chip-toggle.na-option{
  border-style:dashed;
  color:var(--color-text-muted);
}

.checkbox-item.na-option:has(input:checked){
  border-style:solid;
  border-color:var(--color-text-muted);
  background:var(--color-bg-offset);
  color:var(--color-text);
}

.chip-toggle.na-option.is-selected{
  border-style:solid;
  border-color:var(--color-text-muted);
  background:var(--color-bg-offset);
  color:var(--color-text);
}

/* N/A Reason Textarea */
.na-reason-wrap{
  margin-top:var(--space-2);
  padding:var(--space-2) var(--space-3);
  background:var(--color-sky-100);
  border-left:3px solid var(--color-navy-400);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  animation:naReasonFade .18s ease;
}

.na-reason-wrap.hidden{
  display:none;
}

@keyframes naReasonFade{
  from{opacity:0;transform:translateY(-4px)}
  to{opacity:1;transform:translateY(0)}
}

.na-reason-wrap label{
  display:block;
  font-size:.85rem;
  font-weight:500;
  color:var(--color-navy-700);
  margin-bottom:.4rem;
}

.optional-label{
  font-weight:400;
  color:var(--color-text-muted);
}

.na-reason-textarea{
  width:100%;
  min-height:64px;
  resize:vertical;
  font-size:.875rem;
  padding:.5rem .75rem;
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-sm);
  background:var(--color-surface);
  color:var(--color-text-strong);
  font-family:inherit;
  line-height:1.5;
}

.na-reason-textarea:focus{
  outline:none;
  border-color:var(--color-navy-400);
  box-shadow:0 0 0 3px var(--color-focus-ring);
}

/* Help tooltip primitive (v2)
   - `?` icon is the hover/focus target (label as a whole is NOT)
   - Generous popover box (22rem) for comfortable reading
   - Cursor:help + subtle hover affordance signals interactivity
   - Asterisk lives in its own `.req` element for required marker
   - Edge-aware positioning is handled by JS in script.js (flips
     tooltip alignment when it would clip the right edge) */
.tooltip{
  position:relative;
  --tooltip-arrow-offset:20px;
}

.checkbox-item.tooltip,
.radio-item.tooltip,
.maturity-option.tooltip{
  --tooltip-arrow-offset:20px;
}

label.tooltip:not(.checkbox-item):not(.radio-item):not(.maturity-option){
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  flex-wrap:wrap;
  --tooltip-arrow-offset:14px;
}

.tooltip-icon{
  margin-left:var(--space-1);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.25rem;
  height:1.25rem;
  font-size:.72rem;
  font-weight:700;
  border-radius:50%;
  background:var(--color-sky-100);
  color:var(--color-navy-700);
  border:1px solid var(--color-navy-400);
  line-height:1;
  cursor:help;
  transition:background .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
  position:relative;
  z-index:1;
  user-select:none;
}

.tooltip-icon:hover,
.tooltip-icon:focus-visible{
  background:var(--color-navy-500);
  color:#fff;
  border-color:var(--color-navy-500);
  transform:scale(1.08);
  box-shadow:0 0 0 4px var(--color-focus-ring);
  outline:none;
}

.tooltip-text{
  position:absolute;
  left:0;
  bottom:calc(100% + .55rem);
  background:var(--color-navy-900);
  color:var(--color-surface);
  padding:.7rem .9rem;
  border-radius:var(--radius-sm);
  box-shadow:0 22px 40px -22px rgba(11,34,58,.55), 0 4px 10px -4px rgba(11,34,58,.3);
  font-size:.85rem;
  font-weight:400;
  line-height:1.5;
  max-width:22rem;
  width:max-content;
  min-width:14rem;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .18s ease, transform .18s ease;
  pointer-events:none;
  z-index:30;
  white-space:normal;
}

/* Variant: anchor tooltip to the right side (set via JS when near
   the viewport's right edge to avoid clipping) */
.tooltip-text.is-right{
  left:auto;
  right:0;
  --tooltip-arrow-offset:auto;
}

.tooltip-text.is-right::after{
  left:auto;
  right:14px;
}

/* Trigger: show tooltip only when the `?` icon (or its host
   .tooltip-host wrapper) is hovered or keyboard-focused.
   The whole label no longer activates the tooltip. */
.tooltip-icon:hover ~ .tooltip-text,
.tooltip-icon:focus-visible ~ .tooltip-text,
.tooltip-icon:focus ~ .tooltip-text,
.tooltip-host:hover .tooltip-text,
.tooltip-host:focus-within .tooltip-text{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

.tooltip-text::after{
  content:"";
  position:absolute;
  top:100%;
  left:var(--tooltip-arrow-offset);
  border-width:6px;
  border-style:solid;
  border-color:var(--color-navy-900) transparent transparent transparent;
  filter:drop-shadow(0 4px 6px rgba(11,34,58,.2));
}

/* Required marker — visually distinct from the help icon, no hover */
.req{
  color:#d04545;
  font-weight:700;
  margin-left:.15rem;
  cursor:default;
  font-size:1em;
  user-select:none;
}

/* Visual hint that the `?` icon is interactive: on first viewport
   entry, gently pulse once to draw attention. Keyframes already
   exist; we re-use a subtle animation here. */
@keyframes tooltipIconHint{
  0%,100%{ box-shadow:0 0 0 0 rgba(34,110,165,0); }
  50%{ box-shadow:0 0 0 4px rgba(34,110,165,.18); }
}

/* Option-hover tooltip — popover shown when hovering a radio/checkbox
   option label or other inline option. Uses data-option-tip attribute
   on the option container; the popover is created by JS and styled here. */
.option-tip-popover{
  position:fixed;
  background:#fff;
  color:var(--color-text-strong);
  border:1px solid var(--color-border-strong);
  border-left:4px solid var(--color-navy-500);
  border-radius:var(--radius-sm);
  padding:.7rem .9rem;
  font-size:.82rem;
  line-height:1.5;
  font-weight:400;
  max-width:18rem;
  min-width:12rem;
  box-shadow:0 22px 40px -18px rgba(11,34,58,.45), 0 4px 12px -4px rgba(11,34,58,.25);
  z-index:1000;
  opacity:0;
  transform:translateY(4px);
  transition:opacity .14s ease, transform .14s ease;
  pointer-events:none;
}

.option-tip-popover.is-visible{
  opacity:1;
  transform:translateY(0);
}

.option-tip-popover .option-tip-label{
  display:block;
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--color-navy-500);
  margin-bottom:.3rem;
}

/* Subtle visual cue on options that have a tooltip available */
[data-option-tip]{
  position:relative;
}

[data-option-tip]:hover{
  cursor:help;
}

.required-star:hover,
.required-star:focus{
  color:var(--color-navy-700);
}

/* Tooltip for required-star, arrow points up to asterisk */
.required-star .tooltip-text{
  width:max-content;
  max-width:18rem;
  left:50%;
  transform:translateX(-50%) translateY(6px);
  --tooltip-offset:0;
}

.required-star:hover .tooltip-text,
.required-star:focus-within .tooltip-text{
  transform:translateX(-50%) translateY(0);
}

.required-star .tooltip-text::after{
  left:50%;
  transform:translateX(-50%);
}

/* Character counter */
.char-counter-wrapper{
  position:relative;
}

.char-counter{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:.35rem;
  font-size:.8rem;
  color:var(--color-text-muted);
}

.char-counter-progress{
  display:flex;
  align-items:center;
  gap:.5rem;
}

.char-counter-bar{
  width:60px;
  height:4px;
  background:var(--color-border-subtle);
  border-radius:2px;
  overflow:hidden;
}

.char-counter-fill{
  height:100%;
  background:var(--color-navy-400);
  border-radius:2px;
  transition:width .2s ease, background .2s ease;
}

.char-counter-fill.complete{
  background:var(--color-success);
}

.char-counter-text{
  font-variant-numeric:tabular-nums;
}

.char-counter-text.warning{
  color:var(--color-warning);
}

.char-counter-text.error{
  color:var(--color-danger);
}

.char-counter-limit{
  font-size:.75rem;
  color:var(--color-text-muted);
}

.button-group{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  margin-top:var(--space-4);
}

.pager{color:var(--color-text-muted);font-size:.95rem}

.save-progress{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--space-2);
  margin-top:var(--space-4);
}

/* Save-status pill: passive auto-save indicator with hover explanation. */
.save-status-pill{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.4rem .9rem .4rem .75rem;
  background:var(--color-sky-100);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-pill);
  font-size:.85rem;
  font-weight:500;
  color:var(--color-navy-700);
  cursor:help;
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease;
  user-select:none;
  letter-spacing:-.005em;
}

.save-status-pill:hover,
.save-status-pill:focus-visible{
  background:var(--color-surface);
  border-color:var(--color-navy-400);
  outline:none;
  box-shadow:0 0 0 4px var(--color-focus-ring);
}

.save-status-dot{
  width:.55rem;
  height:.55rem;
  border-radius:50%;
  background:var(--color-success);
  box-shadow:0 0 0 0 rgba(15,157,122,0);
  transition:background .25s ease, box-shadow .25s ease;
}

.save-status[data-state="saving"] .save-status-dot{
  background:var(--color-warning);
  animation:save-pulse .55s ease-out;
}

.save-status[data-state="error"] .save-status-dot{
  background:var(--color-danger);
  box-shadow:0 0 0 3px rgba(214,69,69,.12);
}

.save-status[data-state="error"] .save-status-pill{
  background:rgba(214,69,69,.06);
  border-color:rgba(214,69,69,.35);
  color:var(--color-danger);
}

@keyframes save-pulse{
  0%{ box-shadow:0 0 0 0 rgba(195,122,30,.45); }
  100%{ box-shadow:0 0 0 7px rgba(195,122,30,0); }
}

/* Wider, multi-paragraph tooltip variant used by the save-status pill. */
.save-status-tooltip-text{
  max-width:25rem;
  min-width:18rem;
  font-size:.85rem;
  padding:.9rem 1.05rem;
  line-height:1.55;
  font-weight:400;
}

.save-status-tooltip-text strong{
  display:block;
  margin-bottom:.45rem;
  color:#fff;
  font-weight:700;
  font-size:.9rem;
}

.save-status-tooltip-text p{
  margin:0 0 .55rem;
  color:rgba(255,255,255,.92);
}

.save-status-tooltip-text p:last-child{
  margin-bottom:0;
}

.section-warning{
  margin-top:var(--space-2);
  padding:var(--space-2);
  border-radius:var(--radius-md);
  border-left:4px solid var(--color-warning);
  background:var(--color-surface-alt);
  color:var(--color-warning);
  font-size:.92rem;
}

.btn{
  appearance:none;
  border-radius:var(--radius-md);
  border:1px solid var(--color-border-subtle);
  padding:.75rem 1.3rem;
  font-weight:600;
  font-size:1rem;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
  box-shadow:0 12px 20px -12px rgba(11,34,58,.35);
  min-width:9.5rem;
  background:#fff;
  color:var(--color-text-strong);
}

.btn:hover{
  transform:translateY(-1px);
}

.btn:focus-visible{
  box-shadow:var(--shadow-focus);
}

a.btn{
  text-decoration:none;
}

a.btn:hover{
  text-decoration:none;
}

.btn-primary{
  background:linear-gradient(135deg,var(--color-navy-500),var(--color-navy-700));
  color:#fff;
}

.btn-primary:hover{
  background:linear-gradient(135deg,var(--color-navy-500),var(--color-navy-900));
}

.btn-success{
  background:linear-gradient(135deg,var(--color-success),#0a7c60);
  color:#fff;
}

.btn-secondary{
  background:#fff;
  border-color:var(--color-border-subtle);
  color:var(--color-text-strong);
}

.btn-secondary:hover{
  background:rgba(34,110,165,.08);
}

.btn-icon{
  width:18px;
  height:18px;
  object-fit:contain;
  flex-shrink:0;
}

.report-actions{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-1);
  align-items:center;
  margin-top:var(--space-2);
}

.report-actions .btn{
  flex:0 1 auto;
}

.policy-download-feedback{
  margin-top:.5rem;
  color:var(--color-danger);
  font-weight:600;
}

.results{
  display:none;
}

.results.active{
  display:block;
  animation:fadeIn .35s ease;
}

/* Summary grid/card styles moved to Corporate Report Styles section */

.nist-functions{
  display:grid;
  gap:0;
}

/* .nist-function styles moved to Professional Report Styles section */

.bar{
  height:.65rem;
  background:var(--color-border-subtle);
  border-radius:var(--radius-pill);
  overflow:hidden;
}

.fill{
  height:100%;
  width:0%;
  border-radius:inherit;
  transition:width .35s ease;
}

.fill.ok{background:var(--color-success)}
.fill.warn{background:var(--color-warning)}
.fill.bad{background:var(--color-danger)}

/* AI analysis now uses report-card styling - these are kept for compatibility */
.ai-analysis-card{
  /* Styles inherited from .report-card */
}

.ai-status{
  text-align:right;
}

.ai-loading{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:.35rem;
  font-size:.9rem;
  color:var(--color-text-muted,#555);
}

.ai-loading-spinner{
  display:flex;
  gap:.35rem;
  justify-content:flex-end;
}

.ai-loading-spinner span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--color-link,#2563eb);
  opacity:.4;
  animation:ai-bounce 1.2s infinite ease-in-out;
}

.ai-loading-spinner span:nth-child(2){
  animation-delay:.15s;
}

.ai-loading-spinner span:nth-child(3){
  animation-delay:.3s;
}

.ai-loading-text{
  margin:0;
}

@keyframes ai-bounce{
  0%,80%,100%{
    transform:translateY(0);
    opacity:.4;
  }
  40%{
    transform:translateY(-6px);
    opacity:1;
  }
}

@media (prefers-reduced-motion:reduce){
  .ai-loading-spinner span{
    animation:none;
  }
}

.ai-status-message{
  font-size:.9rem;
  color:var(--color-text-muted);
}

.ai-status-message.error{
  color:var(--color-danger);
  font-weight:600;
}

.ai-tier-summary{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-2);
  margin-top:var(--space-2);
  align-items:center;
}

.ai-tier-main{
  min-width:200px;
}

.ai-tier-label{
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.85rem;
  color:var(--color-text-muted);
}

.ai-tier-value{
  font-size:2rem;
  font-weight:700;
  color:var(--color-navy-700);
}

.ai-tier-name{
  font-weight:600;
  color:var(--color-navy-500);
}

.ai-tier-pill{
  background:var(--color-sky-100);
  border-radius:var(--radius-pill);
  padding:.65rem 1.4rem;
  color:var(--color-navy-700);
  min-width:180px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.ai-tier-pill span{
  font-size:.85rem;
  color:var(--color-text-muted);
}

.ai-tier-pill strong{
  font-size:1rem;
  font-weight:600;
}

.tier-info-link{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-size:.95rem;
  font-weight:600;
  color:#fff;
  text-decoration:none;
  padding:.65rem 1.2rem;
  border-radius:var(--radius-pill);
  background:var(--color-navy-700);
  transition:background .15s ease, transform .15s ease;
  margin-left:auto;
  white-space:nowrap;
  box-shadow:0 4px 12px -4px rgba(11,34,58,.4);
}

.tier-info-link:hover{
  background:var(--color-navy-900);
  transform:translateY(-1px);
}

.tier-info-link:focus-visible{
  outline:0;
  box-shadow:var(--shadow-focus), 0 4px 12px -4px rgba(11,34,58,.4);
}

.tier-info-link svg{
  flex-shrink:0;
  opacity:.9;
}

@media (max-width:640px){
  .tier-info-link{
    margin-left:0;
    margin-top:var(--space-1);
    width:100%;
    justify-content:center;
  }
}

.ai-list{
  margin-top:var(--space-3);
}

.ai-list h4{
  margin-bottom:.35rem;
  color:var(--color-navy-700);
}

.ai-list-body{
  margin:0;
  padding-left:1.2rem;
  color:var(--color-text-muted);
}

.ai-list-body li{
  margin-bottom:.35rem;
}

.ai-list-body .placeholder{
  list-style:none;
  font-style:italic;
  padding-left:0;
  color:var(--color-text-muted);
}

.ai-data-quality .ai-list-body{
  font-size:.9rem;
}

/* Legacy callout styles removed - using .report-section styling */

.site-footer{
  text-align:center;
  padding:var(--space-4) var(--space-2) var(--space-6);
  color:#fff;
  background:linear-gradient(135deg,var(--color-navy-900),#132d4a);
  margin-top:var(--space-6);
}

.site-footer p{
  margin:0;
  opacity:.92;
}

@keyframes fadeIn{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}

@media (max-width:640px){
  .ai-card-header{
    flex-direction:column;
    align-items:flex-start;
  }
  .ai-status{
    text-align:left;
    width:100%;
  }
}

@media (max-width:900px){
  .form-row{grid-template-columns:1fr}
  .checkbox-group{grid-template-columns:1fr}
  .rto-rpo-group{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:768px){
  .site-header{padding:var(--space-2) 0 var(--space-2)}
  .brand{flex-direction:column;align-items:flex-start;gap:var(--space-1)}
  .logo{height:46px}
  .container{padding:var(--space-3) var(--space-2) var(--space-5)}
  .content{padding:var(--space-3)}
  .maturity-scale{grid-template-columns:1fr}
  .button-group{flex-direction:column;align-items:stretch}
  .btn{width:100%}
  .chip-input{flex-direction:column}
  .chip-input input{width:100%}
  .summary-helper{display:none}
  .rto-rpo-group{grid-template-columns:1fr}
  .chip-toggle-group{gap:.5rem}
  .chip-toggle{width:100%;justify-content:center}
}

@media (max-width:540px){
  body{font-size:16px}
  .section-title{font-size:1.45rem}
  .summary-grid{grid-template-columns:1fr}
}

/* Disclaimer Modal */
.disclaimer-overlay{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(11,34,58,.7);
  backdrop-filter:blur(4px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:var(--space-2);
  opacity:1;
  transition:opacity .3s ease;
}

.disclaimer-overlay.hidden{
  display:none;
}

.disclaimer-modal{
  background:var(--color-surface);
  border-radius:var(--radius-lg);
  box-shadow:0 24px 64px -16px rgba(11,34,58,.5);
  max-width:800px;
  width:100%;
  max-height:80vh;
  display:flex;
  flex-direction:column;
  animation:modalSlideIn .35s ease;
}

@keyframes modalSlideIn{
  from{
    opacity:0;
    transform:translateY(24px) scale(.96);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

.disclaimer-header{
  padding:var(--space-3) var(--space-4);
  border-bottom:1px solid var(--color-border-subtle);
  text-align:center;
  flex-shrink:0;
}

.disclaimer-header h2{
  color:var(--color-navy-700);
  margin-bottom:.25rem;
}

.disclaimer-subtitle{
  color:var(--color-text-muted);
  margin:0;
  font-size:1.05rem;
}

.disclaimer-body{
  flex:1;
  overflow-y:auto;
  padding:var(--space-3) var(--space-4);
  scrollbar-width:thin;
  scrollbar-color:var(--color-border-strong) transparent;
}

.disclaimer-body::-webkit-scrollbar{
  width:8px;
}

.disclaimer-body::-webkit-scrollbar-track{
  background:transparent;
}

.disclaimer-body::-webkit-scrollbar-thumb{
  background:var(--color-border-strong);
  border-radius:4px;
}

.disclaimer-body h3{
  color:var(--color-navy-700);
  margin:var(--space-3) 0 var(--space-1);
  font-size:1.1rem;
}

.disclaimer-body h3:first-of-type{
  margin-top:0;
}

.disclaimer-body p{
  margin:0 0 var(--space-2);
  color:var(--color-text-strong);
  line-height:1.6;
}

.disclaimer-intro{
  font-size:1.02rem;
  color:var(--color-text-muted)!important;
  margin-bottom:var(--space-3)!important;
}

.disclaimer-highlight{
  padding:var(--space-2) var(--space-3);
  border-radius:var(--radius-md);
  margin:var(--space-2) 0;
}

.disclaimer-highlight p{
  margin:0;
}

.disclaimer-highlight-blue{
  background:rgba(34,110,165,.1);
  border:1px solid rgba(34,110,165,.3);
}

.disclaimer-highlight-blue p{
  color:var(--color-navy-700);
}

.disclaimer-highlight-orange{
  background:rgba(195,122,30,.1);
  border:1px solid rgba(195,122,30,.4);
}

.disclaimer-highlight-orange p{
  color:#8b5a1e;
}

.disclaimer-acknowledgment{
  margin-top:var(--space-4);
  padding:var(--space-3);
  background:var(--color-surface-alt);
  border-radius:var(--radius-md);
  border:1px solid var(--color-border-subtle);
}

.disclaimer-acknowledgment h3{
  margin-top:0!important;
  color:var(--color-text-strong);
}

.disclaimer-acknowledgment ul{
  margin:0;
  padding-left:1.25rem;
  color:var(--color-text-muted);
}

.disclaimer-acknowledgment li{
  margin-bottom:.5rem;
  line-height:1.5;
}

.disclaimer-footer{
  padding:var(--space-3) var(--space-4);
  border-top:1px solid var(--color-border-subtle);
  background:var(--color-surface-alt);
  border-radius:0 0 var(--radius-lg) var(--radius-lg);
  flex-shrink:0;
}

.disclaimer-contact,
.disclaimer-company{
  text-align:center;
  font-size:.9rem;
  color:var(--color-text-muted);
  margin:0 0 .5rem;
}

.disclaimer-company{
  margin-bottom:var(--space-2);
}

.disclaimer-actions{
  display:flex;
  justify-content:center;
  gap:var(--space-2);
}

.disclaimer-actions .btn{
  min-width:120px;
}

@media (max-width:640px){
  .disclaimer-modal{
    max-height:90vh;
    margin:var(--space-1);
  }
  .disclaimer-header{
    padding:var(--space-2) var(--space-3);
  }
  .disclaimer-body{
    padding:var(--space-2) var(--space-3);
  }
  .disclaimer-footer{
    padding:var(--space-2) var(--space-3);
  }
  .disclaimer-actions{
    flex-direction:column;
  }
  .disclaimer-actions .btn{
    width:100%;
  }
}

/* Consent Modal */
.consent-modal{
  max-width:560px;
}

.consent-body{
  padding:var(--space-4) var(--space-5);
}

.consent-checks{
  display:flex;
  flex-direction:column;
  gap:var(--space-3);
  margin:var(--space-4) 0;
}

.consent-check-item{
  display:flex;
  align-items:flex-start;
  gap:var(--space-2);
  cursor:pointer;
  font-size:.95rem;
  line-height:1.5;
}

.consent-check-item input[type="checkbox"]{
  margin-top:3px;
  flex-shrink:0;
  width:18px;
  height:18px;
  cursor:pointer;
  accent-color:var(--color-primary, #2563eb);
}

.consent-check-item span{
  color:var(--color-text, #1a1a2e);
}

.consent-gdpr-notice{
  margin-top:var(--space-4);
  padding:var(--space-3) var(--space-4);
  background:var(--color-surface-alt, #f0f4ff);
  border-left:3px solid var(--color-primary, #2563eb);
  border-radius:0 var(--radius-sm, 4px) var(--radius-sm, 4px) 0;
  font-size:.85rem;
  color:var(--color-text-muted, #555);
  line-height:1.6;
}

.consent-gdpr-notice p{
  margin:0;
}

.consent-gdpr-notice a{
  color:var(--color-primary, #2563eb);
}

/* New Package / Reset Modals */
.modal-overlay{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(11,34,58,.7);
  backdrop-filter:blur(4px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:var(--space-2);
  opacity:1;
  transition:opacity .3s ease;
}

.modal-overlay.hidden{
  display:none;
}

.modal-container{
  background:var(--color-surface);
  border-radius:var(--radius-lg);
  box-shadow:0 24px 64px -16px rgba(11,34,58,.5);
  max-width:500px;
  width:100%;
  animation:modalSlideIn .35s ease;
}

.modal-header{
  padding:var(--space-3) var(--space-4);
  border-bottom:1px solid var(--color-border-subtle);
}

.modal-header h3{
  margin:0;
  font-size:1.25rem;
  color:var(--color-text-strong);
}

.modal-body{
  padding:var(--space-3) var(--space-4);
}

.modal-body p{
  margin:0 0 var(--space-2);
  color:var(--color-text);
  line-height:1.6;
}

.modal-body p:last-child{
  margin-bottom:0;
}

.modal-note{
  font-size:0.9rem;
  color:var(--color-text-muted);
  background:var(--color-surface-alt);
  padding:var(--space-2);
  border-radius:var(--radius-md);
  border-left:3px solid var(--color-navy-500);
}

.modal-note a{
  color:var(--color-navy-500);
  text-decoration:none;
}

.modal-note a:hover{
  text-decoration:underline;
}

.modal-actions{
  padding:var(--space-3) var(--space-4);
  border-top:1px solid var(--color-border-subtle);
  display:flex;
  gap:var(--space-2);
  justify-content:flex-end;
}

@media (max-width:640px){
  .modal-container{
    margin:var(--space-2);
  }
  .modal-actions{
    flex-direction:column;
  }
  .modal-actions .btn{
    width:100%;
  }
}

/* Payment / Checkout Styles - now uses .report-purchase styles */
.payment-cta{
  /* Styles moved to .report-purchase in Professional Report Styles */
}

.btn-purchase{
  background:linear-gradient(135deg,var(--color-navy-500),var(--color-navy-700));
  color:#fff;
  font-size:1.15rem;
  padding:1rem 2.5rem;
  min-width:auto;
  box-shadow:0 16px 32px -12px rgba(11,34,58,.45);
}

.btn-purchase:hover{
  background:linear-gradient(135deg,var(--color-navy-400),var(--color-navy-700));
  transform:translateY(-2px);
  box-shadow:0 20px 40px -16px rgba(11,34,58,.5);
}

.btn-purchase:disabled{
  opacity:.6;
  cursor:not-allowed;
  transform:none;
}

.payment-includes{
  margin:var(--space-2) 0 0;
  font-size:.92rem;
  color:var(--color-text-muted);
  max-width:600px;
  margin-left:auto;
  margin-right:auto;
  line-height:1.5;
}

/* .payment-success styles moved to .report-success in Professional Report Styles */
.payment-success{
  /* Styles moved to .report-success */
}

.success-icon{
  width:24px;
  height:24px;
  object-fit:contain;
  flex-shrink:0;
}

.payment-success .report-actions{
  justify-content:center;
}

.btn-download-package{
  font-size:1.1rem;
  padding:.9rem 2rem;
}

.package-contents{
  margin:var(--space-2) 0 0;
  font-size:.9rem;
  color:var(--color-text-muted);
  text-align:center;
}

.consultation-cta{
  margin-top:var(--space-4);
  padding:var(--space-3);
  background:var(--color-surface-alt);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  text-align:center;
}

.consultation-message{
  margin:0 0 var(--space-2);
  font-size:.95rem;
  color:var(--color-text-strong);
  line-height:1.5;
}

.btn-consultation{
  background:var(--color-navy-700);
  color:#fff;
  border:none;
  padding:.7rem 1.5rem;
  font-weight:600;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
}

.btn-consultation:hover{
  background:var(--color-navy-900);
}

@media (max-width:640px){
  .btn-purchase{
    font-size:1rem;
    padding:.85rem 1.5rem;
    width:100%;
  }
  .btn-download-package{
    width:100%;
  }
  .btn-consultation{
    width:100%;
    justify-content:center;
  }
  .consultation-cta{
    padding:var(--space-2);
  }
  .payment-cta{
    padding:var(--space-3);
  }
}

/* AI Progress Overlay */
.ai-progress-overlay{
  position:fixed;
  inset:0;
  z-index:10000;
  background:rgba(11,34,58,.85);
  backdrop-filter:blur(8px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:var(--space-2);
}

.ai-progress-overlay.hidden{
  display:none;
}

.ai-progress-modal{
  background:linear-gradient(145deg,var(--color-surface) 0%,#f8fafc 100%);
  border-radius:var(--radius-lg);
  box-shadow:0 32px 64px -16px rgba(11,34,58,.6),0 0 0 1px rgba(255,255,255,.1);
  max-width:480px;
  width:100%;
  padding:var(--space-4);
  text-align:center;
  animation:modalFloat .35s ease;
}

@keyframes modalFloat{
  from{opacity:0;transform:translateY(20px) scale(.95)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

.ai-progress-header{
  margin-bottom:var(--space-3);
}

/* AI Orb Animation */
.ai-orb{
  position:relative;
  width:80px;
  height:80px;
  margin:0 auto var(--space-3);
}

.ai-orb-core{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:24px;
  height:24px;
  background:linear-gradient(135deg,var(--color-navy-500),var(--color-navy-700));
  border-radius:50%;
  box-shadow:0 0 20px rgba(34,110,165,.6),0 0 40px rgba(34,110,165,.3);
  animation:orbPulse 2s ease-in-out infinite;
}

@keyframes orbPulse{
  0%,100%{transform:translate(-50%,-50%) scale(1);box-shadow:0 0 20px rgba(34,110,165,.6),0 0 40px rgba(34,110,165,.3)}
  50%{transform:translate(-50%,-50%) scale(1.15);box-shadow:0 0 30px rgba(34,110,165,.8),0 0 60px rgba(34,110,165,.4)}
}

.ai-orb-ring{
  position:absolute;
  top:50%;
  left:50%;
  border:2px solid transparent;
  border-top-color:var(--color-navy-400);
  border-radius:50%;
  opacity:.6;
}

.ai-orb-ring-1{
  width:40px;
  height:40px;
  margin:-20px 0 0 -20px;
  animation:orbSpin 2s linear infinite;
}

.ai-orb-ring-2{
  width:56px;
  height:56px;
  margin:-28px 0 0 -28px;
  border-top-color:var(--color-navy-300);
  animation:orbSpin 3s linear infinite reverse;
}

.ai-orb-ring-3{
  width:72px;
  height:72px;
  margin:-36px 0 0 -36px;
  border-top-color:var(--color-navy-200);
  border-right-color:var(--color-navy-200);
  animation:orbSpin 4s linear infinite;
}

@keyframes orbSpin{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}

/* Floating Particles */
.ai-particles{
  position:absolute;
  inset:0;
}

.ai-particles span{
  position:absolute;
  width:4px;
  height:4px;
  background:var(--color-navy-400);
  border-radius:50%;
  opacity:0;
  animation:particleFloat 3s ease-in-out infinite;
}

.ai-particles span:nth-child(1){top:10%;left:50%;animation-delay:0s}
.ai-particles span:nth-child(2){top:25%;left:85%;animation-delay:.4s}
.ai-particles span:nth-child(3){top:50%;left:95%;animation-delay:.8s}
.ai-particles span:nth-child(4){top:75%;left:85%;animation-delay:1.2s}
.ai-particles span:nth-child(5){top:90%;left:50%;animation-delay:1.6s}
.ai-particles span:nth-child(6){top:75%;left:15%;animation-delay:2s}
.ai-particles span:nth-child(7){top:50%;left:5%;animation-delay:2.4s}
.ai-particles span:nth-child(8){top:25%;left:15%;animation-delay:2.8s}

@keyframes particleFloat{
  0%,100%{opacity:0;transform:translate(0,0) scale(.5)}
  50%{opacity:.8;transform:translate(calc(var(--tx,0) * 1px),calc(var(--ty,0) * 1px)) scale(1)}
}

.ai-particles span:nth-child(1){--tx:-5;--ty:10}
.ai-particles span:nth-child(2){--tx:-10;--ty:5}
.ai-particles span:nth-child(3){--tx:-10;--ty:0}
.ai-particles span:nth-child(4){--tx:-10;--ty:-5}
.ai-particles span:nth-child(5){--tx:-5;--ty:-10}
.ai-particles span:nth-child(6){--tx:10;--ty:-5}
.ai-particles span:nth-child(7){--tx:10;--ty:0}
.ai-particles span:nth-child(8){--tx:10;--ty:5}

.ai-progress-header h3{
  color:var(--color-navy-700);
  font-size:1.35rem;
  margin:0 0 .25rem;
}

.ai-progress-subtitle{
  color:var(--color-text-muted);
  margin:0;
  font-size:.95rem;
}

/* Progress Bar */
.ai-progress-body{
  margin-bottom:var(--space-3);
}

.ai-progress-bar-container{
  height:8px;
  background:var(--color-surface-alt);
  border-radius:4px;
  overflow:hidden;
  margin-bottom:var(--space-1);
}

.ai-progress-bar{
  height:100%;
  width:0%;
  background:linear-gradient(90deg,var(--color-navy-500),var(--color-navy-400),var(--color-navy-500));
  background-size:200% 100%;
  border-radius:4px;
  transition:width .4s ease;
  animation:progressShimmer 2s linear infinite;
}

@keyframes progressShimmer{
  from{background-position:200% 0}
  to{background-position:-200% 0}
}

.ai-progress-percent{
  font-size:.85rem;
  font-weight:600;
  color:var(--color-navy-600);
  margin-bottom:var(--space-2);
}

/* Elapsed clock + live time-remaining estimate under the percent readout */
.ai-progress-meta{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  font-size:.78rem;
  color:var(--color-text-muted);
  margin-bottom:var(--space-2);
  font-variant-numeric:tabular-nums;
}
.ai-progress-meta #aiProgressEta{
  text-align:right;
}

/* Stage List */
.ai-progress-stages{
  list-style:none;
  padding:0;
  margin:0;
  text-align:left;
  max-height:240px;
  overflow-y:auto;
  scrollbar-width:thin;
}

.ai-progress-stages li{
  display:flex;
  align-items:center;
  gap:var(--space-1);
  padding:.45rem 0;
  font-size:.88rem;
  color:var(--color-text-muted);
  border-bottom:1px solid var(--color-border-subtle);
  transition:all .3s ease;
}

.ai-progress-stages li:last-child{
  border-bottom:none;
}

.stage-icon{
  width:18px;
  height:18px;
  border-radius:50%;
  border:2px solid var(--color-border-strong);
  flex-shrink:0;
  position:relative;
  transition:all .3s ease;
}

/* Pending state */
.ai-progress-stages li .stage-icon::after{
  content:"";
  position:absolute;
  inset:3px;
  border-radius:50%;
  background:transparent;
  transition:all .3s ease;
}

/* Active/Processing state */
.ai-progress-stages li.active{
  color:var(--color-navy-600);
  font-weight:500;
}

.ai-progress-stages li.active .stage-icon{
  border-color:var(--color-navy-500);
  animation:stagePulse 1.5s ease-in-out infinite;
}

.ai-progress-stages li.active .stage-icon::after{
  background:var(--color-navy-400);
  animation:stageInnerPulse 1.5s ease-in-out infinite;
}

@keyframes stagePulse{
  0%,100%{box-shadow:0 0 0 0 rgba(34,110,165,.4)}
  50%{box-shadow:0 0 0 6px rgba(34,110,165,0)}
}

@keyframes stageInnerPulse{
  0%,100%{transform:scale(.8);opacity:.6}
  50%{transform:scale(1);opacity:1}
}

/* Completed state */
.ai-progress-stages li.completed{
  color:var(--color-success);
}

.ai-progress-stages li.completed .stage-icon{
  border-color:var(--color-success);
  background:var(--color-success);
}

.ai-progress-stages li.completed .stage-icon::before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:8px;
  height:4px;
  border-left:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:translate(-50%,-60%) rotate(-45deg);
}

.ai-progress-stages li.completed .stage-icon::after{
  display:none;
}

.ai-progress-note{
  font-size:.8rem;
  color:var(--color-text-muted);
  margin:0;
  opacity:.8;
}

.ai-progress-cancel{
  display:block;
  margin:14px auto 0;
  padding:8px 18px;
  font-size:.85rem;
  color:var(--color-text-muted);
  background:none;
  border:1px solid currentColor;
  border-radius:6px;
  cursor:pointer;
  opacity:.75;
}

.ai-progress-cancel:hover,
.ai-progress-cancel:focus-visible{
  opacity:1;
}

@media (max-width:480px){
  .ai-progress-modal{
    padding:var(--space-3);
  }
  .ai-orb{
    width:60px;
    height:60px;
  }
  .ai-orb-core{
    width:18px;
    height:18px;
  }
  .ai-orb-ring-1{width:32px;height:32px;margin:-16px 0 0 -16px}
  .ai-orb-ring-2{width:44px;height:44px;margin:-22px 0 0 -22px}
  .ai-orb-ring-3{width:56px;height:56px;margin:-28px 0 0 -28px}
  .ai-progress-stages{max-height:200px}
}

/* ============================================
   Report Styles
   ============================================ */

/* Report Header */
.report-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  padding:var(--space-3) var(--space-4);
  margin-bottom:var(--space-3);
  background:linear-gradient(135deg,var(--color-navy-900) 0%,var(--color-navy-700) 100%);
  border-radius:var(--radius-lg);
  box-shadow:0 4px 16px -4px rgba(11,34,58,.35);
}

.report-header .report-title{
  color:#fff;
}

.report-header .report-subtitle{
  color:rgba(255,255,255,.7);
}

.report-header .report-date{
  background:rgba(255,255,255,.12);
  color:rgba(255,255,255,.8);
  border:1px solid rgba(255,255,255,.15);
}

.report-title{
  font-size:1.75rem;
  color:var(--color-navy-700);
  margin:0 0 .35rem;
  font-weight:700;
}

.report-subtitle{
  color:var(--color-text-muted);
  margin:0;
  font-size:1rem;
}

.report-date{
  font-size:.9rem;
  color:var(--color-text-muted);
  background:var(--color-surface-alt);
  padding:.5rem 1rem;
  border-radius:var(--radius-sm);
}

/* Report Sections */
.report-section{
  margin-bottom:var(--space-3);
  background:var(--color-surface);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-lg);
  padding:var(--space-4);
  box-shadow:0 2px 8px -2px rgba(11,34,58,.06);
}

.report-section-title{
  position:relative;
  font-size:1.1rem;
  font-weight:700;
  color:var(--color-navy-700);
  margin:0 0 var(--space-3);
  padding:0 0 var(--space-2) .8rem;
  border-bottom:1px solid var(--color-border-subtle);
}

.report-section-title::before{
  content:"";
  position:absolute;
  left:0;
  top:.08em;
  width:3px;
  height:1.05em;
  border-radius:2px;
  background:linear-gradient(180deg,var(--accent-bright),var(--accent-strong));
}

.report-section-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-bottom:var(--space-2);
  margin-bottom:var(--space-3);
  border-bottom:1px solid var(--color-border-subtle);
}

.report-section-header .report-section-title{
  margin-bottom:0;
  padding-bottom:0;
  border-bottom:none;
}

/* Summary Grid */
.summary-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:var(--space-2);
  margin-bottom:var(--space-3);
}

.summary-card{
  padding:var(--space-2) var(--space-3);
  background:var(--color-surface);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
}

.summary-label{
  font-size:.8rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--color-text-muted);
  margin-bottom:.5rem;
  font-weight:500;
}

.summary-value{
  font-size:1.75rem;
  font-weight:700;
  color:var(--color-navy-700);
}

.summary-value-text{
  font-size:1.1rem;
  font-weight:600;
}

/* Report Insight */
.report-insight{
  font-size:.95rem;
  color:var(--color-text-muted);
  line-height:1.65;
  margin:0;
  padding:var(--space-2) var(--space-3);
  background:var(--color-surface-alt);
  border-left:3px solid var(--color-navy-400);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
}

/* Function Table */
.function-table{
  width:100%;
  border-collapse:collapse;
  font-size:.95rem;
}

.function-table th{
  text-align:left;
  padding:1rem .75rem;
  font-size:.8rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--color-text-muted);
  background:var(--color-surface-alt);
  font-weight:600;
}

.function-table th:first-child{
  border-radius:var(--radius-sm) 0 0 0;
}

.function-table th:last-child{
  border-radius:0 var(--radius-sm) 0 0;
}

.function-table td{
  padding:1rem .75rem;
  border-bottom:1px solid var(--color-border-subtle);
  vertical-align:middle;
}

.function-table tr:last-child td{
  border-bottom:none;
}

.fn-name{
  font-weight:600;
  color:var(--color-navy-700);
  width:100px;
}

.fn-desc{
  color:var(--color-text-muted);
  line-height:1.5;
}

.fn-score{
  font-weight:700;
  color:var(--color-navy-700);
  width:60px;
  text-align:right;
  font-size:1rem;
}

.fn-bar{
  width:140px;
}

.fn-bar .bar{
  height:8px;
  border-radius:4px;
}

/* Tier Grid */
.tier-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:var(--space-2);
  margin-bottom:var(--space-3);
}

.tier-item{
  padding:var(--space-3);
  background:var(--color-surface);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
}

.tier-item-main{
  background:linear-gradient(135deg,var(--color-sky-100) 0%,var(--color-surface) 100%);
  border-color:var(--color-navy-400);
  border-width:2px;
}

.tier-item-main .tier-value{
  font-size:2rem;
  color:var(--color-navy-500);
}

.tier-label{
  font-size:.8rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--color-text-muted);
  margin-bottom:.5rem;
  font-weight:500;
}

.tier-value{
  font-size:1.5rem;
  font-weight:700;
  color:var(--color-navy-700);
}

.tier-name{
  font-size:.9rem;
  color:var(--color-text-muted);
  margin-top:.25rem;
}

.tier-link{
  display:inline-block;
  font-size:.9rem;
  color:var(--color-navy-500);
  text-decoration:none;
  font-weight:500;
}

.tier-link:hover{
  text-decoration:underline;
}

/* Tier Details */
.tier-details{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--space-3);
  margin-top:var(--space-3);
  padding-top:var(--space-3);
  border-top:1px solid var(--color-border-subtle);
}

.tier-detail-col{
  background:var(--color-sky-100);
  border-left:4px solid var(--color-navy-500);
  padding:var(--space-3);
  border-radius:0 var(--radius-md) var(--radius-md) 0;
}

.tier-detail-col h4{
  font-size:1rem;
  font-weight:700;
  color:var(--color-navy-700);
  margin:0 0 var(--space-2);
  padding-bottom:var(--space-1);
  border-bottom:1px solid rgba(34,110,165,.2);
  display:flex;
  align-items:center;
  gap:.5rem;
}

.tier-detail-col h4::before{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  background:var(--color-navy-500);
  border-radius:50%;
}

.tier-detail-col ul{
  margin:0;
  padding:0;
  list-style:none;
}

.tier-detail-col li{
  position:relative;
  padding-left:1.25rem;
  margin-bottom:.75rem;
  line-height:1.65;
  color:var(--color-text-strong);
  font-size:.925rem;
}

.tier-detail-col li:last-child{
  margin-bottom:0;
}

.tier-detail-col li::before{
  content:"→";
  position:absolute;
  left:0;
  color:var(--color-navy-500);
  font-weight:600;
}

.tier-detail-col .placeholder{
  padding-left:0;
  color:var(--color-text-muted);
  font-style:italic;
}

.tier-detail-col .placeholder::before{
  display:none;
}

/* Data Quality Notes section */
#aiDataQualitySection{
  margin-top:var(--space-3);
}

/* AI Tier Loading Animation (full-section) */
.ai-tier-loading{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:260px;
  padding:var(--space-4) var(--space-2);
  text-align:center;
  background:linear-gradient(135deg,var(--color-sky-100) 0%,var(--color-surface) 100%);
  border-radius:var(--radius-md);
  margin-top:var(--space-3);
  border:1px solid rgba(34,110,165,.1);
}

.ai-tier-loading.hidden{
  display:none;
}

.ai-tier-loading-text{
  font-size:1.1rem;
  font-weight:600;
  color:var(--color-navy-700);
  margin:var(--space-2) 0 .35rem;
}

.ai-tier-loading-sub{
  font-size:.875rem;
  color:var(--color-text-muted);
  margin:0;
}

/* Report List (used for Recommendations & Data Quality Notes) */
.report-list{
  margin:0;
  padding-left:1.5rem;
  color:var(--color-text-muted);
  font-size:.95rem;
}

.report-list li{
  margin-bottom:.6rem;
  line-height:1.6;
}

.empty-state{
  color:var(--color-text-muted);
  font-style:italic;
  margin:0;
}

/* Detail Cards */
.report-details{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:var(--space-2);
}

.detail-card{
  background:var(--color-surface);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  padding:var(--space-2) var(--space-3);
}

.detail-card h4{
  font-size:.9rem;
  font-weight:600;
  color:var(--color-navy-700);
  margin:0 0 .75rem;
  padding-bottom:.5rem;
  border-bottom:1px solid var(--color-border-subtle);
}

.detail-card ul{
  margin:0;
  padding-left:1.1rem;
  color:var(--color-text-muted);
  font-size:.85rem;
}

.detail-card li{
  margin-bottom:.35rem;
  line-height:1.5;
}

/* Detailed Assessment Data — label/value pairs */
.detail-dl{
  margin:0;
  display:flex;
  flex-direction:column;
  gap:.4rem;
}
.detail-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);
  gap:.5rem;
  font-size:.85rem;
  line-height:1.45;
  padding-bottom:.4rem;
  border-bottom:1px dashed var(--color-border-subtle);
}
.detail-row:last-child{ border-bottom:0; padding-bottom:0; }
.detail-row dt{ margin:0; color:var(--color-text-muted); font-weight:600; }
.detail-row dd{ margin:0; color:var(--color-text-strong); overflow-wrap:anywhere; }
.detail-empty{ color:var(--color-text-muted); font-style:italic; margin:0; }

/* Report appendix wrapper */
.report-appendix{
  margin-top:var(--space-4);
  padding-top:var(--space-3);
  border-top:1px solid var(--color-border-strong);
}
.report-appendix-head{ margin-bottom:var(--space-2); }
.report-appendix-eyebrow{
  display:inline-block;
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--color-text-muted);
}
.report-appendix-title{
  font-size:1.15rem;
  font-weight:800;
  color:var(--color-navy-900);
  margin:.25rem 0 .35rem;
}
.report-appendix-note{ margin:0; font-size:.85rem; color:var(--color-text-muted); max-width:60ch; }

/* Executive Summary */
.exec-summary-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  flex-wrap:wrap;
}
.exec-summary-narrative{
  font-size:1.02rem;
  line-height:1.7;
  color:var(--color-text-strong);
  margin:.4rem 0 var(--space-3);
}
.exec-scorecard{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:.85rem;
}
.exec-score-fn{
  font-size:.74rem;
  font-weight:700;
  color:var(--color-text-muted);
  margin-bottom:.35rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.exec-score-bar{
  height:6px;
  border-radius:999px;
  background:var(--color-surface-alt);
  overflow:hidden;
  margin-bottom:.3rem;
}
.exec-score-fill{ height:100%; border-radius:999px; }
.exec-score-val{ font-size:.95rem; font-weight:800; color:var(--color-text-strong); }

/* Analyst Assessment narrative + evidence */
.analyst-narrative{
  font-size:1rem;
  line-height:1.7;
  color:var(--color-text-strong);
  margin:0 0 var(--space-3);
}
.analyst-evidence{
  background:var(--color-surface-alt);
  border:1px solid var(--color-border-subtle);
  border-left:3px solid var(--color-navy-500);
  border-radius:var(--radius-md);
  padding:var(--space-2) var(--space-3);
}
.analyst-evidence-title{
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--color-navy-700);
  margin:0 0 .6rem;
}

/* Priority Actions (ranked) */
.priority-actions{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:.85rem;
}
.priority-action{
  display:flex;
  gap:.9rem;
  background:var(--color-surface);
  border:1px solid var(--color-border-subtle);
  border-left:4px solid var(--color-border-strong);
  border-radius:var(--radius-md);
  padding:var(--space-2) var(--space-3);
}
.priority-action.sev-critical{ border-left-color:var(--sev-critical); }
.priority-action.sev-high{ border-left-color:var(--sev-high); }
.priority-action.sev-medium{ border-left-color:var(--sev-medium); }
.priority-action.sev-low{ border-left-color:var(--sev-low); }
.priority-rank{
  flex-shrink:0;
  width:28px;
  height:28px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:.85rem;
  font-weight:800;
  color:#fff;
  background:var(--color-navy-700);
}
.priority-body{ flex:1; min-width:0; }
.priority-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:.75rem;
  flex-wrap:wrap;
}
.priority-title{
  font-size:.98rem;
  font-weight:700;
  color:var(--color-text-strong);
  line-height:1.35;
}
.priority-tags{ display:inline-flex; align-items:center; gap:.4rem; flex-shrink:0; }
.priority-tag-csf{
  font-family:var(--font-family-mono, ui-monospace, "SFMono-Regular", Menlo, monospace);
  font-size:.7rem;
  font-weight:700;
  color:var(--color-navy-700);
  background:var(--navy-soft);
  border:1px solid var(--navy-line);
  border-radius:4px;
  padding:.12rem .4rem;
}
.priority-sev{
  font-size:.66rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  border-radius:4px;
  padding:.12rem .45rem;
  color:#fff;
}
.priority-sev.sev-critical{ background:var(--sev-critical); }
.priority-sev.sev-high{ background:var(--sev-high); }
.priority-sev.sev-medium{ background:var(--sev-medium); }
.priority-sev.sev-low{ background:var(--sev-low); }
.priority-rec{
  margin:.45rem 0 0;
  font-size:.9rem;
  line-height:1.55;
  color:var(--color-text-muted);
}
.priority-action-clear{ border-left-color:var(--sev-low); }
.priority-action-pending{ border-left-color:var(--color-border-strong); }
.priority-action-more{ border-left-color:var(--accent); background:var(--accent-soft); }
.priority-action-more .priority-rec{
  display:flex;
  align-items:flex-start;
  gap:.45rem;
  margin:0;
  color:var(--color-navy-700);
}
.priority-action-more .priority-rec strong{ color:var(--color-text-strong); }

/* Gated remediation row inside each finding card: the diagnosis is shown free,
   the fix is reserved for the paid report. The lock is an inline SVG, not emoji. */
.priority-locked{
  display:flex;
  align-items:flex-start;
  gap:.5rem;
  margin:.55rem 0 0;
  padding:.5rem .65rem;
  font-size:.85rem;
  line-height:1.5;
  color:var(--color-text-muted);
  background:var(--accent-soft);
  border:1px solid var(--accent-line);
  border-radius:var(--radius-sm);
}
.priority-locked strong{ color:var(--color-text-strong); font-weight:700; }
.lock-ico{ flex-shrink:0; margin-top:.1rem; color:var(--accent-strong); }

@media (max-width:768px){
  .exec-scorecard{ grid-template-columns:repeat(3,1fr); }
  .detail-row{ grid-template-columns:1fr; gap:.1rem; }
  .priority-head{ flex-direction:column; }
}

/* Bridge band: links the surfaced findings to the policy suite, leading into the CTA */
.findings-bridge{
  background:linear-gradient(180deg,var(--color-surface) 0%,var(--accent-soft) 100%);
  border:1px solid var(--accent-line);
}
.findings-bridge.hidden{ display:none; }
.bridge-eyebrow{
  display:inline-block;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--accent-strong);
  margin-bottom:.5rem;
}
.bridge-lead{
  margin:0 0 1rem;
  font-size:.98rem;
  line-height:1.6;
  color:var(--color-text-strong);
}
.bridge-lead strong{ color:var(--color-navy-700); }
.bridge-policies{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin:0;
  padding:0;
  list-style:none;
}
.bridge-policy{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  font-size:.82rem;
  font-weight:600;
  color:var(--color-navy-700);
  background:var(--color-surface);
  border:1px solid var(--navy-line);
  border-radius:var(--radius-pill);
  padding:.32rem .75rem;
}
.bridge-policy::before{
  content:"";
  width:6px; height:6px;
  border-radius:50%;
  background:var(--accent);
  flex-shrink:0;
}

/* CTA Sections (Purchase & Success) */
.report-cta{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,var(--color-surface) 0%,var(--color-surface-alt) 100%);
  border:1px solid var(--navy-line);
  border-radius:var(--radius-lg);
  padding:var(--space-5) var(--space-4);
  margin-top:0;
  box-shadow:0 18px 48px -28px rgba(11,34,58,.4);
}

.report-cta::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg,var(--color-navy-700),var(--color-navy-400),var(--color-navy-700));
}

.cta-content{
  max-width:600px;
  margin:0 auto;
  text-align:center;
}

.cta-eyebrow{
  display:inline-block;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--color-navy-700);
  margin-bottom:.6rem;
}

.cta-content h3{
  font-size:clamp(1.45rem,2.4vw,1.85rem);
  font-weight:800;
  letter-spacing:-.01em;
  color:var(--color-navy-900);
  margin:0 0 .75rem;
}

.cta-lead{
  max-width:520px;
  margin-left:auto;
  margin-right:auto;
}

.cta-price{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.2rem;
  margin:var(--space-3) 0;
}

.cta-price-value{
  font-size:clamp(2.5rem,5vw,3.1rem);
  font-weight:800;
  letter-spacing:-.025em;
  color:var(--color-navy-900);
  line-height:1;
}

.cta-price-note{
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--color-text-muted);
}

.cta-checklist{
  list-style:none;
  margin:var(--space-3) auto;
  padding:0;
  max-width:540px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.65rem 1.5rem;
  text-align:left;
}

.cta-checklist li{
  position:relative;
  padding-left:1.7rem;
  font-size:.9rem;
  line-height:1.45;
  color:var(--color-navy-700);
}

.cta-checklist li::before{
  content:"";
  position:absolute;
  left:0;
  top:.05em;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--navy-soft);
  border:1px solid var(--navy-line);
}

.cta-checklist li::after{
  content:"";
  position:absolute;
  left:6px;
  top:.3em;
  width:4px;
  height:8px;
  border:solid var(--color-navy-700);
  border-width:0 2px 2px 0;
  transform:rotate(45deg);
}

.cta-policies-note{
  max-width:560px;
  margin:0 auto var(--space-3);
  font-size:.78rem;
  line-height:1.5;
  color:var(--color-text-muted);
}

#purchaseBtn,
#downloadPackageBtn{
  background:linear-gradient(135deg,var(--color-navy-700) 0%,var(--color-navy-900) 100%);
  border-color:var(--color-navy-900);
  color:#fff;
  box-shadow:0 14px 32px -14px rgba(11,34,58,.7);
}

#purchaseBtn:hover,
#downloadPackageBtn:hover{
  background:linear-gradient(135deg,var(--color-navy-500) 0%,var(--color-navy-700) 100%);
  border-color:var(--color-navy-700);
}

.cta-content h4{
  font-size:1rem;
  font-weight:600;
  color:var(--color-navy-700);
  margin:var(--space-2) 0 .5rem;
}

.cta-content p{
  color:var(--color-text-muted);
  margin:0 0 var(--space-2);
  font-size:.95rem;
  line-height:1.6;
}

.cta-icon{
  width:48px;
  height:48px;
  margin-bottom:var(--space-2);
}

.cta-includes{
  font-size:.9rem;
  color:var(--color-text-muted);
  margin-bottom:var(--space-3);
  line-height:1.6;
}

.cta-includes span{
  font-weight:600;
  color:var(--color-navy-700);
}

.cta-subtext{
  font-size:.85rem;
  color:var(--color-text-muted);
  margin:var(--space-1) 0 0;
}

.cta-divider{
  width:80px;
  height:1px;
  background:var(--color-border-subtle);
  margin:var(--space-3) auto;
}

.btn-lg{
  font-size:1.1rem;
  padding:1rem 2rem;
  min-width:280px;
}

/* Voucher Section */
.voucher-section{
  margin-top:var(--space-2);
}

.voucher-toggle{
  background:none;
  border:none;
  padding:0;
  cursor:pointer;
  font-size:.875rem;
  color:var(--color-text-muted);
  text-decoration:underline;
  text-underline-offset:2px;
}

.voucher-toggle:hover{
  color:var(--color-navy-700);
}

.voucher-form{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:var(--space-1);
  margin-top:var(--space-1);
}

.voucher-form input[type="text"]{
  width:220px;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.voucher-feedback{
  width:100%;
  font-size:.85rem;
  color:var(--color-red,#c0392b);
  margin:0;
}

.voucher-feedback.success{
  color:var(--color-green,#27ae60);
}

/* AI Loading */
.ai-loading{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-size:.85rem;
  color:var(--color-text-muted);
}

.ai-loading-text{
  margin:0;
}

/* Responsive */
@media (max-width:900px){
  .summary-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .tier-grid{
    grid-template-columns:1fr;
  }
  .tier-details{
    grid-template-columns:1fr;
    gap:var(--space-2);
  }
  .report-details{
    grid-template-columns:1fr;
  }
}

@media (max-width:640px){
  .report-header{
    flex-direction:column;
    gap:var(--space-2);
  }
  .report-title{
    font-size:1.5rem;
  }
  .summary-grid{
    grid-template-columns:1fr 1fr;
  }
  .summary-value{
    font-size:1.35rem;
  }
  .function-table{
    font-size:.85rem;
  }
  .fn-bar{
    display:none;
  }
  .fn-desc{
    display:none;
  }
  .cta-content{
    padding:0 var(--space-1);
  }
  .btn-lg{
    width:100%;
    min-width:auto;
  }
}

/* ============================================
   Report v2 — Premium Free Deliverable
   ============================================ */

/* Report Header (v2 — with DMS brand row + downloads) */
.report-header-titles{
  display:flex;
  flex-direction:column;
  gap:.4rem;
  min-width:0;
}

.report-header-brand{
  display:flex;
  align-items:center;
  gap:.85rem;
  margin-bottom:.5rem;
}

.report-header-logo{
  height:34px;
  width:auto;
  filter:brightness(0) invert(1);
  opacity:.95;
}

.report-header-divider{
  width:1px;
  height:22px;
  background:rgba(255,255,255,.25);
}

.report-header-eyebrow{
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(255,255,255,.75);
  font-weight:600;
}

.report-header-meta{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:.65rem;
  flex-shrink:0;
}

.report-downloads{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:.4rem;
}

.report-downloads-label{
  font-size:.66rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(255,255,255,.55);
}

.report-downloads-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.5rem;
}

.btn-download{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.5rem .85rem;
  font-size:.82rem;
  font-weight:600;
  color:rgba(255,255,255,.92);
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.2);
  border-radius:var(--radius-sm);
  cursor:pointer;
  transition:background .15s,border-color .15s,transform .1s;
  letter-spacing:.02em;
}

.btn-download:hover{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.35);
}

.btn-download:active{
  transform:translateY(1px);
}

.btn-download svg{
  opacity:.85;
}

/* Executive Hero Banner */
.report-hero{
  position:relative;
  overflow:hidden;
  border-radius:var(--radius-lg);
  margin-bottom:var(--space-3);
  background:var(--gradient-hero);
  color:#fff;
  box-shadow:0 14px 42px -18px rgba(11,34,58,.55);
}

.report-hero-bg{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(820px 340px at 90% -12%,rgba(25,198,198,.20),transparent 62%),
    radial-gradient(680px 360px at -8% 116%,rgba(18,58,74,.55),transparent 60%);
  opacity:.95;
}

.report-hero-content{
  position:relative;
  padding:var(--space-4) var(--space-4) var(--space-5);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:var(--space-3);
}

.report-hero-org{
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:.6rem;
  flex-wrap:wrap;
}

.hero-org-name{
  font-size:1.05rem;
  font-weight:600;
  color:rgba(255,255,255,.95);
}

.hero-org-meta{
  font-size:.85rem;
  color:rgba(255,255,255,.6);
  letter-spacing:.02em;
}

.report-hero-verdict{
  font-size:clamp(1.55rem,2.4vw,2rem);
  font-weight:700;
  color:#fff;
  margin:0 auto;
  letter-spacing:-.01em;
  line-height:1.25;
  max-width:760px;
}

.report-hero-stats{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:var(--space-4);
  margin-top:var(--space-2);
}

/* Featured maturity gauge */
.hero-overall{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.55rem;
}
.hero-gauge{
  position:relative;
  width:128px;
  height:128px;
  filter:drop-shadow(0 0 16px rgba(25,198,198,.22));
}
.hero-gauge-svg{ width:100%; height:100%; display:block; }
.hero-gauge-track{ stroke:rgba(255,255,255,.12); }
.hero-gauge-prog{
  stroke:var(--accent-bright);
  transition:stroke-dashoffset .9s cubic-bezier(.22,.61,.36,1), stroke .4s ease;
}
.hero-gauge-center{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.12rem;
}
.hero-gauge-value{
  font-size:2.2rem;
  font-weight:800;
  line-height:1;
  letter-spacing:-.02em;
  color:#fff;
}
.hero-gauge-cap{
  font-size:.6rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:700;
  color:rgba(255,255,255,.6);
}
.hero-gauge-sub{
  font-size:.8rem;
  color:rgba(255,255,255,.7);
  text-align:center;
  max-width:240px;
  line-height:1.35;
}

/* Supporting stats stack */
.hero-stat-stack{
  display:flex;
  flex-direction:column;
  gap:var(--space-2);
  min-width:228px;
}
.hero-stat{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:.2rem;
  text-align:left;
  padding:.7rem .95rem .7rem 1.1rem;
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
}
.hero-stat::before{
  content:"";
  position:absolute;
  left:0; top:12%;
  width:3px; height:76%;
  border-radius:3px;
  background:var(--accent-bright);
  opacity:.85;
}
.hero-stat-label{
  font-size:.66rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.65);
  font-weight:700;
}
.hero-stat-value{
  font-size:1.5rem;
  font-weight:800;
  color:#fff;
  line-height:1.05;
  letter-spacing:-.01em;
}
.hero-stat-tier{ font-size:1.5rem; }
.hero-stat-text{ font-size:1.15rem; font-weight:700; }
.hero-stat-meta{
  font-size:.76rem;
  color:rgba(255,255,255,.62);
  line-height:1.35;
}

/* ---- Interactive visuals: hover/focus tooltips for the CSF wheel + tier ladder ---- */
/* Labels never steal hover from the segment paths beneath them. */
.csf-wheel-wrap svg text,
.tier-ladder-wrap svg text{ pointer-events:none; }

.wheel-seg,
.tier-seg{
  cursor:pointer;
  transform-box:fill-box;
  transform-origin:center;
  transition:transform .18s ease, filter .18s ease, opacity .18s ease;
  outline:none;
}
.wheel-seg:focus-visible,
.tier-seg:focus-visible{ stroke:var(--color-navy-900,#0b223a); stroke-width:2; }

/* Pop the hovered/focused segment; dim its siblings to spotlight it. */
.csf-wheel-wrap.has-active .wheel-seg:not(.is-active){ opacity:.4; }
.csf-wheel-wrap .wheel-seg.is-active{
  transform:scale(1.04);
  filter:drop-shadow(0 3px 7px rgba(11,34,58,.3)) brightness(1.05);
}
.tier-ladder-wrap.has-active .tier-seg:not(.is-active){ opacity:.5; }
.tier-ladder-wrap .tier-seg.is-active{
  transform:scale(1.025);
  filter:drop-shadow(0 3px 9px rgba(11,34,58,.28)) brightness(1.04);
}

/* Floating popup — pinned to a fixed side rail (wheel hovers = left, tier ladder
   hovers = right; bottom on narrow screens) so it never overlaps the visual. The
   popped + dimmed segment shows which item it describes. */
.viz-popup{
  position:fixed;
  z-index:1000;
  top:0; left:0;
  width:300px;
  max-width:calc(100vw - 36px);
  padding:.85rem 1rem;
  border-radius:var(--radius-md);
  background:var(--ink-800,#101a30);
  color:#fff;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 44px -16px rgba(11,18,32,.75);
  pointer-events:none;
  opacity:0;
  transition:opacity .16s ease, transform .16s ease;
  display:flex;
  flex-direction:column;
  gap:.25rem;
}
.viz-popup.pin-left{ transform:translateX(-10px); border-right:3px solid var(--viz-accent,var(--accent-bright)); }
.viz-popup.pin-right{ transform:translateX(10px); border-left:3px solid var(--viz-accent,var(--accent-bright)); }
.viz-popup.pin-bottom{ transform:translateY(10px); border-top:3px solid var(--viz-accent,var(--accent-bright)); }
.viz-popup.is-visible{ opacity:1; transform:none; }
.viz-popup-eyebrow{
  font-size:.6rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--viz-accent,var(--accent-bright));
}
.viz-popup-title{ font-size:.95rem; font-weight:700; line-height:1.25; }
.viz-popup-body{ font-size:.83rem; line-height:1.5; color:rgba(255,255,255,.82); }
@media (prefers-reduced-motion: reduce){
  .wheel-seg, .tier-seg, .viz-popup, .hero-gauge-prog{ transition:none; }
  .csf-wheel-wrap .wheel-seg.is-active,
  .tier-ladder-wrap .tier-seg.is-active{ transform:none; }
}

/* ---- Unified report loading screen + reveal ---- */
.report-loading{
  position:fixed;
  inset:0;
  z-index:2000;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--gradient-hero,#0b1220);
  opacity:0;
  transition:opacity .45s ease;
}
.report-loading[hidden]{ display:none; }
.report-loading.is-visible{ opacity:1; }
.report-loading-inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1.4rem;
  text-align:center;
  padding:2rem;
}
.report-loading-orb{ position:relative; width:118px; height:118px; }
.report-loading-orb .rl-ring{
  position:absolute; inset:0;
  border-radius:50%;
  border:2px solid transparent;
  border-top-color:var(--accent-bright,#19c6c6);
  animation:rl-spin 1.4s linear infinite;
}
.report-loading-orb .rl-ring:nth-child(2){ inset:15px; border-top-color:rgba(25,198,198,.6); animation-duration:1.9s; animation-direction:reverse; }
.report-loading-orb .rl-ring:nth-child(3){ inset:30px; border-top-color:rgba(25,198,198,.32); animation-duration:2.5s; }
.report-loading-orb .rl-core{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font-size:.82rem; font-weight:800; letter-spacing:.06em; line-height:1.05;
  color:#fff; text-align:center;
}
@keyframes rl-spin{ to{ transform:rotate(360deg); } }
.report-loading-title{ margin:0; font-size:1.5rem; font-weight:700; color:#fff; letter-spacing:-.01em; }
.report-loading-msg{
  margin:0; min-height:1.3em; max-width:360px;
  font-size:.95rem; line-height:1.45; color:rgba(255,255,255,.74);
  transition:opacity .2s ease;
}
#results.report-prep{ opacity:0; }
#results.report-in{ animation:report-reveal .65s cubic-bezier(.22,.61,.36,1) both; }
@keyframes report-reveal{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){
  .report-loading-orb .rl-ring{ animation:none; }
  #results.report-prep{ opacity:1; }
  #results.report-in{ animation:none; }
}

/* 2-col visual grid (CSF wheel + tier ladder) */
.report-grid-2col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--space-3);
  margin-bottom:var(--space-3);
}

.report-grid-2col .report-section{
  margin-bottom:0;
}

.visual-card{
  display:flex;
  flex-direction:column;
  gap:var(--space-2);
}

.visual-caption{
  font-size:.85rem;
  color:var(--color-text-muted);
  line-height:1.55;
  margin:0;
  padding:.6rem .85rem;
  background:var(--color-surface-alt);
  border-left:3px solid var(--accent);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
}

.csf-wheel-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:var(--space-2);
  min-height:340px;
}

.csf-wheel-wrap svg{
  max-width:100%;
  height:auto;
}

/* Tier Ladder */
.tier-ladder-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:var(--space-2);
  min-height:340px;
}

.tier-ladder-wrap svg{
  max-width:100%;
  height:auto;
}

/* Function gap analysis */
.function-gap-wrap{
  display:flex;
  flex-direction:column;
  gap:var(--space-1);
  margin-bottom:var(--space-2);
}

.gap-row{
  display:grid;
  grid-template-columns:130px 1fr 75px;
  align-items:center;
  gap:var(--space-2);
  padding:.55rem .25rem;
  border-bottom:1px solid var(--color-border-subtle);
}

.gap-row:last-child{border-bottom:none;}

.gap-fn{
  display:flex;
  align-items:center;
  gap:.55rem;
  font-weight:600;
  color:var(--color-navy-700);
  font-size:.95rem;
}

.gap-fn-swatch{
  display:inline-block;
  width:12px;
  height:12px;
  border-radius:3px;
  flex-shrink:0;
}

.gap-track{
  position:relative;
  height:18px;
  border-radius:9px;
  background:var(--color-surface-alt);
  overflow:visible;
}

.gap-track-fill{
  position:absolute;
  inset-block:0;
  left:0;
  border-radius:9px;
  transition:width .4s ease;
}

.gap-score{
  text-align:right;
  font-weight:700;
  color:var(--color-navy-700);
  font-size:.95rem;
}

/* Per-function rationale: full-width caption under a gap row */
.gap-rationale{
  grid-column:1 / -1;
  margin:.35rem 0 0;
  padding-left:calc(12px + .55rem);
  font-size:.8rem;
  line-height:1.5;
  color:var(--color-text-muted);
}

/* Questionnaire scoring detail: collapsible rubric breakdown under a gap row */
.gap-breakdown{
  grid-column:1 / -1;
  margin:.3rem 0 0;
  padding-left:calc(12px + .55rem);
  font-size:.78rem;
}
.gap-breakdown summary{
  cursor:pointer;
  color:var(--color-navy-500);
  font-weight:600;
}
.gap-breakdown summary:hover{ text-decoration:underline; }
.gap-breakdown ul{
  list-style:none;
  margin:.45rem 0 .2rem;
  padding:0;
}
.gap-breakdown li{
  display:grid;
  grid-template-columns:4.2rem 1fr auto;
  gap:.6rem;
  padding:.22rem 0;
  border-bottom:1px solid var(--color-border, #D5E2ED);
  align-items:baseline;
}
.gap-breakdown li:last-child{ border-bottom:none; }
.gb-pts{
  font-variant-numeric:tabular-nums;
  font-weight:700;
  color:var(--color-navy-700);
  white-space:nowrap;
}
.gb-label{ color:var(--color-text, #102133); }
.gb-answer{
  color:var(--color-text-muted);
  font-style:italic;
  text-align:right;
}

/* Pending state: spinner shown in visual cards while AI scores load */
.viz-loading{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.85rem;
  min-height:240px;
  width:100%;
  color:var(--color-text-muted);
}

.viz-spinner{
  width:34px;
  height:34px;
  border-radius:50%;
  border:3px solid var(--accent-soft);
  border-top-color:var(--accent);
  animation:upload-spin .8s linear infinite;
}

.viz-loading-label{
  font-size:.85rem;
  letter-spacing:.01em;
}

/* Pending state: skeleton gap rows */
.gap-skel .gap-fn{color:var(--color-text-muted);}

.gap-skel-swatch{
  background:var(--color-border-subtle);
}

.gap-skel-track{
  position:absolute;
  inset:0;
  border-radius:9px;
  background:linear-gradient(90deg,var(--color-surface-alt) 0%,var(--color-border-subtle) 50%,var(--color-surface-alt) 100%);
  background-size:200% 100%;
  animation:gap-skel-shimmer 1.4s ease-in-out infinite;
}

.gap-skel-label{
  color:var(--color-text-muted);
  font-weight:600;
  font-size:.78rem;
}

@keyframes gap-skel-shimmer{
  0%{background-position:200% 0;}
  100%{background-position:-200% 0;}
}

/* Print/export: freeze any animations (report is fully rendered by then) */
@media print{
  .viz-spinner,.gap-skel-track{animation:none;}
}

/* Tier pill row (replaces tier-grid) */
.tier-pill-row{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-1);
  margin-bottom:var(--space-3);
}

.tier-pill{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  padding:.55rem 1rem;
  background:var(--color-surface);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-pill);
  font-size:.9rem;
}

.tier-pill-label{
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.7rem;
  font-weight:600;
  color:var(--color-text-muted);
}

.tier-pill-value{
  font-weight:700;
  color:var(--color-navy-700);
}

.tier-pill-name{
  color:var(--color-text-muted);
  font-size:.85rem;
}

.tier-pill-tier-1 .tier-pill-value{color:var(--tier-1);}
.tier-pill-tier-2 .tier-pill-value{color:var(--tier-2);}
.tier-pill-tier-3 .tier-pill-value{color:var(--tier-3);}
.tier-pill-tier-4 .tier-pill-value{color:var(--tier-4);}

/* Section subtitles (used in findings section) */
.report-section-subtitle{
  font-size:.9rem;
  color:var(--color-text-muted);
  margin:-.5rem 0 var(--space-3);
  line-height:1.55;
  max-width:680px;
}

.sev-critical{background:rgba(214,69,69,.12);color:var(--sev-critical);}
.sev-critical::before{background:var(--sev-critical);}
.sev-high{background:rgba(195,122,30,.12);color:var(--sev-high);}
.sev-high::before{background:var(--sev-high);}
.sev-medium{background:rgba(34,110,165,.12);color:var(--sev-medium);}
.sev-medium::before{background:var(--sev-medium);}
.sev-low{background:rgba(15,157,122,.12);color:var(--sev-low);}
.sev-low::before{background:var(--sev-low);}

/* Responsive breakpoints for v2 */
@media (max-width:960px){
  .report-grid-2col{
    grid-template-columns:1fr;
  }
  .report-hero-stats{
    gap:var(--space-3);
  }
}

@media (max-width:640px){
  .report-header{
    flex-direction:column;
    gap:var(--space-2);
    padding:var(--space-3);
  }
  .report-header-meta{
    align-items:flex-start;
  }
  .report-downloads{
    align-items:flex-start;
  }
  .report-downloads-actions{
    justify-content:flex-start;
  }
  .report-hero-content{
    padding:var(--space-3);
  }
  .hero-gauge-value{font-size:1.9rem;}
  .gap-row{
    grid-template-columns:100px 1fr 60px;
    gap:.6rem;
  }
  .cta-checklist{
    grid-template-columns:1fr;
    max-width:340px;
  }
}

/* Print stylesheet — for browser print-to-PDF download */
@media print{
  body{
    background:#fff !important;
    color:var(--color-text-strong);
    font-size:11pt;
  }
  .site-header,
  .progress-wrap,
  .section,
  .button-group,
  .save-progress,
  .report-downloads,
  .report-cta,
  #paymentCta,
  #paymentSuccess,
  .ai-tier-loading,
  .voucher-section,
  .section-warning,
  .policy-download-feedback,
  .ai-status-message{
    display:none !important;
  }
  .results{
    display:block !important;
  }
  .report-section{
    break-inside:avoid;
    page-break-inside:avoid;
    box-shadow:none !important;
    border-color:#dde6ef !important;
    margin-bottom:1rem !important;
  }
  .report-header,
  .report-hero{
    background:var(--gradient-hero) !important;
    color:#fff !important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  .report-hero-bg{display:none !important;}
  .report-grid-2col{
    grid-template-columns:1fr 1fr;
    page-break-inside:avoid;
  }
  svg{
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  a{color:inherit;text-decoration:none;}
  @page{
    margin:.5in;
    size:Letter;
  }
}

/* ============================================
   Cross-sell callout — restrained, consultative
   tone for pointing to adjacent Strategy DMS tools.
   Visual posture: light sky tint, body type,
   inline-text link, no badge / icon / urgency.
   ============================================ */
.cross-sell-callout{
  display:block;
  margin:var(--space-2) 0 0;
  padding:var(--space-2) var(--space-3);
  background:var(--color-sky-100);
  border-left:3px solid var(--color-navy-500);
  border-radius:0 var(--radius-md) var(--radius-md) 0;
}

.cross-sell-lede{
  margin:0 0 .35rem;
  font-size:.95rem;
  font-weight:700;
  color:var(--color-navy-700);
  letter-spacing:-.005em;
}

.cross-sell-body{
  margin:0 0 .55rem;
  font-size:.9rem;
  line-height:1.55;
  color:var(--color-text-strong);
  opacity:.92;
}

.cross-sell-body em{
  font-style:italic;
  color:var(--color-navy-700);
  font-weight:500;
}

.cross-sell-link{
  display:inline-block;
  font-size:.88rem;
  font-weight:600;
  color:var(--color-navy-500);
  text-decoration:none;
  letter-spacing:.005em;
  transition:color .15s ease, transform .15s ease;
}

.cross-sell-link:hover,
.cross-sell-link:focus-visible{
  color:var(--color-navy-700);
  text-decoration:underline;
  text-underline-offset:3px;
}

.cross-sell-link span{
  display:inline-block;
  transition:transform .15s ease;
  margin-left:.15em;
}

.cross-sell-link:hover span,
.cross-sell-link:focus-visible span{
  transform:translateX(2px);
}

/* ============================================================
   Section 11 — Supporting document uploads
   ============================================================ */
.section-optional-tag{
  display:inline-block;
  margin-left:.5rem;
  padding:.2em .7em;
  font-size:.46em;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--color-navy-500);
  background:var(--color-sky-100);
  border:1px solid var(--color-sky-200);
  border-radius:var(--radius-pill);
  vertical-align:middle;
}
.upload-intro{ margin-bottom:var(--space-3); }
.upload-intro p{ margin:0 0 var(--space-2); }
.upload-privacy-line{
  margin:0;
  padding:var(--space-2);
  background:var(--color-surface-alt);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  color:var(--color-text-muted);
  font-size:.95em;
}
.upload-privacy-line strong{ color:var(--color-text-strong); }
.upload-group{ margin-bottom:var(--space-3); }
.upload-group-head{ margin-bottom:var(--space-2); }
.upload-group-title{ margin:0; font-size:1.08rem; color:var(--color-text-strong); }
.upload-group-hint{ margin:.25rem 0 0; color:var(--color-text-muted); font-size:.9em; }
.upload-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:var(--space-2);
}
.upload-slot{
  display:flex;
  flex-direction:column;
  padding:var(--space-2);
  background:var(--color-surface);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.upload-slot.has-files{
  border-color:var(--color-navy-400);
  box-shadow:0 0 0 1px var(--color-navy-400) inset;
}
.upload-slot-label{ font-weight:600; color:var(--color-text-strong); line-height:1.35; }
.upload-slot-hint{
  margin:.3rem 0 .85rem;
  color:var(--color-text-muted);
  font-size:.85em;
  line-height:1.45;
  flex:1 1 auto;
}
.upload-choose{ position:relative; display:inline-flex; align-self:flex-start; }
.upload-choose .upload-input{
  position:absolute; inset:0; width:100%; height:100%;
  opacity:0; cursor:pointer;
}
.upload-choose-cta{
  display:inline-flex; align-items:center; gap:.4em;
  padding:.5em 1.1em;
  font-size:.9em; font-weight:600;
  color:var(--color-navy-500);
  background:var(--color-sky-100);
  border:1px dashed var(--color-navy-400);
  border-radius:var(--radius-sm);
  transition:background .15s ease;
}
.upload-choose:hover .upload-choose-cta{ background:var(--color-sky-200); }
.upload-input:focus-visible + .upload-choose-cta{ box-shadow:var(--shadow-focus); }
.upload-input:disabled + .upload-choose-cta{ opacity:.5; cursor:not-allowed; }
.upload-file-list{
  list-style:none; margin:.8rem 0 0; padding:0;
  display:flex; flex-direction:column; gap:.4rem;
}
.upload-file{
  display:flex; align-items:center; gap:.5rem;
  padding:.4rem .55rem;
  background:var(--color-surface-alt);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-sm);
  font-size:.85em;
}
.upload-file-name{
  flex:1 1 auto; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  color:var(--color-text-strong);
}
.upload-file-size{ flex-shrink:0; color:var(--color-text-muted); font-variant-numeric:tabular-nums; }
.upload-file-remove{
  flex-shrink:0; width:1.5rem; height:1.5rem; line-height:1;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1.15rem; color:var(--color-text-muted);
  background:transparent; border:none; border-radius:var(--radius-sm); cursor:pointer;
  transition:color .15s ease, background .15s ease;
}
.upload-file-remove:hover{ color:var(--color-danger); background:rgba(214,69,69,.1); }
.upload-file-remove:disabled{ opacity:.5; cursor:not-allowed; }
.upload-slot-error{ margin:.55rem 0 0; color:var(--color-danger); font-size:.82em; line-height:1.4; }
.upload-meta-note{ margin-top:var(--space-2); color:var(--color-text-muted); font-size:.85em; }
.upload-status{
  margin-top:var(--space-2);
  padding:var(--space-2);
  border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-md);
  background:var(--color-surface-alt);
  font-size:.92em;
}
.upload-status.is-info{ border-color:var(--color-sky-200); background:var(--color-sky-100); color:var(--color-navy-700); }
.upload-status.is-processing{ border-color:var(--color-navy-400); background:var(--color-sky-100); color:var(--color-navy-700); }
.upload-status.is-done{ border-color:var(--color-success); background:rgba(15,157,122,.09); color:#0b7a5f; }
.upload-status.is-error{ border-color:var(--color-danger); background:rgba(214,69,69,.09); color:#a83232; }
.upload-status.is-processing::before{
  content:""; display:inline-block;
  width:.9em; height:.9em; margin-right:.55em; vertical-align:-.08em;
  border:2px solid var(--color-navy-400); border-top-color:transparent;
  border-radius:50%; animation:upload-spin .7s linear infinite;
}
@keyframes upload-spin{ to{ transform:rotate(360deg); } }