/* TendaRadar — "The closing board".
   Every tender is read by its deadline first: a big condensed day-count in a
   left column, colour-coded by urgency. That numeral is the one loud element;
   everything around it stays quiet.
   Type: Big Shoulders Display (signage, numerals, headings) + Atkinson
   Hyperlegible (body; built for legibility on small, low-quality screens).
   Both are self-hosted (SIL OFL, licences beside the files). The -ext files
   only download on pages that need them — chiefly for the naira sign ₦. */

@font-face { font-family:"Atkinson Hyperlegible"; font-style:normal; font-weight:400; font-display:swap;
  src:url(/static/atkinson-400.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:"Atkinson Hyperlegible"; font-style:normal; font-weight:400; font-display:swap;
  src:url(/static/atkinson-400-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113; }
@font-face { font-family:"Atkinson Hyperlegible"; font-style:normal; font-weight:700; font-display:swap;
  src:url(/static/atkinson-700.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:"Atkinson Hyperlegible"; font-style:normal; font-weight:700; font-display:swap;
  src:url(/static/atkinson-700-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113; }
@font-face { font-family:"Big Shoulders Display"; font-style:normal; font-weight:800; font-display:swap;
  src:url(/static/bigshoulders-800.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:"Big Shoulders Display"; font-style:normal; font-weight:800; font-display:swap;
  src:url(/static/bigshoulders-800-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113; }

:root {
  --paper:#F5F7F2; --surface:#FFFFFF; --surface-2:#ECF0E8;
  --ink:#11241A; --ink-soft:#4A5C51; --ink-faint:#74847A;
  --line:#D8DFD5; --line-strong:#B9C4B6;
  --go:#0A7A44; --go-deep:#075C33; --go-soft:#E1EFE5; --on-go:#FFFFFF;
  /* the board: a deep government green panel, same in both themes */
  --board:#0C3A25; --board-2:#124A31; --board-ink:#EAF3EC; --board-soft:#9FC2AC; --board-line:#245A40;
  /* urgency — these colours carry meaning, never decoration */
  --u-imm:#C93A1F; --u-imm-bg:#FBE6E0;
  --u-soon:#A86F00; --u-soon-bg:#FBF0D6;
  --u-far:#0A7A44; --u-far-bg:#E1EFE5;
  --u-closed:#6E7C73; --u-closed-bg:#E9EDE7;
  /* on the dark board the urgency numerals need lighter tints */
  --b-imm:#FF8A70; --b-soon:#F5C451; --b-far:#7FD9A5; --b-closed:#9FB3A6;
  --r:6px; --r-lg:10px;
  --display:"Big Shoulders Display","Arial Narrow","Roboto Condensed",sans-serif;
  --sans:"Atkinson Hyperlegible","Segoe UI",system-ui,-apple-system,sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper:#0D1611; --surface:#132019; --surface-2:#18281F;
    --ink:#E6EEE8; --ink-soft:#A3B4A9; --ink-faint:#71837A;
    --line:#22352A; --line-strong:#33493C;
    --go:#3FBF7F; --go-deep:#62D097; --go-soft:#16301F; --on-go:#04140B;
    --board:#0F4229; --board-2:#145033; --board-line:#23603F;
    --u-imm:#FF8A70; --u-imm-bg:#331A14;
    --u-soon:#F0BC4A; --u-soon-bg:#2E2510;
    --u-far:#62D097; --u-far-bg:#16301F;
    --u-closed:#8A9B90; --u-closed-bg:#1D2A22;
  }
}
:root[data-theme="dark"] {
  --paper:#0D1611; --surface:#132019; --surface-2:#18281F;
  --ink:#E6EEE8; --ink-soft:#A3B4A9; --ink-faint:#71837A;
  --line:#22352A; --line-strong:#33493C;
  --go:#3FBF7F; --go-deep:#62D097; --go-soft:#16301F; --on-go:#04140B;
  --board:#0F4229; --board-2:#145033; --board-line:#23603F;
  --u-imm:#FF8A70; --u-imm-bg:#331A14;
  --u-soon:#F0BC4A; --u-soon-bg:#2E2510;
  --u-far:#62D097; --u-far-bg:#16301F;
  --u-closed:#8A9B90; --u-closed-bg:#1D2A22;
}

/* ---------- base ---------- */
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; color-scheme:light dark; }
body {
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); font-size:17px; line-height:1.55;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
h1,h2,h3 { font-family:var(--display); font-weight:800; line-height:1; margin:0; letter-spacing:.005em; text-wrap:balance; }
h1 { font-size:clamp(2.6rem,7vw,4.25rem); }
h2 { font-size:clamp(2rem,4.5vw,2.75rem); }
h3 { font-size:1.5rem; }
a { color:var(--go); text-underline-offset:.18em; text-decoration-thickness:1px; }
a:hover { color:var(--go-deep); }
p { margin:0 0 1rem; }
img,svg { display:block; max-width:100%; }
:focus-visible { outline:3px solid var(--go); outline-offset:2px; border-radius:3px; }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation:none !important; transition:none !important; } }

.wrap { width:100%; max-width:1120px; margin:0 auto; padding:0 1rem; }
@media (min-width:640px){ .wrap{ padding:0 1.5rem; } }
.narrow { max-width:680px; }
.muted { color:var(--ink-soft); }
.faint { color:var(--ink-faint); }
.center { text-align:center; }
.num { font-variant-numeric:tabular-nums; }
.lede { font-size:1.18rem; color:var(--ink-soft); max-width:38ch; }
.page { padding-top:2.5rem; padding-bottom:3rem; } /* sides come from .wrap */
.page-head { margin-bottom:1.75rem; }
.page-head h1 { margin-bottom:.6rem; }
.page-head p { margin:0; }

/* ---------- header ---------- */
.site-head { position:sticky; top:0; z-index:40; background:var(--paper); border-bottom:1px solid var(--line); }
.site-head .wrap { display:flex; align-items:center; gap:1.5rem; height:62px; }
.brand { display:flex; align-items:center; gap:.55rem; color:var(--ink); text-decoration:none;
  font-family:var(--display); font-weight:800; font-size:1.55rem; letter-spacing:.01em; }
.brand:hover { color:var(--ink); }
.brand svg { width:26px; height:26px; color:var(--go); flex:none; }
.nav-links { display:none; gap:1.6rem; }
.nav-links a { color:var(--ink-soft); text-decoration:none; font-size:.95rem; padding:.3rem 0; border-bottom:2px solid transparent; }
.nav-links a:hover { color:var(--ink); }
.nav-links a.on { color:var(--ink); border-bottom-color:var(--go); }
.head-cta { margin-left:auto; display:flex; align-items:center; gap:.5rem; }
.head-cta form { margin:0; display:flex; }
@media (min-width:860px){ .nav-links{ display:flex; } }
@media (max-width:420px){
  .head-cta .hide-xs{ display:none; }
  /* brand + theme + two buttons must fit a 360px phone without sideways scroll */
  .site-head .wrap{ gap:.5rem; }
  .head-cta{ gap:.3rem; }
  .head-cta .btn-sm{ padding-left:.7rem; padding-right:.7rem; }
}
/* smallest phones: the theme follows the phone's own light/dark setting */
@media (max-width:380px){ .head-cta .theme-toggle{ display:none; } }

.theme-toggle { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px;
  background:none; border:1px solid var(--line-strong); border-radius:50%; color:var(--ink-soft); cursor:pointer; }
.theme-toggle svg { width:18px; height:18px; }
.theme-toggle:hover { color:var(--ink); border-color:var(--ink-soft); }

/* ---------- buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:46px;
  padding:.65rem 1.2rem; border-radius:var(--r); border:1.5px solid transparent;
  font:700 1rem/1.1 var(--sans); text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:background-color .15s, border-color .15s, color .15s; }
.btn-go { background:var(--go); color:var(--on-go); }
.btn-go:hover { background:var(--go-deep); color:var(--on-go); }
.btn-line { background:transparent; color:var(--ink); border-color:var(--line-strong); }
.btn-line:hover { border-color:var(--ink); color:var(--ink); }
.btn-quiet { background:transparent; color:var(--ink-soft); padding-left:.6rem; padding-right:.6rem; }
.btn-quiet:hover { color:var(--ink); }
.btn-sm { min-height:38px; padding:.45rem .85rem; font-size:.92rem; }
.btn-block { width:100%; }
.btn[disabled] { opacity:.55; cursor:default; }
.btn-row { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; }

/* ---------- tags ---------- */
.tag { display:inline-block; font-size:.85rem; line-height:1.3; color:var(--ink-soft); }
.tag.cat { color:var(--go); font-weight:700; }
.status { display:inline-block; font-size:.85rem; font-weight:700; padding:.15rem .55rem; border-radius:4px; }
.status.u-imminent { color:var(--u-imm); background:var(--u-imm-bg); }
.status.u-soon { color:var(--u-soon); background:var(--u-soon-bg); }
.status.u-far { color:var(--u-far); background:var(--u-far-bg); }
.status.u-closed,.status.u-unknown { color:var(--u-closed); background:var(--u-closed-bg); }

/* ---------- the tender row: deadline column + body ---------- */
.list { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.list > * + * { border-top:1px solid var(--line); }
.tender { display:grid; grid-template-columns:4.5rem 1fr; gap:0 1rem; padding:1rem 1.1rem 1rem .9rem;
  color:inherit; text-decoration:none; transition:background-color .12s; }
.tender:hover { background:var(--surface-2); color:inherit; }
.tender .when { text-align:center; padding-top:.1rem; }
@media (max-width:480px){ .tender{ grid-template-columns:3.6rem 1fr; gap:0 .75rem; padding-left:.6rem; } }
.tender .n { display:block; font-family:var(--display); font-weight:800; font-size:2.6rem; line-height:.9; font-variant-numeric:tabular-nums; }
.tender .unit { display:block; font-size:.78rem; color:var(--ink-faint); margin-top:.3rem; line-height:1.2; }
.tender .body { min-width:0; }
.tender h3 { font-family:var(--sans); font-weight:700; font-size:1.05rem; line-height:1.35; letter-spacing:0; margin-bottom:.2rem; }
.tender .entity { color:var(--ink-soft); font-size:.92rem; margin-bottom:.4rem; }
.tender .meta, .meta { display:flex; flex-wrap:wrap; align-items:baseline; gap:.2rem 1rem; }
.tender .value { font-weight:700; font-size:.92rem; color:var(--ink); margin-left:auto; padding-left:1rem; font-variant-numeric:tabular-nums; }
.when.u-imminent .n { color:var(--u-imm); }
.when.u-soon .n { color:var(--u-soon); }
.when.u-far .n { color:var(--u-far); }
.when.u-closed .n,.when.u-unknown .n { color:var(--u-closed); }
.when.u-unknown .n { font-size:1.6rem; padding-top:.35rem; }

/* a row with a save button tucked into its top-right corner */
.saveable { position:relative; }
.saveable .tender { padding-right:3.5rem; }
.saveable .save { position:absolute; top:.75rem; right:.75rem; margin:0; }
.star { width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; padding:0;
  background:none; border:1px solid transparent; border-radius:50%; color:var(--ink-faint); cursor:pointer; }
.star:hover { border-color:var(--line-strong); color:var(--ink); }
.star[aria-pressed="true"] { color:var(--u-soon); }
.star svg { width:20px; height:20px; }

.pager { display:flex; justify-content:space-between; margin:1.25rem 0; }
.empty { background:var(--surface); border:1px dashed var(--line-strong); border-radius:var(--r-lg); padding:2.5rem 1.5rem; text-align:center; }
.empty h2 { font-size:1.9rem; margin-bottom:.6rem; }
.empty p { max-width:44ch; margin:0 auto 1.25rem; color:var(--ink-soft); }
.empty p:last-child { margin-bottom:0; }

/* ---------- landing hero ---------- */
.hero { padding:clamp(2.25rem,6vw,4.5rem) 0 clamp(2.5rem,6vw,4.5rem); }
.hero .wrap { display:grid; gap:2.5rem; align-items:center; }
@media (min-width:920px){ .hero .wrap{ grid-template-columns:1fr 1.05fr; gap:3.5rem; } }
.hero h1 { font-size:clamp(3rem,8.5vw,5.25rem); line-height:.92; margin-bottom:1.25rem; }
.hero .lede { margin-bottom:1.75rem; }

.board { background:var(--board); color:var(--board-ink); border-radius:var(--r-lg); padding:1.1rem 1.1rem .5rem;
  box-shadow:0 24px 48px -24px rgba(12,58,37,.55); }
.board-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:0 .2rem .8rem; border-bottom:1px solid var(--board-line); }
.board-head h2 { font-size:1.6rem; color:var(--board-ink); }
.live { display:inline-flex; align-items:center; gap:.45rem; font-size:.85rem; color:var(--board-soft); }
.live::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--b-far); animation:live 2.4s ease-in-out infinite; }
@keyframes live { 0%,100%{ opacity:1; } 50%{ opacity:.25; } }
.board-row { display:grid; grid-template-columns:3.6rem 1fr; gap:.9rem; padding:.85rem .2rem; color:var(--board-ink); text-decoration:none; }
.board-row + .board-row { border-top:1px solid var(--board-line); }
.board-row:hover { color:#fff; }
.board-row:hover .t { text-decoration:underline; text-underline-offset:.18em; }
.board-row .when { text-align:center; }
.board-row > span:last-child { min-width:0; }
.board-row .n { display:block; font-family:var(--display); font-weight:800; font-size:2.4rem; line-height:.9; font-variant-numeric:tabular-nums; }
.board-row .unit { display:block; font-family:var(--sans); font-weight:400; font-size:.72rem; color:var(--board-soft); margin-top:.25rem; }
.board-row .t { font-weight:700; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.board-row .e { display:block; font-size:.86rem; color:var(--board-soft); margin-top:.15rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.board-row.u-imminent .n { color:var(--b-imm); }
.board-row.u-soon .n { color:var(--b-soon); }
.board-row.u-far .n { color:var(--b-far); }
.board-row.u-closed .n,.board-row.u-unknown .n { color:var(--b-closed); }
.board-row.u-unknown .n { font-size:1.5rem; padding-top:.3rem; }
.board-foot { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem 1rem; padding:.8rem .2rem .6rem; border-top:1px solid var(--board-line); font-size:.88rem; color:var(--board-soft); }
.board-foot a { color:var(--board-ink); font-weight:700; }

/* ---------- sections ---------- */
.section { padding:clamp(2.75rem,6vw,4.5rem) 0; }
.section.tint { background:var(--surface-2); }
.section-head { max-width:56ch; margin-bottom:2rem; }
.section-head h2 { margin-bottom:.75rem; }
.section-head p { margin:0; color:var(--ink-soft); }

/* trades: a plain index of links, not tiles */
.trades { list-style:none; margin:0; padding:0; columns:2 12rem; column-gap:2rem; }
.trades li { break-inside:avoid; border-top:1px solid var(--line-strong); }
.trades a { display:flex; justify-content:space-between; align-items:center; padding:.7rem 0; color:var(--ink); text-decoration:none; font-weight:700; }
.trades a:hover { color:var(--go); }
.trades a::after { content:""; width:7px; height:7px; border-top:2px solid currentColor; border-right:2px solid currentColor; transform:rotate(45deg); opacity:.45; flex:none; margin-left:.75rem; }
@media (min-width:860px){ .trades{ columns:4; } }

/* steps: a real sequence, so it is numbered */
.steps { list-style:none; margin:0; padding:0; display:grid; gap:1.75rem; counter-reset:step; }
@media (min-width:860px){ .steps{ grid-template-columns:repeat(3,1fr); gap:2.5rem; } }
.steps li { counter-increment:step; display:grid; grid-template-columns:auto 1fr; gap:0 1rem; }
.steps li::before { content:counter(step); grid-row:span 2; font-family:var(--display); font-weight:800; font-size:3.25rem; line-height:.85; color:var(--go); font-variant-numeric:tabular-nums; }
.steps h3 { font-size:1.6rem; margin-bottom:.4rem; }
.steps p { margin:0; color:var(--ink-soft); }
.steps.long { grid-template-columns:1fr; max-width:62ch; }

/* ---------- pricing: one ruled table, Pro column on the board ---------- */
.plans { display:grid; border:1px solid var(--line); border-radius:var(--r-lg); background:var(--surface); overflow:hidden; }
@media (min-width:820px){ .plans{ grid-template-columns:repeat(3,1fr); } }
.plan { display:flex; flex-direction:column; padding:1.6rem 1.5rem 1.5rem; }
.plan + .plan { border-top:1px solid var(--line); }
@media (min-width:820px){ .plan + .plan{ border-top:0; border-left:1px solid var(--line); } }
.plan h3 { font-size:1.75rem; }
.plan .note { font-size:.9rem; color:var(--ink-faint); min-height:1.4em; margin:.2rem 0 0; }
.plan .price { font-family:var(--display); font-weight:800; font-size:3.25rem; line-height:1; margin:1rem 0 .25rem; font-variant-numeric:tabular-nums; }
.plan .price small { font-family:var(--sans); font-weight:400; font-size:.95rem; color:var(--ink-faint); margin-left:.2rem; }
.plan ul { list-style:none; padding:0; margin:1rem 0 1.5rem; }
.plan li { padding:.5rem 0 .5rem 1.6rem; border-top:1px solid var(--line); position:relative; font-size:.97rem; }
.plan li::before { content:""; position:absolute; left:.15rem; top:.85rem; width:.7rem; height:.38rem; border-left:2px solid var(--go); border-bottom:2px solid var(--go); transform:rotate(-45deg); }
.plan form, .plan > .btn { margin-top:auto; }
.plan.featured { background:var(--board); color:var(--board-ink); }
.plan.featured .note, .plan.featured .price small { color:var(--board-soft); }
.plan.featured li { border-top-color:var(--board-line); }
.plan.featured li::before { border-color:var(--b-far); }
.plan.featured .btn-go { background:var(--b-far); color:#06200F; }
.plan.featured .btn-go:hover { background:#A3E8C0; }
.plan.featured .btn-line { color:var(--board-ink); border-color:var(--board-soft); }
.plans-note { margin-top:1rem; font-size:.92rem; color:var(--ink-faint); }

/* ---------- forms ---------- */
label, .label { display:block; font-weight:700; font-size:.95rem; margin-bottom:.4rem; }
.label-aside { font-weight:400; color:var(--ink-faint); }
input[type=text],input[type=tel],input[type=email],input[type=password],input[type=number],input[type=search],select,textarea {
  width:100%; min-height:48px; padding:.65rem .85rem; font:inherit; font-size:1rem; color:var(--ink);
  background:var(--surface); border:1.5px solid var(--line-strong); border-radius:var(--r); }
input:focus,select:focus,textarea:focus { outline:none; border-color:var(--go); box-shadow:0 0 0 3px var(--go-soft); }
input[disabled] { background:var(--surface-2); color:var(--ink-soft); }
fieldset { border:0; padding:0; margin:0 0 1.35rem; min-width:0; }
legend { padding:0; }
.hint.center, .resend { margin-top:1rem; }
.field { margin-bottom:1.35rem; }
.hint { font-size:.88rem; color:var(--ink-faint); margin-top:.35rem; }
.grid-2 { display:grid; gap:0 1rem; }
@media (min-width:600px){ .grid-2{ grid-template-columns:1fr 1fr; } }
.otp-input { font-family:var(--display); font-weight:800; font-size:2.4rem; letter-spacing:.35em; text-align:center; padding-left:.35em; font-variant-numeric:tabular-nums; }

/* checkbox chips for categories and states */
.pick { display:flex; flex-wrap:wrap; gap:.45rem; }
.pick input { position:absolute; opacity:0; width:1px; height:1px; }
.pick label { margin:0; cursor:pointer; font-weight:400; font-size:.93rem; padding:.45rem .8rem; border-radius:var(--r);
  border:1.5px solid var(--line-strong); background:var(--surface); color:var(--ink); transition:background-color .12s, border-color .12s; }
.pick label:hover { border-color:var(--go); }
.pick input:checked + label { background:var(--go); border-color:var(--go); color:var(--on-go); }
.pick input:focus-visible + label { outline:3px solid var(--go); outline-offset:2px; }
.pick.scroll { max-height:11rem; overflow:auto; padding:.15rem; border:1px solid var(--line); border-radius:var(--r); }

.filters { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.25rem; }
.filters input,.filters select { flex:1 1 11rem; width:auto; }
.filters .btn { flex:none; }

/* ---------- panels, banners ---------- */
.panel { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.4rem 1.4rem; margin-bottom:1.25rem; }
.panel h2 { font-size:1.75rem; margin-bottom:.5rem; }
.panel.saved { border-color:var(--u-far); box-shadow:0 0 0 1px var(--u-far); }
.panel-actions { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; padding-top:.25rem; }
.saved-tag { color:var(--u-far); font-weight:700; font-size:.92rem; }

.banner { padding:.8rem 1rem; border-radius:var(--r); margin-bottom:1.25rem; font-size:.97rem; border-left:4px solid; }
.banner.err { background:var(--u-imm-bg); color:var(--ink); border-color:var(--u-imm); }
.banner.ok { background:var(--u-far-bg); color:var(--ink); border-color:var(--u-far); }
.banner.info { background:var(--go-soft); color:var(--ink); border-color:var(--go); }
.banner.dev { background:var(--u-soon-bg); color:var(--ink); border-color:var(--u-soon); }
.banner a { font-weight:700; }

/* facts: label/value pairs on a tender page */
.facts { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--line); border-radius:var(--r-lg); background:var(--surface); margin:1.5rem 0; }
.facts > dl { margin:0; padding:1rem 1.2rem; min-width:0; }
.facts > dl + dl { border-left:1px solid var(--line); }
.facts dt { font-size:.88rem; color:var(--ink-faint); }
.facts dd { margin:.2rem 0 0; font-family:var(--display); font-weight:800; font-size:1.9rem; line-height:1.05; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.detail-title { font-size:clamp(2rem,5vw,2.75rem); margin-bottom:.75rem; }
.detail-entity { margin-bottom:.6rem; }
.cta-row { margin:1.75rem 0 1rem; }
.hero .hint { margin-top:.9rem; }

/* detail-page deadline strip */
.countdown { display:flex; align-items:baseline; gap:.75rem; margin-bottom:1rem; }
.countdown .n { font-family:var(--display); font-weight:800; font-size:4.5rem; line-height:.85; font-variant-numeric:tabular-nums; }
.countdown .unit { font-size:1rem; color:var(--ink-soft); }
.countdown.u-imminent .n { color:var(--u-imm); }
.countdown.u-soon .n { color:var(--u-soon); }
.countdown.u-far .n { color:var(--u-far); }
.countdown.u-closed .n,.countdown.u-unknown .n { color:var(--u-closed); font-size:2.5rem; }

/* sample WhatsApp digest (what subscribers actually receive) */
.wa { background:#E7DED3; border-radius:var(--r-lg); padding:1.1rem; max-width:24rem;
  background-image:radial-gradient(rgba(0,0,0,.035) 1px, transparent 1px); background-size:14px 14px; }
:root[data-theme="dark"] .wa { background-color:#0B141A; background-image:none; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .wa{ background-color:#0B141A; background-image:none; } }
.wa-msg { background:#FFFFFF; color:#111B21; border-radius:0 8px 8px 8px; padding:.7rem .85rem .45rem; font-size:.93rem; line-height:1.45; box-shadow:0 1px .5px rgba(0,0,0,.13); }
:root[data-theme="dark"] .wa-msg { background:#202C33; color:#E9EDEF; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .wa-msg{ background:#202C33; color:#E9EDEF; } }
.wa-msg p { margin:0 0 .55rem; }
.wa-msg .time { display:block; text-align:right; font-size:.72rem; opacity:.55; }
.wa-figure { margin:0; }
.after-steps { margin-top:2rem; }
.wa-caption { font-size:.88rem; color:var(--ink-faint); margin-top:.6rem; }

/* auth: form beside the sample digest */
.split { display:grid; gap:2.5rem; }
@media (min-width:900px){ .split{ grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:4rem; align-items:start; } .split aside{ position:sticky; top:90px; } }
.auth { max-width:440px; }

/* ---------- app shell ---------- */
.app-head { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding:2rem 0 1.25rem; }
.app-head h1 { font-size:clamp(2.25rem,6vw,3.25rem); }
.app-head p { margin:.5rem 0 0; color:var(--ink-soft); }

.bottom-nav { position:fixed; bottom:0; left:0; right:0; z-index:40; display:flex; background:var(--surface); border-top:1px solid var(--line);
  padding:.25rem env(safe-area-inset-right) calc(.25rem + env(safe-area-inset-bottom)) env(safe-area-inset-left); }
.bottom-nav a { flex:1; display:flex; flex-direction:column; align-items:center; gap:.2rem; padding:.45rem 0 .35rem;
  font-size:.75rem; color:var(--ink-faint); text-decoration:none; }
.bottom-nav a.on { color:var(--go); font-weight:700; }
.bottom-nav svg { width:22px; height:22px; }
.has-bottom-nav { padding-bottom:5rem; }
@media (min-width:860px){ .bottom-nav{ display:none; } .has-bottom-nav{ padding-bottom:0; } }

/* ---------- footer ---------- */
.site-foot { border-top:1px solid var(--line); margin-top:3rem; padding:2.25rem 0 2.5rem; font-size:.93rem; color:var(--ink-soft); }
main:has(> .section:last-child) + .site-foot { margin-top:0; }
.site-foot .wrap { display:flex; flex-wrap:wrap; gap:1.5rem 4rem; }
.site-foot .brand { font-size:1.35rem; margin-bottom:.35rem; }
.site-foot ul { list-style:none; margin:0; padding:0; }
.site-foot li { margin:.2rem 0; }
.site-foot a { color:var(--ink-soft); text-decoration:none; }
.site-foot a:hover { color:var(--ink); text-decoration:underline; }

/* error / offline */
.error-code { font-family:var(--display); font-weight:800; font-size:7rem; line-height:.85; color:var(--go); margin-bottom:1rem; }

.prose p { color:var(--ink-soft); max-width:62ch; }
.prose .small { font-size:.9rem; color:var(--ink-faint); }

/* locked tender detail: the advert link + full notice need a trial or plan */
.unlock { border:1px solid var(--line); border-left:4px solid var(--go); border-radius:var(--r-lg); background:var(--surface); padding:1.25rem 1.35rem; margin:1.5rem 0 1rem; }
.unlock h2 { font-size:1.75rem; margin-bottom:.5rem; }
.unlock p { color:var(--ink-soft); max-width:56ch; }

/* open-tender count on each trade chip; trades with none read as quieter */
.pick .count { font-size:.8em; color:var(--ink-faint); font-variant-numeric:tabular-nums; margin-left:.15rem; }
.pick input:checked + label .count { color:inherit; opacity:.8; }
.pick label.none { color:var(--ink-faint); border-style:dashed; }
.pick input:disabled + label { opacity:.45; cursor:not-allowed; }
.paused-tag { display:inline-block; margin:0 0 .75rem; font-size:.88rem; font-weight:700; color:var(--u-soon); }

/* team members on the settings page */
.team-list { list-style:none; margin:0 0 1rem; padding:0; }
.team-list > li { padding:.8rem 0; border-top:1px solid var(--line); }
.team-row { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.5rem 1rem; }
.team-row form { margin:0; }
.team-code { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin-top:.6rem; }
.team-code input { width:9rem; flex:none; }

/* account page */
.acct-plan { margin-bottom:.6rem; }
.acct-plan-line { margin:0 0 1.5rem; color:var(--ink-soft); }
.acct-plan-line a { font-weight:700; }
.panel > form + form, .acct-pause { margin-top:1.1rem; padding-top:1.1rem; border-top:1px solid var(--line); }
.acct-pause p { margin-top:0; }
.acct-more > summary { cursor:pointer; font-weight:700; color:var(--go); padding:.3rem 0; }
.acct-more[open] > summary { margin-bottom:.8rem; }
.acct-danger { border-color:var(--u-imm); }
.acct-danger .acct-more > summary { color:var(--u-imm); }
.btn-danger { background:var(--u-imm); color:#fff; border-color:var(--u-imm); }
.btn-danger:hover { filter:brightness(1.08); }
.pay-list { list-style:none; margin:0; padding:0; }
.pay-list > li { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem 1rem; padding:.8rem 0; border-top:1px solid var(--line); }
.pay-list > li > div:first-child { flex:1 1 12rem; min-width:0; }
.pay-amt { font-family:var(--display); font-weight:800; font-size:1.35rem; }

/* printable receipt */
.receipt { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.6rem 1.4rem; margin:1rem 0 1.5rem; }
.receipt-head { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; padding-bottom:1rem; border-bottom:2px solid var(--ink); }
.receipt-head .brand { font-family:var(--display); font-weight:800; font-size:1.6rem; }
.receipt-no { text-align:right; }
.receipt-lines { display:grid; grid-template-columns:minmax(7rem, 11rem) 1fr; gap:.6rem 1rem; margin:1.2rem 0; }
.receipt-lines dt { color:var(--ink-faint); }
.receipt-lines dd { margin:0; overflow-wrap:anywhere; }
.receipt-total { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding:1rem 0; border-top:1px solid var(--line-strong); border-bottom:1px solid var(--line-strong); margin-bottom:1rem; }
.receipt-total strong { font-family:var(--display); font-weight:800; font-size:2rem; }
@media print {
  .site-head, .site-foot, .bottom-nav, .no-print { display:none !important; }
  body { background:#fff; color:#000; }
  .receipt { border:0; padding:0; }
}

/* small factual line under the home-page board */
.board-note { margin:.2rem .2rem 0; padding-bottom:.5rem; font-size:.84rem; color:var(--board-soft); }
.board-note a { color:var(--board-ink); }

/* sources page */
.src-group { margin:2rem 0 0; }
.src-group h2 { font-size:1.75rem; margin-bottom:.6rem; }
.src-table { width:100%; border-collapse:collapse; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; font-size:.95rem; }
.src-table th { text-align:left; font-size:.85rem; color:var(--ink-soft); background:var(--surface-2); padding:.55rem .8rem; border-bottom:1px solid var(--line-strong); }
.src-table td { padding:.55rem .8rem; border-bottom:1px solid var(--line); }
.src-table tr:last-child td { border-bottom:0; }
.src-table .num { text-align:right; font-variant-numeric:tabular-nums; width:6rem; }

/* signup: live "what you'd get" preview + plain promises */
.preview { border:1px dashed var(--line-strong); border-radius:var(--r-lg); padding:.85rem 1rem; margin:0 0 1rem; background:var(--surface); }
.preview.has-result { border-style:solid; border-color:var(--go); background:var(--go-soft); }
.preview p { margin:0; }
.preview strong { font-family:var(--display); font-weight:800; font-size:1.45rem; line-height:1; color:var(--go-deep); }
.promises { list-style:none; margin:0 0 1.1rem; padding:0; display:grid; gap:.3rem; font-size:.93rem; color:var(--ink-soft); }
.promises li { position:relative; padding-left:1.4rem; }
.promises li::before { content:""; position:absolute; left:.2rem; top:.42rem; width:.65rem; height:.35rem; border-left:2px solid var(--go); border-bottom:2px solid var(--go); transform:rotate(-45deg); }

/* trial / lapse recap: the user's own numbers */
.recap { border:1px solid var(--line); border-left:4px solid var(--go); background:var(--surface); border-radius:var(--r-lg); padding:1.1rem 1.25rem; margin:0 0 1.5rem; }
.recap.ending { border-left-color:var(--u-soon); background:var(--u-soon-bg); }
.recap h2 { font-size:1.7rem; margin-bottom:.45rem; }
.recap p { margin:0 0 .6rem; max-width:68ch; }
.recap .small { font-size:.9rem; color:var(--ink-soft); }
.recap strong { font-variant-numeric:tabular-nums; }
.list-head { font-size:1.6rem; margin:1.75rem 0 .75rem; }
.list-head:first-child { margin-top:0; }

/* pricing FAQ */
.faq { margin-top:3rem; max-width:62rem; }
.faq h2 { margin-bottom:1rem; }
.faq dl { margin:0; display:grid; gap:0; border-top:1px solid var(--line-strong); }
.faq dt { font-weight:700; padding-top:1rem; }
.faq dd { margin:.3rem 0 0; padding-bottom:1rem; border-bottom:1px solid var(--line); color:var(--ink-soft); max-width:66ch; }
@media (min-width:860px){ .faq dl{ grid-template-columns:20rem 1fr; column-gap:2rem; } .faq dt{ padding-bottom:1rem; border-bottom:1px solid var(--line); } .faq dd{ padding-top:1rem; margin-top:0; } }

/* yearly price line + the two pay buttons on a plan card */
.plan .yearly { margin:0 0 .25rem; font-size:.93rem; color:var(--go-deep); font-weight:700; }
.plan.featured .yearly { color:var(--b-far); }
.pay-options { margin-top:auto; display:grid; gap:.5rem; }
.pay-options form { margin:0; }

/* alert profiles: a summary card per saved profile, the form folded beneath */
.profile { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.2rem 1.35rem; margin:0 0 1.1rem; scroll-margin-top:84px; }
.profile.saved { border-color:var(--u-far); box-shadow:0 0 0 1px var(--u-far); }
.profile.paused { background:var(--surface-2); }
.profile-head { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem .75rem; margin-bottom:.8rem; }
.profile-head h2 { font-size:1.75rem; margin-right:auto; }
.watch { margin:0 0 .9rem; display:grid; gap:.35rem; }
.watch > div { display:grid; grid-template-columns:8.5rem 1fr; gap:.75rem; }
.watch dt { color:var(--ink-faint); font-size:.92rem; }
.watch dd { margin:0; }
@media (max-width:480px){ .watch > div{ grid-template-columns:1fr; gap:0; } }
.profile-result { margin:0 0 .9rem; padding:.7rem .85rem; background:var(--go-soft); border-radius:var(--r); }
.profile-result strong { font-family:var(--display); font-weight:800; font-size:1.35rem; color:var(--go-deep); }
.profile-edit > summary { list-style:none; width:auto; }
.profile-edit > summary::-webkit-details-marker { display:none; }
.profile-edit[open] > summary { margin-bottom:1.1rem; }
.profile-edit form { border-top:1px solid var(--line); padding-top:1.1rem; }

/* trades saved beyond the plan's cap: shown, but marked as not in use */
.watch .unused { display:block; margin-top:.2rem; font-size:.88rem; color:var(--u-soon); }