/* Signal Studio (/start/) — layered on top of styles.css.
   Reuses the marketing site's tokens, .field, .btn and nav/footer wholesale;
   everything below is the wizard chrome the landing page has no need for. */

/* styles.css styles bare `section` and `header` for the marketing page's
   full-height hero rhythm — 96px and up to 150px of padding respectively.
   Inside the app those elements are ordinary structure, so reset both. Without
   the `header` reset every card that uses one grows a 150px void above its
   title, which is not obvious from reading either stylesheet alone. */
.studio-main section{padding:0}
.studio-main header{padding:0;overflow:visible}

.studio-main{padding:calc(78px + clamp(28px,5vh,56px)) 0 90px;position:relative;z-index:1}

.studio-head{max-width:44rem;margin-bottom:clamp(26px,4vh,42px)}
.studio-title{
  font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4.4vw,3.1rem);
  line-height:1.06;letter-spacing:-.01em;margin:0 0 16px;text-wrap:balance;
}
html.zh .studio-title{font-family:var(--serif-cjk);font-weight:600;line-height:1.22;letter-spacing:.01em;font-size:clamp(1.7rem,4vw,2.5rem)}
.studio-title em{font-style:italic;color:var(--signal)}
html.zh .studio-title em{font-style:normal}
.studio-lead{color:var(--muted);font-size:1.04rem;line-height:1.66;max-width:40em;text-wrap:balance}

.nav-ghost{
  font-family:var(--sans);font-size:13.5px;font-weight:500;background:none;
  border:1px solid var(--line-2);color:var(--muted);padding:8px 14px;border-radius:7px;
  cursor:pointer;transition:border-color .2s,color .2s;
}
html.zh .nav-ghost{font-family:var(--sans-cjk)}
.nav-ghost:hover{border-color:var(--signal);color:var(--signal)}

.mock-banner{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.05em;color:var(--cyan);
  background:rgba(111,227,255,.07);border:1px solid rgba(111,227,255,.28);
  border-radius:9px;padding:11px 15px;margin-bottom:22px;
}
html.zh .mock-banner{font-family:var(--sans-cjk);font-size:13px;letter-spacing:.02em}

/* ---------- step rail ---------- */
.rail{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:26px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.rail-step{
  display:flex;align-items:center;gap:9px;background:none;border:1px solid transparent;
  padding:7px 13px 7px 8px;border-radius:8px;cursor:pointer;
  font-family:var(--sans);font-size:13px;font-weight:500;color:var(--muted-2);
  transition:color .2s,border-color .2s,background .2s;
}
html.zh .rail-step{font-family:var(--sans-cjk)}
.rail-step .rn{
  flex:none;width:21px;height:21px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--mono);font-size:11px;font-weight:700;
  border:1px solid var(--line-2);color:var(--muted-2);transition:all .2s;
}
.rail-step:hover{color:var(--fg)}
.rail-step.done{color:var(--muted)}
.rail-step.done .rn{background:var(--signal-dim);border-color:rgba(199,249,75,.4);color:var(--signal)}
.rail-step.now{color:var(--ink);background:var(--signal);border-color:var(--signal)}
.rail-step.now .rn{background:rgba(10,12,13,.16);border-color:rgba(10,12,13,.3);color:var(--ink)}
.rail-step.now:hover{color:var(--ink)}

/* ---------- layout ---------- */
/* Single column since the sticky quote was removed: the price now appears
   once, in the review step's table, and a second running total beside it was
   the same number twice. */
.studio-grid{display:block}
.studio-col{min-width:0}

