/* Policy Forum 2026 — FIAC palette, phone-first.
   Contrast rules (design review 10/6):
   - White text is fine on --deep / --deep-2 / --mid at any size.
   - --fiac (#00987A) is a FILL/ACCENT only (white on it = 3.6:1); never small text.
   - Small green text on light surfaces uses --mid (#007A62, 5:1+). Text on deep green uses --mint.
   - Nothing sits across a colour boundary: the wave lives under the type. */
:root {
  --deep: #094438;
  --deep-2: #0f5a49;
  --deep-3: #062e26;
  --fiac: #00987a;
  --mid: #007a62;
  --mint: #8fe3cc;
  --mint-2: #b8e6da;
  --tint: #e6f4f0;
  --ink: #12201c;
  --muted: #56655f;
  --line: #dde5e2;
  --bg: #f4f7f6;
  --card: #ffffff;
  --link: #094438;
  --tile-edge: transparent;
  --bar-bg: rgba(255, 255, 255, 0.9);
  --shadow: 0 1px 2px rgba(9, 68, 56, 0.06), 0 6px 18px rgba(9, 68, 56, 0.07);
  --display: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --appbar-h: 52px;
  --tabbar-h: 4rem;
  --gutter: 1rem;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink: #e8efec; --muted: #a2b3ad; --line: #2a3a35; --bg: #0b1412; --card: #14201d;
    --tint: #13342c; --link: #5fd3b6; --mid: #5fd3b6; --tile-edge: #2e7d69;
    --bar-bg: rgba(20, 32, 29, 0.9); --shadow: none; color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --ink: #e8efec; --muted: #a2b3ad; --line: #2a3a35; --bg: #0b1412; --card: #14201d;
  --tint: #13342c; --link: #5fd3b6; --mid: #5fd3b6; --tile-edge: #2e7d69;
  --bar-bg: rgba(20, 32, 29, 0.9); --shadow: none; color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font: 1rem/1.5 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 0.5rem);
  -webkit-tap-highlight-color: transparent;
}
a { color: var(--link); }
h1, h2, h3 { line-height: 1.2; margin: 0; font-family: var(--display); }
button { font: inherit; color: inherit; }
main { max-width: 42.5rem; margin: 0 auto; padding: 1rem var(--gutter); outline: none; }
[hidden] { display: none !important; }
.loading { color: var(--muted); text-align: center; padding: 3rem 0; }
.vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -999px; top: 0; z-index: 100; background: #fff; color: var(--deep); padding: 0.75rem 1rem; }
.skip:focus { left: 0.5rem; top: 0.5rem; }
:focus-visible { outline: 3px solid var(--mid); outline-offset: 2px; border-radius: 6px; }
.appbar :focus-visible, .hero :focus-visible, .tile:focus-visible, .now-tile :focus-visible, .btn:focus-visible { outline-color: var(--mint); }

