:root {
    --ice: #9ad8ff;
    --ice-hot: #dff4ff;
    --ice-dim: #5a9cbc;
    --brass: #c4a574;
    --brass-deep: #8a6f4a;
    --navy: #0b1220;
    --navy-2: #111a2b;
    --bg: #05080c;
    --plate: 78%;
    --fy-cut: 14px;
  }
  html[data-scene="dawn"]      { --plate: 80%; }
  html[data-scene="morning"]   { --plate: 82%; }
  html[data-scene="afternoon"] { --plate: 84%; }
  html[data-scene="golden"]    { --plate: 78%; }
  html[data-scene="dusk"]      { --plate: 76%; }
  html[data-scene="night"]     { --plate: 74%; }

  * { box-sizing: border-box; margin: 0; padding: 0; }
  html, body {
    width: 100%; height: 100%;
    background: var(--bg);
    color: var(--ice);
    font-family: "Figtree", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
    overflow: hidden;
    user-select: none;
    -webkit-user-select: none;
  }
.ice-player   #app {
    width: 100%; height: 100%;
    display: grid;
    place-items: center;
    background: radial-gradient(ellipse at 50% 60%, #0a1218 0%, #040608 70%);
  }
.ice-player   .stage {
    position: relative;
    width: min(100vw, calc(100vh * 16 / 9));
    aspect-ratio: 16 / 9;
    max-height: 100vh;
    background: #000;
    overflow: hidden;
    box-shadow: 0 0 60px rgba(0, 40, 60, 0.45);
  }

  /* ── Layer 0: location + time + weather window/room ── */
.ice-player   #ip-layer-bg {
    position: absolute; inset: 0;
    z-index: 1;
    background: #000 center/cover no-repeat;
    background-image: url('media/bg.jpg');
    transition: filter 600ms ease, background-image 400ms ease;
  }
.ice-player   #ip-layer-bg.wx-cloudy { filter: saturate(0.72) brightness(0.88) contrast(0.95); }
.ice-player   #ip-layer-bg.wx-rain   { filter: saturate(0.55) brightness(0.72) contrast(1.05) hue-rotate(-8deg); }
.ice-player   #ip-layer-bg.wx-snow   { filter: saturate(0.4) brightness(1.08) contrast(0.9) hue-rotate(12deg); }
.ice-player   #wx-overlay {
    position: absolute; inset: 0; z-index: 1;
    pointer-events: none; opacity: 0;
    transition: opacity 500ms ease;
  }
.ice-player   #wx-overlay.rain {
    opacity: 0.35;
    background: repeating-linear-gradient(
      -20deg,
      transparent 0 6px,
      rgba(154, 216, 255, 0.06) 6px 7px
    );
    animation: raindrift 1.2s linear infinite;
  }
.ice-player   #wx-overlay.snow {
    opacity: 0.4;
    background-image:
      radial-gradient(2px 2px at 20% 30%, rgba(223,244,255,0.7), transparent),
      radial-gradient(1.5px 1.5px at 60% 70%, rgba(223,244,255,0.55), transparent),
      radial-gradient(2px 2px at 80% 20%, rgba(223,244,255,0.5), transparent);
    animation: snowdrift 8s linear infinite;
  }
  @keyframes raindrift { to { background-position: 40px 60px; } }
  @keyframes snowdrift { to { background-position: 20px 80px, -30px 100px, 10px 120px; } }

  /* ── Center ice aperture — figure composited INSIDE the window ── */
  /* v18: translucent aperture — room + ice glass show through negative space.
     Figure video is black-bg standalone + mix-blend screen (black → transparent).
     No opaque trough / black rectangular plate. */
.ice-player   #ip-figure-window {
    position: absolute;
    /* v19: taller aperture so OHP overhead lockout is not clipped */
    left: 33.2%; top: 4.5%; width: 33.6%; height: 82%;
    z-index: 3;
    pointer-events: none;
    /* NO overflow:hidden — it isolates mix-blend and recreates the black plate.
       clip-path alone shapes the ice aperture while screen still sees the room. */
    overflow: visible;
    background: transparent; /* room plate must read through */
    mix-blend-mode: screen; /* black of standalones → transparent over gym */
    box-shadow:
      0 0 0 2px color-mix(in srgb, var(--brass) 85%, transparent),
      0 0 0 3.5px color-mix(in srgb, var(--brass-deep) 40%, transparent),
      inset 0 0 0 1.5px color-mix(in srgb, var(--ice) 50%, transparent),
      0 0 32px color-mix(in srgb, var(--ice) 20%, transparent);
    clip-path: polygon(
      12px 0%, calc(100% - 12px) 0%, 100% 12px,
      100% calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%,
      0% calc(100% - 12px), 0% 12px
    );
  }
  /* no opaque vignette plate — room must read through negative space */
