@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500;700&display=swap');
  :root{
    --bg:#14171A; --panel:#1D2125; --line:#31373D; --text:#EDEEEC; --text-dim:#8C949B;
    --accent:#3D5AFE; --warn:#F5A623; --good:#4CD08A;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  body{ background:var(--bg); color:var(--text); font-family:'Inter', sans-serif; min-height:100vh; -webkit-font-smoothing:antialiased; }
  .wrap{ max-width:640px; margin:0 auto; padding:32px 20px 80px; }
  .brand{ display:flex; align-items:center; gap:10px; margin-bottom:36px; }
  .brand .dot{ width:10px; height:10px; border-radius:50%; background:var(--accent); box-shadow:0 0 12px var(--accent); }
  .brand span{ font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.12em; color:var(--text-dim); text-transform:uppercase; }
  h1{ font-family:'Space Grotesk', sans-serif; font-size:clamp(28px, 6vw, 38px); font-weight:700; line-height:1.1; letter-spacing:-0.01em; margin-bottom:10px; }
  .lede{ color:var(--text-dim); font-size:15px; line-height:1.55; margin-bottom:32px; max-width:46ch; }
  .progress-track{ height:2px; background:var(--line); border-radius:2px; margin-bottom:36px; overflow:hidden; }
  .progress-fill{ height:100%; background:linear-gradient(90deg, var(--accent), #7C9BFF); width:0%; transition:width .4s cubic-bezier(.4,0,.2,1); }
  .step{ display:none; } .step.active{ display:block; animation:fadeUp .35s ease; }
  @keyframes fadeUp{ from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);} }
  .q-label{ font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); margin-bottom:8px; }
  .q-title{ font-family:'Space Grotesk', sans-serif; font-size:21px; font-weight:600; margin-bottom:18px; line-height:1.3; }
  .q-sub{ font-size:13px; color:var(--text-dim); margin:18px 0 10px; font-weight:600; }
  input[type=text], input[type=email], input[type=number], select{
    width:100%; background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:14px 16px;
    color:var(--text); font-size:16px; font-family:'Inter', sans-serif; outline:none; transition:border-color .2s; appearance:none;
  }
  select{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='%238C949B' d='M0 0l6 8 6-8z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 16px center; padding-right:36px; }
  input:focus, select:focus{ border-color:var(--accent); }
  input::placeholder{ color:#565D64; }
  .hint{ font-size:12px; color:var(--text-dim); margin-top:8px; line-height:1.5; }
  .choices{ display:grid; gap:10px; }
  .choice{ display:flex; align-items:center; justify-content:space-between; background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:14px 16px; cursor:pointer; font-size:15px; transition:border-color .15s, background .15s; }
  .choice:hover{ border-color:#4A525A; }
  .choice.selected{ border-color:var(--accent); background:rgba(61,90,254,0.1); }
  .choice .mark{ width:16px; height:16px; border-radius:50%; border:1.5px solid var(--line); flex-shrink:0; }
  .choice.selected .mark{ border-color:var(--accent); background:var(--accent); box-shadow:inset 0 0 0 3px var(--panel); }
  .grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .grid-3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; }
  .field{ margin-bottom:16px; }
  .field label{ display:block; font-size:13px; color:var(--text-dim); margin-bottom:6px; }
  .subgroup{ margin-top:14px; padding-top:14px; border-top:1px dashed var(--line); display:none; }
  .subgroup.visible{ display:block; }
  .nav{ display:flex; justify-content:space-between; align-items:center; margin-top:28px; gap:12px; }
  button{ font-family:'Inter', sans-serif; font-weight:600; font-size:15px; border:none; border-radius:8px; padding:14px 24px; cursor:pointer; transition:transform .1s, opacity .15s; }
  button:active{ transform:scale(0.98); }
  .btn-primary{ background:var(--accent); color:#fff; flex:1; }
  .btn-ghost{ background:transparent; color:var(--text-dim); border:1px solid var(--line); }
  .btn-ghost:hover{ color:var(--text); border-color:#4A525A; }
  .loading{ display:none; text-align:center; padding:60px 0; } .loading.active{ display:block; }
  .scan{ width:56px; height:56px; margin:0 auto 24px; border-radius:50%; border:2px solid var(--line); border-top-color:var(--accent); animation:spin 0.9s linear infinite; }
  @keyframes spin{ to{ transform:rotate(360deg); } }
  .loading p{ font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.08em; color:var(--text-dim); text-transform:uppercase; }
  .report{ display:none; } .report.active{ display:block; animation:fadeUp .4s ease; }
  .report-head{ margin-bottom:28px; } .report-head .q-label{ margin-bottom:6px; }
  .metrics{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:20px; }
  .metric{ background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:16px; }
  .metric.wide{ grid-column:1 / -1; }
  .hero-metric{
    grid-column:1 / -1; background:linear-gradient(135deg, rgba(61,90,254,0.16), rgba(61,90,254,0.04));
    border:1px solid var(--accent); border-radius:12px; padding:22px; margin-bottom:4px;
  }
  .hero-metric .m-label{ font-size:12px; letter-spacing:0.06em; }
  .hero-metric .m-value{ font-size:40px; }
  .hero-metric .m-sub{ font-size:12px; margin-top:8px; }
  .ref-section{
    grid-column:1 / -1; margin-top:6px; padding-top:14px; border-top:1px dashed var(--line);
  }
  .ref-metric{ opacity:0.6; }
  .ref-metric .m-label{ font-size:10px; }
  .ref-metric .m-value{ font-size:16px; color:var(--text-dim); }
  .ref-metric .m-sub{ font-size:10.5px; line-height:1.5; }
  .metric .m-label{ font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-dim); margin-bottom:6px; }
  .metric .m-value{ font-family:'JetBrains Mono', monospace; font-size:22px; font-weight:700; color:var(--accent); }
  .metric .m-unit{ font-size:12px; color:var(--text-dim); font-weight:400; }
  .metric .m-sub{ font-size:11px; color:var(--text-dim); margin-top:4px; }
  .compare-box{ background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:16px; margin-bottom:20px; font-size:13px; color:var(--text-dim); line-height:1.6; }
  .compare-box strong{ color:var(--text); }
  .report-body{ background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:22px; font-size:15px; line-height:1.7; }
  .report-body .prose{ white-space:pre-wrap; }
  .banner{ border-radius:8px; padding:14px 16px; font-size:14px; line-height:1.5; }
  .banner.good{ background:rgba(76,208,138,0.12); border:1px solid var(--good); }
  .banner.warn{ background:rgba(245,166,35,0.1); border:1px solid var(--warn); color:var(--warn); }
  .banner + .prose{ margin-top:16px; }
  .banner .btn-primary{ flex:none; margin-top:12px; }
  a.btn-primary, a.btn-ghost{ display:inline-block; text-decoration:none; text-align:center; }
  .report-body h3{ font-family:'Space Grotesk', sans-serif; font-size:16px; color:var(--accent); margin:18px 0 6px; }
  .report-body h3:first-child{ margin-top:0; }
  .report-actions{ display:flex; gap:10px; margin-top:20px; flex-wrap:wrap; }
  .error{ display:none; background:rgba(245,166,35,0.1); border:1px solid var(--warn); color:var(--warn); border-radius:8px; padding:14px 16px; font-size:14px; margin-top:16px; } .error.active{ display:block; }
  @media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }