/* Broadcastwell Exchange. Built on the Broadcastwell design system: Geist (self hosted, from the
   shared shell inlined on every page), canvas #F7F9FC, ink #101828, accent text #1D4ED8, bars and
   rules #3B82F6, light blue panel tints. Light only, like the app. Custom properties carry the bw-
   prefix the shared shell uses. One filled primary per screen: the participation action. */

:root {
  --bw-ex-canvas: #F7F9FC; --bw-ex-surface: #FFFFFF; --bw-ex-tint: #EFF4FB; --bw-ex-tint-strong: #E3ECFB;
  --bw-ex-ink: #101828; --bw-ex-muted: #475467; --bw-ex-faint: #667085; --bw-ex-border: #D5DDE8; --bw-ex-line: #E4E9F1;
  --bw-ex-accent: #1D4ED8; --bw-ex-accent-hover: #1A44C2; --bw-ex-bar: #3B82F6; --bw-ex-held: #92400E; --bw-ex-held-tint: #FEF3C7;
  --bw-ex-radius: 14px; --bw-ex-control: 10px; --bw-ex-gutter: 20px; --bw-ex-max: 1200px; --bw-ex-read: 720px;
  color-scheme: light;
  font-variant-numeric: tabular-nums;
}
@media (min-width: 810px) { :root { --bw-ex-gutter: 32px; } }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: 88px; -webkit-text-size-adjust: 100%; }
body.ex { margin: 0; background: var(--bw-ex-canvas); color: var(--bw-ex-ink); font-size: 16px; line-height: 1.65; text-rendering: optimizeLegibility; }
:where(body.ex) a { color: var(--bw-ex-accent); text-underline-offset: 3px; text-decoration-thickness: 1px; }
:where(body.ex) a:hover { text-decoration-thickness: 2px; }
body.ex :focus-visible { outline: 2px solid var(--bw-ex-accent); outline-offset: 2px; border-radius: 4px; }
h1, h2, h3 { color: var(--bw-ex-ink); text-wrap: balance; }
h1 { font-size: clamp(30px, 4.2vw, 46px); line-height: 1.12; letter-spacing: -0.03em; font-weight: 600; margin: 0 0 16px; }
h2 { font-size: clamp(21px, 2.2vw, 25px); line-height: 1.3; letter-spacing: -0.02em; font-weight: 600; margin: 0 0 12px; }
h3 { font-size: 18px; line-height: 1.4; letter-spacing: -0.01em; font-weight: 600; margin: 0 0 8px; }
p { margin: 0 0 14px; }
p, li, dd, blockquote { overflow-wrap: anywhere; }
ul, ol { padding-left: 22px; }
code { background: var(--bw-ex-tint); border-radius: 6px; padding: 1px 6px; font-size: 0.92em; }