.ice-player   #ip-figure-window::before { content: none; display: none; }
.ice-player   #ip-layer-figure { z-index: 2; }

.ice-player   #ip-layer-figure {
    position: absolute;
    /* figure-only portrait standalones fill the aperture */
    left: 0; top: 0; width: 100%; height: 100%;
    pointer-events: none;
    mix-blend-mode: normal; /* parent #ip-figure-window owns screen blend */
    filter: none;
  }
.ice-player   #ip-layer-figure video,
.ice-player   #ip-layer-figure .poster {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: contain; /* keep padding; do not crop cyan glow */
    object-position: center 48%; /* default: slightly lower / grounded */
    display: block;
    background: transparent;
    mix-blend-mode: normal;
    /* boost live on replaced elements, not the blending parent */
    filter: brightness(1.28) contrast(1.12) saturate(1.08);
  }
  /* per-lift framing — OHP needs top room + lower figure; floor high-angle; fly reduce wash */
.ice-player   #ip-layer-figure[data-lift="ohp"] video,
.ice-player   #ip-layer-figure[data-lift="ohp"] .poster { object-position: center 58%; filter: brightness(1.22) contrast(1.12) saturate(1.05); }
.ice-player   #ip-layer-figure[data-lift="floor"] video,
.ice-player   #ip-layer-figure[data-lift="floor"] .poster { object-position: center 45%; filter: brightness(1.15) contrast(1.18) saturate(0.95); }
.ice-player   #ip-layer-figure[data-lift="fly"] video,
.ice-player   #ip-layer-figure[data-lift="fly"] .poster { object-position: center 50%; filter: brightness(1.12) contrast(1.2) saturate(0.92); }
.ice-player   #ip-layer-figure[data-lift="row"] video,
.ice-player   #ip-layer-figure[data-lift="row"] .poster { object-position: center 48%; }
.ice-player   #ip-layer-figure video { z-index: 2; }
.ice-player   #ip-layer-figure .poster { z-index: 1; }
.ice-player   #ip-layer-figure.list-mode { opacity: 0.18; }
.ice-player   #ip-layer-figure.list-mode video,
.ice-player   #ip-layer-figure.list-mode .poster { filter: saturate(0.45) brightness(0.5); }

  /* Center figure hit — play/pause */
.ice-player   #ip-hit-figure {
    position: absolute;
    left: 33.5%; top: 11%; width: 33%; height: 71%;
    z-index: 11;
    background: transparent; border: 0;
    cursor: pointer;
    pointer-events: auto;
  }
.ice-player   #ip-hit-figure:focus-visible { outline: 2px solid var(--ice-hot); outline-offset: 2px; }

  /* ── Layer 2: peelable Gibson Ice HUD ── */
.ice-player   #layer-hud {
    position: absolute; inset: 0;
    z-index: 10;
    pointer-events: none;
  }
.ice-player   #layer-hud .hit { pointer-events: auto; cursor: pointer; }

.ice-player   #ice-chrome {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    z-index: 2;
    pointer-events: none;
  }

.ice-player   #scan {
    position: absolute; left: 0; right: 0; height: 1px;
    z-index: 14; pointer-events: none;
    background: linear-gradient(90deg, transparent, var(--ice), transparent);
    opacity: 0;
    animation: scan 9s linear infinite;
  }
  @keyframes scan {
    0%   { top: 8%;  opacity: 0; }
    8%   { opacity: 0.22; }
    50%  { top: 50%; opacity: 0.18; }
    92%  { opacity: 0.22; }
    100% { top: 92%; opacity: 0; }
  }
  @media (prefers-reduced-motion: reduce) {
.ice-player     #scan, #wx-overlay.rain, #wx-overlay.snow { animation: none !important; opacity: 0 !important; }
  }

  /* Solid navy frost plates + brass rims (Gibson / Lamplight) */
