/* ============================================================
   AI VISIBILITY AUDIT — styles. Theme-aware (uses kit's --neon
   etc.); falls back gracefully if loaded standalone.
   ============================================================ */
.va-wrap{ --va-neon:var(--neon,#22e0c8); --va-violet:var(--violet,#8b6cff); --va-line:var(--line,#262640);
  --va-card:var(--card,#16162a); --va-ink:var(--ink,#eef0ff); --va-mut:var(--mut,#a6a9c8);
  max-width:560px; margin:0 auto; }
.va-card{ background:var(--va-card); border:1px solid var(--va-line); border-radius:18px; padding:26px;
  box-shadow:0 30px 70px -40px #000; animation:va-rise .35s cubic-bezier(.2,.7,.2,1) both; }
@keyframes va-rise{ from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none} }
.va-kick{ display:inline-block; font-size:11px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase;
  color:var(--va-neon); margin-bottom:8px; }
.va-card h3{ margin:4px 0 10px; font-size:23px; line-height:1.2; }
.va-card>p{ color:var(--va-mut); margin:0 0 16px; }
.va-fine{ font-size:12px; color:var(--va-mut); opacity:.85; margin-top:12px !important; }
.va-intro .btn{ width:100%; text-align:center; }

.va-prog{ height:5px; background:var(--va-line); border-radius:999px; overflow:hidden; margin-bottom:16px; }
.va-prog span{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--va-neon),var(--va-violet));
  transition:width .4s cubic-bezier(.2,.7,.2,1); }

.va-label{ display:block; font-size:12px; font-weight:700; color:var(--va-mut); margin:14px 0 7px; }
.va-input{ width:100%; background:#0c0c18; color:var(--va-ink); border:1px solid var(--va-line); border-radius:10px;
  padding:12px 14px; font-size:15px; font-family:inherit; }
