/* ==========================================================================
   b2b.prasada.cloud — "Extras"
   The state registry extract, alive.

   Spectral is the document's own voice (titles, field labels, the certification
   statement); Libre Franklin is the data and the controls. Hairline rules divide
   where a dashboard would draw boxes — an extract is ruled, not carded. One
   certification green owns the validity apparatus, and that apparatus reports
   real provenance rather than decorating the page.

   See DESIGN.md.
   ========================================================================== */

/* --- Faces ---------------------------------------------------------------
   Self-hosted with Cyrillic subsets: much of the registry's people data is
   Cyrillic, and a Latin-only build renders those real records in a fallback. */

@font-face { font-family:'Spectral'; font-weight:400; font-style:normal; font-display:swap;
  src:url('fonts/Spectral-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2192,U+2212,U+2215; }
@font-face { font-family:'Spectral'; font-weight:400; font-style:normal; font-display:swap;
  src:url('fonts/Spectral-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Spectral'; font-weight:400; font-style:normal; font-display:swap;
  src:url('fonts/Spectral-400-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family:'Spectral'; font-weight:600; font-style:normal; font-display:swap;
  src:url('fonts/Spectral-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2192,U+2212,U+2215; }
@font-face { font-family:'Spectral'; font-weight:600; font-style:normal; font-display:swap;
  src:url('fonts/Spectral-600-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Spectral'; font-weight:600; font-style:normal; font-display:swap;
  src:url('fonts/Spectral-600-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }

@font-face { font-family:'Libre Franklin'; font-weight:400; font-style:normal; font-display:swap;
  src:url('fonts/LibreFranklin-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2192,U+2212,U+2215; }
@font-face { font-family:'Libre Franklin'; font-weight:400; font-style:normal; font-display:swap;
  src:url('fonts/LibreFranklin-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Libre Franklin'; font-weight:400; font-style:normal; font-display:swap;
  src:url('fonts/LibreFranklin-400-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family:'Libre Franklin'; font-weight:500; font-style:normal; font-display:swap;
  src:url('fonts/LibreFranklin-500-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2192,U+2212,U+2215; }
@font-face { font-family:'Libre Franklin'; font-weight:500; font-style:normal; font-display:swap;
  src:url('fonts/LibreFranklin-500-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family:'Libre Franklin'; font-weight:600; font-style:normal; font-display:swap;
  src:url('fonts/LibreFranklin-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2192,U+2212,U+2215; }
@font-face { font-family:'Libre Franklin'; font-weight:600; font-style:normal; font-display:swap;
  src:url('fonts/LibreFranklin-600-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Libre Franklin'; font-weight:600; font-style:normal; font-display:swap;
  src:url('fonts/LibreFranklin-600-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family:'Libre Franklin'; font-weight:700; font-style:normal; font-display:swap;
  src:url('fonts/LibreFranklin-700-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2192,U+2212,U+2215; }

/* --- Tokens -------------------------------------------------------------- */

:root {
  /* Cool paper, deliberately not cream: this sits beside a printed contract
     under office light, and cream is the reflexive default, not a decision. */
  --paper:#FAFAF7; --paper-sunk:#F0F1EB;
  --ink:#14171A; --ink-2:#454C52; --ink-3:#666D73;
  --rule:#D5D7CE; --rule-strong:#14171A;

  /* The validity apparatus, and nothing else. */
  --cert:#1F5C4A; --cert-deep:#15412F; --cert-tint:#E6EFE9;

  /* The two degraded states of a record. */
  --superseded:#7A5200; --superseded-tint:#F6EFDD;
  --struck:#93261F; --struck-tint:#F7E9E7;

  /* Five steps, each ≥1.25 from the last. Secondary text separates by colour
     and weight, never by a half-step of size. */
  --t-label:0.75rem; --t-base:1rem; --t-lg:1.25rem; --t-xl:1.75rem; --t-display:2.5rem;

  --doc:'Spectral', Georgia, 'Times New Roman', serif;
  --data:'Libre Franklin', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --measure:72ch;
  --gutter:clamp(1.25rem, 4vw, 3rem);
  --ease:cubic-bezier(0.16, 1, 0.3, 1);
}

*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }

body {
  margin:0; background:var(--paper); color:var(--ink);
  font:400 var(--t-base)/1.6 var(--data);
  font-synthesis-weight:none; text-rendering:optimizeLegibility;
}

/* --- Browser surfaces: the parts we did not draw still carry the design --- */

::selection { background:var(--cert); color:var(--paper); }
::placeholder { color:var(--ink-3); opacity:1; }
:focus-visible { outline:2px solid var(--cert); outline-offset:2px; border-radius:1px; }

* { scrollbar-width:thin; scrollbar-color:var(--rule) transparent; }
*::-webkit-scrollbar { width:10px; height:10px; }
*::-webkit-scrollbar-track { background:transparent; }
*::-webkit-scrollbar-thumb { background:var(--rule); border:3px solid var(--paper); border-radius:99px; }
*::-webkit-scrollbar-thumb:hover { background:var(--ink-3); }

a { color:var(--cert); text-decoration-thickness:1px; text-underline-offset:0.18em; }
a:hover { color:var(--cert-deep); }

/* Identifiers are measured values: columns must hold as digits change. */
.num { font-variant-numeric:tabular-nums; letter-spacing:0.01em; }

/* --- Document furniture -------------------------------------------------- */

.sheet { max-width:78rem; margin:0 auto; padding:0 var(--gutter); }

.masthead { display:flex; flex-wrap:wrap; align-items:flex-end; gap:1rem 2rem;
  padding:1.75rem 0 1rem; border-bottom:2px solid var(--rule-strong); }
.masthead__issuer { flex:1 1 20rem; margin:0; font:600 var(--t-lg)/1.3 var(--doc); letter-spacing:-0.01em; }
.masthead__issuer span { display:block; margin-bottom:0.35rem; font:600 var(--t-label)/1.4 var(--data);
  letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-3); }
.masthead__issuer a { color:inherit; }

/* The validity seal. Not decoration: it carries the snapshot the whole surface
   answers from, and changes state when that answer goes stale. */
.seal { position:relative; display:grid; gap:0.15rem; min-width:15rem;
  padding:0.7rem 1rem 0.7rem 3.1rem; border:1px solid var(--cert); border-radius:2px;
  background:repeating-linear-gradient(-45deg, transparent 0 5px, rgba(31,92,74,0.045) 5px 6px), var(--cert-tint);
  color:var(--cert-deep); }
.seal__mark { position:absolute; left:0.85rem; top:50%; transform:translateY(-50%); }
.seal__label { font-size:var(--t-label); font-weight:600; letter-spacing:0.1em; text-transform:uppercase; }
.seal__value { font:600 var(--t-base)/1.4 var(--doc); }
.seal__meta { font-size:var(--t-label); color:var(--cert); }
.seal[data-state='stale'] { border-color:var(--superseded); background:var(--superseded-tint); color:#5C3E00; }
.seal[data-state='stale'] .seal__meta { color:var(--superseded); }
.seal[data-state='unknown'] { border-color:var(--rule); background:var(--paper-sunk); color:var(--ink-2); }
.seal[data-state='unknown'] .seal__meta { color:var(--ink-3); }

/* --- The request line: a form field on a document, not a website search --- */

.request { padding:2.25rem 0 1.5rem; }
.request__label { display:block; margin-bottom:0.5rem; font-size:var(--t-label); font-weight:600;
  letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-3); }
.request__line { display:flex; align-items:stretch; gap:0.75rem; border-bottom:2px solid var(--rule-strong); }
.request__line:focus-within { border-bottom-color:var(--cert); }
.request__field { flex:1; min-width:0; border:0; background:transparent; padding:0.35rem 0 0.6rem;
  font:400 var(--t-xl)/1.25 var(--doc); color:var(--ink); }
.request__field:focus { outline:none; }
/* The native search affordance is unstyleable across engines and reads as
   foreign chrome on a document; the request button is the affordance here. */
.request__field::-webkit-search-cancel-button,
.request__field::-webkit-search-decoration { -webkit-appearance:none; appearance:none; }

.request__submit { border:0; border-radius:2px; margin-bottom:0.4rem; padding:0 1.25rem; cursor:pointer;
  background:var(--ink); color:var(--paper); font:600 var(--t-label)/1 var(--data);
  letter-spacing:0.12em; text-transform:uppercase; transition:background 0.18s var(--ease); }
.request__submit:hover { background:var(--cert); }
.request__submit:disabled { background:var(--ink-3); cursor:default; }

.filters { display:flex; flex-wrap:wrap; gap:0.5rem 1.5rem; padding-top:1rem; }
.filter { display:grid; gap:0.25rem; }
.filter > span { font-size:var(--t-label); font-weight:600; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--ink-3); }
.filter select, .filter input { min-width:11rem; padding:0.4rem 0.6rem; border-radius:2px;
  border:1px solid var(--rule); background:var(--paper-sunk); color:var(--ink);
  font:400 var(--t-base)/1.4 var(--data); }
.filter select:hover, .filter input:hover { border-color:var(--ink-3); }

/* --- Register: ruled rows, nothing enclosed ------------------------------ */

.tally { display:flex; justify-content:space-between; gap:1rem; padding:1.5rem 0 0.5rem;
  border-bottom:1px solid var(--rule); font-size:var(--t-label); font-weight:600;
  letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-3); }

.register { list-style:none; margin:0; padding:0; }
.entry { display:grid; grid-template-columns:1fr auto; gap:0.15rem 1.5rem;
  padding:1.15rem 0; border-bottom:1px solid var(--rule); }
.entry:hover { background:linear-gradient(90deg, var(--paper-sunk), transparent 75%); }

.entry__name { grid-column:1; margin:0; font:600 var(--t-lg)/1.3 var(--doc); letter-spacing:-0.01em; }
.entry__name a { color:var(--ink); text-decoration:underline; text-decoration-color:transparent;
  text-decoration-thickness:1px; text-underline-offset:0.16em; transition:text-decoration-color 0.16s var(--ease); }
.entry__name a:hover { color:var(--cert-deep); text-decoration-color:var(--cert); }

.entry__ident { grid-column:1; margin:0; color:var(--ink-2); }
.entry__ident b { font-weight:500; color:var(--ink); }
.entry__place { grid-column:1; margin:0; color:var(--ink-3); }

/* Status is the largest thing after the name — it is what changes the decision.
   Kind sits beneath it in the same cell; spanning rows stretched the middle row. */
.entry__status { grid-column:2; grid-row:1 / span 3; align-self:start; justify-self:end;
  display:grid; gap:0.35rem; justify-items:end; text-align:right; }
.entry__kind { margin:0; font-size:var(--t-label); color:var(--ink-3); }

.status { display:inline-flex; align-items:center; gap:0.4rem; white-space:nowrap;
  padding:0.35rem 0.6rem; border:1px solid currentColor; border-radius:2px;
  font:600 var(--t-label)/1 var(--data); letter-spacing:0.1em; text-transform:uppercase; }
.status--active { color:var(--cert); background:var(--cert-tint); }
.status--liquidated { color:var(--struck); background:var(--struck-tint); }
.status--absent { color:var(--superseded); background:var(--superseded-tint); }

/* --- Extract ------------------------------------------------------------- */

.extract { padding:1.5rem 0 4rem; }
.extract__head { display:flex; flex-wrap:wrap; align-items:flex-start; gap:1rem 2rem;
  padding-bottom:1.25rem; border-bottom:2px solid var(--rule-strong); }
.extract__ident { flex:1 1 24rem; }
.extract__title { margin:0; font:600 var(--t-display)/1.15 var(--doc); letter-spacing:-0.02em; text-wrap:balance; }
.extract__legal { margin:0.4rem 0 0; color:var(--ink-2); }
/* A struck record reads as struck: the document says so in its own voice. */
.extract[data-struck='true'] .extract__title { text-decoration:line-through;
  text-decoration-thickness:2px; text-decoration-color:var(--struck); }

.fields { display:grid; grid-template-columns:minmax(11rem,16rem) 1fr; margin:0; padding:0; }
.fields > dt { grid-column:1; padding:0.8rem 1.5rem 0.8rem 0; border-bottom:1px solid var(--rule);
  font:400 var(--t-base)/1.6 var(--doc); color:var(--ink-2); }
.fields > dd { grid-column:2; margin:0; padding:0.8rem 0; border-bottom:1px solid var(--rule); font-weight:500; }
.fields > dd[data-empty='true'] { color:var(--ink-3); font-weight:400; font-style:italic; }

/* The blank form: real labels over empty ruled values, so an unsearched page is
   obviously a form awaiting entry rather than a failed load. */
.fields--blank > dt { color:var(--ink-3); }
.fields--blank > dd { min-height:1.7em; }

.section { padding-top:2.5rem; }
.section > h2 { margin:0 0 0.75rem; padding-bottom:0.4rem; border-bottom:1px solid var(--rule-strong);
  font:600 var(--t-lg)/1.3 var(--doc); letter-spacing:-0.01em; }

.people { list-style:none; margin:0; padding:0; }
.people li { display:flex; flex-wrap:wrap; gap:0.3rem 0.9rem; align-items:baseline;
  padding:0.6rem 0; border-bottom:1px solid var(--rule); }
.people__name { font-weight:500; }
.people__role { font-size:var(--t-label); font-weight:600; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--ink-3); }
.people__share { margin-left:auto; font-weight:600; color:var(--cert-deep); }

.acts { list-style:none; margin:0; padding:0; }
.acts li { display:grid; grid-template-columns:5.5rem 1fr auto; gap:0.9rem; align-items:baseline;
  padding:0.55rem 0; border-bottom:1px solid var(--rule); }
.acts__code { font-weight:600; color:var(--ink-2); }
.acts__caem { font-size:var(--t-label); color:var(--ink-3); white-space:nowrap; }
.acts li[data-licensed='true'] .acts__code { color:var(--cert-deep); }

/* Provenance closes the document, as a certification statement does. Its rule
   spans the sheet; only the reading text is held to a measure. */
.provenance { margin-top:3rem; padding-top:1.25rem; border-top:2px solid var(--rule-strong);
  font-family:var(--doc); color:var(--ink-2); }
.provenance p { margin:0 0 0.5rem; max-width:var(--measure); }
.provenance dl { display:grid; grid-template-columns:max-content 1fr; gap:0.2rem 1rem;
  margin:0.75rem 0 0; font-family:var(--data); font-size:var(--t-label); }
.provenance dt { color:var(--ink-3); text-transform:uppercase; letter-spacing:0.08em; font-weight:600; }
.provenance dd { margin:0; }

/* --- Notices: absence is a finding, stated plainly ----------------------- */

.notice { display:flex; gap:0.75rem; align-items:flex-start; margin:1.25rem 0;
  padding:0.9rem 1.1rem; border:1px solid var(--superseded); border-radius:2px;
  background:var(--superseded-tint); color:#5C3E00; }
.notice--struck { border-color:var(--struck); background:var(--struck-tint); color:#6E1C17; }
.notice p { margin:0; }
.notice strong { display:block; font-weight:600; }

.empty { padding:2.5rem 0 1.75rem; color:var(--ink-2); font:400 var(--t-lg)/1.5 var(--doc); }
.failure { padding:4rem 0; text-align:center; color:var(--struck); font:400 var(--t-lg)/1.5 var(--doc); }

/* --- Chrome -------------------------------------------------------------- */

.langs { display:flex; gap:0.15rem; }
.langs button { padding:0.35rem 0.5rem; cursor:pointer; border:1px solid transparent; border-radius:2px;
  background:transparent; color:var(--ink-3); font:600 var(--t-label)/1 var(--data);
  letter-spacing:0.08em; text-transform:uppercase; }
.langs button:hover { color:var(--ink); }
.langs button[aria-pressed='true'] { color:var(--cert-deep); border-color:var(--cert); background:var(--cert-tint); }

.pager { display:flex; gap:1rem; align-items:center; justify-content:center; padding:2rem 0; }
.pager button { padding:0.6rem 1rem; cursor:pointer; border:1px solid var(--rule); border-radius:2px;
  background:transparent; color:var(--ink); font:600 var(--t-label)/1 var(--data);
  letter-spacing:0.1em; text-transform:uppercase; }
.pager button:hover:not(:disabled) { border-color:var(--ink); }
.pager button:disabled { color:var(--ink-3); cursor:default; }
.pager span { font-size:var(--t-label); letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-3); }

.back { display:inline-flex; align-items:center; gap:0.4rem; padding:0.5rem 0; margin-bottom:0.5rem;
  border:0; background:transparent; cursor:pointer; color:var(--ink-3);
  font:600 var(--t-label)/1 var(--data); letter-spacing:0.1em; text-transform:uppercase;
  text-decoration:none; }
.back:hover { color:var(--cert-deep); }

.colophon { border-top:1px solid var(--rule); padding:1.5rem 0 3rem;
  color:var(--ink-3); font-size:var(--t-label); }

.visually-hidden { position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* --- The one authored moment ---------------------------------------------
   The seal stamps when a fresh answer lands: a document being certified. It
   fires on results only, so it stays an event rather than an idle. */

@keyframes stamp {
  0%   { transform:scale(1.06) rotate(-1.1deg); opacity:0.5; }
  60%  { transform:scale(0.995) rotate(0.12deg); opacity:1; }
  100% { transform:scale(1) rotate(0deg); opacity:1; }
}
.seal[data-stamping='true'] { animation:stamp 0.44s var(--ease); }

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:0.001ms !important; transition-duration:0.001ms !important; }
}

/* --- Narrow: checked on a phone beside a printed contract ---------------- */

@media (max-width: 44rem) {
  .fields { grid-template-columns:1fr; }
  .fields > dt { grid-column:1; padding-bottom:0; border-bottom:0;
    font:600 var(--t-label)/1.4 var(--data); letter-spacing:0.1em;
    text-transform:uppercase; color:var(--ink-3); }
  .fields > dd { grid-column:1; padding-top:0.15rem; }

  .entry { grid-template-columns:1fr; }
  .entry__status { grid-column:1; grid-row:auto; justify-self:start; justify-items:start;
    text-align:left; margin-top:0.5rem; grid-auto-flow:column; align-items:center; gap:0.6rem; }

  .filters { display:grid; grid-template-columns:1fr 1fr; gap:0.75rem 1rem; }
  .filter select, .filter input { min-width:0; width:100%; }

  .acts li { grid-template-columns:4.5rem 1fr; }
  .acts__caem { grid-column:2; }

  .request__field { font-size:var(--t-lg); }
  .seal { min-width:0; width:100%; }
}

/* --- Enrichment sections: procurement, financials, contact ---------------
   Same ruled-document grammar as the registry fields. Money is tabular and
   emphasised; the honesty notes and attribution carry provenance in the
   document's own voice. */

.section-note { margin:0 0 1rem; max-width:var(--measure); color:var(--ink-3);
  font-family:var(--doc); font-size:var(--t-base); }
.attribution { margin:1rem 0 0; color:var(--ink-3); font-size:var(--t-label); font-style:italic; }

.money { font-variant-numeric:tabular-nums; }
.fields > dd.money { font-weight:600; }
.muted { color:var(--ink-3); }

/* Awarded-contract list — ruled rows, nothing enclosed. */
.contracts { list-style:none; margin:1.25rem 0 0; padding:0; }
.contracts li { display:grid; grid-template-columns:9rem 1fr auto; gap:0.4rem 1.25rem;
  align-items:baseline; padding:0.7rem 0; border-bottom:1px solid var(--rule); }
.contract__date { color:var(--ink-3); font-size:var(--t-label); white-space:nowrap; }
.contract__body { display:flex; flex-wrap:wrap; align-items:baseline; gap:0.3rem 0.7rem; }
.contract__subject { font-weight:500; }
.contract__buyer { color:var(--ink-2); }
.contract__amount { font-weight:600; white-space:nowrap; }
.contract__link { font-size:var(--t-label); }
.contracts li[data-kind="amendment"] .contract__amount::before { content:"± "; color:var(--superseded); }
.contracts li[data-kind="cancellation"] .contract__subject {
  text-decoration:line-through; text-decoration-color:var(--struck); }
.contracts li[data-quarantined="true"] { opacity:0.55; }

.tag { font-size:var(--t-label); font-weight:600; letter-spacing:0.06em; text-transform:uppercase;
  padding:0.1rem 0.45rem; border:1px solid var(--rule); border-radius:2px; color:var(--ink-3); }

/* Financial statements table. */
.scroll { overflow-x:auto; }
.fin { width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; }
.fin th, .fin td { padding:0.55rem 0.9rem; border-bottom:1px solid var(--rule); text-align:left; }
.fin th.num, .fin td.num { text-align:right; }
.fin th { font:600 var(--t-label)/1.4 var(--data); letter-spacing:0.08em;
  text-transform:uppercase; color:var(--ink-3); }
.fin thead th { border-bottom:1px solid var(--rule-strong); }

@media (max-width: 44rem) {
  .contracts li { grid-template-columns:1fr auto; }
  .contract__date { grid-column:1 / -1; }
}

/* --- Procurement discovery: landing entry + search-row signal ------------ */

.browse { display:flex; width:100%; align-items:center; justify-content:space-between; gap:1rem;
  margin:1.5rem 0; padding:1.1rem 1.25rem; cursor:pointer; text-align:left;
  background:var(--paper); border:1px solid var(--rule-strong); border-radius:2px;
  color:var(--ink); font:inherit; transition:background 0.18s var(--ease); }
.browse:hover { background:var(--paper-sunk); }
.browse__body { display:grid; gap:0.15rem; }
.browse__label { font:600 var(--t-lg)/1.2 var(--doc); letter-spacing:-0.01em; }
.browse__hint { font-size:var(--t-label); color:var(--ink-3); }
.browse__arrow { font-size:var(--t-lg); color:var(--ink-3); transition:transform 0.18s var(--ease); }
.browse:hover .browse__arrow { transform:translateX(3px); color:var(--ink); }

/* One public-contracts marker on a search row. Green tint marks the category,
   like the active-status badge; the money itself stays in ink. */
.entry__proc { grid-column:1; margin:0.35rem 0 0; display:flex; align-items:baseline;
  flex-wrap:wrap; gap:0.4rem 0.6rem; }
.tag--proc { color:var(--cert-deep); border-color:var(--cert); background:var(--cert-tint); }

/* --- Polish pass ---------------------------------------------------------- */

/* Comfortable touch targets on the filter controls and language switch. */
.filter select, .filter input { min-height: 40px; }
.langs button { min-height: 34px; }

/* Supplier-ranking mode header: names the ranked view so results read as a
   leaderboard, not a plain match list. The tally rule below is the divider. */
.mode { display:flex; flex-wrap:wrap; align-items:baseline; gap:0.3rem 0.9rem; margin:1.5rem 0 0; }
.mode__label { font:600 var(--t-lg)/1.2 var(--doc); letter-spacing:-0.01em; }
.mode__hint { font-size:var(--t-label); color:var(--ink-3); }