.ice-player   .holo-plate {
    position: absolute;
    z-index: 4;
    pointer-events: none;
    background:
      linear-gradient(165deg,
        color-mix(in srgb, var(--navy-2) 88%, transparent) 0%,
        color-mix(in srgb, var(--navy) var(--plate), transparent) 55%,
        color-mix(in srgb, #0a1524 92%, transparent) 100%);
    backdrop-filter: blur(14px) saturate(1.15);
    -webkit-backdrop-filter: blur(14px) saturate(1.15);
    box-shadow:
      0 0 0 2px color-mix(in srgb, var(--brass) 92%, transparent),
      0 0 0 3px color-mix(in srgb, var(--brass-deep) 45%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 32%, transparent),
      inset 0 0 32px color-mix(in srgb, var(--ice) 12%, transparent),
      inset 0 1px 0 color-mix(in srgb, var(--brass) 55%, transparent),
      inset 0 -1px 0 color-mix(in srgb, var(--brass-deep) 40%, transparent),
      0 0 26px color-mix(in srgb, var(--ice) 16%, transparent),
      0 10px 32px rgba(0, 0, 0, 0.42);
    clip-path: polygon(
      var(--fy-cut) 0%,
      calc(100% - var(--fy-cut)) 0%,
      100% var(--fy-cut),
      100% calc(100% - var(--fy-cut)),
      calc(100% - var(--fy-cut)) 100%,
      var(--fy-cut) 100%,
      0% calc(100% - var(--fy-cut)),
      0% var(--fy-cut)
    );
  }
.ice-player   .holo-plate::after {
    content: "";
    position: absolute; inset: 0;
    background: repeating-linear-gradient(
      0deg,
      transparent 0 3px,
      rgba(154, 216, 255, 0.028) 3px 4px
    );
    pointer-events: none;
    opacity: 0.8;
  }
  /* Wider left box for short lift names */
.ice-player   #plate-left  { left: 2.4%; top: 6%; width: 30.5%; height: 81%; outline: 1.5px solid color-mix(in srgb, var(--brass) 70%, transparent); outline-offset: -3px; }
.ice-player   #plate-right { right: 2.8%; top: 6.5%; width: 24%; height: 80%; outline: 1.5px solid color-mix(in srgb, var(--brass) 70%, transparent); outline-offset: -3px; }

.ice-player   .ice-glyph {
    position: absolute;
    z-index: 8;
    pointer-events: none;
    background: transparent !important;
    border: 0 !important;
    color: var(--ice);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 1.05;
    text-shadow:
      0 0 1px var(--navy),
      0 0 3px var(--navy),
      0 1px 4px color-mix(in srgb, var(--navy) 85%, transparent),
      -1px 0 3px color-mix(in srgb, var(--navy) 70%, transparent),
      1px 0 3px color-mix(in srgb, var(--navy) 70%, transparent),
      0 0 8px color-mix(in srgb, var(--ice) 55%, transparent),
      0 0 16px color-mix(in srgb, var(--ice) 35%, transparent);
  }
.ice-player   .ice-glyph.active {
    color: var(--ice-hot);
    text-shadow:
      0 0 1px var(--navy),
      0 0 4px var(--navy),
      0 1px 5px color-mix(in srgb, var(--navy) 90%, transparent),
      0 0 10px color-mix(in srgb, var(--ice-hot) 80%, transparent),
      0 0 22px color-mix(in srgb, var(--ice) 55%, transparent);
  }
.ice-player   .ice-glyph.dim { color: var(--ice-dim); opacity: 0.78; }

.ice-player   #ip-g-day   { left: 5.2%; top: 9.8%; font-size: 2.7vmin; width: 24%; letter-spacing: 0.14em; }
.ice-player   #ip-g-title { left: 5.2%; top: 15.4%; font-size: 1.55vmin; width: 24%; letter-spacing: 0.16em; }

  /* Lift names — fill left box, larger type, wrap ok */
.ice-player   .lift-slot {
    position: absolute;
    left: 4.6%;
    width: 27%;
    z-index: 7;
    pointer-events: none;
    padding: 0.7% 1.0% 0.7% 2.4%;
    transition: background 160ms ease, box-shadow 160ms ease;
  }
.ice-player   .lift-slot.active {
    background: color-mix(in srgb, var(--ice) 14%, transparent);
    box-shadow:
      inset 3px 0 0 0 var(--ice-hot),
      inset 0 0 0 1px color-mix(in srgb, var(--brass) 45%, transparent),
      0 0 14px color-mix(in srgb, var(--ice) 18%, transparent);
    clip-path: polygon(6px 0, calc(100% - 6px) 0, 100% 6px, 100% calc(100% - 6px), calc(100% - 6px) 100%, 6px 100%, 0 calc(100% - 6px), 0 6px);
  }
.ice-player   .lift-slot.active::before {
    content: "";
    position: absolute;
    left: 0.35%; top: 18%; bottom: 18%;
    width: 3px;
    border-radius: 1px;
    background: linear-gradient(to bottom, var(--ice-hot), var(--ice));
    box-shadow: 0 0 8px color-mix(in srgb, var(--ice-hot) 70%, transparent);
  }
.ice-player   .lift-glyph {
    position: relative;
    left: auto; top: auto;
    width: 100%;
    max-width: none;
    font-size: 1.85vmin;
    letter-spacing: 0.045em;
    white-space: normal;
    line-height: 1.15;
  }
.ice-player   #slot-ohp   { top: 24.5%; }
.ice-player   #slot-row   { top: 32.2%; }
.ice-player   #slot-floor { top: 39.9%; }
.ice-player   #slot-fly   { top: 47.6%; }

  /* Cue / modifier — solid sub-card pill */
.ice-player   #ip-g-cue {
    left: 4.2%; top: 57.2%; width: 27%;
    font-size: 1.1vmin; font-weight: 600;
    letter-spacing: 0.04em; white-space: normal;
    line-height: 1.35; opacity: 1;
    padding: 1.2% 1.4%;
    /* must beat .ice-glyph { background: transparent !important } */
    background: linear-gradient(180deg, rgba(17,26,43,0.96), rgba(11,18,32,0.94)) !important;
    border: 0 !important;
    box-shadow:
      0 0 0 1.4px color-mix(in srgb, var(--brass) 72%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 28%, transparent),
      0 0 14px color-mix(in srgb, var(--ice) 14%, transparent);
    clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
  }
.ice-player   #ip-g-load {
    background: color-mix(in srgb, var(--navy) 78%, transparent) !important;
  }
