/* ==========================================================================
   ICE HOCKEY — assets/css/teams.css
   Component internals for the TEAM block family (includes/blocks-team.php):
   team-hero, team-record, team-roster, team-schedule, team-grid, team-leaders,
   team-strip — plus the shared `.sfih-team-cell` atom that standings.php emits.
   --------------------------------------------------------------------------
   LOADS AFTER assets/ice-hockey.css AND DEPENDS ON IT.
   ice-hockey.css owns the tokens (:root --sfih-*), the base resets, the depth
   ladder, and the shared atoms (.sfih-card .sfih-panel .sfih-crest .sfih-face
   .sfih-chip .sfih-record .sfih-table .sfih-scroll .sfih-strip .sfih-grid …).
   NOTHING here re-states a working rule from that file. This sheet only fills
   in the component internals the block callbacks actually emit, and overrides
   ice-hockey.css in the two places where the markup drifted away from it:

     1. `.sfih-bar` — ice-hockey.css styles it as the FILL inside `.sfih-track`
        (`width: var(--sfih-pct, 0%)`), but stepfox_ih_p3_bar() emits it as the
        TRACK, with a `.sfih-bar-fill` child carrying an inline width. Left
        alone the win-pct bars render 0px wide. Re-stated as a track ONLY on
        the two bars this family owns (.sfih-card-bar, .sfih-record-bar);
        `.sfih-bar-fill` itself belongs to another sheet and is not touched.
     2. `.sfih-strip__track / __item` in ice-hockey.css never match: the PHP
        emits the hyphenated `.sfih-strip-track / -item` inside a
        `.sfih-strip-viewport` that ice-hockey.css does not know about at all.

   RULES OBEYED (mirrors the header of ice-hockey.css)
   -------------------------------------------------
   * Colour ONLY through `--sfih-*` tokens or `color-mix()` of them. There is
     not one literal hex, rgb() or hsl() in this file — the site has a working
     visitor light/dark toggle (`html.sfih-light`) and every literal would be a
     light-mode bug. Team livery arrives per-card as the inline `--sfih-team` /
     `--sfih-team-2` custom properties and is used for BACKGROUNDS, edges and
     glows only, never painted onto text (ice-hockey.css rule 2).
   * Depth is the `--sfih-d0…d4` ladder plus `--sfih-ring` inset rings. No
     component here declares a 1px border.
   * Mobile-first: every base rule is safe at 390px. Layout widens at
     `min-width: 600px`, `769px` and `1025px`. Wide tables scroll inside
     `.sfih-scroll`; the page never scrolls sideways.
   * Motion is scoped under `body.sfih-fx` (added by assets/fx.js), pointer
     effects additionally under `(pointer: fine)`, and everything that moves is
     switched off under `prefers-reduced-motion: reduce`.

   COOPERATION WITH assets/fx.js
   -----------------------------
   fx.js writes `--rx --ry --mx --my --lift` on `.sfih-tilt`, `--mx --my --holo`
   on `.sfih-holo`, `--z --px --py` on `.sfih-layer[data-depth]`, `--i --fxd` on
   `.sfih-reveal`, and toggles `.is-tilting` / `.is-foiled` / `.is-in`.
   ice-hockey.css never got as far as declaring those four hook classes, so this
   sheet consumes them — but ONLY scoped to the components in this family
   (`.sfih-team-hero`, `.sfih-card--team`, `.sfih-team-leader-link`), never as
   a bare global `.sfih-tilt {}`, which is shared territory.
   `.sfih-reveal`'s hidden start state is gated on `body.sfih-fx-reveal`, never
   on `sfih-fx` alone, so a browser without IntersectionObserver is never left
   with a blank page.
   The marquee: fx.js translates `.sfih-strip-viewport` and measures the loop
   as `track[1].offsetLeft - track[0].offsetLeft`, so the viewport carries NO
   gap of its own — the seam spacing comes from each track's own horizontal
   padding (half the item gap on each side). No @keyframes here: an animation
   on the track would make fx.js hand the marquee back to CSS and only pause it
   on hover, which loses the intersection/visibility throttling.

   @package stepfox-ice-hockey-stats
   ========================================================================== */

/* ==========================================================================
   1. TEAM-HERO — the broadcast lower-third, blown up to full width
   Markup: .sfih-team-hero.sfih-reveal.sfih-tilt[style="--sfih-team;--sfih-team-2"]
             > span.sfih-team-hero-glow        (decorative, aria-hidden)
             > span.sfih-team-hero-mark        (giant abbr watermark)
             > div.sfih-team-hero-inner
                 > div.sfih-team-hero-crest.sfih-layer[data-depth=3]
                     > span.sfih-ring  +  span.sfih-crest--xl
                 > div.sfih-team-hero-body.sfih-layer[data-depth=1]
                     > p.sfih-eyebrow.sfih-team-hero-eyebrow
                     > h1.sfih-team-hero-name
                         > span.sfih-team-hero-city + span.sfih-team-hero-nick
                     > div.sfih-team-hero-record
                         > .sfih-record .sfih-team-hero-pct .sfih-streak
                           .sfih-seed .sfih-badge
                     > div.sfih-chips.sfih-team-hero-chips
                     > a.sfih-next …
   ========================================================================== */

.sfih-team-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: 22px 18px 24px;
	border-radius: var(--sfih-r-lg);
	background-color: var(--sfih-panel);
	background-image: var(--sfih-sheen);
	box-shadow: var(--sfih-d3), var(--sfih-ring);
	color: var(--sfih-ink);
	transition: box-shadow var(--sfih-t) var(--sfih-ease);
}
.sfih-roster .sfih-scroll > .sfih-roster-table {
	min-width: 664px;
}

