/* Theme-only layout. Everything the design system defines lives in components.css and wins
   (re-synced 2026-11-06). This file holds only what the system does not have yet; each block is
   listed in assets/css/README.md so it can go back into the design system (decision 30).
   Breakpoint: desktop from 1024px (decision 15). */

/* Page frame */
.tom-site { min-height: 100vh; display: flex; flex-direction: column; }
.tom-main { flex: 1 1 auto; }
/* LC2 item 3: the room for the fixed phone bottom nav goes on the whole page (main and footer), so the
   footer is never under the nav: nav height + the iPhone safe area. */
.tom-site { --tom-bottomnav-h: 60px; padding-bottom: calc(var(--tom-bottomnav-h) + env(safe-area-inset-bottom)); }
.tom-stack { display: flex; flex-direction: column; gap: var(--space-4); padding-top: var(--space-4); }
.tom-only-desktop { display: none; }

/* Header: responsive behaviour the system's .tom-header__inner lacks (board phone header is 56px, gap 12) */
.tom-header--sticky { position: sticky; top: 0; z-index: 30; }
.tom-header__inner--responsive { height: 56px; gap: var(--space-3); }
.tom-header__menu { width: 44px; height: 44px; margin-left: -10px; display: grid; place-items: center; background: none; border: 0; color: var(--on-band); cursor: pointer; }
.tom-header__brand { text-decoration: none; display: inline-flex; align-items: center; }
.tom-header__brand .tom-wordmark { font-size: 20px; }
.tom-header__nav { display: none; }
.tom-header__link { display: none; color: var(--on-band-muted); font: 600 14px/1 var(--font-sans); text-decoration: none; }
.tom-header__link:hover { color: var(--on-band); }

/* Phone menu drawer */
.tom-drawer { position: fixed; inset: 0; z-index: 50; background: var(--scrim, rgba(0,0,0,.5)); }
.tom-drawer[hidden] { display: none; }
.tom-drawer__panel { position: absolute; inset: 0 auto 0 0; width: min(340px, 88vw); background: var(--surface); color: var(--ink); display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-4); overflow-y: auto; }
.tom-drawer__top { display: flex; align-items: center; justify-content: space-between; background: var(--band); margin: calc(-1 * var(--space-4)) calc(-1 * var(--space-4)) 0; padding: 0 var(--space-4); height: 56px; }
.tom-drawer__close { width: 44px; height: 44px; display: grid; place-items: center; background: none; border: 0; color: var(--on-band); cursor: pointer; margin-right: -10px; }
.tom-drawer__nav { display: flex; flex-direction: column; }
.tom-drawer__nav a { padding: 14px 0; border-bottom: 1px solid var(--hairline); font: 700 20px/1 var(--font-display); color: var(--ink); text-decoration: none; }
.tom-drawer__nav a[aria-current="page"] { color: var(--accent-strong); }
.tom-drawer__end { display: flex; flex-direction: column; gap: var(--space-3); align-items: flex-start; }
.tom-drawer__end a:not(.tom-btn) { font: 600 15px/1 var(--font-sans); color: var(--ink); }

/* Light/dark toggle (decision 18) */
.tom-themetoggle { width: 36px; height: 36px; display: grid; place-items: center; background: none; border: 0; border-radius: var(--radius-md); color: var(--on-band-muted); cursor: pointer; }
.tom-themetoggle:hover { color: var(--on-band); }
.tom-drawer__toggle { color: var(--ink-muted); border: 1px solid var(--hairline); }
/* QA round 3 item 14: a tap leaves :hover stuck on phones, which turned the drawer icon white (--on-band) on the
   white drawer in light mode. In the drawer the icon follows the page ink in both modes. */
.tom-drawer__toggle:hover, .tom-drawer__toggle:focus-visible, .tom-drawer__toggle:active { color: var(--ink); }
.tom-themetoggle__light { display: none; }
[data-theme="dark"] .tom-themetoggle__light { display: inline; }
[data-theme="dark"] .tom-themetoggle__dark { display: none; }

/* Page head (board N-index: surface band, 34px title) */
.tom-pagehead { background: var(--surface); border-bottom: 1px solid var(--hairline); padding: var(--space-4) 0; }
.tom-pagehead .tom-shell { display: flex; flex-direction: column; gap: var(--space-3); }
.tom-pagehead__title { margin: 0; font: 800 34px/34px var(--font-display); text-wrap: balance; }
.tom-pagehead__desc { color: var(--ink-muted); }

/* Story row parts (the system has .tom-storyrow and __thumb; these are its text parts, board N-index) */
.tom-storylist { display: flex; flex-direction: column; }
.tom-storylist > .tom-storyrow:first-child { border-top: 0; }
.tom-storyrow__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.tom-storyrow__title { font: 700 19px/22px var(--font-display); text-wrap: balance; }
.tom-storyrow:hover .tom-storyrow__title { color: var(--accent-strong); }
.tom-storyrow__dek { font: 500 13px/18px var(--font-sans); color: var(--ink-muted); }