.ice-player   #ip-g-block { left: 5.2%; top: 76.5%; font-size: 1.25vmin; width: 22%; letter-spacing: 0.12em; }

.ice-player   #ip-g-lbl-weight { right: 6.2%; top: 10.8%; width: 16%; font-size: 1.35vmin; text-align: center; left: auto; }
.ice-player   #ip-g-lbl-reps   { right: 6.2%; top: 28.5%; width: 16%; font-size: 1.35vmin; text-align: center; left: auto; }
.ice-player   #ip-g-lbl-sets   { right: 6.2%; top: 46.2%; width: 16%; font-size: 1.35vmin; text-align: center; left: auto; }

  /* Native ice digits — larger, intentional */
.ice-player   .digit {
    right: 8%; width: 12%; left: auto;
    font-size: 3.55vmin; font-variant-numeric: tabular-nums;
    text-align: center; letter-spacing: 0.1em;
    font-family: "Share Tech Mono", "SF Mono", ui-monospace, monospace;
    font-weight: 700;
  }
.ice-player   #ip-g-weight { top: 16.8%; }
.ice-player   #ip-g-reps   { top: 34.5%; }
.ice-player   #ip-g-sets   { top: 52.2%; }

  /* Compact load chip 30×8×3 under REST */
.ice-player   #ip-g-load {
    right: 5.5%; top: 67.8%; width: 18%; left: auto;
    font-size: 1.85vmin;
    font-family: "Share Tech Mono", "SF Mono", ui-monospace, monospace;
    text-align: center;
    letter-spacing: 0.08em;
    padding: 0.55% 0;
    color: var(--ice-hot);
    background: color-mix(in srgb, var(--navy) 78%, transparent);
    box-shadow:
      0 0 0 1.4px color-mix(in srgb, var(--brass) 75%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 25%, transparent),
      0 0 10px color-mix(in srgb, var(--ice) 12%, transparent);
    clip-path: polygon(6px 0, calc(100% - 6px) 0, 100% 6px, 100% calc(100% - 6px), calc(100% - 6px) 100%, 6px 100%, 0 calc(100% - 6px), 0 6px);
  }

.ice-player   .trough {
    position: absolute; z-index: 5;
    right: 6.5%; width: 15%; height: 5.2%; left: auto;
    background: color-mix(in srgb, var(--navy) 72%, transparent);
    box-shadow:
      inset 0 0 12px color-mix(in srgb, var(--ice) 22%, transparent),
      0 0 0 1.2px color-mix(in srgb, var(--brass) 70%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 28%, transparent);
    clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
    pointer-events: none;
  }
.ice-player   #trough-w { top: 16.2%; }
.ice-player   #trough-r { top: 33.9%; }
.ice-player   #trough-s { top: 51.6%; }