.ex-skip { position: absolute; left: 12px; top: -60px; background: var(--bw-ex-surface); padding: 10px 14px; border-radius: 8px; z-index: 50; }
.ex-skip:focus { top: 10px; }
.ex-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Header */
header.bw-header.ex-header { gap: 8px 20px; flex-wrap: nowrap; }
.ex-brand { color: var(--bw-ex-accent) !important; font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 10px; margin-left: -12px; border-left: 1px solid var(--bw-ex-border); }
.ex-nav { display: flex; gap: 2px; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.ex-nav::-webkit-scrollbar { display: none; }
.ex-nav a, .ex-account a { color: var(--bw-ex-muted); font-size: 14px; font-weight: 500; text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 10px; border-radius: 8px; white-space: nowrap; }
.ex-nav a:hover, .ex-account a:hover { color: var(--bw-ex-ink); background: var(--bw-ex-tint); }
.ex-nav a[aria-current="page"], .ex-account a[aria-current="page"] { color: var(--bw-ex-accent); box-shadow: inset 0 -2px var(--bw-ex-accent); border-radius: 0; }
.ex-account { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.ex-bell { position: relative; }
.ex-count { position: absolute; top: 6px; right: 2px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--bw-ex-accent); color: #FFFFFF; font-size: 11px; font-weight: 600; line-height: 18px; text-align: center; }
@media (max-width: 860px) {
  header.bw-header.ex-header { flex-wrap: wrap; padding-top: 6px; padding-bottom: 0; }
  .ex-nav { order: 3; flex-basis: 100%; margin: 0 -10px; padding: 0 0 2px; border-top: 1px solid var(--bw-ex-line); }
}

/* Layout */
.ex-main { display: block; max-width: var(--bw-ex-read); margin: 0 auto; padding: 40px var(--bw-ex-gutter) 72px; outline: none; }
.ex-main.ex-wide { max-width: var(--bw-ex-max); }
.ex-narrow { max-width: var(--bw-ex-read); }
.ex-columns { display: grid; gap: 40px; grid-template-columns: minmax(0, 1fr); margin-top: 40px; }
@media (min-width: 1024px) { .ex-columns { grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; } }
.ex-grid { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) { .ex-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ex-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .ex-grid:not(.ex-grid-2):not(.ex-grid-3) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.ex-eyebrow { color: var(--bw-ex-accent); font-size: 13px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; margin: 0 0 10px; }
.ex-lede { font-size: clamp(17px, 1.6vw, 19px); color: var(--bw-ex-muted); max-width: 62ch; line-height: 1.55; }
.ex-muted { color: var(--bw-ex-muted); font-size: 14px; }
.ex-quiet { font-size: 14px; color: var(--bw-ex-muted); margin-top: 6px; }
.ex-optional { color: var(--bw-ex-faint); font-weight: 400; }
.ex-sep { display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: var(--bw-ex-faint); margin: 0 8px; vertical-align: middle; }

/* Hero */
.ex-hero { padding: 16px 0 8px; border-top: 3px solid var(--bw-ex-bar); padding-top: 32px; }
.ex-hero h1 { max-width: 20ch; }
.ex-hero-small h1 { max-width: 26ch; }
.ex-promise { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--bw-ex-accent); background: var(--bw-ex-tint); border: 1px solid var(--bw-ex-tint-strong); border-radius: 999px; padding: 6px 14px 6px 12px; font-size: 15px; }
.ex-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 20px 0 8px; }

/* Buttons: one filled primary per screen; everything else outlined. */
.ex-primary, .ex-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 0 18px; border-radius: var(--bw-ex-control); font: inherit; font-size: 15px; font-weight: 600; line-height: 1.2; text-decoration: none !important; cursor: pointer; transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease; }
.ex-primary { background: var(--bw-ex-accent); border: 1px solid var(--bw-ex-accent); color: #FFFFFF !important; }
.ex-primary:hover { background: var(--bw-ex-accent-hover); border-color: var(--bw-ex-accent-hover); }
.ex-button { background: var(--bw-ex-surface); border: 1px solid var(--bw-ex-accent); color: var(--bw-ex-accent) !important; }
.ex-button:hover { background: var(--bw-ex-tint); }
.ex-button[aria-pressed="true"] { background: var(--bw-ex-tint); }
.ex-small { min-height: 36px; padding: 0 12px; font-size: 14px; }
.ex-wide-button { width: 100%; }
button { font: inherit; }

/* Cards and sections */
.ex-card { background: var(--bw-ex-surface); border: 1px solid var(--bw-ex-border); border-radius: var(--bw-ex-radius); padding: 22px; margin: 0 0 20px; box-shadow: 0 1px 2px rgb(16 24 40 / 4%); }
section + section { margin-top: 36px; }
.ex-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }

.ex-qotw { margin-top: 36px; padding: 26px 28px; border-radius: var(--bw-ex-radius); background: var(--bw-ex-tint); border: 1px solid var(--bw-ex-tint-strong); border-left: 4px solid var(--bw-ex-bar); }
.ex-qotw h2 { font-size: clamp(20px, 2.3vw, 26px); max-width: 40ch; }

.ex-featured-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .ex-featured-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ex-featured-list blockquote { margin: 0 0 12px; font-size: 16px; line-height: 1.55; }