/* ---------- App bar: deep green on every route ---------- */
.appbar {
  position: sticky; top: 0; z-index: 30; background: var(--deep); color: #fff;
  padding-top: env(safe-area-inset-top);
}
.appbar-row { max-width: 42.5rem; margin: 0 auto; display: flex; align-items: center; gap: 0.25rem; min-height: 3.25rem; padding: 0 0.5rem 0 var(--gutter); }
.appbar-brand { display: flex; align-items: center; gap: 0.625rem; min-height: 2.75rem; text-decoration: none; color: #fff; }
.appbar-brand img { height: 1.75rem; width: auto; display: block; }
.appbar-title { font-family: var(--display); font-weight: 700; font-size: 1rem; letter-spacing: -0.01em; display: flex; align-items: center; gap: 0.5rem; }
.pill-year { font-size: 0.75rem; font-weight: 800; padding: 0.125rem 0.5rem; border-radius: 999px; background: rgba(143, 227, 204, 0.16); color: var(--mint); letter-spacing: 0.02em; }
.appbar-back { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; margin-left: -0.75rem; color: #fff; border-radius: 999px; }
.appbar-back svg { width: 1.5rem; height: 1.5rem; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

.banner { background: #fff4d6; color: #4a3800; border-bottom: 1px solid #ecd99a; padding: 0.625rem 1rem; font-size: 0.9375rem; text-align: center; }
.offline { background: var(--deep-3); color: var(--mint-2); font-size: 0.8125rem; text-align: center; padding: 0.375rem 1rem; }

/* ---------- Home hero: continuous with the app bar, wave underneath ---------- */
.hero {
  position: relative; color: #fff; margin: -1rem calc(var(--gutter) * -1) 1.25rem;
  padding: 1.25rem var(--gutter) 4.25rem;
  background:
    radial-gradient(70% 80% at 92% 40%, rgba(0, 152, 122, 0.28), transparent 70%),
    linear-gradient(180deg, var(--deep) 0%, #073a30 100%);
  overflow: hidden;
}
@media (min-width: 42.5rem) { .hero { margin-left: 0; margin-right: 0; border-radius: 0 0 1.25rem 1.25rem; } }
.hero > :not(.hero-wave) { position: relative; }
.hero-kicker { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--mint); }
.hero h1 { font-size: 1.875rem; font-weight: 800; line-height: 1.08; letter-spacing: -0.02em; margin: 0.5rem 0 0.875rem; max-width: 14ch; }
.hero-meta { display: flex; flex-wrap: wrap; gap: 0.375rem 1.125rem; font-size: 0.9375rem; font-weight: 500; color: rgba(255, 255, 255, 0.92); }
.hero-meta span { display: inline-flex; align-items: center; gap: 0.375rem; }
.hero-meta svg { width: 1rem; height: 1rem; fill: none; stroke: var(--mint); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hero.compact { padding-top: 0.75rem; padding-bottom: 3.25rem; }
.hero.compact h1 { font-size: 1.375rem; max-width: none; margin: 0.25rem 0 0; }
.hero.compact .hero-meta { display: none; }
.hero-wave { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: 3.5rem; display: block; pointer-events: none; }
.countdown { display: flex; align-items: baseline; gap: 0.625rem; margin-top: 1.25rem; }
.countdown b { font-family: var(--display); font-size: 3.5rem; font-weight: 800; line-height: 1; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.countdown span { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--mint); }
.hero-first { margin-top: 0.5rem; font-size: 0.9375rem; color: rgba(255, 255, 255, 0.88); }

/* ---------- Section headings ---------- */
.section-title { font-family: var(--display); font-size: 0.75rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--mid); margin: 1.5rem 0.125rem 0.625rem; }
.page-title { font-size: 1.625rem; font-weight: 800; letter-spacing: -0.02em; margin: 0.25rem 0.125rem 0.875rem; }

/* ---------- Live tiles ---------- */
.now-tile {
  display: block; text-decoration: none; color: #fff; border-radius: 1.25rem; padding: 1.25rem; margin-bottom: 0.75rem;
  background: linear-gradient(160deg, var(--deep-2), var(--deep)); box-shadow: inset 0 0 0 1px var(--tile-edge), var(--shadow);
}
.live-pill { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--mint); background: rgba(143, 227, 204, 0.14); padding: 0.25rem 0.625rem; border-radius: 999px; }
.live-pill i { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--fiac); box-shadow: 0 0 0 2px rgba(0, 152, 122, 0.35); }
.now-tile h2 { font-size: 1.375rem; font-weight: 800; letter-spacing: -0.01em; margin: 0.75rem 0 0.375rem; }
.now-meta { font-size: 0.9375rem; color: rgba(255, 255, 255, 0.85); }
.progress { display: flex; align-items: center; gap: 0.75rem; margin-top: 1rem; }
.progress-track { flex: 1; height: 0.375rem; border-radius: 999px; background: rgba(255, 255, 255, 0.18); overflow: hidden; }
.progress-fill { height: 100%; background: var(--fiac); border-radius: 999px; }
.progress-label { font-size: 0.8125rem; font-weight: 700; color: var(--mint-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.now-tile .btn { margin: 1rem 0 0; background: #fff; color: var(--deep); }

.next-tile { display: flex; gap: 1rem; align-items: flex-start; text-decoration: none; color: var(--ink); background: var(--tint); border-radius: 1.25rem; padding: 1rem 1.125rem; margin-bottom: 0.75rem; }
.next-time { font-family: var(--display); font-size: 1.25rem; font-weight: 800; color: var(--link); white-space: nowrap; line-height: 1.2; }
.next-time small { display: block; font-size: 0.75rem; font-weight: 700; color: var(--mid); letter-spacing: 0.04em; }
.next-title { font-weight: 700; font-size: 1rem; line-height: 1.35; }
.next-sub { font-size: 0.875rem; color: var(--muted); margin-top: 0.125rem; }

/* ---------- Explore tiles ---------- */
.tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.tile {
  position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; gap: 1rem;
  min-height: 7rem; padding: 1rem; border-radius: 1.125rem; text-decoration: none; color: #fff;
  background: linear-gradient(160deg, var(--deep-2), var(--deep)); box-shadow: inset 0 0 0 1px var(--tile-edge), var(--shadow);
}
.tile.wide { grid-column: 1 / -1; min-height: 6rem; flex-direction: row; align-items: flex-end; }
.tile::after {
  content: ""; position: absolute; right: 0; bottom: 0; width: 70%; height: 1.5rem; pointer-events: none; opacity: 0.9;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 24' preserveAspectRatio='none'%3E%3Cpath d='M0 22 C60 22 120 12 200 4' fill='none' stroke='%2300987a' stroke-width='2.5'/%3E%3C/svg%3E") no-repeat right bottom / 100% 100%;
}
.tile svg { width: 1.75rem; height: 1.75rem; fill: none; stroke: var(--mint); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.tile b { display: block; font-family: var(--display); font-size: 1.125rem; font-weight: 800; letter-spacing: -0.01em; }
.tile small { display: block; font-size: 0.8125rem; font-weight: 500; color: var(--mint-2); margin-top: 0.125rem; }
.tile.wide .tile-text { order: -1; margin-right: auto; }
.tile.wide svg { align-self: flex-start; }

/* ---------- Cards / buttons ---------- */
.card { background: var(--card); border: 1px solid var(--line); border-radius: 1rem; padding: 0.875rem 1rem; margin-bottom: 0.625rem; box-shadow: var(--shadow); }
@media (prefers-color-scheme: light) { .card { border-color: transparent; } }
a.card { display: block; text-decoration: none; color: inherit; }
.btn {
  display: flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; min-height: 3.25rem;
  padding: 0.75rem 1.25rem; border-radius: 999px; border: 0; cursor: pointer; text-decoration: none;
  background: var(--deep); color: #fff; font-family: var(--display); font-weight: 700; font-size: 1rem; margin-bottom: 0.625rem;
}
.btn:not(.secondary) { box-shadow: inset 0 0 0 1px var(--tile-edge); }
#view:focus, #view:focus-visible { outline: none; }
.btn.secondary { background: var(--card); color: var(--link); box-shadow: inset 0 0 0 1.5px var(--line); }
.btn svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.btn small { font-family: system-ui, sans-serif; font-weight: 500; opacity: 0.8; }
.pending { display: flex; gap: 0.625rem; align-items: center; color: var(--muted); font-size: 0.9375rem; padding: 0.875rem 1rem; border-radius: 1rem; border: 1.5px dashed var(--line); margin-bottom: 0.625rem; }
.pending svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 2; flex: none; }

/* ---------- Agenda timeline ---------- */
.daytabs { display: flex; gap: 0.25rem; padding: 0.25rem; border-radius: 999px; background: var(--tint); position: sticky; top: var(--appbar-h); z-index: 5; margin: 0 0 0.75rem; box-shadow: 0 -0.75rem 0 0.75rem var(--bg); }
.daytabs a { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 2.5rem; border-radius: 999px; text-decoration: none; color: var(--link); font-weight: 600; font-size: 0.9375rem; }
.daytabs a[aria-current="page"] { background: var(--deep); color: #fff; font-weight: 800; }
.daynote { font-size: 0.875rem; color: var(--muted); margin: 0 0.125rem 0.875rem; }

.timeline { list-style: none; margin: 0 0 1rem; padding: 0; }
.slot { display: grid; grid-template-columns: 3.75rem 1.25rem 1fr; align-items: start; }
.slot-time { font-size: 0.8125rem; font-weight: 700; color: var(--muted); text-align: right; padding-top: 0.95rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.slot-rail { position: relative; align-self: stretch; }
.slot-rail::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: var(--line); }
.slot:first-child .slot-rail::before { top: 1.25rem; }
.slot:last-child .slot-rail::before { bottom: auto; height: 1.25rem; }
.slot-rail i { position: absolute; left: 50%; top: 1.05rem; width: 0.625rem; height: 0.625rem; margin-left: -0.3125rem; border-radius: 50%; background: var(--bg); border: 2px solid var(--line); }
.slot.is-past .slot-rail::before { background: var(--fiac); }
.slot.is-past .slot-rail i { background: var(--fiac); border-color: var(--fiac); }
.slot.is-now .slot-rail i { background: var(--fiac); border-color: var(--fiac); box-shadow: 0 0 0 4px rgba(0, 152, 122, 0.25); }
.slot-body { padding: 0 0 0.625rem 0.25rem; min-width: 0; }
.slot-body .card { margin-bottom: 0; }
.slot.minor .slot-time { padding-top: 0.55rem; font-weight: 600; }
.slot.minor .slot-rail i { top: 0.65rem; width: 0.5rem; height: 0.5rem; margin-left: -0.25rem; }
.minor-row { padding: 0.45rem 0.25rem 0.9rem; color: var(--muted); font-size: 0.9375rem; }
.s-title { font-family: var(--display); font-weight: 700; font-size: 1.0625rem; line-height: 1.3; }
.s-sub { color: var(--muted); font-size: 0.875rem; margin-top: 0.25rem; }
.slot.is-past .s-title { color: var(--muted); }
.slot.is-now .card { background: linear-gradient(160deg, var(--deep-2), var(--deep)); color: #fff; border-color: var(--tile-edge); }
.slot.is-now .s-sub { color: rgba(255, 255, 255, 0.85); }
.slot.is-now .progress { margin-top: 0.75rem; }
.card.social { background: var(--tint); border-color: transparent; box-shadow: none; }
.chips { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-top: 0.5rem; }
.chip { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.75rem; font-weight: 700; padding: 0.2rem 0.6rem; border-radius: 999px; background: var(--tint); color: var(--link); }
.slot.is-now .chip { background: rgba(255, 255, 255, 0.14); color: #fff; }
.chip svg { width: 0.875rem; height: 0.875rem; fill: none; stroke: currentColor; stroke-width: 2.2; }

/* ---------- Session detail ---------- */
.status { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--mid); background: var(--tint); padding: 0.25rem 0.625rem; border-radius: 999px; margin-bottom: 0.75rem; }
.status.live { background: var(--deep); color: var(--mint); }
.detail h1 { font-size: 1.625rem; font-weight: 800; letter-spacing: -0.02em; margin-bottom: 0.5rem; }
.detail .when { color: var(--muted); font-size: 0.9375rem; margin-bottom: 1.125rem; }
.detail p { margin: 0 0 1rem; }
.detail .subtitle { font-weight: 600; color: var(--link); }
.speaker { display: flex; gap: 0.75rem; align-items: center; padding: 0.625rem 0; border-top: 1px solid var(--line); }
.speaker:first-child { border-top: 0; }
.avatar { flex: none; width: 2.625rem; height: 2.625rem; border-radius: 50%; background: var(--tint); color: var(--link); display: grid; place-items: center; font-family: var(--display); font-weight: 800; font-size: 0.875rem; }
.speaker b { display: block; font-weight: 700; }
.speaker span { color: var(--muted); font-size: 0.875rem; }

/* ---------- Slides list ---------- */
.row-link { display: flex; align-items: center; gap: 0.875rem; min-height: 4rem; padding: 0.75rem 1rem; text-decoration: none; color: var(--ink); }
.list { background: var(--card); border: 1px solid var(--line); border-radius: 1rem; box-shadow: var(--shadow); overflow: hidden; margin-bottom: 0.75rem; }
@media (prefers-color-scheme: light) { .list { border-color: transparent; } }
.list > * + * { border-top: 1px solid var(--line); }
.glyph { flex: none; width: 2.5rem; height: 2.5rem; border-radius: 0.75rem; background: var(--tint); color: var(--link); display: grid; place-items: center; }
.glyph svg, .trail svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.row-text { flex: 1; min-width: 0; }
.row-title { font-weight: 700; line-height: 1.3; }
.row-sub { font-size: 0.8125rem; color: var(--muted); margin-top: 0.125rem; }
.trail { color: var(--link); flex: none; }
.new-pill { display: inline-block; font-size: 0.6875rem; font-weight: 800; letter-spacing: 0.08em; color: #fff; background: #007a62; padding: 0.1rem 0.45rem; border-radius: 999px; margin-left: 0.375rem; vertical-align: 0.1em; }
.muted-list { list-style: none; margin: 0; padding: 0; }
.muted-list li { padding: 0.5rem 0.25rem; color: var(--muted); font-size: 0.9375rem; border-top: 1px solid var(--line); }
.muted-list li:first-child { border-top: 0; }
.muted-list a { color: var(--muted); }

/* ---------- Attendees ---------- */
.searchbar { position: sticky; top: var(--appbar-h); z-index: 5; background: var(--bg); padding: 0.5rem 0 0.5rem; margin-top: -0.5rem; }
.search-wrap { position: relative; }
.search-wrap svg { position: absolute; left: 0.875rem; top: 50%; width: 1.125rem; height: 1.125rem; margin-top: -0.5625rem; fill: none; stroke: var(--muted); stroke-width: 2; pointer-events: none; }
.search { width: 100%; min-height: 3rem; padding: 0.625rem 0.875rem 0.625rem 2.5rem; font-size: 1rem; border-radius: 999px; border: 1.5px solid var(--line); background: var(--card); color: var(--ink); }
.count { color: var(--muted); font-size: 0.875rem; margin: 0.25rem 0.125rem 0.75rem; }
.org { margin-bottom: 1rem; }
.org h2 { font-size: 0.8125rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--mid); margin: 0 0.125rem 0.5rem; }
.org h2 span { color: var(--muted); font-weight: 600; }
.person { display: flex; align-items: center; gap: 0.75rem; min-height: 3rem; padding: 0.5rem 1rem; }
.person .avatar { width: 2rem; height: 2rem; font-size: 0.75rem; }
mark { background: #c9ede3; color: inherit; border-radius: 3px; padding: 0 1px; }

/* ---------- Info ---------- */
.info-block h2 { font-size: 1.0625rem; font-weight: 700; margin-bottom: 0.25rem; }
.info-block p { margin: 0; }
.empty { color: var(--muted); text-align: center; padding: 2rem 0.75rem; }
.note { font-size: 0.875rem; color: var(--muted); }

/* ---------- Gate ---------- */
.gate { text-align: center; }
.gate .hero { text-align: left; }
.gate form { max-width: 20rem; margin: 0 auto; }
.gate p { color: var(--muted); margin: 0 auto 1.125rem; max-width: 32ch; }
.gate label { display: block; font-weight: 700; margin-bottom: 0.5rem; color: var(--link); }
.gate input { width: 100%; text-align: center; font-size: 1.375rem; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; min-height: 3.5rem; padding: 0.625rem; border-radius: 1rem; border: 1.5px solid var(--line); background: var(--card); color: var(--ink); margin-bottom: 0.75rem; }
.gate .err { color: #b3261e; min-height: 1.5em; font-size: 0.9375rem; }

/* ---------- Install hint ---------- */
.install { display: flex; gap: 0.5rem; align-items: center; background: var(--tint); border-radius: 1rem; padding: 0.375rem 0.25rem 0.375rem 1rem; margin-bottom: 0.75rem; }
.install p { margin: 0; font-size: 0.9375rem; flex: 1; }
.install button { width: 2.75rem; height: 2.75rem; background: none; border: 0; color: var(--muted); font-size: 1.375rem; cursor: pointer; border-radius: 999px; flex: none; }

/* ---------- Tab bar ---------- */
.tabbar { position: fixed; inset: auto 0 0 0; z-index: 20; background: var(--bar-bg); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom); }
@supports (backdrop-filter: blur(1px)) { .tabbar { backdrop-filter: saturate(1.4) blur(16px); -webkit-backdrop-filter: saturate(1.4) blur(16px); } }
.tabbar-row { display: flex; max-width: 42.5rem; margin: 0 auto; }
.tabbar a { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.125rem; min-height: var(--tabbar-h); text-decoration: none; color: var(--muted); font-size: 0.6875rem; font-weight: 600; }
.tab-ico { position: relative; display: grid; place-items: center; width: 3.5rem; height: 1.875rem; border-radius: 999px; }
.tabbar svg { width: 1.5rem; height: 1.5rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tab-label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tabbar a[aria-current="page"] { color: var(--link); font-weight: 800; }
.tabbar a[aria-current="page"] .tab-ico { background: var(--tint); }
.tabbar .dot { position: absolute; top: 0.125rem; right: 0.75rem; width: 0.5625rem; height: 0.5625rem; border-radius: 50%; background: var(--fiac); box-shadow: 0 0 0 2px var(--card); }

footer.site { text-align: center; color: var(--muted); font-size: 0.8125rem; padding: 1.5rem 0 0.5rem; }

/* ---------- Motion (only when the user hasn't asked for less) ---------- */
@media (prefers-reduced-motion: no-preference) {
  .tile, .now-tile, .next-tile, a.card, .btn, .row-link, .tabbar a { transition: transform 90ms ease-out, background-color 120ms; }
  .tile:active, .now-tile:active, .next-tile:active, a.card:active, .btn:active, .row-link:active { transform: scale(0.98); }
  .progress-fill { transition: width 600ms ease; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: 180ms; }
}
.gate input.gate-email { letter-spacing: normal; text-transform: none; font-size: 1.0625rem; font-weight: 500; }

/* ---------- People: segmented switch + FIAC directory ---------- */
.segtabs { display: flex; gap: 0.25rem; padding: 0.25rem; border-radius: 999px; background: var(--tint); margin: 0 0 0.875rem; }
.segtabs a { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 2.5rem; border-radius: 999px; text-decoration: none; color: var(--link); font-weight: 600; font-size: 0.9375rem; }
.segtabs a[aria-current="page"] { background: var(--deep); color: #fff; font-weight: 800; box-shadow: inset 0 0 0 1px var(--tile-edge); }
.fiac-intro { margin: 0 0.125rem 1rem; }
.fiac-grid { display: grid; grid-template-columns: 1fr; gap: 0.625rem; }
@media (min-width: 40rem) { .fiac-grid { grid-template-columns: 1fr 1fr; } }
.fiac-card { background: var(--card); border-radius: 1rem; overflow: hidden; box-shadow: var(--shadow); border: 1px solid var(--line); display: flex; align-items: stretch; }
@media (prefers-color-scheme: light) { .fiac-card { border-color: transparent; } }
/* Logo box stays white in dark mode: the logos are drawn for white backgrounds. */
.fiac-logo { flex: none; width: 6.75rem; background: #fff; display: flex; align-items: center; justify-content: center; padding: 0.625rem; border-right: 1px solid #e3ebe8; }
.fiac-logo img { display: block; width: auto; height: auto; max-width: 100%; max-height: 3rem; object-fit: contain; }
.fiac-body { min-width: 0; padding: 0.75rem 0.875rem; display: flex; flex-direction: column; gap: 0.375rem; flex: 1; }
.fiac-body h2 { font-size: 1rem; font-weight: 800; letter-spacing: -0.01em; line-height: 1.25; }
.fiac-body .note { margin: 0; }
.fiac-reps { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.375rem; }
.fiac-reps b { display: block; font-weight: 700; font-size: 0.9375rem; line-height: 1.3; }
.fiac-reps li span span { display: block; font-size: 0.8125rem; color: var(--muted); line-height: 1.3; }
.fiac-site { align-self: flex-start; display: inline-flex; align-items: center; min-height: 2.25rem; font-weight: 700; font-size: 0.875rem; }
.fiac-pill { display: inline-block; margin-left: 0.375rem; font-size: 0.625rem; font-weight: 800; letter-spacing: 0.08em; padding: 0.15rem 0.45rem; border-radius: 999px; background: var(--deep); color: var(--mint); text-decoration: none; vertical-align: 0.15em; }
.back-link { display: inline-flex; align-items: center; min-height: 2.75rem; font-weight: 700; text-decoration: none; margin-bottom: 0.25rem; }
.rep-mail { display: block; font-size: 0.8125rem; overflow-wrap: anywhere; line-height: 1.35; padding: 0.125rem 0; }
.fiac-about summary { cursor: pointer; font-weight: 700; font-size: 0.875rem; color: var(--link); min-height: 2.25rem; display: flex; align-items: center; }
.fiac-about p { margin: 0.25rem 0 0.25rem; font-size: 0.875rem; color: var(--muted); }
.speaker-bio { padding: 0 0 0.5rem; font-size: 0.9375rem; }
.speaker-bio p { margin: 0 0 0.625rem; }