.ice-player   .pm-glyph {
    position: absolute; z-index: 8;
    font-size: 1.85vmin; font-weight: 700;
    color: var(--ice);
    text-shadow: 0 0 1px var(--navy), 0 0 8px color-mix(in srgb, var(--ice) 60%, transparent);
    pointer-events: none;
  }
.ice-player   #pm-w-m { right: 22.5%; top: 17.4%; left: auto; }
.ice-player   #pm-w-p { right: 4.8%;  top: 17.4%; left: auto; }
.ice-player   #pm-r-m { right: 22.5%; top: 35.1%; left: auto; }
.ice-player   #pm-r-p { right: 4.8%;  top: 35.1%; left: auto; }
.ice-player   #pm-s-m { right: 22.5%; top: 52.8%; left: auto; }
.ice-player   #pm-s-p { right: 4.8%;  top: 52.8%; left: auto; }

.ice-player   #ip-g-rest {
    right: 5.5%; top: 60.8%; width: 18%; left: auto;
    font-size: 1.95vmin; text-align: center; letter-spacing: 0.12em;
    font-family: "Share Tech Mono", "SF Mono", ui-monospace, monospace;
  }
.ice-player   #ip-g-rest.running { color: var(--ice-hot); }

.ice-player   #hex-wrap {
    position: absolute;
    right: 5.8%; bottom: 7%;
    width: 14%; height: 15%;
    z-index: 13;
    pointer-events: auto;
    cursor: pointer;
    min-width: 44px; min-height: 44px;
  }
.ice-player   #hex-wrap svg { width: 100%; height: 100%; display: block; overflow: visible; }
.ice-player   #g-chip {
    position: absolute; inset: 0;
    display: grid; place-items: center;
    font-size: 1.1vmin; letter-spacing: 0.12em;
    text-align: center;
    pointer-events: none;
    color: var(--ice-hot);
  }
.ice-player   #hex-wrap:hover polygon.hex-outer { stroke: var(--ice-hot); }
.ice-player   #hex-wrap.open polygon.hex-outer {
    stroke: var(--ice-hot);
    fill: color-mix(in srgb, var(--navy) 70%, transparent);
  }

.ice-player   .hit {
    position: absolute; z-index: 12;
    background: transparent; border: 0;
    min-height: 44px;
  }
.ice-player   .hit:focus-visible { outline: 2px solid var(--ice-hot); outline-offset: 1px; }
.ice-player   #hit-ohp   { left: 4.2%; top: 24%; width: 27%; height: 7.2%; }
.ice-player   #hit-row   { left: 4.2%; top: 31.7%; width: 27%; height: 7.2%; }
.ice-player   #hit-floor { left: 4.2%; top: 39.4%; width: 27%; height: 7.2%; }
.ice-player   #hit-fly   { left: 4.2%; top: 47.1%; width: 27%; height: 7.2%; }
.ice-player   #hit-chip  {
    right: 4.8%; bottom: 6%; left: auto; top: auto;
    width: 16%; height: 17%;
    z-index: 14;
    min-width: 48px; min-height: 48px;
  }

.ice-player   .pm { width: 3.8%; height: 6%; min-height: 36px; }
.ice-player   #ip-hit-w-minus { right: 23%; top: 16.2%; left: auto; }
.ice-player   #ip-hit-w-plus  { right: 4%;  top: 16.2%; left: auto; }
.ice-player   #ip-hit-r-minus { right: 23%; top: 33.9%; left: auto; }
.ice-player   #ip-hit-r-plus  { right: 4%;  top: 33.9%; left: auto; }
.ice-player   #ip-hit-s-minus { right: 23%; top: 51.6%; left: auto; }
.ice-player   #ip-hit-s-plus  { right: 4%;  top: 51.6%; left: auto; }

  /* ONE form-locked beat meter — left HUD only */
.ice-player   .beat-meter {
    position: absolute; z-index: 7;
    left: 1.55%; top: 24.5%;
    width: 1.35%; height: 28%;
    background: color-mix(in srgb, var(--navy) 70%, transparent);
    box-shadow:
      inset 0 0 6px color-mix(in srgb, var(--ice) 28%, transparent),
      0 0 0 1.5px color-mix(in srgb, var(--brass) 80%, transparent);
    transform-origin: bottom center;
    pointer-events: none;
    clip-path: polygon(2px 0, calc(100% - 2px) 0, 100% 2px, 100% calc(100% - 2px), calc(100% - 2px) 100%, 2px 100%, 0 calc(100% - 2px), 0 2px);
  }