/* Chips */
.ex-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0 0 8px; }
.ex-chip { display: inline-flex; align-items: center; min-height: 24px; padding: 0 9px; border-radius: 999px; background: var(--bw-ex-tint); color: var(--bw-ex-accent); font-size: 12.5px; font-weight: 600; letter-spacing: 0.01em; }
.ex-chip-team { background: var(--bw-ex-accent); color: #FFFFFF; }
.ex-chip-private { background: #EEF2F6; color: #344054; }
.ex-chip-held { background: var(--bw-ex-held-tint); color: var(--bw-ex-held); }
.ex-chip-fictional { background: #F2F4F7; color: #344054; }
.ex-fact { font-size: 13px; color: var(--bw-ex-muted); }
.ex-team { display: inline-flex; align-items: center; gap: 0; margin-left: 8px; padding: 1px 8px; border-radius: 6px; background: var(--bw-ex-tint); color: var(--bw-ex-accent); font-size: 12.5px; font-weight: 600; }
.ex-team-role { font-weight: 500; }

/* Filters */
.ex-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 16px; }
.ex-filters a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--bw-ex-border); background: var(--bw-ex-surface); color: var(--bw-ex-muted); text-decoration: none; font-size: 14px; font-weight: 500; }
.ex-filters a:hover { border-color: var(--bw-ex-bar); color: var(--bw-ex-ink); }
.ex-filters a[aria-current="page"] { background: var(--bw-ex-ink); border-color: var(--bw-ex-ink); color: #FFFFFF; }

/* Feed */
.ex-feed { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--bw-ex-line); }
.ex-item { padding: 18px 0; border-bottom: 1px solid var(--bw-ex-line); }
.ex-item-title { font-size: 18px; margin: 0 0 6px; }
.ex-item-title a { color: var(--bw-ex-ink); text-decoration: none; }
.ex-item-title a:hover { color: var(--bw-ex-accent); text-decoration: underline; }
.ex-excerpt { color: var(--bw-ex-muted); margin: 0 0 8px; font-size: 15px; }
.ex-byline { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 0; font-size: 14px; color: var(--bw-ex-muted); margin: 0; }
.ex-author { font-weight: 600; color: var(--bw-ex-ink) !important; text-decoration: none; }
.ex-author:hover { text-decoration: underline; }
.ex-pager { display: flex; justify-content: space-between; align-items: center; margin-top: 20px; }

/* Aside */
.ex-aside h2 { font-size: 18px; }
.ex-aside section + section, .ex-aside .ex-guidelines { margin-top: 32px; }
.ex-starters { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.ex-starter { display: flex; align-items: center; min-height: 44px; padding: 10px 14px; border-radius: var(--bw-ex-control); border: 1px solid var(--bw-ex-border); background: var(--bw-ex-surface); color: var(--bw-ex-ink) !important; text-decoration: none !important; font-weight: 500; }
.ex-starter:hover { border-color: var(--bw-ex-bar); background: var(--bw-ex-tint); }
.ex-guidelines { font-size: 14px; color: var(--bw-ex-muted); border-top: 3px solid var(--bw-ex-bar); padding-top: 14px; }
.ex-source-label { font-size: 12.5px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--bw-ex-faint); margin: 0 0 6px; }
.ex-start .ex-starters { margin-top: 12px; }

/* Challenge cards */
.ex-challenge h3 { font-size: 18px; }
.ex-source { margin: 14px 0; padding: 12px 14px; border-radius: 10px; background: var(--bw-ex-tint); font-size: 14px; }
.ex-source p { margin: 0 0 4px; }
.ex-aside .ex-challenge { padding: 16px; margin-bottom: 12px; }
.ex-aside .ex-challenge .ex-source { margin: 10px 0; }