.va-input:focus{ outline:none; border-color:color-mix(in srgb,var(--va-neon) 55%,var(--va-line)); box-shadow:0 0 0 3px color-mix(in srgb,var(--va-neon) 14%,transparent); }
.va-opts{ display:flex; gap:8px; flex-wrap:wrap; }
.va-opts.va-col{ flex-direction:column; }
.va-opt{ cursor:pointer; font:inherit; font-weight:700; font-size:14.5px; color:var(--va-ink); text-align:left;
  background:#0c0c18; border:1px solid var(--va-line); border-radius:12px; padding:13px 16px; transition:all .18s; }
.va-opts.va-col .va-opt{ width:100%; }
.va-trades .va-opt, .va-jobs .va-opt{ flex:1; min-width:120px; text-align:center; }
.va-opt:hover{ border-color:color-mix(in srgb,var(--va-neon) 45%,var(--va-line)); transform:translateY(-1px); }
.va-opt.on{ color:#05050a; background:linear-gradient(120deg,var(--va-neon),var(--va-violet)); border-color:transparent; }
.va-q .btn, .va-card>.btn{ width:100%; text-align:center; margin-top:16px; }
.va-back{ display:inline-block; margin-top:14px; background:none; border:none; color:var(--va-mut); cursor:pointer; font:inherit; font-weight:600; }
.va-back:hover{ color:var(--va-neon); }

/* scan */
.va-scan{ text-align:center; }
.va-scan-ring{ position:relative; width:96px; height:96px; margin:6px auto 14px; }
.va-scan-ring svg{ width:100%; height:100%; transform:rotate(-90deg); }
.va-scan-ring circle{ fill:none; stroke-width:5; }
.va-scan-ring circle:first-child{ stroke:var(--va-line); }
.va-scan-arc{ stroke:var(--va-neon); stroke-linecap:round; stroke-dasharray:60 214; animation:va-spin 1.1s linear infinite; transform-origin:center; }
@keyframes va-spin{ to{ transform:rotate(360deg) } }
.va-scan-ring span{ position:absolute; inset:0; display:grid; place-items:center; font-size:30px; }
.va-scan-list{ list-style:none; padding:0; margin:14px 0 0; text-align:left; }
.va-scan-list li{ color:var(--va-mut); padding:8px 0 8px 28px; position:relative; opacity:.45; transition:opacity .3s, color .3s; }
.va-scan-list li::before{ content:"○"; position:absolute; left:4px; color:var(--va-mut); }
.va-scan-list li.done{ opacity:1; color:var(--va-ink); }
.va-scan-list li.done::before{ content:"✓"; color:var(--va-neon); font-weight:800; }

/* result */
.va-score-head{ display:flex; gap:20px; align-items:center; flex-wrap:wrap; }
.va-gauge{ position:relative; width:128px; height:128px; flex:0 0 auto; }
.va-gauge svg{ width:100%; height:100%; transform:rotate(-90deg); }
.va-gauge circle{ fill:none; stroke-width:10; }
.va-gauge .g-bg{ stroke:var(--va-line); }
.va-gauge .g-fg{ stroke:url(#va-grad); stroke:var(--va-neon); stroke-linecap:round; stroke-dasharray:327; stroke-dashoffset:327; transition:stroke-dashoffset 1.1s cubic-bezier(.2,.7,.2,1); }
.va-score-num{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.va-score-num b{ font-size:36px; font-variant-numeric:tabular-nums; line-height:1; }
.va-score-num span{ font-size:12px; color:var(--va-mut); }
.va-score-meta{ flex:1; min-width:180px; }
.va-band{ margin:2px 0 4px; font-size:24px; }
.va-band-invisible{ color:#ff5e7e; } .va-band-emerging{ color:#ffb14d; }
.va-band-competitive{ color:var(--va-neon); } .va-band-dominant{ color:var(--win); }
.va-score-meta p{ color:var(--va-mut); margin:0 0 6px; font-size:14px; }
.va-src{ font-size:11px; font-weight:700; color:var(--va-mut); border:1px solid var(--va-line); border-radius:6px; padding:2px 8px; }

.va-pillars{ margin:22px 0; display:flex; flex-direction:column; gap:11px; }
.va-pillar{ display:flex; align-items:center; gap:12px; }
.va-pname{ flex:0 0 108px; font-size:13px; font-weight:700; }
.va-bar{ flex:1; height:9px; background:var(--va-line); border-radius:999px; overflow:hidden; }
.va-bar i{ display:block; height:100%; width:0; border-radius:999px; background:linear-gradient(90deg,var(--va-neon),var(--va-violet)); transition:width 1s cubic-bezier(.2,.7,.2,1); }
.va-pval{ flex:0 0 30px; text-align:right; font-size:13px; font-weight:800; font-variant-numeric:tabular-nums; }

.va-aibox{ background:color-mix(in srgb,var(--va-neon) 8%,#0c0c18); border:1px solid color-mix(in srgb,var(--va-neon) 24%,var(--va-line)); border-radius:12px; padding:14px 16px; margin:8px 0 16px; }
.va-aibox p{ margin:6px 0 0; color:var(--va-ink); }
.va-fixes ul{ list-style:none; padding:0; margin:8px 0 16px; }
.va-fixes li{ padding:9px 0; border-bottom:1px solid var(--va-line); color:var(--va-mut); font-size:14.5px; }
.va-fixes li:last-child{ border-bottom:none; }
.va-fixes li b{ color:var(--va-neon); }
.va-delta{ display:inline-block; font-size:11px; font-weight:800; color:#05050a; background:var(--va-neon); border-radius:6px; padding:1px 7px; margin-left:4px; }
.va-econ{ background:var(--va-card); border:1px dashed color-mix(in srgb,var(--va-neon) 35%,var(--va-line)); border-radius:12px; padding:14px 16px; color:var(--va-mut); margin-bottom:18px; }
.va-econ b{ color:var(--va-ink); font-size:18px; }
.va-econ .va-fine{ display:block; margin-top:4px !important; }

.va-capture{ border-top:1px solid var(--va-line); padding-top:18px; }
.va-capture>p{ margin:6px 0 12px; color:var(--va-mut); }
.va-capture-row{ display:flex; gap:8px; flex-wrap:wrap; }
.va-capture-row .va-input{ flex:1; min-width:180px; }
.va-capture-row .btn{ white-space:nowrap; }
.va-confirm{ background:color-mix(in srgb,var(--va-neon) 12%,transparent); border:1px solid color-mix(in srgb,var(--va-neon) 30%,var(--va-line)); border-radius:10px; padding:12px 14px; color:var(--va-ink); }
.va-restart{ display:block; margin:14px auto 0; background:none; border:none; color:var(--va-mut); cursor:pointer; font:inherit; font-weight:600; }
.va-restart:hover{ color:var(--va-neon); }
@media(max-width:520px){ .va-score-head{ justify-content:center; text-align:center } .va-score-meta{ text-align:center } }
