/* Text-only build: CSS/type artifacts that stand in for the sketch illustrations. No image assets. */
.art{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-lg);padding:24px;display:flex;flex-direction:column;gap:16px}
.art-h{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.art-b{display:flex;flex-direction:column;gap:16px;flex:1;justify-content:center;min-height:0}
.art-f{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-top:1px dashed var(--line);padding-top:14px;color:var(--muted);font-size:14.5px}
.lr{display:grid;grid-template-columns:1fr auto;gap:7px 12px;font-size:15px;font-weight:600;color:var(--ink-2)}
.lr .mono{font-weight:600;font-size:16.5px;color:var(--ink)}
.bar{grid-column:1/-1;height:9px;border-radius:99px;background:var(--bg-alt);overflow:hidden}
.bar b{display:block;height:100%;border-radius:99px}
.good{color:var(--mint-ink)}
.bad{color:var(--coral-ink)}
.chartwrap{display:flex;gap:12px;flex:1;min-height:0}
.chartwrap svg{flex:1;min-width:0;height:100%}
.yax{display:flex;flex-direction:column;justify-content:space-between;font-size:11.5px;color:var(--muted);padding:2px 0}
.xax{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted)}
.rcpt{display:flex;flex-direction:column}
.rcpt div{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14.5px;padding:10px 0;border-bottom:1px solid var(--line);color:var(--ink-2)}
.rcpt div:last-child{border-bottom:0}
.rcpt .mono{color:var(--ink);font-weight:600}
.rcpt .flag{color:var(--amber-ink);font-weight:700}
.rcpt .flag .mono{color:var(--amber-ink)}
.chip{font-family:'JetBrains Mono',monospace;font-size:11.5px;padding:4px 9px;border-radius:8px;background:var(--bg-alt);color:var(--muted);white-space:nowrap}
.ask{font-family:'JetBrains Mono',monospace;font-size:14px;color:var(--ink-2);background:var(--bg-alt);border:1px solid var(--line);padding:12px 14px;border-radius:12px}
.band{display:grid;grid-template-columns:1.25fr 1fr;gap:34px;align-items:center;padding:clamp(24px,3vw,36px);border-radius:var(--r);background:var(--bg-alt);border:1px solid var(--line)}
.band>*{min-width:0}
.band-l{display:flex;flex-direction:column;gap:12px}
.band-l .hand{font-size:26px;color:var(--violet)}
.band-r{display:flex;gap:28px;flex-wrap:wrap}
.band-r div{display:flex;flex-direction:column;gap:3px;font-size:14px}
.bigp{font-family:'JetBrains Mono',monospace;font-size:clamp(24px,2.4vw,31px);font-weight:500;letter-spacing:-.02em;color:var(--ink)}
@media(max-width:900px){.band{grid-template-columns:1fr}}

@media(max-width:640px){
.art{height:auto!important;padding:18px}
.art-h{flex-direction:column;align-items:flex-start;gap:4px}
.art-f{flex-direction:column;align-items:flex-start;gap:8px}
.rcpt div{flex-direction:column;align-items:flex-start;gap:2px;padding:12px 0}
.rcpt .mono{font-size:16px}
.rcpt div.muted{flex-direction:row;justify-content:center;align-items:center}
.lr{grid-template-columns:1fr;gap:4px}
.lr .bar{margin-top:2px}
}