/* Thread */
.ex-crumbs { display: flex; gap: 8px; font-size: 14px; color: var(--bw-ex-faint); margin-bottom: 18px; }
.ex-crumbs a { color: var(--bw-ex-muted); }
.ex-thread-head { border-top: 3px solid var(--bw-ex-bar); padding-top: 22px; margin-bottom: 18px; }
.ex-post { position: relative; }
.ex-opener { background: var(--bw-ex-surface); border: 1px solid var(--bw-ex-border); border-radius: var(--bw-ex-radius); padding: 22px 24px; margin-bottom: 14px; }
.ex-post-head { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 0; font-size: 14px; color: var(--bw-ex-muted); margin-bottom: 10px; }
.ex-time { color: var(--bw-ex-muted) !important; text-decoration: none; }
.ex-edited { margin-left: 8px; font-size: 12.5px; color: var(--bw-ex-faint); font-style: italic; }
.ex-body { font-size: 16.5px; line-height: 1.7; }
.ex-body > :last-child { margin-bottom: 0; }
.ex-body blockquote, .ex-quoted { margin: 0 0 14px; padding: 4px 0 4px 16px; border-left: 3px solid var(--bw-ex-bar); color: var(--bw-ex-muted); }
.ex-quoted.ex-card { padding: 16px 18px; border-left: 3px solid var(--bw-ex-bar); }
.ex-body ul, .ex-body ol { margin: 0 0 14px; }
.ex-body .mention { font-weight: 600; text-decoration: none; }
.ex-source-line { font-size: 14px; color: var(--bw-ex-muted); margin: 12px 0 0; }
.ex-ai { margin: 8px 0 0; }
.ex-post-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin-top: 14px; font-size: 14px; }
.ex-post-actions a { color: var(--bw-ex-muted); text-decoration: none; }
.ex-post-actions a:hover { text-decoration: underline; }
.ex-post-actions a:hover { color: var(--bw-ex-accent); }
.ex-inline { display: inline; margin: 0; }
.ex-useful { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--bw-ex-border); background: var(--bw-ex-surface); color: var(--bw-ex-muted); font-size: 14px; font-weight: 500; cursor: pointer; }
.ex-useful:hover { border-color: var(--bw-ex-bar); color: var(--bw-ex-accent); }
.ex-useful[aria-pressed="true"] { border-color: var(--bw-ex-accent); background: var(--bw-ex-tint); color: var(--bw-ex-accent); }
.ex-useful-count:empty { display: none; }
.ex-thread-tools { display: flex; align-items: center; gap: 14px; margin: 6px 0 22px; }
.ex-replies { list-style: none; padding: 0; margin: 0; }
.ex-reply { padding: 18px 0 18px; border-top: 1px solid var(--bw-ex-line); }
.ex-replies-nested { margin: 14px 0 0 0; padding-left: 18px; border-left: 2px solid var(--bw-ex-line); }
.ex-replies-nested .ex-reply { border-top: 0; padding: 12px 0 0; }
.ex-reply-team > .ex-post { background: linear-gradient(90deg, var(--bw-ex-tint) 0, var(--bw-ex-tint) 3px, transparent 3px); padding-left: 16px; }
.ex-removed { color: var(--bw-ex-faint); font-style: italic; margin: 0; }
.ex-respond { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--bw-ex-border); }
.ex-signin-prompt { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.ex-evidence { margin-top: 36px; padding: 16px 18px; border-radius: var(--bw-ex-radius); border: 1px solid var(--bw-ex-border); background: var(--bw-ex-surface); }
.ex-evidence ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 15px; }
.ex-panel { margin-top: 20px; padding: 20px 22px; border-radius: var(--bw-ex-radius); background: var(--bw-ex-tint); border: 1px solid var(--bw-ex-tint-strong); }
.ex-panel-title { font-weight: 600; font-size: 17px; margin-bottom: 6px; }
.ex-faq { margin-top: 36px; }
.ex-faq details { border-top: 1px solid var(--bw-ex-line); padding: 6px 0; }
.ex-faq summary { cursor: pointer; font-weight: 600; min-height: 44px; display: flex; align-items: center; }
.ex-stat { font-weight: 600; margin-bottom: 4px; }
.ex-stat-context { color: var(--bw-ex-muted); font-size: 15px; }