.step-panel{display:flex;flex-direction:column;gap:20px}
.sp-title{
  font-family:var(--serif);font-weight:400;font-size:clamp(1.6rem,3vw,2.15rem);
  line-height:1.12;letter-spacing:-.005em;
}
html.zh .sp-title{font-family:var(--serif-cjk);font-weight:600;font-size:clamp(1.4rem,2.8vw,1.85rem);line-height:1.3}
.sp-lead{color:var(--muted);font-size:1rem;line-height:1.62;max-width:42em;margin-top:-12px;text-wrap:balance}
.sp-lead.small{font-size:.95rem}
.sub-h{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted-2);margin-top:8px;
}
html.zh .sub-h{font-family:var(--sans-cjk);letter-spacing:.05em;font-size:13px;font-weight:600;text-transform:none}
.hint{color:var(--muted-2);font-size:.88rem;line-height:1.55;margin-top:2px}
.hint.warn{color:#E8C86A}
.empty{color:var(--muted-2);font-size:.95rem;padding:26px 4px;line-height:1.6}

/* styles.css .field spacing is tuned for the contact form; the wizard stacks
   many more of them, so it needs its own rhythm. */
.step-panel .field{gap:8px}
.step-panel .frow{gap:18px}
.step-panel .field input.invalid,
.step-panel .field textarea.invalid{border-color:rgba(255,140,120,.7);background:rgba(255,140,120,.05)}

/* ---------- service picker ---------- */
.svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:820px){.svc-grid{grid-template-columns:1fr}}
.svc{
  position:relative;text-align:left;background:var(--ink-2);border:1px solid var(--line);
  border-radius:16px;padding:28px 26px 26px;cursor:pointer;display:flex;flex-direction:column;gap:11px;
  font-family:inherit;color:inherit;transition:border-color .25s,transform .25s,background .25s;
}
.svc:hover{transform:translateY(-3px);border-color:var(--line-2)}
.svc.on{border-color:rgba(199,249,75,.42);background:linear-gradient(168deg,rgba(199,249,75,.07),var(--ink-2) 55%);box-shadow:0 0 46px rgba(199,249,75,.07)}
.svc-tick{
  position:absolute;top:22px;right:22px;width:22px;height:22px;border-radius:50%;
  border:1px solid var(--line-2);transition:all .2s;
}
.svc.on .svc-tick{background:var(--signal);border-color:var(--signal)}
.svc.on .svc-tick::after{
  content:"";position:absolute;left:7px;top:3px;width:6px;height:11px;
  border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(42deg);
}
.svc-tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;color:var(--muted-2)}
/* Mono + wide tracking is a Latin-caps treatment; CJK falls back to a system
   face where that spacing reads as broken. */
html.zh .svc-tag{font-family:var(--sans-cjk);letter-spacing:.06em;font-size:12px;font-weight:600}
.svc-name{font-family:var(--serif);font-size:1.6rem;font-weight:400;line-height:1.1;padding-right:34px}
html.zh .svc-name{font-family:var(--serif-cjk);font-weight:600;font-size:1.32rem}
.svc.on .svc-name{color:var(--signal)}
.svc-desc{color:var(--muted);font-size:.96rem;line-height:1.58}
.svc-out{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--muted-2);
  line-height:1.6;margin-top:6px;padding-top:14px;border-top:1px solid var(--line);
}
html.zh .svc-out{font-family:var(--sans-cjk);letter-spacing:.01em;font-size:12.5px}

/* ---------- chips ---------- */
.chip-row{display:flex;flex-wrap:wrap;gap:8px}
.chip-row.tight{gap:6px;margin-top:-6px}
.chip-t{
  font-family:var(--sans);font-size:13px;font-weight:500;background:none;
  border:1px solid var(--line-2);color:var(--muted);padding:7px 13px;border-radius:20px;
  cursor:pointer;transition:all .18s;
}
html.zh .chip-t{font-family:var(--sans-cjk)}
.chip-t:hover{border-color:var(--muted-2);color:var(--fg)}
.chip-t.on{background:var(--signal);border-color:var(--signal);color:var(--ink);font-weight:600}
.chip-t em{font-family:var(--mono);font-style:normal;font-size:11px;opacity:.65;margin-left:3px}