/* ==========================================================================
   5. TEAM-GRID — the 32-crest filterable card wall on /teams/
   Markup: .sfih-grid.sfih-grid--teams > .sfih-filters
             > .sfih-cards.sfih-cards--teams[data-grid][style="--sfih-cols"]
                 > a.sfih-card.sfih-tilt.sfih-reveal.sfih-holo.sfih-card--team
                     [style="--sfih-team;--sfih-team-2;--i"][data-*]
                     > span.sfih-card-edge
                     > span.sfih-card-glow
                     > span.sfih-card-crest.sfih-layer[data-depth=3] > .sfih-crest--lg
                     > span.sfih-card-body.sfih-layer[data-depth=1]
                         > .sfih-card-city + .sfih-card-nick
                         + .sfih-card-record (> b.sfih-record + .sfih-card-pct)
                         + span.sfih-bar.sfih-card-bar > .sfih-bar-fill
                         + .sfih-card-splits > .sfih-split …
                     > span.sfih-card-abbr
   ========================================================================== */

/* The second selector exists only to out-specify `.sfih-grid [data-grid]`
   (0,2,0) in ice-hockey.css, which hard-codes two columns at every width. */
.sfih-cards,
.sfih-grid .sfih-cards[data-grid] {
	display: grid;
	gap: var(--sfih-gap);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 148px), 1fr));
	align-items: stretch;
	min-width: 0;
}
.sfih-grid .sfih-cards--teams[data-grid],
.sfih-grid .sfih-cards--players[data-grid] {
	grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--sfih-card-min, 148px)), 1fr));
}

/* ==========================================================================
   8. TEAM-STRIP — one unique crest row above the footer
   Markup: .sfih-strip[data-speed][style="--sfih-strip-speed"]
             > .sfih-strip-viewport
                 > .sfih-strip-track > a|span.sfih-strip-item …
   Every NHL club is rendered once. The rail fits in one row on wide screens
   and becomes a native, keyboard-focusable horizontal scroller when needed.
   ========================================================================== */

.sfih-strip-viewport {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	width: 100%;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}
.sfih-strip-viewport::-webkit-scrollbar {
	display: none;
}
body.sfih-fx .sfih-strip[data-static="true"] .sfih-strip-viewport {
	width: 100%;
	overflow-x: auto;
}

.sfih-strip-track {
	--sfih-strip-gap: clamp(8px, 1vw, 18px);
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	flex: 1 0 max-content;
	gap: var(--sfih-strip-gap);
	min-width: max-content;
	width: 100%;
	padding: 10px clamp(16px, 3vw, 48px);
}

.sfih-strip-item {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	flex: 0 0 auto;
	text-decoration: none;
	color: var(--sfih-muted);
	font-family: var(--sfih-f-ui);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	transition: color var(--sfih-t-fast) var(--sfih-ease);
}
.sfih-strip-item img,
.sfih-strip-item .sfih-crest {
	filter: grayscale(1);
	opacity: 0.66;
	transition: filter var(--sfih-t-fast) var(--sfih-ease), opacity var(--sfih-t-fast) var(--sfih-ease);
}
.sfih-strip-item:hover,
.sfih-strip-item:focus-visible {
	color: var(--sfih-ink);
}
.sfih-strip-item:hover img,
.sfih-strip-item:hover .sfih-crest,
.sfih-strip-item:focus-visible img,
.sfih-strip-item:focus-visible .sfih-crest {
	filter: none;
	opacity: 1;
}

/* A thin separator between crests, drawn on the item so the markup needs no
   extra element. The negative left margin pulls it back into the middle of
   the track gap, and the right margin cancels the item's own 9px gap, so the
   rule sits exactly halfway between two crests at every clamp value. */
.sfih-strip-item + .sfih-strip-item::before { display: none; }

/* ==========================================================================
   9. FX COOPERATION — consuming the custom properties assets/fx.js writes.
   Scoped to this family's components only; the bare hook classes
   (.sfih-tilt / .sfih-holo / .sfih-reveal / .sfih-layer) are shared territory
   and are never declared here on their own.
   ========================================================================== */

/* ---- scroll reveal ----------------------------------------------------- */
/* Gated on `sfih-fx-reveal`, which fx.js only adds when the observer will
   actually run. Without it these elements are simply visible.

   The rise uses the INDEPENDENT `translate` property, not `transform`, and
   that is load-bearing: the same elements are also `.sfih-tilt`, and a
   `transform` here would out-specify the tilt rule below — `…is-in` is
   (0,4,1) against the tilt's (0,3,1) — so every card that had scrolled into
   view would stop tilting for good. `translate` composes with `transform`
   instead of replacing it. */
body.sfih-fx-reveal .sfih-team-hero.sfih-reveal,
body.sfih-fx-reveal .sfih-record-panel.sfih-reveal,
body.sfih-fx-reveal .sfih-team-leaders.sfih-reveal,
body.sfih-fx-reveal .sfih-team-leader.sfih-reveal,
body.sfih-fx-reveal .sfih-card--team.sfih-reveal {
	opacity: 0;
	translate: 0 14px;
	transition:
		opacity 0.5s var(--sfih-ease) var(--fxd, 0ms),
		translate 0.5s var(--sfih-ease) var(--fxd, 0ms);
}
body.sfih-fx-reveal .sfih-team-hero.sfih-reveal.is-in,
body.sfih-fx-reveal .sfih-record-panel.sfih-reveal.is-in,
body.sfih-fx-reveal .sfih-team-leaders.sfih-reveal.is-in,
body.sfih-fx-reveal .sfih-team-leader.sfih-reveal.is-in,
body.sfih-fx-reveal .sfih-card--team.sfih-reveal.is-in {
	opacity: 1;
	translate: none;
}

/* ---- pointer tilt ------------------------------------------------------ */
/* fx.js clamps --rx / --ry to +/-7deg. The hero is an enormous slab, so it
   takes a little under half of that; the small cards take it all. */
