
    :root{
      --navy:#0a192f;
      --navy2:#172a45;
      --blue:#0068b7;
      --aqua:#00a3e0;
      --orange:#ff6b22;
      --yellow:#ffc72c;
      --green:#10b981;
      --red:#dc2626;
      --bg:#f8fafc;
      --surface:#ffffff;
      --surface-soft:#f1f7fb;
      --line:rgba(15,23,42,.09);
      --line-blue:rgba(0,104,183,.18);
      --text:#334155;
      --heading:#0f172a;
      --muted:#64748b;
      --radius-lg:22px;
      --radius:16px;
      --radius-sm:9px;
      --max:1180px;
      --shadow:0 12px 34px rgba(10,25,47,.08);
      --shadow-lg:0 28px 58px -18px rgba(10,25,47,.22);
      --transition:all .25s cubic-bezier(.16,1,.3,1);
    }

    *{box-sizing:border-box;margin:0;padding:0}
    html{scroll-behavior:smooth}

    body{
      font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
      background:
        radial-gradient(circle at 100% 0%,rgba(0,163,224,.08) 0%,transparent 34%),
        radial-gradient(circle at 0% 18%,rgba(255,199,44,.13) 0%,transparent 24%),
        radial-gradient(circle at 0% 100%,rgba(255,107,34,.06) 0%,transparent 38%),
        var(--bg);
      color:var(--text);
      font-size:15px;
      line-height:1.6;
      -webkit-font-smoothing:antialiased;
    }

    a{color:inherit;text-decoration:none;transition:var(--transition)}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}

    .site-header{
      position:sticky;
      top:0;
      z-index:1000;
      background:rgba(255,255,255,.9);
      backdrop-filter:blur(16px);
      -webkit-backdrop-filter:blur(16px);
      border-bottom:1px solid var(--line);
      box-shadow:0 1px 2px rgba(0,0,0,.05);
    }

    .nav-wrap{
      max-width:1240px;
      margin:0 auto;
      padding:14px 24px;
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:24px;
    }

    .brand{
      display:flex;
      align-items:center;
      gap:12px;
      color:var(--navy);
      font-size:20px;
      font-weight:850;
      letter-spacing:-.5px;
      white-space:nowrap;
    }

    .brand-mark{
      padding:6px 12px;
      background:linear-gradient(135deg,var(--navy),var(--navy2));
      color:#fff;
      font-size:13px;
      font-weight:900;
      letter-spacing:1px;
      border-radius:var(--radius-sm);
      box-shadow:0 4px 12px rgba(10,25,47,.15);
    }

    .brand .dotcom{color:var(--orange);font-weight:900}

    .nav-links{
      display:flex;
      flex-wrap:wrap;
      justify-content:flex-end;
      align-items:center;
      gap:5px;
    }

    .nav-links a{
      padding:8px 11px;
      color:var(--heading);
      font-size:14px;
      font-weight:650;
      border-radius:999px;
    }

    .nav-links a:hover,
    .nav-links a[aria-current="page"]{
      background:rgba(15,23,42,.05);
      color:var(--blue);
    }

    .nav-links .group-btn{
      background:linear-gradient(135deg,var(--blue),#005699);
      color:#fff;
      padding:10px 16px;
      font-weight:750;
      box-shadow:0 4px 14px rgba(0,104,183,.25);
    }

    .nav-links .group-btn:hover{
      transform:translateY(-1px);
      background:var(--navy);
      color:#fff;
      box-shadow:0 6px 20px rgba(0,104,183,.35);
    }

    .announcement-strip{
      background:linear-gradient(90deg,var(--navy),#123a68,var(--blue));
      color:#eaf6ff;
      font-size:13px;
      font-weight:760;
    }

    .announcement-inner{
      max-width:var(--max);
      margin:0 auto;
      padding:10px 24px;
      display:flex;
      gap:14px;
      align-items:center;
      justify-content:space-between;
    }

    .announcement-inner strong{
      color:var(--yellow);
      text-transform:uppercase;
      font-size:11px;
      letter-spacing:1.1px;
    }

    .page{
      max-width:var(--max);
      margin:34px auto 0;
      padding:0 24px 48px;
    }

    .report-hero{
      overflow:hidden;
      background:#fff;
      border:1px solid var(--line);
      border-radius:24px;
      box-shadow:var(--shadow-lg);
    }

    .report-hero-head{
      padding:36px 36px 32px;
      color:#fff;
      background:
        radial-gradient(circle at 88% 10%,rgba(255,199,44,.24),transparent 28%),
        linear-gradient(135deg,var(--navy),#123a68 56%,var(--blue));
    }

    .eyebrow{
      color:var(--yellow);
      font-size:11px;
      font-weight:900;
      letter-spacing:2px;
      text-transform:uppercase;
      margin-bottom:10px;
    }

    .report-hero h1{
      color:#fff;
      font-size:clamp(31px,4vw,48px);
      line-height:1.03;
      letter-spacing:-1.2px;
      margin-bottom:14px;
      max-width:900px;
    }

    .report-hero-head p{
      max-width:880px;
      color:#e8f2fb;
      font-size:16px;
      font-weight:620;
      line-height:1.65;
    }

    .hero-benefits{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:1px;
      background:var(--line);
    }

    .hero-benefit{
      padding:20px 22px;
      background:#fff;
    }

    .hero-benefit strong{
      display:block;
      color:var(--navy);
      font-size:15px;
      margin-bottom:3px;
    }

    .hero-benefit span{
      color:var(--muted);
      font-size:13.5px;
      line-height:1.45;
    }

    .privacy-note{
      margin:22px 0;
      padding:16px 18px;
      display:flex;
      gap:12px;
      align-items:flex-start;
      background:#fff;
      border:1px solid rgba(16,185,129,.25);
      border-left:5px solid var(--green);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
    }

    .privacy-icon{
      width:34px;
      height:34px;
      flex:0 0 34px;
      display:grid;
      place-items:center;
      color:#fff;
      background:var(--green);
      border-radius:50%;
      font-weight:900;
    }

    .privacy-note strong{
      display:block;
      color:var(--heading);
      margin-bottom:2px;
    }

    .privacy-note p{font-size:13.5px;color:var(--muted)}

    .report-shell{
      background:#fff;
      border:1px solid var(--line);
      border-radius:var(--radius-lg);
      box-shadow:var(--shadow-lg);
      overflow:hidden;
    }

    .progress-area{
      padding:20px 26px 18px;
      background:linear-gradient(90deg,rgba(0,104,183,.08),rgba(0,163,224,.04),rgba(255,107,34,.05));
      border-bottom:1px solid var(--line);
    }

    .progress-top{
      display:flex;
      justify-content:space-between;
      gap:16px;
      align-items:center;
      margin-bottom:10px;
    }

    .progress-top strong{color:var(--navy);font-size:14px}
    .progress-top span{color:var(--muted);font-size:13px;font-weight:700}

    .progress-track{
      height:10px;
      overflow:hidden;
      background:rgba(0,104,183,.11);
      border-radius:999px;
    }

    .progress-fill{
      width:14.285%;
      height:100%;
      background:linear-gradient(90deg,var(--aqua),var(--blue),var(--orange));
      border-radius:999px;
      transition:width .35s ease;
    }

    .form-step{
      display:none;
      padding:28px 28px 30px;
      animation:fadeIn .25s ease;
    }

    .form-step.active{display:block}

    @keyframes fadeIn{
      from{opacity:.3;transform:translateY(7px)}
      to{opacity:1;transform:none}
    }

    .step-head{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:22px;
      margin-bottom:24px;
    }

    .step-number{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-width:38px;
      height:38px;
      padding:0 12px;
      color:#fff;
      background:var(--navy);
      border-radius:999px;
      font-size:13px;
      font-weight:900;
      letter-spacing:.3px;
      margin-bottom:10px;
    }

    .step-head h2{
      color:var(--navy);
      font-size:27px;
      line-height:1.12;
      letter-spacing:-.5px;
      margin-bottom:6px;
    }

    .step-head p{color:var(--muted);max-width:760px}

    .required-note{
      color:var(--muted);
      font-size:12px;
      font-weight:700;
      white-space:nowrap;
    }

    .question-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:20px;
    }

    .question{
      min-width:0;
      padding:18px;
      background:#fff;
      border:1px solid var(--line);
      border-radius:var(--radius);
    }

    .question.full{grid-column:1 / -1}

    .question legend,
    .question-label{
      display:block;
      color:var(--heading);
      font-size:15px;
      font-weight:820;
      line-height:1.35;
      margin-bottom:5px;
    }

    .question-help{
      display:block;
      color:var(--muted);
      font-size:12.8px;
      line-height:1.45;
      margin-bottom:12px;
    }

    .required-star{color:var(--orange)}

    select,
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    textarea{
      width:100%;
      padding:12px 13px;
      color:var(--heading);
      background:#fff;
      border:1px solid rgba(15,23,42,.16);
      border-radius:10px;
      outline:none;
      transition:var(--transition);
    }

    textarea{min-height:100px;resize:vertical}

    select:focus,
    input:focus,
    textarea:focus{
      border-color:var(--blue);
      box-shadow:0 0 0 4px rgba(0,104,183,.11);
    }

    .choice-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:9px;
    }

    .choice-grid.one{grid-template-columns:1fr}
    .choice-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}

    .choice{
      position:relative;
      display:flex;
      gap:10px;
      align-items:flex-start;
      padding:11px 12px;
      color:var(--text);
      background:var(--surface-soft);
      border:1px solid transparent;
      border-radius:10px;
      font-size:13.5px;
      line-height:1.35;
      cursor:pointer;
      transition:var(--transition);
    }

    .choice:hover{
      background:#fff;
      border-color:var(--line-blue);
      transform:translateY(-1px);
    }

    .choice input{
      width:17px;
      height:17px;
      flex:0 0 17px;
      margin-top:1px;
      accent-color:var(--blue);
    }

    .choice:has(input:checked){
      background:rgba(0,104,183,.08);
      border-color:rgba(0,104,183,.34);
      color:var(--navy);
      font-weight:720;
    }

    .share-control{
      padding:13px 14px;
      background:#fff8e6;
      border:1px solid rgba(255,199,44,.45);
      border-radius:11px;
      margin-top:10px;
    }

    .share-control label{
      display:flex;
      gap:9px;
      align-items:flex-start;
      color:#684a00;
      font-size:13px;
      font-weight:720;
      cursor:pointer;
    }

    .share-control input{margin-top:2px;accent-color:var(--orange)}

    .form-error{
      display:none;
      margin-top:18px;
      padding:12px 14px;
      color:#991b1b;
      background:#fff1f2;
      border:1px solid #fecdd3;
      border-radius:10px;
      font-size:13px;
      font-weight:740;
    }

    .form-error.show{display:block}

    .step-actions{
      display:flex;
      justify-content:space-between;
      gap:12px;
      margin-top:25px;
      padding-top:22px;
      border-top:1px solid var(--line);
    }

    .action-right{display:flex;gap:10px;margin-left:auto}

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      min-height:44px;
      padding:11px 18px;
      border:1px solid rgba(15,23,42,.13);
      border-radius:999px;
      background:#fff;
      color:var(--navy);
      font-weight:800;
      transition:var(--transition);
    }

    .btn:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(10,25,47,.11)}

    .btn.primary{
      color:#fff;
      background:linear-gradient(135deg,var(--orange),#f04f12);
      border-color:transparent;
      box-shadow:0 7px 18px rgba(255,107,34,.24);
    }

    .btn.blue{
      color:#fff;
      background:linear-gradient(135deg,var(--blue),#005699);
      border-color:transparent;
      box-shadow:0 7px 18px rgba(0,104,183,.22);
    }

    .btn.green{
      color:#fff;
      background:linear-gradient(135deg,var(--green),#07895e);
      border-color:transparent;
    }

    .btn.subtle{background:var(--surface-soft)}
    .btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}

    .save-state{
      display:flex;
      align-items:center;
      gap:7px;
      color:var(--muted);
      font-size:12px;
      font-weight:680;
      margin-top:12px;
    }

    .save-dot{width:8px;height:8px;border-radius:50%;background:var(--green)}

    .result-layout{
      display:grid;
      grid-template-columns:360px minmax(0,1fr);
      gap:22px;
      align-items:start;
    }

    .score-card{
      position:sticky;
      top:102px;
      padding:24px;
      color:#fff;
      background:
        radial-gradient(circle at 80% 0%,rgba(255,199,44,.25),transparent 32%),
        linear-gradient(150deg,var(--navy),#123a68 65%,var(--blue));
      border-radius:20px;
      box-shadow:var(--shadow-lg);
    }

    .score-card .source-label{
      color:var(--yellow);
      font-size:10px;
      font-weight:900;
      letter-spacing:1.5px;
      text-transform:uppercase;
    }

    .score-number{
      display:flex;
      align-items:flex-end;
      gap:5px;
      margin:18px 0 4px;
    }

    .score-number strong{
      font-size:76px;
      line-height:.88;
      letter-spacing:-4px;
    }

    .score-number span{font-size:20px;font-weight:800;color:#bfe9ff;padding-bottom:8px}

    .score-level{
      font-size:22px;
      line-height:1.12;
      font-weight:900;
      margin-bottom:9px;
    }

    .score-card p{color:#ddecf7;font-size:13.5px}

    .category-scores{
      margin-top:22px;
      padding-top:18px;
      border-top:1px solid rgba(255,255,255,.16);
      display:grid;
      gap:11px;
    }

    .category-line{
      display:grid;
      grid-template-columns:1fr auto;
      gap:8px;
      font-size:12px;
      font-weight:760;
    }

    .category-line span:last-child{color:var(--yellow)}

    .mini-track{
      grid-column:1 / -1;
      height:5px;
      background:rgba(255,255,255,.15);
      border-radius:999px;
      overflow:hidden;
    }

    .mini-fill{height:100%;background:#fff;border-radius:999px}

    .result-stack{display:grid;gap:18px}

    .result-card{
      padding:21px;
      background:#fff;
      border:1px solid var(--line);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
    }

    .result-card h3{
      color:var(--navy);
      font-size:19px;
      line-height:1.2;
      margin-bottom:7px;
    }

    .result-card > p{color:var(--muted);font-size:13.5px;margin-bottom:15px}

    .snapshot-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:10px;
    }

    .snapshot-item{
      padding:12px;
      background:var(--surface-soft);
      border-radius:10px;
    }

    .snapshot-item span{
      display:block;
      color:var(--muted);
      font-size:10px;
      font-weight:850;
      letter-spacing:.8px;
      text-transform:uppercase;
      margin-bottom:3px;
    }

    .snapshot-item strong{color:var(--heading);font-size:13.5px;line-height:1.35}

    .recommendation-list,
    .strength-list,
    .tips-list,
    .pitfall-list{
      display:grid;
      gap:9px;
      list-style:none;
    }

    .recommendation-list li,
    .strength-list li,
    .tips-list li,
    .pitfall-list li{
      position:relative;
      padding:11px 12px 11px 38px;
      background:var(--surface-soft);
      border-radius:10px;
      font-size:13.5px;
      line-height:1.45;
    }

    .recommendation-list li:before,
    .strength-list li:before,
    .tips-list li:before,
    .pitfall-list li:before{
      position:absolute;
      left:12px;
      top:11px;
      width:18px;
      height:18px;
      display:grid;
      place-items:center;
      color:#fff;
      border-radius:50%;
      font-size:11px;
      font-weight:900;
    }

    .recommendation-list li:before{content:"→";background:var(--orange)}
    .strength-list li:before{content:"✓";background:var(--green)}
    .tips-list li:before{content:"i";background:var(--blue)}
    .pitfall-list li:before{content:"!";background:#b91c1c}

    .share-preview{
      width:100%;
      min-height:250px;
      padding:15px;
      color:var(--heading);
      background:#f8fafc;
      border:1px solid rgba(15,23,42,.13);
      border-radius:11px;
      white-space:pre-wrap;
      font-family:inherit;
      line-height:1.5;
      resize:vertical;
    }

    .share-actions{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:12px;
    }

    .email-row{
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:10px;
      align-items:end;
      margin-top:14px;
    }

    .email-row label{font-size:12px;font-weight:800;color:var(--heading)}

    .copy-status{
      min-height:22px;
      margin-top:8px;
      color:var(--green);
      font-size:12px;
      font-weight:800;
    }

    .report-disclaimer{
      margin-top:20px;
      padding:14px 16px;
      color:var(--muted);
      background:#f8fafc;
      border:1px solid var(--line);
      border-radius:12px;
      font-size:12px;
      line-height:1.55;
    }

    footer{
      margin-top:42px;
      background:var(--navy);
      color:#dbe7f2;
    }

    .footer-inner{
      max-width:1240px;
      margin:0 auto;
      padding:24px;
      display:flex;
      justify-content:space-between;
      gap:24px;
      align-items:center;
      font-size:13px;
    }

    .footer-links{display:flex;gap:16px;align-items:center}
    .footer-links a:hover{color:var(--yellow)}

    @media (max-width:980px){
      .nav-wrap{align-items:flex-start;flex-direction:column}
      .nav-links{justify-content:flex-start}
      .hero-benefits{grid-template-columns:1fr}
      .result-layout{grid-template-columns:1fr}
      .score-card{position:relative;top:auto}
      .choice-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}
    }

    @media (max-width:720px){
      .page{padding:0 14px 36px;margin-top:20px}
      .nav-wrap{padding:12px 14px}
      .nav-links{gap:3px}
      .nav-links a{padding:7px 9px;font-size:12.5px}
      .announcement-inner{padding:9px 14px;align-items:flex-start;flex-direction:column;gap:2px}
      .report-hero-head{padding:28px 22px 25px}
      .hero-benefit{padding:16px 18px}
      .progress-area{padding:17px 18px}
      .form-step{padding:22px 17px 24px}
      .step-head{flex-direction:column;gap:7px}
      .question-grid{grid-template-columns:1fr}
      .question.full{grid-column:auto}
      .choice-grid,
      .choice-grid.three{grid-template-columns:1fr}
      .snapshot-grid{grid-template-columns:1fr}
      .step-actions{flex-direction:column-reverse}
      .action-right{width:100%;margin-left:0}
      .step-actions .btn,.action-right .btn{flex:1}
      .email-row{grid-template-columns:1fr}
      .footer-inner{flex-direction:column;align-items:flex-start}
      .footer-links{flex-wrap:wrap}
    }

    @media print{
      .site-header,.announcement-strip,.privacy-note,.progress-area,.step-actions,.share-actions,.email-row,.copy-status,footer{display:none!important}
      body{background:#fff}
      .page{max-width:none;margin:0;padding:0}
      .report-hero{box-shadow:none;border:0;margin-bottom:18px}
      .report-hero-head{padding:20px;background:#fff;color:#000;border-bottom:2px solid #000}
      .report-hero h1,.report-hero-head p,.eyebrow{color:#000}
      .hero-benefits{display:none}
      .report-shell{box-shadow:none;border:0}
      .form-step{display:none!important;padding:0}
      .form-step[data-step="7"]{display:block!important}
      .result-layout{grid-template-columns:1fr}
      .score-card{position:relative;top:auto;color:#000;background:#fff;border:1px solid #000;box-shadow:none}
      .score-card p,.score-number span,.score-card .source-label,.category-line span:last-child{color:#000}
      .mini-track{border:1px solid #000;background:#fff}.mini-fill{background:#000}
      .result-card{box-shadow:none;break-inside:avoid}
      .result-card.share-only{display:none}
    }
  
.optional-contact-panel{margin-top:14px;padding:16px;border:1px solid var(--line);border-radius:12px;background:#f8fbff}.optional-contact-panel p{margin:5px 0 12px;font-size:13px;color:var(--muted)}.result-contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.result-contact-grid label{display:grid;gap:5px;font-size:12px;font-weight:800;color:var(--navy)}@media(max-width:680px){.result-contact-grid{grid-template-columns:1fr}}