/* Article head and parts (board N-article: 34/35 headline, dek 17/24, byline meta 13/16) */
.tom-article-page { display: flex; flex-direction: column; gap: 18px; padding-top: 18px; max-width: 760px; }
.tom-articlehead { display: flex; flex-direction: column; gap: 10px; }
.tom-articlehead__cat { color: var(--accent-strong); }
.tom-articlehead__title { margin: 0; font: 800 34px/35px var(--font-display); text-wrap: balance; }
.tom-articlehead__dek { margin: 0; font: 500 17px/24px var(--font-sans); color: var(--ink-muted); }
.tom-byline__text { display: flex; flex-direction: column; }
.tom-byline__name a { color: var(--ink); text-decoration: none; }
.tom-byline__meta { font: 500 13px/16px var(--font-sans); color: var(--ink-muted); }
.tom-figure { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.tom-figure__img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; background: var(--surface-sunk); }
.tom-figure figcaption { font: 500 13px/18px var(--font-sans); color: var(--ink-muted); }
.tom-keypoints { padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; }
.tom-keypoints ul { margin: 0; padding-left: 20px; font: 400 15px/22px var(--font-sans); }
.tom-gold-text { color: var(--gold-text); }

/* Paywall (system .tom-paywall--article): its CTA and login link (board N-paywall: 50px full-width CTA) */
.tom-paywall__cta { height: 50px; font-size: 16px; width: 100%; justify-content: center; }
.tom-paywall__login { font: 600 14px/1 var(--font-sans); color: var(--accent-strong); }
.tom-paywall__text { margin: 0; color: var(--ink-muted); }

/* Video player parts (system .tom-player / --locked): iframe fill and locked-panel text (board V-single) */
.tom-player > iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.tom-player__lock { color: var(--gold); }
.tom-player__title { font: 800 22px/24px var(--font-display); }
.tom-player__login { color: var(--on-band-muted); font: 600 14px/1 var(--font-sans); }

/* Generic page, placeholder, 404 */
.tom-page { padding-top: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); max-width: 900px; }
.tom-page__title { margin: 0; font: 800 34px/35px var(--font-display); text-wrap: balance; }
.tom-placeholder, .tom-notfound { padding-top: var(--space-8); padding-bottom: var(--space-8); display: flex; flex-direction: column; gap: var(--space-3); align-items: flex-start; max-width: 640px; }
.tom-notfound .tom-search { width: 100%; }
.tom-notfound__links { display: flex; flex-wrap: wrap; gap: var(--space-2); }

/* Pagination */
.tom-pagination { display: flex; flex-wrap: wrap; gap: 6px; padding: var(--space-4) 0; }
.tom-pagination .page-numbers { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 12px; border: 1px solid var(--hairline); border-radius: var(--radius-md); background: var(--surface); color: var(--ink); font: 600 14px/1 var(--font-sans); text-decoration: none; }
.tom-pagination .current { background: var(--ink); color: var(--surface); border-color: var(--ink); }

/* Footer parts (system .tom-footer is the band; board desktop footer: flex, gap 24, 600 14px) */
.tom-footer--page { margin-top: var(--space-8); }
.tom-footer__inner { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; font: 600 14px/1.4 var(--font-sans); padding-left: 0; padding-right: 0; }
.tom-footer__nav { display: flex; flex-wrap: wrap; gap: 24px; }
.tom-footer__end { margin-left: auto; display: flex; gap: 16px; align-items: center; flex-wrap: wrap; color: var(--on-band-muted); }
.tom-footer__system { background: none; border: 0; padding: 0; color: var(--on-band-muted); font: inherit; cursor: pointer; text-decoration: underline; }

/* Phone bottom nav: fixed to the viewport, phones only (boards place it at the foot of the phone frame) */
.tom-bottomnav--fixed { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; padding-bottom: env(safe-area-inset-bottom); }

/* Desktop from 1024px (decision 15) */
@media (min-width: 1024px) {
	.tom-header__inner--responsive { height: 60px; gap: var(--space-6); }
	.tom-header__menu { display: none; }
	.tom-header__brand .tom-wordmark { font-size: 24px; }
	.tom-header__nav { display: flex; }
	.tom-header__link { display: inline; }
	.tom-only-desktop { display: inline; }
	.tom-bottomnav--fixed { display: none; }
	.tom-site { padding-bottom: 0; }
	.tom-pagehead__title { font-size: 44px; line-height: 44px; }
	.tom-article-page { padding-top: 28px; gap: 22px; }
	.tom-articlehead__title { font-size: 44px; line-height: 46px; }
	.tom-page { padding-top: 28px; }
	.tom-player--rounded { border-radius: 8px; overflow: hidden; }   /* board V-single-desktop: 8px; phone: 0 */
}

