/* Overomat components (CLAUDE.md section 3, build target C3 and IBM Plex). Shared by the site and the Stav pages.
   Colours only through the tokens (tokens.css): verdict colours are var(--v-*), defined once per page.
   Verdict words: white on the verdict colour (contrast computed by check_brand.py). Amber is never text.
   Margin and padding come only from the 8 px scale (--sp-*). */
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.num{font-family:var(--font-mono);font-weight:500;font-variant-numeric:tabular-nums}
/* icon: E2 face from verdicts_final, decorative next to the word */
.vicon{display:inline-block;width:var(--s);height:var(--s);flex:none;line-height:0}
.vicon svg{width:100%;height:100%}
/* verdict pill: face plus word, white on the verdict colour; qualifier: blue word on its tint */
.vstamp{display:inline-flex;align-items:center;gap:var(--sp-1);font-family:var(--font-sans);font-weight:700;font-size:var(--fs--1);letter-spacing:.04em;
 line-height:2;text-transform:uppercase;color:var(--c-white);background:var(--vc);border:2px solid var(--vc);border-radius:var(--radius-s);padding:0 var(--sp-1) 0 0;white-space:nowrap}
.vstamp .vicon{box-sizing:content-box;display:flex;align-items:center;align-self:stretch;height:auto;background:var(--c-white);border-radius:var(--radius-s) 0 0 var(--radius-s);padding:0 var(--sp-1)}
.vstamp .vicon svg{width:var(--s);height:var(--s)}
.vstamp.q{color:var(--c-blue);background:var(--qc);border-color:var(--qc)}
.vstamp.q .vicon{background:transparent}
.vstamp.big{font-size:var(--fs-0)}
.vline{display:inline-flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1)}
.vplus{font-family:var(--font-sans);font-weight:700;color:var(--c-slate)}
/* source tag under a number: Plex Mono, slate */
.src{display:block;font-family:var(--font-mono);font-size:var(--fs--1);line-height:1.4;color:var(--c-slate)}
a.src,.src a{color:var(--c-slate);text-decoration:underline;text-decoration-color:var(--c-tint-blue);text-underline-offset:2px}
/* receipt slip: claim box, tear line, verdict, number, calculation, source, footer line; straight (0 degrees) */
.slip{margin:0}
.slip .claim{margin:0;background:var(--c-white);border:var(--border);border-bottom:0;border-radius:var(--radius) var(--radius) 0 0;padding:var(--sp-2);font-weight:500}
.receipt{position:relative;background:var(--c-white);border:var(--border);border-radius:0 0 var(--radius) var(--radius);padding:var(--sp-2)}
.slip .claim+.receipt{border-top:2px dashed var(--c-line)}
.slip>.receipt:first-child{border-radius:var(--radius)}
.slip-num{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-3);line-height:1.1;margin:var(--sp-2) 0 0;color:var(--c-blue)}
.calc{font-family:var(--font-mono);font-size:var(--fs--1);margin:var(--sp-1) 0 0}
.slip-foot{font-family:var(--font-mono);font-size:var(--fs--1);letter-spacing:.04em;color:var(--c-slate);border-top:var(--border);margin:var(--sp-2) 0 0;padding:var(--sp-1) 0 0}
.slip-tab{position:absolute;right:var(--sp-2);bottom:calc(-1 * var(--sp-3));background:var(--c-blue);color:var(--c-white);font-size:var(--fs--1);font-weight:600;text-decoration:none;border-radius:0 0 var(--radius-s) var(--radius-s);padding:0 var(--sp-2)}
.slip-tab:hover,.slip-tab:focus{text-decoration:underline}
/* benchmark bar: entity in blue, comparison in tint blue, shared zero line */
.bench{position:relative;display:grid;gap:var(--sp-1);margin:var(--sp-1) 0}
.bench-row{position:relative;display:block;background:var(--c-panel);border-radius:2px;height:10px}
.bench-bar{position:absolute;top:0;display:block;height:10px;border-radius:2px}
.bench-zero{position:absolute;top:-2px;bottom:-2px;width:2px;transform:translateX(-1px);background:var(--c-blue)}
.bench-bar.e,.key.e{background:var(--c-blue)}
.bench-bar.a,.key.a{background:var(--c-tint-blue)}
.key{display:inline-block;width:10px;height:10px;border-radius:2px;margin:0 var(--sp-1) 0 0;vertical-align:baseline}
.key.a{margin-left:var(--sp-1)}
.navg{font-size:var(--fs--1);color:var(--c-slate);margin:0}
/* number card */
.ncard{background:var(--c-white);border:var(--border);border-radius:var(--radius);padding:var(--sp-2) var(--sp-3)}
.nlabel{font-weight:600;margin:0}
.nbig{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-4);line-height:1.1;margin:var(--sp-1) 0 0;color:var(--c-blue)}
.ukazka-label{display:inline-block;font-family:var(--font-sans);font-size:var(--fs--1);font-weight:600;color:var(--c-blue);
 border:1px solid var(--c-blue);border-radius:var(--radius-s);padding:0 var(--sp-1)}
/* L9 seal S10-6 (never red) */
.seal{display:inline-block;flex:none;line-height:0;width:var(--s);height:var(--s)}
.seal svg{width:100%;height:100%}
/* subscription tier card; prices are offer constants (data-static) */
.tier{background:var(--c-white);border:var(--border);border-radius:var(--radius);padding:var(--sp-3)}
.tier.featured{border:2px solid var(--c-blue)}
.tier h3{margin:0}
.tier .price{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-3);color:var(--c-blue);line-height:1.1;margin:var(--sp-1) 0}
.tier .per{font-family:var(--font-sans);font-size:var(--fs--1);font-weight:500;color:var(--c-slate)}
.tier .speed{font-family:var(--font-mono);font-size:var(--fs--1);color:var(--c-slate);margin:var(--sp-1) 0}
.bridge{border:var(--border);border-radius:var(--radius);padding:var(--sp-2);background:var(--c-panel)}
/* visible placeholder ([MISSING ...] and [DECIDE ...]): dashed slate outline, blue text (amber is only the brand dot) */
.ph{color:var(--c-blue);background:var(--c-white);outline:2px dashed var(--c-slate);outline-offset:1px;border-radius:2px;padding:0 var(--sp-1)}
/* CTA block */
.cta{background:var(--c-white);border:2px solid var(--c-blue);border-radius:var(--radius);padding:var(--sp-3)}
.cta-h{font-family:var(--font-serif);font-weight:600;font-size:var(--fs-2);line-height:var(--lh-head);margin:0}
.cta .facts{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-1) var(--sp-2);margin:var(--sp-2) 0 0}
.cta dt{font-weight:600}
.cta dd{margin:0}
.cta .qr{margin:var(--sp-2) 0 0}
/* grouped dt/dd rows (a hold may wrap one row) */
dl>div{display:contents}
.guarantee{margin:0;border-left:4px solid var(--c-blue);background:var(--c-white);padding:var(--sp-2) var(--sp-3)}
.guarantee p{font-family:var(--font-serif);font-weight:600;font-size:var(--fs-1);margin:0 0 var(--sp-1)}
.guarantee footer{color:var(--c-slate)}
.limits{margin:0 0 var(--sp-2)}
.legend-block .kicker{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1)}
/* touch target: source tags that are links are at least 24 px tall (WCAG 2.2 target size) */
a.src{display:flex;align-items:center;min-height:24px}