@media (pointer: fine) {
	body.sfih-fx .sfih-card--team.sfih-tilt {
		transform:
			perspective(var(--sfih-persp))
			rotateX(var(--rx, 0deg))
			rotateY(var(--ry, 0deg))
			translate3d(0, var(--lift, 0px), 0);
		transition: transform var(--sfih-t) var(--sfih-ease), box-shadow var(--sfih-t) var(--sfih-ease);
	}
	body.sfih-fx .sfih-card--team.sfih-tilt.is-tilting {
		box-shadow: var(--sfih-d3-hi);
		will-change: transform;
	}

	/* The parallax layers. fx.js also writes --z, but the card clips its
	   watermark with `overflow: hidden`, which forces `transform-style: flat`
	   — so the depth is carried by the 2D --px / --py shift instead, which is
	   what actually reads on a card this size. */
	body.sfih-fx .sfih-card--team .sfih-layer,
	body.sfih-fx .sfih-team-hero .sfih-layer {
		transform: translate3d(var(--px, 0px), var(--py, 0px), 0);
		transition: transform var(--sfih-t) var(--sfih-ease);
	}
}

/* The hero tilts only where there is room for it to read as depth rather than
   as wobble. */
@media (pointer: fine) and (min-width: 1025px) {
	body.sfih-fx .sfih-team-hero.sfih-tilt {
		transform:
			perspective(var(--sfih-persp))
			rotateX(calc(var(--rx, 0deg) * 0.4))
			rotateY(calc(var(--ry, 0deg) * 0.4))
			translate3d(0, calc(var(--lift, 0px) * 0.5), 0);
		transition: transform var(--sfih-t) var(--sfih-ease), box-shadow var(--sfih-t) var(--sfih-ease);
	}
	body.sfih-fx .sfih-team-hero.sfih-tilt.is-tilting {
		box-shadow: var(--sfih-d4), var(--sfih-ring-hot);
		will-change: transform;
	}
}

/* ---- holographic foil on the crest cards ------------------------------- */
/* fx.js writes --mx / --my (cursor position, %) and --holo (0-200%) and
   toggles `.is-foiled`. */
@media (pointer: fine) {
	.sfih-card--team.sfih-holo::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 4;
		pointer-events: none;
		border-radius: inherit;
		opacity: 0;
		mix-blend-mode: overlay;
		background:
			radial-gradient(220px 220px at var(--mx, 50%) var(--my, 50%), color-mix(in srgb, var(--sfih-ink) 34%, transparent), transparent 62%),
			linear-gradient(115deg,
				transparent 0%,
				color-mix(in srgb, var(--sfih-neon) 34%, transparent) calc(var(--holo, 50%) * 0.45),
				color-mix(in srgb, var(--sfih-violet) 30%, transparent) calc(var(--holo, 50%) * 0.7 + 12%),
				color-mix(in srgb, var(--sfih-accent) 30%, transparent) calc(var(--holo, 50%) * 0.9 + 24%),
				transparent 100%);
		transition: opacity var(--sfih-t) var(--sfih-ease);
	}
	body.sfih-fx .sfih-card--team.sfih-holo.is-foiled::after {
		opacity: 0.85;
	}
}

@media (min-width: 1025px) {

	/* Above the tablet breakpoint, honour the author's column count. The two
	   modifier selectors are repeated so this beats the (0,3,0) auto-fill
	   rules above on specificity, not merely on source order. */
	.sfih-grid .sfih-cards[data-grid],
	.sfih-grid .sfih-cards--teams[data-grid],
	.sfih-grid .sfih-cards--players[data-grid] {
		grid-template-columns: repeat(var(--sfih-cols, 4), minmax(0, 1fr));
	}
}

/* ==========================================================================
   11. FOCUS — the interactive elements this family adds.
   ice-hockey.css already rings every `a` / `button` inside an `sfih-` subtree;
   these rules only restore the correct radius so the ring hugs the shape
   instead of the generic `--sfih-r-sm`.
   ========================================================================== */

.sfih-next:focus-visible,
.sfih-schedule-opp:focus-visible,
.sfih-team-cell:focus-visible,
.sfih-roster-player:focus-visible,
.sfih-team-leader-link:focus-visible,
.sfih-strip-item:focus-visible,
.sfih-card--team:focus-visible {
	outline: 2px solid var(--sfih-neon);
	outline-offset: 3px;
}
.sfih-strip-item:focus-visible {
	border-radius: var(--sfih-r-sm);
	outline-offset: 4px;
}

/* ==========================================================================
   12. REDUCED MOTION — everything that moves, stops.
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	.sfih-team-hero,
	.sfih-record-panel,
	.sfih-team-leaders,
	.sfih-team-leader,
	.sfih-team-leader-link,
	.sfih-team-leader-name,
	.sfih-card--team,
	.sfih-card--team .sfih-layer,
	.sfih-team-hero .sfih-layer,
	.sfih-next,
	.sfih-schedule-row,
	.sfih-schedule-name,
	.sfih-roster-row,
	.sfih-roster-name,
	.sfih-team-nick,
	.sfih-strip-item,
	.sfih-strip-item img,
	.sfih-strip-item .sfih-crest {
		transition: none !important;
		animation: none !important;
	}

	body.sfih-fx .sfih-team-hero.sfih-tilt,
	body.sfih-fx .sfih-card--team.sfih-tilt,
	body.sfih-fx .sfih-card--team .sfih-layer,
	body.sfih-fx .sfih-team-hero .sfih-layer {
		transform: none !important;
	}

	body.sfih-fx-reveal .sfih-team-hero.sfih-reveal,
	body.sfih-fx-reveal .sfih-record-panel.sfih-reveal,
	body.sfih-fx-reveal .sfih-team-leaders.sfih-reveal,
	body.sfih-fx-reveal .sfih-team-leader.sfih-reveal,
	body.sfih-fx-reveal .sfih-card--team.sfih-reveal {
		opacity: 1;
		translate: none;
	}

	.sfih-card--team.sfih-holo::after {
		display: none;
	}

	/* fx.js does not drive the marquee under reduced motion, so the strip
	   becomes a plain horizontal scroller and the duplicate track — which
	   exists only to make the loop seamless — is dropped. */
	body.sfih-fx .sfih-strip-viewport {
		width: 100%;
		overflow-x: auto;
		scrollbar-width: thin;
	}
	.sfih-strip-track[aria-hidden="true"] {
		display: none;
	}
}