/* Forms */
.ex-form { margin: 0; }
.ex-field { margin: 0 0 18px; border: 0; padding: 0; min-width: 0; }
.ex-field > label, .ex-field > legend, .ex-field label:not(.ex-radio):not(.ex-check) { display: block; font-weight: 600; margin: 0 0 6px; font-size: 15px; }
fieldset.ex-field { margin-bottom: 20px; }
.ex-form input[type="text"], .ex-form input[type="email"], .ex-form input[type="url"], .ex-form input[type="search"], .ex-form input[type="number"], .ex-form textarea, .ex-form select, .ex-search input, .ex-record-actions input {
  width: 100%; font: inherit; color: var(--bw-ex-ink); background: var(--bw-ex-surface); border: 1px solid #98A2B3; border-radius: var(--bw-ex-control); padding: 11px 13px; min-height: 44px; }
.ex-form textarea { line-height: 1.6; resize: vertical; min-height: 120px; }
.ex-form input:focus, .ex-form textarea:focus, .ex-form select:focus, .ex-search input:focus { border-color: var(--bw-ex-accent); outline: 2px solid var(--bw-ex-accent); outline-offset: 0; }
.ex-form [aria-invalid="true"] { border-color: var(--bw-ex-held); }
.ex-hint { font-size: 13.5px; color: var(--bw-ex-muted); margin: 6px 0 0; }
.ex-field-error { font-size: 14px; color: var(--bw-ex-held); font-weight: 600; margin: 6px 0 0; }
.ex-counter { display: inline-block; margin-left: 4px; font-weight: 600; }
.ex-counter[data-over="true"] { color: var(--bw-ex-held); }
.ex-radios { display: grid; gap: 8px; }
.ex-radio { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--bw-ex-border); border-radius: var(--bw-ex-control); background: var(--bw-ex-surface); cursor: pointer; font-weight: 400; }
.ex-radio:has(input:checked) { border-color: var(--bw-ex-accent); background: var(--bw-ex-tint); }
.ex-radio > span { display: flex; flex-direction: column; }
.ex-radio input, .ex-check input { width: 20px; height: 20px; margin: 2px 0 0; flex: 0 0 auto; accent-color: var(--bw-ex-accent); }
.ex-check { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; margin: 0 0 8px; padding-top: 10px; }
.ex-check label { font-weight: 400; }
.ex-more { margin: 0 0 16px; }
.ex-more summary { cursor: pointer; color: var(--bw-ex-accent); min-height: 44px; display: flex; align-items: center; }
.ex-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.ex-replying { margin-bottom: 8px; }
.ex-search-row { display: flex; gap: 10px; }
.ex-search label { display: block; font-weight: 600; margin-bottom: 6px; }

.ex-compose { display: grid; gap: 40px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) { .ex-main:has(.ex-compose) { max-width: 1080px; } .ex-compose { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; } .ex-compose .ex-guidelines { position: sticky; top: 96px; } }

