:root {
  --forest-950: #042f2e;
  --forest-900: #063f3a;
  --forest-800: #075b54;
  --forest-700: #08766b;
  --forest-100: #d9f1eb;
  --forest-50: #eefaf7;
  --amber-500: #f2a516;
  --amber-100: #fff2c9;
  --sky-500: #2b9dcc;
  --blue-700: #244f86;
  --ink: #0b3035;
  --muted: #62777c;
  --line: #cfe0e2;
  --cream: #f3f8f8;
  --paper: #ffffff;
  --white: #ffffff;
  --danger: #a33a2c;
  --shadow: 0 22px 60px rgba(12, 62, 67, 0.1);
  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 12px;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  color: var(--ink);
  background: #f7f6f1;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
  padding-bottom: 5rem;
}

button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
h1, h2, h3, strong { font-weight: 650; }
a, button { -webkit-tap-highlight-color: transparent; }

.skip-link {
  position: fixed;
  left: 1rem;
  top: -4rem;
  z-index: 100;
  background: var(--white);
  color: var(--forest-900);
  padding: 0.75rem 1rem;
  border-radius: 0 0 10px 10px;
}
.skip-link:focus { top: 0; }

.site-header {
  min-height: 78px;
  padding: 0.85rem clamp(1rem, 4vw, 4rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  background: rgba(255, 255, 255, 0.88);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 20;
  backdrop-filter: blur(20px) saturate(140%);
}
.site-header::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, #004d3d, #08766b 42%, #f7c64b 72%, #b86c00); }

.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
  color: inherit;
}
.brand img { width: 48px; height: 48px; filter: drop-shadow(0 8px 14px rgba(4,47,46,0.16)); }
.brand strong { display: block; color: var(--forest-900); letter-spacing: 0.08em; font-size: 1.2rem; font-weight: 900; }
.brand small { display: block; color: var(--muted); font-size: 0.7rem; letter-spacing: 0.015em; }
.brand-wordmark { flex: 0 1 auto; min-width: 0; }
.brand-logo-frame { display: block; width: clamp(210px, 22vw, 292px); height: 62px; overflow: hidden; }
.brand img.brand-logo { display: block; width: 100%; height: auto; max-width: none; transform: translateY(-18.5%); filter: none; }