.ice-player   .beat-meter > i {
    display: block; width: 100%; height: 0%;
    position: absolute; bottom: 0; left: 0;
    background: linear-gradient(to top,
      color-mix(in srgb, var(--ice) 45%, transparent),
      var(--ice-hot));
    box-shadow: 0 0 8px color-mix(in srgb, var(--ice) 60%, transparent);
    transition: none;
  }

.ice-player   #g-session {
    position: absolute;
    left: 34%; top: 14%; width: 32%; height: auto; max-height: 64%;
    z-index: 9;
    pointer-events: none;
    display: none;
    padding: 2.2% 2.5%;
    overflow: visible;
    color: var(--ice-hot);
    font-size: 1.3vmin;
    line-height: 1.45;
    letter-spacing: 0.03em;
    text-shadow:
      0 0 1px var(--navy),
      0 0 4px var(--navy),
      0 0 10px color-mix(in srgb, var(--ice) 40%, transparent);
    white-space: pre-wrap;
    background: color-mix(in srgb, var(--navy) var(--plate), transparent);
    backdrop-filter: blur(8px);
    box-shadow:
      0 0 0 1.5px color-mix(in srgb, var(--brass) 70%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 30%, transparent),
      0 0 20px color-mix(in srgb, var(--ice) 15%, transparent);
    clip-path: polygon(
      16px 0, calc(100% - 16px) 0, 100% 16px, 100% calc(100% - 16px),
      calc(100% - 16px) 100%, 16px 100%, 0 calc(100% - 16px), 0 16px
    );
  }
.ice-player   #g-session.visible { display: block; }
.ice-player   #g-session h3 {
    font-size: 1.7vmin; margin-bottom: 0.7em;
    letter-spacing: 0.14em; font-weight: 700;
  }

.ice-player   #layer-rail {
    position: absolute;
    right: 1%; top: 10%;
    z-index: 20;
    display: flex; flex-direction: column; gap: 0.45vmin;
    opacity: 0; pointer-events: none;
    transform: translateX(10px);
    transition: opacity 180ms ease, transform 180ms ease;
    padding: 1vmin 0.6vmin;
    background: color-mix(in srgb, var(--navy) 78%, transparent);
    backdrop-filter: blur(8px);
    box-shadow:
      0 0 0 1.5px color-mix(in srgb, var(--brass) 70%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 22%, transparent);
    clip-path: polygon(
      10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px),
      calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px
    );
  }
.ice-player   #layer-rail.open {
    opacity: 1; pointer-events: auto;
    transform: translateX(0);
  }
.ice-player   .rail-chip {
    appearance: none; border: 0;
    background: transparent;
    color: var(--ice);
    font: 700 1.1vmin/1 "Figtree", "Segoe UI", Helvetica, Arial, sans-serif;
    letter-spacing: 0.14em;
    padding: 0.85vmin 1.2vmin;
    min-height: 36px;
    text-align: left;
    cursor: pointer;
    text-shadow:
      0 0 1px var(--navy),
      0 0 8px color-mix(in srgb, var(--ice) 45%, transparent);
  }
.ice-player   .rail-chip:hover, .rail-chip.active {
    color: var(--ice-hot);
    text-shadow:
      0 0 2px var(--navy),
      0 0 12px color-mix(in srgb, var(--ice-hot) 70%, transparent);
  }

.ice-player   #loc-badge {
    position: absolute;
    left: 50%; bottom: 2.6%;
    transform: translateX(-50%);
    z-index: 15; pointer-events: none;
    font-size: 1.15vmin; letter-spacing: 0.14em;
    font-family: "Share Tech Mono", "SF Mono", ui-monospace, monospace;
    color: var(--ice);
    opacity: 0.88;
    text-shadow: 0 0 1px var(--navy), 0 0 8px color-mix(in srgb, var(--ice) 40%, transparent);
    text-transform: uppercase;
    padding: 0.35% 1.2%;
    background: color-mix(in srgb, var(--navy) 55%, transparent);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--brass) 40%, transparent);
  }

.ice-player   #ip-boot-hint {
    position: absolute; left: 50%; bottom: 5.8%;
    transform: translateX(-50%);
    z-index: 15; pointer-events: none;
    font-size: 1.15vmin; letter-spacing: 0.18em;
    color: var(--ice-dim); opacity: 0.8;
    text-shadow: 0 0 1px var(--navy), 0 0 8px color-mix(in srgb, var(--ice) 35%, transparent);
    transition: opacity 400ms ease;
  }