/* ==========================================================================
   13. AUDIT APPENDIX — component internals the sections above never filled in.
   Appended 2026-08-19 for the Elementor generation (site 71): the block theme
   composed these components from field blocks, so the renderer classes below
   had no rule anywhere. Everything is measured off the block demo
   (#block_tm-h-* on the club page, #block_tma-grid-b-c-* on /teams/) and the
   pre-prune ice-hockey.css monoliths (.sfih-thero/.sfih-tcard/.sfih-tsched/
   .sfih-trecord), and obeys the header contract of this file: tokens only,
   no borders (rings), mobile-first, motion already covered by sections 9/12.
   NOTHING ABOVE THIS LINE WAS TOUCHED.
   ========================================================================== */

/* ---- 13.0 shared numerals: the W-L(-T) record atom ---------------------- */
/* Emitted by team-hero, team-card and the standings cells alike. ice-hockey.css
   lists it as a shared atom but never grew the rule. */
.sfih-record {
	display: inline-flex;
	align-items: baseline;
	gap: 3px;
	font-family: var(--sfih-f-num);
	font-size: 14px;
	font-weight: 700;
	color: var(--sfih-ink);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.sfih-record i { font-style: normal; color: var(--sfih-muted); }

/* ---- 13.0b the plain progress pair: .sfih-track > .sfih-bar ------------- */
/* blocks-player.php's stepfox_ih_pl_track() contract (--sfih-pct inline on
   the fill). Declared here because the class landed in this family's audit
   partition; the fill rule is scoped under the track so it can never touch
   the track-shaped `.sfih-bar.sfih-card-bar` / `.sfih-bar.sfih-record-bar`
   instances below. */
.sfih-track {
	position: relative;
	display: block;
	height: 6px;
	border-radius: var(--sfih-pill);
	background: color-mix(in srgb, var(--sfih-base) 70%, transparent);
	box-shadow: var(--sfih-ring);
	overflow: hidden;
}
.sfih-track > .sfih-bar {
	display: block;
	height: 100%;
	width: var(--sfih-pct, 0%);
	border-radius: inherit;
	background: linear-gradient(90deg, color-mix(in srgb, var(--sfih-team, var(--sfih-accent)) 55%, transparent), var(--sfih-team, var(--sfih-accent)));
	box-shadow: 0 0 12px color-mix(in srgb, var(--sfih-team, var(--sfih-accent)) 40%, transparent);
	transition: width 0.7s var(--sfih-ease);
}

/* ---- 13.1 TEAM-HERO internals ------------------------------------------- */
/* The club-colour stage light. The wrapper carries --sfih-team / --sfih-team-2
   inline and `isolation: isolate`, so z-index -1 tucks the glow between the
   panel fill and the content. */
.sfih-team-hero-glow {
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		radial-gradient(760px 320px at 12% -14%, color-mix(in srgb, var(--sfih-team, var(--sfih-accent)) 34%, transparent), transparent 70%),
		radial-gradient(520px 280px at 96% 8%, color-mix(in srgb, var(--sfih-team-2, var(--sfih-accent-2)) 22%, transparent), transparent 72%),
		linear-gradient(0deg, color-mix(in srgb, var(--sfih-team, var(--sfih-accent)) 14%, transparent), transparent 36%);
}

/* The giant faded abbreviation watermark, bottom-right. */
.sfih-team-hero-mark {
	position: absolute;
	right: -6px;
	bottom: -0.12em;
	z-index: -1;
	pointer-events: none;
	user-select: none;
	white-space: nowrap;
	font-family: var(--sfih-f-display);
	font-weight: 400;
	font-size: clamp(110px, 22vw, 190px);
	line-height: 0.8;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--sfih-ink) 5%, transparent);
}

.sfih-team-hero-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 18px;
	min-width: 0;
}

/* Ringed crest tile: 104 → 132 → 156px, the crest img scales with it. */
.sfih-team-hero-crest {
	position: relative;
	flex: 0 0 auto;
	width: 104px;
	height: 104px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background:
		radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--sfih-team, var(--sfih-accent)) 30%, transparent), transparent 70%),
		var(--sfih-panel-2);
	box-shadow: var(--sfih-d3), var(--sfih-ring);
}
.sfih-team-hero-crest .sfih-crest,
.sfih-team-hero-crest .sfih-crest--xl {
	width: 74%;
	height: 74%;
	background: none;
	box-shadow: none;
	padding: 0;
}

.sfih-team-hero-body {
	flex: 1 1 260px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* Division eyebrow — the category-style label goes gold-ink. */
.sfih-team-hero-eyebrow {
	color: var(--sfih-gold-ink);
}

.sfih-team-hero-name {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}
.sfih-team-hero-city {
	font-family: var(--sfih-f-ui);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--sfih-muted);
}
.sfih-team-hero-nick {
	font-family: var(--sfih-f-display);
	font-weight: 400;
	font-size: clamp(38px, 7vw, 68px);
	line-height: 0.94;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: var(--sfih-ink);
}

