/* market-pursueatl.css — the PursueATL edition of the market viewer.
 *
 * PursueATL publishes the Atlanta report, so the viewer wears its brand, taken
 * from the brand's own tokens (pursueATL app/globals.css): navy ink on a cool
 * paper ground, greys biased toward the navy, teal for what you can tap, gold
 * spent in one place (the mark), Space Grotesk for display and Sora for text,
 * navy-tinted shadows and generous radii. It works by retuning the site tokens
 * the reader already runs on, so every view follows without a second set of
 * rules. html[data-brand="pursueatl"] is the only switch.
 *
 * Day is the default (the boot script in market/index.html sets
 * data-theme="light"); night is the brand's navy panel, as a whole page.
 * The second half styles the events views ("What's on").
 */

html[data-brand="pursueatl"] {
  --font-display: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Sora", ui-sans-serif, system-ui, sans-serif;
  --mono: "Sora", ui-sans-serif, system-ui, sans-serif;
  --pa-navy: linear-gradient(160deg, #15332B 0%, #0B1B3F 55%, #0B231D 100%);
  --pa-lift-1: 0 1px 2px rgba(21, 51, 43, .04), 0 2px 8px -4px rgba(21, 51, 43, .08);
  --pa-lift-2: 0 2px 4px rgba(21, 51, 43, .04), 0 14px 30px -14px rgba(21, 51, 43, .18);
  --pa-gold-glow: 0 10px 24px -12px rgba(244, 166, 122, .6);
  --pa-r: 18px;
  --pa-r-lg: 26px;
}
/* Day. html[data-brand][data-theme] outranks main.css's :root[data-theme="light"]. */
html[data-brand="pursueatl"][data-theme="light"] {
  color-scheme: light;
  --bg: #F6F2EA; --bg-secondary: #EFE9DE; --bg-card: #FFFFFF; --bg-card-hover: #F3EDE3;
  --text: #15332B; --text-secondary: #2C5648; --text-muted: #4C6E62; --text-faint: #6B8A7E;
  --accent: #2E7D64; --accent-rgb: 13, 148, 136; --accent-dim: rgba(46, 125, 100, .1);
  --accent-fill: #15332B; --accent-ink: #FFFFFF; --accent-hover: #2E7D64;
  --btn-fill: #15332B; --btn-ink: #FFFFFF;
  --ink-rgb: 11, 53, 88;
  --border: #E0D8CB; --border-light: #D2C8B8;
  --nav-bg: #FFFFFF; --nav-text: #15332B;
  --rl-blue: #0057D9; --sky-ink: #0057D9; --rl-amber: #8A6500; --amber-bright: #8A6500;
  --bg-rgb: 246, 248, 251; --panel-rgb: 255, 255, 255;
  --chart-grid: #E0D8CB;
  --shadow-sm: var(--pa-lift-1); --shadow-md: var(--pa-lift-2);
}
/* Night: the navy panel of pursueatl.com/about, as a page. */
html[data-brand="pursueatl"]:not([data-theme="light"]) {
  color-scheme: dark;
  --bg: #0E2B24; --bg-secondary: #133A30; --bg-card: #16453A; --bg-card-hover: #1B5445;
  --text: #F2F6FA; --text-secondary: #CFDBE7; --text-muted: #9DB1C6; --text-faint: #8397AD;
  --accent: #4FB292; --accent-rgb: 45, 212, 191; --accent-dim: rgba(79, 178, 146, .12);
  --accent-fill: #4FB292; --accent-ink: #0B231D; --accent-hover: #8FD9BE;
  --btn-fill: #4FB292; --btn-ink: #0B231D;
  --ink-rgb: 242, 246, 250;
  --border: #1B3A5C; --border-light: #284B71;
  --nav-bg: #0B231D; --nav-text: #FFFFFF;
  --rl-blue: #7AB8FF; --sky-ink: #7AB8FF;
  --bg-rgb: 7, 27, 49; --panel-rgb: 13, 40, 70;
}

html[data-brand="pursueatl"] body { background: var(--bg); color: var(--text); font-family: var(--font-body); }
html[data-brand="pursueatl"] .rdr { font-size: 15px; }
html[data-brand="pursueatl"] .rdr h1,
html[data-brand="pursueatl"] .rdr h2,
html[data-brand="pursueatl"] .rdr h3,
html[data-brand="pursueatl"] .rdr .big { font-family: var(--font-display); font-weight: 700; letter-spacing: -.024em; text-shadow: none; }
html[data-brand="pursueatl"] .rdr .k { font-weight: 600; letter-spacing: .12em; }
html[data-brand="pursueatl"] .rdr .ev__scrim { background: rgba(6, 33, 60, .45); }

/* The masthead: PursueATL's mark and name, the report, the research credit. */
html[data-brand="pursueatl"] .mk-topbar { background: var(--nav-bg); box-shadow: 0 1px 0 var(--border), 0 8px 24px -20px rgba(21, 51, 43, .45); }
.pa-lockup { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--nav-text, var(--text)); }
.pa-lockup img { width: 34px; height: 34px; border-radius: 50%; box-shadow: var(--pa-gold-glow); }
.pa-lockup b { display: block; font-family: var(--font-display); font-weight: 700; font-size: 1.1rem; letter-spacing: -.02em; line-height: 1.05; }
.pa-lockup small { display: block; margin-top: 2px; font-size: .6rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--text-muted); }
html[data-brand="pursueatl"] .mk-topbar__m b { font-family: var(--font-display); }
html[data-brand="pursueatl"] .mk-topbar__m #mk-partner { font-family: var(--font-body); font-weight: 600; letter-spacing: .1em; }
html[data-brand="pursueatl"] .mk-topbar__m #mk-partner:hover { color: var(--accent); }
html[data-brand="pursueatl"] .mk-topbar__cta { background: var(--btn-fill); color: var(--btn-ink); padding: .5rem 1rem; transition: background .2s; }
html[data-brand="pursueatl"] .mk-topbar__cta:hover { background: var(--accent-hover); color: var(--btn-ink); }
html[data-brand="pursueatl"] .mk-topbar .theme-toggle { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid var(--border-light); border-radius: 50%; background: var(--bg-card); color: var(--text); font-size: 1rem; line-height: 1; cursor: pointer; }
html[data-brand="pursueatl"] .mk-topbar .theme-toggle:hover { border-color: var(--accent); color: var(--accent); }
@media (max-width: 520px) { .pa-lockup small { display: none; } .pa-lockup b { font-size: .98rem; } }

/* ── What's on ─────────────────────────────────────────────────────────── */
.rdr .ev-wait { display: grid; place-items: center; min-height: 96px; }
.rdr .ev-wait--view { min-height: 480px; }