/* ---------- competitors ---------- */
.comp-list{display:flex;flex-direction:column;gap:10px}
.comp-row{display:grid;grid-template-columns:1fr 1fr 38px;gap:10px;align-items:center}
@media(max-width:620px){.comp-row{grid-template-columns:1fr 38px}.comp-row .fin:nth-child(2){grid-column:1/2}}
.fin{
  font-family:var(--sans);font-size:15px;color:var(--fg);
  background:rgba(10,12,13,.55);border:1px solid var(--line-2);border-radius:9px;
  padding:11px 13px;width:100%;transition:border-color .2s,background .2s;
}
html.zh .fin{font-family:var(--sans-cjk)}
.fin::placeholder{color:var(--muted-2);opacity:.75}
.fin:focus{outline:none;border-color:var(--signal);background:rgba(10,12,13,.8)}
.icon-btn{
  width:34px;height:34px;flex:none;display:grid;place-items:center;
  background:none;border:1px solid var(--line);color:var(--muted-2);
  border-radius:8px;cursor:pointer;font-size:19px;line-height:1;
  transition:border-color .2s,color .2s;
}
.icon-btn:hover{border-color:rgba(255,140,120,.5);color:#FFB4A2}

/* ---------- buttons ---------- */
.btn-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.mini-btn{
  font-family:var(--sans);font-size:13.5px;font-weight:600;background:none;
  border:1px solid var(--line-2);color:var(--fg);padding:10px 16px;border-radius:8px;
  cursor:pointer;transition:border-color .2s,color .2s;
}
html.zh .mini-btn{font-family:var(--sans-cjk)}
.mini-btn:hover{border-color:var(--signal);color:var(--signal)}
.mini-btn[disabled]{opacity:.5;cursor:default}
.btn.sm{padding:10px 18px;font-size:14px;border:none;cursor:pointer;font-family:var(--sans)}
html.zh .btn.sm{font-family:var(--sans-cjk)}
.count{font-family:var(--mono);font-size:12px;color:var(--muted-2);margin-left:auto}
html.zh .count{font-family:var(--sans-cjk);font-size:13px}

/* ---------- intents ---------- */
.intent-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:680px){.intent-grid{grid-template-columns:1fr}}
.intent{
  text-align:left;background:var(--ink-2);border:1px solid var(--line);border-radius:11px;
  padding:15px 17px;cursor:pointer;display:flex;flex-direction:column;gap:4px;
  font-family:inherit;color:inherit;transition:all .2s;
}
.intent:hover{border-color:var(--line-2)}
.intent.on{border-color:rgba(199,249,75,.42);background:linear-gradient(150deg,rgba(199,249,75,.07),var(--ink-2) 60%)}
.intent .it{font-size:.98rem;font-weight:600;color:var(--fg)}
.intent.on .it{color:var(--signal)}
.intent .ix{font-family:var(--mono);font-size:11.5px;color:var(--muted-2);line-height:1.5}
html.zh .intent .ix{font-family:var(--sans-cjk);font-size:12.5px}

/* ---------- prompt list ---------- */
.prompt-list{display:flex;flex-direction:column;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.prompt-list:empty{display:none}
.prow{display:grid;grid-template-columns:auto 1fr auto;gap:13px;align-items:start;background:var(--ink);padding:14px 16px;transition:background .2s}
.prow:hover{background:var(--ink-2)}
.prow.on{background:linear-gradient(100deg,rgba(199,249,75,.05),var(--ink) 55%)}
.pcheck{
  flex:none;width:19px;height:19px;margin-top:4px;border-radius:5px;
  border:1px solid var(--line-2);background:none;cursor:pointer;position:relative;transition:all .18s;
}
.pcheck:hover{border-color:var(--signal)}
.prow.on .pcheck{background:var(--signal);border-color:var(--signal)}
.prow.on .pcheck::after{
  content:"";position:absolute;left:6px;top:2px;width:5px;height:9px;
  border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(42deg);
}
.pbody{min-width:0;display:flex;flex-direction:column;gap:7px}
.ptext{
  font-family:var(--sans);font-size:15px;line-height:1.5;color:var(--fg);
  background:none;border:1px solid transparent;border-radius:6px;padding:3px 6px;margin-left:-6px;
  width:100%;resize:none;overflow:hidden;transition:border-color .2s,background .2s;
}
html.zh .ptext{font-family:var(--sans-cjk)}
.ptext:hover{border-color:var(--line)}
.ptext:focus{outline:none;border-color:var(--signal);background:rgba(10,12,13,.6)}
.pmeta{display:flex;flex-wrap:wrap;gap:6px}
.badge{
  font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--signal);border:1px solid rgba(199,249,75,.3);background:rgba(199,249,75,.06);
  padding:2px 7px;border-radius:4px;
}
html.zh .badge{font-family:var(--sans-cjk);letter-spacing:0;text-transform:none;font-size:11px}
.badge.dim{color:var(--muted-2);border-color:var(--line-2);background:none}

.add-box{
  background:var(--ink-2);border:1px solid var(--line);border-radius:12px;
  padding:20px 20px 18px;display:flex;flex-direction:column;gap:13px;
}