.sfih-team-hero-record {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	min-width: 0;
}
.sfih-team-hero-record .sfih-record { font-size: 30px; line-height: 1; }
.sfih-team-hero-pct {
	font-family: var(--sfih-f-num);
	font-size: 15px;
	font-weight: 700;
	color: var(--sfih-muted);
	font-variant-numeric: tabular-nums;
}

.sfih-team-hero-chips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

/* ---- 13.2 the "next kickoff" strip inside the hero ---------------------- */
.sfih-next {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 14px;
	width: fit-content;
	max-width: 100%;
	margin-top: 4px;
	padding: 11px 14px;
	border-radius: var(--sfih-r-sm);
	background-color: color-mix(in srgb, var(--sfih-base) 45%, transparent);
	background-image: var(--sfih-sheen);
	box-shadow: var(--sfih-ring), var(--sfih-d0);
	text-decoration: none;
	color: var(--sfih-ink);
	transition: box-shadow var(--sfih-t) var(--sfih-ease);
}
.sfih-next:hover { box-shadow: var(--sfih-ring-hot), var(--sfih-d1); }
.sfih-next-eyebrow {
	font-family: var(--sfih-f-ui);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--sfih-accent-ink);
	flex: 0 0 auto;
}
.sfih-next-match {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}
.sfih-next-prefix {
	font-family: var(--sfih-f-ui);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--sfih-muted);
	flex: 0 0 auto;
}
.sfih-next-opp {
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.sfih-next-when {
	font-family: var(--sfih-f-num);
	font-size: 12.5px;
	font-weight: 600;
	color: var(--sfih-muted);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.sfih-next-week {
	font-family: var(--sfih-f-ui);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--sfih-muted);
	flex: 0 0 auto;
}
.sfih-next-countdown {
	margin-left: auto;
	flex: 0 0 auto;
}

/* ---- 13.3 TEAM-RECORD panel --------------------------------------------- */
.sfih-record-panel {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 16px;
	border-radius: var(--sfih-r);
	background-color: var(--sfih-panel);
	background-image: var(--sfih-sheen);
	box-shadow: var(--sfih-d2), var(--sfih-ring);
}
.sfih-record-main {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px 12px;
	min-width: 0;
}
.sfih-record-wlt {
	font-family: var(--sfih-f-display);
	font-weight: 400;
	font-size: 38px;
	line-height: 1;
	color: var(--sfih-ink);
	font-variant-numeric: tabular-nums;
}
.sfih-record-pct {
	font-family: var(--sfih-f-num);
	font-size: 15px;
	font-weight: 700;
	color: var(--sfih-muted);
	font-variant-numeric: tabular-nums;
}

/* Track-shaped win-pct bars: the PHP emits `.sfih-bar` as the TRACK here,
   with a `.sfih-bar-fill` child carrying an inline width. The (0,2,0)
   compound outweighs any bare `.sfih-bar` fill rule regardless of load
   order — exactly the drift fix the file header promises. */
.sfih-bar.sfih-record-bar,
.sfih-bar.sfih-card-bar {
	position: relative;
	display: block;
	width: 100%;
	height: 6px;
	border-radius: var(--sfih-pill);
	background: color-mix(in srgb, var(--sfih-base) 70%, transparent);
	box-shadow: var(--sfih-ring);
	overflow: hidden;
}
.sfih-bar.sfih-record-bar { height: 8px; }
.sfih-record-bar > .sfih-bar-fill,
.sfih-card-bar > .sfih-bar-fill {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, color-mix(in srgb, var(--sfih-team, var(--sfih-accent)) 55%, transparent), var(--sfih-team, var(--sfih-accent)));
	box-shadow: 0 0 12px color-mix(in srgb, var(--sfih-team, var(--sfih-accent)) 40%, transparent);
}