/* The week, on the brand's navy panel. */
.rdr .evh { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin: 14px 0 22px; padding: 22px; border-radius: var(--pa-r-lg, 26px); color: #fff; box-shadow: var(--pa-lift-2);
  background: radial-gradient(120% 80% at 15% 0%, rgba(77, 201, 230, .22), transparent 55%), radial-gradient(100% 90% at 100% 100%, rgba(33, 12, 174, .4), transparent 60%), linear-gradient(160deg, #15332B 0%, #0B1B3F 55%, #0B231D 100%); }
.rdr .evh::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5; mix-blend-mode: overlay; pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/></filter><rect width='140' height='140' filter='url(%23n)' opacity='0.34'/></svg>"); }
.rdr .evh .k { color: rgba(255, 255, 255, .7); }
.rdr .evh__n { display: block; margin-top: 4px; font-family: var(--font-display); font-size: clamp(3rem, 8vw, 4.4rem); font-weight: 700; line-height: .95; letter-spacing: -.04em; color: #fff; }
.rdr .evh__l { display: block; margin-top: 6px; max-width: 30ch; font-size: .95rem; color: rgba(255, 255, 255, .85); }
.rdr .evh__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; }
.rdr .evh__stats div { display: flex; flex-direction: column-reverse; gap: 4px; padding-left: 12px; border-left: 1px solid rgba(255, 255, 255, .18); }
.rdr .evh__stats dt { font-size: .6rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .62); }
.rdr .evh__stats dd { margin: 0; font-family: var(--font-display); font-size: 1.55rem; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
.rdr .evh__go { display: flex; flex-wrap: wrap; gap: 8px; }
.rdr .evh__go .btn { width: auto; min-height: 40px; margin: 0; padding: .55rem 1rem; border-radius: 999px; font-size: .84rem; background: #fff; color: #15332B; }
.rdr .evh__go .btn:hover { background: #E6FFFA; }
.rdr .evh__go .btn--ghost { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .35); }
.rdr .evh__go .btn--ghost:hover { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .6); }
@media (min-width: 760px) {
  .rdr .evh { grid-template-columns: auto minmax(0, 1fr); align-items: end; column-gap: 40px; padding: 26px 28px; }
  .rdr .evh__go { grid-column: 1 / -1; }
}
@media (max-width: 480px) { .rdr .evh__stats dd { font-size: 1.2rem; } }

/* "I want to": the first question the calendar asks. Sits under "I'm here as" and reads the same way. */
.rdr .evwant { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 0 6px; }
.rdr .evwant > span { margin-right: 4px; font-size: .62rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--r-muted); }
.rdr .evwant .pill { display: inline-flex; align-items: center; gap: 6px; }
.rdr .evwant .pill b { font-weight: 600; font-size: .72rem; opacity: .6; }
/* A shelf of events to walk into: cards in a row that scrolls sideways, so it costs one card of height. */
.rdr .evshelf { margin: 0 0 16px; min-width: 0; }
.rdr .evshelf__h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin: 0 0 8px; font-family: var(--font-display); font-size: 1.02rem; font-weight: 700; color: var(--text); }
.rdr .evshelf__h small { font-family: var(--font-body, inherit); font-size: .74rem; font-weight: 400; color: var(--r-muted); }
.rdr .evshelf__row { display: flex; gap: 10px; overflow-x: auto; padding: 2px 2px 10px; scroll-snap-type: x proximity; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.rdr .evc { flex: 0 0 236px; display: flex; flex-direction: column; gap: 5px; min-height: 148px; padding: 12px 14px; border: 1px solid var(--r-border); border-radius: 16px; background: var(--r-card); color: var(--text); text-decoration: none; scroll-snap-align: start; transition: border-color .15s, transform .15s; }
.rdr .evc:hover { border-color: var(--r-accent); transform: translateY(-1px); }
.rdr .evc:focus-visible { outline: 2px solid var(--r-accent); outline-offset: 2px; }
.rdr .evc__w { display: flex; gap: 8px; align-items: baseline; font-size: .72rem; color: var(--r-accent); font-variant-numeric: tabular-nums; }
.rdr .evc__w b { font-weight: 700; color: var(--text); }
.rdr .evc__t { font-family: var(--font-display); font-size: .92rem; font-weight: 700; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rdr .evc__h { display: flex; align-items: center; gap: 6px; font-size: .74rem; color: var(--r-muted); }
.rdr .evc__h .sw { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--hc, #94a3b8); }
.rdr .evc__g { margin-top: auto; font-size: .76rem; line-height: 1.35; color: var(--r-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rdr .evshelf--regs .evc { border-left: 3px solid #F4A67A; min-height: 116px; }
.rdr .evshelf--regs .evc__g { color: var(--text); font-weight: 600; }
/* The filter bar. It sticks under the site header, so the filters and the list are never apart. */
.rdr .evbar { position: sticky; top: var(--r-top); z-index: 8; margin: 0 -10px 14px; padding: 8px 10px; border-radius: 0 0 16px 16px; background: color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.rdr .evbar__in { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.rdr .evbar .tabs { margin: 0 0 0 auto; flex-wrap: nowrap; }
.rdr .evbar .pill { margin: 0; }
.rdr .evbar input { flex: 1 1 100px; min-width: 90px; max-width: 200px; min-height: 36px; padding: 0 12px; border: 1px solid var(--r-border2); border-radius: 999px; background: var(--r-card); color: var(--text); font: inherit; font-size: .82rem; }
.rdr .evbar__b { display: none; align-items: center; gap: 7px; min-height: 44px; padding: 0 14px; border: 1px solid var(--r-border2); border-radius: 999px; background: var(--r-card); color: var(--text); font: inherit; font-size: .88rem; font-weight: 600; cursor: pointer; }
.rdr .evbar__b b { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: #F4A67A; color: #15332B; font-size: .7rem; }
.rdr .evbar__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.rdr .evchip { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 0 8px 0 11px; border-radius: 999px; background: #15332B; color: #fff; font-size: .76rem; text-decoration: none; }
.rdr .evchip i { font-style: normal; font-size: .7rem; opacity: .75; }
.rdr .evchip--x { background: none; color: var(--r-accent); padding: 0 6px; }
.rdr .evq__o--1 i { border-radius: 50%; }
.rdr .evmore { display: block; margin: 6px 0 18px; padding: 14px; border: 1px dashed var(--r-border2); border-radius: 14px; text-align: center; font-weight: 600; font-size: .9rem; color: var(--r-accent); text-decoration: none; }
.rdr .evmore:hover { background: var(--r-accent-dim); }
/* Day headings pin under the bar, so you always know which day you are in. */
.rdr .evp .evd__h { top: calc(var(--r-top) + var(--evbar-h, 56px)); }
/* What you are looking at, in one line; tapping it opens the filters. Phones only. */
.rdr .evsum { display: none; width: 100%; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; margin: 2px 0 12px; padding: 0 14px; white-space: nowrap; border: 1px solid var(--r-border); border-radius: 14px; background: var(--r-card); color: var(--text); font: inherit; font-size: .84rem; text-align: left; cursor: pointer; }
.rdr .evsum span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.rdr .evsum b { font-weight: 700; }
.rdr .evsum i { flex: none; font-style: normal; font-weight: 600; font-size: .78rem; color: var(--r-accent); }
/* The dock: fixed to the bottom of a phone, so filtering never means scrolling back up.
   position: fixed, not sticky, because it has to hold on every phone browser. */
.rdr .evdock { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; gap: 8px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); border-top: 1px solid var(--r-border); background: var(--bg); box-shadow: 0 -10px 24px -18px rgba(7, 27, 49, .35); }
.rdr .evdock__b { display: grid; grid-template-columns: 1.25fr 1fr; gap: 8px; }
.rdr .evdock button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; border-radius: 999px; font: inherit; font-size: .95rem; font-weight: 700; cursor: pointer; }
.rdr .evdock__f { border: 0; background: #15332B; color: #fff; }
.rdr .evdock__f b { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: #F4A67A; color: #15332B; font-size: .74rem; }
.rdr .evdock__c { border: 1px solid var(--r-border2); background: var(--r-card); color: var(--text); }
.rdr .evdock__chips { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.rdr .evdock__chips::-webkit-scrollbar { display: none; }
.rdr .evdock__chips > * { flex: 0 0 auto; min-height: 36px; }
body.evsh-open .evdock { display: none; }
/* Sheets: a phone's filter and calendar panels. They cover the page rather than push it. */
.rdr .evsh { position: fixed; inset: 0; z-index: 60; display: grid; align-items: end; }
.rdr .evsh[hidden] { display: none; }
.rdr .evsh__scrim { position: absolute; inset: 0; background: rgba(7, 27, 49, .5); }
.rdr .evsh__p { position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; max-height: 88dvh; border-radius: 22px 22px 0 0; background: var(--bg); box-shadow: 0 -18px 50px -20px rgba(7, 27, 49, .5); outline: 0; }
.rdr .evsh__h { display: flex; align-items: center; gap: 12px; padding: 16px 18px 10px; font-family: var(--font-display); font-size: 1.1rem; }
.rdr .evsh__h b { margin-right: auto; }
.rdr .evsh__h a { font-family: var(--font-body, inherit); font-size: .82rem; color: var(--r-accent); text-decoration: none; }
.rdr .evsh__h button { width: 44px; height: 44px; margin: -8px -8px -8px 0; border: 0; border-radius: 50%; background: none; color: var(--text); font-size: 1rem; cursor: pointer; }
.rdr .evsh__b { overflow-y: auto; overscroll-behavior: contain; padding: 0 18px 8px; -webkit-overflow-scrolling: touch; }
.rdr .evsh__g h3 { margin: 14px 0 8px; font-size: .64rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--r-muted); }
.rdr .evsh__o { display: flex; flex-wrap: wrap; gap: 8px; }
.rdr .evsh__c { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 1px solid var(--r-border2); border-radius: 999px; background: var(--r-card); color: var(--text); font-size: .9rem; text-decoration: none; }
.rdr .evsh__c b { font-weight: 500; font-size: .74rem; color: var(--r-muted); }
.rdr .evsh__c.on { border-color: #15332B; background: #15332B; color: #fff; }
.rdr .evsh__c.on b { color: rgba(255, 255, 255, .7); }
.rdr .evsh__f { padding: 12px 18px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--r-border); background: var(--bg); }
.rdr .evsh__f .btn { width: 100%; min-height: 50px; margin: 0; border-radius: 999px; font-size: .95rem; }
.rdr .evsh__cal .evcal { border: 0; padding: 0; background: none; }
.rdr .evsh__cal .evcal__d { aspect-ratio: auto; height: 46px; font-size: .9rem; }
body.evsh-open { overflow: hidden; }
/* Filter menus: checkboxes in a panel that floats, so ticking one moves nothing. */
.rdr .evq__row { position: relative; display: flex; flex-wrap: wrap; gap: 6px; }
.rdr .evq summary { list-style: none; cursor: pointer; user-select: none; }
.rdr .evq summary::-webkit-details-marker { display: none; }
.rdr .evq summary::after { content: "▾"; margin-left: 6px; font-size: .9em; opacity: .75; }
.rdr .evq__menu { position: absolute; top: calc(100% + 6px); left: 0; z-index: 6; display: grid; width: min(300px, 100%); padding: 6px; border: 1px solid var(--r-border); border-radius: 14px; background: var(--r-card); box-shadow: 0 18px 40px -18px rgba(11, 37, 69, .45); }
.rdr .evq__o { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 9px; font-size: .84rem; color: var(--text); text-decoration: none; }
.rdr .evq__o:hover { background: var(--r-accent-dim); }
.rdr .evq__o i { width: 16px; height: 16px; border: 1.5px solid var(--r-border2); border-radius: 5px; }
.rdr .evq__o.on i { border-color: #15332B; background: #15332B url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.rdr .evq__o b { font-weight: 500; font-size: .74rem; color: var(--r-muted); }
.rdr .evq__c { padding: 8px 10px; font-size: .78rem; color: var(--r-accent); text-decoration: none; }
/* Above the two columns: the shelves. A phone reorders them around the calendar (below). */
.rdr .evp { display: block; min-width: 0; }
/* The strip above the calendar: counts on one line, subscribe behind one button. */
.rdr .evs { position: relative; z-index: 3; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin: 10px 0 16px; padding: 10px 12px 10px 18px; border-radius: 999px; color: #fff; background: linear-gradient(100deg, #15332B, #0c2a52 60%, #151c63); box-shadow: var(--pa-lift-1, 0 6px 18px -10px rgba(21, 51, 43, .5)); }
.rdr .evs__n { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 16px; margin: 0; font-size: .86rem; color: rgba(255, 255, 255, .82); }
.rdr .evs__n b { margin-right: 5px; font-family: var(--font-display); font-size: 1.25rem; font-weight: 700; color: #fff; }
.rdr .evs__n a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.rdr .evs__for { color: #F8BE9A; }
.rdr .evs__go { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rdr .evs .btn { width: auto; min-height: 36px; margin: 0; padding: .4rem .95rem; border-radius: 999px; font-size: .8rem; background: #fff; color: #15332B; border: 0; cursor: pointer; }
.rdr .evs .btn--ghost { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .35); }
.rdr .evs .btn--gold { background: #F4A67A; color: #15332B; }
.rdr .evs__sub { position: relative; }
.rdr .evs__sub summary { list-style: none; display: inline-flex; align-items: center; gap: 6px; }
.rdr .evs__sub summary::-webkit-details-marker { display: none; }
/* The menu floats over the page: opening it moves nothing. */
.rdr .evs__menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 5; display: grid; min-width: 236px; padding: 6px; border: 1px solid var(--r-border); border-radius: 14px; background: var(--r-card); box-shadow: 0 18px 40px -18px rgba(11, 37, 69, .45); }
.rdr .evs__menu a, .rdr .evs__menu button { padding: 9px 12px; border: 0; border-radius: 9px; background: none; font: inherit; font-size: .84rem; text-align: left; color: var(--text); text-decoration: none; cursor: pointer; }
.rdr .evs__menu a:hover, .rdr .evs__menu button:hover { background: var(--r-accent-dim); }
@media (max-width: 640px) {
  .rdr .evs { flex-wrap: nowrap; border-radius: 16px; padding: 8px 8px 8px 14px; margin: 8px 0 12px; }
  .rdr .evs .btn { min-height: 34px; padding: .35rem .8rem; }
  .rdr .evs__n { gap: 0 12px; font-size: .78rem; }
  .rdr .evs:not(.evs--org) .evs__n > span:nth-child(3) { display: none; }
  .rdr .evs__n b { font-size: 1.05rem; margin-right: 4px; }
  /* A phone has one control, and it is under the thumb: the dock. The pinned top bar, the two
     rows of pills and the counts strip all give way, so the page opens on the month and the events. */
  .rdr .evbar, .rdr .pa-as.pa-as--row, .rdr .evwant { display: none; }
  /* The counts strip gives way on a phone; subscribing lives at the foot of the list. */
  .rdr .evs:not(.evs--org) { display: none; }
  .rdr .evp .evw .evcal__d { height: 40px; }
  .rdr .evp .evd__h { top: var(--r-top); }
  .rdr .ph--ev h1 { font-size: 1.45rem; line-height: 1.15; }
  .rdr .evsum { display: flex; }
  .rdr .evdock { display: grid; }
  .rdr .evp .evshelf--picks { order: 1; }
  .rdr .evp .evw .evcal { order: 0; }
  body.evdock-tall { padding-bottom: calc(112px + env(safe-area-inset-bottom)); }
  .rdr .evp .evhosts a { min-height: 44px; }
  /* A phone gets to the events: no description, the two filters side by side, no tip. */
  .rdr .ph--ev .sub, .rdr .evf__tip { display: none; }
  .rdr .evwhy { margin: -2px 0 10px; font-size: .84rem; line-height: 1.45; }
  .rdr .evwhy .evwhy__l { display: none; }
  .rdr .evwhy .evwhy__s { display: inline; }
  .rdr .evp .evareas a { min-height: 44px; }
  .rdr .evf select { flex: 1 1 40%; min-width: 0; }
  .rdr .evf input { flex: 1 0 100%; }
  .rdr .evs--org { flex-wrap: wrap; row-gap: 6px; padding: 10px 12px; }
  .rdr .evs--org .evs__n { flex: 1 0 100%; }
  .rdr .evs--org .evs__go { flex-wrap: nowrap; }
  .rdr .evs--org .btn { padding: .35rem .7rem; font-size: .76rem; white-space: nowrap; }
  .rdr .evf .tabs { flex: 1 0 100%; }
  .rdr .evf__on { margin-bottom: 8px; }
  .rdr .evwant { flex-wrap: nowrap; overflow-x: auto; margin-inline: -16px; padding: 2px 16px; scrollbar-width: none; }
  .rdr .evwant::-webkit-scrollbar { display: none; }
  .rdr .evwant > * { flex: 0 0 auto; }
  .rdr .evc { flex-basis: 210px; min-height: 136px; }
  .rdr .evq__row { flex: 1 0 100%; }
  .rdr .evq__menu { width: 100%; }
  /* "I'm here as" is one swipeable line on a phone, not four rows. */
  .rdr .pa-as.pa-as--row { flex-wrap: nowrap; overflow-x: auto; margin-inline: -16px; padding: 2px 16px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .rdr .pa-as.pa-as--row::-webkit-scrollbar { display: none; }
  .rdr .pa-as.pa-as--row > * { flex: 0 0 auto; }
}
.rdr .evw { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; }
.rdr .evw__side { display: flex; flex-direction: column; gap: 14px; }
.rdr .evw__main { min-width: 0; }
@media (min-width: 980px) {
  .rdr .evw { grid-template-columns: 250px minmax(0, 1fr); align-items: start; }
  .rdr .evw__side { position: sticky; top: calc(var(--r-top) + var(--evbar-h, 56px) + 8px); }
}
/* On a phone the calendar comes first, then the events; who's hosting and the rest follow. */
@media (max-width: 979px) {
  /* One column, in the order a phone wants: picks, the month, the events, then the rest. */
  .rdr .evp { display: flex; flex-direction: column; gap: 14px; }
  .rdr .evp > .evshelf { margin: 0; }
  .rdr .evshelf--picks { order: 0; }
  .rdr .evshelf--regs { order: 3; }
  .rdr .evw { display: contents; }
  .rdr .evw__side { display: contents; }
  .rdr .evp .evcal { order: 1; }
  /* Square days are 50px tall on a phone and 130px on a tablet; a fixed row keeps the month in view. */
  .rdr .evw .evcal__d { aspect-ratio: auto; height: 34px; }
  .rdr .evp .evw__main { order: 2; }
  .rdr .evp .evareas { order: 3; }
  .rdr .evp .evhosts { order: 4; }
  .rdr .evp .evadd { order: 5; }
  .rdr .evp .evw__side > .mk-fine { order: 6; }
  /* With the month on the page, everything reads top to bottom: month, picks, list, neighborhoods, hosts. */
  .rdr .evp--month .evm { order: 0; }
  .rdr .evp--month .evshelf--picks { order: 1; }
  .rdr .evp--month .evw__main { order: 2; }
  .rdr .evp--month .evhood { order: 3; }
  .rdr .evp--month .evfoot { order: 4; }
  .rdr .evp--month .evai { order: 5; }
  .rdr .evp--month .evfoot { display: contents; }
  .rdr .evp--month .evfoot .evhosts { order: 4; }
  .rdr .evp--month .evfoot__r { order: 5; }
}

/* ── The month ────────────────────────────────────────────────────────
   One row per week, a dot per event in its host's color, past weeks folded flat. The
   clicked day's events sit beside it on a wide screen and under it on a phone. */
.rdr .evm { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; margin: 4px 0 18px; }
.rdr .evm__cal { overflow: hidden; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); }
.rdr .evm__h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; padding: 10px 12px; border-bottom: 1px solid var(--r-border); }
.rdr .evm__nav { display: flex; align-items: center; gap: 6px; }
.rdr .evm__nav h2 { margin: 0; min-width: 12ch; text-align: center; font-size: 1.08rem; font-weight: 700; letter-spacing: -.01em; }
.rdr .evm__go { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--r-border); border-radius: 999px; font-size: 1.25rem; line-height: 1; color: var(--text); text-decoration: none; }
.rdr a.evm__go:hover { border-color: var(--r-accent); background: var(--r-accent-dim); }
.rdr span.evm__go { opacity: .3; }
.rdr .evm__n { font-size: .78rem; color: var(--r-muted); }
.rdr .evm__n a { color: var(--r-accent); }
.rdr .evm__dow { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); padding: 6px 0 4px; border-bottom: 1px solid var(--r-border); text-align: center; font-size: .6rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--r-faint); }
.rdr .evm__w { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-bottom: 1px solid var(--r-border); }
.rdr .evm__w:last-child { border-bottom: 0; }
.rdr .evm__d { position: relative; display: flex; flex-direction: column; min-height: 92px; padding: 8px; border-right: 1px solid var(--r-border); color: var(--text); text-decoration: none; transition: background .12s; }
.rdr .evm__d:last-child { border-right: 0; }
.rdr .evm__d > b { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 999px; font-size: .84rem; font-weight: 600; }
.rdr .evm__d > small { position: absolute; top: 10px; right: 10px; font-size: .68rem; font-weight: 700; color: var(--r-muted); }
.rdr .evm__d.today > b { background: #F4A67A; color: #15332B; }
.rdr .evm__d.past, .rdr .evm__d.out { color: var(--r-faint); }
.rdr .evm__d.out { background: color-mix(in srgb, var(--r-border) 25%, transparent); }
.rdr a.evm__d:hover { background: var(--r-accent-dim); }
.rdr .evm__d.sel { background: var(--r-accent-dim); box-shadow: inset 0 0 0 2px var(--r-accent); }
.rdr .evm__d:focus-visible { outline: 2px solid var(--r-accent); outline-offset: -2px; }
.rdr .evm__dots { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; margin-top: auto; }
.rdr .evm__dots i { width: 8px; height: 8px; border-radius: 999px; background: var(--hc, #94a3b8); }
.rdr .evm__dots em { font-style: normal; font-size: .66rem; font-weight: 700; color: var(--r-muted); }
.rdr .evm__w--past .evm__d { flex-direction: row; align-items: center; min-height: 28px; padding: 3px 8px; }
.rdr .evm__w--past .evm__d > b { width: auto; height: auto; font-size: .7rem; }
.rdr .evm__day { display: grid; align-content: start; gap: 10px; padding: 14px; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); }
.rdr .evm__dh h3 { margin: 2px 0 0; font-size: 1.05rem; line-height: 1.2; }
.rdr .evm__dh small { font-size: .76rem; color: var(--r-muted); }
.rdr .evm__dl { display: grid; gap: 2px; }
.rdr .evm__dl .empty { margin: 6px 0; font-size: .86rem; color: var(--r-muted); }
.rdr .evm__e { display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; gap: 10px; align-items: center; min-height: 48px; padding: 6px 8px; border-radius: 10px; color: var(--text); text-decoration: none; }
.rdr .evm__e:hover { background: var(--r-accent-dim); }
.rdr .evm__e > b { font-size: .72rem; line-height: 1.2; color: var(--r-accent); }
.rdr .evm__et { display: block; font-size: .86rem; font-weight: 600; line-height: 1.25; }
.rdr .evm__e small { display: flex; align-items: center; gap: 5px; margin-top: 2px; font-size: .72rem; color: var(--r-muted); }
.rdr .evm__e em { font-style: normal; color: var(--r-accent); }
.rdr .evm__sub { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-top: 10px; border-top: 1px solid var(--r-border); }
.rdr .evm__sub .k { flex: 1 0 100%; margin-bottom: 2px; }
.rdr .evm__sub a, .rdr .evm__sub button { display: inline-flex; align-items: center; gap: 5px; min-height: 34px; padding: 5px 10px; border: 1px solid var(--r-border); border-radius: 999px; background: none; font: inherit; font-size: .76rem; color: var(--text); text-decoration: none; cursor: pointer; }
.rdr .evm__sub a:hover, .rdr .evm__sub button:hover { border-color: var(--r-accent); background: var(--r-accent-dim); }
@media (min-width: 980px) {
  .rdr .evm { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; }
  .rdr .evm__day { position: sticky; top: calc(var(--r-top) + var(--evbar-h, 56px) + 8px); max-height: calc(100vh - var(--r-top) - var(--evbar-h, 56px) - 24px); overflow: auto; }
  .rdr .evp--month .evw { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .rdr .evm__d { min-height: 50px; padding: 4px 4px 4px 5px; }
  .rdr .evm__d > b { width: 22px; height: 22px; font-size: .76rem; }
  .rdr .evm__d > small { display: none; }
  .rdr .evm__dots { gap: 2px; }
  .rdr .evm__dots i { width: 6px; height: 6px; }
  .rdr .evm__dots em { font-size: .58rem; }
  .rdr .evm__w--past .evm__d { min-height: 24px; }
  .rdr .evm__nav h2 { font-size: .98rem; }
  .rdr .evm__e { grid-template-columns: 56px minmax(0, 1fr) auto; }
}
/* The day sheet on a phone: the day's events over the month, the days before and after one tap or one swipe away. */
.rdr .evsh__day-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 4px 0 8px; }
.rdr .evsh__day-go { display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 6px 12px; border: 1px solid var(--r-border); border-radius: 999px; font-size: .82rem; font-weight: 600; color: var(--r-accent); text-decoration: none; }
.rdr .evsh__day-go:last-child { justify-content: flex-end; }
.rdr span.evsh__day-go { border-color: transparent; }
.rdr .evsh__day-n { margin: 0 0 6px; font-size: .78rem; color: var(--r-muted); }
.rdr .evsh__day .evm__e { padding-inline: 4px; }
.rdr .evsh__day .evsh__g { margin-top: 14px; }
.rdr .evm__dh { position: relative; }
.rdr .evm__x { position: absolute; top: 0; right: 0; display: inline-flex; align-items: center; gap: 5px; min-height: 32px; padding: 4px 10px; border: 1px solid var(--r-border); border-radius: 999px; background: var(--r-card); font: inherit; font-size: .74rem; font-weight: 600; color: var(--r-accent); cursor: pointer; }
.rdr .evm__x:hover { border-color: var(--r-accent); background: var(--r-accent-dim); }
@media (max-width: 979px) {
  /* The sheet is the day's list on a phone; the panel under the month stands down. */
  .rdr .evm__day { display: none; }
}
@media (min-width: 980px) {
  /* Expanded on a wide screen: the day fills a wide overlay, its events in columns, no scrolling up and down. */
  /* The overlay takes the screen, edge to edge but for a small margin, and keeps its height from day to day. */
  .rdr .evsh[data-evsheet-panel="day"] { align-items: stretch; justify-items: center; padding: calc(var(--r-top, 64px) + 12px) 16px 16px; }
  .rdr .evsh[data-evsheet-panel="day"] .evsh__p { width: min(1280px, 100%); height: calc(100vh - var(--r-top, 64px) - 28px); max-height: none; border-radius: 22px; }
  .rdr .evsh[data-evsheet-panel="day"] .evsh__h { padding: 18px 24px 8px; font-size: 1.35rem; }
  .rdr .evsh[data-evsheet-panel="day"] .evsh__b { padding: 0 24px 12px; }
  .rdr .evsh[data-evsheet-panel="day"] .evsh__day-nav { grid-template-columns: auto auto; justify-content: space-between; }
  .rdr .evsh[data-evsheet-panel="day"] .evsh__day-swipe { display: none; }
  .rdr .evsh[data-evsheet-panel="day"] .evm__dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 8px; }
  .rdr .evsh[data-evsheet-panel="day"] .evm__e { grid-template-columns: 72px minmax(0, 1fr) auto; align-items: start; min-height: 76px; padding: 12px 14px; border: 1px solid var(--r-border); border-radius: 12px; background: var(--r-card); }
  .rdr .evsh[data-evsheet-panel="day"] .evm__e > b { font-size: .78rem; }
  .rdr .evsh[data-evsheet-panel="day"] .evm__et { font-size: .95rem; }
  .rdr .evsh[data-evsheet-panel="day"] .evm__e small { font-size: .78rem; }
  .rdr .evsh[data-evsheet-panel="day"] .evm__dl { gap: 10px; }
  .rdr .evsh[data-evsheet-panel="day"] .evm__e:hover { border-color: var(--r-accent); }
  .rdr .evsh[data-evsheet-panel="day"] .evsh__f { padding: 12px 24px; }
  .rdr .evsh[data-evsheet-panel="day"] .evsh__f .btn { width: auto; min-width: 220px; margin-left: auto; display: block; }
}
/* ── By neighborhood ──────────────────────────────────────────────────
   A card per pocket of the metro, with what's on there in the next 30 days. */
.rdr .evhood { margin-top: 28px; }
.rdr .evhood__h h2 { margin: 4px 0 6px; font-size: 1.4rem; letter-spacing: -.015em; }
.rdr .evhood__h p { max-width: 64ch; margin: 0 0 6px; font-size: .9rem; color: var(--r-muted); }
.rdr .evhood__h p a { color: var(--r-accent); }
.rdr .evhood__r { margin: 16px 0 8px; font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--r-faint); }
.rdr .evhood__g { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 12px; align-items: start; }
.rdr .evhood__c { display: grid; gap: 4px; padding: 14px; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); }
.rdr .evhood__c.on { box-shadow: inset 0 0 0 2px var(--r-accent); }
.rdr .evhood__c h3 { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin: 0 0 4px; font-size: .98rem; }
.rdr .evhood__c h3 small { font-size: .78rem; font-weight: 600; color: var(--r-muted); }
.rdr .evhood__e { display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 1px 10px; padding: 7px 0; border-top: 1px solid var(--r-border); color: var(--text); text-decoration: none; }
.rdr .evhood__e > b { grid-row: span 2; align-self: start; padding-top: 2px; font-size: .7rem; line-height: 1.2; color: var(--r-accent); }
.rdr .evhood__e span { font-size: .84rem; font-weight: 600; line-height: 1.25; }
.rdr .evhood__e small { font-size: .7rem; color: var(--r-muted); }
.rdr .evhood__e:hover span { color: var(--r-accent); }
.rdr .evhood__all { margin-top: 4px; font-size: .8rem; font-weight: 600; color: var(--r-accent); text-decoration: none; }
/* ── The foot: who's hosting, and how to add a calendar ──────────────── */
.rdr .evfoot { display: grid; gap: 16px; margin-top: 28px; }
.rdr .evfoot .evhosts { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1px 12px; }
.rdr .evfoot .evhosts > .k, .rdr .evfoot .evhosts > .mk-replegend { grid-column: 1 / -1; }
.rdr .evfoot__r { display: grid; gap: 12px; }
@media (min-width: 980px) { .rdr .evfoot { grid-template-columns: minmax(0, 1fr) 320px; align-items: start; } }
/* The next five weeks: each day lit by how much is on. */
.rdr .evcal, .rdr .evhosts, .rdr .evareas { padding: 14px; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); }
/* Why the calendar exists, under the title: one paragraph, no poster. */
.rdr .evwhy { max-width: 64ch; margin: -4px 0 14px; font-size: .95rem; line-height: 1.55; color: var(--r-muted); }
.rdr .evwhy b { color: var(--text); }
.rdr .evwhy__s { display: none; }
/* Where in the metro: the areas with something on, grouped in town, around the metro, elsewhere. */
.rdr .evareas { display: flex; flex-direction: column; gap: 1px; }
.rdr .evareas .k { margin-bottom: 6px; }
.rdr .evareas__r { margin: 6px 6px 2px; font-size: .62rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--r-faint); }
.rdr .evareas__r:first-of-type { margin-top: 0; }
.rdr .evareas a { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 10px; font-size: .8rem; line-height: 1.25; color: var(--text); text-decoration: none; }
.rdr .evareas a:hover, .rdr .evareas a.on { background: var(--r-accent-dim); }
.rdr .evareas a.on { box-shadow: inset 0 0 0 1px var(--r-accent-line); }
.rdr .evareas a > small { font-size: .74rem; color: var(--r-muted); font-variant-numeric: tabular-nums; }
.rdr .evareas a:focus-visible { outline: 2px solid var(--r-accent); outline-offset: 1px; }
.rdr .evareas .evareas__c { margin-top: 4px; justify-content: center; font-size: .76rem; color: var(--r-accent); }
.rdr .evareas .mk-fine { margin: 8px 0 0; }
/* The neighborhood on a card, beside the format and the mode. */
.rdr .evt__area { display: inline-flex; align-items: center; gap: 3px; color: var(--r-accent); text-decoration: none; }
.rdr .evt__area:hover { text-decoration: underline; text-underline-offset: 2px; }
.rdr .evcal__h { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.rdr .evcal__h a { font-size: .74rem; color: var(--r-accent); text-decoration: none; }
.rdr .evcal__g { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.rdr .evcal__dow { padding-bottom: 2px; text-align: center; font-size: .58rem; font-weight: 600; letter-spacing: .08em; color: var(--r-faint); }
.rdr .evcal__d { display: grid; place-items: center; aspect-ratio: 1; max-width: 100%; border-radius: 9px; font-size: .74rem; color: var(--r-faint); text-decoration: none; font-variant-numeric: tabular-nums; }
.rdr .evcal__d.has { color: var(--text); font-weight: 600; background: color-mix(in srgb, var(--r-accent) calc(var(--k) * 30%), transparent); }
.rdr .evcal__d.has:hover { box-shadow: inset 0 0 0 1.5px var(--r-accent); }
.rdr .evcal__d.past { opacity: .35; }
.rdr .evcal__d.today { box-shadow: inset 0 0 0 1.5px var(--text); }
.rdr .evcal__d.sel { background: var(--btn-fill); color: var(--btn-ink); }
.rdr .evcal__d small { font-size: .56rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.rdr .evcal__d:focus-visible, .rdr .evhosts a:focus-visible, .rdr .evr:focus-visible { outline: 2px solid var(--r-accent); outline-offset: 1px; }

.rdr .evhosts { display: flex; flex-direction: column; gap: 1px; }
/* "Add your calendar": the same card as its neighbors, gold because it asks for participation. */
.rdr .evadd { display: grid; gap: 8px; justify-items: start; padding: 14px; border: 1px solid var(--r-border); border-left: 3px solid #F4A67A; border-radius: var(--pa-r, 18px); background: var(--r-card); }
.rdr .evadd p { margin: 0; font-size: .82rem; line-height: 1.45; color: var(--text); }
.rdr .evhosts .k { margin-bottom: 6px; }
.rdr .evhosts a { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 5px 6px; border-radius: 10px; font-size: .8rem; line-height: 1.25; color: var(--text); text-decoration: none; }
.rdr .evhosts a:hover, .rdr .evhosts a.on { background: var(--r-accent-dim); }
.rdr .evhosts a.on { box-shadow: inset 0 0 0 1px var(--r-accent-line); }
.rdr .evhosts a > small { font-size: .74rem; color: var(--r-muted); font-variant-numeric: tabular-nums; }
.rdr .evhosts span small { display: block; font-size: .66rem; color: var(--r-faint); }
.rdr .evhosts .mk-mono, .rdr .evt__host .mk-mono { width: 28px; height: 28px; border-radius: 8px; font-size: .58rem; }
.rdr .sw { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--hc, var(--r-faint)); vertical-align: 1px; }

/* The filters, in one row above the list. */
.rdr .evf { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; }
.rdr .evf .tabs { margin: 0; }
.rdr .evf select, .rdr .evf input { min-height: 38px; max-width: 100%; padding: 0 12px; border: 1px solid var(--r-border2); border-radius: 999px; background: var(--r-card); color: var(--text); font: inherit; font-size: .82rem; }
.rdr .evf input { flex: 1 1 160px; min-width: 0; }
.rdr .evf select:focus-visible, .rdr .evf input:focus-visible { outline: 2px solid var(--r-accent); outline-offset: 1px; }
.rdr .evf__on { margin: 0 0 12px; font-size: .8rem; color: var(--r-muted); }
.rdr .evf__on a { color: var(--r-accent); }

/* The agenda: one day at a time, its heading pinned while you read it. */
.rdr .evd { margin-bottom: 16px; }
.rdr .evd__h { position: sticky; top: var(--r-top); z-index: 2; display: flex; align-items: baseline; gap: 10px; margin: 0 0 8px; padding: 8px 0; border-bottom: 1px solid var(--r-border); background: var(--bg); font-size: 1rem; }
.rdr .evd__h small { font-family: var(--font-body); font-size: .72rem; font-weight: 500; letter-spacing: 0; color: var(--r-muted); }
.rdr .evt { display: grid; grid-template-columns: 5.4rem minmax(0, 1fr); gap: 14px; margin-bottom: 10px; padding: 14px 16px; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); box-shadow: var(--pa-lift-1); transition: box-shadow .2s, border-color .2s; scroll-margin-top: calc(var(--r-top) + 60px); }
.rdr .evt:hover { box-shadow: var(--pa-lift-2); }
.rdr .evt.is-focus { border-color: var(--r-accent); box-shadow: 0 0 0 3px var(--r-accent-dim), var(--pa-lift-2); }
.rdr .evt__when b { display: block; font-family: var(--font-display); font-size: .95rem; line-height: 1.2; color: var(--text); }
.rdr .evt__when small { display: block; margin-top: 2px; font-size: .72rem; color: var(--r-muted); }
.rdr .evt__top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 4px; }
.rdr .evt__fmt { display: inline-flex; align-items: center; gap: 5px; margin-right: 4px; font-size: .64rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--r-accent); }
.rdr .evt__aud { padding: 1px 8px; border-radius: 999px; background: var(--bg-secondary); font-size: .68rem; color: var(--r-muted); }
.rdr .evt h3 { margin: 2px 0 4px; font-size: 1.06rem; line-height: 1.3; }
.rdr .evt h3 a { color: var(--text); text-decoration: none; }
.rdr .evt h3 a:hover { color: var(--r-accent); }
.rdr .evt__x { margin-left: 4px; color: var(--r-faint); }
.rdr .evt__good { margin-bottom: 6px; font-size: .86rem; line-height: 1.5; color: var(--r-text2); }
.rdr .evt__meta { display: flex; align-items: flex-start; gap: 6px; margin-bottom: 10px; font-size: .78rem; color: var(--r-muted); }
.rdr .evt__meta .ic { margin-top: 1px; }
.rdr .evt__meta a { color: inherit; text-decoration: underline; text-decoration-color: var(--r-border2); text-underline-offset: 3px; }
.rdr .evt__who { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; }
.rdr .evt__who small { display: block; font-size: .58rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--r-faint); }
.rdr .evt__host { display: inline-flex; align-items: center; gap: 8px; font-size: .84rem; }
.rdr .evt__host a { font-weight: 600; color: var(--text); text-decoration: none; }
.rdr .evt__host a:hover { color: var(--r-accent); }
.rdr .evt__with { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.rdr .evt__with small { width: 100%; }
.rdr .evt__w { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px 2px 2px; border: 1px solid var(--r-border); border-radius: 999px; font-size: .76rem; color: var(--text); text-decoration: none; }
.rdr .evt__w:hover { border-color: var(--r-accent); }
.rdr .evt__w .mk-mono { width: 22px; height: 22px; border-radius: 50%; font-size: .5rem; }
.rdr .evt__ai { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 12px; padding: 9px 12px; border-radius: 12px; background: color-mix(in srgb, var(--r-accent) 7%, var(--r-card)); font-size: .78rem; line-height: 1.45; color: var(--r-text2); }
.rdr .evt__ai > span { flex: 1 1 240px; }
.rdr .evt__ai > .ic { color: var(--r-accent); }
.rdr .evt__ai .ev-btn { margin: 0; }
.rdr .evt__more { margin-top: 10px; font-size: .8rem; color: var(--r-muted); }
.rdr .evt__more summary { cursor: pointer; font-size: .76rem; font-weight: 600; color: var(--r-accent); }
.rdr .evt__more p { margin-top: 6px; max-width: 70ch; white-space: pre-line; }
@media (max-width: 560px) {
  .rdr .evt { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 12px 14px; }
  .rdr .evt__when { display: flex; align-items: baseline; gap: 8px; }
}

.rdr .evai { margin-top: 26px; padding: 20px 22px; border: 1px solid var(--r-accent-line); border-radius: var(--pa-r-lg, 26px); background: color-mix(in srgb, var(--r-accent) 5%, var(--r-card)); }
.rdr .evai h2 { margin: 6px 0 8px; font-size: 1.35rem; }
.rdr .evai p { max-width: 64ch; margin-bottom: 12px; color: var(--r-text2); }
.rdr .evai__go { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rdr .evai__go .btn { width: auto; margin: 0; min-height: 40px; padding: .5rem 1rem; border-radius: 999px; font-size: .84rem; }

/* One event in a line: the date block, the title, when and who. */
.rdr .evr { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 7px 6px; border-radius: 12px; color: var(--text); text-decoration: none; }
.rdr .evr:hover { background: var(--r-accent-dim); }
.rdr .evr__d { display: grid; place-items: center; align-content: center; width: 44px; height: 46px; border-radius: 10px; background: var(--bg-secondary); line-height: 1; }
.rdr .evr__d b { font-size: .56rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--r-accent); }
.rdr .evr__d i { margin-top: 3px; font-family: var(--font-display); font-size: 1.1rem; font-style: normal; font-weight: 700; }
.rdr .evr__b { min-width: 0; }
.rdr .evr__b b { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: .86rem; line-height: 1.3; }
.rdr .evr__b small { display: block; margin-top: 2px; font-size: .72rem; color: var(--r-muted); }
.rdr .evr > em { font-style: normal; color: var(--r-accent); }
.rdr .evr-list { display: grid; gap: 2px; margin: 6px 0 4px; }

/* On an organization's page. */
.rdr .mk-cover--org { grid-template-areas: "head" "hero" "for" "evs" "src" "note" "read" "path" "eng" "also" "op"; }
@media (min-width: 1100px) { .rdr .mk-cover--org { grid-template-areas: "head head" "hero eng" "for for" "evs evs" "src src" "note note" "read read" "path path" "also also" "op op"; } }
.rdr .mk-evs { grid-area: evs; min-height: 132px; padding: 16px; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); }
.rdr .mk-evs__h { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 4px; }
.rdr .mk-evs__h a { font-size: .8rem; font-weight: 600; color: var(--r-accent); text-decoration: none; }
.rdr .mk-evs__l { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; margin-top: 8px; }
@media (min-width: 760px) { .rdr .mk-evs__l { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } }
.rdr .mk-evs .mk-fine .ic { color: var(--r-accent); }

/* In the directory and the tour. */
.rdr .mk-oc__ev { color: var(--r-accent); white-space: nowrap; }
.rdr .tr-on { display: flex; align-items: center; gap: 14px; max-width: 900px; margin: 12px 0 4px; padding: 14px 18px; border: 1px solid rgba(255, 255, 255, .08); border-radius: var(--pa-r, 18px); background: linear-gradient(160deg, #15332B 0%, #0B1B3F 60%, #0B231D 100%); box-shadow: var(--pa-lift-2); color: #fff; text-decoration: none; transition: transform .2s; }
.rdr .tr-on:hover { transform: translateY(-2px); }
.rdr .tr-on > .ic { width: 1.7em; height: 1.7em; color: #8FD9BE; }
.rdr .tr-on b { display: block; font-family: var(--font-display); font-size: 1.05rem; color: #fff; }
.rdr .tr-on span span { display: block; margin-top: 2px; font-size: .84rem; line-height: 1.45; color: rgba(255, 255, 255, .75); }
.rdr .tr-on > em { margin-left: auto; font-size: 1.3rem; font-style: normal; color: #8FD9BE; }

/* Lesson 12's picture: clusters, then the pages. */
.rdr .lsn-evp .lsn-lists { margin-top: 14px; }
.rdr .lsn-evp .lsn-lists span small { display: block; font-size: .7rem; color: var(--r-muted); }

/* The front door: the ecosystem, group by group. */
.rdr .tr-eco { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; max-width: 900px; margin: 20px 0 8px; }
.rdr .tr-eco__c { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border: 1px solid var(--r-border); border-radius: 16px; background: var(--r-card); box-shadow: var(--pa-lift-1); color: var(--text); text-decoration: none; transition: border-color .2s, transform .2s; }
.rdr .tr-eco__c:hover { border-color: var(--r-accent); transform: translateY(-2px); }
.rdr .tr-eco__n { font-family: var(--font-display); font-size: 2rem; font-weight: 700; line-height: 1; letter-spacing: -.03em; }
.rdr .tr-eco__c b { font-size: .88rem; }
.rdr .tr-eco__t { display: flex; margin-top: 8px; }
.rdr .tr-eco__t .mk-mono { width: 28px; height: 28px; margin-right: -7px; border: 2px solid var(--r-card); border-radius: 50%; font-size: .5rem; }
.rdr .tr-eco__c--ev { border-color: transparent; background: var(--pa-navy); color: #fff; }
.rdr .tr-eco__c--ev b { color: #fff; }
.rdr .tr-eco__s { font-size: .76rem; line-height: 1.4; color: rgba(255, 255, 255, .74); }
.rdr .tr-proof { margin-top: 14px; max-width: 70ch; }
@media (max-width: 560px) { .rdr .tr-eco { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { .rdr .tr-eco__c { transition: none; } .rdr .tr-eco__c:hover { transform: none; } }

/* Copy blocks: the parts to fill in are marked; an email opens ready to send. */
.rdr .mk-copy p { white-space: pre-wrap; }
.rdr .mk-copy mark { padding: 0 3px; border-radius: 4px; background: color-mix(in srgb, var(--rl-amber) 20%, transparent); color: inherit; }
.rdr .mk-copy--code p { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .74rem; line-height: 1.5; }
.rdr .mk-copy__go { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rdr .mk-copy__mail { display: inline-flex; align-items: center; gap: 4px; font-size: .76rem; font-weight: 600; color: var(--r-accent); text-decoration: none; }
.rdr .mk-copy__mail:hover { text-decoration: underline; text-underline-offset: 3px; }
.rdr .mk-copy__n { display: block; margin-top: 6px; font-size: .72rem; line-height: 1.45; color: var(--r-muted); }

/* The Atlanta plan. */
.rdr .cp-gap { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 12px 0; }
.rdr .cp-gap div { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid var(--r-border); border-radius: 14px; background: var(--r-card); }
.rdr .cp-gap span { font-size: .72rem; line-height: 1.35; color: var(--r-muted); }
.rdr .cp-gap b { font-family: var(--font-display); font-size: 1.55rem; line-height: 1.1; color: var(--text); }
.rdr .cp-gap small { font-size: .72rem; color: var(--r-faint); }
@media (max-width: 560px) { .rdr .cp-gap { grid-template-columns: minmax(0, 1fr); } }
.rdr .cp-roles { margin: 4px 0 10px; }
.rdr .cp-tl { margin-bottom: 8px; }
.rdr .cp-tl summary { font-size: .82rem; font-weight: 600; color: var(--r-accent); cursor: pointer; }
.rdr .cp-acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 760px) { .rdr .cp-acts { grid-template-columns: minmax(0, 1fr); } }
.rdr .cp-acts h4, .rdr .cp-copyh { display: flex; align-items: center; gap: 6px; margin: 4px 0 6px; font-size: .86rem; color: var(--text); }
.rdr .cp-acts ul { display: grid; gap: 10px; margin: 0; padding-left: 1.1rem; font-size: .88rem; line-height: 1.5; color: var(--r-text2); }
.rdr .cp-who { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.rdr .cp-role { padding: 1px 8px; border-radius: 999px; background: var(--bg-secondary); font-size: .64rem; font-weight: 600; color: var(--r-muted); }
.rdr .cp-copyh { margin-top: 18px; }
.rdr .cp-ev { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 10px; }
.rdr .cp-kit { margin-top: 20px; }
.rdr .cp-kit h3 { margin-bottom: 8px; font-size: 1rem; }

/* The holes: organizations by the eight pages AI cites most, labeled and explorable. */
.rdr .gg-how { margin: 0 0 10px; font-size: .82rem; line-height: 1.55; color: var(--r-text2); }
.rdr .gg-how__k { display: inline-flex; align-items: center; gap: 5px; margin-right: 8px; white-space: nowrap; }
.rdr .gg-dot { display: inline-block; flex: none; width: 11px; height: 11px; border-radius: 50%; }
.rdr .gg-dot--on { background: var(--r-accent); }
.rdr .gg-dot--off { border: 2px solid var(--r-danger); }
.rdr .gg-dot--na { width: 5px; height: 5px; background: var(--r-border2); }
.rdr .gg { display: grid; gap: 2px; padding: 12px; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); font-size: .78rem; }
.rdr .gg__head, .rdr .gg__r { display: grid; grid-template-columns: minmax(0, 10.5rem) repeat(8, minmax(20px, 1fr)) 2.8rem; gap: 2px; align-items: center; }
.rdr .gg__head { align-items: end; margin-bottom: 4px; padding-bottom: 6px; border-bottom: 1px solid var(--r-border); }
.rdr .gg__corner small, .rdr .gg__head .gg__tot, .rdr .gg__foot small { font-size: .58rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--r-faint); }
.rdr .gg__col { display: grid; justify-items: center; gap: 3px; padding: 4px 0; border-radius: 8px; color: var(--text); text-decoration: none; }
.rdr .gg__col:hover, .rdr .gg__col:focus-visible { background: var(--r-accent-dim); outline: none; }
.rdr .gg__col .fav { width: 16px; height: 16px; border-radius: 4px; }
.rdr .gg__col b { font-size: .7rem; }
.rdr .gg__r { border-radius: 8px; }
.rdr .gg__r:not(.gg__foot):hover { background: var(--bg-secondary); }
.rdr .gg__n { display: flex; align-items: center; gap: 7px; min-width: 0; padding: 2px 4px; color: var(--text); text-decoration: none; }
.rdr a.gg__n:hover span { color: var(--r-accent); }
.rdr .gg__n span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.rdr .gg__n .mk-mono { width: 22px; height: 22px; border-radius: 6px; font-size: .45rem; }
.rdr .gg__c { display: grid; place-items: center; height: 26px; border-radius: 7px; cursor: pointer; }
.rdr .gg__c:hover { background: var(--r-accent-dim); }
.rdr .gg__c i { display: block; width: 16px; height: 16px; border-radius: 50%; }
.rdr .gg__c--on i { background: var(--r-accent); }
.rdr .gg__c--off i { border: 2px solid var(--r-danger); }
.rdr .gg__c--na { cursor: default; }
.rdr .gg__c--na:hover { background: none; }
.rdr .gg__c--na i { width: 5px; height: 5px; background: var(--r-border2); }
.rdr .tr-scene.is-in .gg__c--off i { animation: tr-pulse 1.6s ease-out 1; }
.rdr .gg__tot { font-weight: 700; text-align: center; color: var(--r-danger); font-variant-numeric: tabular-nums; }
.rdr .gg__foot { margin-top: 4px; padding-top: 6px; border-top: 1px solid var(--r-border); }
.rdr .gg-key { display: grid; gap: 3px; margin: 10px 0 0; padding-left: 1.4rem; font-size: .76rem; color: var(--r-muted); }
.rdr .gg-key a { color: var(--text); text-underline-offset: 2px; }
@media (max-width: 560px) {
  .rdr .gg { padding: 8px; }
  .rdr .gg__head, .rdr .gg__r { grid-template-columns: minmax(0, 6.5rem) repeat(8, minmax(16px, 1fr)) 1.9rem; }
  .rdr .gg__n .mk-mono, .rdr .gg__col .fav { display: none; }
  .rdr .gg__c i { width: 12px; height: 12px; }
}
@media (prefers-reduced-motion: reduce) { .rdr .tr-scene.is-in .gg__c--off i { animation: none; } }

/* Where it's held, first: the venue, when we know it, with directions. */
.rdr .evt__at { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 2px 0 8px; padding: 8px 10px; border-radius: 12px; background: var(--bg-secondary); }
.rdr .evt__at > span { display: grid; min-width: 0; }
.rdr .evt__at small { font-size: .58rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--r-accent); }
.rdr .evt__at > span > a { font-weight: 700; color: var(--text); text-decoration: none; }
.rdr .evt__at > span > a:hover { color: var(--r-accent); }
.rdr .evt__at .mk-mono { width: 30px; height: 30px; border-radius: 8px; font-size: .56rem; }
.rdr .evt__dir { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; font-size: .76rem; font-weight: 600; color: var(--r-accent); text-decoration: none; }
.rdr .evt__mode { padding: 1px 8px; border-radius: 999px; font-size: .62rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.rdr .evt__mode--in-person { background: color-mix(in srgb, var(--r-accent) 14%, transparent); color: var(--r-accent); }
.rdr .evt__mode--hybrid { background: color-mix(in srgb, var(--rl-blue) 14%, transparent); color: var(--rl-blue); }
.rdr .evt__mode--online { background: var(--bg-secondary); color: var(--r-muted); }
.rdr .evt__also { margin-top: 8px; font-size: .72rem; color: var(--r-faint); }
.rdr .evt__also a { color: inherit; text-underline-offset: 2px; }

/* A full AI visibility report: a small mark on the organization's logo, wherever it appears. */
.rdr .mk-mono { position: relative; }
.rdr .mk-mono.has-rep { overflow: visible; }
.rdr .mk-mono.has-rep img { border-radius: inherit; }
.rdr .mk-rep { position: absolute; right: -5px; bottom: -5px; z-index: 1; display: grid; place-items: center; width: 15px; height: 15px; border: 2px solid var(--r-card); border-radius: 50%; background: var(--r-accent); color: var(--accent-ink, #fff); }
.rdr .mk-rep .ic { width: 9px; height: 9px; stroke-width: 3.2; }
.rdr .mk-rep--inline { position: static; display: inline-grid; flex: none; margin: 0 2px; vertical-align: -3px; }
.rdr .mk-replegend { display: inline-flex; align-items: center; gap: 6px; font-size: .74rem; color: var(--r-muted); }
.rdr .mk-repbtn { display: inline-flex; align-items: center; gap: 6px; padding: .45rem .9rem; border-radius: 999px; background: var(--btn-fill); color: var(--btn-ink); font-size: .8rem; font-weight: 600; text-decoration: none; }
.rdr .mk-repbtn:hover { background: var(--accent-hover); color: var(--btn-ink); }
.rdr .evt__rep { display: inline-flex; align-items: center; gap: 5px; font-size: .76rem; font-weight: 600; color: var(--r-accent); text-decoration: none; }
.rdr .evt__rep:hover { text-decoration: underline; text-underline-offset: 3px; }
.rdr .mk-oc__rep { font-weight: 600; color: var(--r-accent); }
.rdr .tabs .pill .mk-rep--inline { display: inline-grid; width: 14px; height: 14px; margin-right: 4px; border-width: 0; vertical-align: -2px; }
.rdr .mk-reps { margin: 6px 0 16px; padding: 14px 16px; border: 1px solid var(--r-accent-line); border-radius: var(--pa-r, 18px); background: color-mix(in srgb, var(--r-accent) 5%, var(--r-card)); }
.rdr .mk-reps > p { max-width: 70ch; margin-top: 4px; font-size: .86rem; color: var(--r-text2); }
.rdr .mk-reps__g { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; margin-top: 12px; }
.rdr .mk-reps__c { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--r-border); border-radius: 12px; background: var(--r-card); color: var(--text); text-decoration: none; }
.rdr .mk-reps__c:hover { border-color: var(--r-accent); }
.rdr .mk-reps__c b { display: block; font-size: .84rem; }
.rdr .mk-reps__c small { font-size: .7rem; color: var(--r-muted); }

/* The rail scrolls on its own, so its items must keep their height (flex would squeeze them into each other). */
.rdr .rdr__rail { gap: .3rem; }
.rdr .rdr__rail > * { flex-shrink: 0; }

/* Share of voice and win rate. */
.rdr .sv-toc { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 6px; }
.rdr .sv-toc a { padding: .35rem .8rem; border: 1px solid var(--r-border2); border-radius: 999px; font-size: .8rem; color: var(--text); text-decoration: none; }
.rdr .sv-toc a:hover { border-color: var(--r-accent); }
.rdr .sv-hi { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 8px 0 10px; padding: 12px 14px; border: 1px solid var(--r-accent-line); border-radius: 14px; background: var(--r-accent-dim); font-size: .88rem; }
.rdr .sv-hi > span:not(.mk-mono) { flex: 1 1 260px; }
.rdr .sv-hi > .mk-mono { flex: none; }
.rdr .sv-hi a { font-size: .8rem; color: var(--r-accent); }
.rdr .sv-s { margin: 22px 0 34px; scroll-margin-top: calc(var(--r-top) + 16px); }
.rdr .sv-s__h h2 { margin: 6px 0; font-size: 1.4rem; }
.rdr .sv-s__h p { max-width: 68ch; margin-bottom: 14px; font-size: .92rem; line-height: 1.55; color: var(--r-text2); }
.rdr .sv-read { margin-top: 10px; max-width: 70ch; }
.rdr .sv-strip { display: flex; gap: 2px; height: 48px; overflow: hidden; border-radius: 12px; }
.rdr .sv-seg { display: block; min-width: 3px; cursor: pointer; transition: filter .15s; }
.rdr .sv-seg:hover, .rdr .sv-seg.is-hi { filter: brightness(1.12); box-shadow: inset 0 0 0 2px var(--text); }
.rdr .sv-seg--rest { background: var(--r-border2); cursor: default; }
.rdr .sv-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; font-size: .76rem; color: var(--r-muted); }
.rdr .sv-legend i { display: inline-block; width: 10px; height: 10px; margin-right: 6px; border-radius: 3px; vertical-align: -1px; }
.rdr .sv-rank { display: grid; gap: 2px; margin-top: 14px; }
.rdr .sv-row { display: grid; grid-template-columns: 1.6rem 26px minmax(0, 12rem) minmax(0, 1fr) 3.4rem 4.8rem; gap: 10px; align-items: center; padding: 5px 6px; border-radius: 10px; font-size: .84rem; color: var(--text); text-decoration: none; }
.rdr .sv-row:hover, .rdr .sv-row.is-hi { background: var(--r-accent-dim); }
.rdr .sv-row.is-hi { box-shadow: inset 0 0 0 1px var(--r-accent-line); }
.rdr .sv-row .mk-mono, .rdr .sv-hm .mk-mono { width: 26px; height: 26px; border-radius: 7px; font-size: .5rem; }
.rdr .sv-row__r { font-size: .74rem; text-align: right; color: var(--r-faint); }
.rdr .sv-row__n { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.rdr .sv-row__t { height: 8px; overflow: hidden; border-radius: 4px; background: var(--bg-secondary); }
.rdr .sv-row__t i { display: block; height: 100%; border-radius: 4px; }
.rdr .sv-row b { text-align: right; }
.rdr .sv-row small { font-size: .72rem; text-align: right; color: var(--r-muted); }
.rdr .sv-more summary { margin-top: 8px; font-size: .8rem; font-weight: 600; color: var(--r-accent); cursor: pointer; }
.rdr .sv-engs-pick { margin: 0 0 10px; }
.rdr .sv-chart { padding: 12px; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); }
.rdr .sv-chart svg { display: block; width: 100%; max-width: 100%; height: auto; }
.rdr .sv-grid line { stroke: var(--r-border); stroke-width: 1; }
.rdr .sv-med { stroke: var(--r-border2); stroke-width: 1.5; stroke-dasharray: 4 4; }
.rdr .sv-ax text { fill: var(--r-muted); font-family: var(--font-body); font-size: 11px; }
.rdr .sv-q { fill: var(--r-faint); font-family: var(--font-body); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.rdr .sv-lab { fill: var(--text); font-family: var(--font-body); font-size: 11px; font-weight: 600; pointer-events: none; paint-order: stroke; stroke: var(--r-card); stroke-width: 3px; }
.rdr .sv-dot { fill: var(--c); fill-opacity: .8; stroke: var(--r-card); stroke-width: 2; cursor: pointer; transition: fill-opacity .15s; }
.rdr .sv-dot.is-thin { fill-opacity: .08; stroke: var(--c); stroke-width: 1.5; }
.rdr .sv-dot:hover, .rdr .sv-dot:focus-visible, .rdr .sv-dot.is-hi { fill-opacity: 1; stroke: var(--text); stroke-width: 2.5; outline: none; }
.rdr .sv-engs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 960px) { .rdr .sv-engs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rdr .sv-eng__p { display: grid; gap: 2px; align-content: start; padding: 12px; border: 1px solid var(--r-border); border-radius: 16px; background: var(--r-card); }
.rdr .sv-eng__p > .eng { justify-self: start; margin-bottom: 8px; }
.rdr .sv-eng__r { display: grid; grid-template-columns: minmax(0, 1fr) 2.8rem; grid-template-areas: "n n" "t v"; gap: 3px 8px; align-items: center; padding: 4px 6px; border-radius: 8px; font-size: .78rem; color: var(--text); text-decoration: none; }
.rdr .sv-eng__r:hover, .rdr .sv-eng__r.is-hi { background: var(--r-accent-dim); }
.rdr .sv-eng__n { grid-area: n; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.rdr .sv-eng__t { grid-area: t; height: 6px; overflow: hidden; border-radius: 3px; background: var(--bg-secondary); }
.rdr .sv-eng__t i { display: block; height: 100%; border-radius: 3px; background: var(--ec); }
.rdr .sv-eng__r b { grid-area: v; text-align: right; font-size: .74rem; }
.rdr .sv-hm-w { overflow-x: auto; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); }
.rdr .sv-hm { width: 100%; border-collapse: separate; border-spacing: 3px; font-size: .78rem; }
.rdr .sv-hm thead th { min-width: 70px; padding: 8px 4px 4px; vertical-align: bottom; text-align: left; font-size: .7rem; font-weight: 600; line-height: 1.25; }
.rdr .sv-hm thead th a { color: var(--text); text-decoration: none; }
.rdr .sv-hm thead th small { display: block; margin-top: 2px; font-size: .62rem; font-weight: 400; color: var(--r-faint); }
.rdr .sv-hm tbody th { padding: 0 8px 0 4px; white-space: nowrap; text-align: left; }
.rdr .sv-hm tbody th a { display: inline-flex; align-items: center; gap: 8px; font-size: .8rem; font-weight: 500; color: var(--text); text-decoration: none; }
.rdr .sv-hm tr.is-hi th a { font-weight: 700; color: var(--r-accent); }
.rdr .sv-hm__c { display: grid; place-items: center; height: 32px; border-radius: 7px; background: color-mix(in srgb, var(--r-accent) calc(var(--k) * 72%), var(--bg-secondary)); font-size: .74rem; font-weight: 600; color: var(--text); text-decoration: none; font-variant-numeric: tabular-nums; }
.rdr .sv-hm__c:hover, .rdr .sv-hm__c:focus-visible { outline: 2px solid var(--text); outline-offset: -2px; }
.rdr .sv-hm__z { display: block; height: 32px; border-radius: 7px; background: var(--bg-secondary); opacity: .5; }
.rdr .sv-hm-k { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: .74rem; color: var(--r-muted); }
.rdr .sv-hm-k i { width: 120px; height: 8px; border-radius: 4px; background: linear-gradient(90deg, var(--bg-secondary), color-mix(in srgb, var(--r-accent) 72%, var(--bg-secondary))); }
.rdr .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 560px) { .rdr .sv-row { grid-template-columns: 1.4rem 26px minmax(0, 1fr) 3rem 3.8rem; } .rdr .sv-row__t { display: none; } }

/* Tooltips: the theme's inverse, so they read on either ground. */
.rdr .mk-tip { position: fixed; top: 0; left: 0; z-index: 1200; display: grid; gap: 2px; max-width: 300px; padding: 9px 12px; border-radius: 12px; background: var(--text); color: var(--bg); box-shadow: var(--pa-lift-2); font-size: .76rem; line-height: 1.4; pointer-events: none; }
.rdr .mk-tip[hidden] { display: none; }
.rdr .mk-tip b { font-size: .84rem; }
.rdr .mk-tip em { margin-top: 2px; font-size: .7rem; font-style: normal; opacity: .7; }

/* Visibility, share of voice and win rate, wherever an organization appears. */
.rdr .ent-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.rdr .ent-stats a { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid var(--r-border); border-radius: 12px; background: var(--r-card); color: var(--text); text-decoration: none; }
.rdr .ent-stats a:hover { border-color: var(--r-accent); }
.rdr .ent-stats b { font-family: var(--font-display); font-size: 1.4rem; line-height: 1; }
.rdr .ent-stats span { font-size: .72rem; color: var(--r-muted); }
.rdr .ent-eng { display: grid; gap: 6px; margin-top: 12px; }
.rdr .ent-eng__r { display: grid; grid-template-columns: 6.6rem minmax(0, 1fr) 2.6rem; gap: 10px; align-items: center; font-size: .78rem; }
.rdr .ent-eng__r .eng { justify-self: start; }
.rdr .ent-eng__r b { text-align: right; }
.rdr .ent-eng__t { position: relative; height: 8px; overflow: hidden; border-radius: 4px; background: var(--bg-secondary); }
.rdr .ent-eng__t i { position: absolute; top: 0; bottom: 0; left: 0; border-radius: 4px; background: color-mix(in srgb, var(--r-accent) 38%, var(--r-border)); }
.rdr .ent-eng__t i.w { background: var(--r-accent); }
.rdr .mk-evrow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rdr .mk-statchip { display: inline-flex; align-items: center; gap: 6px; padding: .45rem .85rem; border: 1px solid var(--r-border2); border-radius: 999px; background: var(--r-card); font-size: .8rem; color: var(--text); text-decoration: none; }
.rdr .mk-statchip:hover { border-color: var(--r-accent); }
.rdr .mk-statchip .ic { color: var(--r-accent); }

/* The rail: five sections, each with a line on what's in it; the open one lists its tabs. */
.rdr .rdr__rail a.rl-sec { justify-content: flex-start; align-items: flex-start; gap: 10px; padding: .6rem .75rem; }
.rdr .rdr__rail a.rl-sec > .ic { flex: none; margin-top: 3px; color: var(--r-accent); }
.rdr .rdr__rail a.rl-sec b { display: block; font-size: .92rem; font-weight: 600; color: var(--text); }
.rdr .rdr__rail a.rl-sec small { display: block; margin-top: 2px; font-size: .72rem; font-weight: 400; line-height: 1.35; color: var(--r-muted); }
.rdr .rdr__rail a.rl-sec.is-open small { display: none; }
.rdr .rdr__rail .rl-sub { display: grid; gap: 1px; margin: 0 1rem .5rem 1.95rem; padding-left: .55rem; border-left: 1px solid var(--r-border); }
.rdr .rdr__rail .rl-sub a { min-height: 34px; margin-right: 0; padding: .35rem .6rem; font-size: .84rem; }

/* A section's tabs, at the top of its pages: what's inside, a line each. */
.rdr .sx { margin: 4px 0 18px; }
.rdr .sx__k { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 8px; font-size: .62rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--r-accent); }
.rdr .sx__tabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.rdr .sx__t { display: flex; flex: 1 1 0; flex-direction: column; gap: 2px; min-width: 150px; padding: 10px 12px; border: 1px solid var(--r-border); border-radius: 14px; background: var(--r-card); color: var(--text); text-decoration: none; transition: border-color .2s; }
.rdr .sx__t b { font-size: .86rem; }
.rdr .sx__t small { font-size: .72rem; line-height: 1.35; color: var(--r-muted); }
.rdr .sx__t:hover { border-color: var(--r-accent-line); }
.rdr .sx__t.is-on { border-color: var(--r-accent); background: var(--r-accent-dim); box-shadow: inset 0 -2px 0 var(--r-accent); }
.rdr .sx__t:focus-visible { outline: 2px solid var(--r-accent); outline-offset: 1px; }
@media (max-width: 640px) { .rdr .sx__t { flex: 0 0 auto; min-width: 0; } .rdr .sx__t small { display: none; } }

/* Re-rendering the same page with new filters: no entrance motion, nothing jumps. */
.mk-same .rdr .mk-rise { animation: none !important; opacity: 1 !important; transform: none !important; }
.rdr .evt[data-ev] { cursor: pointer; }
.rdr .evt[data-ev]:hover { border-color: var(--r-accent-line); }

/* Who's reading. */
.rdr .pa-as { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0 4px; }
.rdr .pa-as > span { margin-right: 4px; font-size: .62rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--r-muted); }
.rdr .tr-as { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; max-width: 900px; margin: 10px 0 2px; }
.rdr .tr-as > span { margin-right: 4px; font-size: .84rem; color: var(--r-muted); }

/* Hosts, each with a quick look at what AI says about it. */
.rdr .evhosts__r { display: flex; align-items: center; gap: 2px; }
.rdr .evhosts__r > a { flex: 1; min-width: 0; }
.rdr .evhosts__ai { flex: none; display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 1px solid transparent; border-radius: 9px; background: none; color: var(--r-accent); cursor: pointer; }
.rdr .evhosts__ai:hover { border-color: var(--r-accent-line); background: var(--r-accent-dim); }
.rdr .evhosts__ai:focus-visible { outline: 2px solid var(--r-accent); outline-offset: 1px; }

/* The drawer's way back. */
.rdr .ev__back { display: inline-flex; margin: 0 10px 8px 0; padding: 4px 11px; border: 1px solid var(--r-border2); border-radius: 999px; background: var(--r-card); color: var(--text); font: inherit; font-size: .76rem; font-weight: 600; cursor: pointer; }
.rdr .ev__back:hover { border-color: var(--r-accent); }

/* The organization viewer, in place. */
.rdr .ent-ev { display: grid; gap: 12px; padding: 14px 16px; border: 1px solid var(--r-border); border-radius: var(--pa-r, 18px); background: var(--r-card); }
.rdr .ent-ev__good { font-size: .92rem; line-height: 1.5; color: var(--r-text2); }
.rdr .ent-ev__dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; }
.rdr .ent-ev__dl dt { display: flex; align-items: center; gap: 5px; font-size: .6rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--r-faint); }
.rdr .ent-ev__dl dd { margin: 4px 0 0; font-size: .82rem; line-height: 1.4; color: var(--text); }
.rdr .ent-ev__dl a { color: inherit; text-underline-offset: 3px; }
.rdr .ent-ev__go { display: flex; flex-wrap: wrap; gap: 8px; }
.rdr .ent-ev__go .btn { width: auto; min-height: 40px; margin: 0; padding: .5rem 1rem; border-radius: 999px; font-size: .84rem; }
.rdr .ent-sep { display: grid; gap: 10px; border-top: 1px solid var(--r-border); }
.rdr .ent-sep > .k { display: inline-flex; align-items: center; gap: 6px; padding-top: 14px; color: var(--r-accent); }
.rdr .ent-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.rdr .ent-tabs button { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px 4px 4px; border: 1px solid var(--r-border2); border-radius: 999px; background: var(--r-card); color: var(--text); font: inherit; font-size: .8rem; cursor: pointer; }
.rdr .ent-tabs button small { font-size: .64rem; color: var(--r-muted); }
.rdr .ent-tabs button.on { border-color: var(--r-accent); background: var(--r-accent-dim); font-weight: 600; }
.rdr .ent-tabs .mk-mono, .rdr .ent-ins .mk-mono { width: 26px; height: 26px; border-radius: 50%; font-size: .54rem; }
.rdr .ent-h { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.rdr .ent-h__n { flex: 1 1 180px; min-width: 0; }
.rdr .ent-h__n b { display: block; margin-bottom: 2px; font-family: var(--font-display); font-size: 1.3rem; line-height: 1.15; color: var(--text); }
.rdr .ent-as { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 16px; padding: 12px 14px; border-radius: 14px; background: color-mix(in srgb, var(--r-accent) 7%, var(--r-card)); }
.rdr .ent-as p { flex: 1 1 260px; font-size: .9rem; line-height: 1.5; color: var(--r-text2); }
.rdr .ent-as__l { display: grid; gap: 4px; font-size: .58rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--r-muted); }
.rdr .ent-as__l select { min-height: 34px; max-width: 100%; padding: 0 10px; border: 1px solid var(--r-border2); border-radius: 999px; background: var(--r-card); color: var(--text); font: inherit; font-size: .8rem; letter-spacing: 0; text-transform: none; }
.rdr .ent-vis { display: flex; align-items: center; gap: 14px; }
.rdr .ent-vis__n { flex: none; font-family: var(--font-display); font-size: 3rem; font-weight: 700; line-height: 1; letter-spacing: -.04em; color: var(--text); }
.rdr .ent-vis__n small { font-size: 1.2rem; }
.rdr .ent-vis p { font-size: .86rem; line-height: 1.5; color: var(--r-text2); }
.rdr .ent-bar { display: flex; gap: 2px; height: 10px; margin: 12px 0 8px; overflow: hidden; border-radius: 6px; }
.rdr .ent-bar__w { background: var(--r-accent); }
.rdr .ent-bar__v { background: color-mix(in srgb, var(--r-accent) 38%, var(--r-border)); }
.rdr .ent-bar__a { background: var(--r-border2); }
.rdr .ent-key { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .74rem; color: var(--r-muted); }
.rdr .ent-key i { display: inline-block; width: 9px; height: 9px; margin-right: 5px; border-radius: 3px; vertical-align: -1px; }
.rdr .ent-key b { color: var(--text); }
.rdr .ent-desc { display: grid; gap: 4px; margin: 4px 0 8px; padding-left: 1.1rem; font-size: .88rem; line-height: 1.45; color: var(--r-text2); }
.rdr .ent-h4 { display: flex; align-items: center; gap: 6px; margin: 12px 0 2px; font-size: .82rem; color: var(--text); }
.rdr .ent-ins { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.rdr .ent-ins__b { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--r-border); border-radius: 12px; background: var(--r-card); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.rdr .ent-ins__b:hover { border-color: var(--r-accent); }
.rdr .ent-ins__b b { display: block; font-size: .82rem; }
.rdr .ent-ins__b small { font-size: .7rem; color: var(--r-muted); }
.rdr .ent-fam { display: grid; grid-template-columns: minmax(0, 10rem) minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 4px 0; font-size: .82rem; color: var(--r-text2); }
.rdr .ent-fam__t { height: 6px; overflow: hidden; border-radius: 4px; background: var(--r-border); }
.rdr .ent-fam__t i { display: block; height: 100%; border-radius: 4px; background: var(--r-accent); }
.rdr .ent-fam small { font-size: .7rem; color: var(--r-muted); white-space: nowrap; }
.rdr .ent-pages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.rdr .ent-page { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 10px; border: 1px solid var(--r-border); border-radius: 12px; color: var(--text); text-decoration: none; }
.rdr .ent-page:hover { border-color: var(--r-accent); }
.rdr .ent-page span { min-width: 0; }
.rdr .ent-page b { display: block; overflow: hidden; font-size: .8rem; white-space: nowrap; text-overflow: ellipsis; }
.rdr .ent-page small { font-size: .68rem; color: var(--r-muted); }
.rdr .ent-page.is-own { border-color: var(--r-accent-line); background: var(--r-accent-dim); }
.rdr .ent-moves { display: grid; gap: 6px; margin: 4px 0 8px; padding: 0; list-style: none; counter-reset: m; }
.rdr .ent-moves li { counter-increment: m; }
.rdr .ent-moves a { display: grid; grid-template-columns: 26px minmax(0, 1fr); column-gap: 10px; row-gap: 2px; padding: 10px 12px; border: 1px solid var(--r-border); border-radius: 12px; color: var(--text); text-decoration: none; }
.rdr .ent-moves a::before { content: counter(m); grid-row: span 2; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--btn-fill); color: var(--btn-ink); font-size: .74rem; font-weight: 700; }
.rdr .ent-moves a:hover { border-color: var(--r-accent); }
.rdr .ent-moves b { font-size: .86rem; line-height: 1.35; }
.rdr .ent-moves small { font-size: .72rem; color: var(--r-muted); }
@media (max-width: 560px) {
  .rdr .ent-ev__dl, .rdr .ent-ins, .rdr .ent-pages { grid-template-columns: minmax(0, 1fr); }
  .rdr .ent-fam { grid-template-columns: minmax(0, 1fr) auto; }
  .rdr .ent-fam__t { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .rdr .evt, .rdr .tr-on { transition: none; }
  .rdr .tr-on:hover { transform: none; }
}

/* ── The front page ─────────────────────────────────────────────────────
   The hero leads with the city: this week's events in a navy card beside the words. The
   experiment is the second band, same shape, so the page reads as two doors, not one. */
#rdr .v2ev { display: grid; gap: 10px; padding: 16px; border: 1px solid #2A5D4E; border-radius: 16px; background: #0B241E; color: #E6EEF7; }
#rdr .v2ev__h { display: grid; gap: 4px; }
#rdr .v2ev__h .k { color: #8FD9BE; }
#rdr .v2ev__h p { margin: 0; font-size: .92rem; color: #B9CBE0; }
#rdr .v2ev__h p b { font-family: var(--font-display); font-size: 1.15rem; color: #fff; }
#rdr .v2ev__l { display: grid; gap: 4px; }
#rdr .v2ev__r { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 10px; align-items: center; min-height: 52px; padding: 6px 8px 6px 6px; border-radius: 12px; color: inherit; text-decoration: none; }
#rdr .v2ev__r:hover { background: rgba(255, 255, 255, .06); }
#rdr .v2ev__r em { font-style: normal; color: #8FD9BE; opacity: 0; transition: opacity .15s; }
#rdr .v2ev__r:hover em { opacity: 1; }
#rdr .v2ev__d { display: grid; justify-items: center; padding: 4px 0; border-radius: 9px; background: rgba(94, 234, 212, .12); line-height: 1; }
#rdr .v2ev__d b { font-size: .56rem; letter-spacing: .12em; text-transform: uppercase; color: #8FD9BE; }
#rdr .v2ev__d i { margin-top: 2px; font-style: normal; font-size: 1.1rem; font-weight: 700; font-family: var(--font-display); color: #fff; }
#rdr .v2ev__b { min-width: 0; display: grid; gap: 2px; }
#rdr .v2ev__b b { font-size: .92rem; font-weight: 600; line-height: 1.25; color: #fff; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#rdr .v2ev__b small { font-size: .74rem; color: #B9CBE0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#rdr .v2ev__all { display: block; padding: 10px 12px; border-radius: 10px; background: rgba(255, 255, 255, .06); font-size: .84rem; font-weight: 600; color: #F8BE9A; text-decoration: none; }
#rdr .v2ev__all:hover { background: rgba(255, 255, 255, .1); }
#rdr .v2ev .mk-loading { padding: 40px 0; }
#rdr .band--xp { margin-top: 0; }
#rdr .v2h__h2 { margin: 0; font-size: clamp(1.7rem, 1.1rem + 2.6vw, 2.9rem); line-height: 1.05; letter-spacing: -.025em; color: #fff; }
@media (max-width: 640px) {
  #rdr .v2ev { padding: 12px; }
  #rdr .v2ev__r { min-height: 48px; }
  #rdr .v2ev__b small { white-space: normal; }
}
/* The crawler copy of a page is for crawlers. With scripts on it stays invisible (still in the page,
   still read by anything that reads HTML) until the viewer replaces it; a thin pulse holds the space.
   If the viewer never comes, html.js-late shows the copy after four seconds. */
html.js:not(.js-late) #main > .mk-ssr, html.js:not(.js-late) .mk-ssr-crumbs { visibility: hidden; }
html.js:not(.js-late) #main:has(> .mk-ssr) { position: relative; min-height: 70vh; }
html.js:not(.js-late) #main:has(> .mk-ssr) > .mk-ssr { position: absolute; inset: 0; overflow: hidden; }
html.js:not(.js-late) #main:has(> .mk-ssr)::before { content: ""; display: block; width: 120px; height: 4px; margin: 56px auto 0; border-radius: 999px; background: var(--r-accent, #0d9488); animation: tr-blink 1s infinite; }
/* The floating door to the calendar: bottom right on every page but the calendar and the Discord. */
.evfab { position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 40; display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 8px 18px 8px 14px; border: 2px solid #fff; border-radius: 999px; background: #F4A67A; color: #15332B; font: 700 .86rem/1.2 var(--font-display, inherit); text-decoration: none; box-shadow: 0 12px 30px -8px rgba(11, 37, 69, .55), 0 0 0 4px rgba(244, 166, 122, .25); transition: transform .15s, box-shadow .15s; }
.evfab .ic { flex: none; width: 18px; height: 18px; color: #15332B; }
.evfab span { white-space: nowrap; }
.evfab b { color: #15332B; }
.evfab:hover { transform: translateY(-2px); box-shadow: 0 16px 34px -8px rgba(11, 37, 69, .6), 0 0 0 6px rgba(244, 166, 122, .3); }
.evfab[hidden] { display: none; }
/* On a phone the tab bar already holds Events, so the floating door stands down. */
@media (max-width: 640px) { .evfab { display: none; } }

/* ════════════════════════════════════════════════════════════════════════
   The home page in five acts, and the project palette (Shane Tepper's mirror,
   2026-09-26). Peach marks Atlanta and nothing else inside the figures; forest
   green does the interactive work. The city map (.cm, .hsy) pins while its two
   views scroll past; the conversion chart (.gp) sits under it. Light-theme
   tokens at the end were darkened after a contrast audit of both themes.
   ════════════════════════════════════════════════════════════════════════ */
 .cm{margin:0; display:grid; gap:16px} /* Fixed, not absolute: clicking a label moves focus to its input, and the browser scrolls a focused element into view. Parked in the document these sit above the pinned map, so a click after scrolling threw the page back to the top. Fixed at the viewport origin they are always "in view", so focus moves without any scrolling. */ .cm__radio{position:fixed; top:0; left:0; opacity:0; pointer-events:none; width:0; height:0} .cm__seg{display:flex; flex-wrap:wrap; gap:8px} .cm__segb{font-family:var(--font-body,inherit); font-size:12.5px; font-weight:500; padding:7px 14px; border-radius:999px; border:1px solid rgba(255,255,255,.28); color:rgba(255,255,255,.82); cursor:pointer; transition:background .15s ease, border-color .15s ease, color .15s ease} .cm__segb:hover{border-color:rgba(255,255,255,.6)} .cm__radio:focus-visible ~ .cm__seq .cm__segb{outline:2px solid #4FB292; outline-offset:2px} .cm__svg{width:100%; height:auto; display:block; overflow:visible} .cm__land path{fill:rgba(255,255,255,.07); stroke:rgba(255,255,255,.2); stroke-width:.7; vector-effect:non-scaling-stroke} .cm__hit{fill:transparent} .cm__d{fill-opacity:.9; stroke:rgba(255,255,255,.34); stroke-width:1; transition:r .35s ease, fill .35s ease} .cm__c.is-atl .cm__d{stroke:var(--atl,#F4A67A); stroke-width:3} .cm__c:focus{outline:none} .cm__c:hover .cm__d, .cm__c:focus .cm__d{stroke:#fff; stroke-width:2} .cm__c.is-atl:hover .cm__d, .cm__c.is-atl:focus .cm__d{stroke:var(--atl,#F4A67A)} .cm__n{fill:rgba(255,255,255,.9); font-family:var(--font-body,inherit); font-size:16px; font-weight:500; dominant-baseline:middle} .cm__c.is-atl .cm__n{fill:var(--atl,#F4A67A); font-weight:600}                 @media (prefers-reduced-motion:reduce){ .cm__d{transition:none} } @media (max-width:820px){ .cm__n{font-size:13px} }               
 #rdr .gp{margin:26px 0 0; display:grid; gap:13px} #rdr .gp__k{display:flex; flex-wrap:wrap; gap:8px 24px; align-items:center; font-size:12.5px; color:rgba(255,255,255,.72)} #rdr .gp__ki{display:inline-flex; align-items:center; gap:8px} #rdr .gp__sw{width:12px; height:12px; border-radius:50%; display:inline-block; flex:none} #rdr .gp__sw--hi{border:1.7px solid rgba(255,255,255,.62)} #rdr .gp__sw--lo{background:#7FAE9D} #rdr .gp__sw--gap{width:26px; height:3px; border-radius:2px; background:rgba(255,255,255,.28)} #rdr .gp__rows{list-style:none; margin:0; padding:0; display:grid; gap:2px} #rdr .gp__r{display:grid; grid-template-columns:minmax(0,10.5rem) minmax(0,1fr) 4.6rem 2.8rem; align-items:center; gap:12px; padding:3px 6px; border-radius:6px} #rdr .gp__n{font-size:13.5px; color:rgba(255,255,255,.9); text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis} #rdr .gp__t{position:relative; height:18px; margin-right:9px; background:linear-gradient(to right, rgba(255,255,255,.11) 0 1px, transparent 1px) 0 0/33.333% 100% repeat-x; border-right:1px solid rgba(255,255,255,.11)} #rdr .gp__t i{position:absolute; top:50%; transform:translateY(-50%)} #rdr .gp__gap{height:3px; border-radius:2px; background:rgba(255,255,255,.28)} #rdr .gp__hi{width:11px; height:11px; margin-left:-5.5px; border-radius:50%; border:1.7px solid rgba(255,255,255,.62); box-sizing:border-box; box-shadow:0 0 0 2px #0F2C25} #rdr .gp__lo{width:11px; height:11px; margin-left:-5.5px; border-radius:50%; background:#7FAE9D} #rdr .gp__v{font-size:12px; color:rgba(255,255,255,.6); text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap} #rdr .gp__p{font-family:var(--font-display,inherit); font-size:13.5px; font-weight:700; color:#fff; text-align:right; font-variant-numeric:tabular-nums} #rdr .gp__r.is-atl{background:rgba(244,166,122,.10)} #rdr .gp__r.is-atl .gp__n, #rdr .gp__r.is-atl .gp__p{color:var(--atl,#F4A67A)} #rdr .gp__r.is-atl .gp__n{font-weight:600} #rdr .gp__r.is-atl .gp__gap{background:rgba(244,166,122,.6)} #rdr .gp__r.is-atl .gp__hi{border-color:var(--atl,#F4A67A)} #rdr .gp__r.is-atl .gp__lo{background:var(--atl,#F4A67A)} #rdr .gp__ax{display:grid; grid-template-columns:minmax(0,10.5rem) minmax(0,1fr) 4.6rem 2.8rem; gap:12px; margin-top:2px} #rdr .gp__axt{grid-column:2; position:relative; height:15px; margin-right:9px} #rdr .gp__axt i{position:absolute; transform:translateX(-50%); font-style:normal; font-size:11px; color:rgba(255,255,255,.62); font-variant-numeric:tabular-nums} #rdr .gp__cap{margin:0; font-size:12.5px; line-height:1.55; color:rgba(255,255,255,.6); max-width:32rem} @media (max-width:760px){ /* two lines per city: name and rate above, the full-width track below. At 390px this takes the plot from about 165px to about 330px, which is the difference between New York's two marks fusing into one pill and reading as two. */ #rdr .gp__r{grid-template-columns:minmax(0,1fr) auto; gap:3px 10px; padding:7px 4px 9px} #rdr .gp__n{order:1; grid-column:1; text-align:left; font-size:14px; font-weight:600} #rdr .gp__p{order:2; grid-column:2; font-size:14px} #rdr .gp__t{order:3; grid-column:1/-1; height:16px} #rdr .gp__v{display:none} #rdr .gp__ax{grid-template-columns:minmax(0,1fr)} #rdr .gp__axt{grid-column:1} #rdr .gp__rows{gap:0} #rdr .gp__r + .gp__r{border-top:1px solid rgba(255,255,255,.07)} } 
/* ---- hero map wrapper (the map component ships its own styles) ---- */
.v2h--map{grid-template-columns:minmax(0,1fr)!important}
.v2h__map{grid-column:1/-1; width:100%; margin-top:6px}
.yfind__p{max-width:68ch; font-size:13.5px; line-height:1.6; color:rgba(255,255,255,.66); margin:14px 0 0}
.yfind__p b{color:var(--atl,#F4A67A); font-weight:600}

#rdr .band .v2h__nar, .v2h__nar{max-width:62ch; font-size:clamp(.95rem,.9rem + .25vw,1.08rem); line-height:1.6; color:rgba(255,255,255,.88); margin:48px 0 0}
#rdr .yfind{display:grid; gap:12px; margin:44px 0 0; max-width:none;
  padding:26px 28px; border:1px solid #367763; border-radius:16px;
  background:#15423A}
#rdr .yfind__k{font-family:var(--font-body,inherit); font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:#8FD9BE}
#rdr .yfind__h{font-family:var(--font-display,inherit); font-size:clamp(1.25rem,1.1rem + .6vw,1.6rem);
  font-weight:700; letter-spacing:-.02em; color:#fff; margin:0}
#rdr .yfind .yfind__p{margin:0; max-width:74ch; color:rgba(255,255,255,.88)}
#rdr .yfind__n{margin:0; font-size:12.5px; color:rgba(255,255,255,.78)}
#rdr .yfind .v2h__find{width:100%; justify-content:flex-start; gap:10px; padding:16px 18px;
  border:1px solid var(--atl); border-radius:12px; background:rgba(244,166,122,.10);
  color:#fff; font-size:15px; font-weight:600; cursor:pointer}
#rdr .yfind .v2h__find:hover{background:rgba(244,166,122,.18)}
#rdr .yfind .v2h__find .ic{color:var(--atl)}
.yfind .yfind__p{margin:0}
.v2h__s{max-width:62ch; font-size:clamp(1rem,.95rem + .35vw,1.16rem); line-height:1.55; color:rgba(255,255,255,.82); margin:10px 0 2px}
.cm__ramp{display:flex; height:14px; border-radius:7px; overflow:hidden; border:1px solid rgba(255,255,255,.24)}
.cm__ramp i{flex:1}
.cm__rl{display:flex; justify-content:space-between; font-size:11px; color:rgba(255,255,255,.7)}
.cm__cap{font-size:11.5px; line-height:1.6; color:rgba(255,255,255,.5); max-width:none; margin-top:16px}

/* ================= project palette: peach, forest, off-white =================
   The site is a co-branded project with its own identity, so these override the
   inherited PursueATL tokens in both themes. Peach marks Atlanta and nothing
   else inside the map; forest green does the interactive work. */
html[data-brand="pursueatl"]{
  --atl:#F4A67A;               /* Atlanta, reserved */
  --atl-deep:#E0834D;
  --xp-gold:#F4A67A;           /* inherited highlight token, retinted */
  /* the site paints some panels with var(--surface, #fff) but never defines --surface,
     so they fall back to white on a dark ground. Define it for both themes. */
  --surface:#16453A;
}
/* light: off-white ground, forest ink */
html[data-brand="pursueatl"][data-theme="light"]{
  --bg:#F6F2EA; --bg-secondary:#EFE9DE; --bg-card:#FFFDF9; --bg-card-hover:#F3EDE3;
  --bg-rgb:246,242,234; --panel-rgb:255,253,249;
  --text:#15332B; --text-secondary:#2C5648; --text-muted:#4C6E62; --text-faint:#6B8A7E;
  --accent:#2E7D64; --accent-hover:#22624E; --accent-rgb:46,125,100;
  --accent-dim:rgba(46,125,100,.10); --accent-fill:#14342B; --accent-ink:#F6F2EA;
  --btn-fill:#14342B; --btn-ink:#F6F2EA;
  --border:#E0D8CB; --border-light:#D2C8B8; --chart-grid:#E0D8CB;
  --nav-bg:#FFFDF9; --nav-text:#15332B; --ink-rgb:21,51,43; --surface:#FFFDF9;
}
/* dark: forest ground, off-white type */
html[data-brand="pursueatl"]:not([data-theme="light"]){
  /* three clearly separated steps: ground, panel, raised. Ten points of luminance
     between each, so a card reads as sitting on top of the page rather than in it. */
  --bg:#0B2620; --bg-secondary:#123A31; --bg-card:#15423A; --bg-card-hover:#1F5A4C;
  --bg-rgb:11,38,32; --panel-rgb:21,66,58;
  --text:#F3EFE7; --text-secondary:#D4E5DB; --text-muted:#AFC8BC; --text-faint:#8EAC9F;
  --accent:#4FB292; --accent-hover:#6FCBAC; --accent-rgb:79,178,146;
  --accent-dim:rgba(79,178,146,.14); --accent-fill:#4FB292; --accent-ink:#0B231D;
  --btn-fill:#4FB292; --btn-ink:#0B231D;
  --border:#2A6455; --border-light:#367763; --chart-grid:#2A6455;
  --nav-bg:#0A2C24; --nav-text:#F3EFE7; --ink-rgb:243,239,231; --surface:#15423A;
}
/* the hero band is dark in both themes: forest, not navy.
   The site scopes these under #rdr, so the overrides have to match that weight. */
#rdr .band--hero{
  background:radial-gradient(1100px 480px at 85% -10%, #20705A 0%, rgba(32,112,90,0) 62%), #0A241E;
}
#rdr .band{ color:#D8E7DF }
#rdr .band .xp-k{ color:#8FD9BE }
#rdr .band b{ color:#FFFFFF }
#rdr .yfind__p b, .yfind__p b{ color:var(--atl) }
/* the primary call to action carried a hardcoded gold */
#rdr .btn--gold, .btn--gold{ background:var(--atl); border-color:var(--atl); color:#0B231D }
#rdr .btn--gold:hover, .btn--gold:hover{ background:var(--atl-deep); border-color:var(--atl-deep) }
/* the cycle ring in the hero kicker */
#rdr .szn__f{ stroke:var(--atl) }

/* the four-engine widget carried its own navy and gold */
#rdr .ask{ background:#123A31; border-color:#2F6B59 }
#rdr .ask__q::before{ background:var(--accent) }
#rdr .ask__h{ color:#9FC4B4; border-bottom-color:#2A5D4E }
#rdr .ask__r{ color:#CDE0D6 }
#rdr .ask__r span:first-child{ color:#7FA695 }
#rdr .ask__r.atl{ background:var(--atl); color:#0B231D }
#rdr .ask__r.miss{ border-color:var(--atl); color:var(--atl) }
#rdr .ask__r.miss span:first-child{ color:var(--atl) }
#rdr .ask__f{ border-top-color:#2A5D4E }
#rdr .ask__f b{ color:var(--atl) }
#rdr .ask__sw{ color:#9FC4B4 }
#rdr .ask .tg{ border-color:#356F5D; color:#DCEAE3 }
#rdr .ask .tg:hover{ border-color:var(--atl); color:#fff }

/* publication rings carried no visible name */
#rdr .mp-t--pub{fill:rgba(243,239,231,.7); font-family:var(--font-body,inherit); font-size:9.5px;
  font-weight:500; text-anchor:middle; letter-spacing:.01em}
/* the thesis line, given the weight the idea deserves */

/* the setup line is the question a person asks an engine, so it takes the site's own
   question treatment: a marker dot, near-white medium text, a step above the subhead */
#rdr .band .v2h__setup{margin:0 0 18px; max-width:48ch;
  font-weight:500; font-size:clamp(1.15rem,1.05rem + .45vw,1.34rem); line-height:1.45;
  color:rgba(243,239,231,.8)}
#rdr .band .v2h__setup b{color:#FFFFFF; font-weight:600}
/* detail steps down as the question steps up */
#rdr .band .v2h__s{font-size:clamp(.96rem,.92rem + .2vw,1.04rem); color:rgba(243,239,231,.76)}

/* per-page credit, in the convention of a source line rather than a sponsor slot */


/* the four-engine widget: same five slots per engine, Atlanta pinned, full lists on request */
.ask__chk{position:absolute; opacity:0; pointer-events:none; width:0; height:0}
#rdr .ask__more{display:none}
#rdr .ask__chk:checked ~ .ask .ask__more{display:block}   /* must outrank #rdr .ask__more */
#rdr .ask__gap{color:rgba(243,239,231,.35); font-size:.8rem; line-height:1; letter-spacing:.2em;
  padding:2px 5px 4px}
#rdr .ask__chk:checked ~ .ask .ask__gap{display:none}
#rdr .ask__expand{cursor:pointer}
/* footer type inherited a color meant for off-white grounds */
#rdr .ask__f{color:#CDE0D6}
#rdr .ask__sw{color:#9FC4B4}

#rdr .ask__note{max-width:70ch; margin-top:4px}

/* the hero carries four elements now, so the rhythm can tighten */
#rdr .v2h__t{gap:12px}
#rdr .band .v2h__setup{margin-bottom:6px}
#rdr .v2h__map{margin-top:0}
#rdr .v2h--map{row-gap:28px}
#rdr .band--hero{padding-block:clamp(30px,5vw,68px)}

/* the headline now closes the build, so it needs air above it and none below */
#rdr .band h1{margin-top:10px}

/* what AI reads: the mechanism, with the numbers under it */
#rdr .xreads{display:grid; gap:9px; margin:4px 0 22px; max-width:760px}
#rdr .xreads__r{display:grid; grid-template-columns:minmax(0,15rem) minmax(0,1fr) 3.4rem; gap:14px;
  align-items:center; font-size:.9rem; color:var(--text-secondary)}
#rdr .xreads__t{height:10px; border-radius:5px; background:var(--bg-secondary); overflow:hidden}
#rdr .xreads__t i{display:block; height:100%; border-radius:3px; min-width:4px; background:var(--accent)}
#rdr .xreads__v{text-align:right; font-variant-numeric:tabular-nums; color:var(--text); font-weight:600}
#rdr .xreads__c{grid-column:1/-1; margin:2px 0 0; font-size:12px; color:var(--text-muted)}
@media (max-width:700px){ #rdr .xreads__r{grid-template-columns:minmax(0,1fr) 3rem; }
  #rdr .xreads__t{grid-column:1/-1; order:3} }

/* the credit line carries the byline and the press address: it has to be readable.
   it was #6B8A7E on cream, 3.4:1, under the 4.5:1 minimum. Both themes, since a
   value that only works on cream fails on the dark ground. */
html[data-theme="light"] #rdr .xp-fine{color:#3F6154}
html[data-theme="light"] #rdr .xp-fine a[href^="mailto:"]{color:#1F4A3A}
html:not([data-theme="light"]) #rdr .xp-fine{color:rgba(255,255,255,.75)}
html:not([data-theme="light"]) #rdr .xp-fine a[href^="mailto:"]{color:#F4A67A}
#rdr .xp-fine a[href^="mailto:"]{text-decoration:underline; text-underline-offset:3px}

/* the terms line under the email ask */
#rdr .xp-end__n{flex-basis:100%; margin:10px 0 0; font-size:12.5px; line-height:1.5;
  color:var(--text-muted)}

/* Typography: no single-word last lines, no lopsided headings. text-wrap:pretty asks the
   browser to avoid orphans at any width, which hand-tuned non-breaking spaces cannot do
   because the wrap point moves with the viewport. */
#rdr p, #rdr li, #rdr figcaption, #rdr dd, #rdr blockquote, #rdr .xp-p,
#rdr .v2h__nar, #rdr .v2h__setup, #rdr .v2h__s, #rdr .yfind__p,
#rdr .xreads__c, #rdr .gp__cap, #rdr .xp-fine, #rdr .xp-end span{
  text-wrap:pretty}
#rdr h1, #rdr h2, #rdr h3, #rdr h4, #rdr .xp-h2, #rdr .v2h__h{text-wrap:balance}

/* Contrast: measured failures against their real painted grounds, not eyeballed.
   The Discord band's indigo is a fixed brand color, so the text moves, not the ground. */
#rdr .band--dc .k{color:#fff}
#rdr .band--dc p{color:#fff}
/* the active nav pill: the site's own selector is more specific, so match its shape.
   Light only: in dark the pill's ink token is dark and the site's own pair passes. */
html[data-theme="light"] #rdr .rdr__rail a.xn__a.is-on{background:#215F4B}
/* only links on the cream ground, and only in the theme that has a cream ground */
html[data-theme="light"] #rdr .xp-p a,
html[data-theme="light"] #rdr .xp-more a{color:#256A54}
html:not([data-theme="light"]) #rdr .xp-p a,
html:not([data-theme="light"]) #rdr .xp-more a{color:#7FD3B4}

/* pre-existing: the card link accent sits at 4.33:1 on the dark card in dark theme */
html:not([data-theme="light"]) #rdr .bq__all,
html:not([data-theme="light"]) #rdr .ypc__c em{color:#6FC7A8}

/* ---- pinned map, scroll-driven view ------------------------------------ */
/* Only the stage pins: toggles, map, caption. The legend and figure caption scroll
   past below it. The sequence is the sticky element's containing block, so the map
   unpins before the legend arrives instead of being scrolled over. */
#rdr .hsy{--sy-top:149px; position:relative}
#rdr .hsy .cm{display:block}

/* The wrapper is 1200px at every viewport, so a 2560px display got no more map than a
   laptop. While pinned the map breaks out to the window, capped so it stays sane. */
#rdr .hsy .cm__seq{position:relative; width:100vw; margin-inline:calc(50% - 50vw)}
#rdr .hsy .cm__stage{position:sticky; top:var(--sy-top); z-index:0;
  max-width:1760px; margin-inline:auto; padding:4px 24px 0;
  display:grid; grid-template-columns:auto minmax(0,1fr);
  grid-template-areas:"map map" "seg cap"; gap:12px 28px; align-content:start}
#rdr .hsy .cm__svg{grid-area:map; max-height:calc(100vh - var(--sy-top) - 112px);
  margin-inline:auto}
#rdr .hsy .cm__seg{grid-area:seg; align-self:start}

/* The toggles and the running caption share one row under the map instead of taking a
   row each. A column beside the map would cost more width than it saves height on a
   1.79:1 graphic, and overlaying the caption collided with Austin on smaller windows. */
#rdr .hsy__caps{grid-area:cap; display:grid; min-height:0}
#rdr .hsy__c{grid-area:1/1; margin:0; align-self:start;
  font-size:clamp(.98rem, .92rem + .28vw, 1.08rem); line-height:1.5;
  color:rgba(255,255,255,.93); opacity:0; transform:translateY(10px);
  transition:opacity .5s ease, transform .5s ease; pointer-events:none}
#rdr .hsy__c b{color:var(--atl,#F4A67A); font-weight:700}
#rdr .hsy[data-step="0"] .hsy__c[data-step="0"],
#rdr .hsy[data-step="1"] .hsy__c[data-step="1"],
#rdr .hsy[data-step="2"] .hsy__c[data-step="2"]{opacity:1; transform:none;
  pointer-events:auto}

/* Slower than a click wants: the circles are making an argument, not responding to a
   press. A manual choice puts the quick timing back. */
#rdr .hsy .cm__d{transition:r .75s cubic-bezier(.33,0,.2,1), fill .75s cubic-bezier(.33,0,.2,1)}
#rdr .hsy.is-manual .cm__d{transition:r .3s ease, fill .3s ease}
#rdr .hsy.is-manual .hsy__c{transition:opacity .2s ease, transform .2s ease}

#rdr .hsy__track{position:relative; margin-top:-50vh; padding-bottom:24vh;
  z-index:-1; pointer-events:none}
#rdr .hsy__s{height:96vh}

/* Pinning is a desktop enhancement. On a phone the map is width-constrained to about
   a fifth of the viewport height, so pinning spends scroll without making it legible;
   below 820px the map and all captions simply stack. */
@media (prefers-reduced-motion:reduce), (max-height:620px), (max-width:820px){
  #rdr .hsy .cm__stage{position:static; padding-inline:0; max-width:none}
  #rdr .hsy .cm__seq{position:static; width:auto; margin-inline:0}
  #rdr .hsy .cm__svg{max-height:none}
  #rdr .hsy .cm__stage{grid-template-columns:minmax(0,1fr); grid-template-areas:"map" "seg" "cap"}
  #rdr .hsy__caps{display:grid; gap:10px; margin-top:4px}
  #rdr .hsy__c{grid-area:auto; opacity:1; transform:none; transition:none;
    pointer-events:auto}
  #rdr .hsy .cm__d{transition:r .3s ease, fill .3s ease}
  #rdr .hsy__track{display:none}
}

/* ---- the finding rows: a real disclosure control ----------------------- */
#rdr .bq__r > summary{min-height:52px; align-items:center; cursor:pointer}
#rdr .bq__r > summary:focus-visible{outline:2px solid var(--atl,#F4A67A); outline-offset:2px}

/* ---- Atlanta lights up in every figure at once ------------------------- */
#rdr.is-atl-hot .gp__r.is-atl{background:rgba(244,166,122,.2)}
#rdr.is-atl-hot .cm__c.is-atl .cm__d{stroke-width:5}
#rdr.is-atl-hot .bq__r summary .bq__a{filter:brightness(1.15)}

/* Two tokens carried every remaining contrast failure on the other 29 pages:
   --accent #2E7D64 as link text on cream (4.44:1) and --text-muted #4C6E62 (3.38:1).
   Darkened for the light theme only; the dark theme already passed. */
html[data-theme="light"] #rdr{--accent:#256A54; --r-accent:#256A54;
  --text-muted:#3F6154; --r-muted:#3F6154; --text-faint:#456A5C}

/* The three views of the city map: a checked radio sets every circle's radius and fill, and lights its button. */
#cmv-ranked:checked ~ .cm__seq .cm__svg .cm__d{r:var(--r-ranked); fill:var(--f-ranked)}
#cmv-ranked:checked ~ .cm__seq .cm__seg label[for="cmv-ranked"]{background:#4FB292; border-color:#4FB292; color:#0B231D}
#cmv-top5:checked ~ .cm__seq .cm__svg .cm__d{r:var(--r-top5); fill:var(--f-top5)}
#cmv-top5:checked ~ .cm__seq .cm__seg label[for="cmv-top5"]{background:#4FB292; border-color:#4FB292; color:#0B231D}
#cmv-rec:checked ~ .cm__seq .cm__svg .cm__d{r:var(--r-rec); fill:var(--f-rec)}
#cmv-rec:checked ~ .cm__seq .cm__seg label[for="cmv-rec"]{background:#4FB292; border-color:#4FB292; color:#0B231D}
#rdr .band .cm__land{fill:rgba(255,255,255,.07); stroke:rgba(255,255,255,.2); stroke-width:.7; vector-effect:non-scaling-stroke}
/* Atlanta's case, set as a pull line between the evidence and the mechanism. */
#rdr .xp-case p{margin:0; max-width:40rem; font-family:var(--font-display,inherit); font-weight:500;
  font-size:clamp(1.2rem,1.05rem + .7vw,1.6rem); line-height:1.4; letter-spacing:-.01em; color:var(--text); text-wrap:pretty}
#rdr .ask__note{margin-top:14px}
#rdr .band .v2h__s{max-width:44rem}

/* ════════════════════════════════════════════════════════════════════════
   Kolin's pass (2026-09-26): the two doors in the nav, an opening that moves,
   and the home page as five chapters. Proposed to Shane as a version.
   ════════════════════════════════════════════════════════════════════════ */
/* The nav: no Home (the mark is home); Events calendar and the Discord as the two doors. */
html[data-brand="pursueatl"] .mk-areas { gap: 8px; }
html[data-brand="pursueatl"] .mk-areas a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; font-weight: 600; }
html[data-brand="pursueatl"] .mk-areas a .ic { width: 18px; height: 18px; flex: none; }
html[data-brand="pursueatl"] .mk-areas a.mk-areas__ev { background: #F4A67A; color: #15332B; }
html[data-brand="pursueatl"] .mk-areas a.mk-areas__ev:hover { background: #F7BD9A; }
html[data-brand="pursueatl"] .mk-areas a.mk-areas__ev.is-on { box-shadow: 0 0 0 3px rgba(244, 166, 122, .35); }
html[data-brand="pursueatl"] .mk-areas a.mk-areas__dc { background: #5865F2; color: #fff; box-shadow: 0 6px 16px -8px rgba(88, 101, 242, .8); }
html[data-brand="pursueatl"] .mk-areas__n { min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; background: #15332B; color: #F6F2EA; font-size: .72rem; display: inline-grid; place-items: center; }
html[data-brand="pursueatl"] .mk-areas__short { display: none; }
@media (max-width: 760px) {
  html[data-brand="pursueatl"] .mk-areas a { padding: 9px 12px; gap: 6px; background: var(--bg-secondary); }
  html[data-brand="pursueatl"] .mk-areas__full { display: none; }
  html[data-brand="pursueatl"] .mk-areas__short { display: inline; }
}

/* The opening: Shane's words and map as he built them. His lines arrive in turn, the headline
   word by word; "a list of cities" underlines itself and the turn in the second line lights up
   as it lands. A cue under the headline points into the map, and steps aside once scrolled. */
#rdr .v2h__t--live .v2h__setup { animation: rlUp .8s .1s both; }
#rdr .v2h__t--live .v2h__setup b { background: linear-gradient(#F4A67A, #F4A67A) 0 100% / 0 3px no-repeat; padding-bottom: 2px; animation: rlLine .9s .9s forwards; }
#rdr .v2h__t--live .v2h__s { animation: rlUp .8s .5s both; }
#rdr .v2h__hi { font-style: normal; transition: color .6s; animation: rlHi .8s calc(1.5s + var(--h) * .5s) forwards; }
#rdr .v2h__t--live h1 { overflow: visible; }
#rdr .v2h__w { display: inline-block; animation: rlUp .7s calc(1.1s + var(--i) * .09s) both; }
/* The hero's call to action: a tour of where the city stands, and how far it can climb. */
#rdr .v2h__tour { display: inline-flex; align-items: center; gap: 14px; margin-top: 22px; width: max-content; max-width: 100%; padding: 12px 22px 12px 14px; border: 0; border-radius: 999px;
  background: #F4A67A; color: #15332B; cursor: pointer; text-align: left; box-shadow: 0 14px 30px -14px rgba(244, 166, 122, .8); animation: rlUp .8s 2.2s both; transition: transform .2s, box-shadow .2s, background .2s; }
#rdr .v2h__tour:hover { background: #F7BD9A; transform: translateY(-2px); box-shadow: 0 18px 34px -14px rgba(244, 166, 122, .9); }
#rdr .v2h__tour > i { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #15332B; color: #F4A67A; font-style: normal; font-size: .95rem; padding-left: 3px; box-shadow: 0 0 0 0 rgba(21, 51, 43, .5); animation: rlRing 2.4s 3s infinite; }
#rdr .v2h__tour b { display: block; font: 700 1.08rem/1.2 var(--font-display, inherit); color: #15332B; }
#rdr .v2h__tour small { display: block; font-size: .8rem; color: #2C5648; margin-top: 2px; }
@keyframes rlRing { 70% { box-shadow: 0 0 0 12px rgba(21, 51, 43, 0); } 100% { box-shadow: 0 0 0 0 rgba(21, 51, 43, 0); } }
/* The tour's callout beside the city, and its bar. */
.tour-call { position: fixed; z-index: 120; width: min(320px, calc(100vw - 24px)); display: grid; gap: 6px; padding: 16px 18px; border-radius: 16px; background: #FFFDF9; color: #15332B;
  box-shadow: 0 24px 50px -20px rgba(0, 0, 0, .6); border: 2px solid #F4A67A; font-size: .95rem; line-height: 1.45; opacity: 0; transform: translateY(8px) scale(.98); transition: opacity .35s, transform .35s; pointer-events: auto; }
.tour-call.is-in { opacity: 1; transform: none; }
.tour-call__big { font: 700 2.6rem/1 var(--font-display, inherit); color: #E0834D; letter-spacing: -.03em; }
.tour-call__go { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.tour-call__go .btn { font-size: .85rem; padding: 8px 14px; }
.tour-bar { position: fixed; z-index: 121; left: 50%; top: 134px; transform: translateX(-50%); display: flex; align-items: center; gap: 12px; padding: 8px 10px 8px 16px; border-radius: 999px;
  background: #15332B; color: #F6F2EA; box-shadow: 0 12px 30px -12px rgba(0, 0, 0, .6); font-size: .85rem; }
.tour-bar__k { font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: .72rem; color: #8FD9BE; }
/* One segment per beat: done ones full, the current one filling over its beat's time. */
.tour-bar__d { display: flex; gap: 5px; align-items: center; }
.tour-bar__d i { position: relative; width: 22px; height: 6px; border-radius: 3px; background: rgba(246, 242, 234, .25); overflow: hidden; transition: width .3s ease; }
.tour-bar__d i.done { background: #8FD9BE; }
.tour-bar__d i.on { width: 40px; }
.tour-bar__d i b { position: absolute; inset: 0 auto 0 0; width: 100%; background: #F4A67A; border-radius: 3px; transform-origin: left center; animation: tourFill linear forwards; }
.tour-bar.is-paused .tour-bar__d i b { animation-play-state: paused; }
@keyframes tourFill { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) { .tour-bar__d i b { animation: none; } }
.tour-bar button { border: 1px solid rgba(246, 242, 234, .3); background: transparent; color: #F6F2EA; border-radius: 999px; padding: 6px 12px; font: inherit; font-size: .8rem; cursor: pointer; }
.tour-bar button:hover { border-color: #F6F2EA; }
/* Atlanta, rung while the tour is on it. */
#rdr.is-touring .cm__c.is-atl .cm__d { animation: rlAtl 1.6s ease-in-out infinite; }
@keyframes rlAtl { 50% { stroke-width: 7; stroke: #F7BD9A; } }
#rdr.is-touring .gp__r.is-atl { box-shadow: inset 0 0 0 2px #F4A67A; }
@media (prefers-reduced-motion: reduce) { #rdr.is-touring .cm__c.is-atl .cm__d, #rdr .v2h__tour > i { animation: none; } .tour-call { transition: none; } }
@keyframes rlUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes rlLine { to { background-size: 100% 3px; } }
@keyframes rlHi { to { color: #F4A67A; } }
@keyframes rlBob { 50% { transform: translateY(5px); } }

/* Chapters: a number, what the chapter is, and a line that pulls the reader on. */
#rdr .xch { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px clamp(18px, 3vw, 36px); align-items: center; max-width: 1100px; margin: clamp(48px, 8vh, 96px) auto 0; padding: 0 0 8px; border-bottom: 1px solid var(--border); }
#rdr .xch__n { font-family: var(--font-display, inherit); font-weight: 700; font-size: clamp(3.4rem, 2rem + 5vw, 6.5rem); line-height: .9; letter-spacing: -.04em; color: transparent; -webkit-text-stroke: 1.5px #F4A67A; }
#rdr .xch__k { display: block; font: 600 .74rem/1.2 var(--font-body, inherit); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; }
#rdr .xch__q { margin: 0; font-family: var(--font-display, inherit); font-weight: 500; font-size: clamp(1.25rem, 1rem + 1vw, 1.8rem); line-height: 1.3; letter-spacing: -.01em; color: var(--text); max-width: 38ch; text-wrap: balance; }

/* The rail: where the reader is in the story, and a way to jump. Wide screens only. */
#rdr .xrail { position: fixed; right: 18px; top: 50%; transform: translateY(-50%); z-index: 60; display: none; flex-direction: column; gap: 14px; }
@media (min-width: 1180px) { #rdr .xrail { display: flex; } }
#rdr .xrail a { display: flex; align-items: center; justify-content: flex-end; gap: 10px; text-decoration: none; flex-direction: row-reverse; }
#rdr .xrail i { width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--text-muted); transition: transform .2s, background .2s, border-color .2s; }
#rdr .xrail span { font-size: .76rem; color: var(--text-muted); opacity: 0; transform: translateX(6px); transition: opacity .2s, transform .2s; white-space: nowrap; background: var(--bg-card); padding: 4px 8px; border-radius: 6px; }
#rdr .xrail a:hover span, #rdr .xrail a:focus-visible span { opacity: 1; transform: none; }
#rdr .xrail a.is-on i { background: #F4A67A; border-color: #F4A67A; transform: scale(1.3); }
#rdr .xrail.is-dark i { border-color: rgba(243, 239, 231, .6); }
#rdr .xrail.is-dark span { background: #123A31; color: #F3EFE7; }

/* Rising into place as each part arrives; figures fill as they are read. */
#rdr .rv { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .2, 1); }
#rdr .rv.is-in { opacity: 1; transform: none; }
#rdr .rv .bq__bar i, #rdr .rv .xreads__t i, #rdr .rv.gp .gp__gap { transform: scaleX(0); transform-origin: left; transition: transform .9s cubic-bezier(.2, .7, .2, 1); }
#rdr .rv.is-in .bq__bar i, #rdr .rv.is-in .xreads__t i, #rdr .rv.gp.is-in .gp__gap { transform: none; }
#rdr .rv.is-in .bq__r:nth-child(n) .bq__bar i { transition-delay: .15s; }
#rdr .rv.gp .gp__lo { transition: left 1s cubic-bezier(.2, .7, .2, 1); }
@media (prefers-reduced-motion: reduce) {
  #rdr .v2h__t--live *, #rdr .v2h__tour { animation: none !important; opacity: 1; }
  #rdr .v2h__t--live .v2h__setup b { background-size: 100% 3px; }
  #rdr .v2h__hi { color: #F4A67A; }
}

/* The pinned map says it is moving: a line that fills through the three views, and which one. */
#rdr .hsy__prog { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; margin-top: 2px; padding-right: 230px; }   /* clear of the floating events button */
#rdr .hsy__prog span { order: -1; color: #F4A67A; font-weight: 600; }
#rdr .hsy__prog i { position: relative; flex: 1; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .12); overflow: hidden; }
#rdr .hsy__prog i::after { content: ""; position: absolute; inset: 0; transform-origin: left; transform: scaleX(var(--p, 0)); background: #F4A67A; }
#rdr .hsy__prog span { flex: none; font-size: .8rem; color: #CDE0D6; font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce), (max-height: 620px), (max-width: 820px) { #rdr .hsy__prog { display: none; } }

/* The tabs as the home page's table of contents: each part lands clear of the sticky
   header, and the lit tab moves smoothly as the reader scrolls. */
#rdr [id^="act-"], #rdr #home-events { scroll-margin-top: 140px; }
#rdr .rdr__rail a.xn__a { transition: background-color .25s ease, color .25s ease; }
@media (prefers-reduced-motion: reduce) { #rdr .rdr__rail a.xn__a { transition: none; } }

/* Tab menus: the caret beside a tab opens the pages inside it (hover or focus on a desk,
   tap anywhere). The chapter links and the phone sheet carry the same pages. */
#rdr .xn__i { position: relative; display: inline-flex; align-items: center; }
#rdr .xn__c { display: inline-grid; place-items: center; width: 22px; height: 28px; margin-left: -8px; padding: 0; border: 0; background: none; color: var(--r-muted); border-radius: 6px; cursor: pointer; opacity: .7; }
#rdr .xn__c:hover, #rdr .xn__i.is-open .xn__c { opacity: 1; color: var(--text); }
#rdr .xn__c .ic { width: 12px; height: 12px; transform: rotate(90deg); transition: transform .2s; }
#rdr .xn__i.is-open .xn__c .ic { transform: rotate(270deg); }
#rdr .xn__m { position: absolute; top: calc(100% + 6px); left: 0; z-index: 30; display: none; min-width: 300px; max-width: 380px; padding: 6px; background: var(--r-card, #fff); border: 1px solid var(--r-border2); border-radius: 12px; box-shadow: 0 16px 36px -16px rgba(0,0,0,.35); }
#rdr .xn__m::before { content: ""; position: absolute; inset: -8px 0 auto 0; height: 8px; }
#rdr .xn__i.is-open .xn__m { display: grid; }
#rdr .xn__m a { display: block; padding: 7px 10px; border-radius: 8px; font-size: .88rem; font-weight: 500; color: var(--text); text-decoration: none; line-height: 1.35; }
#rdr .xn__m a:first-child { font-weight: 650; }
#rdr .xn__m a:hover, #rdr .xn__m a:focus-visible { background: var(--r-card2); color: var(--text); }
#rdr .xch__go { display: inline-block; margin-top: 12px; font-weight: 650; color: var(--r-accent, #215F4B); text-decoration: none; border-bottom: 2px solid currentColor; }
#rdr .xch__go:hover { opacity: .8; }
#rdr .xp-p a, #rdr .xp-more a { color: var(--r-accent, #215F4B); font-weight: 600; text-underline-offset: 3px; }
.mk-sheet__sub { padding-left: 1.2rem !important; font-size: .88rem; opacity: .85; }