
@font-face { font-family: "Bricolage"; font-weight: 200 800; font-display: swap; src: url(/assets/fonts/bricolage.fb054d94.woff2) format("woff2"); }
@font-face { font-family: "Public Sans"; font-weight: 100 900; font-display: swap; src: url(/assets/fonts/public-sans.5ed4d31c.woff2) format("woff2"); }
@font-face { font-family: "Plex Mono"; font-weight: 400; font-display: swap; src: url(/assets/fonts/plex-mono.08949f72.woff2) format("woff2"); }
:root {
  color-scheme: light dark;
  --bg: #f8f6f1;
  --bg-2: #efece4;
  --bg-veil: rgba(248, 246, 241, 0.86);
  --ink: #15171c;
  --body: #383b42;
  --muted: #666a72;
  --rule: #d9d5cb;
  --rule-2: #c4bfb3;
  --brand: #e89a00;
  --brand-ink: #15171c;
  --brand-text: #9a6400;   
  --tile: #0d1826;
  --dark: #10151d;
  --dark-ink: #f1efe9;
  --dark-muted: #a3a8b2;
  --shot-bg: #eceef1;
  --display: "Bricolage", "Helvetica Neue", Arial, sans-serif;
  --sans: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono: "Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --wrap: 1160px;
  --gutter: 24px;
  --s-1: 0.5rem; --s-2: 0.75rem; --s-3: 1rem; --s-4: 1.5rem; --s-5: 2rem; --s-6: 3rem; --s-7: 4rem;
  --sec: clamp(3.25rem, 7vw, 5.5rem);   
  --sec-s: clamp(2.25rem, 5vw, 3.5rem); 
  --bar: 48px;
  --c-hockey: #034b7a; --c-hockey-on-dark: #74b8f3; --c-hockey-band: #0a1a27;
  --c-soccer: #034f35; --c-soccer-on-dark: #6ac79c; --c-soccer-band: #071d13;
  --c-xc: #a84d27; --c-xc-on-dark: #ec9979; --c-xc-band: #26130b;
  --c-plunge: #036b70; --c-plunge-on-dark: #46c6cd; --c-plunge-band: #011d1f;
}
:root[data-scheme="light"] { color-scheme: light; }
:root[data-scheme="dark"] { color-scheme: dark; }
@media (prefers-color-scheme: dark) {
  :root:where(:not([data-scheme="light"])) {
    --bg: #15161a; --bg-2: #1d1e23; --bg-veil: rgba(21, 22, 26, 0.86); --ink: #f1efe9; --body: #c9c7c0; --muted: #969aa3;
    --rule: #2d2f36; --rule-2: #3d4049; --brand: #ffb21a; --brand-text: #ffb21a; --dark: #0a0d12; --shot-bg: #1a1c22;
  }
}
:root:where([data-scheme="dark"]) {
    --bg: #15161a; --bg-2: #1d1e23; --bg-veil: rgba(21, 22, 26, 0.86); --ink: #f1efe9; --body: #c9c7c0; --muted: #969aa3;
    --rule: #2d2f36; --rule-2: #3d4049; --brand: #ffb21a; --brand-text: #ffb21a; --dark: #0a0d12; --shot-bg: #1a1c22;
  }