.ice-player   #ip-boot-hint.hide { opacity: 0; }

  body.hud-off #layer-hud { display: none !important; }
  body.hud-off #layer-rail { display: none !important; }
  body.hud-off #ip-boot-hint, body.hud-off #loc-badge, body.hud-off #scan { display: none !important; }
  body.hud-off #ip-hit-figure { z-index: 5; }
  body.hud-off #ip-figure-window {
    left: 0; top: 0; width: 100%; height: 100%;
    background: transparent;
    box-shadow: none;
    clip-path: none;
  }
  body.hud-off #ip-layer-figure {
    left: 0; top: 0; width: 100%; height: 100%;
  }

  /* v19 — Done (per lift) + Complete (session → Cal) */
.ice-player   #btn-row {
    position: absolute;
    left: 4.2%; top: 80.8%;
    width: 27%; height: 5.2%;
    z-index: 13;
    display: flex; gap: 3%;
    pointer-events: auto;
  }
.ice-player   .act-btn {
    flex: 1;
    display: grid; place-items: center;
    font-family: inherit;
    font-size: 1.15vmin; font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ice-hot);
    cursor: pointer;
    background: linear-gradient(180deg, rgba(17,26,43,0.96), rgba(11,18,32,0.94));
    border: 0;
    box-shadow:
      0 0 0 1.4px color-mix(in srgb, var(--brass) 75%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 28%, transparent),
      0 0 12px color-mix(in srgb, var(--ice) 14%, transparent);
    clip-path: polygon(6px 0, calc(100% - 6px) 0, 100% 6px, 100% calc(100% - 6px), calc(100% - 6px) 100%, 6px 100%, 0 calc(100% - 6px), 0 6px);
    text-shadow: 0 0 1px var(--navy), 0 0 8px color-mix(in srgb, var(--ice) 50%, transparent);
  }
.ice-player   .act-btn:hover { color: #fff; box-shadow:
      0 0 0 1.6px color-mix(in srgb, var(--ice-hot) 80%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 40%, transparent),
      0 0 16px color-mix(in srgb, var(--ice) 28%, transparent); }
.ice-player   .act-btn.done-lit {
    color: #b8f0c8;
    box-shadow:
      0 0 0 1.6px color-mix(in srgb, #7dffb0 70%, transparent),
      0 0 14px color-mix(in srgb, #7dffb0 25%, transparent);
  }
.ice-player   .act-btn:disabled { opacity: 0.45; cursor: default; }
.ice-player   .lift-slot.lift-done::after {
    content: "✓";
    position: absolute; right: 4%; top: 50%; transform: translateY(-50%);
    color: #b8f0c8; font-size: 1.6vmin;
    text-shadow: 0 0 8px color-mix(in srgb, #7dffb0 70%, transparent);
  }

  /* Warmup / Cooldown entry chips (left, under lifts / above cue) — loops mode */
.ice-player   #phase-chips {
    position: absolute;
    left: 4.2%; top: 54.6%;
    width: 27%; height: 2.6%;
    z-index: 13;
    display: flex; gap: 3%;
    pointer-events: auto;
  }
.ice-player   .phase-chip {
    flex: 1;
    display: grid; place-items: center;
    font-size: 1.0vmin; font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ice);
    cursor: pointer;
    background: color-mix(in srgb, var(--navy) 78%, transparent);
    border: 0;
    box-shadow:
      0 0 0 1.2px color-mix(in srgb, var(--brass) 65%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 22%, transparent);
    clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% calc(100% - 5px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 5px), 0 5px);
  }
.ice-player   .phase-chip.active {
    color: var(--ice-hot);
    box-shadow:
      0 0 0 1.4px color-mix(in srgb, var(--ice-hot) 70%, transparent),
      0 0 12px color-mix(in srgb, var(--ice) 22%, transparent);
  }
  body.phase-open #phase-chips .phase-chip.active { color: #fff; }

  /* Stretch / warmup-cooldown overlay panel */
.ice-player   #ip-phase-panel {
    position: absolute;
    left: 33.5%; top: 8%; width: 33%; height: 72%;
    z-index: 14;
    display: none;
    flex-direction: column;
    padding: 1.4% 1.6%;
    color: var(--ice-hot);
    background: color-mix(in srgb, var(--navy) 82%, transparent);
    backdrop-filter: blur(10px);
    box-shadow:
      0 0 0 1.6px color-mix(in srgb, var(--brass) 75%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--ice) 30%, transparent),
      0 0 28px color-mix(in srgb, var(--ice) 18%, transparent);
    clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 12px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%, 0 calc(100% - 12px), 0 12px);
    pointer-events: auto;
  }