/* ---------- Rankings pages (T3; boards H, HD, H-all-free). Theme-only parts around the system classes. ---------- */
.tom-only-phone { }
.tom-hide-phone { display: none; }
.tom-rk-layout { padding-top: var(--space-3); padding-bottom: var(--space-6); }
.tom-rk-aside { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.tom-rk-controls { padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); }
.tom-rk-title { margin: 0; font: 800 34px/34px var(--font-display); text-wrap: balance; }
.tom-rk-viewall { width: 100%; justify-content: center; height: 44px; }
.tom-rk-main { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.tom-rk-head { flex-wrap: wrap; align-items: center; }
.tom-rk-headmeta { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.tom-rk-share { margin-left: auto; }
.tom-rk-list { list-style: none; margin: 0; padding: 0; }
.tom-rk-who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tom-rk-name { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tom-rk-name .tom-wrestler__name { font-size: 16px; line-height: 20px; }
.tom-rk-record { font-size: 17px; font-weight: 700; }
.tom-rk-adrow { list-style: none; border-top: 1px solid var(--hairline); }
.tom-rk-locked { overflow: hidden; }
.tom-rk-locked .tom-rk-list { border-bottom: 1px solid var(--hairline); }
.tom-rk-paywall { max-width: none; border: 0; border-radius: 0; padding: 20px var(--space-4); }
.tom-rk-paywall .tom-paywall__cta { height: 48px; }
.tom-rk-freelink { width: 100%; justify-content: center; height: 44px; }
.tom-weightgrid__btn svg { margin-top: -2px; }
.tom-rk-pinbar { position: sticky; top: 56px; z-index: 20; display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-2) 0; background: var(--paper); border-bottom: 1px solid var(--hairline); }
.tom-rk-pinbar[hidden] { display: none; }
.tom-rk-pinbar .tom-weighthead { align-items: center; gap: var(--space-2); }
.tom-rk-pinbar .tom-weighthead .tom-btn { margin-left: auto; }
.tom-rk-pinbar .tom-weightgrid--pinned { position: static; padding: 0; border: 0; background: none; }
.tom-rk-search { position: relative; }
.tom-rk-results { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 25; max-height: 340px; overflow-y: auto; background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-md); }
.tom-rk-result { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 10px 12px; color: var(--ink); text-decoration: none; }
.tom-rk-result + .tom-rk-result { border-top: 1px solid var(--hairline); }
.tom-rk-result:hover { background: var(--accent-soft); }
.tom-rk-result__name { font: 700 15px/20px var(--font-sans); }
.tom-rk-subtitle { margin: 0; font: 800 26px/28px var(--font-display); }
.tom-rk-weightcard { overflow: hidden; }
.tom-rk-cardmeta { display: flex; align-items: center; gap: var(--space-2); font: 600 13px/1 var(--font-sans); color: var(--on-band-muted); }
.tom-rk-cardfoot { padding: 0 var(--space-4) var(--space-4); }
.tom-rk-cardfoot .tom-btn { width: 100%; justify-content: center; }
.tom-rk-hero { display: flex; flex-direction: column; gap: 14px; max-width: 760px; }
.tom-rk-herotitle { margin: 0; font: 800 36px/36px var(--font-display); color: var(--on-band); }
.tom-rk-landing { display: grid; gap: var(--space-4); padding-top: var(--space-4); padding-bottom: var(--space-6); }
.tom-rk-landingcard { padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); }
.tom-rk-landingcard p { margin: 0; }
@media (min-width: 1024px) {
	.tom-only-phone { display: none; }
	.tom-hide-phone { display: block; }
	.tom-rk-pinbar, .tom-rk-pinbar[hidden] { display: none; }
	.tom-rk-title { font-size: 44px; line-height: 44px; }
	.tom-rk-herotitle { font-size: 56px; line-height: 56px; }
	.tom-rk-landing { grid-template-columns: 1fr 1fr; }
	.tom-rk-locked .tom-locked__rows .tom-placeholder-row { padding: 14px 20px; }
}

.tom-rk-pagehead { display: flex; flex-direction: column; gap: 4px; padding-top: var(--space-4); }

/* ---------- Articles, videos and the two indexes (T4; boards N-article, V-single, N-index, V-index).
   Theme-only parts around the system classes (.tom-layout--sidebar/--article/--wide, .tom-rank,
   .tom-adslot, .tom-storyrow, .tom-article, .tom-video-thumb, .tom-videogrid, .tom-videorow, .tom-player). ---------- */