.sport-hockey { --sport: var(--c-hockey); --sport-band: var(--c-hockey-band); }
.sport-soccer { --sport: var(--c-soccer); --sport-band: var(--c-soccer-band); }
.sport-xc { --sport: var(--c-xc); --sport-band: var(--c-xc-band); }
.sport-plunge { --sport: var(--c-plunge); --sport-band: var(--c-plunge-band); }
@media (prefers-color-scheme: dark) {
  :where(:root:not([data-scheme="light"])) .sport-hockey { --sport: var(--c-hockey-on-dark); }
  :where(:root:not([data-scheme="light"])) .sport-soccer { --sport: var(--c-soccer-on-dark); }
  :where(:root:not([data-scheme="light"])) .sport-xc { --sport: var(--c-xc-on-dark); }
  :where(:root:not([data-scheme="light"])) .sport-plunge { --sport: var(--c-plunge-on-dark); }
}
:where(:root[data-scheme="dark"]) .sport-hockey { --sport: var(--c-hockey-on-dark); }
:where(:root[data-scheme="dark"]) .sport-soccer { --sport: var(--c-soccer-on-dark); }
:where(:root[data-scheme="dark"]) .sport-xc { --sport: var(--c-xc-on-dark); }
:where(:root[data-scheme="dark"]) .sport-plunge { --sport: var(--c-plunge-on-dark); }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--bar) + 16px); }
main:focus, .beta:focus, .ledger:focus { outline: none; }
body { margin: 0; background: var(--bg); color: var(--body); font: 400 1.0625rem/1.6 var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--ink); text-decoration-thickness: 1px; text-underline-offset: 0.2em; transition: color 120ms ease, text-decoration-thickness 120ms ease; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; border-radius: 2px; }
h1, h2, h3 { color: var(--ink); font-family: var(--display); margin: 0; text-wrap: balance; }
h1 { font-size: clamp(2.5rem, 6.8vw, 5.5rem); line-height: 0.96; font-weight: 800; letter-spacing: -0.025em; font-variation-settings: "opsz" 96; }
h2 { font-size: clamp(2rem, 4.6vw, 3.75rem); line-height: 0.98; font-weight: 800; letter-spacing: -0.03em; font-variation-settings: "opsz" 96; }
h3 { font-size: 1.4rem; line-height: 1.15; font-weight: 700; letter-spacing: -0.015em; font-variation-settings: "opsz" 24; }
p { margin: 0 0 1em; text-wrap: pretty; }
li { text-wrap: pretty; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; background: var(--ink); color: var(--bg); padding: 8px 12px; z-index: 20; }
.skip:focus { top: 10px; }
.k { font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin: 0 0 var(--s-2); }
.fine { font-size: 0.9rem; color: var(--muted); }
.when-dark { display: none; }
@media (prefers-color-scheme: dark) {
  :where(:root:not([data-scheme="light"])) .when-light { display: none; }
  :where(:root:not([data-scheme="light"])) .when-dark { display: inline; }
}
:where(:root[data-scheme="dark"]) .when-light { display: none; }
:where(:root[data-scheme="dark"]) .when-dark { display: inline; }
.lede { font-size: clamp(1.15rem, 1.6vw, 1.3rem); line-height: 1.45; color: var(--body); max-width: 34rem; margin: var(--s-5) 0 0; }
.mark { width: 1em; height: 1em; }
img.tile, img.mini { border-radius: 22%; display: block; flex: none; }
.tile { width: 56px; height: 56px; }
.mini { width: 18px; height: 18px; }
.family { position: sticky; top: 0; z-index: 10; border-bottom: 1px solid var(--rule); font-size: 0.9rem; background: var(--bg-veil); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.family .wrap { display: flex; gap: 0 24px; align-items: center; min-height: var(--bar); overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.family .wrap::-webkit-scrollbar { display: none; }
.family a { text-decoration: none; color: var(--muted); padding: 13px 0; display: inline-flex; align-items: center; gap: 8px; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; flex: none; }
.family a:hover { color: var(--ink); }
.family a[aria-current] { color: var(--ink); border-bottom-color: var(--sport, var(--ink)); }
.family a:focus-visible { outline-offset: -3px; }
.family .brand { color: var(--ink); font-family: var(--display); font-weight: 800; font-size: 1.05rem; letter-spacing: -0.02em; margin-right: 6px; }
.family .brand .mark { width: 22px; height: 22px; }
.family .brand[aria-current] { border-bottom-color: transparent; }
.family a:not([aria-current]) .mini { opacity: 0.72; } 
.family a:hover .mini { opacity: 1; }
@media (prefers-color-scheme: dark) {
  :where(:root:not([data-scheme="light"])) :is(img.tile, img.mini) { box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1); }
  :where(:root:not([data-scheme="light"])) .family a:not([aria-current]) .mini { opacity: 0.8; }
}
:where(:root[data-scheme="dark"]) :is(img.tile, img.mini) { box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1); }
:where(:root[data-scheme="dark"]) .family a:not([aria-current]) .mini { opacity: 0.8; }
.family .right { margin-left: auto; display: flex; gap: 20px; padding-left: 20px; }
.family .fam-apps { display: contents; } 
.lockup { display: inline-flex; align-items: center; gap: 14px; text-decoration: none; color: var(--ink); }
.lockup span, .lockup h2 { display: block; line-height: 1; margin: 0; }
.lockup .brand { font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.lockup .sport { font-family: var(--display); font-weight: 800; font-size: 1.5rem; letter-spacing: -0.02em; }
.btn { display: inline-block; text-decoration: none; background: var(--brand); color: var(--brand-ink); padding: 14px 22px; font-weight: 600; font-size: 1rem; letter-spacing: -0.005em; border-radius: 2px; transition: background 120ms ease, color 120ms ease, transform 120ms ease; }
.btn:hover { background: var(--ink); color: var(--bg); }
.btn:active { transform: translateY(1px); }
.go { display: flex; gap: var(--s-4); align-items: center; flex-wrap: wrap; margin: var(--s-4) 0 0; }
.go a:not(.btn) { display: inline-flex; align-items: center; min-height: 48px; padding: 0 4px; } 
.clock { font-family: var(--display); font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; letter-spacing: -0.03em; line-height: 0.95; font-variation-settings: "opsz" 96; }
.clock .colon { color: var(--brand); }
.clock .tenth { color: var(--brand-text); }
.clock .colon { transition: opacity 320ms ease; }
.clock.tick .colon { opacity: 0.7; }
.clock .tenth { font-size: 0.5em; letter-spacing: 0; }
.clock-row { display: flex; align-items: baseline; gap: 14px 22px; flex-wrap: wrap; }
.clock-row .k { margin: 0; }
.hero { overflow: hidden; border-bottom: 1px solid var(--rule); }
.hero .wrap { display: grid; grid-template-columns: 7fr 5fr; gap: 40px; align-items: start; padding-top: var(--sec); }
.hero h1 { font-size: clamp(2.5rem, 5vw, 4.25rem); max-width: 18ch; } 
.hero .status { margin: var(--s-6) 0 var(--s-6); }
.hero .status-list { list-style: none; margin: var(--s-4) 0 0; padding: 0; font-size: 0.9rem; color: var(--muted); display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; border-top: 1px solid var(--rule-2); }
.hero .status-list li { display: block; padding: var(--s-3) 0 var(--s-5); }
.hero .status-list b { display: block; margin-bottom: 4px; font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 400; }
.route { list-style: none; margin: var(--s-5) 0 0; padding: 0; border-top: 1px solid var(--rule-2); max-width: 36rem; }
.route li { border-bottom: 1px solid var(--rule); }
.route a { display: grid; grid-template-columns: minmax(17ch, 1fr) 1.2fr auto; align-items: baseline; gap: 16px; padding: 14px 0; text-decoration: none; font-family: var(--display); font-weight: 600; font-size: clamp(1.15rem, 2vw, 1.45rem); letter-spacing: -0.015em; }
.route a::after { content: "\2192"; color: var(--muted); font-weight: 400; transition: transform 120ms ease, color 120ms ease; }
.route a:hover::after { color: var(--brand); transform: translateX(4px); }
.route small { font-family: var(--sans); font-weight: 400; font-size: 0.9rem; color: var(--muted); letter-spacing: 0; }
.hero figure { margin: 0; justify-self: end; width: min(440px, 100%); margin-top: 24px; position: relative; }
.hero figcaption { position: absolute; left: 0; bottom: 100%; margin-bottom: 10px; font-size: 0.82rem; color: var(--muted); }
@media (min-width: 921px) {
  .hero .wrap { row-gap: 0; }
  .hero .wrap > div:first-child { display: contents; }
  .hero h1 { grid-column: 1; grid-row: 1; }
  .hero .lede { grid-column: 1; grid-row: 2; }
  .hero .route { grid-column: 1; grid-row: 3; margin-bottom: var(--s-6); }
  .hero figure { grid-column: 2; grid-row: 1 / 4; align-self: end; margin-top: 0; }
  .hero .status-list { grid-column: 1 / -1; grid-row: 4; grid-template-columns: repeat(4, 1fr); margin-top: 0; }
}
.shot { overflow: hidden; position: relative; border: 1px solid var(--rule-2); background: var(--shot-bg); }
@media (prefers-color-scheme: dark) {
  :where(:root:not([data-scheme="light"])) .shot { border-color: #4a4e58; }
}
:where(:root[data-scheme="dark"]) .shot { border-color: #4a4e58; }
.shot img { width: 100%; height: auto; display: block; }
.shot.phone { aspect-ratio: 390 / 760; border-radius: 28px; }
.band { background: var(--sport-band, var(--dark)); --veil: var(--sport-band, #0a0d12); color: var(--dark-ink); min-height: 420px; display: grid; align-items: end; position: relative; isolation: isolate; overflow: hidden; }
.band .photo { position: absolute; inset: 0; z-index: -1; }
.band .photo img { width: 100%; height: 100%; object-fit: cover; opacity: 0.78; }
.band .photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, color-mix(in srgb, var(--veil) 82%, transparent) 0, color-mix(in srgb, var(--veil) 35%, transparent) 55%, color-mix(in srgb, var(--veil) 10%, transparent) 100%); }
.band .wrap { width: 100%; padding-top: var(--sec-s); padding-bottom: var(--s-6); display: grid; grid-template-columns: 1fr auto; gap: 24px 40px; align-items: end; }
.band .line { font-family: var(--display); font-weight: 600; font-size: clamp(1.55rem, 3.2vw, 2.5rem); line-height: 1.08; letter-spacing: -0.025em; max-width: 22ch; margin: 0; }
.band .slot { font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--dark-muted); margin: 0; text-align: right; max-width: 30ch; line-height: 1.5; }
.band .slot b { color: var(--dark-ink); font-weight: 400; display: block; }
.band:has(.ps) .slot, .slot-fig:has(.ps) .slot { display: none; } 
.band .place { font-family: var(--mono); font-size: 0.82rem; color: var(--dark-muted); margin: 18px 0 0; }
.band .note { margin: var(--s-4) 0 0; max-width: 40rem; font-size: 1rem; line-height: 1.55; color: var(--dark-ink); }
.band .note .sig { display: block; font-family: var(--mono); font-size: 0.8rem; color: var(--dark-muted); margin-top: var(--s-2); }
.band .note .stamp { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.08em; border: 1px solid var(--dark-muted); color: var(--dark-muted); padding: 1px 6px; margin-left: 10px; vertical-align: 2px; }
.band.tall { min-height: 520px; }
.apps { padding: var(--s-4) 0 0; }
.app { border-top: 1px solid var(--rule); padding: var(--sec) 0; }
.app:first-child { border-top: 0; }
.app .wrap { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 48px 72px; align-items: start; }
.app.flip .wrap > .text { order: 2; }
.app .lockup .sport { font-size: clamp(2.2rem, 5vw, 4rem); }
.app .lockup { margin-bottom: var(--s-4); }
.app .pitch-line { font-size: 1.25rem; line-height: 1.45; color: var(--ink); max-width: 30rem; margin: 0 0 var(--s-4); }
.app .clock { font-size: clamp(3.2rem, 7vw, 6rem); margin: var(--s-2) 0 2px; }
.app .clock-row { margin: var(--s-1) 0 var(--s-4); }
.app dl { margin: var(--s-2) 0 0; padding: 0; border-top: 1px solid var(--rule-2); max-width: 34rem; }
.app dl div { display: grid; grid-template-columns: 9rem 1fr; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--rule); font-size: 0.98rem; }
.app dt { color: var(--muted); font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; padding-top: 4px; }
.app dd { margin: 0; }
.app .status { margin: var(--s-4) 0 0; }
.app figure { margin: 0; width: min(420px, 100%); justify-self: end; }
.app.flip figure { justify-self: start; }
.app figcaption { font-size: 0.85rem; color: var(--muted); margin-top: 12px; }
.group { list-style: none; margin: var(--s-2) 0 var(--s-4); padding: 0; max-width: 34rem; border-top: 1px solid var(--rule-2); }
.group li { display: grid; grid-template-columns: 5rem 1fr auto; align-items: baseline; gap: 18px; padding: 8px 0 6px; border-bottom: 1px solid var(--rule); }
.group .who { font-family: var(--display); font-weight: 700; font-size: 1.3rem; color: var(--ink); letter-spacing: -0.015em; }
.app .group .clock { font-size: clamp(2.4rem, 5vw, 3.8rem); margin: 0; }
.group .state { font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.group li.out .who, .group li.out .clock, .group li.out .clock .colon { color: var(--muted); }
.group li.out .state { color: var(--ink); }
.slot-fig { aspect-ratio: 4 / 5; background: var(--bg-2); border: 1px solid var(--rule-2); display: grid; align-items: end; padding: 18px 20px; position: relative; overflow: hidden; }
.slot-fig .slot { font-family: var(--mono); font-size: 0.76rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin: 0; max-width: 30ch; line-height: 1.5; }
.slot-fig .slot b { color: var(--ink); font-weight: 400; display: block; }
.slot-fig.photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.slot-fig.photo .slot { position: relative; color: var(--dark-muted); }
.slot-fig.photo .slot b { color: var(--dark-ink); }
.slot-fig.photo::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 42%; background: linear-gradient(to top, rgba(10, 13, 18, 0.8), rgba(10, 13, 18, 0)); }
.slot-fig.photo .slot { z-index: 1; }
.slot-fig.photo:not(:has(.slot))::after { content: none; } 
.rules .plan { grid-column: 1 / -1; font-size: 0.95rem; color: var(--muted); max-width: 44rem; margin: 0; border-top: 1px solid var(--rule); padding-top: 18px; }
.rules { border-top: 1px solid var(--rule); padding: var(--sec) 0; }
.rules h2 { max-width: 16ch; margin-bottom: var(--s-3); }
.rules .wrap { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 40px 80px; align-items: start; }
.rules .wrap > h2 { grid-column: 1 / -1; }
.rules ol { list-style: none; margin: 0; padding: 0; counter-reset: r; }
.rules ol > li { counter-increment: r; display: grid; grid-template-columns: 2.5rem 1fr; gap: 14px; padding: 22px 0; border-top: 1px solid var(--rule); }
.rules ol > li::before { content: counter(r); font-family: var(--mono); font-size: 1.1rem; line-height: 1.3; color: var(--ink); }
.rules ol > li h3 { margin-bottom: 6px; }
.rules ol > li p { margin: 0; font-size: 0.98rem; }
.appcard { background: var(--bg-2); padding: 26px 28px 22px; border: 1px solid var(--rule); }
.appcard .title { font-family: var(--sans); font-weight: 700; font-size: 1.35rem; color: var(--ink); margin: 0 0 6px; letter-spacing: -0.01em; }
.appcard .dev { font-size: 0.86rem; color: var(--muted); margin: 0 0 18px; }
.appcard ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.appcard li { background: var(--bg); border-radius: 12px; padding: 18px 20px 16px; text-align: center; }
.appcard li svg { width: 26px; height: 26px; margin: 0 auto 8px; color: var(--ink); display: block; }
.appcard li b { display: block; font-size: 1rem; color: var(--ink); margin-bottom: 4px; }
.appcard li p { font-size: 0.82rem; color: var(--muted); margin: 0 0 10px; }
.appcard li .items { display: flex; gap: 8px 18px; justify-content: center; flex-wrap: wrap; font-size: 0.85rem; color: var(--ink); font-weight: 500; }
.appcard li .items span::before { content: ""; display: inline-block; width: 12px; height: 12px; border-radius: 3px; background: var(--ink); vertical-align: -1px; margin-right: 7px; opacity: .85; }
.appcard li.none .items { color: var(--muted); font-weight: 400; }
.appcard .note { font-size: 0.8rem; color: var(--muted); margin: 16px 0 0; }
.appcard .ours { font-size: 0.86rem; margin: 14px 0 0; }
@media (prefers-color-scheme: dark) {
  :where(:root:not([data-scheme="light"])) .appcard { background: #1a1b20; }
  :where(:root:not([data-scheme="light"])) .appcard li { background: #24262d; }
}
:where(:root[data-scheme="dark"]) .appcard { background: #1a1b20; }
:where(:root[data-scheme="dark"]) .appcard li { background: #24262d; }
.foot { border-top: 1px solid var(--rule); padding: var(--s-6) 0 var(--s-7); font-size: 0.92rem; color: var(--muted); }
.foot .apps-list { list-style: none; margin: 0 0 var(--s-6); padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.foot .apps-list li { display: flex; gap: 14px; align-items: flex-start; }
.foot .apps-list .tile { width: 40px; height: 40px; }
.foot .apps-list a { color: var(--ink); font-weight: 600; text-decoration: none; display: block; font-family: var(--display); padding: 8px 0; margin: -8px 0; }
.foot .apps-list a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.foot .apps-list span { display: block; font-size: 0.86rem; }
.foot .row { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; border-top: 1px solid var(--rule); padding-top: 22px; }
.foot nav { display: flex; gap: 18px; flex-wrap: wrap; align-items: baseline; }
.foot nav a { text-decoration: none; color: var(--muted); display: inline-block; padding: 10px 0; }
.foot nav a:hover { color: var(--ink); text-decoration: underline; }
.foot .row p { margin: 0; max-width: 44rem; }
.sport-hero { overflow: hidden; }
.sport-hero .wrap { display: grid; grid-template-columns: 7fr 5fr; gap: 40px; align-items: start; padding-top: var(--sec-s); }
.sport-hero h1 { margin-top: var(--s-5); max-width: 14ch; }
.sport-hero .lede { max-width: 32rem; margin: var(--s-4) 0 0; }
.sport-hero .status { margin: var(--s-3) 0 var(--s-6); max-width: 34rem; }
.sport-hero figure { margin: 0; justify-self: end; width: min(420px, 100%); margin-top: 8px; position: relative; }
.sport-hero figcaption { position: absolute; left: 0; bottom: 100%; margin-bottom: 10px; font-size: 0.82rem; color: var(--muted); }
@media (min-width: 921px) {
  .sport-hero figure { align-self: end; margin-top: 0; } 
  .sport-plunge .sport-hero .slot-fig { aspect-ratio: 7 / 10; } 
  .sport-plunge .sport-hero h1 { max-width: 17ch; font-size: clamp(2.5rem, 5.6vw, 4.5rem); }
}
.bigclock { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: var(--s-6) 0 var(--s-5); }
.bigclock .wrap { display: grid; grid-template-columns: auto 1fr; gap: 20px 64px; align-items: end; }
.bigclock .clock { font-size: clamp(4.5rem, 15vw, 12.5rem); margin: 0; }
.bigclock .side { padding-bottom: 0.4em; max-width: 30rem; }
.bigclock .side p { margin: 0; }
.bigclock .side .k { margin-bottom: 8px; }
.feature { padding: var(--sec) 0; }
.feature + .feature { border-top: 1px solid var(--rule); }
.feature .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 80px; align-items: start; }
.feature.wide .wrap { grid-template-columns: 0.9fr 1.1fr; }
.feature.flip .wrap > figure { order: 2; }
.feature.short { padding: var(--sec-s) 0; }
@media (min-width: 921px) { .feature > .wrap > figure, .feature > .wrap > .pair, .lock > .wrap > figure { position: sticky; top: calc(var(--bar) + 24px); } }
@media (min-width: 921px) { .feature > .wrap:has(> .go.mid) > figure { position: static; } }
.feature.strip .wrap { grid-template-columns: 1fr 1fr 1fr; align-items: start; gap: 32px 48px; }
.feature.strip .side p { margin-top: 0; }
.feature.strip .lead p:first-of-type { margin-top: var(--s-3); }
.feature.strip figure { width: min(340px, 100%); justify-self: end; }
@media (max-width: 1100px) and (min-width: 921px) { .feature.strip .wrap { grid-template-columns: 1fr 1.4fr; } .feature.strip .side:first-child { grid-column: 1 / -1; } }
.feature.twin .wrap { grid-template-columns: 1fr 1fr; align-items: start; }
.feature.twin .wrap > h2 { grid-column: 1 / -1; max-width: 20ch; }
.feature.twin .wrap > .k { grid-column: 1 / -1; margin: 0; }
.feature.twin .wrap { row-gap: 0; }
.feature.twin .wrap > h2 { margin-bottom: var(--s-5); }
.feature.twin .wrap > .k + h2 { margin-top: var(--s-2); }
.feature.twin .half-col { display: grid; gap: var(--s-4); align-content: start; }
.feature.twin .half-col figure { justify-self: start; }
.feature.twin .half-col p { margin: 0; max-width: 32rem; }
.feature.twin .half-col .k { margin: 0 0 -1rem; }
.feature h2 { max-width: 14ch; }
.feature .side p { margin: var(--s-3) 0 0; max-width: 32rem; }
.feature .side p + .k { margin-top: var(--s-5); }
.feature figure { margin: 0; width: min(440px, 100%); justify-self: end; }
.feature:not(.flip) .wrap > figure:first-child { justify-self: start; }
.feature .pair figure { justify-self: stretch; }
.feature figure.duo-fig, .feature figure.laptop { justify-self: center; }
.feature figcaption { font-size: 0.85rem; color: var(--muted); margin-top: 12px; }
.feature .follow-wrap { width: min(360px, 100%); }
.limits { font-size: 0.95rem; color: var(--muted); border-left: 2px solid var(--rule-2); padding-left: 16px; margin-top: var(--s-4); max-width: 30rem; }
.duo { position: relative; width: min(520px, 100%); justify-self: center; padding-right: 26%; padding-bottom: 14%; }
.duo .coach { width: 100%; }
.duo .other { position: absolute; right: 0; bottom: 0; width: 48%; box-shadow: -18px 0 40px -24px rgba(0, 0, 0, 0.5); }
.duo .shot.phone { border-radius: 24px; }
.duo .coach.shot.phone { aspect-ratio: 390 / 660; }
.feature figure.duo-fig { width: min(560px, 100%); }
.duo-fig figcaption { display: flex; gap: 8px 24px; flex-wrap: wrap; }
.duo-fig figcaption span + span::before { content: "\00b7"; color: var(--rule-2); margin-right: 24px; }
.pair { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; width: min(520px, 100%); justify-self: center; margin: 0; }
.pair figure { margin: 0; }
.feature .pair figure { width: auto; }
.lock { padding: var(--sec) 0; border-top: 1px solid var(--rule); }
.lock .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 80px; align-items: start; }
.lock h2 { max-width: 14ch; }
.lock .side p { margin: var(--s-3) 0 0; max-width: 32rem; }
.lockscreen { margin: 0; width: min(400px, 100%); justify-self: center; color: #f2f4f6; font-family: var(--sans); }
.lockscreen .screen { background: #0b0d12; border-radius: 34px; padding: 22px 16px 26px; }
.lockscreen .time { font: 600 3.6rem/1 var(--sans); letter-spacing: -0.02em; text-align: center; margin: 14px 0 20px; font-variant-numeric: tabular-nums; }
.lockscreen .date { font-size: 0.95rem; text-align: center; color: rgba(255, 255, 255, 0.7); margin: 0 0 4px; }
.lockscreen figcaption { color: var(--muted); font-size: 0.85rem; margin-top: 12px; }
.lcard { --lc-ink: #1e2833; --lc-muted: #6b7785; --lc-faint: #9aa3ad; --lc-accent: #1f6feb; --lc-rule: rgba(30, 40, 51, 0.1); --lc-bg: #f6f7f6; background: var(--lc-bg); color: var(--lc-ink); border-radius: 20px; padding: 14px 18px; margin: 10px 0; }
@media (prefers-color-scheme: dark) {
  :where(:root:not([data-scheme="light"])) .lcard { --lc-ink: #f2f4f6; --lc-muted: #9aa5b1; --lc-faint: #6b7785; --lc-accent: #1f6feb; --lc-rule: rgba(255, 255, 255, 0.12); --lc-bg: #161b22; }
}
:where(:root[data-scheme="dark"]) .lcard { --lc-ink: #f2f4f6; --lc-muted: #9aa5b1; --lc-faint: #6b7785; --lc-accent: #1f6feb; --lc-rule: rgba(255, 255, 255, 0.12); --lc-bg: #161b22; }
.lcard .score { display: grid; grid-template-columns: 1fr 1px 124px; gap: 14px; align-items: center; }
.lcard .teams { display: grid; gap: 6px; }
.lcard .team { display: flex; align-items: center; gap: 10px; height: 34px; }
.lcard .team i { width: 4px; height: 22px; border-radius: 2px; background: color-mix(in srgb, var(--lc-faint) 60%, transparent); flex: none; }
.lcard .team.ours i { background: var(--lc-accent); }
.lcard .team span { font-size: 17px; font-weight: 600; color: var(--lc-muted); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lcard .team.ours span { color: var(--lc-ink); }
.lcard .team b { font-size: 30px; font-weight: 700; font-variant-numeric: tabular-nums; min-width: 26px; text-align: right; font-family: ui-rounded, var(--sans); }
.lcard .vrule { width: 1px; height: 64px; background: var(--lc-rule); }
.lcard .clock-side { text-align: right; }
.lcard .clock-side .lclock { font: 600 42px/1.1 ui-rounded, var(--sans); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; color: var(--lc-ink); }
.lcard .clock-side .lclock .colon, .lcard .clock-side .lclock .tenth { color: inherit; }
.lcard .phase { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; letter-spacing: 0.06em; color: var(--lc-accent); margin-top: 2px; }
.lcard .phase::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--lc-accent); }
.lcard .acts { display: flex; gap: 8px; margin-top: 10px; }
.lcard .acts span { flex: 1; min-height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; border-radius: 18px; font-size: 15px; font-weight: 600; background: color-mix(in srgb, var(--lc-ink) 8%, transparent); color: var(--lc-ink); }
.lcard .acts span.on { background: var(--lc-accent); color: #fff; }
.lcard.stats .row { display: grid; grid-template-columns: 104px 1fr; gap: 10px; align-items: baseline; padding: 6px 0; }
.lcard.stats .row + .row { border-top: 1px solid var(--lc-rule); }
.lcard.stats .row b { font-size: 11px; font-weight: 600; letter-spacing: 0.06em; color: var(--lc-muted); }
.lcard.stats .row span { font-size: 17px; font-weight: 600; color: var(--lc-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lcard.stats .row span em { font-style: normal; color: var(--lc-accent); font-variant-numeric: tabular-nums; margin-left: 8px; }
.desk { margin: 0; width: 100%; justify-self: stretch; }
.feature figure.desk { width: 100%; }
.desk figcaption { font-size: 0.85rem; color: var(--muted); margin-top: 12px; }
.feature.season .wrap { grid-template-columns: 1fr; gap: var(--s-5); }
.feature.season .side { display: grid; grid-template-columns: 1fr 1fr; gap: 0 80px; align-items: start; }
.feature.season .side .head h2 { margin-bottom: 0; }
.feature.season .side .body p:first-child { margin-top: 0; }
@media (max-width: 920px) { .feature.season .side { grid-template-columns: 1fr; } .feature.season .side .body p:first-child { margin-top: var(--s-3); } }
.browser .win { border: 1px solid var(--rule-2); border-radius: 8px; overflow: hidden; background: var(--shot-bg); }
.browser .bar { display: flex; align-items: center; justify-content: center; height: 38px; padding: 0 12px; background: var(--bg-2); border-bottom: 1px solid var(--rule); }
.browser .addr { font: 400 0.78rem/1 var(--mono); color: var(--muted); border: 1px solid var(--rule); border-radius: 5px; padding: 6px 14px; min-width: min(40%, 18rem); text-align: center; background: var(--bg); }
.browser img { display: block; width: 100%; height: auto; }
.feature.season figure.desk { position: static; } 
.ledger { border-top: 1px solid var(--rule); padding: var(--sec) 0; }
.ledger h2 { max-width: 16ch; margin-bottom: var(--s-3); }
.ledger .intro { max-width: 40rem; margin: 0 0 var(--s-6); }
.ledger .cols { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 64px; }
.ledger .col h3 { font-size: 1.25rem; padding-bottom: var(--s-2); border-bottom: 2px solid var(--ink); margin-bottom: 0; }
.ledger ul { list-style: none; margin: 0; padding: 0; }
.ledger li { position: relative; padding: 12px 0 12px 2rem; border-bottom: 1px solid var(--rule); font-size: 0.98rem; color: var(--ink); }
.ledger li small { display: block; color: var(--muted); font-size: 0.86rem; margin-top: 2px; }
.ledger li::before { content: ""; position: absolute; left: 0; top: 18px; width: 14px; height: 14px; border: 1.5px solid var(--ink); border-radius: 50%; }
.ledger .col.sealed li::before { background: var(--ink); }
.ledger .after { margin: var(--s-5) 0 0; max-width: 44rem; font-size: 0.95rem; color: var(--muted); }
.ledger .after a, .today li a { color: var(--ink); display: inline-block; padding: 10px 0; margin: -10px 0; }
.compare { border-top: 1px solid var(--rule); padding: var(--sec) 0; }
.compare h2 { max-width: 18ch; }
.compare .intro { max-width: 40rem; margin: var(--s-3) 0 var(--s-5); }
.compare table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.compare th, .compare td { text-align: left; vertical-align: top; padding: 12px 18px 12px 0; border-bottom: 1px solid var(--rule); }
.compare thead th { font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); font-weight: 400; border-bottom: 2px solid var(--ink); padding-bottom: 10px; }
.compare thead th:first-child { color: transparent; }
.compare tbody th { font-weight: 600; color: var(--ink); width: 24%; }
.compare td.us { color: var(--ink); font-weight: 500; }
.compare td { color: var(--body); }
.compare .checked { font-size: 0.84rem; color: var(--muted); margin: var(--s-3) 0 0; }
.numbers { border-top: 1px solid var(--rule); padding: var(--sec-s) 0 var(--sec); }
.numbers h2 { max-width: 16ch; margin-bottom: var(--s-3); }
.numbers .intro { max-width: 40rem; margin: 0 0 var(--s-6); }
.numbers ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, auto); justify-content: start; gap: 28px 64px; }
.numbers b { display: block; font-family: var(--display); font-weight: 800; font-size: clamp(2.2rem, 4.4vw, 3.6rem); color: var(--ink); line-height: 1; margin-bottom: 10px; font-variant-numeric: tabular-nums; letter-spacing: -0.03em; }
.numbers span { font-size: 0.95rem; color: var(--muted); display: block; max-width: 15rem; }
.numbers .more { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 48px; max-width: 52rem; margin-top: var(--s-6); }
.numbers .more p { margin: 0; font-size: 0.98rem; }
.feature .wrap > .go.mid { grid-column: 1 / -1; margin: 0; } 
.today { border-top: 1px solid var(--rule); padding: var(--sec-s) 0 var(--sec); }
.today .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 80px; align-items: start; }
.today h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); max-width: 18ch; }
.today p { max-width: 32rem; }
.today .addr { font-family: var(--mono); font-size: 0.95rem; color: var(--ink); }
.today .go { margin-top: var(--s-4); }
.today ul { margin: 0; padding: 0; list-style: none; }
.today li { padding: 10px 0; border-top: 1px solid var(--rule); display: grid; grid-template-columns: 9rem 1fr; gap: 12px; font-size: 0.98rem; }
.today li:last-child { border-bottom: 1px solid var(--rule); }
.today li b { font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); font-weight: 400; padding-top: 4px; }
@media (max-width: 920px) {
  .hero .wrap, .sport-hero .wrap { grid-template-columns: 1fr; gap: 20px; }
  .hero .wrap > div:first-child, .sport-hero .wrap > div:first-child { display: contents; }
  .hero .wrap h1 { order: 1; } .hero .wrap .lede { order: 2; margin-top: 0; } .hero .wrap .route { order: 3; margin: 0; } .hero .wrap > figure { order: 4; margin-top: var(--s-4); }
  .hero .wrap .status-list { order: 5; margin: var(--s-2) 0 var(--s-4); }
  .sport-hero .wrap .lockup { order: 1; } .sport-hero .wrap h1 { order: 2; margin-top: 0; } .sport-hero .wrap .lede { order: 3; margin-top: 0; }
  .sport-hero .wrap .go { order: 4; margin-top: 0; } .sport-hero .wrap .status { order: 5; margin: 0; } .sport-hero .wrap > figure { order: 6; margin: var(--s-3) 0 var(--s-6); }
  .hero figure, .sport-hero figure { justify-self: start; margin: 0; width: min(380px, 86%); }
  .hero figcaption, .sport-hero figcaption { position: static; margin: 0 0 10px; }
  .app .wrap, .rules .wrap, .feature .wrap, .feature.wide .wrap, .lock .wrap, .today .wrap { grid-template-columns: 1fr; gap: 32px; }
  .app.flip .wrap > .text { order: 0; }
  .feature.flip .wrap > figure { order: 0; }
  .app figure, .app.flip figure { justify-self: start; }
  .feature figure, .duo, .pair, .lockscreen { justify-self: start; }
  .band .wrap { grid-template-columns: 1fr; }
  .band .slot { text-align: left; }
  .bigclock .wrap { grid-template-columns: 1fr; gap: 16px; align-items: start; }
  .foot .apps-list { grid-template-columns: 1fr 1fr; }
  .numbers ul { grid-template-columns: repeat(2, auto); gap: 24px 48px; }
  .ledger .cols { grid-template-columns: 1fr; gap: var(--s-5); }
  .compare table { font-size: 0.9rem; }
  .feature.strip .wrap, .feature.twin .wrap { grid-template-columns: 1fr; }
  .feature.strip figure { justify-self: start; }
}
@media (max-width: 800px) {
  .family .wrap { gap: 0 16px; }
  .family .right { padding-left: 16px; gap: 16px; }
}
@media (max-width: 640px) {
  .family { position: relative; }
  .family .wrap { display: grid; grid-template-columns: 1fr auto; gap: 0; align-items: center; overflow: visible; min-height: 0; }
  .family .brand { grid-column: 1; grid-row: 1; margin-right: 0; }
  .family .right { grid-column: 2; grid-row: 1; margin-left: 0; padding-left: 0; }
  .family .fam-apps { grid-column: 1 / -1; grid-row: 2; display: flex; gap: 0 16px; overflow-x: auto; scrollbar-width: none; border-top: 1px solid var(--rule); }
  .family .fam-apps::-webkit-scrollbar { display: none; }
  .family a { padding: 11px 0; }
  html { scroll-padding-top: 16px; }
  .compare thead { display: none; }
  .compare tr { display: block; padding: 12px 0; border-bottom: 1px solid var(--rule); }
  .compare tbody th, .compare td { display: block; width: auto; border: 0; padding: 2px 0; }
  .compare tbody th { padding-bottom: 6px; }
  .compare td { display: grid; grid-template-columns: 6.5rem 1fr; gap: 0 10px; }
  .compare td::before { content: attr(data-l); font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); padding-top: 3px; }
  .numbers .more { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  :root { --gutter: 16px; }
  body { font-size: 1rem; }
  .hero .wrap { padding-top: var(--s-6); }
  .hero h1 { font-size: 2.25rem; }
  .go { gap: 12px 20px; }
  .go .btn { flex: 1 1 100%; text-align: center; }
  .go a:not(.btn) { flex: 1 1 100%; justify-content: center; padding: 0; }
  .family .mini { display: none; }
  .app dl div { grid-template-columns: 1fr; gap: 2px; }
  .hero .status-list { grid-template-columns: 1fr; }
  .route a { display: block; }
  .route small { display: block; margin-top: 2px; }
  .route a::after { content: none; }
  .band { min-height: 320px; }
  .group li { grid-template-columns: 4rem 1fr auto; gap: 12px; }
  .foot .apps-list { grid-template-columns: 1fr; }
  .duo { padding-right: 30%; }
  .duo-fig figcaption { display: grid; gap: 4px; }
  .duo-fig figcaption span + span::before { content: none; }
  .pair { gap: 12px; }
  .lockscreen .screen { padding: 16px 10px 20px; border-radius: 26px; }
  .lock .wrap > * { min-width: 0; }
  .lcard .score { grid-template-columns: minmax(0, 1fr) 1px auto; gap: 10px; }
  .lcard .team span { min-width: 0; }
  .lcard .clock-side .lclock { font-size: 36px; }
  .lcard .acts span { font-size: 13px; padding: 0 8px; }
  .today li { grid-template-columns: 1fr; gap: 2px; }
  .lock .wrap { gap: 24px; }
  .bigclock .clock { font-size: clamp(3.6rem, 22vw, 6rem); }
}
@media (max-width: 360px) {
  .family .fam-apps { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent); }
  .numbers ul { grid-template-columns: 1fr; gap: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .clock .colon { color: var(--ink); transition: none; }
  .clock.tick .colon { opacity: 1; }
  a, .btn, .route a::after { transition: none; }
}
.page-head { padding: var(--sec-s) 0 var(--s-6); border-bottom: 1px solid var(--rule); }
.page-head h1 { max-width: 14ch; }
.page-head .lede { max-width: 40rem; }
.page-head .big-addr { margin: var(--s-5) 0 0; display: flex; gap: 10px 24px; align-items: baseline; flex-wrap: wrap; }
.page-head .big-addr .addr { font-size: clamp(1.3rem, 3vw, 2rem); }
.page-head .for { margin: var(--s-4) 0 0; font-size: 0.9rem; color: var(--muted); }
.page-head .for a { display: inline-block; padding: 8px 2px; margin: -8px 0; }
.parents { padding: var(--sec-s) 0; border-bottom: 1px solid var(--rule); }
.parents h2 { font-size: clamp(1.6rem, 3.2vw, 2.4rem); max-width: 22ch; }
.parents p { max-width: 40rem; margin: var(--s-3) 0 0; }
.parents ul { list-style: none; margin: var(--s-4) 0 0; padding: 0; max-width: 44rem; border-top: 1px solid var(--rule-2); }
.parents li { display: grid; grid-template-columns: minmax(9rem, 14rem) 1fr; gap: 6px 32px; padding: 14px 0; border-bottom: 1px solid var(--rule); }
.parents li b { font-family: var(--display); font-weight: 700; font-size: 1.1rem; color: var(--ink); letter-spacing: -0.01em; line-height: 1.25; }
.parents li a { display: inline-block; padding: 8px 0; margin: -8px 0; }
@media (max-width: 640px) { .parents li { grid-template-columns: 1fr; } }
.addr { font-family: var(--mono); font-weight: 400; color: var(--ink); letter-spacing: -0.01em; }
.page-head.missing .clock { font-size: clamp(4rem, 12vw, 8rem); margin: 0 0 var(--s-3); }
.page-head.missing .clock.still .colon { color: var(--rule-2); }
.page-head.missing .route { margin-top: var(--s-5); max-width: 40rem; }
.ledger.big { border-top: 0; padding-top: var(--sec-s); }
.ledger .choices { margin-top: var(--sec-s); max-width: 44rem; }
.ledger .choices h3 { font-size: 1.25rem; padding-bottom: var(--s-2); border-bottom: 2px solid var(--ink); }
.ledger .choices li { grid-template-columns: 1fr; padding-left: 0; }
.ledger .choices li::before { content: none; }
.prose { border-top: 1px solid var(--rule); padding: var(--sec-s) 0 var(--sec); }
.prose .wrap { max-width: var(--wrap); } 
.prose .wrap > * { max-width: 44rem; }
.prose h2 { margin-bottom: var(--s-3); }
.prose h3 { margin: var(--s-6) 0 var(--s-2); font-size: 1.5rem; }
.prose h4 { font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); font-weight: 400; margin: var(--s-5) 0 var(--s-2); }
.prose p, .prose li { font-size: 1rem; line-height: 1.65; }
.prose ul { padding-left: 1.2rem; margin: 0 0 1em; }
.prose li { margin-bottom: 0.4em; }
.prose .effective { border-left: 2px solid var(--brand); padding: 6px 0 6px 16px; font-size: 0.95rem; color: var(--muted); margin-bottom: var(--s-5); }
.prose .effective b { color: var(--ink); }
.feedback { padding: var(--sec-s) 0; border-bottom: 1px solid var(--rule); }
.feedback h2 { font-size: clamp(1.6rem, 3.2vw, 2.4rem); max-width: 22ch; }
.feedback p { max-width: 40rem; margin: var(--s-3) 0 0; }
.faq { padding: var(--sec-s) 0 var(--sec); }
.faq h2 { font-size: clamp(1.6rem, 3.2vw, 2.4rem); margin-bottom: var(--s-4); }
.faq dl { margin: 0; max-width: 52rem; border-top: 1px solid var(--rule-2); }
.faq dl div { display: grid; grid-template-columns: minmax(12rem, 18rem) 1fr; gap: 8px 40px; padding: 18px 0; border-bottom: 1px solid var(--rule); }
.faq dt { font-family: var(--display); font-weight: 700; font-size: 1.15rem; color: var(--ink); letter-spacing: -0.01em; line-height: 1.25; text-wrap: balance; }
.faq dd { margin: 0; font-size: 1rem; }
@media (max-width: 640px) { .faq dl div { grid-template-columns: 1fr; gap: 6px; } }
.feature .clip { width: min(360px, 100%); position: relative; display: grid; grid-template-columns: 100%; } 
.clip video { grid-area: 1 / 1; }
.clip figcaption { grid-row: 2; }
.feature.twin .clip { width: min(400px, 100%); }
@media (max-width: 920px) { .feature.twin .clip { width: min(286px, 100%); } }
.feature.twin .clip video.shot { border-radius: 34px; }
.clip video.shot { width: 100%; height: auto; aspect-ratio: 390 / 844; object-fit: cover; display: block; background: var(--shot-bg); }
.clip video.dark { display: none; }
@media (prefers-color-scheme: dark) {
  :where(:root:not([data-scheme="light"])) .clip video.light { display: none; }
  :where(:root:not([data-scheme="light"])) .clip video.dark { display: block; }
}
:where(:root[data-scheme="dark"]) .clip video.light { display: none; }
:where(:root[data-scheme="dark"]) .clip video.dark { display: block; }
.clip figcaption { font-size: 0.85rem; color: var(--muted); margin-top: 12px; }
.clip .pause { grid-area: 1 / 1; align-self: end; justify-self: end; margin: 10px; z-index: 2; appearance: none; -webkit-appearance: none; font: 500 0.82rem/1 var(--sans); color: #f1efe9; background: rgba(10, 13, 18, 0.72); border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 999px; min-height: 44px; min-width: 72px; padding: 0 14px; cursor: pointer; }
.clip .pause:hover { background: rgba(10, 13, 18, 0.9); }
.clip .pause:focus-visible { outline: 2px solid #f1efe9; outline-offset: 2px; }
.bigclock.plunge .wrap { grid-template-columns: 1.1fr 0.9fr; align-items: end; }
.bigclock.plunge .group { margin: 0; max-width: none; border-top: 0; } 
.bigclock.plunge .group li { grid-template-columns: 6rem auto 1fr; padding: 10px 0 8px; }
.bigclock.plunge .group .state { justify-self: start; padding-left: 24px; }
.bigclock.plunge .group .who { font-size: 1.6rem; }
.bigclock.plunge .group .clock { font-size: clamp(3rem, 7vw, 6.5rem); margin: 0; }
.bigclock.plunge .side { padding-bottom: 0.2em; }
.feature .drawn { width: min(440px, 100%); justify-self: center; }
.feature .drawn .k { margin: 0 0 var(--s-2); }
.feature .drawn .clock { font-size: clamp(4rem, 10vw, 8rem); margin: 0; }
.feature .drawn .fine { margin: var(--s-2) 0 0; font-family: var(--mono); font-size: 0.8rem; letter-spacing: 0.04em; }
.feature.text .wrap { grid-template-columns: 1fr; gap: var(--s-5); }
.feature.text .side { max-width: 44rem; }
.feature.text h2 { max-width: 18ch; }
.feature.text .side p { max-width: 40rem; }
.feature.text .cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 48px; max-width: 48rem; margin-top: var(--s-4); }
.feature.text .cols p { margin: 0; font-size: 0.98rem; }
@media (max-width: 920px) {
  .bigclock.plunge .wrap { grid-template-columns: 1fr; gap: 24px; }
  .feature .drawn { justify-self: start; }
}
@media (max-width: 640px) { .feature.text .cols { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .bigclock.plunge .group li { grid-template-columns: 4.5rem auto 1fr; gap: 12px; } .bigclock.plunge .group .state { padding-left: 12px; } }
.stores { margin: var(--s-4) 0 0; max-width: 34rem; }
.stores .k { margin: 0; }
.stores .badges { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding: 10px 0; margin: 0; }
.stores .badges img { height: 40px; width: auto; flex: none; }
.stores .badges .play { font: 400 0.95rem/1.3 var(--sans); color: var(--muted); } 
.stores .fine { margin: 0; }
.today .stores { margin-top: var(--s-5); }
.foot .marks { font-size: 0.78rem; color: var(--muted); margin: var(--s-3) 0 0; max-width: 60rem; }
.beta { border-top: 1px solid var(--rule); padding: var(--sec-s) 0; }
.beta .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 80px; align-items: start; }
.beta h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); max-width: 18ch; }
.beta .side p { max-width: 32rem; margin: var(--s-3) 0 0; }
.beta-form { display: grid; gap: var(--s-3); max-width: 34rem; margin: 0; position: relative; }
.beta-form .hp { position: absolute; left: -10000px; top: 0; width: 1px; height: 1px; overflow: hidden; } 
.beta-form .field { display: grid; gap: 6px; }
.beta-form .field label, .beta-form legend { font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); padding: 0; }
.beta-form input[type="email"] { font: inherit; font-size: 1rem; color: var(--ink); background: var(--bg); border: 1px solid var(--rule-2); border-radius: 2px; padding: 10px 14px; min-height: 48px; width: 100%; margin: 0; -webkit-appearance: none; appearance: none; }
.beta-form input[type="email"]::placeholder { color: var(--muted); opacity: 1; }
.beta-form input[type="email"]:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; border-color: var(--ink); }
.beta-form input[aria-invalid="true"] { border-color: var(--ink); border-width: 2px; }
.beta-form fieldset { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: 6px; }
.beta-form .opts { display: flex; flex-wrap: wrap; gap: 8px; }
.beta-form .opts label { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 0 14px; border: 1px solid var(--rule-2); border-radius: 2px; color: var(--ink); font-size: 0.98rem; cursor: pointer; transition: border-color 120ms ease, background 120ms ease; }
.beta-form .opts label:hover { border-color: var(--ink); }
.beta-form .opts label:has(input:checked) { border-color: var(--ink); background: var(--bg-2); box-shadow: inset 0 0 0 1px var(--ink); }
.beta-form .opts label:has(input:focus-visible) { outline: 2px solid var(--ink); outline-offset: 3px; }
.beta-form .opts input { accent-color: var(--brand); width: 16px; height: 16px; margin: 0; flex: none; }
.beta-form .get { font-size: 0.9rem; color: var(--muted); margin: 0; }
.beta-form .btn { border: 0; font: inherit; font-weight: 600; font-size: 1rem; min-height: 48px; cursor: pointer; justify-self: start; margin: 0; }
.beta-form .err { margin: 0; font-size: 0.92rem; color: var(--ink); border-left: 2px solid var(--brand); padding: 4px 0 4px 14px; }
.beta-form .done { padding: 2px 0; outline: none; }
.beta-form .done .for { display: block; font-family: var(--display); font-weight: 700; font-size: 1.3rem; line-height: 1.2; letter-spacing: -0.015em; color: var(--ink); margin-bottom: 6px; text-wrap: balance; }
.beta-form .done p { margin: 0; color: var(--body); }
.beta-form .done .again { appearance: none; -webkit-appearance: none; font: inherit; font-size: 0.95rem; color: var(--ink); background: none; border: 0; padding: 10px 0; margin: 4px 0 0; cursor: pointer; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
.beta-form .done .again:hover { text-decoration-thickness: 2px; }
.beta-form [hidden] { display: none; }
.beta-form.joined > :not(.done) { display: none; }
@media (max-width: 920px) { .beta .wrap { grid-template-columns: 1fr; gap: 24px; } }
.family, .hero, .app, .rules, .feature, .feature + .feature, .lock, .bigclock, .ledger, .compare, .numbers, .today, .beta, .foot, .page-head, .prose, .feedback, .parents, .sport-hero, .questions, .notes { border-top: 0; border-bottom: 0; }
.hero, .app, .rules, .feature, .lock, .bigclock, .ledger, .compare, .numbers, .today, .beta, .foot, .page-head, .prose, .feedback, .parents, .sport-hero, .questions, .notes { position: relative; } 
.app::before, .rules::before, .feature + .feature::before, .lock::before, .bigclock::before, .ledger::before, .compare::before, .numbers::before, .today::before, .beta::before, .foot::before, .prose::before, .questions::before, .notes::before, .ledger + .parents::before,
.family::after, .page-head::after, .parents::after {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: var(--rule);
}
.app::before, .rules::before, .feature + .feature::before, .lock::before, .bigclock::before, .ledger::before, .compare::before, .numbers::before, .today::before, .beta::before, .foot::before, .prose::before, .questions::before, .notes::before, .ledger + .parents::before { top: 0; }
.ledger + .parents::after { display: none; } 
.family::after, .page-head::after, .parents::after { bottom: 0; }
.numbers:not(:has(h2))::before { left: 50%; right: auto; transform: translateX(-50%); width: min(100% - 2 * var(--gutter), var(--wrap) - 2 * var(--gutter)); }
.app:first-child::before, .ledger.big::before, .page-head.missing::after { display: none; } 
.family .wrap { min-height: calc(var(--bar) + 1px); }
.family a { margin-bottom: 0; }
.route, .hero .status-list, .app dl, .group, .parents ul, .faq dl, .ledger .choices, .rules .plan, .beta-form { max-width: none; }
.beta-form .field, .beta-form .get { max-width: 34rem; }
.faq dd { max-width: 40rem; }
@media (min-width: 641px) { .parents li { grid-template-columns: minmax(9rem, 14rem) minmax(0, 40rem); } }
@media (min-width: 921px) { .rules .plan, .ledger .choices li { padding-right: 28%; } }
.route a { padding: var(--s-3) 0; }
.app dl div, .today li, .ledger li { padding-top: var(--s-2); padding-bottom: var(--s-2); }
.hero .status-list li, .group li, .bigclock.plunge .group li { padding: var(--s-1) 0; }
.rules ol > li { padding: var(--s-4) 0; }
.faq dl div, .parents li { padding: var(--s-3) 0; }
.foot .row { padding-top: var(--s-4); }
.sport-hockey { --sport-hue: 246; }
.sport-soccer { --sport-hue: 163; }
.sport-xc { --sport-hue: 42; }
.sport-plunge { --sport-hue: 201; }
.sport-hockey, .sport-soccer, .sport-xc, .sport-plunge { --wash-l: 0.945; --wash-c: 0.014; --wash-rule-l: 0.84; }
html[data-tint="bands"] body { --wash-l: 0.938; --wash-c: 0.018; }
@media (prefers-color-scheme: dark) {
  :where(:root:not([data-scheme="light"])) .sport-hockey, :where(:root:not([data-scheme="light"])) .sport-soccer, :where(:root:not([data-scheme="light"])) .sport-xc, :where(:root:not([data-scheme="light"])) .sport-plunge { --wash-l: 0.258; --wash-c: 0.018; --wash-rule-l: 0.36; }
  html[data-tint="bands"]:where(:not([data-scheme="light"])) body { --wash-l: 0.268; --wash-c: 0.022; }
}
:where(:root[data-scheme="dark"]) .sport-hockey, :where(:root[data-scheme="dark"]) .sport-soccer, :where(:root[data-scheme="dark"]) .sport-xc, :where(:root[data-scheme="dark"]) .sport-plunge { --wash-l: 0.258; --wash-c: 0.018; --wash-rule-l: 0.36; }
html[data-tint="bands"]:where([data-scheme="dark"]) body { --wash-l: 0.268; --wash-c: 0.022; }
.sport-hockey, .sport-soccer, .sport-xc, .sport-plunge { --sport-wash: oklch(var(--wash-l) var(--wash-c) var(--sport-hue)); --wash-rule: oklch(var(--wash-rule-l) 0.02 var(--sport-hue)); }
html[data-tint="subtle"] body[class*="sport-"] .ledger,
html:not([data-tint]) body[class*="sport-"] :is(.ledger, .today:not(.ledger + .today)),
html[data-tint="on"] body[class*="sport-"] :is(.ledger, .today:not(.ledger + .today)),
html[data-tint="bands"] body[class*="sport-"] :is(.ledger, .numbers, .today:not(.ledger + .today)) { background: var(--sport-wash); --washed: 1; --rule: var(--wash-rule); --muted: #5a5e66; --brand-text: #8a5a00; }
@media (prefers-color-scheme: dark) {
  html[data-tint="subtle"]:where(:not([data-scheme="light"])) body[class*="sport-"] .ledger, html:not([data-tint]):where(:not([data-scheme="light"])) body[class*="sport-"] :is(.ledger, .today:not(.ledger + .today)), html[data-tint="on"]:where(:not([data-scheme="light"])) body[class*="sport-"] :is(.ledger, .today:not(.ledger + .today)), html[data-tint="bands"]:where(:not([data-scheme="light"])) body[class*="sport-"] :is(.ledger, .numbers, .today:not(.ledger + .today)) { --muted: #969aa3; --brand-text: #ffb21a; }
}
html[data-tint="subtle"]:where([data-scheme="dark"]) body[class*="sport-"] .ledger, html:not([data-tint]):where([data-scheme="dark"]) body[class*="sport-"] :is(.ledger, .today:not(.ledger + .today)), html[data-tint="on"]:where([data-scheme="dark"]) body[class*="sport-"] :is(.ledger, .today:not(.ledger + .today)), html[data-tint="bands"]:where([data-scheme="dark"]) body[class*="sport-"] :is(.ledger, .numbers, .today:not(.ledger + .today)) { --muted: #969aa3; --brand-text: #ffb21a; }
html[data-tint="subtle"] body[class*="sport-"] :is(.ledger, .ledger + *)::before,
html:not([data-tint]) body[class*="sport-"] :is(.ledger, .ledger + *, .today, .today + *)::before,
html[data-tint="on"] body[class*="sport-"] :is(.ledger, .ledger + *, .today, .today + *)::before,
html[data-tint="bands"] body[class*="sport-"] :is(.numbers, .ledger + *, .today, .today + *)::before { display: none; }
@media print {
  :root { --bg: #fff; --bg-2: #f2f2f2; --ink: #111; --body: #222; --muted: #555; --rule: #ccc; --rule-2: #aaa; --shot-bg: #eee; }
  body .ledger, body .numbers, body .today { background: none !important; }
  .family, .skip, .band .photo, .ps, .ps-picks, .ps-dialog, video, .clip .pause, .beta, .stores, .slot, .foot .marks, .explain .pause, .notes .back { display: none !important; }
  .questions details { break-inside: avoid; }
  body { background: #fff; color: #222; }
  .band { background: none; color: #111; min-height: 0; }
  .band .line, .band .note { color: #111; }
  .band .note .sig, .band .place, .band .note .stamp { color: #555; border-color: #555; }
  .clip figcaption::before { content: "Clip (plays on the screen). "; }
  .ledger li, .faq dl div, .rules ol > li, .today li, .compare tr, .parents li, .route li, .app dl div { break-inside: avoid; }
  .feature, .lock, .app, .ledger, .compare, .numbers, .today, .rules { break-inside: auto; }
  h2, h3 { break-after: avoid; }
  .shot { border-color: #999; }
  a { color: inherit; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.85em; color: #555; }
}
.ramp { margin: var(--s-3) 0 0; font-size: clamp(1.15rem, 1.7vw, 1.4rem); line-height: 1.35; color: var(--muted); letter-spacing: -0.005em; }
.ramp span { display: block; }
.ramp span + span { margin-top: 6px; }
.ramp b { color: var(--ink); font-weight: 600; }
.bigclock .side .ramp { margin-top: var(--s-2); }
.bigclock .k .clock { font: inherit; letter-spacing: inherit; color: inherit; display: inline; }
.bigclock .k .clock .colon { color: inherit; opacity: 1; }
.feature .side p strong, .numbers .intro strong, .numbers .more strong, .feature.twin p strong { color: var(--ink); font-weight: 650; }
sup.fn { font-size: 0.7em; line-height: 0; vertical-align: super; margin-left: 1px; font-family: var(--mono); }
sup.fn a { color: var(--muted); text-decoration: none; display: inline-block; min-width: 1.4em; padding: 6px 2px; margin: -6px 0; text-align: center; }
sup.fn a:hover { color: var(--ink); text-decoration: underline; }
.notes { padding: var(--s-6) 0; }
.notes h2 { font-size: 1rem; margin: 0 0 var(--s-3); }
.notes ol { margin: 0; padding: 0 0 0 1.6rem; max-width: 52rem; font-size: 0.88rem; color: var(--muted); }
.notes li { padding: 4px 0 4px 4px; }
.notes li::marker { font-family: var(--mono); color: var(--ink); }
.notes li:target { color: var(--ink); }
.notes .back { color: var(--muted); margin-left: 6px; display: inline-block; padding: 6px 2px; margin-top: -6px; margin-bottom: -6px; }
.questions { padding: var(--sec-s) 0; }
.questions h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); margin-bottom: var(--s-4); }
.questions .list { border-top: 1px solid var(--rule-2); }
.questions details { border-bottom: 1px solid var(--rule); }
.questions summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: baseline; padding: var(--s-3) 0; font-family: var(--display); font-weight: 700; font-size: 1.15rem; line-height: 1.25; color: var(--ink); letter-spacing: -0.01em; }
.questions summary::-webkit-details-marker { display: none; }
.questions summary::after { content: "+"; font-family: var(--mono); font-weight: 400; color: var(--muted); font-size: 1.1rem; }
.questions details[open] summary::after { content: "\2212"; }
.questions summary:hover::after { color: var(--ink); }
.questions details p { margin: 0 0 var(--s-3); max-width: 40rem; }
.questions .more { margin: var(--s-4) 0 0; font-size: 0.95rem; color: var(--muted); }
.questions .more a { display: inline-block; padding: 10px 0; margin: -10px 0; }
.explain { margin: var(--s-5) 0 0; padding: var(--s-3) 0 0; border-top: 1px solid var(--rule-2); max-width: 32rem; position: relative; }
.feature .side figure.explain { width: auto; max-width: 32rem; margin: var(--s-5) 0 0; justify-self: auto; } 
.explain .k { margin: 0 0 var(--s-2); padding-right: 84px; }
.explain figcaption { font-size: 0.85rem; color: var(--muted); margin-top: var(--s-2); }
.explain .pause { position: absolute; top: 6px; right: 0; appearance: none; -webkit-appearance: none; font: 500 0.82rem/1 var(--sans); color: var(--ink); background: none; border: 1px solid var(--rule-2); border-radius: 2px; min-height: 44px; min-width: 72px; padding: 0 12px; cursor: pointer; }
.explain .pause:hover { border-color: var(--ink); }
.explain .rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.explain .rows li { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: baseline; padding: 5px 0; border-bottom: 1px solid var(--rule); font-size: 1rem; color: var(--ink); }
.explain .rows li .n { font-family: var(--display); font-weight: 700; font-variant-numeric: tabular-nums; font-size: 1.1rem; }
.explain .rows li.just .who::after { content: " \2190"; color: var(--brand-text); }
.explain .h { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin: 0 0 4px; }
.explain .two { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
.explain .say { margin: var(--s-2) 0 0; min-height: 1.6em; font-size: 0.95rem; color: var(--ink); }
.explain .top { display: flex; gap: 10px 22px; align-items: baseline; flex-wrap: wrap; margin: 0 0 var(--s-2); }
.explain .top .clock { font-size: 2.6rem; }
.explain .top .score { font-family: var(--display); font-weight: 700; font-size: 1.15rem; color: var(--ink); }
.explain .chip { display: inline-flex; gap: 10px; align-items: baseline; border: 1px solid var(--ink); border-radius: 2px; padding: 6px 12px; font-size: 0.95rem; color: var(--ink); }
.explain .chip b { font-family: var(--mono); font-weight: 400; font-size: 0.74rem; letter-spacing: 0.08em; text-transform: uppercase; }
.explain .chip .clock { font-size: 1.15rem; }
.explain .chip.over { border-color: var(--rule-2); color: var(--muted); }
@media (max-width: 480px) { .explain .two { grid-template-columns: 1fr; } .explain .two > div + div { margin-top: var(--s-3); } }
.family .bar-cta { color: var(--ink); font-weight: 600; }
.family .bar-cta::after { content: "\2192"; margin-left: 6px; color: var(--muted); font-weight: 400; }
@media (max-width: 1180px) { .family .bar-cta { display: none; } }
.beta-form .opts.apps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.beta-form .opts.apps label { align-items: flex-start; min-height: 60px; padding: 10px 14px; }
.beta-form .opts.apps input { margin-top: 4px; }
.beta-form .opts.apps span { display: grid; gap: 2px; font-weight: 600; line-height: 1.25; }
.beta-form .opts.apps small { font-weight: 400; font-size: 0.82rem; color: var(--muted); }
.beta-form .opts.apps label:has(input:checked) small { color: var(--body); }
#early-access:focus { outline: none; }
@media (max-width: 340px) { .beta-form .opts.apps { grid-template-columns: 1fr; } }
.device { display: block; }
.device img { width: 100%; height: auto; display: block; }
.feature figure.dev, .app figure.dev, .hero figure.dev, .sport-hero figure.dev { width: min(var(--phone-w), 100%); }
figure.dev { --phone-w: 320px; }
.hero figure.dev, .sport-hero figure.dev { --phone-w: 330px; }
.feature.strip figure.dev { --phone-w: 290px; }
.feature figure.dev figcaption, .app figure.dev figcaption { margin-top: 8px; }
@media (min-width: 921px) {
  .sport-hero figure.dev { align-self: start; margin: var(--s-6) 0 var(--sec-s); }
  .hero figure.dev { align-self: start; margin: var(--s-6) 0 var(--s-6); }
}
@media (max-width: 920px) {
  figure.dev, .hero figure.dev, .sport-hero figure.dev, .feature.strip figure.dev { --phone-w: 320px; }
}
@media (max-width: 640px) {
  figure.dev, .hero figure.dev, .sport-hero figure.dev, .feature.strip figure.dev, .feature figure.watchcycle { justify-self: center; margin-left: auto; margin-right: auto; }
}
.desk .device.laptop { width: 100%; }
@media print { .device img { max-height: 90vh; width: auto; } }
.feature figure.watchcycle { width: min(300px, 100%); margin: 0; justify-self: center; position: relative; }
.watchcycle .stack { display: grid; }
.watchcycle .stack img { grid-area: 1 / 1; width: 100%; height: auto; display: block; opacity: 0; transition: opacity 0.45s ease; }
.watchcycle .stack img.on { opacity: 1; }
.watchcycle figcaption { margin-top: 8px; }
.watchcycle .pause { position: absolute; top: 0; right: -8px; appearance: none; -webkit-appearance: none; font: 500 0.82rem/1 var(--sans); color: var(--ink); background: none; border: 1px solid var(--rule-2); border-radius: 2px; min-height: 44px; min-width: 72px; padding: 0 12px; cursor: pointer; }
.watchcycle .pause:hover { border-color: var(--ink); }
@media (prefers-reduced-motion: reduce) { .watchcycle .stack img { transition: none; } }
@media print { .watchcycle .pause { display: none; } }
.foot nav { row-gap: 0; } 
.foot nav .scheme-ctl { display: inline-flex; align-items: center; gap: 0 4px; flex-wrap: wrap; }
.foot nav .scheme-ctl .scheme-l { color: var(--muted); margin-right: 4px; }
.foot nav .scheme-ctl .seg { display: inline-flex; gap: 2px; }
.foot nav .scheme-ctl button { appearance: none; -webkit-appearance: none; font: inherit; line-height: 1; color: var(--muted); background: none; border: 1px solid transparent; border-radius: 6px; min-height: 44px; min-width: 44px; padding: 0 10px; margin: 0; cursor: pointer; }
.foot nav .scheme-ctl button:hover { color: var(--ink); text-decoration: underline; }
.foot nav .scheme-ctl button[aria-pressed="true"] { color: var(--ink); background: var(--bg-2); border-color: var(--rule-2); }
.foot nav .scheme-ctl button:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
@media print { .scheme-ctl { display: none !important; } }
.feature.season .on-phone { display: none; }
@media (max-width: 640px) {
  .feature.season .browser .win { border: 0; border-radius: 0; background: none; }
  .feature.season .browser .bar { display: none; }
  .feature.season .on-wide { display: none; }
  .feature.season .on-phone { display: inline; }
}
.status .price { display: block; margin-top: var(--s-1); }
@media (max-width: 640px) { .status .price { display: inline; margin: 0; } .status .price::before { content: " "; } } 
.follow-main { padding: var(--sec-s) 0; }
.follow-main::after { display: none; } 
.follow-main .wrap { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: var(--s-6); }
.follow-main .fm-head h1 { max-width: 14ch; }
.follow-main .fm-head .lede { max-width: 34rem; }
.follow-main ul { margin-top: var(--s-4); }
.fm-figs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; max-width: 480px; }
.fm-figs figure { margin: 0; }
.fm-figs figcaption { font-size: 0.82rem; color: var(--muted); margin-top: 8px; }
@media (max-width: 920px) {
  .follow-main .fm-head { order: 1; } .follow-main .fm-does { order: 2; } .follow-main .fm-figs { order: 3; } .follow-main .fm-privacy { order: 4; }
}
@media (min-width: 921px) {
  .follow-main .wrap { grid-template-columns: minmax(0, 1fr) auto; column-gap: clamp(40px, 5vw, 72px); row-gap: var(--s-7); }
  .follow-main .fm-head, .follow-main .fm-does, .follow-main .fm-privacy { grid-column: 1; }
  .follow-main .fm-figs { grid-column: 2; grid-row: 1 / span 3; --phone-w: clamp(180px, 17vw, 228px); grid-template-columns: repeat(2, var(--phone-w)); gap: 20px; max-width: none; position: sticky; top: calc(var(--bar) + 24px); }
  .follow-main li { grid-template-columns: 10rem 1fr; }
}
@media (min-width: 921px) and (max-width: 1100px) { .follow-main li { grid-template-columns: 1fr; } }