/* Sign in and onboarding: a centered white card on the blue brand background. */
.ex-auth { display: grid; place-items: center; padding: 36px 0; margin: -40px calc(var(--bw-ex-gutter) * -1) -72px; min-height: calc(100vh - 200px); background: linear-gradient(160deg, #1D4ED8 0%, #2563EB 55%, #3B82F6 100%); padding-inline: var(--bw-ex-gutter); }
.ex-auth-card { width: 100%; max-width: 460px; background: var(--bw-ex-surface); border-radius: 18px; padding: 32px 28px; box-shadow: 0 24px 48px rgb(16 24 40 / 18%); }
.ex-auth-card h1 { font-size: clamp(26px, 3vw, 32px); }
.ex-or { display: flex; align-items: center; gap: 12px; color: var(--bw-ex-faint); font-size: 14px; margin: 18px 0; }
.ex-or::before, .ex-or::after { content: ""; flex: 1; height: 1px; background: var(--bw-ex-line); }

/* Notices */
.ex-notice { padding: 12px 14px; border-radius: var(--bw-ex-control); background: var(--bw-ex-tint); border-left: 3px solid var(--bw-ex-bar); font-size: 15px; }
.ex-notice-held { background: var(--bw-ex-held-tint); border-left-color: var(--bw-ex-held); color: #5A2D0C; }
.ex-notice-error { background: #FFF7ED; border-left-color: var(--bw-ex-held); color: #5A2D0C; }
.ex-notice-success { background: #ECFDF3; border-left-color: #067647; color: #054F31; }

/* Profile, record, notifications */
.ex-profile { border-top: 3px solid var(--bw-ex-bar); padding-top: 24px; margin-bottom: 28px; }
.ex-record-facts { display: grid; gap: 10px 24px; grid-template-columns: minmax(0, 1fr); margin: 0 0 24px; }
@media (min-width: 640px) { .ex-record-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ex-record-facts dt { font-size: 12.5px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--bw-ex-faint); }
.ex-record-facts dd { margin: 0; }
.ex-record-actions { margin: 24px 0; }
.ex-record-actions label { font-weight: 600; display: block; margin-bottom: 6px; }
.ex-notes { list-style: none; padding: 0; margin: 0; }
.ex-notes li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; padding: 14px 0; border-bottom: 1px solid var(--bw-ex-line); }
.ex-unread a { font-weight: 600; }
.ex-unread::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--bw-ex-accent); align-self: center; margin-right: -8px; }
.ex-prose h2 { margin-top: 28px; }
.ex-pre, .ex-pre-line { white-space: pre-wrap; font-family: inherit; margin: 0 0 8px; }
.ex-plain { padding-left: 18px; }

/* Team desk */
.ex-desk-nav { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 24px; padding-bottom: 12px; border-bottom: 1px solid var(--bw-ex-border); }
.ex-desk-nav a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border-radius: 8px; color: var(--bw-ex-muted); text-decoration: none; font-size: 14px; font-weight: 500; }
.ex-desk-nav a[aria-current="page"] { background: var(--bw-ex-tint); color: var(--bw-ex-accent); }
.ex-table { width: 100%; border-collapse: collapse; font-size: 14.5px; background: var(--bw-ex-surface); }
.ex-table th, .ex-table td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--bw-ex-line); overflow-wrap: anywhere; }
.ex-table th { background: var(--bw-ex-tint); font-weight: 600; font-size: 13px; }
.ex-desk { overflow-x: auto; }
.ex-figures { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); margin: 0; }
@media (min-width: 760px) { .ex-figures { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ex-figure { background: var(--bw-ex-surface); border: 1px solid var(--bw-ex-border); border-top: 3px solid var(--bw-ex-bar); border-radius: 12px; padding: 16px; }
.ex-figure dt { font-size: 14px; color: var(--bw-ex-muted); margin-bottom: 6px; }
.ex-figure dd { margin: 0; display: flex; flex-direction: column; }
.ex-figure-value { font-size: 28px; font-weight: 600; letter-spacing: -0.02em; }
.ex-contribution { border-top: 1px solid var(--bw-ex-line); padding: 14px 0; }
.ex-mod-form { margin-top: 12px; }

mark { background: #DBEAFE; color: inherit; border-radius: 3px; padding: 0 2px; }

@media (max-width: 640px) {
  .ex-main { padding-top: 28px; padding-bottom: 56px; }
  .ex-opener { padding: 18px; }
  .ex-card { padding: 18px; }
  .ex-qotw { padding: 20px; }
  .ex-actions > .ex-primary, .ex-actions > .ex-button { flex: 1 1 auto; }
  .ex-auth { margin-top: -28px; margin-bottom: -56px; }
  /* Team desk tables scroll inside their own box on a phone instead of splitting words mid word. */
  .ex-table { display: block; overflow-x: auto; }
  .ex-table th, .ex-table td { overflow-wrap: normal; }
  /* 16px controls, so a phone does not zoom the page on focus. */
  .ex-table select, .ex-form input:not([type="checkbox"]):not([type="radio"]), .ex-form textarea, .ex-form select { font-size: 16px; }
  .ex-table select { min-height: 36px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
@media print {
  header.bw-header, footer.bw-footer, .ex-skip, .ex-record-actions, .ex-post-actions, .ex-respond, .ex-panel, .ex-evidence, .ex-thread-tools, .ex-crumbs { display: none !important; }
  body.ex { background: #FFFFFF; }
  .ex-main { max-width: none; padding: 0; }
  .ex-card { box-shadow: none; break-inside: avoid; }
  a { color: inherit; }
  @page { size: Letter; margin: 0.6in; }
}

/* At mention suggestions */
.ex-mentions { list-style: none; margin: 4px 0 0; padding: 4px; max-width: 380px; border: 1px solid var(--bw-ex-border); border-radius: 10px; background: var(--bw-ex-surface); box-shadow: 0 8px 24px rgb(16 24 40 / 12%); }
.ex-mentions li { display: flex; align-items: center; min-height: 40px; padding: 6px 10px; border-radius: 6px; cursor: pointer; font-size: 15px; }
.ex-mentions li[aria-selected="true"] { background: var(--bw-ex-tint); color: var(--bw-ex-accent); }