.tom-article-layout, .tom-video-layout, .tom-index-layout { padding-bottom: var(--space-6); }
.tom-article-page { max-width: none; min-width: 0; }
.tom-articlehead__byline { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tom-articlehead__byline .tom-share { margin-left: auto; }
.tom-share { display: flex; gap: 8px; flex-wrap: wrap; }
.tom-share .tom-btn svg { margin-right: 6px; }
.tom-share.tom-hide-phone, .tom-newsgrid.tom-hide-phone, .tom-videogrid.tom-hide-phone { display: none; }   /* these set their own display; keep the phone/desktop helpers winning */
.tom-prose > .tom-adslot { margin: 4px 0; }
.tom-post-aside { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.tom-section-title { margin: 0 0 4px; font: 800 24px/28px var(--font-display); }
.tom-morestories .tom-storylist > .tom-storyrow:first-child { border-top: 1px solid var(--hairline); }

/* "Wrestlers in this story/video" (board: grid 34px 1fr auto, rows 9px, hairline between) */
.tom-tagged { padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.tom-tagged__list { list-style: none; margin: 0; padding: 0; }
.tom-tagged__row { display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: center; padding: 9px 0; }
.tom-tagged__row + .tom-tagged__row { border-top: 1px solid var(--hairline); }
.tom-tagged__rank { min-width: 28px; height: 26px; padding: 0 4px; font-size: 17px; }
span.tom-tagged__rank:not(.tom-rank) { display: block; }
.tom-tagged__who { display: flex; flex-direction: column; min-width: 0; }
.tom-tagged__who .tom-wrestler__name { font-size: 15px; line-height: 19px; }
.tom-tagged__school { font: 500 12px/16px var(--font-sans); color: var(--ink-muted); }
.tom-tagged__meta { font: 600 12px/1 var(--font-sans); color: var(--ink-muted); text-decoration: none; white-space: nowrap; }

/* Video page */
.tom-video-main { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.tom-player--bleed { margin: 0 calc(-1 * var(--space-4)); }
.tom-player--locked.tom-player--bleed { min-height: 220px; }
.tom-videohead { display: flex; flex-direction: column; gap: 8px; }
.tom-videohead__title { margin: 0; font: 800 30px/32px var(--font-display); text-wrap: balance; }
.tom-videohead__desc { font: 400 16px/24px var(--font-sans); color: var(--ink-muted); }
.tom-videohead__desc p { margin: 0 0 8px; }
.tom-videohead__meta { font: 500 13px/16px var(--font-sans); color: var(--ink-muted); }
.tom-related { display: flex; flex-direction: column; gap: var(--space-3); padding-top: var(--space-2); }
.tom-related__head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); }
.tom-related__grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tom-videocard { display: flex; flex-direction: column; gap: 8px; color: var(--ink); text-decoration: none; min-width: 0; }
.tom-videocard__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.tom-videocard__title { font: 700 17px/20px var(--font-display); text-wrap: balance; }
.tom-videocard:hover .tom-videocard__title { color: var(--accent-strong); }
.tom-videocard.tom-videorow { display: grid; }
.tom-video-thumb { display: block; }
.tom-video-thumb__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tom-video-thumb__lock svg { margin-right: 4px; }

/* Index pages (/news/, /videos/) */
.tom-indexhead { display: flex; flex-direction: column; gap: var(--space-3); padding-top: var(--space-4); padding-bottom: var(--space-4); }
.tom-indexhead__title { margin: 0; font: 800 34px/34px var(--font-display); }
.tom-index-main { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.tom-newslead { display: grid; overflow: hidden; color: var(--ink); text-decoration: none; }
.tom-newslead__img { width: 100%; height: auto; object-fit: cover; }
.tom-newslead__body { display: flex; flex-direction: column; gap: 8px; padding: var(--space-4); }
.tom-newslead__title { margin: 0; font: 800 26px/28px var(--font-display); text-wrap: balance; }
.tom-newslead__dek { font-size: 15px; line-height: 21px; color: var(--ink-muted); }
img.tom-article__media { width: 100%; height: auto; object-fit: cover; }
.tom-index-ad { padding: 14px 0; border-top: 1px solid var(--hairline); }
.tom-newsgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.tom-newsgrid .tom-article__title { font-size: 21px; line-height: 24px; }

/* Rankings Watch (N-index sidebar): #1 by class at one weight */
.tom-rwatch { overflow: hidden; }
.tom-rwatch__controls { display: flex; align-items: center; gap: 10px; padding: 0 16px 12px; }
.tom-rwatch .tom-segment__btn { display: inline-grid; place-items: center; height: 34px; padding: 0 12px; text-decoration: none; }
.tom-rwatch__stepper { margin-left: auto; gap: 4px; }
.tom-rwatch__step { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--radius-md); border: 1px solid var(--hairline); background: var(--surface); color: var(--ink); }
span.tom-rwatch__step, .tom-rwatch__step[aria-disabled="true"] { visibility: hidden; }
.tom-rwatch .tom-stepper__value { min-width: 52px; text-align: center; }
.tom-rwatch__list { list-style: none; margin: 0; padding: 0; }
.tom-rwatch__row { display: grid; grid-template-columns: 64px 1fr auto; gap: 10px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--hairline); }
.tom-rwatch__row > .tom-label { color: var(--ink); }
.tom-rwatch__who { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.tom-rwatch__name { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.tom-rwatch__name .tom-wrestler__name { font-size: 16px; }
.tom-rwatch__school { display: flex; align-items: center; gap: 6px; font: 500 13px/16px var(--font-sans); color: var(--ink-muted); }
.tom-rwatch__foot { padding: 12px 16px 16px; }
.tom-rwatch__foot .tom-btn { width: 100%; justify-content: center; }
.tom-tipcard { padding: 18px; display: flex; flex-direction: column; gap: 8px; }
.tom-tipcard p { margin: 0; }
.tom-tipcard__title { font: 800 22px/24px var(--font-display); }
.tom-tipcard .tom-btn { align-self: flex-start; }

/* Video index */
.tom-videoindex { display: flex; flex-direction: column; gap: var(--space-5, 20px); padding-bottom: var(--space-6); }
.tom-videofeature { display: flex; flex-direction: column; gap: 10px; color: var(--ink); text-decoration: none; }
.tom-videofeature__body { display: flex; flex-direction: column; gap: 6px; }
.tom-videofeature__title { font: 800 26px/28px var(--font-display); text-wrap: balance; }
.tom-videofeature__dek { font-size: 15px; line-height: 21px; color: var(--ink-muted); }
.tom-videolist { display: flex; flex-direction: column; }
.tom-videolist > .tom-videorow { padding: 12px 0; border-top: 1px solid var(--hairline); }
.tom-videolist > .tom-videorow .tom-videocard__title { font-size: 16px; line-height: 19px; }

@media (min-width: 1024px) {
	.tom-share.tom-hide-phone { display: flex; }
	.tom-share.tom-only-phone, .tom-videolist.tom-only-phone, .tom-storylist.tom-only-phone { display: none; }
	.tom-newsgrid.tom-hide-phone { display: grid; }
	.tom-videogrid.tom-hide-phone { display: grid; }
	.tom-article-layout, .tom-video-layout, .tom-index-layout { padding-top: 0; padding-bottom: 56px; }
	.tom-article-page { padding-top: 32px; }
	.tom-video-layout { padding-top: 28px; }
	.tom-post-aside { padding-top: 32px; }
	.tom-video-layout .tom-post-aside, .tom-team-layout .tom-post-aside { padding-top: 0; }   /* team: top lines up with the tiles (QA round 3 item 9) */
	.tom-player--bleed { margin: 0; }
	.tom-videohead__title { font-size: 40px; line-height: 42px; }
	.tom-related__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.tom-related__grid--article { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tom-indexhead { flex-direction: row; align-items: flex-end; gap: 24px; flex-wrap: wrap; padding-top: 28px; padding-bottom: 24px; }
	.tom-indexhead__title { font-size: 48px; line-height: 48px; }
	.tom-index-main { gap: 24px; }
	.tom-newslead { grid-template-columns: 1.1fr 1fr; }
	.tom-newslead__img { height: 100%; min-height: 340px; aspect-ratio: auto; }
	.tom-newslead__body { padding: 28px; justify-content: center; gap: 10px; }
	.tom-newslead__title { font-size: 38px; line-height: 38px; }
	.tom-index-main .tom-pagination { align-self: center; }
	.tom-videofeature { display: grid; grid-template-columns: 1.4fr 1fr; gap: 28px; align-items: center; }
	.tom-videofeature__title { font-size: 38px; line-height: 38px; }
}

/* ---------- Wrestler profile v1 and legacy profiles (T5; boards P-phone, P-phone-locked, P-desktop) ---------- */
.tom-profile-band { background: var(--surface); border-bottom: 1px solid var(--hairline); }
.tom-profile-head { display: flex; flex-direction: column; gap: 14px; padding-top: 16px; padding-bottom: 20px; }
.tom-profile-id { display: flex; gap: 14px; align-items: center; }
.tom-profile-mark { flex: none; }
.tom-profile-mono, .tom-profile-logo { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--surface-sunk); border: 1px solid var(--hairline); font: 800 24px/1 var(--font-display); object-fit: contain; }
.tom-profile-who { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.tom-profile-meta { font: 600 14px/18px var(--font-sans); color: var(--ink-muted); }
.tom-profile-pills { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.tom-profile-pills .tom-profilehead__rank svg { margin-right: 6px; }
.tom-profile-note { font: 600 13px/18px var(--font-sans); color: var(--ink-muted); }
.tom-profile-side { display: flex; flex-direction: column; gap: 10px; }
.tom-profile-stats .tom-statstrip__cell { padding: 10px 8px; }
.tom-profile-stats .tom-statstrip__num { display: flex; align-items: center; justify-content: center; min-height: 26px; font-size: 24px; }
.tom-profile-lock { color: var(--ink-muted); }
.tom-profile-sub { font: 500 11px/14px var(--font-sans); color: var(--ink-muted); }
.tom-profile-cta { justify-content: center; height: 48px; }
.tom-profile-share { justify-content: flex-start; }
.tom-profile-layout { padding-top: var(--space-4); padding-bottom: var(--space-6); }
.tom-profile-main { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.tom-profile-list { overflow: hidden; }
.tom-profile-list__text { margin: 0; padding: 0 var(--space-4); color: var(--ink-muted); }
.tom-profile-list__foot { padding: var(--space-3) var(--space-4) var(--space-4); }
.tom-profile-list .tom-card__head + .tom-profile-list__text { padding-top: 0; }
.tom-profile-list > .tom-profile-list__text:first-child { padding-top: var(--space-4); }
.tom-profile-soon { margin: 0; font-size: 14px; }
.tom-legacy-head { display: flex; flex-direction: column; gap: 10px; padding-top: 16px; padding-bottom: 12px; }
.tom-legacy-body { display: flex; flex-direction: column; gap: var(--space-4); padding-bottom: var(--space-6); }
@media (min-width: 1024px) {
	.tom-profile-head { display: grid; grid-template-columns: minmax(0, 1fr) 520px; grid-template-areas: "crumb crumb" "id side"; column-gap: 24px; row-gap: 16px; align-items: center; padding-top: 20px; padding-bottom: 28px; }
	.tom-profile-head > .tom-breadcrumb { grid-area: crumb; }
	.tom-profile-id { grid-area: id; gap: 24px; }
	.tom-profile-side { grid-area: side; }
	.tom-profile-mono, .tom-profile-logo { width: 104px; height: 104px; font-size: 36px; }
	.tom-profile-head .tom-profilehead__name { font-size: 56px; line-height: 54px; }
	.tom-profile-meta { font-size: 16px; line-height: 20px; }
	.tom-profile-pills .tom-profilehead__rank { height: 28px; padding: 0 12px; font: 800 17px/1 var(--font-display); }
	.tom-profile-share { justify-content: flex-end; }
	.tom-profile-layout { padding-top: 28px; padding-bottom: 56px; }
}

/* ---------- Team page (T6; boards T-phone, T-phone-out, T-desktop). Band, id block and stats reuse the profile parts. ---------- */
.tom-team-head { display: flex; flex-direction: column; gap: 14px; padding-top: 16px; padding-bottom: 20px; }
.tom-team-headside { display: flex; flex-direction: column; gap: 10px; }
.tom-team-gate { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: var(--radius-md); background: var(--surface-sunk); font: 600 14px/18px var(--font-sans); }
.tom-team-stats .tom-statstrip__num { font-size: 26px; }
.tom-team-stats .tom-statstrip__cell { padding: 12px 8px; }
.tom-team-roster { display: flex; flex-direction: column; gap: 8px; }
.tom-team-roster .tom-rank { min-width: 28px; height: 24px; font-size: 15px; }
.tom-team-lineup { display: flex; flex-direction: column; gap: 14px; padding-bottom: 16px; }
.tom-team-lineup > :not(.tom-card__head) { margin: 0 16px; }
.tom-team-lineup__row { display: flex; flex-direction: column; gap: 6px; }
.tom-team-lineup__w { display: flex; flex-direction: column; gap: 3px; align-items: stretch; min-width: 0; }
.tom-team-lineup__label { font: 600 9px/1 var(--font-sans); color: var(--ink-muted); text-align: center; font-variant-numeric: tabular-nums; }

.tom-team-lineup__key { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 6px; vertical-align: -2px; }
.tom-team-map { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; }
.tom-team-map__text { display: flex; flex-direction: column; gap: 2px; }
.tom-team-map__name { font: 700 15px/19px var(--font-sans); }
@media (min-width: 1024px) {
	.tom-team-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "crumb crumb" "id side"; column-gap: 24px; row-gap: 16px; align-items: center; padding-top: 20px; padding-bottom: 28px; }
	.tom-team-head > .tom-breadcrumb { grid-area: crumb; }
	.tom-team-head .tom-profile-id { grid-area: id; }
	.tom-team-headside { grid-area: side; align-items: flex-end; }
	.tom-team-head .tom-profilehead__name { font-size: 56px; line-height: 54px; }
	.tom-team-lineup__label { font-size: 10px; }
}

/* ---------- Homepage (T7; boards HP-phone, HP-desktop) ---------- */
.tom-home-hero { padding: 0; }   /* the inner .tom-shell sets the padding */
.tom-home-hero__inner { display: flex; flex-direction: column; gap: 14px; padding-top: 28px; padding-bottom: 32px; }
.tom-home-hero__label { color: var(--accent); }
.tom-home-hero__title { margin: 0; font: 800 36px/36px var(--font-display); color: var(--on-band); text-wrap: balance; }
.tom-home-hero__row { display: flex; flex-direction: column; gap: 10px; max-width: 760px; }
.tom-home-hero__links { display: flex; gap: 10px; }
.tom-home-hero__links .tom-btn { flex: 1; justify-content: center; height: 48px; }
.tom-home-body { display: flex; flex-direction: column; gap: 28px; padding-top: 20px; padding-bottom: var(--space-6); }
.tom-home-top { display: grid; gap: 20px; align-items: start; }   /* QA 4: Rankings Watch sizes to its rows, not to the lead photo */
.tom-home-sechead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
.tom-home-videos { display: flex; flex-direction: column; gap: 10px; }
@media (min-width: 1024px) {
	.tom-home-hero__inner { padding-top: 40px; padding-bottom: 44px; }
	.tom-home-hero__title { font-size: 56px; line-height: 54px; }
	.tom-home-hero__row { flex-direction: row; flex-wrap: wrap; }
	.tom-home-hero__row .tom-search { flex: 1 1 320px; }
	.tom-home-hero__links { flex: 1 1 260px; }
	.tom-home-hero__links .tom-btn { height: 50px; }
	.tom-home-body { padding-top: 28px; gap: 32px; }
	.tom-home-top { grid-template-columns: 420px minmax(0, 1fr); gap: 24px; }
	.tom-home-lead { grid-template-columns: 1fr; }
	.tom-home-lead .tom-newslead__img { min-height: 260px; }
}

/* ---------- Launch-candidate-2 (2026-11-09). Listed in README for the design system. ---------- */

/* Phone menu: wordmark goes home (item 4); Log in + Get All Access side by side, half width each (item 5) */
.tom-drawer__brand { color: inherit; text-decoration: none; display: inline-flex; align-items: center; }
.tom-drawer__actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); width: 100%; }
.tom-drawer__actions--one { grid-template-columns: 1fr; }
.tom-drawer__actions .tom-btn { width: 100%; justify-content: center; }
.tom-drawer__end { align-items: stretch; }
.tom-drawer__end .tom-drawer__toggle { align-self: flex-start; }

/* School logos sit in a white disc in light and dark mode (item 6) */
.tom-logo-disc { background: #fff; border-radius: 50%; padding: 3px; box-sizing: border-box; object-fit: contain; border: 1px solid var(--hairline); }
img.tom-profile-logo.tom-logo-disc { padding: 10px; }

/* School name -> team page (item 7): reads as text until hovered */
.tom-team-link { color: inherit; text-decoration: none; }
.tom-team-link:hover { color: var(--accent-strong); text-decoration: underline; }

/* Search results: team first, then wrestlers, each with a small school mark (item 8) */
.tom-rk-result--team, .tom-rk-result--wrestler { flex-direction: row; align-items: center; gap: 10px; }
.tom-rk-result__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tom-rk-result__mark { flex: none; width: 28px; height: 28px; }
.tom-rk-result--team .tom-rk-result__mark { width: 36px; height: 36px; }
.tom-rk-result__kind { font: 600 11px/1 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); }
.tom-rk-result--unranked .tom-rk-result__name { font-weight: 600; }

/* Desktop two-line teaser under story titles (item 11) */
.tom-storyrow__teaser { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tom-storyrow__teaser.tom-hide-phone { display: none; }
@media (min-width: 1024px) { .tom-storyrow__teaser.tom-hide-phone { display: -webkit-box; } }

/* Load more (item 12) */
.tom-loadmore { display: flex; align-items: center; justify-content: center; gap: var(--space-4); padding: var(--space-5) 0 var(--space-4); }
.tom-loadmore__btn { min-width: 220px; justify-content: center; }
.tom-loadmore__newer { font: 600 14px/1 var(--font-sans); color: var(--ink-muted); }
.tom-loadmore[aria-busy="true"] .tom-loadmore__btn { opacity: .6; pointer-events: none; }

/* Locked video: the post's own image behind the lock, darkened (item 14) */
.tom-player--thumb { position: relative; overflow: hidden; }
.tom-player--thumb .tom-player__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.tom-player--thumb::before { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(8, 12, 20, .72); }
.tom-player--thumb > :not(.tom-player__bg) { position: relative; z-index: 2; }

/* WrestlerFinder house ad (item 19): logo, no "Ad" label, button in WrestlerFinder teal (#007C8A) */
.tom-adslot__logo { height: 28px; width: auto; max-width: 100%; object-fit: contain; object-position: left center; justify-self: start; }
.tom-adslot__logo--ondark, [data-theme="dark"] .tom-adslot__logo--onlight { display: none; }
[data-theme="dark"] .tom-adslot__logo--ondark { display: block; }
.tom-adslot--inline > * { grid-column: 1; }   /* logo, title, text stacked left; button right */
.tom-adslot--inline > .tom-adslot__btn { grid-column: 2; grid-row: 1 / span 3; }
.tom-adslot--wf .tom-adslot__btn { background: var(--wf-teal, var(--ink)); color: #fff; border-color: transparent; }

/* Forms v0 (items 16, 30): tom-content's [tom_form] — correction, tip, contact */
.tom-form { display: flex; flex-direction: column; gap: 16px; max-width: 640px; margin: var(--space-4) 0; }
.tom-form__intro { display: flex; flex-direction: column; gap: 6px; }
.tom-form__intro p { margin: 0; }
.tom-form__about { display: flex; flex-direction: column; gap: 2px; margin: 0 0 4px; padding: 12px 14px; border: 1px solid var(--hairline); border-left: 4px solid var(--accent); border-radius: var(--radius-md); background: var(--surface); }   /* QA round 3 item 18 */
.tom-form__about-who { font: 800 22px/26px var(--font-display); color: var(--ink); }
.tom-form__about-who a { color: inherit; text-decoration: none; }
.tom-form__about-school { font: 600 16px/20px var(--font-sans); color: var(--ink-muted); }
.tom-form__field { display: flex; flex-direction: column; gap: 6px; }
.tom-form__label { font: 600 14px/18px var(--font-sans); color: var(--ink); }
.tom-form__input { width: 100%; min-height: 48px; padding: 0 14px; box-sizing: border-box; border: 1px solid var(--hairline); border-radius: var(--radius-md); background: var(--surface); color: var(--ink); font: 500 16px/1.4 var(--font-sans); }
.tom-form__input--area { padding: 12px 14px; min-height: 140px; resize: vertical; }
.tom-form__input:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.tom-form__field--error .tom-form__input { border-color: var(--danger, #b42318); }
.tom-form__help { font: 500 13px/18px var(--font-sans); color: var(--ink-muted); }
.tom-form__error { font: 600 13px/18px var(--font-sans); color: var(--danger, #b42318); }
.tom-form__error--form { margin: 0; padding: 10px 14px; border: 1px solid var(--danger, #b42318); border-radius: var(--radius-md); }
.tom-form__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.tom-form__submit { align-self: flex-start; min-width: 200px; justify-content: center; }
.tom-form--done .tom-form__done { margin: 0; padding: 14px 16px; background: var(--accent-soft); border-radius: var(--radius-md); font: 600 15px/22px var(--font-sans); color: var(--ink); }
.tom-turnstile { min-height: 65px; }
.tom-correction-link { margin: var(--space-4) 0 0; font: 600 14px/20px var(--font-sans); }
.tom-correction-link a { color: var(--ink-muted); }

/* ---------- QA fixes (Jonathan's desktop walkthrough, 2026-11-09) ---------- */

/* 1: one WrestlerFinder logo at a time (light pages / dark mode) */
.tom-adslot .tom-adslot__logo--ondark { display: none !important; }
[data-theme="dark"] .tom-adslot .tom-adslot__logo--onlight { display: none !important; }
[data-theme="dark"] .tom-adslot .tom-adslot__logo--ondark { display: block !important; }

/* 7: the header is always dark: fixed light colours for hover and the active link in both modes */
.tom-header .tom-nav a:hover, .tom-header .tom-nav a:focus-visible { color: #ffffff; }
.tom-header .tom-nav a[aria-current="page"], .tom-header .tom-nav a[aria-current="page"]:hover { color: var(--accent); border-bottom-color: var(--accent); }   /* QA round 3 item 15: active item blue, as in the phone menu */
.tom-header .tom-header__link:hover, .tom-header .tom-header__link:focus-visible { color: #ffffff; }

/* 8: team tiers in steps of 10 need five visible steps (the system has data-1..4): Top 10 data-1,
   Top 20 data-2, Top 30 a step between data-2 and data-3, Top 40 data-3, Top 50 data-4 with an edge */
:root, [data-theme="light"] { --tom-data-2b: #6a8fbc; }
[data-theme="dark"] { --tom-data-2b: #56789f; }
.tom-team-page .tom-tier--1, .tom-team-lineup__cell--1 { background: var(--data-1); color: var(--on-data-strong); }
.tom-team-page .tom-tier--2, .tom-team-lineup__cell--2 { background: var(--data-2); color: var(--on-data-strong); }
.tom-team-page .tom-tier--3, .tom-team-lineup__cell--3 { background: var(--tom-data-2b); color: var(--on-data-strong); }
.tom-team-page .tom-tier--4, .tom-team-lineup__cell--4 { background: var(--data-3); color: var(--ink); }
.tom-team-page .tom-tier--5, .tom-team-lineup__cell--5 { background: var(--data-4); color: var(--ink); box-shadow: inset 0 0 0 1px var(--data-3); }

/* 9: boys and girls roster tables share fixed column widths */
.tom-team-table { table-layout: fixed; width: 100%; }
.tom-team-table__wt { width: 64px; }
.tom-team-table__gr { width: 56px; }
.tom-team-table__rec { width: 72px; }
.tom-team-table__rank { width: 96px; }
@media (min-width: 1024px) { .tom-team-table__gr { width: 72px; } .tom-team-table__rec { width: 88px; } .tom-team-table__rank { width: 110px; } }
.tom-team-table td { overflow: hidden; text-overflow: ellipsis; }

/* ---------- Profile results (LC-3, 2026-11-09): new for the design system ---------- */
.tom-profile-main { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.tom-prof-glance { grid-auto-flow: row; grid-template-columns: 1fr 1fr; }
.tom-prof-glance .tom-statstrip__cell:nth-child(3) { border-left: 0; }
.tom-prof-glance .tom-statstrip__cell:nth-child(n+3) { border-top: 1px solid var(--hairline); }
.tom-prof-last5 { display: inline-flex; flex-wrap: nowrap; gap: 3px; justify-content: center; padding: 3px 0; white-space: nowrap; }
.tom-prof-last5 .tom-result.tom-prof-pill { flex: none; min-width: 24px; width: 24px; height: 24px; padding: 0; }
.tom-prof-locked .tom-statstrip__num { color: var(--ink-muted); }
.tom-prof-cols { display: grid; gap: var(--space-4); }
.tom-prof-wins, .tom-prof-career { display: flex; flex-direction: column; gap: 10px; padding-bottom: var(--space-4); overflow: hidden; }
.tom-prof-wins__bars { display: flex; flex-direction: column; gap: 10px; padding: 0 var(--space-4); }
.tom-prof-wins__ff { margin: 0; padding: 0 var(--space-4); }
.tom-prof-career { padding-bottom: 0; gap: 0; }
.tom-prof-careerrows { display: flex; flex-direction: column; }
.tom-prof-careerrow { grid-template-columns: 44px minmax(0, 1fr) auto auto; }
.tom-prof-careerrow__season { font: 700 14px/18px var(--font-sans); color: var(--ink); font-variant-numeric: tabular-nums; }
.tom-prof-careerrow__stat { display: flex; flex-direction: column; align-items: flex-end; min-width: 52px; }
.tom-prof-careerrow__num { font: 800 18px/20px var(--font-display); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tom-prof-partial { margin: 0; }
.tom-prof-results { display: flex; flex-direction: column; gap: var(--space-3); }
.tom-prof-season { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-2); }
.tom-prof-season .tom-section-title { margin: 0; }
.tom-prof-log { overflow: hidden; }
.tom-prof-event { display: flex; justify-content: space-between; gap: var(--space-3); align-items: baseline; text-transform: none; letter-spacing: 0; }
.tom-prof-event__name { font: 700 14px/18px var(--font-sans); color: var(--ink); }
.tom-prof-event__meta { font: 600 12px/16px var(--font-sans); color: var(--ink-muted); white-space: nowrap; }
.tom-prof-log .tom-matchrow { grid-template-columns: 36px 1fr auto; }
.tom-prof-log .tom-matchrow .tom-result { min-width: 28px; }
.tom-prof-opp { display: flex; flex-direction: column; min-width: 0; }
.tom-prof-opp__name { font: 700 15px/20px var(--font-sans); color: var(--ink); }
.tom-prof-log .tom-matchrow__opprank { text-decoration: none; color: var(--ink); }
@media (min-width: 1024px) {
	.tom-prof-glance { grid-auto-flow: column; grid-template-columns: none; }
	.tom-prof-glance .tom-statstrip__cell:nth-child(3) { border-left: 1px solid var(--hairline); }
	.tom-prof-glance .tom-statstrip__cell:nth-child(n+3) { border-top: 0; }
	.tom-prof-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); align-items: start; }
}

/* Rankings Watch "Jump to a weight" (home; 2026-11-09): the 7x2 weight grid for the shown gender, Class 1 links */
.tom-rwatch__jump { display: flex; flex-direction: column; gap: 8px; padding: var(--space-3) var(--space-4) var(--space-4); border-top: 1px solid var(--hairline); }
.tom-rwatch__jump .tom-weightgrid { padding: 0; border: 0; background: none; }
.tom-form--done { gap: var(--space-3); }
.tom-form__back { align-self: flex-start; width: auto; max-width: max-content; flex: none; }   /* QA round 3 item 20: sized to its text */