.sfih-record-tiles {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.sfih-record-splits {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	padding-top: 12px;
	box-shadow: inset 0 1px 0 var(--sfih-line);
}
.sfih-record-split {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-width: 0;
	padding: 9px 12px;
	border-radius: var(--sfih-r-sm);
	background: color-mix(in srgb, var(--sfih-base) 45%, transparent);
	box-shadow: var(--sfih-ring);
}
.sfih-record-split-label {
	font-family: var(--sfih-f-ui);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--sfih-muted);
	white-space: nowrap;
}
.sfih-record-split-value {
	font-family: var(--sfih-f-num);
	font-size: 13px;
	font-weight: 700;
	color: var(--sfih-ink);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

/* ---- 13.4 TEAM-SCHEDULE — the week-by-week fixture list ----------------- */
.sfih-schedule {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}
.sfih-schedule-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}
.sfih-schedule-row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 14px;
	border-radius: var(--sfih-r-sm);
	background-color: color-mix(in srgb, var(--sfih-panel) 88%, transparent);
	background-image: var(--sfih-sheen);
	box-shadow: var(--sfih-d1), var(--sfih-ring);
	min-width: 0;
}
.sfih-schedule-row.is-live { box-shadow: var(--sfih-d1), var(--sfih-ring-hot); }
.sfih-schedule-week {
	flex: 0 0 44px;
	font-family: var(--sfih-f-num);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--sfih-muted);
	white-space: nowrap;
}
.sfih-schedule-date {
	flex: 0 0 86px;
	font-family: var(--sfih-f-ui);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--sfih-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.sfih-schedule-opp {
	flex: 1 1 auto;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-width: 0;
	color: inherit;
	text-decoration: none;
}
.sfih-schedule-at {
	flex: 0 0 auto;
	width: 22px;
	font-family: var(--sfih-f-ui);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--sfih-muted);
}
.sfih-schedule-name {
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color var(--sfih-t-fast) var(--sfih-ease);
}
.sfih-schedule-opp:hover .sfih-schedule-name { color: var(--sfih-accent-ink); }
/* The abbr is a narrow-screen stand-in for the nickname (see 13.8). */
.sfih-schedule-abbr {
	display: none;
	font-family: var(--sfih-f-num);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--sfih-ink);
}
.sfih-schedule-result {
	flex: 0 0 auto;
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.sfih-schedule-outcome {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 4px;
	border-radius: var(--sfih-pill);
	font-family: var(--sfih-f-ui);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--sfih-on-bright);
	background: color-mix(in srgb, var(--sfih-muted) 70%, transparent);
}
.sfih-schedule-row.is-win  .sfih-schedule-outcome { background: var(--sfih-turf); }
.sfih-schedule-row.is-tie  .sfih-schedule-outcome { background: color-mix(in srgb, var(--sfih-accent-2) 80%, transparent); }
.sfih-schedule-row.is-live .sfih-schedule-outcome { background: var(--sfih-accent); }
.sfih-schedule-score {
	font-family: var(--sfih-f-num);
	font-size: 14px;
	font-weight: 700;
	color: var(--sfih-ink);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.sfih-schedule-kick {
	flex: 0 0 auto;
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.sfih-schedule-time {
	font-family: var(--sfih-f-num);
	font-size: 14px;
	font-weight: 700;
	color: var(--sfih-ink);
	font-variant-numeric: tabular-nums;
}
.sfih-schedule-tv {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-family: var(--sfih-f-ui);
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--sfih-muted);
	white-space: nowrap;
}
.sfih-schedule-tv-icon {
	width: 14px;
	height: 14px;
	flex: 0 0 auto;
	opacity: 0.8;
}
.sfih-schedule-row.is-bye {
	opacity: 0.55;
	box-shadow: var(--sfih-ring);
	background-image: none;
}
.sfih-schedule-bye {
	font-family: var(--sfih-f-ui);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--sfih-muted);
}
.sfih-schedule-divider {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 4px 0 2px;
}
.sfih-schedule-divider:not(:first-child) { margin-top: 14px; }
.sfih-schedule-divider > span {
	flex: 0 0 auto;
	font-family: var(--sfih-f-ui);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--sfih-muted);
}
.sfih-schedule-divider::after {
	content: "";
	flex: 1 1 auto;
	height: 1px;
	background: var(--sfih-line);
}

/* ---- 13.5 TEAM-LEADERS — the best-per-position rail --------------------- */
.sfih-team-leaders-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-width: 0;
}
.sfih-team-leader-link {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
	padding: 11px 14px;
	border-radius: var(--sfih-r-sm);
	background-color: color-mix(in srgb, var(--sfih-panel) 88%, transparent);
	background-image: var(--sfih-sheen);
	box-shadow: var(--sfih-d1), var(--sfih-ring);
	text-decoration: none;
	color: var(--sfih-ink);
	transition: box-shadow var(--sfih-t) var(--sfih-ease);
}
.sfih-team-leader-link:hover { box-shadow: var(--sfih-d2), var(--sfih-ring-hot); }
.sfih-team-leader-face {
	flex: 0 0 auto;
	position: relative;
	display: inline-flex;
}
.sfih-team-leader-body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.sfih-team-leader-link .sfih-team-leader-name {
	font-size: 13.5px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color var(--sfih-t-fast) var(--sfih-ease);
}
.sfih-team-leader-link:hover .sfih-team-leader-name { color: var(--sfih-accent-ink); }
.sfih-team-leader-meta {
	font-family: var(--sfih-f-ui);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--sfih-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.sfih-team-leader-stat {
	flex: 0 0 auto;
	margin-left: auto;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	text-align: right;
}
.sfih-team-leader-value {
	font-family: var(--sfih-f-num);
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	color: var(--sfih-ink);
	font-variant-numeric: tabular-nums;
}
.sfih-team-leader-label {
	font-family: var(--sfih-f-ui);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--sfih-muted);
}

/* ---- 13.6 TEAM-GRID card internals -------------------------------------- */
/* The slab itself, scoped to the team modifier: players.css owns its own
   card variants and ice-hockey.css only reserves `.sfih-card` for
   content-visibility, so the base look lives here. */
.sfih-card--team {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 12px;
	padding: 18px 14px;
	border-radius: var(--sfih-r);
	background-color: var(--sfih-panel);
	background-image: var(--sfih-sheen);
	box-shadow: var(--sfih-d1), var(--sfih-ring);
	text-decoration: none;
	color: var(--sfih-ink);
	transition: box-shadow var(--sfih-t) var(--sfih-ease);
}
.sfih-card--team:hover { box-shadow: var(--sfih-d2), var(--sfih-ring-hot); }

/* Livery: a 3px flash along the top edge... */
.sfih-card-edge {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(90deg, var(--sfih-team, var(--sfih-accent)), var(--sfih-team-2, var(--sfih-accent-2)));
	opacity: 0.85;
}
/* ...and the club-colour wash behind the crest. */
.sfih-card-glow {
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: radial-gradient(420px 220px at 50% -30%, color-mix(in srgb, var(--sfih-team, var(--sfih-accent)) 28%, transparent), transparent 72%);
}

.sfih-card-crest {
	position: relative;
	flex: 0 0 auto;
	width: 76px;
	height: 76px;
	margin-top: 2px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--sfih-panel-2);
	box-shadow: var(--sfih-d1), var(--sfih-ring);
}
.sfih-card-crest .sfih-crest,
.sfih-card-crest .sfih-crest--lg {
	width: 74%;
	height: 74%;
	background: none;
	box-shadow: none;
	padding: 0;
}

