.vas{--ink:#15131c;--body:#33303d;--muted:#6b6678;--dim:#8c8798;--faint:#b5b1be;--border:#e6e3ec;--soft:#efedf3;--paper:#FAFAFD;--purple:#5b3fb8;--purple-deep:#4a3299;--purple-soft:#efeaf7;--purple-line:#ddd3f0;--pos:#0f6a3f;--pos-soft:#e7f5ed;--pos-line:#bfe0cd;--neg:#a51e2c;--neg-soft:#fbeaec;--neg-line:#eec6cb;--amber:#b06410;--amber-soft:#fcf3e2;--amber-line:#ebd6ae;--shadow:0 1px 2px rgba(21,19,28,.04),0 2px 8px -4px rgba(21,19,28,.06);font-synthesis-weight:none}
.vas{font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:14px;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
.vas a{color:var(--purple);text-decoration:none}
.vas a:hover{color:var(--purple-deep)}
.vas button{font-family:inherit;cursor:pointer}
.vas *{box-sizing:border-box}
.vas .mono{font-family:'JetBrains Mono',ui-monospace,monospace}
.vas .wrap{max-width:1200px;margin:0 auto;padding:0 40px}
/* ---------- shared bits ---------- */
.vas .eyebrow{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--purple)}
.vas .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;font-size:14px;font-weight:600;padding:11px 20px;border:1px solid transparent;transition:.15s}
.vas .btn.ink{background:var(--ink);color:#fff}
.vas .btn.ink:hover{background:#2a2636}
.vas .btn.ink:disabled{background:#dedbe6;color:#a29daf;cursor:default}
.vas .btn.ghost{background:#fff;border-color:var(--border);color:var(--ink)}
.vas .btn.ghost:hover{border-color:var(--purple-line);color:var(--purple)}
.vas .tag{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 9px;font-size:11.5px;font-weight:600;white-space:nowrap}
.vas .tag.good{background:var(--pos-soft);color:var(--pos)}
.vas .tag.warn{background:var(--amber-soft);color:var(--amber)}
.vas .tag.bad{background:var(--neg-soft);color:var(--neg)}
.vas .tag.plain{background:var(--soft);color:var(--muted)}
.vas .tag.purple{background:var(--purple-soft);color:var(--purple-deep)}
.vas .fav{flex:none;display:grid;place-items:center;overflow:hidden;font-weight:700;letter-spacing:-.3px}
.vas .fav.ini{background:var(--purple);color:#fff}
.vas .fav.px{background:#fff;box-shadow:inset 0 0 0 1px var(--border)}
.vas .fav img{width:66%;height:66%;object-fit:contain;display:block}
.vas .mono-sm{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:var(--dim)}
/* ---------- picker ---------- */
.vas .phead{padding:74px 0 0;max-width:720px;margin:0 auto;text-align:center}
.vas .phead h1{margin:14px 0 0;font-size:46px;font-weight:700;letter-spacing:-1.7px;line-height:1.04}
.vas .phead p{margin:16px auto 0;max-width:590px;font-size:16.5px;line-height:1.6;color:var(--muted);text-wrap:pretty}
/* One column, read top to bottom: your company, then the vendor. .slot.wait is
   the vendor card before a company is named - out of focus, out of reach of
   both the mouse and the keyboard, and still named as what comes next rather
   than hidden, so the reader can see where they are going. */
.vas .picker{display:grid;grid-template-columns:1fr;gap:14px;margin:40px auto 0;max-width:560px}
.vas .slot{background:#fff;border:1px solid rgba(21,19,28,.08);border-radius:20px;padding:18px 20px 16px;text-align:left;display:flex;flex-direction:column;gap:12px;position:relative;transition:filter .25s,opacity .25s}
.vas .slot.act{border-color:var(--purple-line);box-shadow:0 0 0 3px rgba(91,63,184,.07)}
.vas .slot.wait{filter:blur(1.5px);opacity:.55;pointer-events:none;-webkit-user-select:none;user-select:none}
.vas .slab{display:flex;align-items:center;justify-content:space-between;gap:10px}
.vas .slab span{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
.vas .pickbtn{display:flex;align-items:center;gap:11px;width:100%;background:#fff;border:1px dashed var(--border);border-radius:12px;padding:12px 14px;text-align:left;transition:.15s}
.vas .pickbtn:hover{border-color:var(--purple-line);background:#fdfcff}
.vas .pickbtn.filled{border-style:solid;border-color:var(--border)}
.vas .pickbtn b{font-size:15px;font-weight:600;letter-spacing:-.2px;color:var(--ink)}
.vas .pickbtn em{font-style:normal;font-size:15px;color:var(--faint);font-weight:500}
.vas .pickbtn .cnt{margin-left:auto;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:var(--dim);white-space:nowrap}
.vas .mono-note{font-size:12.5px;color:var(--muted);line-height:1.5}
/* dropdown — anchored to the pick control, not to the card. .pickwrap is the
   button's own box, so 100%/0/0 below resolve to the input's bottom edge and
   its exact width; hung off .slot instead, the popover opened below the hint
   line and the card's padding, a gap that grew with whatever the other side's
   note made the row stretch to. */
.vas .pickwrap{position:relative}
.vas .dd{position:absolute;z-index:40;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 24px 48px -20px rgba(21,19,28,.32);overflow:hidden}
/* The search field is indented past the favicon column and carries the same
   search glyph the closed control shows, so its text sits on the very column
   the domains below it start on. */
.vas .dd input{width:100%;border:none;border-bottom:1px solid var(--soft);outline:none;padding:13px 15px 13px 45px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:13px;color:var(--ink);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b5b1be' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 17px center}
.vas .ddlist{max-height:236px;overflow:auto}
.vas .ddi{display:flex;align-items:center;gap:10px;width:100%;background:none;border:none;padding:9px 15px;text-align:left}
.vas .ddi:hover,.vas .ddi.hi{background:var(--purple-soft)}
/* min-width:0 is what lets a long domain ellipsize instead of widening the
   row — a flex item defaults to min-width:auto and refuses to shrink below
   its text. The right-hand column is keyed by class, never by element: the
   old `.ddi span` rule set margin-left:auto on EVERY span in the row, and
   fav() renders the favicon tile as a span, so the favicon carried an auto
   margin too and the free space split evenly between the two — which is why
   each row's domain started at a different x. */
.vas .ddi b{min-width:0;font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Side A's "what we know of this domain" hint, on the typed-domain row only.
   Same right-aligned mono note as `.pickbtn .cnt`; flex:0 0 auto keeps it
   whole and lets the domain above ellipsize into what is left. */
.vas .ddi .cnt{flex:0 0 auto;margin-left:auto;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:var(--dim);white-space:nowrap}
.vas .ddempty{padding:16px 15px;font-size:13px;color:var(--muted)}
/* run row */
.vas .runrow{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:26px}
/* ---------- running ---------- */
.vas .runwrap{max-width:720px;margin:0 auto;padding:86px 0 90px}
.vas .step{display:flex;align-items:center;gap:13px;font-size:15.5px;padding:9px 0;transition:.3s}
.vas .step .ic{width:24px;height:24px;border-radius:99px;display:grid;place-items:center;flex:none}
.vas .step.done{color:var(--muted)}.vas .step.done .ic{background:var(--pos-soft);color:var(--pos)}
.vas .step.now{color:var(--ink);font-weight:600}.vas .step.now .ic{background:var(--purple-soft);color:var(--purple)}
.vas .step.next{color:var(--faint)}.vas .step.next .ic{background:var(--soft);color:var(--faint)}
/* The search feed under a step row: one line per document kind while that
   side's documents are being found, the newest pulsing and the ones above it
   settled with a check. Indented to the same 37px the coverage line used - the
   24px icon plus the row's 13px gap - so the favicons stand in one column
   under the row's own text. */
.vas .sfd{display:flex;flex-direction:column;gap:6px;margin:2px 0 9px 37px}
.vas .sfd:empty{display:none}
.vas .sfl{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px;line-height:1.5;color:var(--body);animation:vaFeed .22s ease-out}
.vas .sfl.done{color:var(--muted)}
/* No favicon on the "and more" line: the indent alone (16px tile + the line's
   own 8px gap) keeps its text on the column the lines above it start on. */
.vas .sfl.more{padding-left:24px;color:var(--faint)}
.vas .sft{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.vas .sfc{display:inline-flex;flex:none;color:var(--pos)}
@keyframes vaFeed{from{opacity:0;transform:translateY(2px)}}
.vas .spin{display:inline-flex;animation:vaSpin 1s linear infinite}
@keyframes vaSpin{to{transform:rotate(360deg)}}
.vas .sk{border-radius:8px;background:linear-gradient(90deg,#eceaf1 25%,#f5f4f8 50%,#eceaf1 75%);background-size:200% 100%;animation:vaShim 1.3s infinite}
@keyframes vaShim{0%{background-position:200% 0}100%{background-position:-200% 0}}
.vas .progline{height:3px;border-radius:99px;background:var(--soft);overflow:hidden;margin:30px 0 4px}
.vas .progline i{display:block;height:100%;background:var(--purple);transition:width .6s cubic-bezier(.4,0,.2,1)}
/* floating section rail — two states only: full labels (default) or gone (mobile).
   The icons-with-tooltip middle state is deliberately retired. */
.vas .srail{position:fixed;top:0;left:max(16px,calc(50% - 786px));width:152px;z-index:40;opacity:0;pointer-events:none;transition:opacity .22s ease}
.vas .srail.live{opacity:1;pointer-events:auto}
.vas .srail a{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;padding:13px 12px;font-size:12.5px;font-weight:500;line-height:1.3;letter-spacing:-.01em;text-align:center;color:var(--muted);transition:color .15s,background .15s}
.vas .srail a+a::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:var(--soft)}
.vas .srail a:hover{background:#faf9fc;color:var(--body)}
.vas .srail a>svg{flex:none;color:var(--faint);transition:color .15s,transform .18s ease}
.vas .srail a:hover>svg{color:var(--dim);transform:translateY(-1px)}
.vas .srail a.on{color:var(--purple-deep);font-weight:600}
.vas .srail a.on>svg{color:var(--purple)}
.vas .srail a.on:hover{background:#faf8fd}
/* the section's status dot: a ring in the dominant severity of its items,
   filled with a check once its rail entry has been clicked */
.vas .srail a .dot{position:absolute;top:9px;right:10px;width:11px;height:11px;border-radius:99px;border:1.5px solid var(--faint);color:#fff;display:grid;place-items:center;transition:background .18s,border-color .18s}
.vas .srail a .dot svg{opacity:0;transition:opacity .18s}
.vas .srail a .dot.good{border-color:var(--pos)}
.vas .srail a .dot.warn{border-color:var(--amber)}
.vas .srail a .dot.bad{border-color:var(--neg)}
.vas .srail a.seen .dot{background:var(--dim);border-color:var(--dim)}
.vas .srail a.seen .dot.good{background:var(--pos);border-color:var(--pos)}
.vas .srail a.seen .dot.warn{background:var(--amber);border-color:var(--amber)}
.vas .srail a.seen .dot.bad{background:var(--neg);border-color:var(--neg)}
.vas .srail a.seen .dot svg{opacity:1}
/* the labelled rail keeps its titles on smaller screens: once the side gutter
   is too narrow for it the report column cedes exactly the missing room, so
   the text edge rides 22px off the rail with no jump at any width. 190px =
   the rail's clamped right edge (16 + 152) + that gap; the calc subtracts the
   gutter the wrap's own centering already provides, and wide viewports fall
   back to the wrap's base 40px */
.vas .wrap:has(>.srail){padding-left:clamp(40px,calc(190px - (100vw - 1200px)/2),190px)}
@media(max-width:1180px){.vas .srail{display:none}.vas .wrap:has(>.srail){padding-left:40px}}
/* ---------- report ---------- */
.vas .rtop{padding:38px 0 0}
.vas .pairline{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.vas .readline{margin:12px 0 0;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.02em;color:var(--dim)}
.vas .pv{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--border);border-radius:999px;padding:6px 14px 6px 8px}
.vas .pv b{font-size:14px;font-weight:600;letter-spacing:-.2px}
.vas .ractions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
/* report masthead banner — who was assessed (left), who for (right).
   No shell of its own: it sits straight on the page at the container's full
   width, and the rounded panels start with the verdict below it. */
.vas .rbanner{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:16px 0 0}
.vas .rbend{display:flex;flex-direction:column;gap:11px;min-width:0}
.vas .rbend.to{align-items:flex-end;text-align:right}
.vas .rblabel{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--dim)}
.vas .rbid{display:flex;align-items:center;gap:14px;min-width:0}
.vas .rbname{margin:0;font-size:30px;font-weight:700;letter-spacing:-1px;line-height:1.1;color:var(--ink);overflow-wrap:anywhere}
.vas .rtop .subline{margin-top:18px}
@media(max-width:1080px){
.vas .rbanner{flex-direction:column;align-items:flex-start;gap:24px;padding:12px 0 0}
.vas .rbend.to{align-items:flex-start;text-align:left}
.vas .rbname{font-size:26px;letter-spacing:-.8px}
}
/* verdict band */
.vas .hero{margin-top:30px;border-radius:22px;padding:34px 36px 0;background:#0f4a34;color:#fff;box-shadow:0 22px 48px -34px rgba(15,74,52,.9);overflow:hidden;position:relative}
.vas .herogrid{display:grid;grid-template-columns:1fr 330px;gap:44px;align-items:center;padding-bottom:34px}
.vas .hero.warn{background:#7a4409;box-shadow:0 22px 48px -34px rgba(122,68,9,.9)}
.vas .hero.bad{background:#7d1a24;box-shadow:0 22px 48px -34px rgba(125,26,36,.9)}
.vas .hero.muted{background:#33383f;box-shadow:0 22px 48px -34px rgba(51,56,63,.9)}
.vas .hero::after{content:"";position:absolute;right:-120px;top:-140px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.13) 0%,rgba(255,255,255,0) 68%);pointer-events:none}
.vas .hero .vtag{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 11px;border-radius:7px;background:rgba(255,255,255,.14);color:#fff;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.vas .hero h2{margin:16px 0 0;font-size:52px;font-weight:700;letter-spacing:-2px;line-height:1;color:#fff}
.vas .hero p{margin:14px 0 0;font-size:17px;line-height:1.55;color:rgba(255,255,255,.8);max-width:44ch;text-wrap:pretty}
.vas .gauge{position:relative;border-left:1px solid rgba(255,255,255,.16);padding-left:36px}
.vas .gauge .num{font-size:46px;font-weight:600;letter-spacing:-1.6px;line-height:1;font-family:'JetBrains Mono',ui-monospace,monospace;color:#fff}
.vas .gauge .num small{font-size:17px;font-weight:400;color:rgba(255,255,255,.5);letter-spacing:0}
.vas .gauge .bar{display:flex;gap:3px;margin:14px 0 10px}
.vas .gauge .bar i{height:10px;flex:1;background:rgba(255,255,255,.18);border-radius:2px}
.vas .gauge .bar i.on{background:#e9b44c}
.vas .gauge .lbl{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.vas .gauge .exp{margin-top:10px;font-size:12.5px;line-height:1.55;color:rgba(255,255,255,.6);max-width:none}
/* section head */
.vas section{padding:52px 0 0}
/* answer cards */
.vas .grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.vas .q{position:relative;background:#fff;border:1px solid rgba(21,19,28,.07);border-radius:18px;padding:22px 24px 20px;display:flex;flex-direction:column}
.vas .q .top{display:flex;align-items:flex-start;gap:9px;margin-bottom:11px;padding-right:26px}
.vas .srcq{position:absolute;top:16px;right:16px;width:20px;height:20px;border-radius:50%;border:1px solid var(--border);background:#fff;color:var(--faint);display:grid;place-items:center;cursor:help;transition:.15s}
/* The mark is an icon, not a glyph: it centres on the circle by geometry
   rather than sitting on a text baseline, which is what left it low before. */
.vas .srcq svg{display:block}
.vas .srcq:hover,.vas .srcq:focus-visible{color:var(--purple);border-color:var(--purple-line);background:var(--purple-soft);outline:none}
.vas .srctip{position:absolute;top:27px;right:-6px;width:290px;max-width:66vw;padding:11px 13px;border-radius:10px;background:var(--ink);color:rgba(255,255,255,.9);font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:400;line-height:1.7;text-align:left;opacity:0;visibility:hidden;transform:translateY(-3px);transition:opacity .16s,transform .16s,visibility .16s;box-shadow:0 20px 44px -24px rgba(21,19,28,.75);pointer-events:none;z-index:6}
.vas .srcq:hover .srctip,.vas .srcq:focus-visible .srctip{opacity:1;visibility:visible;transform:none}
.vas .q .ask{font-size:15.5px;font-weight:600;letter-spacing:-.25px;line-height:1.35;color:var(--ink);text-wrap:pretty}
.vas .q .yes{font-size:25px;font-weight:700;letter-spacing:-.85px;line-height:1.14;margin:0 0 10px;text-wrap:balance}
.vas .q.good .yes{color:var(--pos)}.vas .q.warn .yes{color:var(--amber)}.vas .q.bad .yes{color:var(--neg)}
.vas .q .so{margin:0;font-size:14.5px;line-height:1.58;color:var(--body);text-wrap:pretty}
.vas .q .src{margin-top:auto;padding-top:2px}
.vas .srcbtn{display:inline-flex;align-items:center;gap:6px;background:none;border:none;padding:0;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);transition:color .15s}
.vas .srcbtn:hover{color:var(--purple)}
.vas .srcbtn.on{color:var(--purple)}
.vas .srcbtn svg{transition:transform .18s}
.vas .srcbtn.on svg{transform:rotate(180deg)}
.vas cite{display:block;font-style:normal;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;line-height:1.65;color:var(--body);padding:10px 13px;border-radius:10px;background:var(--soft);margin-top:10px}
.vas .q.good cite,.vas cite.good{background:var(--pos-soft);color:#155c3a}
.vas .q.warn cite,.vas cite.warn{background:var(--amber-soft);color:#8b5310}
.vas .q.bad cite,.vas cite.bad{background:var(--neg-soft);color:#8e1f2a}
.vas .q.wide{grid-column:1/-1}
.vas .q.wide .yes{font-size:30px}
/* data section — band with cover mock */
/* The shell no longer clips. It used to, and the clip was doing exactly one
   job: holding the cover mock, which deliberately overhangs the band's right
   edge by 36px, inside the rounded corner. That job moves onto the band, whose
   right edge is the shell's right edge, so the geometry is unchanged — and an
   evidence tooltip opening from the last row can now leave the section instead
   of being sliced by its bottom edge.

   With no clip, each block rounds its own corners: the first and last child of
   the shell carry the shell's radius. The band overrides both inline (square
   at the bottom whenever a list sits under it), which is why these are written
   as the fallback rather than the rule. */
.vas .dwrap{border-radius:22px}
.vas .dwrap>:first-child{border-top-left-radius:22px;border-top-right-radius:22px}
.vas .dwrap>:last-child{border-bottom-left-radius:22px;border-bottom-right-radius:22px}
.vas .dband{border:1px solid rgba(21,19,28,.06);display:grid;grid-template-columns:minmax(420px,1fr) 360px;gap:40px;padding:34px 0 34px 36px;align-items:center;background-blend-mode:multiply;overflow:hidden}
/* The second column is the cover mock's, and the band has no right padding
   because the mock deliberately overhangs into it. A band with no cover — every
   band the assembler writes — must not hold that 360px open: doing so wrapped
   the finding under the title at ~680px of a 1120px page, whatever max-width
   the line itself was given. */
.vas .dband.nocover{grid-template-columns:1fr;padding-right:36px}
.vas .dband.cream{background:#F7F4EC url("stage-grain.png") 0 0/256px 256px repeat}
.vas .dband.cool{background:#FFE9BE url("stage-grain.png") 0 0/256px 256px repeat}
.vas .dband.sage{background:#E9F3EC url("stage-grain.png") 0 0/256px 256px repeat}
.vas .dband.mauve{background:#F0EAF8 url("stage-grain.png") 0 0/256px 256px repeat}
.vas .dband.ice{background:#E6F0F7 url("stage-grain.png") 0 0/256px 256px repeat}
.vas .dband.clay{background:#F4EAE4 url("stage-grain.png") 0 0/256px 256px repeat}
.vas .dband.blush{background:#FBE7E7 url("stage-grain.png") 0 0/256px 256px repeat}
.vas .dband .tag-i{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:7px;background:var(--ink);color:#fff;font-size:11.5px;font-weight:700}
.vas .dband h2{margin:15px 0 0;font-size:25px;font-weight:600;letter-spacing:-.85px;line-height:1.14;color:var(--ink);white-space:nowrap}
.vas .dband p{margin:11px 0 0;font-size:14px;line-height:1.62;color:var(--muted);max-width:58ch;text-wrap:pretty}
/* Band heading hierarchy: the numbered chip and the fixed title lead, the
   vendor-specific finding is the single line under them. */
.vas .dband .tag-i,.vas .cband .tag-i{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.vas .dband .finding,.vas .cband .finding,.vas .gband .finding{margin:9px 0 0;font-size:15px;line-height:1.5;color:var(--muted);max-width:100%;text-wrap:pretty}
.vas .gband .finding{color:rgba(255,255,255,.8)}
.vas .dfoot{display:flex;align-items:center;gap:20px;margin-top:22px;flex-wrap:wrap}
.vas .dcta{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 17px;border-radius:999px;border:1px solid var(--ink);background:var(--ink);color:#fff;font-size:13.5px;font-weight:600;white-space:nowrap}
.vas .dcta:hover{background:#2a2636;border-color:#2a2636}
.vas .dcta svg{transition:transform .18s}
.vas .dcta.on svg{transform:rotate(180deg)}
.vas .dtally{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11.5px;font-weight:600;letter-spacing:.04em}
.vas .dtally.good{color:var(--pos)}
.vas .dtally.bad{color:var(--neg)}
.vas .dtally.warn{color:var(--amber)}
.vas .dtally.plain{color:var(--body)}
.vas .dtally span{color:var(--dim);font-weight:400}
.vas .dcover{position:relative;height:214px;align-self:center}
.vas .mock{position:absolute;left:0;right:-36px;top:0;background:#fff;border:1px solid rgba(21,19,28,.06);border-radius:14px;-webkit-mask-image:linear-gradient(180deg,#000 76%,transparent 100%);mask-image:linear-gradient(180deg,#000 76%,transparent 100%)}
.vas .mockh{display:flex;align-items:center;gap:8px;padding:11px 14px;border-bottom:1px solid var(--soft)}
.vas .mockh b{font-size:11.5px;font-weight:600;letter-spacing:-.1px;color:var(--ink)}
.vas .mockh .k{margin-left:auto;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:8.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:3px 6px;border-radius:5px;background:var(--purple-soft);color:var(--purple)}
.vas .mockh .k.g{background:var(--pos-soft);color:var(--pos)}
.vas .mockh .k.r{background:var(--neg-soft);color:var(--neg)}
.vas .mockr{display:flex;align-items:center;gap:9px;padding:9px 14px;font-size:11.5px;color:var(--body)}
.vas .mockr+.mockr{border-top:1px solid #f6f5f9}
.vas .mockr .fl{width:16px;height:16px;border-radius:4px;flex:none;display:grid;place-items:center;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:7.5px;font-weight:700;background:var(--soft);color:var(--muted)}
.vas .mockr.on{color:var(--ink);font-weight:600}
.vas .mockr.on .fl{background:var(--pos-soft);color:var(--pos)}
.vas .mockr .tail{margin-left:auto;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;color:var(--faint);white-space:nowrap}
.vas .mockr .tail.g{color:var(--pos)}
.vas .mockr .tail.r{color:var(--neg)}
.vas .mockr s{text-decoration:line-through;text-decoration-color:#e5b9bf;color:var(--muted)}
.vas .sw{margin-left:auto;width:26px;height:15px;border-radius:99px;background:#ddd9e4;position:relative;flex:none}
.vas .sw::after{content:"";position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:99px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.vas .mock.full{-webkit-mask-image:none;mask-image:none}
.vas .bpath{display:flex;align-items:center;padding:24px 16px 0}
.vas .bnode{width:36px;height:36px;border-radius:11px;flex:none;display:grid;place-items:center;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:8.5px;font-weight:700;letter-spacing:.05em;background:#fff;border:1px solid var(--border);color:var(--dim)}
.vas .bnode.you{background:#fff;border-color:var(--ink);color:var(--ink);box-shadow:0 0 0 4px rgba(21,19,28,.07)}
.vas .bstack{display:flex;align-items:center;gap:2px}
.vas .bstack i{width:6px;height:14px;border-radius:2px;background:#d8d4e0;display:block}
.vas .bstack i:nth-child(2){height:18px;background:#c7c2d2}
.vas .bwire{flex:1;height:1px;border-top:1px dashed #d8d4e0;position:relative}
.vas .bwire i{position:absolute;left:50%;top:-17px;transform:translateX(-50%);font-style:normal;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:8.5px;letter-spacing:.04em;color:var(--muted);background:#fff;padding:0 4px;white-space:nowrap}
.vas .bpathl{display:flex;justify-content:space-between;padding:8px 10px 0;font-size:8.5px;color:var(--faint);text-align:center}
.vas .bpathl span{width:25%}
.vas .bbars{margin-top:16px;padding:14px 16px 16px;border-top:1px solid #f6f5f9;display:flex;flex-direction:column;gap:9px}
.vas .bbar{display:flex;align-items:center;gap:10px;font-size:10.5px;color:var(--body)}
.vas .bbar .bl{width:62px;flex:none}
.vas .bbar .track{flex:1;height:8px;border-radius:99px;background:var(--soft);overflow:hidden}
.vas .bbar .track i{display:block;height:8px;border-radius:99px;background:#e9b44c}
.vas .bbar.you .track i{width:100%;background:linear-gradient(90deg,var(--neg) 0%,var(--neg) 62%,rgba(165,30,44,.15) 100%)}
.vas .bbar .bv{flex:none;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;font-weight:600;color:var(--dim);width:66px;text-align:right;white-space:nowrap}
.vas .bbar .bv.r{color:var(--neg)}
.vas .dbody{background:#fff;border:1px solid rgba(21,19,28,.07);border-top:none;display:grid;grid-template-columns:1fr 1fr}
.vas .dbody+.dbody{border-top:1px solid rgba(21,19,28,.07)}
.vas .dans{position:relative;padding:22px 26px 20px;border-top:1px solid var(--soft)}
.vas .dans:nth-child(-n+2){border-top:none}
.vas .dans:nth-child(even){border-left:1px solid var(--soft)}
.vas .dans .ask{margin:0;padding-right:26px;font-size:13px;font-weight:500;color:var(--muted)}
.vas .dans h3{margin:6px 0 0;font-size:19px;font-weight:700;letter-spacing:-.6px;line-height:1.2;color:var(--ink);display:flex;align-items:flex-start;gap:9px}
.vas .dans h3>span{min-width:0}
.vas .dans .ask{margin:0;font-size:13px;font-weight:500;color:var(--muted)}
.vas .dans.wide{grid-column:1/-1}
.vas .dans p{margin:8px 0 0;font-size:14.5px;line-height:1.58;color:var(--body);text-wrap:pretty}
.vas .dans .srcq{top:18px;right:18px}
/* question accordion — one row per question: the question and its short answer
   are always in view, the reasoning folds away behind the chevron, and the `?`
   keeps its evidence tooltip on the row header without opening anything. */
.vas .dqlist{background:#fff;border:1px solid rgba(21,19,28,.07);border-top:none}
.vas .dqlist+.dbody,.vas .dqlist+.dqlist{border-top:1px solid rgba(21,19,28,.07)}
.vas .dqrow+.dqrow{border-top:1px solid var(--soft)}
.vas .dqhead{position:relative}
.vas .dqbtn{display:flex;align-items:flex-start;gap:12px;width:100%;padding:17px 92px 17px 26px;background:none;border:none;text-align:left;transition:background .15s}
/* Hover is the page's neutral row tint — the same #faf9fc the section rail's
   links carry — not a purple wash. */
.vas .dqbtn:hover{background:#faf9fc}
.vas .dqbtn:focus-visible{outline:2px solid var(--purple-line);outline-offset:-2px}
.vas .dqtxt{display:flex;flex-direction:column;gap:3px;min-width:0}
.vas .dqask{font-size:15.5px;font-weight:600;letter-spacing:-.3px;line-height:1.35;color:var(--ink);text-wrap:pretty}
.vas .dqans{font-size:14px;line-height:1.5;color:var(--body);text-wrap:pretty}
.vas .dqcv{position:absolute;right:24px;top:19px;display:inline-flex;color:var(--faint);transition:transform .18s,color .15s}
.vas .dqbtn:hover .dqcv{color:var(--purple)}
.vas .dqrow.on .dqcv{transform:rotate(180deg);color:var(--purple)}
/* An open row is ONE surface. Tinting only its header drew a seam across the
   middle of the card, and tinting the body with it would say the reasoning is
   clickable, which it is not — so an open row drops the tint and the chevron
   carries the hover alone, the same signal .expohead uses. The focus ring is
   untouched: it is how the row is operated from the keyboard. */
.vas .dqrow.on .dqbtn:hover{background:none}
.vas .dqrow.on .dqbtn:hover .dqcv{color:var(--purple-deep)}
.vas .dqrow .srcq{top:18px;right:52px}
/* The last row is the shell's bottom edge, so its hover tint and its focus
   ring have to turn the same corner the list does. An open row hands that job
   to its body, and the button goes back to square. */
.vas .dqrow:last-child:not(.on) .dqbtn{border-bottom-left-radius:22px;border-bottom-right-radius:22px}
.vas .dqrow:last-child.on .dqbody{border-bottom-left-radius:22px;border-bottom-right-radius:22px}
.vas .dqbody{padding:0 92px 18px 55px}
.vas .dqbody p{margin:0;font-size:14.5px;line-height:1.58;color:var(--body);text-wrap:pretty}
@media(max-width:1080px){.vas .dqbtn{padding:16px 78px 16px 22px}.vas .dqbody{padding:0 78px 16px 51px}.vas .dqcv{right:20px}.vas .dqrow .srcq{right:46px}}
/* certifications */
.vas .certs{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid rgba(21,19,28,.07);border-top:none}
.vas .cert{padding:20px 20px 22px;display:flex;flex-direction:column;gap:11px;border-right:1px solid var(--soft);border-top:1px solid var(--soft)}
.vas .cert:nth-child(-n+4){border-top:none}
.vas .cert:nth-child(4n),.vas .cert:last-child{border-right:none}
.vas .cmark{width:46px;height:46px;border-radius:12px;background:var(--soft);color:var(--ink);display:grid;place-items:center;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.06em}
.vas .cimg{width:46px;height:46px;border-radius:10px;object-fit:contain;background:#fff}
.vas .cert b{font-size:14.5px;font-weight:600;letter-spacing:-.25px;line-height:1.25;color:var(--ink)}
.vas .cnote{font-size:12.5px;line-height:1.5;color:var(--muted)}
/* comparison table */
.vas .tabwrap{background:#fff;border:1px solid rgba(21,19,28,.07);border-top:none;border-radius:0 0 22px 22px;overflow:hidden}
.vas .ctab{width:100%;border-collapse:collapse}
.vas .ctab th{text-align:left;padding:15px 24px;font-size:13.5px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--border);vertical-align:bottom}
.vas .ctab th.k{width:20%;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dim);font-weight:700}
.vas .ctab th small{display:block;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--dim);font-weight:700;margin-bottom:5px}
.vas .ctab th.hl{background:var(--purple-soft)}
.vas .ctab td{padding:14px 24px;font-size:14px;line-height:1.55;color:var(--body);border-bottom:1px solid var(--soft);vertical-align:top}
.vas .ctab td.k{font-weight:600;color:var(--ink);font-size:13.5px}
.vas .ctab td.hl{background:#fbfaff}
.vas .ctab tr:last-child td{border-bottom:none}
.vas .dnote{padding:20px 24px 22px;border-top:1px solid var(--soft);background:#fcfcfe;display:flex;flex-direction:column;gap:9px}
.vas .dnote b{font-size:15.5px;font-weight:600;letter-spacing:-.3px;color:var(--ink)}
.vas .dnote p{margin:0;font-size:14px;line-height:1.6;color:var(--body);max-width:none;text-wrap:pretty}
.vas .verdict{margin-top:14px;background:#fff;border:1px solid rgba(21,19,28,.07);border-radius:18px;padding:22px 24px;border-left:3px solid var(--amber)}
.vas .verdict b.h{display:block;font-size:16px;font-weight:600;letter-spacing:-.3px;margin-bottom:8px}
.vas .verdict p{margin:0 0 10px;font-size:14.5px;line-height:1.6;color:var(--body);max-width:78ch;text-wrap:pretty}
.vas .verdict p:last-child{margin-bottom:0}
/* timeline */
.vas .tl{display:grid;grid-template-columns:20px 1fr;gap:16px}
.vas .tl .rail{position:relative;display:flex;justify-content:center}
.vas .tl .rail::before{content:"";position:absolute;top:0;bottom:0;width:1px;background:var(--soft)}
.vas .tlwrap .tl:first-child .rail::before{top:10px}
.vas .tlwrap .tl:last-child .rail::before{bottom:auto;height:100%}
.vas .tl .pip{position:relative;margin-top:6px;width:9px;height:9px;border-radius:99px;flex:none}
.vas .pip.down{background:var(--neg);box-shadow:0 0 0 3px rgba(165,30,44,.12)}
.vas .pip.mixed{background:var(--amber);box-shadow:0 0 0 3px rgba(176,100,16,.12)}
.vas .pip.up{background:var(--pos);box-shadow:0 0 0 3px rgba(15,106,63,.12)}
.vas .ev{padding-bottom:20px}
.vas .ev .when{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);margin-bottom:7px}
.vas .evc{background:#fff;border:1px solid rgba(21,19,28,.07);border-radius:16px;padding:18px 22px}
.vas .evc h3{margin:0 0 12px;font-size:17px;font-weight:600;letter-spacing:-.4px;color:var(--ink);display:flex;align-items:flex-start;gap:9px}
.vas .evc h3>span{min-width:0}
.vas .evc ul{margin:0;padding-left:17px}
.vas .evc li{font-size:14px;line-height:1.6;color:var(--body);margin-bottom:7px;text-wrap:pretty}
.vas .evc li:last-child{margin-bottom:0}
.vas .evc li b{font-weight:600;color:var(--ink)}
/* fixes */
/* ask band */
.vas .askband{position:relative;overflow:hidden;margin-top:14px;border-radius:22px;padding:36px 40px;background:#1b1526;color:#fff;box-shadow:0 22px 48px -34px rgba(27,21,38,.95)}
.vas .askband::after{content:"";position:absolute;right:-140px;bottom:-180px;width:440px;height:440px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 68%);pointer-events:none}
.vas .askband .atag{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 11px;border-radius:7px;background:rgba(255,255,255,.14);font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.vas .askband>h3{margin:16px 0 0;font-size:34px;font-weight:700;letter-spacing:-1.1px;line-height:1.08;color:#fff;white-space:nowrap}
.vas .askband .sub{margin:12px 0 0;font-size:16px;line-height:1.55;color:rgba(255,255,255,.78);max-width:62ch;text-wrap:pretty}
.vas .askscroll{position:relative;z-index:1;height:280px;overflow:hidden;margin-top:22px;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 26px);mask-image:linear-gradient(to bottom,transparent 0,#000 26px)}
.vas .abub{display:flex;flex:0 0 auto;opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s}
.vas .abub.in{opacity:1;transform:none}
.vas .abub.user{justify-content:flex-end}
.vas .abody{min-width:0;max-width:78%;padding:14px 17px;border-radius:16px}
.vas .abub.user .abody{max-width:66%;background:#fff;color:var(--ink);border-bottom-right-radius:5px}
.vas .abub.ai .abody{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);border-bottom-left-radius:5px}
.vas .utxt{font-size:14px;line-height:1.5;color:var(--ink)}
.vas .atxt{margin:0;font-size:14px;line-height:1.6;color:rgba(255,255,255,.94);text-wrap:pretty}
.vas .atxt.dim{color:rgba(255,255,255,.6);font-size:13px}
.vas .wfade{opacity:0;transition:opacity .3s}
.vas .wfade.inw{opacity:1}
.vas .twc{display:inline-block;width:1.5px;height:13px;background:var(--ink);vertical-align:-2px;animation:acaret 1s steps(1) infinite}
@keyframes acaret{50%{opacity:0}}
.vas .tdots{display:inline-flex;gap:3px;vertical-align:1px}
.vas .tdots i{width:4px;height:4px;border-radius:50%;background:#b3a0f0;animation:tdot 1.1s ease-in-out infinite}
.vas .tdots i:nth-child(2){animation-delay:.16s}.vas .tdots i:nth-child(3){animation-delay:.32s}
@keyframes tdot{0%,100%{opacity:.25}50%{opacity:1}}
.vas .adocs{display:flex;flex-direction:column;gap:6px;margin-top:11px}
.vas .adoc{display:flex;align-items:center;gap:7px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;color:rgba(255,255,255,.68);opacity:0;transform:translateY(3px);transition:opacity .3s,transform .3s}
.vas .adoc.in{opacity:1;transform:none}
.vas .adoc .lc{color:#b3a0f0;font-weight:700}
.vas .acite{margin-top:12px;background:rgba(140,110,235,.14);border-left:2px solid rgba(160,133,242,.6);color:#cdbdf7;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;line-height:1.65;padding:10px 12px;border-radius:4px 10px 10px 4px;opacity:0;transform:translateY(4px);transition:opacity .35s,transform .35s}
.vas .acite.in{opacity:1;transform:none}
.vas .askform{position:relative;z-index:1;display:flex;align-items:center;gap:8px;width:100%;max-width:600px;margin:22px auto 0;padding:6px 6px 6px 24px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);border-radius:999px;transition:border-color .15s,background .15s}
.vas .askform:focus-within{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.34)}
.vas .askform input{flex:1;min-width:0;border:none;outline:none;background:none;font-family:inherit;font-size:15px;color:#fff;padding:12px 0}
.vas .askform input::placeholder{color:rgba(255,255,255,.46)}
.vas .askbtn{display:inline-flex;align-items:center;gap:8px;flex:none;height:44px;padding:0 22px;border:none;border-radius:999px;background:#fff;color:var(--ink);font-family:inherit;font-size:14.5px;font-weight:600;transition:.15s}
.vas .askbtn:hover{background:#e8e1fb}
.vas .askbtn:disabled{background:rgba(255,255,255,.16);color:rgba(255,255,255,.5)}
.vas .asksug{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:12px}
/* upsell modal */
.vas .upmask{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:24px;background:rgba(15,11,24,.62);backdrop-filter:blur(4px);animation:upfade .18s ease-out}
.vas .upcard{position:relative;flex:none;margin:auto;width:100%;max-width:430px;background:var(--paper);color:var(--ink);border-radius:22px;padding:44px 36px 40px;box-shadow:0 40px 90px -30px rgba(15,11,24,.7);animation:uprise .22s cubic-bezier(.2,.8,.3,1);display:flex;flex-direction:column;align-items:center;text-align:center}
.vas .upclose{position:absolute;top:14px;right:16px;width:30px;height:30px;border:none;border-radius:50%;background:none;color:var(--faint);font-size:22px;line-height:1;transition:.15s}
.vas .upclose:hover{background:var(--soft);color:var(--ink)}
.vas .upcard h3{margin:0;font-size:24px;font-weight:700;letter-spacing:-.8px;line-height:1.18;color:var(--ink);white-space:normal;text-wrap:balance}
.vas .upbody{margin:12px 0 0;font-size:15px;line-height:1.6;color:var(--body);max-width:34ch;text-wrap:pretty}
.vas .upacts{display:flex;flex-direction:column;gap:10px;width:100%;max-width:300px;margin-top:26px}
.vas .upacts .btn{width:100%;padding:13px 20px}
.vas .updot{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--pos-soft);color:var(--pos);margin-bottom:16px}
@keyframes upfade{from{opacity:0}}
@keyframes uprise{from{opacity:0;transform:translateY(10px) scale(.985)}}
.vas .asksug button{border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:rgba(255,255,255,.8);border-radius:999px;padding:6px 13px;font-family:inherit;font-size:12.5px;font-weight:500;transition:.15s}
.vas .asksug button:hover{background:rgba(255,255,255,.15);color:#fff;border-color:rgba(255,255,255,.38)}
.vas .askfoot{position:relative;z-index:1;margin:16px 0 0;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.04em;color:rgba(255,255,255,.6)}
/* grounding */
.vas .gwrap{border-radius:22px;overflow:hidden}
.vas .gband{background:#4c31a4;color:#fff;padding:30px 36px;display:grid;grid-template-columns:1fr auto;gap:44px;align-items:center}
.vas .gband .tag-i{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:7px;background:var(--ink);color:#fff;font-size:11.5px;font-weight:700}
.vas .gband h2{margin:15px 0 0;font-size:25px;font-weight:600;letter-spacing:-.85px;line-height:1.14}
.vas .gband p{margin:11px 0 0;font-size:14px;line-height:1.62;color:rgba(255,255,255,.76);max-width:62ch;text-wrap:pretty}
.vas .gside{display:flex;flex-direction:column;align-items:flex-end;gap:16px;flex:none}
.vas .gnums{display:flex;gap:26px}
.vas .gnums div{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.vas .gnums b{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:38px;font-weight:600;letter-spacing:-1.2px;line-height:1}
.vas .gnums span{font-size:11.5px;color:rgba(255,255,255,.62);max-width:15ch;text-align:right;line-height:1.4}
.vas .gcta{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 17px;border-radius:999px;border:1px solid #fff;background:#fff;color:var(--ink);font-size:13.5px;font-weight:600;white-space:nowrap}
.vas .gcta:hover{background:#f2ecfd;border-color:#f2ecfd}
.vas .gcta svg{color:var(--purple);transition:transform .18s}
.vas .gcta.on svg{transform:rotate(180deg)}
.vas .gbody{background:#fff;border:1px solid rgba(21,19,28,.07);border-top:none}
.vas .gkey{display:flex;gap:30px;flex-wrap:wrap;padding:18px 24px;border-bottom:1px solid var(--soft)}
.vas .gkey div{display:flex;gap:9px;font-size:12.5px;line-height:1.5;color:var(--muted);max-width:46ch}
.vas .gkey b{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:700;letter-spacing:.1em;flex:none;padding-top:1px}
.vas .gtab{width:100%;border-collapse:collapse}
.vas .gtab th{text-align:left;padding:10px 24px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--faint);background:#fcfcfe;border-bottom:1px solid var(--soft)}
.vas .gtab td{padding:8px 24px;font-size:13px;line-height:1.45;color:var(--body);border-bottom:1px solid #f5f4f8;vertical-align:top}
.vas .gtab tr:last-child td{border-bottom:none}
/* Three columns, read as a ledger: what was claimed on the left, where it
   came from on the right. The claim cell now carries the question above the
   statement and takes the width it needs; the source is a short mono
   reference ("DPA §2.4 · doc 1") and used to sit stranded in the middle of a
   36% column with white space on both sides of it, so it is pulled to the
   right edge next to the level it belongs with. */
.vas .gtab td.src{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;color:var(--dim);width:30%;text-align:right}
.vas .gtab th:nth-child(2){text-align:right}
/* The question the claim answers, leading its cell. */
.vas .gtab td.cl b.gq{display:block;font-size:13px;font-weight:600;color:var(--ink);line-height:1.35;margin-bottom:3px}
.vas .gtab td.lv{width:52px;text-align:right;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:700;letter-spacing:.1em}
.vas .lvA{color:var(--pos)}.vas .lvB{color:#1f5aa8}
.vas .gnotes{padding:16px 24px 20px;border-top:1px solid var(--soft);background:#fcfcfe;display:flex;flex-direction:column;gap:8px}
.vas .gnotes p{margin:0;font-size:12.5px;line-height:1.6;color:var(--muted);max-width:96ch}
.vas .note{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;line-height:1.85;color:var(--muted);margin:26px 0 0;padding-top:18px;border-top:1px solid var(--border);max-width:96ch}
@media(max-width:1080px){.vas .hero{padding:28px 26px 0}.vas .herogrid{grid-template-columns:1fr;gap:24px;padding-bottom:28px}.vas .gauge{border-left:none;border-top:1px solid rgba(255,255,255,.16);padding:24px 0 0}.vas .grid{grid-template-columns:1fr}.vas .dband{grid-template-columns:1fr;padding:28px 26px;gap:26px}.vas .dband.nocover{padding-right:26px}.vas .dband h2{white-space:normal}.vas .dcover{height:190px;overflow:hidden}.vas .mock{right:0}.vas .dbody{grid-template-columns:1fr}.vas .certs{grid-template-columns:1fr 1fr}.vas .cert{border-top:1px solid var(--soft)}.vas .cert:nth-child(-n+2){border-top:none}.vas .cert:nth-child(even){border-right:none}.vas .dans:nth-child(2){border-top:1px solid var(--soft)}.vas .dans:nth-child(even){border-left:none}.vas .q.wide{grid-column:auto}.vas .gkey{flex-direction:column;gap:10px}.vas .gband{grid-template-columns:1fr;gap:24px;padding:28px 26px}.vas .gside{align-items:flex-start}.vas .gnums div{align-items:flex-start}.vas .gnums span{text-align:left}}
@media(max-width:1080px){.vas .askband{padding:28px 22px}.vas .askband>h3{font-size:26px;white-space:normal}.vas .askscroll{height:280px}.vas .abody{max-width:88%}.vas .abub.user .abody{max-width:80%}.vas .upcard{padding:28px 22px 24px}}
@media(max-width:560px){.vas .askform{flex-wrap:wrap;border-radius:22px;padding:14px}.vas .askform input{padding:4px 4px 10px;width:100%;flex-basis:100%}.vas .askbtn{width:100%;justify-content:center}}
@media(prefers-reduced-motion:reduce){.vas .upmask,.vas .upcard{animation:none}.vas .tdots i{animation:none;opacity:.6}.vas .twc{animation:none}}
/* ---------- openrouter report additions ---------- */
.vas .dband.mist{background:#EDEEF4 url("stage-grain.png") 0 0/256px 256px repeat}
.vas .dcover{height:216px}
.vas .dcover .mock{top:50%;transform:translateY(-50%)}
.vas .mockr .tail.u{color:var(--dim);font-style:italic}
.vas .subline{margin:9px 0 0;font-size:14.5px;line-height:1.5;color:var(--muted)}
.vas .dwrap .tabwrap,.vas .dwrap .certs{border-top:1px solid var(--soft)}
.vas .ctab td.k .tag{display:inline-flex;margin-top:7px}
.vas .cert .av{margin-top:auto;align-self:flex-start}
.vas .expo{margin-top:14px;background:#fff;border:1px solid rgba(21,19,28,.07);border-radius:18px;overflow:hidden}
.vas .expohead{display:flex;align-items:center;gap:14px;width:100%;padding:15px 22px;background:#fff;border:none;text-align:left}
.vas .expohead b{font-size:14.5px;font-weight:600;letter-spacing:-.3px;color:var(--ink)}
.vas .expohead .mono-sm{margin-left:auto}
.vas .expohead .cv{color:var(--faint);display:inline-flex;transition:transform .18s}
.vas .expohead .cv.on{transform:rotate(180deg);color:var(--purple)}
.vas .expohead:hover .cv{color:var(--purple)}
.vas .mininote{margin:30px 0 13px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
.vas .gcut{padding:18px 24px 20px;border-top:1px solid var(--soft);background:#fcfcfe;display:grid;grid-template-columns:1fr 1fr;gap:16px 30px}
.vas .gcut h4{grid-column:1/-1;margin:0;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
.vas .gcuti b{display:block;font-size:13.5px;font-weight:600;letter-spacing:-.2px;color:var(--ink);margin-bottom:5px;line-height:1.35}
.vas .gcuti p{margin:0;font-size:12.5px;line-height:1.6;color:var(--muted);text-wrap:pretty}
@media(max-width:1080px){.vas .gcut{grid-template-columns:1fr}.vas .dcover{height:auto;min-height:216px}}

/* ---------- safety breakdown (schema v2.7: sections and question keys) ----------
   One block per weighted section: the header carries the arithmetic, the meter
   carries the same ratio for the eye, and the questions of that section are
   listed under it so a reader can see which one earned what. */
.vas .snote{padding:12px 22px 16px;border-top:1px solid var(--soft);background:#fcfcfe}
.vas .snote p{margin:0 0 6px;font-size:12.5px;line-height:1.6;color:var(--muted)}
.vas .snote p:last-child{margin-bottom:0}
.vas .bkcap,.vas .bkcov{margin:0;padding:11px 22px;border-top:1px solid var(--soft);background:#fcfcfe;font-size:12.5px;line-height:1.6;color:var(--muted)}
.vas .bkcap{background:var(--neg-soft);color:var(--neg)}
.vas .bkcap b,.vas .bkcov b{font-weight:700;color:inherit}
.vas .bkgrid{display:grid;grid-template-columns:1fr 1fr}
.vas .bksec{padding:15px 22px 17px;border-top:1px solid var(--soft);display:flex;flex-direction:column;gap:7px}
.vas .bksec:nth-child(even){border-left:1px solid var(--soft)}
.vas .bkh{display:flex;align-items:baseline;gap:9px}
.vas .bkh b{font-size:14px;font-weight:600;letter-spacing:-.2px;color:var(--ink)}
.vas .bkw{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.vas .bkh i{margin-left:auto;font-style:normal;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:600;color:var(--amber);white-space:nowrap}
.vas .bkm{font-size:11.5px;line-height:1.4;color:var(--muted)}
.vas .bksec .t{height:6px;border-radius:99px;background:var(--soft);overflow:hidden}
.vas .bksec .t i{display:block;height:6px;border-radius:99px;background:#e0a63c}
.vas .bkql{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
.vas .bkq{display:flex;align-items:baseline;gap:8px;min-width:0}
.vas .bkq .stat{margin-top:0;align-self:center}
.vas .bkq .stat.none{background:var(--soft);color:var(--faint)}
.vas .bkq code{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:var(--body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vas .bkq i{margin-left:auto;font-style:normal;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;color:var(--dim);white-space:nowrap}
@media(max-width:1080px){.vas .bkgrid{grid-template-columns:1fr}.vas .bksec:nth-child(even){border-left:none}}
.vas .vswitch{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--border);border-radius:999px;padding:7px 14px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:var(--muted)}
.vas .vswitch select{border:none;outline:none;background:none;font-family:inherit;font-size:11.5px;color:var(--ink);cursor:pointer}
@media(max-width:760px){
.vas .expo,.vas .tabwrap,.vas .gbody{overflow-x:auto}
.vas .ctab,.vas .gtab{min-width:560px}
}
/* ---------- compact standard-vs-negotiated (no second deal) ---------- */
.vas .cband{border:1px solid rgba(21,19,28,.06);border-radius:22px;padding:28px 32px 26px;background-blend-mode:multiply}
.vas .cband .tag-i{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:7px;background:var(--ink);color:#fff;font-size:11.5px;font-weight:700}
.vas .cnotice{display:flex;align-items:flex-start;gap:8px;margin:0 0 14px;font-size:12.5px;font-weight:600;line-height:1.45;color:var(--amber)}
.vas .cnotice .stat{margin-top:1px}
.vas .cband.mist{background:#EDEEF4 url("stage-grain.png") 0 0/256px 256px repeat}
.vas .cband h2{margin:15px 0 0;font-size:25px;font-weight:600;letter-spacing:-.85px;line-height:1.14;color:var(--ink)}
/* The asks are a plain list of terms; the ask itself lives in the same hover
   tooltip the evidence cards use, anchored to the row rather than the marker. */
.vas .cband .dfoot{margin-top:18px}
.vas .casks{display:flex;flex-direction:column;gap:6px;margin-top:16px}
.vas .cask{display:flex;flex-direction:column;gap:2px;background:#fff;border:1px solid rgba(21,19,28,.07);border-radius:11px;padding:9px 13px}
.vas .cask b{font-size:13.5px;font-weight:600;letter-spacing:-.2px;color:var(--ink);line-height:1.3}
.vas .cask span{font-size:12px;line-height:1.45;color:var(--muted)}
@media(max-width:1080px){.vas .cband{padding:24px 22px}}

/* ---------- score breakdown inside the verdict card ---------- */
.vas .gauge .exp{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px}
.vas .explink{display:inline-flex;align-items:center;gap:5px;background:none;border:none;padding:0;font-family:inherit;font-size:12.5px;font-weight:600;color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.4);text-underline-offset:3px;transition:.15s}
.vas .explink:hover{text-decoration-color:#fff}
.vas .explink svg{transition:transform .18s}
.vas .explink.on svg{transform:rotate(180deg)}
.vas .expo.inhero{position:relative;z-index:1;margin:0 -36px;background:#fff;color:var(--ink);border-radius:0;box-shadow:none;border:none;border-top:1px solid rgba(255,255,255,.18)}
.vas .expo.inhero .expohead.static{cursor:default;padding-top:20px}
.vas .expo.inhero .rationale{margin:0;padding:0 22px 16px;font-size:13.5px;line-height:1.6;color:var(--body);max-width:none;text-wrap:pretty}
.vas .hero .expo.inhero p{max-width:none;margin:0;font-size:inherit;line-height:inherit;color:inherit}
.vas .hero .expo.inhero .snote p{margin:0 0 6px;font-size:12.5px;line-height:1.6;color:var(--muted)}
.vas .hero .expo.inhero .snote p:last-child{margin-bottom:0}
.vas .hero .expo.inhero .bkcap,.vas .hero .expo.inhero .bkcov{font-size:12.5px;line-height:1.6}
.vas .hero .expo.inhero .bkcov{color:var(--muted)}
.vas .hero .expo.inhero .bkcap{color:var(--neg)}
@media(max-width:1080px){.vas .expo.inhero{margin:0 -26px}}

/* ---------- status marks: the verdict lives in the mark, not the title colour ---------- */
.vas .stat{flex:none;display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;margin-top:3px}
.vas .stat.good{background:var(--pos-soft);color:var(--pos)}
.vas .stat.warn{background:var(--amber-soft);color:var(--amber)}
.vas .stat.bad{background:var(--neg-soft);color:var(--neg)}
.vas .evc h3 .stat{margin-top:2px}

/* ---------- phase 1: the preloader's document ticker ----------
   Two rows, one per side, each cycling the titles that side's documents carry.
   The track holds the list twice and slides exactly half its own width, which
   is what makes the loop seamless whatever the list length. */
.vas .tick{margin-top:32px;padding-top:22px;border-top:1px solid var(--soft);display:flex;flex-direction:column;gap:9px}
/* Hidden while documents are still being found: the titles it cycles are the
   count of what was found, spelled out, and the search feed says all a reader
   is told until the evaluation starts. */
.vas .tick.hid{display:none}
.vas .tkrow{display:flex;align-items:center;gap:14px;min-width:0}
.vas .tkw{display:inline-flex;align-items:center;gap:8px;flex:none;width:190px;overflow:hidden}
.vas .tkw b{font-size:12.5px;font-weight:600;letter-spacing:-.2px;color:var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vas .tkv{position:relative;flex:1;min-width:0;height:20px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 44px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 44px),transparent 100%)}
.vas .tkrun{display:flex;width:max-content;animation:vaTick 22s linear infinite}
.vas .tkrun.idle{animation:none}
.vas .tkl{display:inline-flex;align-items:center;white-space:nowrap}
.vas .tkl i{font-style:normal;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;line-height:20px;color:var(--dim);white-space:nowrap}
.vas .tkl i::before{content:"·";margin:0 11px;color:var(--faint)}
.vas .tkl i.sk{display:inline-block;height:9px;margin:0 8px;border-radius:5px}
.vas .tkl i.sk::before{content:none}
.vas .tkn{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;line-height:20px;color:var(--faint)}
@keyframes vaTick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- phase 2: the report layout as a live skeleton ----------
   The stage loader stands where the status mark will be and fills by stage.
   The arc is one circle whose visible length is set per stage, so the ring
   grows rather than jumping; `evaluating` also turns, which is the one thing
   on this screen that says work is happening right now. r=9 → 2πr ≈ 56.6. */
.vas .stg{flex:none;display:inline-grid;place-items:center;width:17px;height:17px;margin-top:3px;color:var(--purple)}
.vas .stg svg{display:block;overflow:visible}
.vas .stg .trk{stroke:currentColor;opacity:.17}
.vas .stg .arc{stroke:currentColor;stroke-dasharray:56.6;stroke-dashoffset:56.6;transform:rotate(-90deg);transform-origin:12px 12px;transition:stroke-dashoffset .5s cubic-bezier(.4,0,.2,1)}
.vas .stg[data-stage="evaluating"] .arc{stroke-dashoffset:42;animation:vaRing 1.15s linear infinite}
.vas .stg[data-stage="b_answered"] .arc{stroke-dashoffset:17}
.vas .stg[data-stage="done"] .arc{stroke-dashoffset:0}
.vas .stg[data-stage="failed"]{color:var(--neg)}
.vas .stg[data-stage="failed"] .arc{stroke-dashoffset:0;opacity:.55}
@keyframes vaRing{from{transform:rotate(-90deg)}to{transform:rotate(270deg)}}
/* The row is the report's own accordion row with nothing to open yet. */
.vas .dqrow.skel .dqbtn{padding-right:26px;cursor:default}
.vas .dqrow.skel .dqbtn:hover{background:none}
/* Presentational only: the placeholder is blurred until there is something
   real to read in it, and the moment an answer lands the blur goes with it. */
.vas .dqrow.skel:not([data-filled]) .dqans{filter:blur(2.4px)}
.vas .dqans .sk.skline{display:block;width:62%;height:11px;margin:4px 0 3px}
.vas .dqrow.skel:nth-child(3n) .dqans .sk.skline{width:47%}
.vas .dqrow.skel:nth-child(3n+2) .dqans .sk.skline{width:71%}
.vas .hero .sk{background:linear-gradient(90deg,rgba(255,255,255,.10) 25%,rgba(255,255,255,.22) 50%,rgba(255,255,255,.10) 75%);background-size:200% 100%}
.vas .hero .sk.skhead{display:block;width:min(460px,62%);height:44px;margin-top:16px;border-radius:12px}
/* The same heading node once a forming band is in it: the finished report's
   own .hero h2, value for value, so the band does not change size when the
   stored report replaces the skeleton. */
.vas .hero .skhead.forming{display:block;margin:16px 0 0;font-size:52px;font-weight:700;letter-spacing:-2px;line-height:1;color:#fff}
@media(prefers-reduced-motion:reduce){
.vas .tkrun{animation:none}
.vas .sfl{animation:none}
.vas .stg[data-stage="evaluating"] .arc{animation:none}
.vas .sk{animation:none}
.vas .spin{animation:none}
}