/* ---------- surfaces ---------- */
.surf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:820px){.surf-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.surf-grid{grid-template-columns:1fr}}
.surf{
  text-align:left;background:var(--ink-2);border:1px solid var(--line);border-radius:11px;
  padding:15px 16px;cursor:pointer;display:flex;flex-direction:column;gap:4px;
  font-family:inherit;color:inherit;transition:all .2s;
}
.surf:hover{border-color:var(--line-2);transform:translateY(-2px)}
.surf.on{border-color:rgba(199,249,75,.45);background:linear-gradient(150deg,rgba(199,249,75,.08),var(--ink-2) 60%)}
.sname{font-size:.99rem;font-weight:600;color:var(--fg)}
.surf.on .sname{color:var(--signal)}
.snote{color:var(--muted-2);font-size:.83rem;line-height:1.45}
.sprice{font-family:var(--mono);font-size:11px;color:var(--muted-2);margin-top:5px}

.sample-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:680px){.sample-grid{grid-template-columns:1fr}}
.sample{
  text-align:left;background:var(--ink-2);border:1px solid var(--line);border-radius:11px;
  padding:17px 18px;cursor:pointer;display:flex;flex-direction:column;gap:5px;
  font-family:inherit;color:inherit;transition:all .2s;
}
.sample:hover{border-color:var(--line-2)}
.sample.on{border-color:rgba(199,249,75,.45);background:linear-gradient(150deg,rgba(199,249,75,.08),var(--ink-2) 60%)}
.sample .sn{font-family:var(--mono);font-size:1.5rem;font-weight:700;color:var(--signal);line-height:1}
.sample .st{font-size:.96rem;font-weight:600;color:var(--fg)}
.sample .snote{font-size:.83rem}

/* ---------- audit checklist ---------- */
.check-list ul{list-style:none;display:flex;flex-direction:column;gap:11px;margin-top:14px}
.check-list li{font-size:.96rem;line-height:1.55;color:var(--muted);padding-left:24px;position:relative}
.check-list li::before{content:"+";position:absolute;left:0;color:var(--signal);font-family:var(--mono);font-weight:700}
.check-list li b{color:var(--fg);font-weight:600}

/* ---------- quote ---------- */
.quote-box{background:var(--ink-2);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.qtable{width:100%;border-collapse:collapse;font-size:.95rem}
.qtable td{padding:15px 20px;border-bottom:1px solid var(--line);vertical-align:top}
.qtable tbody tr:last-child td{border-bottom:1px solid var(--line-2)}
.ql{display:block;color:var(--fg);font-weight:600}
.qd{display:block;color:var(--muted-2);font-size:.84rem;line-height:1.5;margin-top:3px}
.qa{font-family:var(--mono);font-size:.98rem;color:var(--fg);text-align:right;white-space:nowrap;width:1%}
.qdisc .ql{color:var(--signal)}
.qdisc .qa{color:var(--signal)}
.qtable tfoot td{padding:19px 20px;border:none;font-weight:600;color:var(--fg);font-size:1.02rem}
.qtotal{font-family:var(--mono);font-size:1.6rem!important;color:var(--signal)!important;font-weight:700}

/* ---------- review summary ---------- */
.summary{display:flex;flex-direction:column;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.sum-row{display:grid;grid-template-columns:170px 1fr;gap:16px;background:var(--ink);padding:12px 18px}
@media(max-width:620px){.sum-row{grid-template-columns:1fr;gap:3px}}
.sk{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);padding-top:3px}
html.zh .sk{font-family:var(--sans-cjk);letter-spacing:.02em;font-size:12.5px;text-transform:none}
.sv{color:var(--fg);font-size:.95rem;line-height:1.5;word-break:break-word}

.submit-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:6px}
.submit-row .btn{border:none;cursor:pointer;font-family:var(--sans);font-size:15px}
html.zh .submit-row .btn{font-family:var(--sans-cjk)}
.submit-row .btn[disabled]{opacity:.55;cursor:default;transform:none;box-shadow:none}