.sfih-card-body {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	min-width: 0;
	width: 100%;
}
.sfih-card-city {
	max-width: 100%;
	font-family: var(--sfih-f-ui);
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--sfih-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.sfih-card-nick {
	font-family: var(--sfih-f-display);
	font-weight: 400;
	font-size: 22px;
	line-height: 1.02;
	text-transform: uppercase;
	color: var(--sfih-ink);
}
.sfih-card-record {
	display: inline-flex;
	align-items: baseline;
	justify-content: center;
	gap: 10px;
	margin-top: 2px;
}
.sfih-card-record .sfih-record { font-size: 20px; line-height: 1.1; }
.sfih-card-pct {
	font-family: var(--sfih-f-num);
	font-size: 13px;
	font-weight: 700;
	color: var(--sfih-muted);
	font-variant-numeric: tabular-nums;
}

/* HOME / AWAY / DIV splits under an inset hairline. */
.sfih-card-splits {
	display: flex;
	justify-content: center;
	gap: 14px;
	width: 100%;
	margin-top: 2px;
	padding-top: 10px;
	box-shadow: inset 0 1px 0 var(--sfih-line);
}
.sfih-card-splits .sfih-split {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	min-width: 0;
	font-family: var(--sfih-f-num);
	font-size: 12px;
	font-weight: 700;
	color: var(--sfih-ink);
	font-variant-numeric: tabular-nums;
}
.sfih-card-splits .sfih-split > i {
	font-style: normal;
	font-family: var(--sfih-f-ui);
	font-size: 9px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--sfih-muted);
}

/* The faded abbreviation watermark, bottom-right, behind the content. */
.sfih-card-abbr {
	position: absolute;
	right: 4px;
	bottom: -0.1em;
	z-index: -1;
	pointer-events: none;
	user-select: none;
	white-space: nowrap;
	font-family: var(--sfih-f-display);
	font-weight: 400;
	font-size: 56px;
	line-height: 0.8;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--sfih-ink) 5%, transparent);
}

/* ---- 13.7 TEAM-ROSTER cells --------------------------------------------- */
.sfih-roster--sortable th.sfih-sortable {
	cursor: pointer;
	user-select: none;
	white-space: nowrap;
}
.sfih-roster-num {
	display: inline-block;
	min-width: 28px;
	font-family: var(--sfih-f-num);
	font-size: 15px;
	font-weight: 700;
	color: var(--sfih-muted);
	text-align: center;
	font-variant-numeric: tabular-nums;
}
.sfih-roster-stat-value {
	font-family: var(--sfih-f-num);
	font-size: 14px;
	font-weight: 700;
	color: var(--sfih-ink);
	font-variant-numeric: tabular-nums;
	margin-right: 5px;
}
.sfih-roster-stat-unit {
	font-family: var(--sfih-f-ui);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--sfih-muted);
}

/* ---- 13.8 the shared team cell atoms (standings.php emits them) --------- */
/* This file's header claims `.sfih-team-cell`; the shell is the canonical
   crest + abbr + name row, and the abbr/name pair swaps at 768px — the PHP
   docblock: "a compact rail shows the abbr, the full table shows the
   location and nickname". */