.ice-player   #ip-phase-panel.visible { display: flex; }
.ice-player   #ip-phase-panel .ph-head {
    display: flex; align-items: center; justify-content: space-between;
    font-size: 1.35vmin; letter-spacing: 0.16em; font-weight: 700;
    text-transform: uppercase; margin-bottom: 1.2%;
  }
.ice-player   #ip-phase-panel .ph-close {
    cursor: pointer; background: transparent; border: 0;
    color: var(--ice); font-size: 1.6vmin; letter-spacing: 0.1em;
  }
.ice-player   #ip-phase-panel .ph-figure {
    /* ice loops via screen blend like lifts — no SVG sticks */
    flex: 0 0 48%;
    display: grid; place-items: center;
    background: #000;
    border-radius: 2px;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brass) 40%, transparent);
    overflow: hidden;
    min-height: 0;
  }
.ice-player   #ip-phase-panel .ph-figure img,
.ice-player   #ip-phase-panel .ph-figure video {
    width: 100%; height: 100%; object-fit: contain; object-position: center;
    mix-blend-mode: screen; background: transparent;
    filter: brightness(1.2) contrast(1.1) saturate(1.05);
  }
.ice-player   #ip-phase-panel .ph-title {
    margin-top: 1.4%;
    font-size: 1.55vmin; font-weight: 700; letter-spacing: 0.08em;
    text-transform: uppercase;
  }
.ice-player   #ip-phase-panel .ph-desc {
    margin-top: 0.6%;
    font-size: 1.15vmin; line-height: 1.45; letter-spacing: 0.02em;
    color: var(--ice);
    white-space: pre-wrap;
    flex: 1;
    overflow: auto;
  }
.ice-player   #ip-phase-panel .ph-nav {
    display: flex; align-items: center; justify-content: space-between;
    margin-top: 1%;
    gap: 2%;
  }
.ice-player   #ip-phase-panel .ph-arrow {
    cursor: pointer; background: color-mix(in srgb, var(--navy) 70%, transparent);
    border: 0; color: var(--ice-hot);
    font-size: 2vmin; font-weight: 700;
    width: 12%; min-width: 36px; height: 4.5vmin;
    clip-path: polygon(6px 0, calc(100% - 6px) 0, 100% 6px, 100% calc(100% - 6px), calc(100% - 6px) 100%, 6px 100%, 0 calc(100% - 6px), 0 6px);
    box-shadow: 0 0 0 1.2px color-mix(in srgb, var(--brass) 70%, transparent);
  }
.ice-player   #ip-phase-panel .ph-dots {
    flex: 1; text-align: center;
    font-family: "Share Tech Mono", ui-monospace, monospace;
    font-size: 1.1vmin; letter-spacing: 0.12em; color: var(--ice);
  }
.ice-player   #phase-toast {
    position: absolute; left: 50%; bottom: 9%;
    transform: translateX(-50%);
    z-index: 20; pointer-events: none;
    font-size: 1.2vmin; letter-spacing: 0.12em;
    color: var(--ice-hot);
    background: color-mix(in srgb, var(--navy) 80%, transparent);
    padding: 0.5% 1.4%;
    opacity: 0; transition: opacity 250ms ease;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--brass) 50%, transparent);
  }
.ice-player   #phase-toast.show { opacity: 1; }
  body.hud-off #btn-row, body.hud-off #phase-chips, body.hud-off #ip-phase-panel { display: none !important; }
  /* nudge cue down slightly to clear phase chips in loops mode */
.ice-player   #ip-g-cue { top: 57.8% !important; }


.ice-player-wrap { width: 100%; display: flex; justify-content: center; background: radial-gradient(ellipse at 50% 60%, #0a1218 0%, #040608 70%); }
.ice-player .stage {
  width: min(100vw, calc(100dvh * 16 / 9));
  max-height: min(72dvh, calc(100vw * 9 / 16));
}
.ice-player .lift-slot.slot-a { top: 24.5%; }
.ice-player .lift-slot.slot-b { top: 38%; }
.ice-player .hit-lift.hit-a { top: 24%; height: 12%; }
.ice-player .hit-lift.hit-b { top: 37%; height: 12%; }
.ice-player #ip-g-cue { top: 52% !important; }
.ice-player #phase-chips { top: 48%; }
.ice-player #btn-row { top: 78%; }