/* ---------- flash ---------- */
.flash{font-size:.93rem;line-height:1.55;padding:11px 15px;border-radius:9px;color:var(--muted);background:var(--ink-2);border:1px solid var(--line)}
.flash.ok{color:var(--signal);background:rgba(199,249,75,.08);border-color:rgba(199,249,75,.3)}
.flash.err{color:#FFB4A2;background:rgba(255,140,120,.07);border-color:rgba(255,140,120,.3)}

/* ---------- step footer ---------- */
.step-footer{margin-top:34px;padding-top:24px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
.sf-row{display:flex;align-items:center;gap:16px}
.step-count{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;color:var(--muted-2);margin:0 auto}
html.zh .step-count{font-family:var(--sans-cjk);letter-spacing:.02em;font-size:13px}
.sf-row .btn{margin-left:0}

/* ---------- done ---------- */
.done-panel{align-items:flex-start;padding-top:20px}
.done-mark{
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:var(--signal);color:var(--ink);font-size:23px;font-weight:700;
}
.done-card{background:var(--ink-2);border:1px solid var(--line-2);border-radius:14px;overflow:hidden;width:100%;max-width:520px}
.done-row{display:grid;grid-template-columns:170px 1fr;gap:16px;padding:15px 20px;border-bottom:1px solid var(--line)}
.done-row:last-child{border-bottom:none}
@media(max-width:560px){.done-row{grid-template-columns:1fr;gap:4px}}
.dk{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);padding-top:4px}
html.zh .dk{font-family:var(--sans-cjk);letter-spacing:.02em;font-size:12.5px;text-transform:none}
.dv{color:var(--fg);font-size:1.02rem}
.dv.mono{font-family:var(--mono);color:var(--signal);font-weight:700;letter-spacing:.02em}
.cta-btns.left{justify-content:flex-start;margin-top:4px}

/* ---------- pay block (revealed by Start on the last step) ---------- */
.pay-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:18px}
.pay-row .btn{border:none;cursor:pointer;font-family:var(--sans);font-size:15px}
html.zh .pay-row .btn{font-family:var(--sans-cjk)}
.pay-row .btn[disabled]{opacity:.55;cursor:default;transform:none;box-shadow:none}
#payBlock{animation:reveal .32s cubic-bezier(.2,.7,.2,1) both}
@keyframes reveal{from{opacity:0;transform:translateY(10px)}}

/* ================= audit run view (/start/audit/) ================= */

.audit-progress{margin-bottom:56px}
.ap-bar{height:4px;background:var(--ink-3);border-radius:3px;overflow:hidden;border:1px solid var(--line)}
.ap-fill{display:block;height:100%;width:0;background:var(--signal);box-shadow:0 0 14px var(--signal-dim);transition:width .5s cubic-bezier(.2,.7,.2,1)}
.ap-meta{
  display:flex;justify-content:space-between;gap:16px;margin-top:12px;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--muted-2);
}
html.zh .ap-meta{font-family:var(--sans-cjk);letter-spacing:.02em;font-size:13px}

.ap-list{list-style:none;margin-top:26px;display:flex;flex-direction:column;gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.ap-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;
  background:var(--ink);padding:16px 20px;transition:background .3s}