.sfih-team-cell {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-width: 0;
	color: inherit;
	text-decoration: none;
}
.sfih-team-abbr {
	display: none;
	font-family: var(--sfih-f-num);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--sfih-ink);
	white-space: nowrap;
}
.sfih-team-name {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.2;
	text-align: left;
}
.sfih-team-name .sfih-team-nick {
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.sfih-team-loc {
	font-style: normal;
	font-family: var(--sfih-f-ui);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--sfih-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ---- 13.9 responsive steps ---------------------------------------------- */
@media (min-width: 600px) {
	.sfih-record-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 769px) {
	.sfih-team-hero { padding: 30px 28px; }
	.sfih-team-hero-inner { gap: 26px; }
	.sfih-team-hero-crest { width: 132px; height: 132px; }
	.sfih-record-panel { padding: 20px; }
}

@media (min-width: 1025px) {
	.sfih-team-hero { padding: 38px 34px 40px; }
	.sfih-team-hero-inner { gap: 32px; }
	.sfih-team-hero-crest { width: 156px; height: 156px; }
	.sfih-record-tiles { grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); }
	.sfih-record-splits { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Card steps mirror the block demo: 76 → 70 → 64px crest, 22 → 21 → 20px
   nickname. */
@media (max-width: 1024px) {
	.sfih-card-crest { width: 70px; height: 70px; }
	.sfih-card-nick { font-size: 21px; }
}
@media (max-width: 768px) {
	.sfih-card-crest { width: 64px; height: 64px; }
	.sfih-card-nick { font-size: 20px; }
	/* Standings team cell: compact rail — abbr in, location/nickname out. */
	.sfih-team-name { display: none; }
	.sfih-team-abbr { display: inline; }
}
@media (max-width: 640px) {
	/* Schedule rows tighten: nickname hands over to the abbr (rows without
	   an abbr — "To be confirmed" — keep their name), TV drops, and the date
	   column stops reserving width. */
	.sfih-schedule-opp:has(.sfih-schedule-abbr) .sfih-schedule-name { display: none; }
	.sfih-schedule-abbr { display: inline; }
	.sfih-schedule-tv { display: none; }
	.sfih-schedule-date { flex-basis: auto; }
	.sfih-schedule-week { flex-basis: 38px; }
	.sfih-next-countdown { margin-left: 0; }
}

/* Reduced motion for the transitions introduced in this appendix (the block
   at section 12 predates them). */
@media (prefers-reduced-motion: reduce) {
	.sfih-track > .sfih-bar,
	.sfih-card--team,
	.sfih-team-leader-link,
	.sfih-schedule-opp .sfih-schedule-name,
	.sfih-next {
		transition: none !important;
	}
}

/* Team-single season band parity: the Block reference uses a compact season
   metrics panel beside a dedicated next-game card. The renderer now exposes
   `.sfih-record-body` and `.sfih-record-next`, allowing the same composition
   in Elementor without duplicating or faking any hockey data. */
.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-panel {
	display: grid;
	grid-template-columns: minmax(0, 2.15fr) minmax(260px, .95fr);
	align-items: start;
	gap: 22px;
	padding: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-body,
.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-next {
	min-width: 0;
	padding: 18px;
	border-radius: var(--sfih-r);
	background-color: var(--sfih-panel);
	background-image: var(--sfih-sheen);
	box-shadow: var(--sfih-d2), var(--sfih-ring);
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-body {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-main,
.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-splits {
	display: none;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles {
	order: 1;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 10px;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-bar {
	order: 2;
	display: block;
	margin-top: 14px;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles .sfih-tile {
	min-height: 78px;
	padding: 11px 12px;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles .sfih-tile-icon {
	display: none;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles .sfih-tile-value {
	font-family: var(--sfih-f-num);
	font-size: 23px;
	font-weight: 700;
	line-height: 1;
	color: var(--sfih-ink);
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles .sfih-tile:not(.is-split) .sfih-tile-label,
.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles .sfih-tile.is-split .sfih-tile-sub {
	display: none;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles .sfih-tile:not(.is-split) .sfih-tile-sub,
.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles .sfih-tile.is-split .sfih-tile-label {
	font-family: var(--sfih-f-ui);
	font-size: 9px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--sfih-muted);
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-next {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-next-label {
	font-family: var(--sfih-f-ui);
	font-size: 10px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: .17em;
	text-transform: uppercase;
	color: var(--sfih-muted);
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-next .sfih-next {
	display: grid;
	grid-template-columns: 1fr;
	align-content: start;
	gap: 8px;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 14px;
	background: color-mix(in srgb, var(--sfih-base) 32%, transparent);
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-next .sfih-next-match {
	font-size: 17px;
	line-height: 1.15;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-next :is(
	.sfih-next-eyebrow,
	.sfih-next-when,
	.sfih-next-week
) {
	line-height: 1.25;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-next .sfih-next-countdown {
	order: 4;
	margin: 4px 0 0;
	padding: 14px;
	font-family: var(--sfih-f-num);
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
	color: var(--sfih-accent-2);
}

.wp-theme-ice-hockey-elementor.single-ih_team .gx-tb-team-roster > .elementor-container {
	gap: 22px;
}

@media (max-width: 900px) {
	.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-panel {
		grid-template-columns: 1fr;
	}
	.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 599px) {
	.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-body,
	.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-next {
		padding: 14px;
	}
	.wp-theme-ice-hockey-elementor.single-ih_team .sfih-record-tiles {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ---- 14. Elementor / Block visual parity -------------------------------
   The Block build is the reference composition. Team marks always sit in a
   circular neutral backplate; the card containing that mark can still be a
   rounded rectangle. Scope the structural changes to the Elementor theme so
   the Block templates keep their authored responsive geometry. */
.wp-theme-ice-hockey-elementor .sfih-crest {
	border-radius: 50% !important;
	object-fit: contain;
	background-color: var(--sfih-panel-2);
	background-image: none;
	box-shadow: var(--sfih-ring), var(--sfih-d0);
	padding: 3px;
}

.wp-theme-ice-hockey-elementor :is(
	.sfih-card-crest,
	.sfih-team-hero-crest,
	.sfih-sfull-crest,
	.sfih-fh-crest
) {
	aspect-ratio: 1;
	border-radius: 50% !important;
	background-color: var(--sfih-panel-2);
	background-image: none;
	box-shadow: var(--sfih-ring), var(--sfih-d1);
}

.wp-theme-ice-hockey-elementor :is(
	.sfih-card-crest,
	.sfih-team-hero-crest,
	.sfih-sfull-crest,
	.sfih-fh-crest
) .sfih-crest {
	background: transparent;
	box-shadow: none;
	padding: 0;
}

/* Open single-team hero: the surrounding Theme Builder section supplies the
   full-width panel band, so this component should not draw a second card. */
.wp-theme-ice-hockey-elementor.single-ih_team .sfih-team-hero {
	padding: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	transition: none;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-team-hero-glow,
.wp-theme-ice-hockey-elementor.single-ih_team .sfih-team-hero-mark {
	display: none;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-team-hero-inner {
	flex-wrap: nowrap;
	gap: 32px;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-team-hero-body {
	gap: 13px;
}

.wp-theme-ice-hockey-elementor.single-ih_team .sfih-team-hero-name {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0 0.22em;
}

.wp-theme-ice-hockey-elementor.single-ih_team :is(
	.sfih-team-hero-city,
	.sfih-team-hero-nick
) {
	font-family: var(--sfih-f-display);
	font-size: 68px;
	font-weight: 400;
	line-height: 0.94;
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--sfih-ink);
}

/* The record panel immediately below already carries the next-game detail;
   removing the duplicated strip keeps the hero at the Block build's height. */
.wp-theme-ice-hockey-elementor.single-ih_team .sfih-team-hero .sfih-next {
	display: none;
}

@media (max-width: 1024px) {
	.wp-theme-ice-hockey-elementor.single-ih_team :is(
		.sfih-team-hero-city,
		.sfih-team-hero-nick
	) {
		font-size: 52px;
	}
}

@media (max-width: 768px) {
	.wp-theme-ice-hockey-elementor.single-ih_team .sfih-team-hero-inner {
		flex-wrap: wrap;
		gap: 18px;
	}

	.wp-theme-ice-hockey-elementor.single-ih_team .sfih-team-hero-body {
		flex-basis: 100%;
		gap: 10px;
	}

	.wp-theme-ice-hockey-elementor.single-ih_team :is(
		.sfih-team-hero-city,
		.sfih-team-hero-nick
	) {
		font-size: 38px;
	}
}