.session-button {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0.62rem 0.9rem;
  background: var(--white);
  color: var(--ink);
  transition: color .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.session-button:hover, .session-button:focus-visible, .nigeria-pill:hover, .nigeria-pill:focus-visible { color: var(--white); background: var(--forest-800); border-color: var(--forest-800); box-shadow: 0 8px 22px rgba(6,63,58,.17); outline: none; transform: translateY(-1px); }
.session-button:active, .nigeria-pill:active { transform: translateY(0); }
.status-dot { width: 0.55rem; height: 0.55rem; background: var(--amber-500); border-radius: 50%; }
.session-button.connected .status-dot { background: #2d9a68; box-shadow: 0 0 0 4px rgba(45, 154, 104, 0.13); }
.admin-link { color: var(--forest-800); font-weight: 750; text-decoration: none; font-size: 0.86rem; }
.admin-link:hover, footer a:hover { text-decoration: underline; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 0.75rem; flex-wrap: wrap; }
.nigeria-pill { display: inline-flex; align-items: center; gap: 0.35rem; color: var(--forest-800); background: var(--forest-50); border: 1px solid #cae4d9; border-radius: 999px; padding: 0.35rem 0.65rem; font-size: 0.74rem; font-weight: 800; transition: color .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.network-banner { background: #7f2e24; color: var(--white); padding: 0.55rem 1rem; text-align: center; font-size: 0.82rem; font-weight: 700; }

.public-landing {
  width: min(1280px, calc(100% - 2rem));
  margin: 1.1rem auto 0;
  padding: clamp(2rem, 5vw, 4rem);
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(410px, 1.08fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
  border: 1px solid rgba(6, 63, 58, .12);
  border-radius: 30px;
  background:
    radial-gradient(circle at 4% 6%, rgba(247, 198, 75, .20), transparent 25%),
    radial-gradient(circle at 88% 82%, rgba(72, 163, 137, .13), transparent 32%),
    linear-gradient(135deg, #fffdf8 0%, #ffffff 58%, #f1f8f4 100%);
  box-shadow: 0 28px 80px rgba(14, 58, 53, .08);
  overflow: hidden;
}
.pilot-badge { display: inline-flex; margin-bottom: .8rem; padding: .34rem .62rem; border-radius: 999px; background: var(--amber-100); color: #74500f; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; }
.public-landing h1 { max-width: 680px; margin: .45rem 0 .9rem; color: var(--forest-950); font-size: clamp(2.35rem, 4.4vw, 4.25rem); font-weight: 650; line-height: 1.04; letter-spacing: -.038em; }
.public-landing-copy > p:not(.eyebrow) { max-width: 620px; color: var(--muted); font-size: clamp(1rem, 1.55vw, 1.12rem); }
.public-actions { display: flex; flex-wrap: wrap; gap: .65rem; align-items: center; margin: 1.35rem 0; }
.public-actions .action-link { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: .48rem; padding: .68rem 1rem; text-decoration: none; }
.action-link svg { width: 1.08rem; height: 1.08rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.public-actions .quiet-link { padding: .6rem .7rem; color: var(--forest-800); font-weight: 600; text-decoration: none; }
.public-actions .quiet-link:hover { text-decoration: underline; }
.trust-points { list-style: none; display: grid; gap: .55rem; margin: 1.4rem 0 0; padding: 0; color: #395c59; font-size: .84rem; }
.trust-points li { display: flex; align-items: flex-start; gap: .55rem; }
.trust-points li::before { content: "✓"; width: 1.25rem; height: 1.25rem; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: var(--forest-100); color: var(--forest-800); font-size: .72rem; font-weight: 900; }
.public-proof { padding: clamp(1.15rem, 2.5vw, 1.7rem); border: 1px solid #d8e3df; border-radius: 20px; background: var(--white); box-shadow: 0 14px 40px rgba(6,63,58,.06); }
.public-proof h2 { margin: .25rem 0 1rem; font-size: clamp(1.4rem, 2.4vw, 1.85rem); font-weight: 650; color: var(--forest-950); }
.public-product-link { display: grid; grid-template-columns: 2.5rem 1fr auto; gap: .8rem; align-items: center; margin-top: .65rem; padding: .85rem; border: 1px solid var(--line); border-radius: 14px; color: inherit; background: #fff; text-decoration: none; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.public-product-link:hover, .public-product-link:focus-visible { border-color: #86b9aa; box-shadow: 0 8px 22px rgba(6,63,58,.08); transform: translateY(-1px); outline: none; }
.public-product-link > span:nth-child(2) { display: grid; gap: .18rem; }
.public-product-link strong { color: var(--forest-950); font-size: .96rem; }
.public-product-link small, .pilot-disclosure { color: var(--muted); line-height: 1.42; }
.product-link-icon, .product-tab-icon { width: 2.45rem; height: 2.45rem; display: grid; place-items: center; border-radius: 11px; background: var(--forest-50); color: var(--forest-800); }
.product-link-icon.business, .product-tab-icon.business { background: #fff6dc; color: #9b6707; }
.product-link-icon svg, .product-tab-icon svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.product-link-arrow { color: var(--forest-700); font-size: 1.2rem; }
.pilot-disclosure { margin: 1rem 0 0; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .76rem; }

.home-page {
  background:
    radial-gradient(circle at 7% 19%, rgba(242, 165, 22, .11), transparent 20rem),
    radial-gradient(circle at 94% 28%, rgba(43, 157, 204, .09), transparent 22rem),
    linear-gradient(180deg, #faf8f1 0%, #f4f8f6 46%, #fff 100%);
}
.home-page .product-switcher { display: none; }
.home-page .public-landing { position: relative; }
.home-page .public-landing::before,
.home-page .public-landing::after {
  content: "";
  position: absolute;
  width: 16rem;
  height: 16rem;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(4px);
  opacity: .38;
  animation: ambient-drift 15s ease-in-out infinite alternate;
}
.home-page .public-landing::before { left: -9rem; top: -10rem; background: rgba(242,165,22,.22); }
.home-page .public-landing::after { right: -10rem; bottom: -10rem; background: rgba(43,157,204,.15); animation-delay: -5s; }
.home-page .public-landing > * { position: relative; z-index: 1; }
@keyframes ambient-drift { to { transform: translate3d(1.5rem, 1rem, 0) scale(1.08); } }

.heritage-carousel {
  position: relative;
  min-width: 0;
  border-radius: 24px;
  overflow: hidden;
  background: #0a3d38;
  box-shadow: 0 24px 60px rgba(4, 47, 46, .20);
}
.heritage-slides { position: relative; min-height: 490px; }
.heritage-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .65s ease, visibility .65s ease;
  background:
    radial-gradient(circle at 18% 24%, rgba(246,191,50,.28), transparent 28%),
    radial-gradient(circle at 78% 68%, rgba(43,157,204,.22), transparent 30%),
    linear-gradient(135deg, #0a5148, #082f36);
}
.heritage-slide.active { opacity: 1; visibility: visible; }
.heritage-slide img { width: 100%; height: 100%; min-height: 490px; display: block; object-fit: cover; }
.heritage-slide.image-error img { visibility: hidden; }
.heritage-slide.image-error::before { content: "Nigeria stories · picture unavailable"; position: absolute; inset: 42% 1.25rem auto; color: rgba(255,255,255,.68); text-align: center; font-size: .78rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.heritage-slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 34%, rgba(3, 34, 31, .2) 52%, rgba(3, 31, 29, .92) 100%); }
.heritage-caption { position: absolute; z-index: 2; inset: auto 1.45rem 1.4rem; max-width: 560px; color: #fff; }
.heritage-caption span { display: inline-flex; padding: .3rem .55rem; border-radius: 999px; background: rgba(255,255,255,.16); backdrop-filter: blur(10px); font-size: .68rem; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }
.heritage-caption h2 { margin: .7rem 0 .3rem; color: #fff; font-size: clamp(1.4rem, 2.5vw, 2.05rem); font-weight: 620; line-height: 1.08; letter-spacing: -.025em; }
.heritage-caption p { max-width: 510px; margin: 0; color: rgba(255,255,255,.86); font-size: .88rem; line-height: 1.45; }
.heritage-controls { position: absolute; z-index: 4; top: 1rem; left: 1rem; right: 1rem; display: flex; justify-content: space-between; align-items: center; pointer-events: none; }
.heritage-dots, .heritage-arrows { display: flex; gap: .4rem; pointer-events: auto; }
.heritage-dots { padding: .45rem .55rem; border-radius: 999px; background: rgba(4,38,35,.50); backdrop-filter: blur(10px); }
.heritage-dots button { width: .55rem; height: .55rem; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.48); }
.heritage-dots button.active { width: 1.4rem; border-radius: 999px; background: #f6bf32; }
.heritage-arrows button { width: 2.25rem; height: 2.25rem; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; background: rgba(4,38,35,.55); color: #fff; backdrop-filter: blur(10px); }
.heritage-arrows button:hover, .heritage-arrows button:focus-visible { background: #fff; color: var(--forest-950); outline: none; }
.heritage-arrows [data-heritage-toggle] { font-size: .82rem; font-weight: 800; letter-spacing: -.08em; }
.heritage-arrows [data-heritage-toggle][aria-pressed="true"] { background: #fff; color: var(--forest-950); letter-spacing: 0; }

.home-trust-strip {
  width: min(1160px, calc(100% - 2rem));
  margin: -1rem auto 2.4rem;
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  border: 1px solid rgba(6,63,58,.13);
  border-radius: 18px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 18px 45px rgba(10,55,51,.08);
  overflow: hidden;
}
.home-trust-strip div { padding: 1rem 1.25rem; display: grid; gap: .15rem; }
.home-trust-strip div + div { border-left: 1px solid #e0e9e5; }
.home-trust-strip strong { color: var(--forest-950); font-size: .86rem; }
.home-trust-strip span { color: var(--muted); font-size: .75rem; }

.home-discovery { width: min(1240px, calc(100% - 2rem)); margin: 0 auto 2.5rem; }
.home-discovery-heading { max-width: 720px; margin-bottom: 1.2rem; }
.home-discovery-heading h2 { margin: .38rem 0 .55rem; color: var(--forest-950); font-size: clamp(1.7rem, 3vw, 2.5rem); font-weight: 620; letter-spacing: -.025em; line-height: 1.12; }
.home-discovery-heading > p:last-child { color: var(--muted); margin: 0; }
.home-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .8rem; }
.home-category-grid a { min-height: 142px; display: grid; grid-template-columns: 5.5rem minmax(0,1fr) auto; grid-template-rows: auto auto; column-gap: .85rem; align-items: center; padding: 1rem; border: 1px solid #d6e2df; border-radius: 17px; background: rgba(255,255,255,.88); color: inherit; text-decoration: none; box-shadow: 0 10px 26px rgba(9,58,53,.04); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.home-category-grid a:hover, .home-category-grid a:focus-visible { transform: translateY(-3px); border-color: #89b9ac; box-shadow: 0 16px 34px rgba(9,58,53,.10); outline: none; }
.home-category-grid strong { align-self: end; color: var(--forest-950); font-size: .94rem; font-weight: 600; }
.home-category-grid small { align-self: start; color: var(--muted); line-height: 1.35; }
.home-category-grid b { grid-column: 3; grid-row: 1 / 3; color: #73918d; font-size: 1.1rem; }
.home-category-icon { grid-row: 1 / 3; width: 5.5rem; height: 5.5rem; display: grid; place-items: center; border-radius: 13px; background: #e9f5f0; color: #08766b; font-size: 1.6rem; overflow: hidden; }
.home-category-icon.technology { background: #eaf2fb; color: #25638b; }
.home-category-icon.services { background: #fff0e8; color: #a94f23; }
.home-category-icon.learning { background: #f1edfb; color: #6e55a6; }
.home-category-icon.utilities { background: #fff5d9; color: #9a6807; }
.home-category-icon.fuel { background: #fff0e4; color: #a64b22; }
.home-category-icon.business { background: #edf3e6; color: #56772b; }
.category-picture { position:relative; display:grid; place-items:center; width:100%; height:100%; min-width:0; border-radius:12px; overflow:hidden; background:#faf3e7; }
.category-picture img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; visibility:hidden; }
.category-picture.picture-ready img { visibility:visible; }
.category-picture-fallback { display:block; color:#08766b; font-size:1.8rem; line-height:1; }
.category-picture.picture-ready .category-picture-fallback { visibility:hidden; }
.category-image-note { color:var(--muted); font-size:.75rem; line-height:1.5; margin:.75rem 0; }
.result-card.has-category-picture { grid-template-columns:4.5rem minmax(0,1fr) auto; }
.result-card > .category-picture { width:4.5rem; height:4.5rem; align-self:start; }
.low-data .category-picture img { display:none; }
.low-data .category-picture .category-picture-fallback { visibility:visible; }
.how-it-works { width: min(1240px, calc(100% - 2rem)); margin: 3rem auto; display: grid; grid-template-columns: .55fr 1fr; gap: 2rem; align-items: start; }
.how-it-works h2 { margin: .3rem 0; color: var(--forest-950); font-size: clamp(1.55rem, 3vw, 2.25rem); }
.how-it-works ol { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .8rem; margin: 0; padding: 0; }
.how-it-works li { display: grid; grid-template-columns: 2rem 1fr; gap: .7rem; padding: 1rem; border: 1px solid var(--line); border-radius: 16px; background: var(--white); }
.how-it-works li > span { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 9px; background: var(--amber-100); color: #704900; font-weight: 900; }
.how-it-works li div { display: grid; gap: .28rem; }
.how-it-works li small { color: var(--muted); line-height: 1.4; }

.product-switcher {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  max-width: 980px;
  margin: 1.25rem auto;
  padding: .75rem;
  background: #f7faf9;
  border: 1px solid var(--line);
  border-radius: 18px;
}
.product-tab {
  display: grid;
  grid-template-columns: 2.45rem 1fr auto;
  align-items: center;
  gap: .8rem;
  min-height: 74px;
  border: 1px solid #d7e3df;
  background: var(--white);
  border-radius: 14px;
  padding: .8rem .9rem;
  color: inherit;
  text-align: left;
  text-decoration: none;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.product-tab:hover, .product-tab:focus-visible { border-color: #84b7a8; transform: translateY(-1px); outline: none; }
.product-tab-copy { display: grid; gap: .12rem; }
.product-tab-copy strong { color: var(--forest-950); font-size: .96rem; }
.product-tab-copy small { color: var(--muted); font-size: .78rem; }
.product-tab-arrow { color: #7b9996; font-size: 1.15rem; }
.product-tab.active { border: 2px solid var(--forest-700); box-shadow: 0 7px 20px rgba(6,63,58,.08); }
.product-tab.active .product-tab-arrow { color: var(--forest-700); }

.pilot-guide { max-width: 980px; margin: 0 auto 1.25rem; padding: .85rem 1rem; background: var(--white); border: 1px solid var(--line); border-radius: 14px; }
.pilot-guide summary { cursor: pointer; color: var(--forest-800); font-size: .86rem; font-weight: 600; }
.pilot-guide summary span { color: var(--muted); font-weight: 500; }
.pilot-guide ol { list-style: none; padding: 1rem 0 .1rem; margin: .8rem 0 0; border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 0.7rem; }
.pilot-guide li { display: grid; grid-template-columns: 1.7rem 1fr; column-gap: 0.55rem; align-items: center; }
.pilot-guide li > span { grid-row: 1 / 3; width: 1.8rem; height: 1.8rem; display: grid; place-items: center; border-radius: 9px; background: var(--forest-50); color: var(--forest-800); font-size: 0.72rem; font-weight: 700; }
.pilot-guide li strong { font-size: 0.82rem; }
.pilot-guide li small { color: var(--muted); line-height: 1.3; }

.view { animation: fade-in 220ms ease-out; }
@keyframes fade-in { from { opacity: 0; transform: translateY(4px); } }

.hero {
  max-width: 1380px;
  margin: 0 auto;
  min-height: 310px;
  border-radius: 24px;
  padding: clamp(1.5rem, 4vw, 3.5rem);
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.95fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 5rem);
  overflow: hidden;
  position: relative;
  border: 1px solid #d6e3df;
}
.hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 32%; pointer-events: none; opacity: .45; background: radial-gradient(circle, rgba(242,165,22,.13) 0 2px, transparent 2.5px); background-size: 24px 24px; mask-image: linear-gradient(90deg, transparent, #000); }
.hero > * { position: relative; z-index: 1; }
.compare-hero {
  background: #f4f8f5;
  color: var(--ink);
}
.business-hero {
  background: #f8f7f1;
  color: var(--ink);
}
.hero h1 { color: var(--forest-950); font-size: clamp(2rem, 3.4vw, 3.35rem); font-weight: 650; line-height: 1.06; letter-spacing: -0.032em; margin: 0.5rem 0 1rem; max-width: 700px; }
.hero-copy > p:last-child { max-width: 640px; color: var(--muted); font-size: 1.08rem; }

.eyebrow { margin: 0; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; color: var(--forest-700); }
.hero .eyebrow { color: var(--forest-700); }

.search-box, .command-box {
  background: var(--white);
  color: var(--ink);
  border-radius: 24px;
  padding: clamp(1.2rem, 3vw, 2rem);
  border: 1px solid #cfded8;
  box-shadow: 0 24px 65px rgba(6,63,58,.11);
}
.search-box > label, .command-box > label { display: block; font-weight: 750; margin-bottom: 0.75rem; }
.search-row { display: flex; gap: 0.65rem; }
.search-row input { min-width: 0; flex: 1; }
.search-box-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; color: var(--forest-800); font-size: 0.78rem; font-weight: 800; }
.search-box-heading > div { display: flex; align-items: center; gap: 0.45rem; }
.search-box-heading small { color: var(--muted); font-weight: 700; }
.live-source-dot { display: inline-block; width: 0.58rem; height: 0.58rem; border-radius: 50%; background: #15945f; box-shadow: 0 0 0 4px rgba(21,148,95,0.12); }
.catalogue-select { min-height: 54px; border-color: #9fc8b8; background: var(--white); color: var(--forest-950); font-weight: 600; }
.catalogue-help { margin: 0.4rem 0 0; color: var(--muted); font-size: 0.72rem; }
.other-search { display: grid !important; gap: 0.35rem; margin: 0.8rem 0 0 !important; padding: 0.8rem; border: 1px solid #cfe0d8; border-radius: 12px; background: var(--forest-50); color: var(--forest-800); font-size: 0.78rem; }
.other-search[hidden] { display: none !important; }
.other-search small { color: var(--muted); font-weight: 600; line-height: 1.35; }
.other-search > label, .field-label { display: block; color: var(--forest-800); font-size: .76rem; font-weight: 800; }
.other-search-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.other-search-grid > span { display: grid; gap: .3rem; }
.search-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.65rem; align-items: end; margin-top: 0.75rem; }
.search-fields label { display: grid; gap: 0.3rem; color: var(--muted); font-size: 0.73rem; font-weight: 750; }
.search-fields select { min-width: 0; text-overflow: ellipsis; }
.primary-button.compare-submit { grid-column: 1 / -1; min-height: 48px; width: 100%; white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; background:#ff981f; border-color:#dc7b0b; color:var(--ink); transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease; }
.compare-submit:not(.is-loading):not(.is-compared):hover { background:#f28a0c; }
.compare-submit::before { content: "↔"; width: 1.45rem; height: 1.45rem; display: inline-grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.42); font-size: .88rem; font-weight: 900; }
.compare-submit.is-loading { background: #16855a; border-color: #0d6f49; color: var(--white); box-shadow: 0 7px 18px rgba(18,130,85,.22); }
.compare-submit.is-loading::before { content: "…"; background: rgba(255,255,255,.2); animation: compare-pulse .8s ease-in-out infinite alternate; }
.compare-submit.is-compared { background: #128255; border-color: #0c6b45; color: var(--white); box-shadow: 0 7px 18px rgba(18,130,85,.24); }
.compare-submit.is-compared:hover { background: #0f7049; }
.compare-submit.is-compared::before { content: "✓"; background: rgba(255,255,255,.2); }
@keyframes compare-pulse { to { opacity: .55; transform: scale(.88); } }
.compare-action-help { margin: .55rem 0 0; color: var(--muted); font-size: .72rem; line-height: 1.4; }
.quick-searches { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; margin-top: 0.8rem; }
.quick-searches > span { color: var(--muted); font-size: 0.72rem; font-weight: 700; }
.quick-searches button { border: 1px solid #cfe0d8; border-radius: 999px; padding: 0.32rem 0.56rem; background: var(--forest-50); color: var(--forest-800); font-size: 0.7rem; font-weight: 750; }
.quick-searches button:hover { background: var(--forest-900); color: var(--white); }

input, textarea, select {
  width: 100%;
  border: 1px solid #cbd8d2;
  border-radius: 12px;
  padding: 0.82rem 0.9rem;
  background: var(--white);
  color: var(--ink);
  outline: none;
}
textarea { resize: vertical; }
input:focus, textarea:focus, select:focus { border-color: var(--forest-700); box-shadow: 0 0 0 4px rgba(18, 107, 80, 0.12); }

.primary-button, .secondary-button, .text-button, .icon-button {
  border-radius: 12px;
  padding: 0.75rem 1rem;
  font-weight: 650;
}
.primary-button { background: #f4b323; color: #17332e; border: 1px solid #dc9905; box-shadow: 0 5px 14px rgba(224,143,7,.14); }
.primary-button:hover { background: #ffc13c; transform: translateY(-1px); }
.secondary-button { background: var(--white); color: var(--forest-800); border: 1px solid #a9cfc4; }
.text-button { background: transparent; color: var(--forest-700); border: 0; padding-inline: 0; }
.icon-button { width: 2.5rem; height: 2.5rem; padding: 0; background: var(--forest-50); color: var(--forest-900); border: 0; font-size: 1.5rem; }
.field-hint { margin: 0.65rem 0 0; color: var(--muted); font-size: 0.8rem; }
.command-actions { display: flex; gap: 1rem; justify-content: space-between; align-items: end; margin-top: 0.75rem; }
.business-suggestions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin-top: 0.7rem; }
.business-suggestions span { color: var(--muted); font-size: 0.72rem; font-weight: 750; }
.business-suggestions button { border: 1px solid #c9dde2; border-radius: 999px; padding: 0.34rem 0.6rem; background: #f0f8fb; color: var(--blue-700); font-size: 0.7rem; font-weight: 800; }
.business-suggestions button:hover { background: var(--blue-700); color: var(--white); }

.content-shell { max-width: 1320px; margin: 1.5rem auto 4rem; padding: 0 0.25rem; }
.compare-overview { margin-bottom: 1.25rem; }
.home-page #main > .view { display: none !important; }
.product-page .public-landing,
.product-page > .pilot-guide,
.product-page > .how-it-works { display: none; }
.product-page .product-switcher { margin-top: 1.15rem; }
.coverage-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; }
.coverage-grid article { background: rgba(255,255,255,0.96); border: 1px solid var(--line); border-radius: 18px; padding: 1.1rem 1.2rem; box-shadow: 0 12px 34px rgba(8,70,72,0.07); position: relative; overflow: hidden; }
.coverage-grid article::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: linear-gradient(var(--forest-700), var(--sky-500)); }
.coverage-grid strong { display: block; color: var(--forest-900); font-size: 1.65rem; line-height: 1; }
.coverage-grid span { display: block; color: var(--muted); font-size: 0.78rem; margin-top: 0.35rem; }
.browse-panel { margin-top: 0.75rem; display: grid; grid-template-columns: minmax(230px, 0.55fr) 1fr; gap: 1.25rem; align-items: center; background: linear-gradient(120deg, rgba(222,246,240,0.9), rgba(234,245,252,0.94)); border: 1px solid #c4dfe0; border-radius: 20px; padding: 1.2rem 1.35rem; }
.browse-panel h2 { margin: 0.15rem 0; font-size: 1.25rem; }
.browse-panel p:last-child { color: var(--muted); margin: 0.25rem 0 0; font-size: 0.82rem; }
.research-snapshot { margin-top: 0; margin-bottom: 1.25rem; padding: 1.25rem; border: 1px solid #c8ded8; border-radius: 20px; background: linear-gradient(145deg, #fffefb, #eef8f4); }
.research-snapshot-heading { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: 1rem; }
.research-snapshot-heading h2 { margin: 0.15rem 0 0.35rem; font-size: 1.35rem; }
.research-snapshot-heading p:last-child { color: var(--muted); max-width: 760px; margin: 0; font-size: 0.86rem; }
.research-link-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; }
.research-link-card { display: grid; grid-template-columns: auto 1fr; gap: 0.25rem 0.65rem; align-items: start; padding: 0.9rem; min-height: 142px; color: var(--forest-950); text-decoration: none; border: 1px solid #cfe1dc; border-radius: 14px; background: rgba(255,255,255,0.9); transition: transform 150ms ease, border-color 150ms ease, box-shadow 150ms ease; }
.research-link-card:hover, .research-link-card:focus-visible { transform: translateY(-2px); border-color: #70a996; box-shadow: 0 8px 22px rgba(6,63,58,0.09); outline: none; }
.research-link-icon { grid-row: 1 / span 3; display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 10px; background: #e2f3ed; color: var(--forest-800); font-size: 0.67rem; font-weight: 750; }
.research-link-card strong { font-size: 0.92rem; }
.research-link-card small { color: var(--muted); line-height: 1.45; }
.research-link-card > span:last-child { color: var(--forest-700); font-size: 0.76rem; font-weight: 700; margin-top: auto; }
.research-note { margin: 0.85rem 0 0; padding-top: 0.8rem; border-top: 1px solid #d6e5e0; color: var(--muted); font-size: 0.78rem; }
.fuel-discovery { scroll-margin-top: 1rem; padding: 1.25rem; border: 1px solid #d7dccb; border-radius: 22px; background: linear-gradient(135deg, #fffdf7 0%, #f2f8f3 54%, #eef6f8 100%); box-shadow: 0 16px 42px rgba(32,70,55,.07); }
.fuel-discovery-heading { display: flex; justify-content: space-between; gap: 1.25rem; align-items: flex-start; }
.fuel-discovery-heading h2 { margin: .15rem 0 .35rem; color: var(--forest-950); font-size: 1.45rem; letter-spacing: -.025em; }
.fuel-discovery-heading p:last-child { max-width: 820px; margin: 0; color: var(--muted); font-size: .86rem; line-height: 1.55; }
.fuel-live-rule { display: inline-flex; align-items: center; gap: .45rem; flex: 0 0 auto; padding: .5rem .7rem; border: 1px solid #bed8ce; border-radius: 999px; background: rgba(255,255,255,.82); color: var(--forest-800); font-size: .72rem; font-weight: 800; }
.fuel-live-rule i { width: .55rem; height: .55rem; border-radius: 50%; background: #15945f; box-shadow: 0 0 0 4px rgba(21,148,95,.12); }
.fuel-shortcuts { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: .65rem; margin: 1rem 0; }
.fuel-shortcuts button { display: grid; grid-template-columns: 2.35rem 1fr; grid-template-rows: auto auto; gap: .1rem .6rem; align-items: center; padding: .8rem; text-align: left; border: 1px solid #cbded5; border-radius: 14px; background: rgba(255,255,255,.92); color: var(--forest-950); transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease; }
.fuel-shortcuts button:hover, .fuel-shortcuts button:focus-visible { transform: translateY(-2px); border-color: #6da990; box-shadow: 0 10px 24px rgba(9,76,60,.10); outline: none; }
.fuel-shortcuts button > span { grid-row: 1 / 3; width: 2.35rem; height: 2.35rem; display: grid; place-items: center; border-radius: 11px; background: #fff0d7; color: #885713; font-size: .67rem; font-weight: 900; }
.fuel-shortcuts button strong { font-size: .82rem; }
.fuel-shortcuts button small { color: var(--muted); font-size: .68rem; }
.station-offer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)); gap: .7rem; }
.station-offer-grid a { min-height: 160px; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto 1fr auto; gap: .2rem .6rem; padding: .9rem; border: 1px solid #d2e0da; border-radius: 15px; background: rgba(255,255,255,.86); color: var(--forest-950); text-decoration: none; transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease; }
.station-offer-grid a:hover, .station-offer-grid a:focus-visible { transform: translateY(-2px); border-color: #7bac99; box-shadow: 0 10px 24px rgba(9,76,60,.09); outline: none; }
.station-offer-grid a > span { grid-row: 1 / 4; min-width: 2.4rem; height: 2.4rem; display: grid; place-items: center; padding: 0 .35rem; border-radius: 10px; background: #e7f3ee; color: var(--forest-800); font-size: .66rem; font-weight: 900; }
.station-offer-grid strong { font-size: .86rem; }
.station-offer-grid small { color: var(--muted); font-size: .7rem; line-height: 1.4; }
.station-offer-grid b { align-self: end; color: var(--forest-700); font-size: .7rem; }
.fuel-safety-note { margin: .9rem 0 0; padding-top: .8rem; border-top: 1px solid #d8e3dc; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.category-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: flex-end; }
.category-chips button { border: 1px solid #bdd6cc; border-radius: 999px; padding: 0.5rem 0.75rem; background: var(--white); color: var(--forest-800); font-weight: 750; font-size: 0.78rem; }
.category-chips button:hover, .category-chips button.active { background: linear-gradient(135deg, var(--forest-800), var(--blue-700)); color: var(--white); border-color: transparent; box-shadow: 0 7px 16px rgba(22,83,100,.16); }
.two-column { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr); gap: 1.25rem; align-items: start; }
.comparison-results { scroll-margin-top: 1rem; transition: box-shadow .25s ease, background .25s ease; border-radius: 24px; }
.comparison-results.results-ready { animation: results-arrive 900ms ease-out; }
@keyframes results-arrive { 0% { box-shadow: 0 0 0 0 rgba(18,130,85,.35); } 55% { box-shadow: 0 0 0 8px rgba(18,130,85,.12); } 100% { box-shadow: 0 0 0 0 rgba(18,130,85,0); } }
.panel, .proposal-panel, .gate-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: clamp(1.1rem, 3vw, 1.75rem);
  box-shadow: var(--shadow);
}
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.1rem; }
.section-heading h2, .gate-card h2, .proposal-panel h2 { margin: 0.22rem 0 0; font-size: 1.4rem; letter-spacing: -0.025em; }
.quiet-badge { background: var(--forest-50); color: var(--forest-700); border-radius: 999px; padding: 0.35rem 0.65rem; font-size: 0.75rem; font-weight: 750; }

.result-list, .data-list { display: grid; gap: 0.7rem; }
.result-card, .data-row, .price-row {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--white);
  padding: 1rem;
}
.result-card { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; }
.result-card h3, .data-row h3 { margin: 0; font-size: 1rem; }
.result-card p, .data-row p, .price-row p { margin: 0.24rem 0 0; color: var(--muted); font-size: 0.86rem; }
.price-range { font-weight: 800; color: var(--forest-800); font-size: 1.03rem; text-align: right; }
.price-range small { display: block; margin-top: 0.3rem; color: var(--muted); font-size: 0.7rem; font-weight: 650; }
.price-range .range-label { margin: 0 0 .2rem; color: var(--forest-700); font-size: .64rem; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.price-range.historical { color: #7d5714; }
.price-range .historical-label { color: #8a5d07; font-weight: 800; }
.card-actions { display: flex; gap: 0.45rem; margin-top: 0.65rem; flex-wrap: wrap; }
.card-actions button { padding: 0.5rem 0.7rem; border-radius: 10px; border: 1px solid var(--line); background: var(--white); color: var(--forest-800); font-weight: 700; }
.result-card .derived-note { color: #8a5d07; font-weight: 700; }
.equivalent-strip { margin-top: -0.2rem; display: flex; align-items: stretch; gap: 0.45rem; overflow-x: auto; padding: 0.1rem 0 0.35rem; scrollbar-width: thin; }
.equivalent-strip > span { min-width: 84px; align-self: center; color: var(--muted); font-size: 0.7rem; font-weight: 750; line-height: 1.2; }
.equivalent-strip button { min-width: 86px; display: grid; gap: 0.08rem; text-align: left; border: 1px solid var(--line); border-radius: 10px; padding: 0.48rem 0.58rem; background: rgba(255,255,255,0.8); color: var(--forest-900); }
.equivalent-strip button:hover, .equivalent-strip button.active { border-color: var(--forest-700); background: var(--forest-50); }
.equivalent-strip button strong { font-size: 0.76rem; }
.equivalent-strip button small { color: var(--muted); font-size: 0.64rem; white-space: nowrap; }

.price-row { margin-bottom: 0.65rem; }
.price-row-top { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; }
.price-row strong { font-size: 1.12rem; color: var(--forest-900); }
.price-row-top span { color: var(--muted); font-size: 0.78rem; text-align: right; }
.evidence-link { display: inline-flex; margin-top: 0.65rem; color: var(--forest-700); font-size: 0.78rem; font-weight: 800; text-decoration: none; }
.evidence-link:hover { text-decoration: underline; }
.trust-line { display: flex; gap: 0.45rem; flex-wrap: wrap; margin-top: 0.65rem; }
.trust-chip { background: var(--forest-50); color: var(--forest-800); border-radius: 999px; padding: 0.25rem 0.55rem; font-size: 0.72rem; font-weight: 750; }
.trust-chip.stale { background: #f7e8df; color: var(--danger); }
.trust-chip.calculated { background: var(--amber-100); color: #775313; }
.confidence-explanation { margin: .65rem 0 0; color: var(--muted); font-size: .75rem; line-height: 1.45; }
.purchase-options { margin-bottom: 1rem; padding: 1rem; border: 1px solid #b9d9cd; border-radius: 16px; background: linear-gradient(145deg, #f2fbf7, #fffdf7); }
.purchase-options-heading { display: grid; gap: .2rem; margin-bottom: .75rem; }
.purchase-options-heading h3 { margin: 0; color: var(--forest-950); font-size: 1rem; }
.purchase-options-heading p { margin: 0; color: var(--muted); font-size: .74rem; line-height: 1.4; }
.purchase-option-grid { display: grid; gap: .55rem; }
.purchase-option { display: grid; grid-template-columns: 1fr auto; gap: .35rem .8rem; align-items: center; padding: .75rem; border: 1px solid #d1e4dc; border-radius: 12px; background: var(--white); }
.purchase-option strong { color: var(--forest-950); font-size: .84rem; }
.purchase-option small { color: var(--muted); font-size: .69rem; line-height: 1.35; }
.purchase-option-price { color: var(--forest-800); font-size: .86rem; font-weight: 850; text-align: right; white-space: nowrap; }
.purchase-link { grid-column: 1 / -1; display: inline-flex; align-items: center; justify-content: center; min-height: 38px; border-radius: 9px; background: var(--forest-800); color: var(--white); font-size: .75rem; font-weight: 800; text-decoration: none; }
.purchase-link:hover, .purchase-link:focus-visible { background: var(--forest-950); outline: 3px solid rgba(18,130,85,.16); outline-offset: 2px; }
.evidence-subheading { margin: 1rem 0 .65rem; color: var(--forest-950); font-size: .92rem; }

.empty-state { min-height: 220px; display: grid; place-content: center; text-align: center; color: var(--muted); padding: 2rem; border: 1px dashed #cbd8d2; border-radius: var(--radius-sm); }
.empty-state.compact { min-height: 160px; }
.empty-icon { display: block; color: var(--forest-700); font-size: 2.5rem; }
.research-state h3 { margin: 0.35rem 0; color: var(--forest-900); }
.research-state p { max-width: 470px; margin: 0 auto 0.65rem; }
.research-state small { color: var(--forest-700); font-weight: 750; }
.source-intro { color: var(--muted); max-width: 900px; margin: -0.35rem 0 1rem; }
.source-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; }
.source-card { border: 1px solid var(--line); border-radius: 14px; padding: 1rem; background: var(--white); }
.source-card h3 { margin: 0; font-size: 0.95rem; }
.source-card p { color: var(--muted); font-size: 0.78rem; margin: 0.45rem 0; }
.offline-data-note { grid-column: 1 / -1; margin: 0 0 0.25rem; padding: 0.55rem 0.7rem; border: 1px solid #d4e5df; border-radius: 10px; background: #f2faf7; color: var(--forest-800); font-size: 0.76rem; font-weight: 650; }
.source-meta { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.65rem; }
.source-meta span { border-radius: 999px; padding: 0.22rem 0.48rem; background: var(--forest-50); color: var(--forest-700); font-size: 0.68rem; font-weight: 750; }

.gate-card { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.gate-card p { margin-bottom: 0; color: var(--muted); }
.business-identity { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 0.85rem; margin-bottom: 1rem; padding: 1rem 1.15rem; color: var(--white); border-radius: 20px; background: linear-gradient(110deg, var(--forest-900), #0f6571 64%, var(--blue-700)); box-shadow: 0 16px 38px rgba(10,65,71,.18); overflow: hidden; position: relative; }
.business-identity::after { content: ""; position: absolute; width: 150px; height: 150px; right: 8%; top: -95px; border-radius: 50%; border: 22px solid rgba(255,255,255,.07); }
.business-avatar { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 14px; background: linear-gradient(145deg, #ffd467, #f09b12); color: var(--forest-950); font-weight: 900; box-shadow: 0 8px 20px rgba(0,0,0,.16); }
.business-identity div:nth-child(2) { display: grid; line-height: 1.25; position: relative; z-index: 1; }
.business-identity div:nth-child(2) > span { color: rgba(255,255,255,.7); font-size: .7rem; text-transform: uppercase; letter-spacing: .09em; font-weight: 800; }
.business-identity strong { font-size: 1.15rem; }
.business-identity small { color: rgba(255,255,255,.76); }
.ledger-status { display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .65rem; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; background: rgba(255,255,255,.1); font-size: .72rem; font-weight: 800; position: relative; z-index: 1; }
.ledger-status i { width: .5rem; height: .5rem; border-radius: 50%; background: #6ee7a4; box-shadow: 0 0 0 4px rgba(110,231,164,.14); }
.business-task-section { margin: 0 0 1rem; padding: 1.2rem; border: 1px solid var(--line); border-radius: 20px; background: #fbfcfa; }
.business-task-section .section-heading { align-items: end; }
.business-task-section .section-heading small { max-width: 330px; color: var(--muted); text-align: right; }
.business-task-section h2 { margin: .25rem 0 0; color: var(--forest-950); font-size: 1.35rem; }
.business-task-grid { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: .65rem; }
.business-task-grid button { min-width: 0; display: grid; grid-template-columns: 2rem 1fr; grid-template-rows: auto auto; gap: .1rem .55rem; align-items: center; padding: .8rem; text-align: left; border: 1px solid #cdded7; border-radius: 14px; background: var(--white); color: var(--forest-950); }
.business-task-grid button:hover, .business-task-grid button:focus-visible { border-color: var(--forest-700); box-shadow: 0 8px 24px rgba(6,63,58,.1); transform: translateY(-1px); }
.business-task-grid button > span { grid-row: 1 / 3; width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 9px; background: var(--forest-50); color: var(--forest-800); font-weight: 900; }
.business-task-grid button strong { overflow-wrap: anywhere; font-size: .78rem; }
.business-task-grid button small { color: var(--muted); font-size: .65rem; line-height: 1.25; }
.metrics-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.85rem; margin-bottom: 1rem; }
.metric-card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-md); padding: 1.2rem; }
.metric-card span, .metric-card small { display: block; color: var(--muted); }
.metric-card strong { display: block; font-size: clamp(1.45rem, 3vw, 2.15rem); letter-spacing: -0.04em; margin: 0.35rem 0 0.15rem; }
.metric-card.accent { background: linear-gradient(135deg, var(--forest-900), var(--blue-700)); border-color: transparent; color: var(--white); box-shadow: 0 16px 34px rgba(18,71,91,.2); }
.metric-card.accent span, .metric-card.accent small { color: rgba(255,255,255,0.7); }

.proposal-panel { margin-bottom: 1rem; border: 2px solid var(--amber-500); }
.proposal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; margin: 1rem 0; }
.proposal-grid div { background: var(--amber-100); border-radius: 12px; padding: 0.8rem; }
.proposal-grid dt { font-size: 0.72rem; color: #775313; text-transform: uppercase; letter-spacing: 0.08em; font-weight: 800; }
.proposal-grid dd { margin: 0.25rem 0 0; font-weight: 750; }
.proposal-actions { display: flex; justify-content: flex-end; gap: 0.65rem; }
.record-result { margin: 0 0 1rem; padding: 1rem 1.15rem; display: grid; grid-template-columns: auto 1fr; gap: .15rem .75rem; align-items: center; border: 1px solid #b8dbc9; border-radius: 14px; background: #eef9f2; color: #165c43; }
.record-result strong { grid-row: 1 / 3; }
.record-result small { color: #4e7466; }

.workspace-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.inline-form { background: var(--forest-50); border-radius: 14px; padding: 1rem; display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.inline-form label, .dialog-card label { display: grid; gap: 0.35rem; font-size: 0.78rem; font-weight: 750; color: var(--muted); }
.inline-form button { align-self: end; }
.data-row { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.data-value { text-align: right; font-weight: 800; color: var(--forest-800); }
.data-value small { display: block; font-weight: 600; color: var(--muted); }
.data-value.negative { color: var(--danger); }
.activity-panel { margin-top: 1rem; }

.session-dialog { border: 0; border-radius: 24px; padding: 0; width: min(92vw, 560px); box-shadow: 0 30px 100px rgba(0,0,0,0.28); }
.session-dialog::backdrop { background: rgba(3, 30, 22, 0.66); backdrop-filter: blur(5px); }
.dialog-card { padding: 1.5rem; display: grid; gap: 0.85rem; }
.dialog-card > p { margin: 0; color: var(--muted); }
.auth-panel { display: grid; gap: 0.85rem; border: 0; padding: 0; min-width: 0; }
.auth-panel[hidden] { display: none; }
.auth-panel > small { color: var(--muted); line-height: 1.45; }
.session-summary { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0.2rem 1rem; padding: 0.85rem; border-radius: 14px; background: var(--forest-50); border: 1px solid #cfe5dc; }
.session-summary small { color: var(--muted); }
.session-summary button { grid-column: 2; grid-row: 1 / 3; }
.consent-group { border: 1px solid var(--line); border-radius: 14px; padding: 0.85rem; display: grid; gap: 0.65rem; }
.consent-group legend { padding: 0 0.35rem; color: var(--forest-900); font-size: 0.78rem; font-weight: 800; }
.dialog-card .check-label { display: flex; grid-template-columns: none; align-items: flex-start; gap: 0.55rem; color: var(--text); font-weight: 600; line-height: 1.35; }
.check-label input { width: 1rem; height: 1rem; margin-top: 0.1rem; accent-color: var(--forest-700); }
.notice-shell { width: min(920px, calc(100% - 2rem)); margin: 3rem auto; }
.notice-document { padding: clamp(1.25rem, 4vw, 3rem); }
.notice-document h1 { font-size: clamp(2rem, 6vw, 4rem); max-width: 13ch; }
.notice-document h2 { margin-top: 2rem; }
.notice-document p { color: var(--muted); line-height: 1.75; }
.notice-warning { margin-top: 2rem; padding: 1rem; border-left: 4px solid var(--amber-500); background: var(--amber-100); border-radius: 10px; line-height: 1.55; }
.dialog-heading, .dialog-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.dialog-heading h2 { margin: 0.2rem 0 0; }
.dialog-actions { justify-content: flex-end; margin-top: 0.5rem; }

.toast-region { position: fixed; right: 1rem; bottom: 1rem; z-index: 50; display: grid; gap: 0.5rem; }
.toast { max-width: min(92vw, 380px); background: var(--forest-950); color: var(--white); border-radius: 12px; padding: 0.8rem 1rem; box-shadow: var(--shadow); }
.toast.error { background: #7f2e24; }

.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.assistant-shell { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 120; display: grid; justify-items: end; }
.assistant-toggle { display: inline-flex; align-items: center; gap: .6rem; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; padding: .55rem .85rem .55rem .55rem; background: linear-gradient(135deg, var(--forest-950), var(--blue-700)); color: var(--white); box-shadow: 0 16px 42px rgba(0,45,55,.32); font-weight: 850; }
.assistant-toggle:hover { transform: translateY(-2px); box-shadow: 0 20px 48px rgba(0,45,55,.38); }
.assistant-toggle img { width: 2.2rem; height: 2.2rem; border-radius: 10px; box-shadow: 0 5px 14px rgba(0,0,0,.2); }
.assistant-panel { position: absolute; right: 0; bottom: 4.25rem; width: min(430px, calc(100vw - 2rem)); max-height: min(710px, calc(100vh - 7rem)); overflow: hidden; border: 1px solid rgba(18,107,80,.25); border-radius: 24px; background: rgba(248,252,252,.98); box-shadow: 0 30px 90px rgba(0,24,30,.34); backdrop-filter: blur(18px); }
.assistant-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.1rem; background: linear-gradient(135deg, var(--forest-950), #075b58 62%, var(--blue-700)); color: var(--white); }
.assistant-header span { display: block; color: #ffd66c; font-size: .68rem; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.assistant-header h2 { margin: .2rem 0 0; font-size: 1.08rem; letter-spacing: -.02em; }
.assistant-close { width: 2.25rem; height: 2.25rem; flex: 0 0 auto; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: rgba(255,255,255,.1); color: var(--white); font-size: 1.3rem; }
.assistant-messages { min-height: 230px; max-height: min(390px, calc(100vh - 330px)); overflow-y: auto; padding: 1rem; display: grid; gap: .85rem; align-content: start; background: radial-gradient(circle at 15% 0%, rgba(47,150,178,.08), transparent 35%), linear-gradient(#f7fbfb, #f1f8f7); }
.assistant-message { max-width: 92%; padding: .8rem .9rem; border-radius: 16px; background: var(--white); border: 1px solid #d5e5e1; box-shadow: 0 8px 22px rgba(8,70,72,.06); }
.assistant-message.user { justify-self: end; background: linear-gradient(135deg, #e5f4ef, #e4f1f6); border-color: #bcd9d1; }
.assistant-message.thinking { color: var(--muted); font-size: .82rem; font-weight: 700; }
.assistant-message-label { display: block; margin-bottom: .3rem; color: var(--forest-700); font-size: .65rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.assistant-message p { margin: 0; color: var(--text); font-size: .88rem; line-height: 1.55; }
.assistant-confidence { display: inline-flex; margin-top: .65rem; border-radius: 999px; padding: .27rem .48rem; font-size: .66rem; font-weight: 850; }
.assistant-confidence.grounded { color: #07563e; background: #dff4e9; border: 1px solid #b9dfcc; }
.assistant-confidence.limited { color: #805214; background: #fff2cd; border: 1px solid #efd38a; }
.assistant-facts { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .4rem; margin: .7rem 0 0; }
.assistant-facts div { min-width: 0; padding: .45rem; border-radius: 9px; background: var(--forest-50); }
.assistant-facts dt { color: var(--muted); font-size: .58rem; font-weight: 800; text-transform: uppercase; }
.assistant-facts dd { margin: .18rem 0 0; color: var(--forest-900); font-size: .71rem; font-weight: 850; overflow-wrap: anywhere; }
.assistant-sources { display: flex; flex-wrap: wrap; gap: .34rem; align-items: center; margin-top: .65rem; }
.assistant-sources strong { width: 100%; color: var(--muted); font-size: .65rem; }
.assistant-sources a, .assistant-sources span { border-radius: 999px; padding: .24rem .42rem; background: #eef6fa; color: var(--blue-700); font-size: .64rem; font-weight: 800; text-decoration: none; }
.assistant-sources a:hover { background: var(--blue-700); color: var(--white); }
.assistant-prompts { display: flex; gap: .38rem; padding: .7rem 1rem 0; overflow-x: auto; background: var(--white); }
.assistant-prompts button { flex: 0 0 auto; max-width: 240px; border: 1px solid #c7ddd6; border-radius: 999px; padding: .36rem .55rem; background: var(--forest-50); color: var(--forest-800); font-size: .68rem; font-weight: 800; white-space: nowrap; }
.assistant-prompts button:hover { background: var(--forest-900); color: var(--white); }
.assistant-form { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .55rem; align-items: end; padding: .75rem 1rem .45rem; background: var(--white); }
.assistant-panel { display:flex; flex-direction:column; overflow-y:auto; }
.assistant-panel[hidden] { display:none; }
.assistant-panel > * { flex-shrink:0; }
.assistant-panel .assistant-messages { flex:1 1 auto; min-height:85px; max-height:190px; }
.assistant-voice-controls { padding:.7rem 1rem; display:grid; gap:.45rem; background:#f1f7f5; border-bottom:1px solid #d1e4dd; }
.assistant-voice-controls > strong { font-size:.95rem; font-weight:600; }
.assistant-voice-controls > label:not(.voice-check) { display:grid; gap:.3rem; font-size:.8rem; }
.assistant-voice-controls select { min-height:42px; padding:.45rem .6rem; font-size:.9rem; font-weight:500; background:#fff; }
.assistant-voice-controls .voice-check { display:flex; align-items:flex-start; gap:.45rem; font-size:.76rem; font-weight:400; line-height:1.45; }
.voice-check input { width:17px; height:17px; margin:.15rem 0 0; flex-shrink:0; }
.assistant-voice-actions { display:flex; flex-wrap:wrap; gap:.45rem; align-items:center; }
.assistant-voice-actions button { padding:.5rem .65rem; min-height:40px; font-size:.78rem; font-weight:550; }
.assistant-voice-status { margin:0; font-size:.75rem; line-height:1.45; color:#3f6460; }
.assistant-voice-player { width:100%; height:38px; }
.assistant-original { margin-top:.6rem; font-size:.8rem; }
.assistant-language-trial { display:block; margin-top:.5rem; color:#52716c; }
.voice-channel-button { display:flex; flex-wrap:wrap; align-items:center; gap:.3rem .55rem; padding:.6rem .8rem; border:1px solid #d1bd7c; border-radius:14px; background:#fff8df; color:#164d44; font-weight:550; }
.voice-channel-button small { font-size:.7rem; font-weight:400; }
.assistant-input { min-height: 48px; max-height: 108px; padding: .65rem .75rem; border-radius: 13px; font-size: .83rem; line-height: 1.35; }
.assistant-send { min-height: 48px; border: 1px solid #d88e09; border-radius: 13px; padding: .65rem .9rem; background: linear-gradient(135deg, #ffc33d, #ef9c0b); color: #17352e; font-weight: 900; }
.assistant-send:disabled { opacity: .65; cursor: wait; }
.assistant-privacy { display: block; padding: 0 1rem .8rem; background: var(--white); color: var(--muted); font-size: .62rem; line-height: 1.35; }

footer { max-width: 1320px; margin: 0 auto; padding: 2rem 1rem 3rem; display: flex; justify-content: space-between; gap: 2rem; color: var(--muted); font-size: 0.82rem; border-top: 1px solid var(--line); }
footer p { margin: 0; }
footer a { color: var(--forest-800); font-weight: 700; text-decoration: none; }
.pilot-support { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 1rem; }
.help-copy h2 { margin: 0.3rem 0 0.8rem; font-size: 1.7rem; }
.help-copy > p:not(.eyebrow) { color: var(--muted); }
.help-copy details { border-top: 1px solid var(--line); padding: 0.8rem 0; }
.help-copy summary { cursor: pointer; font-weight: 750; color: var(--forest-800); }
.help-copy details p { color: var(--muted); margin-bottom: 0; }

.admin-shell { max-width: 1400px; margin: 0 auto; padding: 2rem clamp(1rem, 4vw, 3rem) 4rem; }
.admin-intro { display: flex; justify-content: space-between; gap: 2rem; align-items: end; margin-bottom: 1.5rem; }
.admin-intro h1 { margin: 0.45rem 0 0.7rem; max-width: 800px; font-size: clamp(2rem, 5vw, 4.2rem); line-height: 1; letter-spacing: -0.05em; }
.admin-intro p:last-child { color: var(--muted); max-width: 760px; }
.admin-actions { display: flex; gap: 0.6rem; flex-wrap: wrap; align-items: center; justify-content: flex-end; }
.admin-metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 1rem 0; }
.admin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.admin-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.admin-form label { display: grid; gap: 0.35rem; color: var(--muted); font-size: 0.78rem; font-weight: 750; }
.admin-form .form-wide { grid-column: 1 / -1; }
.admin-form button { align-self: end; }
.access-result { margin-top: 1rem; padding: 0.85rem; border: 1px solid #cfe5dc; background: var(--forest-50); border-radius: 12px; }
.access-result p { margin: 0.35rem 0 0; color: var(--muted); overflow-wrap: anywhere; }
.password-field { display: grid; grid-template-columns: 1fr auto; gap: 0.5rem; align-items: center; }
.password-field .text-button { padding: 0.6rem; }
.export-panel { margin-top: 1rem; }
.export-buttons { display: flex; flex-wrap: wrap; gap: 0.55rem; margin-bottom: 1rem; }
.export-buttons button { border: 1px solid var(--line); background: var(--white); color: var(--forest-800); border-radius: 10px; padding: 0.6rem 0.8rem; font-weight: 750; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
th, td { padding: 0.65rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { background: var(--forest-50); color: var(--forest-900); }

@media (max-width: 1180px) {
  .admin-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .business-task-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 900px) {
  .public-landing, .how-it-works { grid-template-columns: 1fr; }
  .home-category-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .heritage-slides, .heritage-slide img { min-height: 430px; }
  .how-it-works ol { grid-template-columns: 1fr; }
  .hero, .two-column, .workspace-grid { grid-template-columns: 1fr; }
  .hero { border-radius: 0; }
  .content-shell { padding: 0 1rem; }
  .metrics-grid { grid-template-columns: 1fr 1fr; }
  .detail-panel { position: static; }
  .admin-intro { align-items: flex-start; flex-direction: column; }
  .admin-actions { justify-content: flex-start; }
  .admin-grid { grid-template-columns: 1fr; }
  .pilot-guide { grid-template-columns: 1fr; margin-inline: 1rem; }
  .pilot-guide ol { grid-template-columns: 1fr 1fr; }
  .pilot-support { grid-template-columns: 1fr; }
  .coverage-grid { grid-template-columns: 1fr 1fr; }
  .browse-panel { grid-template-columns: 1fr; }
  .category-chips { justify-content: flex-start; }
  .source-grid { grid-template-columns: 1fr 1fr; }
  .research-link-grid { grid-template-columns: 1fr 1fr; }
  .fuel-shortcuts { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .station-offer-grid { grid-template-columns: 1fr 1fr; }
  .fuel-discovery-heading { flex-direction: column; }
  .research-snapshot-heading { flex-direction: column; }
  .search-fields { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
  body { padding-bottom: 4.5rem; }
  .site-header { min-height: 68px; }
  .brand small { display: none; }
  .brand-logo-frame { width: 190px; height: 47px; }
  .session-button { font-size: 0.8rem; }
  .product-switcher { grid-template-columns: 1fr; margin: 0.8rem; padding: .55rem; }
  .product-tab-copy small { display: block; }
  .hero { min-height: auto; padding: 2rem 1rem; gap: 1.5rem; }
  .public-landing { width: 100%; margin-top: 0; border-radius: 0; border-inline: 0; padding: 2.2rem 1rem; }
  .public-landing h1 { font-size: 2.25rem; }
  .heritage-carousel { border-radius: 18px; }
  .heritage-slides, .heritage-slide img { min-height: 410px; }
  .heritage-caption { inset: auto 1rem 1rem; }
  .heritage-caption p { font-size: .8rem; }
  .heritage-dots { gap: .22rem; padding: .4rem .45rem; }
  .heritage-dots button { width: .4rem; height: .4rem; }
  .heritage-dots button.active { width: .85rem; }
  .heritage-arrows { gap: .25rem; }
  .heritage-arrows button { width: 2rem; height: 2rem; }
  .home-trust-strip { grid-template-columns: 1fr; margin-top: 1rem; }
  .home-trust-strip div + div { border-left: 0; border-top: 1px solid #e0e9e5; }
  .home-category-grid { grid-template-columns: 1fr; }
  .home-category-grid a { min-height: 115px; grid-template-columns:5rem minmax(0,1fr) auto; }
  .home-category-icon { width:5rem; height:5rem; }
  .result-card.has-category-picture { grid-template-columns:3.5rem minmax(0,1fr); gap:.7rem; }
  .result-card > .category-picture { width:3.5rem; height:3.5rem; }
  .result-card.has-category-picture > .price-range { grid-column:2; }
  .public-actions { align-items: stretch; flex-direction: column; }
  .public-actions a { text-align: center; }
  .how-it-works { margin: 2rem auto; }
  .hero h1 { font-size: 2.1rem; }
  .search-row, .command-actions, .gate-card, footer { flex-direction: column; align-items: stretch; }
  .metrics-grid, .proposal-grid, .inline-form { grid-template-columns: 1fr; }
  .admin-metrics, .admin-form { grid-template-columns: 1fr; }
  .result-card { grid-template-columns: 1fr; }
  .price-range { text-align: left; }
  .data-row { align-items: flex-start; }
  .nigeria-pill { display: none; }
  .header-actions { gap: 0.3rem; flex: 1; min-width: 0; flex-wrap: wrap; }
  .admin-link { flex-basis: 100%; text-align: right; font-size: 0.72rem; }
  .pilot-guide ol { grid-template-columns: 1fr; }
  .coverage-grid, .source-grid, .research-link-grid { grid-template-columns: 1fr; }
  .fuel-shortcuts, .station-offer-grid { grid-template-columns: 1fr; }
  .search-fields { grid-template-columns: 1fr; }
  .search-fields label, .compare-submit { grid-column: 1; }
  .other-search-grid, .business-task-grid { grid-template-columns: 1fr; }
  .business-task-section .section-heading { align-items: flex-start; }
  .business-task-section .section-heading small { text-align: left; }
  .record-result { grid-template-columns: 1fr; }
  .record-result strong { grid-row: auto; }
  .session-summary { grid-template-columns: 1fr; }
  .session-summary button { grid-column: 1; grid-row: auto; }
  .business-identity { grid-template-columns: auto 1fr; }
  .ledger-status { grid-column: 1 / -1; width: fit-content; }
  .assistant-shell { right: .7rem; bottom: .7rem; }
  .assistant-toggle span { display: none; }
  .assistant-toggle { padding: .45rem; }
  .assistant-panel { position: fixed; inset: auto .5rem .5rem; width: auto; max-height: calc(100vh - 1rem); border-radius: 22px; }
  .assistant-messages { max-height: calc(100vh - 315px); }
  .assistant-facts { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}

/* Small, predictable controls for assisted and low-literacy pilot tasks. */
:focus-visible { outline: 3px solid #176cbd; outline-offset: 3px; }
.access-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:.55rem; padding:.65rem clamp(1rem,4vw,4rem); background:#fff; border-bottom:1px solid var(--line); font-size:.85rem; }
.access-toolbar label { display:flex; align-items:center; gap:.4rem; }
.access-toolbar select { width:auto; padding:.4rem; }
.access-toolbar button, .access-toolbar a { min-height:44px; border:1px solid var(--line); border-radius:10px; background:#f6faf9; padding:.45rem .65rem; text-decoration:none; color:var(--forest-900); font-weight:500; }
.access-toolbar button[aria-pressed=true] { background:var(--forest-900); color:white; }
.access-status { margin:.4rem auto; padding:0 1rem; max-width:1320px; color:var(--forest-800); font-size:.9rem; overflow-wrap:anywhere; }
.access-status:empty { display:none; }
.listen-guide { border:0; background:none; padding:.65rem 0; color:var(--forest-800); text-decoration:underline; min-height:44px; }
.voice-price-entry { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem; margin-bottom:1rem; }
.voice-price-entry button { font-weight:550; }
.picture-picks { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.5rem; margin:.55rem 0 1rem; }
.picture-picker h2 { font-size:1.25rem; font-weight:550; margin:.7rem 0; }
.picture-pick { display:flex; flex-direction:column; align-items:center; border:1px solid var(--line); border-radius:14px; background:#fff; color:var(--forest-800); padding:0; font-size:.95rem; font-weight:500; min-height:86px; overflow:hidden; }
.picture-pick:hover, .picture-pick:focus-visible { background:var(--amber-100); border-color:#c7991f; }
.picture-pick svg { width:42px; height:42px; }
.pick-picture { display:grid; place-items:center; width:100%; aspect-ratio:1.1; background:#faf4e8; }
.pick-picture img { display:block; width:100%; height:100%; min-height:0; object-fit:cover; }
.pick-caption { padding:.55rem .2rem; }
.pick-fallback { display:none; }
.photo-error .pick-picture img, .low-data .pick-picture img { display:none; }
.photo-error .pick-fallback, .low-data .pick-fallback { display:block; }
.low-data .pick-picture { aspect-ratio:auto; min-height:62px; }
.spoken-price-reply { margin:.75rem 0; padding:.85rem; border-left:3px solid #176cbd; border-radius:8px; background:#eff8fc; font-size:.95rem; line-height:1.6; overflow-wrap:anywhere; }
.spoken-price-reply .consent-row { margin:.7rem 0; font-size:.85rem; }
.reply-audio-note { border-top:1px solid #bfd8e5; margin:.7rem 0 0; padding-top:.7rem; color:#334f5e; font-size:.85rem; }
.native-price-player { display:block; width:100%; margin:.7rem 0; }
.local-unit-guide { border-top:1px solid var(--line); margin:.8rem 0; padding:.75rem 0; }
.local-unit-guide summary { cursor:pointer; font-weight:550; }
.unit-picture-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:.5rem; margin:.75rem 0; }
.unit-picture-grid span { text-align:center; background:#f4faf8; border-radius:10px; padding:.5rem; font-size:.8rem; }
.unit-picture-grid b { display:block; font-size:1.5rem; }
.unit-picture-grid svg { width:48px; height:48px; display:block; margin:auto; }
.more-tools { display:block; margin:1.2rem auto; }
.extra-tools { display:none; }
.extra-tools-visible .extra-tools { display:block; }
.accessible-price-actions, .price-micro-feedback { display:flex; gap:.5rem; flex-wrap:wrap; margin:.75rem 0; }
.accessible-price-actions button { font-size:.85rem; font-weight:500; min-height:44px; }
.price-micro-feedback { border-top:1px solid var(--line); padding-top:.65rem; font-size:.85rem; }
.price-micro-feedback > span { width:100%; }
.feedback-choice { background:#fff; border:1px solid var(--line); border-radius:20px; padding:.5rem .7rem; min-height:44px; color:var(--forest-800); }
.voice-review { padding:1rem; background:var(--forest-50); border-radius:12px; margin:1rem 0; }
#voice-query-dialog form, #share-dialog form, #field-review-form { display:grid; gap:.75rem; }
.voice-review label, #voice-query-dialog label, #field-review-form label { display:grid; gap:.35rem; font-size:.9rem; }
#voice-query-dialog .check-label { display:flex; align-items:flex-start; font-weight:450; }
.consent-row { display:flex !important; align-items:flex-start; gap:.65rem !important; font-weight:450 !important; }
.consent-row input[type=checkbox] { width:20px; height:20px; flex-shrink:0; margin-top:.2rem; }
#share-preview { width:100%; }
#receipt-mask-canvas { display:block; max-width:100%; max-height:600px; border:1px solid var(--line); touch-action:none; }
.mobile-primary-nav { display:none; }
.customer-channel-bar { display:flex; gap:.75rem; padding:.7rem clamp(1rem,4vw,4rem); background:#fff; border-bottom:1px solid var(--line); }
.whatsapp-button { display:inline-flex; align-items:center; justify-content:center; gap:.55rem; min-height:48px; padding:.7rem 1rem; border:1px solid #087946; border-radius:12px; background:#0b8650; color:#fff; text-decoration:none; font-weight:550; }
.whatsapp-button:hover { background:#086d41; }
.whatsapp-button img { filter:brightness(0) invert(1); flex-shrink:0; }
.customer-channel-bar small { font-size:.76rem; font-weight:400; }
.audio-guide-button { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:48px; padding:.7rem 1rem; border:1px solid #b6d9e2; border-radius:12px; background:#edf8fc; color:#174d62; font-weight:550; }
.audio-guide-panel { margin:1rem auto; padding:1.1rem; width:min(1160px,calc(100% - 2rem)); background:#fff; border:1px solid var(--line); border-radius:16px; }
.audio-guide-panel h2 { margin:0; font-size:1.1rem; }
.audio-guide-panel p { margin:.45rem 0; font-size:.9rem; color:var(--muted); }
.audio-guide-panel audio { width:min(100%,460px); margin:.6rem 0; }
.accessible-price-actions .whatsapp-button { font-size:.85rem; }
.public-actions a[href="./compare.html"] { background:#ff981f; border-color:#dc7b0b; }
.product-page .home-trust-strip, .product-page .home-discovery, .product-page .how-it-works { display:none; }
.compare-hero { align-items:start; }
.compare-mini-guide { list-style:none; padding:0; margin:1.8rem 0; display:grid; gap:1rem; }
.compare-mini-guide li { display:flex; gap:.8rem; align-items:flex-start; }
.compare-mini-guide li > span { display:grid; place-items:center; flex-shrink:0; width:30px; height:30px; border-radius:50%; background:var(--forest-100); color:var(--forest-800); font-size:.85rem; }
.compare-mini-guide strong { display:block; font-size:1rem; font-weight:550; }
.compare-mini-guide small { display:block; color:var(--muted); font-size:.9rem; }
.large-text { font-size:19px; }
.low-data .heritage-carousel { display:none; }
.low-data .public-landing { grid-template-columns:1fr; }
.low-data .home-category-grid img { display:none; }
.field-shell { max-width:1100px; margin:auto; padding:2rem 1rem; }
.field-shell .panel { margin:1rem 0; }
.field-intro h1 { font-size:clamp(1.8rem,4vw,2.7rem); line-height:1.15; max-width:800px; }
.field-intro p { max-width:800px; }
.field-session { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.field-session p { margin-right:auto; }
.field-form { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field-form label { display:grid; gap:.35rem; font-size:.95rem; font-weight:550; }
.field-form .form-wide { grid-column:1/-1; }
.field-form small { color:var(--muted); font-weight:400; }
.field-progress { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.field-card { padding:1rem; border:1px solid var(--line); border-radius:12px; margin:.7rem 0; overflow-wrap:anywhere; }
.field-card p { margin:.4rem 0; }
.field-card progress { width:100%; accent-color:var(--forest-700); }
.consent-script { background:#fff8e3; border:1px solid #e5c56d; border-radius:12px; padding:1rem; margin:1rem 0; }
.consent-script h3 { margin:0; }
.consent-script p { font-size:.9rem; }
@media(max-width:620px) {
  .customer-channel-bar { padding:.6rem .8rem; gap:.5rem; }
  .customer-channel-bar > button { flex:1; min-width:0; padding:.65rem .4rem; gap:.3rem; font-size:.85rem; }
  .customer-channel-bar small { display:none; }
  .access-toolbar { gap:.4rem; padding:.5rem .8rem; font-size:.78rem; }
  .access-toolbar button, .access-toolbar a { padding:.4rem .5rem; }
  .access-toolbar label { width:100%; }
  .brand-logo-frame { width:155px; }
  .session-button { max-width:155px; }
  .picture-picks { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .picture-pick { font-size:.9rem; }
  .unit-picture-grid { grid-template-columns:repeat(2,1fr); }
  .public-landing h1 { font-size:2rem; line-height:1.15; }
  .search-fields { grid-template-columns:1fr 1fr; }
  .search-fields label:first-child, .compare-submit { grid-column:1/-1; }
  .field-form,.field-progress { grid-template-columns:1fr; }
  .field-session { align-items:flex-start; }
  .field-shell .section-heading { align-items:flex-start; flex-wrap:wrap; }
  .mobile-primary-nav { display:flex; position:fixed; bottom:0; inset-inline:0; z-index:21; background:#fff; border-top:1px solid var(--line); padding:.4rem .5rem calc(.4rem + env(safe-area-inset-bottom)); justify-content:space-around; }
  .mobile-primary-nav a { text-decoration:none; color:var(--forest-900); padding:.6rem .4rem; font-size:.85rem; min-height:44px; }
  .mobile-primary-nav a[aria-current=page] { background:var(--forest-50); border-radius:8px; }
  .product-page .product-switcher { display:none; }
  .compare-mini-guide { display:none; }
  .assistant-shell { bottom:4.8rem; }
  .has-mobile-help .assistant-toggle { display:none; }
  .assistant-panel { bottom:4.6rem; }
}
/* Never disguise a disconnected static upload as a working pilot backend. */
.deployment-preview-note { padding: .65rem 1rem; background: #fff7e5; color: #5d4718; font-size: .875rem; line-height: 1.5; border-bottom: 1px solid #ecd7a5; text-align: center; }

/* Simple access: large targets, quiet surfaces and explicit opt-in audio. */
#customer-language-open,#customer-account-open { font-size:.875rem; font-weight:500; padding:.65rem .85rem; min-height:44px; }
.customer-small-label { display:none; }
.customer-advanced-access { padding:.4rem clamp(1rem,4vw,3.5rem); background:#f8fbfa; border-bottom:1px solid #e1ece7; }
.customer-advanced-access summary { cursor:pointer; padding:.5rem 0; color:#426c60; font-size:.85rem; min-height:44px; }
.customer-advanced-access .access-toolbar { padding:.5rem 0; }
.customer-simple-bar { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; padding:1rem clamp(1rem,4vw,3.5rem); background:#f7faf9; border-block:1px solid #dce9e6; }
.customer-simple-bar button { font-size:.95rem; font-weight:500; }
.customer-access-status { flex-basis:100%; margin:0; color:#315b55; font-size:.9rem; }
.customer-access-status:empty,.customer-dialog-status:empty { display:none; }
.customer-dialog { width:min(620px,calc(100vw - 24px)); max-width:calc(100vw - 24px); max-height:90vh; max-height:90svh; padding:1.4rem; border:1px solid #d2e3de; border-radius:22px; box-shadow:0 20px 80px #0b35394d; color:#173d38; background:white; overflow:auto; }
.customer-dialog::backdrop { background:#102c3266; }
.customer-dialog-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-bottom:.8rem; }
.customer-dialog-head h2 { font-size:1.4rem; line-height:1.35; font-weight:600; margin:0; }
.customer-close { border:1px solid #d3e4df; border-radius:50%; width:44px; height:44px; min-width:44px; padding:0; font-size:1.5rem; font-weight:400; background:white; color:#345c54; }
.customer-dialog p,.customer-dialog label { line-height:1.55; }
.customer-dialog fieldset { border:0; padding:0; margin:1rem 0; min-width:0; }
.customer-dialog legend { padding:0; margin-bottom:.8rem; font-size:1rem; font-weight:600; }
.customer-language-grid { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
.customer-language-choice { display:flex; align-items:center; gap:.7rem; min-height:76px; padding:1rem; border:1px solid #d6e5e0; border-radius:13px; cursor:pointer; background:#fbfdfc; }
.customer-language-choice:has(input:checked) { border:2px solid #16805b; background:#f0faf5; padding:calc(1rem - 1px); }
.customer-language-choice input { width:20px; height:20px; flex:0 0 20px; margin:0; accent-color:#16805b; }
.customer-language-choice strong { display:block; font-size:1.05rem; font-weight:600; }
.customer-language-choice small { display:block; color:#647a75; font-size:.85rem; }
.customer-check { display:flex; align-items:flex-start; gap:.7rem; margin:1rem 0; font-size:.9rem; font-weight:400; }
.customer-check input { width:20px; height:20px; min-width:20px; margin:.2rem 0 0; accent-color:#16805b; }
.customer-actions { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.25rem; }
.customer-actions button { flex:1 1 180px; font-weight:500; font-size:1rem; }
.customer-trial-note,.customer-dialog-status,.customer-account-status { padding:.85rem 1rem; border-radius:12px; background:#fff7e8; color:#6d5224; font-size:.9rem; }
.customer-small-note { font-size:.85rem; color:#59716c; }
.customer-field { display:flex; flex-direction:column; gap:.45rem; margin:1rem 0; font-weight:500; font-size:.95rem; }
.customer-field input,.customer-field select { width:100%; min-height:50px; box-sizing:border-box; font-size:1rem; font-weight:400; padding:.75rem .85rem; border:1px solid #c9dcd5; border-radius:11px; color:#173d38; background:white; }
.customer-field input:focus,.customer-field select:focus { outline:3px solid #f0c56d; outline-offset:2px; }
.customer-step-count { color:#577a70; font-size:.85rem; letter-spacing:.08em; }
.customer-task-body h3 { font-size:1.4rem; font-weight:500; margin:1rem 0; }
.customer-review { display:grid; grid-template-columns:1fr 2fr; gap:.7rem; padding:1rem; border-radius:12px; background:#f4f9f7; }
.customer-review dt { color:#557069; font-size:.9rem; }
.customer-review dd { margin:0; overflow-wrap:anywhere; font-weight:500; }
.customer-provider-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; }
.customer-provider-grid button { min-height:60px; font-size:.95rem; font-weight:500; padding:.6rem; border-radius:12px; }
.customer-dialog button:disabled { opacity:.62; cursor:not-allowed; }
.customer-dialog [hidden] { display:none !important; }
.customer-profile-fields { border-top:1px solid #dce9e6 !important; padding-top:1.2rem !important; }
.customer-account-location { margin:1rem 0; padding:1rem; border:1px solid #c9dfd6; border-radius:14px; background:#f7fbf9; }
.customer-account-location h3 { margin:0 0 .5rem; font-size:1.1rem; font-weight:600; }
.customer-account-location > p { margin:0 0 1rem; }
.nigeria-location-picker { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; min-width:0; }
.nigeria-location-picker .customer-field { margin:0; }
.nigeria-location-picker select { width:100%; min-width:0; min-height:48px; font-size:1rem; font-weight:400; padding:.7rem; color:#173d38; background:white; border:1px solid #c9dcd5; border-radius:11px; }
.nigeria-location-picker select:focus-visible { outline:3px solid #f0c56d; outline-offset:2px; }
.nigeria-location-picker .location-coverage-note,.nigeria-location-picker .location-data-note { grid-column:1/-1; margin:0; font-size:.85rem; font-weight:400; line-height:1.5; color:#526b64; }
.nigeria-location-picker .location-coverage-note { padding:.7rem; background:#f0f7f4; border-radius:9px; }
.compare-location-fields { border:1px solid #d8e7e0; border-radius:12px; padding:1rem; margin:1rem 0; }
.compare-location-fields legend { font-size:1rem; font-weight:500; padding:0 .35rem; }
.compare-location-fields label { display:flex; flex-direction:column; gap:.4rem; font-size:.9rem; font-weight:500; min-width:0; }
.compare-location-fields label:first-of-type { grid-column:1/-1; }
.customer-auth-section { margin:1rem 0; padding:.75rem 1rem; border:1px solid #d8e6e0; border-radius:12px; background:#fbfdfc; }
.customer-auth-section summary { cursor:pointer; min-height:36px; line-height:1.5; font-size:.95rem; color:#245f4e; }
@media(max-width:700px) {
  .nigeria-location-picker { grid-template-columns:1fr; }
  .site-header { flex-wrap:wrap; gap:.5rem; }
  .header-actions { flex-wrap:wrap; justify-content:flex-end; gap:.4rem; }
  .site-header .header-actions { flex:1 1 100%; justify-content:space-between; }
  .customer-wide-label { display:none; }
  .customer-small-label { display:inline; }
  .site-header #open-session { font-size:.8rem; padding:.55rem .65rem; }
  #customer-language-open,#customer-account-open { font-size:.8rem; padding:.55rem .65rem; }
  .customer-dialog { padding:1rem; border-radius:17px; }
  .customer-dialog-head h2 { font-size:1.2rem; }
  .customer-language-choice { padding:.8rem; gap:.5rem; }
  .customer-language-choice:has(input:checked) { padding:calc(.8rem - 1px); }
  .customer-provider-grid { grid-template-columns:1fr; }
  .customer-review { grid-template-columns:1fr; }
  .customer-review dd { margin-bottom:.5rem; }
}