.ap-item.pending{opacity:.45}
.ap-item.done{background:var(--ink-2)}
.ap-dot{width:9px;height:9px;border-radius:50%;background:var(--line-2);flex:none;transition:all .3s}
.ap-item.running .ap-dot{background:var(--signal);box-shadow:0 0 12px var(--signal);animation:pulse 1.3s ease-in-out infinite}
.ap-item.v-pass .ap-dot{background:var(--signal)}
.ap-item.v-warn .ap-dot{background:#E8C86A}
.ap-item.v-fail .ap-dot{background:#FF8C78}
.ap-label{font-size:1rem;color:var(--fg);font-weight:500}
.ap-state{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--muted-2)}
html.zh .ap-state{font-family:var(--sans-cjk);letter-spacing:.02em;font-size:12.5px}
.ap-verdict{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  padding:3px 9px;border-radius:4px;border:1px solid}
html.zh .ap-verdict{font-family:var(--sans-cjk);letter-spacing:0;text-transform:none;font-size:12px}
.ap-verdict.pass{color:var(--signal);border-color:rgba(199,249,75,.35);background:rgba(199,249,75,.07)}
.ap-verdict.warn{color:#E8C86A;border-color:rgba(232,200,106,.35);background:rgba(232,200,106,.07)}
.ap-verdict.fail{color:#FF8C78;border-color:rgba(255,140,120,.35);background:rgba(255,140,120,.07)}

/* ---- score ---- */
.audit-report{animation:reveal .5s cubic-bezier(.2,.7,.2,1) both}
.score-card{display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:center;
  background:var(--ink-2);border:1px solid var(--line-2);border-radius:18px;padding:34px 32px;margin-bottom:44px}
@media(max-width:680px){.score-card{grid-template-columns:1fr;gap:22px}}
.score-dial{
  position:relative;width:132px;height:132px;border-radius:50%;display:grid;place-items:center;
  background:conic-gradient(var(--dial) calc(var(--pct)), var(--ink-3) 0);
}
.score-dial::after{content:"";position:absolute;inset:9px;border-radius:50%;background:var(--ink-2)}
.score-dial.band-good{--dial:var(--signal)}
.score-dial.band-mid{--dial:#E8C86A}
.score-dial.band-bad{--dial:#FF8C78}
.score-num{position:relative;z-index:1;font-family:var(--mono);font-size:2.9rem;font-weight:700;color:var(--fg);line-height:1}
.score-of{position:relative;z-index:1;font-family:var(--mono);font-size:11px;color:var(--muted-2);margin-top:2px}
.score-say .sp-title{margin-bottom:10px}

/* ---- findings ---- */
.findings{display:flex;flex-direction:column;gap:14px}
.fcard{background:var(--ink-2);border:1px solid var(--line);border-left-width:3px;border-radius:12px;padding:20px 22px}
.fcard.v-pass{border-left-color:var(--signal)}
.fcard.v-warn{border-left-color:#E8C86A}
.fcard.v-fail{border-left-color:#FF8C78}
.fc-head{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.fc-rank{font-family:var(--mono);font-size:11px;color:var(--muted-2);border:1px solid var(--line-2);
  width:22px;height:22px;border-radius:50%;display:grid;place-items:center;flex:none}
.fc-title{font-size:1.06rem;font-weight:600;color:var(--fg);margin-right:auto}
.fc-score{font-family:var(--mono);font-size:1.1rem;color:var(--muted)}
.fi{padding:10px 0;border-top:1px solid var(--line)}
.fi:first-of-type{border-top:none;padding-top:0}
.fi-detail{font-size:.97rem;line-height:1.6;color:var(--fg)}
.fi-cost{font-size:.9rem;line-height:1.6;color:var(--muted-2);margin-top:6px;padding-left:14px;border-left:2px solid var(--line-2)}
.fi.pass .fi-detail{color:var(--muted)}

/* ---- closing CTA ---- */
.audit-cta{
  margin-top:52px;padding:44px 40px;border-radius:20px;position:relative;overflow:hidden;
  background:linear-gradient(150deg,rgba(199,249,75,.08),var(--ink-2) 58%);
  border:1px solid rgba(199,249,75,.32);
}
.cta-h{font-family:var(--serif);font-size:clamp(1.7rem,3.4vw,2.4rem);font-weight:400;line-height:1.1}
html.zh .cta-h{font-family:var(--serif-cjk);font-weight:600;font-size:clamp(1.45rem,3vw,2rem)}
.cta-p{color:var(--fg);font-size:1.04rem;line-height:1.68;max-width:44em;margin:16px 0 26px}
.cta-fine{color:var(--muted-2);font-size:.85rem;line-height:1.55;margin-top:18px;max-width:44em}
.audit-ref{
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--muted-2);
  margin-top:36px;text-align:center;
}
html.zh .audit-ref{font-family:var(--sans-cjk);letter-spacing:.02em;font-size:12.5px}

/* ---------- Studio wordmark + way back ---------- */
/* Inside the app the marketing logo is the wrong identity: this is Signal
   Studio's workspace, and the only marketing link that still earns its place
   is the one back to Signal Research. */
.studio-mark{
  display:flex;align-items:baseline;gap:9px;text-decoration:none;color:var(--fg);
  font-family:var(--sans);font-weight:700;font-size:17px;letter-spacing:.16em;
}
html.zh .studio-mark{font-family:var(--sans)} /* the wordmark stays Latin in both languages */
.studio-mark .sm-dot{
  width:9px;height:9px;border-radius:50%;background:var(--signal);
  box-shadow:0 0 12px var(--signal);animation:pulse 2.4s ease-in-out infinite;
  align-self:center;flex:none;
}
.studio-mark .sm-sub{color:var(--signal);font-weight:500}
.studio-mark:hover .sm-sub{color:var(--fg)}

.nav-back{
  font-family:var(--sans);font-size:13.5px;font-weight:500;color:var(--muted);
  text-decoration:none;letter-spacing:.01em;transition:color .2s;white-space:nowrap;
}
html.zh .nav-back{font-family:var(--sans-cjk)}
.nav-back:hover{color:var(--fg)}
@media(max-width:560px){.nav-back{display:none}}