/* AVAVA Station — style.css: the design's styles, scoped to the design (.avava-legacy).
   To change them, add your own rules in Appearance → Editor → Styles → Additional CSS. */

:root {
  --tile: url("../img/tile-light.jpg");
  --accent: var(--wp--preset--color--ember, #C9502A);
  --accent-deep: #A14022;
  --accent-glow: #D96B48;
  --accent-hot: #E0663D;
  --accent-soft: #DD7A5B;
  --accent-tuner: #EA580C;
  /* Text tokens: the quieter levels of text, raised to a contrast of 4.5:1. */
  --t16: rgba(0, 0, 0, .56);
  --t28: rgba(0, 0, 0, .56);
  --t35: rgba(0, 0, 0, .56);
  --t4: rgba(0, 0, 0, .56);
  --t42: rgba(0, 0, 0, .57);
  --t45: rgba(0, 0, 0, .58);
  --t5: rgba(0, 0, 0, .6);
  --t55: rgba(0, 0, 0, .62);
  --accent-text: var(--accent-deep);
  --accent-ink: #fff;
  --ink: var(--wp--preset--color--ink, #141110);
  --bone: #8A7F74;
  --shell: var(--wp--preset--color--ink, #141110);
  --hero-bg: var(--tile) repeat 0 0 / 512px 512px var(--wp--preset--color--paper, #F2EFE9);
  --paper: var(--tile) repeat 0 0 / 512px 512px var(--wp--preset--color--white, #FFFFFF);
  --card: var(--tile) repeat 0 0 / 512px 512px var(--wp--preset--color--white, #FFFFFF);
  --panel: var(--tile) repeat 0 0 / 512px 512px var(--wp--preset--color--white, #FFFFFF);
  --sheet: var(--tile) repeat 0 0 / 512px 512px #EBE6DC;
  --foot-bg: var(--tile) repeat 0 0 / 512px 512px var(--wp--preset--color--white, #FFFFFF);
  --dd-bg: #F4F1EC;
  --dd-rule: rgba(0, 0, 0, .14);
  --dd-ink: var(--wp--preset--color--ink, #141110);
  --nav-ink: var(--wp--preset--color--ink, #141110);
  --nav-link: var(--wp--preset--color--ink, #141110);
  --nav-active: var(--wp--preset--color--ink, #141110);
  --theme-ring: rgba(20, 17, 16, .3);
  --pf-dot: #C9A27E;
  --hole: #928d86;
  --hover: rgba(0, 0, 0, .04);
  --i10: rgba(0, 0, 0, .1);
  --i12: rgba(0, 0, 0, .12);
  --i14: rgba(0, 0, 0, .14);
  --i16: rgba(0, 0, 0, .16);
  --i18: rgba(0, 0, 0, .18);
  --i2: rgba(0, 0, 0, .2);
  --i22: rgba(0, 0, 0, .22);
  --i28: rgba(0, 0, 0, .28);
  --i35: rgba(0, 0, 0, .35);
  --i4: rgba(0, 0, 0, .4);
  --i42: rgba(0, 0, 0, .42);
  --i45: rgba(0, 0, 0, .45);
  --i5: rgba(0, 0, 0, .5);
  --i55: rgba(0, 0, 0, .55);
  --i6: rgba(0, 0, 0, .6);
  --i65: rgba(0, 0, 0, .65);
  --i68: rgba(0, 0, 0, .68);
  --i7: rgba(0, 0, 0, .7);
  --i75: rgba(0, 0, 0, .75);
  --i78: rgba(0, 0, 0, .78);
  --i82: rgba(0, 0, 0, .82);
  --i84: rgba(0, 0, 0, .84);
  --h-ink: var(--wp--preset--color--ink, #141110);
  --h-dim: rgba(20, 17, 16, .68);
  --h-dim5: rgba(20, 17, 16, .68);
  --h-dim6: rgba(20, 17, 16, .6);
  --h-now: rgba(20, 17, 16, .72);
  --h-next: rgba(20, 17, 16, .6);
  --h-slash: rgba(20, 17, 16, .68);
  --h-sep: rgba(20, 17, 16, .28);
  --h-dim55: rgba(20, 17, 16, .6);
  --h-dim45: rgba(20, 17, 16, .6);
  --h-dim3: rgba(20, 17, 16, .3);
  --h-hr: rgba(20, 17, 16, .28);
  --h-hr16: rgba(20, 17, 16, .2);
  --h-hr28: rgba(20, 17, 16, .3);
  --h-hr3: rgba(20, 17, 16, .28);
  --h-seam: rgba(20, 17, 16, .32);
  --h-sub: rgba(20, 17, 16, .66);
  --h-tick: rgba(20, 17, 16, .34);
  --h-tick-major: rgba(20, 17, 16, .5);
  --h-wave: rgba(20, 17, 16, .82);
  --h-wave-rest: rgba(20, 17, 16, .28);
  --h-dial-notch: rgba(20, 17, 16, .42);
  --h-dial-cross: rgba(20, 17, 16, .55);
  --h-dial-track: rgba(20, 17, 16, .1);
  --h-dial-vol: var(--wp--preset--color--ink, #141110);
  --h-dial-vol-rest: rgba(20, 17, 16, .12);
  --h-btn-bg: transparent;
  --h-btn-shadow: inset 0 0 0 1px rgba(20, 17, 16, .5);
  --h-btn-ink: var(--wp--preset--color--ink, #141110);
  --h-line: rgba(20, 17, 16, .22);
  --h-sched-rule: rgba(20, 17, 16, .4);
}
:root[data-theme="dark"] {
  --t16: rgba(255, 255, 255, .48);
  --t28: rgba(255, 255, 255, .48);
  --t35: rgba(255, 255, 255, .48);
  --t4: rgba(255, 255, 255, .5);
  --t42: rgba(255, 255, 255, .51);
  --t45: rgba(255, 255, 255, .52);
  --t5: rgba(255, 255, 255, .5);
  --t55: rgba(255, 255, 255, .55);
  --accent-text: var(--accent-glow);
  --tile: url("../img/tile-dark.jpg");
  --ink: #f5f4f1;
  --bone: var(--wp--preset--color--bone, #E8DCC8);
  --shell: var(--wp--preset--color--night, #0a0a0b);
  --hero-bg: var(--tile) repeat 0 0 / 512px 512px #0d0d0d;
  --paper: var(--tile) repeat 0 0 / 512px 512px #141416;
  --card: var(--tile) repeat 0 0 / 512px 512px #1b1b1e;
  --panel: var(--tile) repeat 0 0 / 512px 512px var(--wp--preset--color--night, #0a0a0b);
  --sheet: var(--tile) repeat 0 0 / 512px 512px #141416;
  --foot-bg: var(--tile) repeat 0 0 / 512px 512px var(--wp--preset--color--night, #0A0A0B);
  --dd-bg: #141110;
  --dd-rule: rgba(255, 255, 255, .12);
  --dd-ink: #fff;
  --nav-ink: #f5f4f1;
  --nav-link: #fff;
  --nav-active: var(--accent);
  --theme-ring: rgba(255, 255, 255, .35);
  --pf-dot: rgba(20, 17, 16, .22);
  --hole: #232326;
  --hover: rgba(255, 255, 255, .04);
  --i10: rgba(255, 255, 255, .1);
  --i12: rgba(255, 255, 255, .12);
  --i14: rgba(255, 255, 255, .14);
  --i16: rgba(255, 255, 255, .16);
  --i18: rgba(255, 255, 255, .18);
  --i2: rgba(255, 255, 255, .2);
  --i22: rgba(255, 255, 255, .22);
  --i28: rgba(255, 255, 255, .28);
  --i35: rgba(255, 255, 255, .35);
  --i4: rgba(255, 255, 255, .4);
  --i42: rgba(255, 255, 255, .42);
  --i45: rgba(255, 255, 255, .45);
  --i5: rgba(255, 255, 255, .5);
  --i55: rgba(255, 255, 255, .55);
  --i6: rgba(255, 255, 255, .6);
  --i65: rgba(255, 255, 255, .65);
  --i68: rgba(255, 255, 255, .68);
  --i7: rgba(255, 255, 255, .7);
  --i75: rgba(255, 255, 255, .75);
  --i78: rgba(255, 255, 255, .78);
  --i82: rgba(255, 255, 255, .82);
  --i84: rgba(255, 255, 255, .84);
  --h-ink: #fff;
  --h-dim: rgba(255, 255, 255, .55);
  --h-dim5: rgba(255, 255, 255, .52);
  --h-dim6: rgba(255, 255, 255, .6);
  --h-now: rgba(255, 255, 255, .8);
  --h-next: rgba(255, 255, 255, .55);
  --h-slash: rgba(255, 255, 255, .3);
  --h-sep: rgba(255, 255, 255, .3);
  --h-dim55: rgba(255, 255, 255, .7);
  --h-dim45: rgba(255, 255, 255, .52);
  --h-dim3: rgba(255, 255, 255, .3);
  --h-hr: rgba(255, 255, 255, .22);
  --h-hr16: rgba(255, 255, 255, .16);
  --h-hr28: rgba(255, 255, 255, .28);
  --h-hr3: rgba(255, 255, 255, .3);
  --h-seam: rgba(255, 255, 255, .35);
  --h-sub: rgba(255, 255, 255, .6);
  --h-tick: rgba(255, 255, 255, .28);
  --h-tick-major: rgba(255, 255, 255, .55);
  --h-wave: rgba(255, 255, 255, .75);
  --h-wave-rest: rgba(255, 255, 255, .28);
  --h-dial-notch: rgba(255, 255, 255, .4);
  --h-dial-cross: rgba(255, 255, 255, .6);
  --h-dial-track: rgba(255, 255, 255, .14);
  --h-dial-vol: #f5f4f1;
  --h-dial-vol-rest: rgba(255, 255, 255, .16);
  --h-btn-bg: #141110;
  --h-btn-shadow: 0 10px 24px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(255, 255, 255, .14);
  --h-btn-ink: var(--accent);
  --h-line: rgba(255, 255, 255, .28);
  --h-sched-rule: rgba(255, 255, 255, .45);
}
@supports (color: hsl(from red h s l)) {
  :root {
    --accent-deep: hsl(from var(--accent) calc(h - 0.17) calc(s - 0.3) calc(l - 9.41));
    --accent-glow: hsl(from var(--accent) calc(h + 0.14) calc(s + 0.18) calc(l + 9.02));
    --accent-hot: hsl(from var(--accent) calc(h + 0.75) calc(s + 7.01) calc(l + 8.24));
    --accent-soft: hsl(from var(--accent) calc(h - 0.03) calc(s + 0.22) calc(l + 13.53));
    --accent-tuner: hsl(from var(--accent) calc(h + 6.2) calc(s + 24.81) calc(l + 0.59));
  }
}

html {
  scroll-padding-top: calc(var(--hd-h, 148px) + 20px);
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

@keyframes pre-fill {
  0% { clip-path: inset(100% 0 0 0); }
  55% { clip-path: inset(0 0 0 0); }
  100% { clip-path: inset(0 0 100% 0); }
}
@keyframes pre-run {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(250%); }
}
@keyframes pre-out { to { opacity: 0; visibility: hidden; } }
@keyframes aveq { 0%, 100% { transform: scaleY(.35); } 50% { transform: scaleY(1); } }
@keyframes avpulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes avblink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes ring-drift-a {
  0%   { transform: rotate(0deg); }
  28%  { transform: rotate(84deg); }
  52%  { transform: rotate(150deg); }
  76%  { transform: rotate(276deg); }
  100% { transform: rotate(360deg); }
}
@keyframes ring-drift-b {
  0%   { transform: rotate(0deg); }
  32%  { transform: rotate(-118deg); }
  58%  { transform: rotate(-172deg); }
  81%  { transform: rotate(-289deg); }
  100% { transform: rotate(-360deg); }
}
@keyframes ring-wait { to { transform: rotate(360deg); } }

@scope (.avava-legacy, .editor-styles-wrapper) {
  :scope,
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  /* Inside the design the template's own spacing applies, not the editor's block gap. */
  :scope > *,
  :scope :where(.is-layout-flow, .is-layout-constrained) > * {
    margin-block-start: 0;
    margin-block-end: 0;
  }

  /* WordPress zeroes the margins of every block's children (:root :where(.is-layout-flow) > *); the
     elements the template leaves at the browser's margins (it resets h1–h3, p, figure, ul, ol itself)
     get them back. (0,1,0), earlier than the template's rules, so those still win. */
  :scope :where(.is-layout-flow, .is-layout-constrained) > :where(blockquote, dl, pre, menu),
  :scope :where(.is-layout-flow, .is-layout-constrained) > :where(blockquote, dl, pre, menu):is(:first-child, :last-child) {
    margin-block: 1em;
  }

  :scope :where(.is-layout-flow, .is-layout-constrained) > :where(h4),
  :scope :where(.is-layout-flow, .is-layout-constrained) > :where(h4):is(:first-child, :last-child) {
    margin-block: 1.33em;
  }

  :scope :where(.is-layout-flow, .is-layout-constrained) > :where(h5),
  :scope :where(.is-layout-flow, .is-layout-constrained) > :where(h5):is(:first-child, :last-child) {
    margin-block: 1.67em;
  }

  :scope :where(.is-layout-flow, .is-layout-constrained) > :where(h6),
  :scope :where(.is-layout-flow, .is-layout-constrained) > :where(h6):is(:first-child, :last-child) {
    margin-block: 2.33em;
  }

  :scope :where(blockquote) {
    margin-inline: 40px;
  }

  :scope :where(dd) {
    margin-inline-start: 40px;
  }

  .wp-block-separator {
    border: 0;
    opacity: 1;
  }

  .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
    width: auto;
  }

  :scope {
    margin: 0;
    min-height: 100%;
    overflow-x: hidden;
    background: var(--panel);
    color: var(--ink);
    font-family: Archivo, system-ui, sans-serif;
    font-size: 15px;
    line-height: 1.45;
    -webkit-font-smoothing: antialiased;
  }

  img,
  svg {
    display: block;
    max-width: 100%;
  }

  a {
    color: inherit;
    text-decoration: none;
  }

  button {
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    color: inherit;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
  }

  input {
    font: inherit;
    color: inherit;
  }

  h1,
  h2,
  h3,
  p,
  figure,
  figcaption,
  address {
    margin: 0;
  }
  h1:is(:first-child, :last-child),
  h2:is(:first-child, :last-child),
  h3:is(:first-child, :last-child),
  p:is(:first-child, :last-child),
  figure:is(:first-child, :last-child),
  figcaption:is(:first-child, :last-child),
  address:is(:first-child, :last-child) {
    margin-top: 0;
    margin-bottom: 0;
  }

  ul,
  ol {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  ul:is(:first-child, :last-child),
  ol:is(:first-child, :last-child) {
    margin-top: 0;
    margin-bottom: 0;
  }

  fieldset {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
  }
  fieldset:is(:first-child, :last-child) {
    margin-top: 0;
    margin-bottom: 0;
  }

  legend {
    padding: 0;
  }

  :focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
  }

  .visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
  .visually-hidden:is(:first-child, :last-child) {
    margin-top: -1px;
    margin-bottom: -1px;
  }

  .only-dark {
    display: none;
  }

  .only-light {
    display: block;
  }

  :root[data-theme="dark"] :where(:scope) .only-dark {
    display: block;
  }

  :root[data-theme="dark"] :where(:scope) .only-light {
    display: none;
  }

  :root:not([data-theme="dark"]) :where(:scope) .btn-live:hover,
  :root:not([data-theme="dark"]) :where(:scope) .btn-drop:hover,
  :root:not([data-theme="dark"]) :where(:scope) .send:hover,
  :root:not([data-theme="dark"]) :where(:scope) .le-copy:hover,
  :root:not([data-theme="dark"]) :where(:scope) .tq-send:hover,
  :root:not([data-theme="dark"]) :where(:scope) .tq-input .send:hover {
    background: #141110;
    color: #fff;
  }

  :root:not([data-theme="dark"]) :where(:scope) .sheet-mail .send:hover {
    background: #fff;
    color: #141110;
  }

  .mono {
    font-family: var(--wp--preset--font-family--dm-mono);
    font-weight: 400;
    font-size: 12px;
    line-height: normal;
    letter-spacing: .16em;
  }

  .mono--1 {
    line-height: 1;
  }

  .mono--up {
    text-transform: uppercase;
  }

  .mono--0 {
    letter-spacing: 0;
  }

  .mono--4 {
    letter-spacing: .04em;
  }

  .mono--6 {
    letter-spacing: .06em;
  }

  .mono--8 {
    letter-spacing: .08em;
  }

  .mono--10 {
    letter-spacing: .1em;
  }

  .mono--12 {
    letter-spacing: .12em;
  }

  .mono--14 {
    letter-spacing: .14em;
  }

  .mono--16 {
    letter-spacing: .16em;
  }

  .mono--18 {
    letter-spacing: .18em;
  }

  .mono--20 {
    letter-spacing: .2em;
  }

  .mono--22 {
    letter-spacing: .22em;
  }

  .mono--24 {
    letter-spacing: .24em;
  }

  .mono--28 {
    letter-spacing: .28em;
  }

  .mono--lh {
    line-height: 1.4;
  }

  .ink {
    color: var(--ink);
  }

  .accent {
    color: var(--accent-text);
  }

  .dim {
    color: var(--t55);
  }

  .dim45 {
    color: var(--t45);
  }

  .dim4 {
    color: var(--t4);
  }

  .dim5 {
    color: var(--t5);
  }

  .dim35 {
    color: var(--t35);
  }

  .dim6 {
    color: var(--i6);
  }

  .dim42 {
    color: var(--t42);
  }

  .dim55 {
    color: var(--t55);
  }

  .dim65 {
    color: var(--i65);
  }

  .dim7 {
    color: var(--i7);
  }

  .dim78 {
    color: var(--i78);
  }

  .dim82 {
    color: var(--i82);
  }

  .push {
    margin-left: auto;
  }

  .nowrap {
    white-space: nowrap;
  }

  .clip {
    display: block;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .serif {
    font-family: var(--wp--preset--font-family--instrument-serif);
    font-weight: 400;
    font-style: italic;
  }

  .grot {
    font-family: var(--wp--preset--font-family--bricolage);
    font-weight: 700;
    text-transform: uppercase;
  }

  .orb {
    font-family: var(--wp--preset--font-family--orbitron);
    font-weight: 800;
  }

  .h2 {
    font: 700 clamp(34px, 4.2vw, 76px) / .94 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.04em;
    text-transform: uppercase;
    color: var(--ink);
  }

  .h2--tight {
    letter-spacing: -.045em;
  }

  .link-u {
    color: var(--ink);
    border-bottom: 1px solid var(--i4);
    padding-bottom: 3px;
  }

  .link-u:hover {
    color: var(--accent-text);
    border-bottom-color: var(--accent);
  }

  .link-a {
    color: var(--accent-text);
  }

  .link-a:hover {
    color: var(--ink);
  }

  .link-d {
    color: var(--t45);
  }

  .link-d:hover {
    color: var(--accent-text);
  }

  .dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent);
    flex: none;
  }

  .dot--pulse {
    animation: avpulse 1.6s ease-in-out infinite;
  }

  .dot--glow {
    box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 80%, transparent);
  }

  .dot--halo {
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent);
  }

  .dot--s {
    width: 5px;
    height: 5px;
  }

  .dot--w {
    background: #fff;
  }

  .eq {
    display: inline-flex;
    align-items: flex-end;
    gap: 2px;
    height: 12px;
    flex: none;
  }

  .eq > span {
    display: block;
    width: 2px;
    background: currentColor;
    transform-origin: bottom;
  }

  .eq--live > span {
    animation: aveq var(--d, .7s) ease-in-out var(--dl, 0s) infinite;
  }

  .is-paused :where(:scope) .eq--live > span,
  .is-paused :where(:scope) .wave > span {
    animation-play-state: paused;
  }

  .is-tuner-quiet :where(:scope) .ch.is-on .ch-freq .eq > span {
    animation-play-state: paused;
  }

  .eq--3 > span {
    width: 3px;
  }

  .eq--3 {
    gap: 3px;
    height: 18px;
  }

  .eq--10 {
    height: 10px;
  }

  .ph {
    display: grid;
    place-items: center;
    background: repeating-linear-gradient(135deg, var(--i10) 0 7px, var(--i16) 7px 14px);
    color: var(--t35);
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .14em;
    flex: none;
  }

  .ph--sq {
    aspect-ratio: 1;
  }

  .pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    background: var(--accent);
    color: var(--accent-ink);
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .24em;
    text-transform: uppercase;
  }

  .pill--xs {
    padding: 2px 6px;
    letter-spacing: .12em;
    text-transform: none;
  }

  .pill--s {
    padding: 3px 7px;
    letter-spacing: .14em;
    text-transform: none;
  }

  .pre {
    position: fixed;
    inset: 0;
    z-index: 100001;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 26px;
    background: var(--panel);
    animation: pre-out .5s ease 8s forwards;
  }

  .pre-mark {
    width: min(340px, 62vw);
    height: auto;
  }

  .pre-outline {
    fill: none;
    stroke: var(--i28);
    stroke-width: .7;
  }

  .pre-fill {
    fill: var(--accent);
    clip-path: inset(100% 0 0 0);
    animation: pre-fill 1.9s ease-in-out infinite;
  }

  .pre-line {
    width: min(340px, 62vw);
    height: 2px;
    background: var(--i12);
    overflow: hidden;
  }

  .pre-line::before {
    content: "";
    display: block;
    width: 40%;
    height: 100%;
    background: var(--accent);
    animation: pre-run 1.9s ease-in-out infinite;
  }

  .is-booted :where(:scope) .pre {
    display: none;
  }

  .pre.is-gone {
    opacity: 0;
    visibility: hidden;
    transition: opacity .45s ease, visibility 0s linear .45s;
  }

  @media (prefers-reduced-motion: reduce) {
    .band-needle,
    .band-here {
      transition: none;
    }
    .pre-fill {
      animation: none;
      clip-path: none;
    }
    .pre-line::before {
      animation: none;
      width: 100%;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .eq--live > span,
    .dot--pulse,
    .hero-cursor {
      animation: none;
    }
  }

  .hero-wrap {
    position: relative;
    width: 100%;
    min-height: 100vh;
    overflow: hidden;
    background: var(--hero-bg);
  }

  .hero-art {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .shell {
    position: relative;
    min-height: 100vh;
    padding: 0 40px 28px;
    display: flex;
    flex-direction: column;
  }

  .hd {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100000;
    padding: 28px 40px 16px;
    display: flex;
    flex-direction: column;
    background: transparent;
    transition: background-color .18s ease, box-shadow .18s ease;
  }

  .hd.is-stuck {
    background: var(--panel);
    box-shadow: 0 1px 0 var(--i12), 0 18px 30px rgba(0, 0, 0, .18);
  }

  :root[data-theme="dark"] :where(:scope) .hd.is-stuck {
    box-shadow: 0 1px 0 var(--i12), 0 18px 30px rgba(0, 0, 0, .45);
  }

  .shell,
  .shell--page {
    padding-top: var(--hd-h, 148px);
  }

  .hd-top {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: clamp(12px, 1.6vw, 28px);
    padding-bottom: 12px;
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    line-height: 1;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--t55);
  }

  .hd-top > * {
    white-space: nowrap;
  }

  .hd-top .sep {
    color: var(--i28);
  }

  .hd-top a {
    color: var(--t55);
  }

  .hd-top a:hover {
    color: var(--accent-text);
  }

  .hd-rule {
    height: 1px;
    background: var(--i18);
  }

  .hd-main {
    display: flex;
    align-items: center;
    gap: clamp(16px, 2vw, 40px);
    padding-top: 16px;
  }

  .logo {
    flex: none;
  }

  .logo img {
    height: 60px;
    width: 241px;
  }

  .nav-wrap {
    margin-left: auto;
    min-width: 0;
  }

  .nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    min-width: 0;
    gap: clamp(8px, 1.25vw, 34px) clamp(10px, 1.6vw, 34px);
    font: 400 16px / 1 var(--wp--preset--font-family--archivo);
    letter-spacing: 1px;
    text-transform: uppercase;
  }

  .nav > li {
    position: relative;
    display: flex;
    align-items: center;
  }

  @media (max-width: 2000px) {
    .nav {
      font-size: 15px;
    }
    .nav .dd-panel a,
    .nav .dd-panel button {
      font-size: 15px;
    }
  }

  .nav a,
  .nav button {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 0;
    border-bottom: 1px solid transparent;
    color: var(--nav-ink);
    white-space: nowrap;
  }

  .nav a:hover,
  .nav button:hover,
  .nav a.is-active,
  .nav button.is-active,
  .nav li.is-open > button,
  .nav li.is-open > a {
    color: var(--accent-text);
    border-bottom-color: var(--accent);
  }

  .nav > li > a {
    color: var(--nav-link);
  }

  .nav .caret {
    font-size: 12px;
    transform: translateY(1px);
  }

  .dd {
    position: absolute;
    left: -24px;
    top: 100%;
    padding-top: 14px;
    display: none;
    z-index: 40;
  }

  .dd--right {
    left: auto;
    right: -10px;
  }

  .is-open > .dd {
    display: block;
  }

  .dd-panel {
    min-width: 268px;
    padding: 22px 26px;
    background: var(--dd-bg);
    border: 1px solid var(--dd-rule);
    border-radius: 14px;
    box-shadow: 0 24px 54px rgba(0, 0, 0, .35);
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .dd-panel--s {
    min-width: 212px;
  }

  .dd-panel--lang {
    min-width: 186px;
    padding: 16px 20px;
    gap: 14px;
  }

  .dd-panel a,
  .dd-panel button {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 0;
    border: 0;
    font: 400 16px / 1 var(--wp--preset--font-family--archivo);
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--dd-ink);
    white-space: nowrap;
  }

  .dd-panel a:hover,
  .dd-panel button:hover,
  .dd-panel .is-on,
  .dd-panel a.is-active {
    color: var(--accent-text);
  }

  .dd-panel .code {
    margin-left: auto;
    font: 400 12px / normal var(--wp--preset--font-family--dm-mono);
    letter-spacing: .14em;
    opacity: .6;
  }

  .lang {
    position: relative;
    display: flex;
    align-items: center;
    flex: none;
    margin-left: 0;
  }

  .lang > button {
    display: flex;
    align-items: center;
    gap: 7px;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    color: var(--nav-ink);
  }

  .lang > button .caret {
    font-size: 12px;
    transform: translateY(1px);
  }

  .lang.is-open > button {
    color: var(--nav-active);
  }

  .theme {
    flex: none;
    margin-left: clamp(6px, .8vw, 14px);
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid var(--theme-ring);
    display: grid;
    place-items: center;
    color: var(--nav-ink);
  }

  .theme:hover {
    border-color: var(--accent);
    color: var(--accent-text);
  }

  .theme .ic-sun {
    display: block;
  }

  .theme .ic-moon {
    display: none;
  }

  :root[data-theme="dark"] :where(:scope) .theme .ic-sun {
    display: none;
  }

  :root[data-theme="dark"] :where(:scope) .theme .ic-moon {
    display: block;
  }

  .btn-live {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: clamp(8px, 1vw, 18px);
    padding: clamp(6px, .75vw, 15px) clamp(9px, 1.35vw, 32px);
    background: var(--accent);
    color: var(--accent-ink);
    font: 500 18px / 1 var(--wp--preset--font-family--archivo);
    letter-spacing: .2em;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .btn-live:hover {
    background: #fff;
    color: #141110;
  }

  .page-head {
    background: var(--panel);
  }

  .shell--page {
    min-height: auto;
    padding-bottom: 0;
  }

  .shell--page .crumbs {
    margin-top: 0;
  }
  .shell--page .crumbs:is(:first-child, :last-child) {
    margin-top: 0;
  }

  .hd--page::after {
    content: "";
    position: absolute;
    left: 40px;
    right: 40px;
    bottom: 0;
    height: 1px;
    background: var(--i12);
  }

  .crumbs {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0 0;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--t5);
  }

  .crumbs a {
    color: var(--t5);
  }

  .crumbs a:hover {
    color: var(--accent-text);
  }

  .crumbs .sep {
    color: var(--i28);
  }

  .crumbs [aria-current] {
    color: var(--nav-ink);
  }

  .page {
    background: var(--panel);
  }

  .sec--page {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .hero {
    flex: 1;
    display: flex;
    align-items: center;
    padding: clamp(24px, 4vh, 60px) 0;
    color: var(--h-ink);
  }

  .hero-col {
    display: flex;
    flex-direction: column;
    gap: clamp(8px, 2.2vh, 44px);
    width: min(52%, 1150px);
    margin: auto 0;
    transform: translateY(25px);
  }
  .hero-col:is(:first-child, :last-child) {
    margin-top: auto;
    margin-bottom: auto;
  }

  .hero-air {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
  }

  .hero-air .on {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: none;
    letter-spacing: .26em;
    color: var(--accent-text);
  }

  .hero-air .on .dot {
    box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 90%, transparent);
  }

  .hero-air .now {
    flex: none;
    letter-spacing: .2em;
    color: var(--h-dim);
  }

  .hero-air .hr {
    flex: 1;
    height: 1px;
    min-width: 20px;
    background: var(--h-hr);
  }

  .hero-air .meta {
    flex: none;
    color: var(--h-dim5);
  }

  .hero-title {
    display: flex;
    align-items: stretch;
    gap: clamp(16px, 2.2vw, 34px);
    color: var(--h-ink);
  }

  .hero-freq {
    flex: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 6px;
  }

  .hero-freq .num {
    font: 800 clamp(52px, min(10vw, 16.6vh), 196px) / .78 var(--wp--preset--font-family--archivo);
    letter-spacing: -.06em;
    color: var(--accent);
  }

  .hero-freq .unit {
    display: flex;
    align-items: center;
    gap: 9px;
    padding-left: 4px;
    color: var(--h-dim5);
  }

  .hero-freq .unit .hr {
    width: 34px;
    height: 1px;
    background: var(--h-hr3);
  }

  .hero-seam {
    flex: none;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--h-seam) 18%, var(--h-seam) 82%, transparent);
  }

  .hero-city {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    min-width: 0;
  }

  .hero-city h1 {
    font: 700 clamp(28px, min(4.6vw, 7.6vh), 88px) / .9 var(--wp--preset--font-family--bricolage);
    text-transform: uppercase;
    letter-spacing: -.05em;
  }

  .hero-city .tag {
    display: flex;
    align-items: baseline;
    gap: 14px;
  }

  .hero-bone {
    font: 400 clamp(24px, min(3.6vw, 6vh), 70px) / 1 var(--wp--preset--font-family--instrument-serif);
    font-style: italic;
    color: var(--bone);
  }

  .hero-cursor {
    display: inline-block;
    width: clamp(9px, 1vw, 17px);
    height: clamp(20px, min(2.4vw, 4vh), 44px);
    background: var(--accent);
    align-self: center;
    animation: avblink 1.1s steps(1) infinite;
  }

  .hero-sub {
    font: 300 clamp(15px, min(1.6vw, 2.6vh), 26px) / 1.3 var(--wp--preset--font-family--bricolage);
    color: var(--h-sub);
    margin-top: clamp(6px, 1.2vh, 14px);
    max-width: 34ch;
  }
  .hero-sub:is(:first-child, :last-child) {
    margin-top: clamp(6px, 1.2vh, 14px);
  }

  .hero-facts {
    padding-top: clamp(10px, 1.6vh, 18px);
    border-top: 1px solid var(--h-hr28);
  }

  .band {
    position: relative;
    height: 40px;
  }

  .band-ticks {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .band-ticks > span {
    width: 1px;
    height: 6px;
    background: var(--h-tick);
    flex: none;
  }

  .band-ticks > span:nth-child(4n+1) {
    height: 12px;
    background: var(--h-tick-major);
  }

  .band-needle {
    position: absolute;
    left: 33.5%;
    top: -7px;
    transition: left .28s ease;
    width: 2px;
    height: 26px;
    background: var(--accent);
    box-shadow: 0 0 10px color-mix(in srgb, var(--accent) 80%, transparent);
  }

  .band-here {
    position: absolute;
    left: 33.5%;
    top: 22px;
    transform: translateX(-50%);
    letter-spacing: .14em;
    color: var(--accent-text);
    white-space: nowrap;
    transition: left .28s ease;
  }

  .band.is-edge-l .band-lo,
  .band.is-edge-r .band-hi {
    opacity: 0;
  }

  .band-lo,
  .band-hi {
    transition: opacity .18s ease;
  }

  .band.is-live .band-needle {
    box-shadow: 0 0 14px color-mix(in srgb, var(--accent) 95%, transparent);
  }

  .band-lo,
  .band-hi {
    position: absolute;
    top: 18px;
    color: var(--h-dim45);
    letter-spacing: 0;
  }

  .band-lo {
    left: 0;
  }

  .band-hi {
    right: 0;
  }

  .hero-count {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--h-hr16);
    letter-spacing: .18em;
    color: var(--h-dim);
  }

  .hero-count .slash {
    color: var(--h-slash);
  }

  .sec.sec--intro {
    background: var(--panel);
    padding-top: 40px;
    padding-bottom: 0;
  }

  .pg-intro {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: clamp(24px, 3vw, 56px);
  }

  .pg-title {
    flex: 1 1 460px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .pg-title h1 {
    font: 700 clamp(34px, 5.4vw, 96px) / .92 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.045em;
    text-transform: uppercase;
  }

  .pg-title .tag {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 18px;
  }

  .pg-title .serif {
    font-size: clamp(34px, 5.4vw, 96px);
    line-height: .96;
    color: var(--accent);
  }

  .pg-title h1 .serif {
    font-weight: 400;
    text-transform: none;
  }

  .pg-title .since {
    font: 300 clamp(22px, 2.4vw, 40px) / 1 var(--wp--preset--font-family--bricolage);
    color: var(--i6);
  }

  .pg-intro .pl {
    flex: 1 1 540px;
    min-width: 0;
    margin-top: 0;
    align-self: center;
  }
  .pg-intro .pl:is(:first-child, :last-child) {
    margin-top: 0;
  }

  @media (min-width: 761px) {
    .pg-intro .pl {
      position: relative;
      top: -13px;
    }
  }

  .pg-intro .pl-readout {
    display: none;
  }

  .pg-intro .pl-line .freq,
  .pg-intro .pl-line .count {
    color: var(--i7);
  }

  .pg-intro .pl-line .slash {
    color: var(--i28);
  }

  .pg-intro .pl-track {
    color: var(--ink);
  }

  .pg-intro .pl-foot {
    border-top-color: var(--i28);
  }

  .pg-intro .pl-foot .now {
    color: var(--i78);
  }

  .pg-intro .pl-foot .next {
    color: var(--t55);
  }

  .pg-intro .pl-foot .air {
    color: var(--i6);
  }

  .pg-intro .pl-foot .sched {
    color: var(--ink);
    border-bottom-color: var(--i45);
  }

  .pg-intro .pl-readout .sep {
    color: var(--i28);
  }

  .pg-intro .pl-readout .vol {
    color: var(--i7);
  }

  .pg-intro .pl-wave .t {
    color: var(--t45);
  }

  .pg-intro .wave > span {
    background: var(--i28);
  }

  .pg-intro .wave > span:nth-child(-n+20) {
    background: var(--i75);
  }

  .pg-intro .dial-notch {
    background: repeating-conic-gradient(var(--i4) 0deg .7deg, transparent .7deg 7.5deg);
  }

  .pg-intro .dial-cross {
    background: conic-gradient(var(--i6) 0 1.4deg, transparent 1.4deg 90deg, var(--i6) 90deg 91.4deg, transparent 91.4deg 180deg, var(--i6) 180deg 181.4deg, transparent 181.4deg 270deg, var(--i6) 270deg 271.4deg, transparent 271.4deg 360deg);
  }

  .pg-intro .dial-hour {
    background: conic-gradient(var(--accent) 0 var(--hour, 64%), var(--i14) var(--hour, 64%) 100%);
  }

  .pg-intro .dial-vol {
    background: conic-gradient(#f5f4f1 0 var(--vol, 72%), var(--i16) var(--vol, 72%) 100%);
  }

  :root[data-theme="dark"] :where(:scope) .pg-intro .dial-btn {
    background: #141110;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .5), inset 0 0 0 1px var(--i14);
  }

  .pg-scale {
    position: relative;
    height: 70px;
    margin-top: 40px;
  }
  .pg-scale:is(:first-child, :last-child) {
    margin-top: 40px;
  }

  .pg-scale .line {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 1px;
    background: var(--i28);
  }

  .pg-scale .ticks {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .pg-scale .ticks > span {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: 0;
  }

  .pg-scale .ticks > span > i {
    display: block;
    width: 1px;
    height: 8px;
    background: var(--i28);
  }

  .pg-scale .ticks > span > b {
    font: 400 12px / normal var(--wp--preset--font-family--dm-mono);
    color: var(--t5);
  }

  .pg-scale .ticks > span.major > i {
    height: 14px;
    background: var(--i55);
  }

  .pg-scale .needle {
    position: absolute;
    top: -10px;
    left: 64%;
    height: 30px;
    width: 1px;
    background: var(--accent);
  }

  .pg-scale .needle::before {
    content: "";
    position: absolute;
    left: -2.5px;
    top: -5px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent);
  }

  .pg-scale .needle .mono {
    position: absolute;
    left: -14px;
    top: -26px;
    color: var(--ink);
  }

  @media (max-width: 760px) {
    .pg-intro .pl {
      flex-basis: 100%;
    }
  }

  @media (min-width: 1101px) and (max-width: 2000px) {
    .pg-intro {
      gap: clamp(20px, 2.4vw, 40px);
    }
    .pg-title {
      gap: 0;
    }
    .pg-title h1 {
      font-size: clamp(34px, 3.9vw, 72px);
    }
    .pg-title .serif {
      font-size: clamp(34px, 3.9vw, 72px);
    }
    .pg-title .since {
      font-size: clamp(20px, 1.6vw, 30px);
    }
    .pg-intro .pl {
      flex-basis: 480px;
      flex-grow: 2;
    }
    .pg-intro .pl-track {
      font-size: clamp(20px, 1.6vw, 28px);
    }
    .pg-intro .pl-main {
      gap: 9px;
    }
    .pg-scale {
      height: 60px;
    }
  }

  .pl {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: clamp(24px, 3vw, 44px);
    margin-top: clamp(10px, 2.4vh, 40px);
  }
  .pl:is(:first-child, :last-child) {
    margin-top: clamp(10px, 2.4vh, 40px);
  }

  .pl-dial-col {
    flex: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }

  .dial {
    position: relative;
    width: clamp(142px, 14vw, 196px);
    aspect-ratio: 1;
  }

  .dial > span {
    position: absolute;
    border-radius: 50%;
  }

  .dial-notch {
    inset: 0;
    background: repeating-conic-gradient(var(--h-dial-notch) 0deg .7deg, transparent .7deg 7.5deg);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 7px));
  }

  .dial-cross {
    inset: 0;
    background: conic-gradient(var(--h-dial-cross) 0 1.4deg, transparent 1.4deg 90deg, var(--h-dial-cross) 90deg 91.4deg, transparent 91.4deg 180deg, var(--h-dial-cross) 180deg 181.4deg, transparent 181.4deg 270deg, var(--h-dial-cross) 270deg 271.4deg, transparent 271.4deg 360deg);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 13px), #000 calc(100% - 13px));
  }

  .dial-hour {
    inset: 15px;
    background: conic-gradient(var(--accent) 0 var(--hour, 64%), var(--h-dial-track) var(--hour, 64%) 100%);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 9px), #000 calc(100% - 9px));
  }

  .dial-vol {
    inset: 19%;
    background: conic-gradient(var(--h-dial-vol) 0 var(--vol, 72%), var(--h-dial-vol-rest) var(--vol, 72%) 100%);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 3px));
  }

  .dial-btn {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
    height: 50%;
    border-radius: 50%;
    background: var(--h-btn-bg);
    box-shadow: var(--h-btn-shadow);
    display: grid;
    place-items: center;
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: clamp(14px, 1.4vw, 18px);
    color: var(--h-btn-ink);
    transition: transform .18s ease;
  }

  .dial-btn:hover {
    transform: translate(-50%, -50%) scale(1.04);
  }

  .is-paused :where(:scope) .dial-btn > span {
    font-size: clamp(20px, 1.9vw, 26px);
  }

  .dial-hour {
    animation: ring-drift-a 19s linear infinite;
  }

  .dial-vol {
    animation: ring-drift-b 11s linear infinite;
  }

  .is-paused :where(:scope) .dial-hour,
  .is-paused :where(:scope) .dial-vol {
    animation-play-state: paused;
  }

  .dial-btn::after {
    content: "";
    position: absolute;
    inset: -7px;
    border: 2px solid transparent;
    border-top-color: var(--accent);
    border-radius: 50%;
    opacity: 0;
    pointer-events: none;
  }

  .is-loading :where(:scope) .dial-btn::after {
    opacity: 1;
    animation: ring-wait .8s linear infinite;
  }

  :root:not([data-theme="dark"]) :where(:scope) .dial-btn::after {
    border-top-color: #141110;
  }

  .is-loading :where(:scope) .dial-btn > span {
    opacity: .45;
  }

  .pl-track.is-wait {
    color: var(--h-dim);
  }

  @media (prefers-reduced-motion: reduce) {
    .dial-hour,
    .dial-vol {
      animation: none;
    }
    .is-loading :where(:scope) .dial-btn::after {
      animation: none;
      opacity: .6;
    }
  }

  .dial-pointer {
    position: absolute;
    left: 50%;
    top: -3px;
    width: 2px;
    height: 13px;
    margin-left: -1px;
    background: var(--accent);
  }

  .pl-readout {
    display: flex;
    align-items: baseline;
    gap: 9px;
    margin-top: 8px;
    letter-spacing: .18em;
    white-space: nowrap;
  }
  .pl-readout:is(:first-child, :last-child) {
    margin-top: 8px;
  }

  .pl-readout .sep {
    color: var(--h-sep);
  }

  .pl-readout .vol {
    color: var(--h-dim55);
  }

  .pl-main {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
    flex: 1;
  }

  .pl-line {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
  }

  .pl-line > * {
    flex: none;
    white-space: nowrap;
  }

  .pl-line .live {
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--accent-text);
  }

  .pl-line .slash {
    letter-spacing: .24em;
    color: var(--h-dim3);
  }

  .pl-line .freq {
    letter-spacing: .2em;
    color: var(--h-dim55);
  }

  .pl-line .count {
    margin-left: auto;
    color: var(--h-dim55);
  }

  .pl-track {
    display: block;
    min-width: 0;
    font: 600 clamp(20px, 2.6vw, 40px) / 1.08 var(--wp--preset--font-family--archivo);
    letter-spacing: -.03em;
    color: var(--h-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .pl-wave {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .pl-wave .t {
    flex: none;
    letter-spacing: .14em;
    color: var(--h-dim45);
  }

  .wave {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 30px;
    overflow: hidden;
  }

  .wave > span {
    width: 3px;
    flex: none;
    background: var(--h-wave-rest);
    transform-origin: bottom;
    animation: aveq var(--d, .7s) ease-in-out var(--dl, 0s) infinite;
  }

  .wave > span:nth-child(-n+20) {
    background: var(--h-wave);
  }

  .pl-foot {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--h-line);
  }

  .pl-foot .now {
    color: var(--h-now);
  }

  .pl-foot .next {
    color: var(--h-next);
  }

  .pl-foot .save {
    margin-left: auto;
    color: var(--accent-text);
    letter-spacing: .16em;
  }

  .pl-foot .air {
    color: var(--h-dim6);
  }

  .pl-foot .air:hover {
    color: var(--accent-text);
  }

  .pl-foot .sched {
    color: var(--h-ink);
    border-bottom: 1px solid var(--h-sched-rule);
    padding-bottom: 3px;
  }

  .pl-foot .sched:hover {
    color: var(--accent-text);
    border-bottom-color: var(--accent);
  }

  .tuner {
    width: 100%;
    background: none;
    border: 0;
  }

  .thumb {
    display: block;
    flex: none;
    object-fit: cover;
  }

  .thumb--36 {
    width: 36px;
    height: 36px;
  }

  .thumb--40 {
    width: 40px;
    height: 40px;
  }

  .thumb--44 {
    width: 44px;
    height: 44px;
  }

  .thumb--52 {
    width: 52px;
    height: 52px;
  }

  .thumb--58 {
    width: 58px;
    height: 58px;
  }

  .thumb--72 {
    width: 72px;
    height: 72px;
  }

  .thumb--sc {
    width: clamp(120px, 13vw, 164px);
    height: clamp(120px, 13vw, 164px);
  }

  .thumb--np {
    width: clamp(92px, 10vw, 118px);
    height: clamp(92px, 10vw, 118px);
  }

  .thumb--pc {
    width: clamp(150px, 17vw, 200px);
    height: clamp(150px, 17vw, 200px);
  }

  .ch-art {
    flex: none;
    width: 68px;
    height: 68px;
    object-fit: cover;
  }

  .sec {
    padding: 0 40px;
  }

  .sec--channels {
    background: var(--panel);
    padding-top: 60px;
  }

  .sec--schedule {
    background: var(--paper);
  }

  .sec--shows {
    background: var(--card);
  }

  .sec--tracks {
    background: var(--panel);
  }

  .sec--podcasts {
    background: var(--paper);
  }

  .sec--requests {
    background: var(--sheet);
    padding-bottom: 60px;
  }

  .divider {
    margin: 60px 40px;
    height: 1px;
    background: var(--i12);
  }
  .divider:is(:first-child, :last-child) {
    margin-top: 60px;
    margin-bottom: 60px;
  }

  .sec-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 24px;
    margin-bottom: clamp(24px, 3vw, 38px);
  }
  .sec-head:is(:first-child, :last-child) {
    margin-bottom: clamp(24px, 3vw, 38px);
  }

  .sec-head--sched {
    margin-bottom: clamp(26px, 3.2vw, 40px);
  }
  .sec-head--sched:is(:first-child, :last-child) {
    margin-bottom: clamp(26px, 3.2vw, 40px);
  }

  .sec-head--tracks {
    margin-bottom: clamp(24px, 2.6vw, 34px);
  }
  .sec-head--tracks:is(:first-child, :last-child) {
    margin-bottom: clamp(24px, 2.6vw, 34px);
  }

  .sec-head--req {
    margin-bottom: clamp(26px, 3vw, 36px);
  }
  .sec-head--req:is(:first-child, :last-child) {
    margin-bottom: clamp(26px, 3vw, 36px);
  }

  .sec-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 9px;
  }

  .sec-meta--8 {
    gap: 8px;
  }

  .sec-meta .tuned {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--accent-text);
  }

  .vlabel {
    flex: none;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .34em;
    text-transform: uppercase;
    color: var(--t45);
    padding: 4px 0;
    border-left: 1px solid var(--i18);
  }

  .play-btn {
    flex: none;
    border-radius: 50%;
    background: var(--shell);
    color: #fff;
    display: grid;
    place-items: center;
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
  }

  .play-btn:hover {
    background: var(--accent);
    color: #fff;
  }

  :root[data-theme="dark"] :where(:scope) .play-btn {
    background: var(--accent);
  }

  :root[data-theme="dark"] :where(:scope) .play-btn:hover {
    background: var(--ink);
    color: var(--shell);
  }

  .play-btn--56 {
    width: 56px;
    height: 56px;
    font-size: 17px;
  }

  .play-btn--48 {
    width: 48px;
    height: 48px;
    font-size: 15px;
  }

  .play-btn--44 {
    width: 44px;
    height: 44px;
    font-size: 14px;
  }

  .ring-btn {
    flex: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid var(--i28);
    display: grid;
    place-items: center;
    color: var(--ink);
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 19px;
    line-height: 1;
  }

  .ring-btn:hover,
  .ring-btn.is-on {
    border-color: var(--accent);
    color: var(--accent-text);
  }

  .ring-btn--30 {
    width: 30px;
    height: 30px;
    color: var(--i75);
    font-size: 15px;
  }

  .ring-btn--46 {
    width: 46px;
    height: 46px;
    border-color: var(--i35);
    color: var(--t55);
    font-size: 24px;
  }

  .hbar {
    display: flex;
    align-items: center;
    gap: 14px;
  }

  .hbar .t {
    flex: none;
    letter-spacing: .14em;
    color: var(--t5);
  }

  .hbar .bar {
    position: relative;
    flex: 1;
    min-width: 0;
    height: 6px;
    background: var(--i12);
  }

  .hbar .bar .fill {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: var(--hour, 64%);
    background: var(--accent);
  }

  .hbar .bar .mark {
    position: absolute;
    left: var(--hour, 64%);
    top: -6px;
    bottom: -6px;
    width: 2px;
    background: var(--ink);
  }

  .hbar--thin .bar {
    height: 4px;
    background: var(--i16);
  }

  .hbar--thin .bar .fill {
    position: static;
    display: block;
    height: 4px;
  }

  .abar {
    display: block;
    height: 2px;
    background: var(--i12);
    min-width: 0;
  }

  .abar > span {
    display: block;
    height: 100%;
    background: var(--i28);
  }

  .abar--3 {
    height: 3px;
  }

  .abar--4 {
    height: 4px;
  }

  .abar--5 {
    height: 5px;
  }

  .abar--8 {
    height: 8px;
  }

  .is-on > .abar > span,
  .is-on .abar > span,
  .is-new .abar > span {
    background: var(--accent);
  }

  .btn-ember {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 13px 20px;
    background: var(--accent);
    color: #fff;
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .2em;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .btn-ember--s {
    padding: 9px 14px;
    letter-spacing: .16em;
  }

  .btn-ember:hover {
    background: var(--accent-hot);
    color: #fff;
  }

  :root:not([data-theme="dark"]) :where(:scope) .btn-ember:hover {
    background: #141110;
    color: #fff;
  }

  .chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .chip {
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: 8px 12px;
    border: 1px solid var(--i16);
    color: var(--t55);
    white-space: nowrap;
  }

  .chip:hover {
    border-color: var(--accent);
  }

  .chip.is-on {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    color: var(--accent-text);
  }

  .chip--s {
    padding: 6px 10px;
    letter-spacing: .1em;
    text-transform: none;
    border-color: var(--i14);
  }

  .chip--s.is-on {
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
    background: color-mix(in srgb, var(--accent) 10%, transparent);
  }

  .field {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
  }

  .field label {
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
  }

  .field input {
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--i35);
    background: none;
    padding: 7px 0;
    font: 400 16px / 1.2 var(--wp--preset--font-family--archivo);
    color: var(--ink);
    outline: none;
    border-radius: 0;
  }

  .field input:focus {
    border-bottom-color: var(--accent);
  }

  .rq {
    flex: 1;
    min-width: 0;
    padding: 10px 0;
    border: 0;
    border-bottom: 1px solid var(--i5);
    background: none;
    border-radius: 0;
    font: 400 16px / 1.2 var(--wp--preset--font-family--archivo);
    color: var(--ink);
  }

  .rq::placeholder {
    color: var(--i6);
  }

  .rq:focus {
    outline: none;
    border-bottom-color: var(--accent);
  }

  .send {
    flex: none;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--accent);
    color: var(--accent-ink);
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    display: grid;
    place-items: center;
  }

  .send:hover {
    background: var(--ink);
    color: var(--shell);
  }

  .send--36 {
    width: 36px;
    height: 36px;
  }

  .ch-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(12px, 1.6vw, 20px);
  }

  .ch {
    display: flex;
    flex-direction: column;
    gap: 11px;
    min-width: 0;
    padding: 16px;
    border: 1px solid var(--i16);
    background: transparent;
    text-align: left;
    color: var(--ink);
    transition: transform .2s ease, border-color .2s ease;
  }

  .ch-grid--top .ch:hover {
    transform: translateY(-5px);
    border-color: var(--accent);
  }

  .ch-grid--bottom .ch:hover {
    transform: translateY(5px);
    border-color: var(--accent);
  }

  .ch {
    position: relative;
  }

  .hit {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    border-radius: inherit;
  }

  .hit:focus-visible {
    outline-offset: -2px;
  }

  .ch-top {
    display: flex;
    gap: 12px;
    min-width: 0;
  }

  .ch-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    flex: 1;
  }

  .ch-freq {
    display: flex;
    align-items: baseline;
    gap: 8px;
  }

  .ch-freq .n {
    font: 800 22px / 1 var(--wp--preset--font-family--orbitron);
  }

  .ch-freq .fm {
    letter-spacing: .2em;
    color: var(--t45);
  }

  .ch-freq .eq {
    margin-left: auto;
    color: var(--i28);
  }

  .ch-name {
    display: block;
    min-width: 0;
    font: 700 21px / 1.02 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.03em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .ch-host {
    display: block;
    min-width: 0;
    font: 400 15px / 1.2 var(--wp--preset--font-family--instrument-serif);
    font-style: italic;
    color: var(--t55);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .ch-now {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding-top: 9px;
    border-top: 1px solid var(--i14);
  }

  .ch-now .lbl {
    flex: none;
    color: var(--t45);
  }

  .ch-now .txt {
    display: block;
    min-width: 0;
    font: 400 14px / 1.35 var(--wp--preset--font-family--archivo);
    color: var(--i68);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .ch-foot {
    display: flex;
    align-items: baseline;
    gap: 8px;
  }

  .ch-foot .genre {
    min-width: 0;
    letter-spacing: .14em;
    color: var(--t45);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .ch-foot .lis {
    margin-left: auto;
    flex: none;
    letter-spacing: .12em;
    color: var(--t45);
  }

  .ch.is-on {
    border-color: var(--accent);
    background: var(--accent);
    color: #fff;
    box-shadow: 0 18px 40px color-mix(in srgb, var(--accent) 26%, transparent);
  }

  .ch.is-on .ph {
    background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .14) 0 7px, rgba(255, 255, 255, .22) 7px 14px);
    color: rgba(255, 255, 255, .62);
  }

  .ch.is-on .ch-freq .fm,
  .ch.is-on .ch-now .lbl,
  .ch.is-on .ch-foot .genre,
  .ch.is-on .ch-foot .lis {
    color: rgba(255, 255, 255, .72);
  }

  .ch.is-on .ch-freq .eq {
    color: rgba(255, 255, 255, .85);
  }

  .ch.is-on .ch-freq .eq > span {
    animation: aveq var(--d, .7s) ease-in-out var(--dl, 0s) infinite;
  }

  .ch.is-on .ch-host {
    color: rgba(255, 255, 255, .85);
  }

  .ch.is-on .ch-now {
    border-top-color: rgba(255, 255, 255, .35);
  }

  .ch.is-on .ch-now .txt {
    color: #fff;
  }

  .stems {
    position: relative;
    height: 26px;
  }

  .stems > span {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: var(--i2);
  }

  .stems > span.is-on {
    width: 2px;
    margin-left: -1px;
    background: var(--accent);
    box-shadow: 0 0 12px color-mix(in srgb, var(--accent) 60%, transparent);
  }

  .stems--top > span:nth-child(1) {
    left: 4.7%;
  }

  .stems--top > span:nth-child(2) {
    left: 38%;
  }

  .stems--top > span:nth-child(3) {
    left: 71.3%;
  }

  .stems--bottom > span:nth-child(1) {
    left: 28.7%;
  }

  .stems--bottom > span:nth-child(2) {
    left: 62%;
  }

  .stems--bottom > span:nth-child(3) {
    left: 95.3%;
  }

  .axis {
    position: relative;
    height: 66px;
  }

  .axis-line {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(50% - 1px);
    height: 2px;
    background: var(--i28);
  }

  .axis-ticks {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(50% + 4px);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .axis-ticks > span {
    width: 1px;
    height: 8px;
    background: rgba(255, 255, 255, .2);
  }

  .axis-ticks > span.major {
    height: 14px;
    background: rgba(255, 255, 255, .45);
  }

  :root:not([data-theme="dark"]) :where(:scope) .axis-ticks > span {
    background: var(--i2);
  }

  :root:not([data-theme="dark"]) :where(:scope) .axis-ticks > span.major {
    background: var(--i45);
  }

  .axis-labels {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(50% + 22px);
    display: flex;
    justify-content: space-between;
  }

  .axis-labels > span {
    letter-spacing: .1em;
    color: var(--t4);
  }

  .axis-labels > span.is-on {
    color: var(--i75);
  }

  .axis-window {
    position: absolute;
    top: calc(50% - 26px);
    height: 52px;
    width: 56px;
    left: calc(var(--x, 38%) - 28px);
    border-left: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
    border-right: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
    background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 20%, transparent), color-mix(in srgb, var(--accent) 2%, transparent));
    transition: left .35s ease;
  }

  .axis-dot {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--panel);
    border: 1px solid var(--i45);
  }

  .axis-dot:nth-of-type(1) {
    left: 4.7%;
  }

  .axis-dot:nth-of-type(2) {
    left: 28.7%;
  }

  .axis-dot:nth-of-type(3) {
    left: 38%;
  }

  .axis-dot:nth-of-type(4) {
    left: 62%;
  }

  .axis-dot:nth-of-type(5) {
    left: 71.3%;
  }

  .axis-dot:nth-of-type(6) {
    left: 95.3%;
  }

  .axis-dot.is-on {
    width: 12px;
    height: 12px;
    background: var(--accent);
    border-color: var(--accent);
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--accent) 16%, transparent);
  }

  .ch-signal {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--i16);
  }
  .ch-signal:is(:first-child, :last-child) {
    margin-top: 24px;
  }

  .sc-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.32fr) minmax(0, 1fr);
    gap: clamp(28px, 4vw, 56px);
    align-items: stretch;
  }

  .sc-live {
    position: relative;
    overflow: hidden;
    padding-bottom: 24px;
    border-bottom: 2px solid var(--ink);
    height: 100%;
  }

  .sc-ghost {
    position: absolute;
    left: -46px;
    top: -18px;
    font: 800 clamp(140px, 17vw, 232px) / .8 var(--wp--preset--font-family--orbitron);
    letter-spacing: -.04em;
    color: transparent;
    -webkit-text-stroke: 1.5px color-mix(in srgb, var(--accent) 24%, transparent);
    pointer-events: none;
    white-space: nowrap;
  }

  .sc-body {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .sc-tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
  }

  .sc-show {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(16px, 2vw, 26px);
    align-items: flex-start;
  }

  .sc-show .ph {
    width: clamp(120px, 13vw, 164px);
    background: repeating-linear-gradient(135deg, var(--i10) 0 8px, var(--i16) 8px 16px);
    color: var(--t4);
  }

  .sc-show-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
    flex: 1;
  }

  .sc-show h3 {
    font: 700 clamp(40px, 6.2vw, 92px) / .9 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.05em;
    text-transform: uppercase;
  }

  .sc-with {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 16px;
  }

  .sc-with .serif {
    font-size: clamp(22px, 2.6vw, 34px);
    line-height: 1.05;
  }

  .sc-hour {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-top: 4px;
  }
  .sc-hour:is(:first-child, :last-child) {
    margin-top: 4px;
  }

  .sc-ruler {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: 0 44px;
  }
  .sc-ruler:is(:first-child, :last-child) {
    margin-top: 0;
    margin-bottom: 0;
  }

  .sc-ruler > span {
    width: 1px;
    height: 5px;
    background: var(--i2);
  }

  .sc-ruler > span:nth-child(6n+1) {
    height: 10px;
    background: var(--i45);
  }

  .sc-marks {
    display: flex;
    justify-content: space-between;
    margin: 0 30px;
  }
  .sc-marks:is(:first-child, :last-child) {
    margin-top: 0;
    margin-bottom: 0;
  }

  .sc-marks > span {
    letter-spacing: .1em;
    color: var(--t4);
  }

  .sc-np {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 6px;
  }
  .sc-np:is(:first-child, :last-child) {
    margin-top: 6px;
  }

  .sc-np .eq {
    color: var(--accent);
  }

  .sc-np-txt {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
  }

  .sc-np-txt .name {
    display: block;
    min-width: 0;
    font: 600 17px / 1 var(--wp--preset--font-family--archivo);
    letter-spacing: -.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .sc-played {
    display: flex;
    flex-direction: column;
    margin-top: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--i16);
  }
  .sc-played:is(:first-child, :last-child) {
    margin-top: 10px;
  }

  .sc-played > .mono {
    padding-bottom: 8px;
  }

  .sc-played li {
    display: flex;
    align-items: baseline;
    gap: 14px;
    padding: 8px 0;
    border-bottom: 1px solid var(--i10);
  }

  .sc-played li .t {
    flex: none;
    letter-spacing: .12em;
    color: var(--t45);
  }

  .sc-played li .n {
    display: block;
    min-width: 0;
    font: 400 15px / 1.3 var(--wp--preset--font-family--archivo);
    color: var(--i68);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .sc-played li.is-on .t {
    color: var(--accent-text);
  }

  .sc-played li.is-on .n {
    color: var(--ink);
  }

  .sc-played li button {
    margin-left: auto;
    flex: none;
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .12em;
    color: var(--t4);
  }

  .sc-played li button:hover,
  .sc-played li button.is-on {
    color: var(--accent-text);
  }

  .sc-day {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
  }

  .sc-day-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--ink);
  }

  .sc-list {
    position: relative;
    padding-left: 22px;
    flex: 1;
    display: flex;
  }

  .sc-rows {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .sc-list::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: var(--i18);
  }

  .sc-now-dot {
    position: absolute;
    left: 0;
    top: var(--y, 262px);
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent) 16%, transparent);
  }

  .sc-row {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr) 34px;
    gap: 14px;
    align-items: baseline;
    padding: 11px 0;
    border-bottom: 1px solid var(--i10);
    cursor: pointer;
  }

  .sc-row:hover {
    background: color-mix(in srgb, var(--ink) 6%, transparent);
  }

  .sc-row .t {
    letter-spacing: .1em;
    color: var(--ink);
  }

  .sc-row .nm {
    display: flex;
    align-items: baseline;
    gap: 11px;
    min-width: 0;
  }

  .sc-row .nm b {
    flex: none;
    font: 600 17px / 1.2 var(--wp--preset--font-family--archivo);
    letter-spacing: -.01em;
    color: var(--ink);
  }

  .sc-row .nm span {
    min-width: 0;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--i68);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .sc-row .d {
    text-align: right;
    letter-spacing: .1em;
    color: var(--t4);
  }

  .sc-row.is-past .t {
    color: var(--t45);
  }

  .sc-row.is-past .nm b {
    color: var(--t5);
    text-decoration: line-through;
  }

  .sc-row.is-past .nm span {
    color: var(--t45);
  }

  .sc-row.is-live .t {
    color: var(--accent-text);
  }

  .sc-next {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: clamp(12px, 1.6vw, 22px);
    margin-top: 32px;
    padding-top: 20px;
    border-top: 1px solid var(--i18);
  }
  .sc-next:is(:first-child, :last-child) {
    margin-top: 32px;
  }

  .sc-next > .mono {
    flex: none;
    align-self: center;
  }

  .sc-next-card {
    flex: 1 1 276px;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--i16);
    cursor: pointer;
  }

  .sc-next-card:hover {
    border-color: var(--accent);
  }

  .sc-next-card .ph {
    width: 58px;
    color: var(--t4);
    letter-spacing: .12em;
  }

  .sc-next-card .body {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
    flex: 1;
  }

  .sc-next-card .nm {
    display: block;
    min-width: 0;
    font: 700 17px / 1.05 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.025em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .sc-next-card .host {
    min-width: 0;
    letter-spacing: .12em;
    color: var(--t45);
  }

  .sh-wall {
    display: flex;
    align-items: stretch;
    gap: clamp(14px, 1.8vw, 30px);
  }

  .sh-grid {
    flex: 1;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    align-items: start;
    gap: clamp(12px, 1.4vw, 22px);
  }

  .host {
    min-width: 0;
    margin-top: var(--top, 0);
    display: flex;
    flex-direction: column;
    transform: rotate(var(--rot, 0deg));
    transition: transform .2s ease;
    cursor: pointer;
    text-align: left;
    color: #141110;
  }
  .host:is(:first-child, :last-child) {
    margin-top: var(--top, 0);
  }

  .host:hover {
    transform: rotate(0deg) translateY(-8px);
  }

  .sh-grid > .host:nth-child(1) {
    --top: 26px;
    --rot: -2.2deg;
    --tape: -3deg;
  }

  .sh-grid > .host:nth-child(2) {
    --top: 0;
    --rot: 1.5deg;
    --tape: 2deg;
  }

  .sh-grid > .host:nth-child(3) {
    --top: 40px;
    --rot: -1.1deg;
    --tape: -1.5deg;
  }

  .sh-grid > .host:nth-child(5) {
    --top: 10px;
    --rot: 2deg;
    --tape: 3deg;
  }

  .sh-grid > .host:nth-child(6) {
    --top: 50px;
    --rot: -1.7deg;
    --tape: -2deg;
  }

  .sh-grid > .host:nth-child(7) {
    --top: 20px;
    --rot: 1deg;
    --tape: 1.5deg;
  }

  .host-card {
    position: relative;
    padding: 10px 10px 0;
    background: #F6F3EE;
    border: 1px solid var(--i14);
    box-shadow: 0 18px 40px var(--i28);
  }

  .host-tape {
    position: absolute;
    left: 50%;
    top: -11px;
    margin-left: -30px;
    width: 60px;
    height: 20px;
    background: rgba(246, 243, 238, .32);
    border: 1px solid var(--i2);
    transform: rotate(var(--tape, 0deg));
  }

  .host-photo {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;
    background: repeating-linear-gradient(135deg, rgba(20, 17, 16, .08) 0 8px, rgba(20, 17, 16, .15) 8px 16px);
    display: grid;
    place-items: center;
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .2em;
    color: rgba(20, 17, 16, .32);
  }

  .host-photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .host-no {
    position: absolute;
    left: 12px;
    top: 12px;
    padding: 5px 8px;
    background: #141110;
    color: #fff;
    letter-spacing: .16em;
  }

  .host-yrs {
    position: absolute;
    right: 12px;
    top: 12px;
    padding: 5px 8px;
    background: rgba(246, 243, 238, .85);
    color: rgba(20, 17, 16, .7);
    letter-spacing: .12em;
  }

  .host-live {
    position: absolute;
    right: 12px;
    bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 9px;
    background: var(--accent);
    color: #fff;
  }

  .host-live .eq {
    color: #fff;
  }

  .host-meta {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 12px 4px 14px;
  }

  .host-name {
    display: block;
    min-width: 0;
    font: 400 20px / 1 var(--wp--preset--font-family--instrument-serif);
    font-style: italic;
    color: #141110;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .host-show {
    display: block;
    min-width: 0;
    font: 700 17px / 1.05 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.03em;
    text-transform: uppercase;
    color: #141110;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .host-slot {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding-top: 7px;
    border-top: 1px solid rgba(20, 17, 16, .14);
  }

  .host-slot .s {
    min-width: 0;
    letter-spacing: .12em;
    color: rgba(20, 17, 16, .6);
  }

  .host-slot .a {
    margin-left: auto;
    flex: none;
    letter-spacing: .14em;
    color: rgba(20, 17, 16, .6);
  }

  .host.is-live .host-card {
    border-color: var(--accent);
    box-shadow: 0 18px 40px var(--i28), 0 0 0 1px var(--accent);
  }

  .host.is-live .host-tape {
    background: color-mix(in srgb, var(--accent) 35%, transparent);
    border-color: color-mix(in srgb, var(--accent) 50%, transparent);
  }

  .host.is-live .host-no {
    background: var(--accent);
  }

  .host.is-live .host-show,
  .host.is-live .host-slot .s {
    color: var(--accent-text);
  }

  .host:hover .host-card {
    border-color: var(--accent);
  }

  .host:hover .host-slot .s,
  .host:hover .host-show {
    color: var(--accent-text);
  }

  .note {
    min-width: 0;
    margin-top: 76px;
    transform: rotate(1.6deg);
    transition: transform .2s ease;
  }
  .note:is(:first-child, :last-child) {
    margin-top: 76px;
  }

  .note:hover {
    transform: rotate(0deg) translateY(-8px);
  }

  .note-card {
    position: relative;
    padding: 18px 16px;
    background: var(--accent);
    color: #fff;
    box-shadow: 0 18px 40px var(--i28);
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .note-tape {
    position: absolute;
    left: 50%;
    top: -11px;
    margin-left: -26px;
    width: 52px;
    height: 20px;
    background: rgba(246, 243, 238, .3);
    border: 1px solid rgba(255, 255, 255, .22);
    transform: rotate(-2deg);
  }

  .note-card .lbl {
    letter-spacing: .22em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .75);
  }

  .note-card p {
    font: 400 clamp(16px, 1.7vw, 21px) / 1.35 var(--wp--preset--font-family--instrument-serif);
    font-style: italic;
    color: #fff;
    text-wrap: pretty;
  }

  .note-card .date {
    letter-spacing: .14em;
    color: rgba(255, 255, 255, .7);
    padding-top: 9px;
    border-top: 1px solid rgba(255, 255, 255, .3);
  }

  .sh-air {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 22px;
    margin-top: clamp(28px, 3vw, 40px);
    padding-top: 20px;
    border-top: 2px solid var(--ink);
  }
  .sh-air:is(:first-child, :last-child) {
    margin-top: clamp(28px, 3vw, 40px);
  }

  .sh-air .on {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--accent-text);
  }

  .sh-air .show {
    font: 700 clamp(22px, 2.4vw, 30px) / 1 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.035em;
    text-transform: uppercase;
  }

  .sh-air .who {
    font: 400 clamp(18px, 2vw, 24px) / 1 var(--wp--preset--font-family--instrument-serif);
    font-style: italic;
    color: var(--i75);
  }

  .sh-air .hbar {
    min-width: 180px;
    flex: 1 1 180px;
    gap: 10px;
  }

  .tr-wrap {
    display: flex;
    align-items: stretch;
    gap: clamp(14px, 1.8vw, 26px);
  }

  .tr-main {
    flex: 1;
    min-width: 0;
  }

  .tr-slots {
    display: flex;
    align-items: baseline;
    gap: 18px;
    margin-bottom: 8px;
  }
  .tr-slots:is(:first-child, :last-child) {
    margin-bottom: 8px;
  }

  .tr-slot {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding-bottom: 9px;
    border-bottom: 1px solid var(--i28);
  }

  .tr-slot {
    min-width: fit-content;
  }

  .tr-slot > * {
    white-space: nowrap;
  }

  @media (max-width: 400px) {
    .tr-slot {
      min-width: 0;
    }
    .tr-slot .h {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }

  .tr-slot--a {
    flex: 0 0 46%;
  }

  .tr-slot--b {
    flex: 1;
    border-bottom-color: var(--accent);
  }

  .tr-slot .t {
    letter-spacing: .14em;
    color: var(--t45);
  }

  .tr-slot--b .t {
    color: var(--accent-text);
  }

  .tr-slot .nm {
    font: 700 14px / 1 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.02em;
    text-transform: uppercase;
    color: var(--i75);
  }

  .tr-slot--b .nm {
    color: var(--ink);
  }

  .tr-slot .h {
    margin-left: auto;
    letter-spacing: .14em;
    color: var(--t35);
  }

  .tr-slot--b .h {
    color: var(--t45);
  }

  .tr-shape {
    position: relative;
    padding-top: 47px;
  }

  .tr-now {
    position: absolute;
    right: 0;
    top: -3px;
    z-index: 2;
    width: clamp(210px, 22vw, 264px);
    padding: 12px 14px;
    border: 1px solid var(--accent);
    background: var(--panel);
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .tr-now .row {
    display: flex;
    align-items: baseline;
    gap: 8px;
  }

  .tr-now .name {
    display: block;
    min-width: 0;
    font: 600 15px / 1.15 var(--wp--preset--font-family--archivo);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .bars {
    display: flex;
    align-items: center;
    gap: 5px;
    height: 172px;
  }

  .bar {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    cursor: pointer;
    transition: opacity .15s ease;
  }

  .bar:hover {
    opacity: .72;
  }

  .bar .req {
    position: absolute;
    top: -16px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--accent);
    opacity: .85;
  }

  .bar .up {
    width: 100%;
    height: var(--up);
    align-self: flex-end;
    background: var(--i22);
  }

  .bar .ax {
    width: 100%;
    height: 1px;
    background: var(--i28);
  }

  .bar .dn {
    width: 100%;
    height: var(--dn);
    background: var(--i10);
  }

  .bar.is-on .up {
    background: var(--accent);
    box-shadow: 0 0 18px color-mix(in srgb, var(--accent) 55%, transparent);
  }

  .bar.is-on .ax {
    background: var(--accent);
  }

  .bar.is-on .dn {
    background: color-mix(in srgb, var(--accent) 50%, transparent);
  }

  .heat {
    display: flex;
    align-items: stretch;
    gap: 5px;
    height: 8px;
    margin-top: 10px;
  }
  .heat:is(:first-child, :last-child) {
    margin-top: 10px;
  }

  .heat > span {
    flex: 1;
    min-width: 0;
    height: 100%;
    background: color-mix(in srgb, var(--ink) var(--h, 12%), transparent);
  }

  .heat > span.is-on {
    background: var(--accent);
  }

  .tr-tempo {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 8px;
  }

  .tr-tempo .hr {
    flex: 1;
    height: 1px;
    background: var(--i14);
  }

  .tr-ticks {
    display: flex;
    justify-content: space-between;
    padding-top: 12px;
  }

  .tr-ticks > span {
    letter-spacing: .14em;
    color: var(--t4);
  }

  .tr-legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px 14px;
    padding-top: 10px;
  }

  .tr-req {
    margin-left: auto;
  }

  .tr-save {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
  }

  .tr-chips {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(10px, 1.2vw, 16px);
    margin-top: 26px;
  }
  .tr-chips:is(:first-child, :last-child) {
    margin-top: 26px;
  }

  .tr-chip {
    flex: 1 1 210px;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 12px;
    border: 1px solid var(--i14);
    background: color-mix(in srgb, var(--ink) 4%, transparent);
    cursor: pointer;
  }

  .tr-chip {
    position: relative;
  }

  .tr-chip:hover {
    border-color: var(--accent);
  }

  .tr-chip.is-on {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 10%, transparent);
  }

  .tr-chip .ph {
    width: 40px;
    letter-spacing: 0;
  }

  .tr-chip .body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    flex: 1;
  }

  .tr-chip .row {
    display: flex;
    align-items: baseline;
    gap: 8px;
  }

  .tr-chip .row .t {
    letter-spacing: .14em;
    color: var(--t45);
  }

  .tr-chip.is-on .row .t {
    color: var(--accent-text);
  }

  .tr-chip .artist {
    display: block;
    min-width: 0;
    font: 600 14px / 1.15 var(--wp--preset--font-family--archivo);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .tr-chip .title {
    display: block;
    min-width: 0;
    font: 400 14px / 1.15 var(--wp--preset--font-family--instrument-serif);
    font-style: italic;
    color: var(--t55);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .tr-np {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    gap: clamp(24px, 3vw, 44px);
    align-items: center;
    margin-top: 30px;
    padding-top: 24px;
    border-top: 2px solid var(--i35);
  }
  .tr-np:is(:first-child, :last-child) {
    margin-top: 30px;
  }

  .tr-np-l {
    display: flex;
    align-items: center;
    gap: clamp(16px, 2vw, 24px);
    min-width: 0;
  }

  .tr-np-l .ph {
    width: clamp(92px, 10vw, 118px);
  }

  .tr-np-txt {
    display: flex;
    flex-direction: column;
    gap: 9px;
    min-width: 0;
  }

  .tr-np-txt .on {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--accent-text);
  }

  .tr-np-txt .artist {
    display: block;
    min-width: 0;
    font: 700 clamp(28px, 3.4vw, 40px) / 1.05 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.04em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .tr-np-txt .title {
    font: 400 clamp(19px, 2vw, 24px) / 1.2 var(--wp--preset--font-family--instrument-serif);
    font-style: italic;
    color: var(--i75);
  }

  .tr-np-r {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
  }

  .tr-time {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 20px;
  }

  .tr-time .num {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-end;
  }

  .tr-time .num b {
    font: 800 clamp(34px, 4vw, 46px) / 1 var(--wp--preset--font-family--orbitron);
    color: var(--accent);
  }

  .scrub {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 22px;
    cursor: pointer;
  }

  .scrub > span {
    flex: 1;
    height: var(--h);
    background: var(--i2);
  }

  .scrub > span:nth-child(-n+18) {
    background: var(--accent);
  }

  .tr-upnext {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--i16);
  }

  .tr-upnext .n {
    display: block;
    min-width: 0;
    font: 600 14px / 1.2 var(--wp--preset--font-family--archivo);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .tr-stats {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
  }

  .tr-now {
    transition: left .12s ease;
  }

  .tr-now.is-held {
    border-color: var(--i35);
  }

  .tr-now.is-held .js-tn-when {
    color: var(--ink);
  }

  .bar:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
  }

  .bar.is-held .up {
    background: var(--ink);
  }

  .bar.is-held .ax {
    background: var(--ink);
  }

  .bar.is-held .dn {
    background: var(--i35);
  }

  .tr-np.is-held .tr-np-txt .on {
    color: var(--t55);
  }

  .tr-np.is-held .tr-np-txt .on .dot {
    animation: none;
    background: var(--i55);
  }

  .tr-np.is-held .tr-time .num b {
    color: var(--ink);
  }

  .js-tp-back {
    border: 0;
    background: none;
    letter-spacing: .14em;
    cursor: pointer;
  }

  .pc-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--i18);
    margin-bottom: 22px;
  }
  .pc-head:is(:first-child, :last-child) {
    margin-bottom: 22px;
  }

  .pc-filters {
    margin-bottom: 26px;
  }
  .pc-filters:is(:first-child, :last-child) {
    margin-bottom: 26px;
  }

  .pc-wrap {
    display: flex;
    gap: clamp(18px, 2.4vw, 40px);
    align-items: stretch;
  }

  .pc-side {
    flex: none;
    display: flex;
    gap: 14px;
  }

  .pc-word {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font: 700 clamp(30px, 3.4vw, 54px) / 1 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.02em;
    text-transform: uppercase;
    color: var(--accent);
  }

  .pc-years {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
    padding: 6px 0;
    border-right: 1px solid var(--i2);
  }

  .pc-years li {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .pc-years .y {
    letter-spacing: .12em;
    color: var(--t45);
  }

  .pc-years .c {
    letter-spacing: .1em;
    color: var(--t35);
  }

  .pc-years .b {
    display: block;
    width: var(--w);
    height: 2px;
    background: var(--i28);
  }

  .pc-years li.is-off {
    opacity: .4;
  }

  .pc-years button {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 0;
    background: none;
    cursor: pointer;
  }

  .pc-years button:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
  }

  .ep.is-on .title {
    color: var(--accent-text);
  }

  .ep.is-playing .ring-btn {
    border-color: var(--accent);
    background: var(--accent);
    color: #fff;
  }

  .ring-btn.is-pause {
    font-size: 12px;
    letter-spacing: .06em;
  }

  .pc-empty {
    padding: 26px 0;
    font-size: 15px;
    line-height: 1.6;
    color: var(--i6);
  }

  .pc-wave {
    cursor: pointer;
  }

  .pc-wave:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 4px;
  }

  .pc-wave > span.is-done {
    background: var(--accent);
  }

  .pc-chapters .chip.is-on {
    border-color: var(--accent);
    color: var(--accent-text);
  }

  .pc-years li.is-on .y {
    color: var(--accent-text);
  }

  .pc-years li.is-on .b {
    height: 3px;
    background: var(--accent);
  }

  .pc-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
  }

  .pc-feature {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(18px, 2.4vw, 26px);
    padding-bottom: 26px;
    border-bottom: 2px solid var(--ink);
  }

  .pc-feature .ph {
    width: clamp(150px, 17vw, 200px);
    background: repeating-linear-gradient(135deg, var(--i10) 0 9px, var(--i16) 9px 18px);
    letter-spacing: .2em;
  }

  .pc-fb {
    display: flex;
    flex-direction: column;
    gap: 11px;
    min-width: 0;
    flex: 1;
  }

  .pc-fb .row {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 14px;
  }

  .pc-fb .no {
    font: 800 clamp(34px, 4vw, 48px) / 1 var(--wp--preset--font-family--orbitron);
    letter-spacing: -.03em;
    color: var(--accent);
  }

  .pc-fb h3 {
    font: 700 clamp(28px, 3.6vw, 42px) / .94 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.05em;
    text-transform: uppercase;
  }

  .pc-fb .with {
    font: 400 clamp(18px, 1.9vw, 22px) / 1.15 var(--wp--preset--font-family--instrument-serif);
    font-style: italic;
    color: var(--i75);
  }

  .pc-fb p {
    max-width: 52ch;
    font: 400 14px / 1.55 var(--wp--preset--font-family--archivo);
    color: var(--i68);
  }

  .pc-play {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 4px;
  }
  .pc-play:is(:first-child, :last-child) {
    margin-top: 4px;
  }

  .pc-play-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
  }

  .pc-wave {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 26px;
    cursor: pointer;
  }

  .pc-wave > span {
    flex: 1;
    height: var(--h);
    background: var(--i22);
  }

  .pc-play-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
  }

  .pc-chapters {
    gap: 7px;
    margin-top: 6px;
  }
  .pc-chapters:is(:first-child, :last-child) {
    margin-top: 6px;
  }

  .pc-month {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 22px 0 8px;
  }

  .pc-month .hr {
    flex: 1;
    height: 1px;
    background: var(--i16);
  }

  .ep {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 6px;
    border-bottom: 1px solid var(--i10);
    cursor: pointer;
  }

  .ep:hover {
    background: color-mix(in srgb, var(--ink) 4%, transparent);
  }

  .ep .no {
    flex: none;
    width: 44px;
    font: 800 15px / 1 var(--wp--preset--font-family--orbitron);
    color: var(--t4);
  }

  .ep .title {
    flex: none;
    font: 700 clamp(17px, 1.9vw, 26px) / 1 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.035em;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .ep .host {
    flex: none;
    font: 400 clamp(15px, 1.4vw, 19px) / 1.2 var(--wp--preset--font-family--instrument-serif);
    font-style: italic;
    color: var(--i7);
    white-space: nowrap;
  }

  .ep .w {
    flex: 1;
    min-width: 24px;
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 14px;
    overflow: hidden;
  }

  .ep .w > span {
    width: 2px;
    flex: none;
    height: var(--h);
    background: var(--i12);
  }

  .ep .w > span.p {
    background: var(--i4);
  }

  .ep .len {
    flex: none;
    letter-spacing: .14em;
    color: var(--t5);
  }

  .pc-foot {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    padding-top: 20px;
  }

  .rq-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    gap: clamp(28px, 4vw, 58px);
    align-items: start;
  }

  .rq-left {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
  }

  .card {
    position: relative;
    background: #F4F1EC;
    border: 1px solid rgba(20, 17, 16, .16);
    box-shadow: 0 24px 54px var(--i28);
    transform: rotate(-1deg);
    color: #141110;
  }

  .card-perf {
    display: flex;
    justify-content: space-between;
    padding: 7px 12px;
    border-bottom: 1px dashed rgba(20, 17, 16, .22);
  }

  .card-perf > span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--pf-dot);
    flex: none;
  }

  .card-body {
    position: relative;
    padding: clamp(22px, 2.6vw, 32px);
  }

  .card-corner {
    position: absolute;
    right: clamp(18px, 2vw, 26px);
    top: clamp(18px, 2vw, 26px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }

  .card-stampw {
    width: 72px;
    height: 88px;
    border: 1px dashed rgba(20, 17, 16, .4);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: rgba(20, 17, 16, .04);
  }

  .card-stampw .eq {
    height: 16px;
    color: rgba(20, 17, 16, .45);
  }

  .card-stampw .mono {
    letter-spacing: .14em;
    color: rgba(20, 17, 16, .6);
  }

  .card-seal {
    width: 78px;
    height: 78px;
    border-radius: 50%;
    border: 1.5px solid var(--accent);
    display: grid;
    place-items: center;
    transform: rotate(-8deg);
    opacity: .9;
  }

  .card-seal > span {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    color: var(--accent-text);
  }

  .card-seal .mono {
    letter-spacing: .1em;
    color: var(--accent-text);
  }

  .card-seal .hr {
    width: 34px;
    height: 1px;
    background: var(--accent);
  }

  .card-form {
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding-right: 110px;
  }

  .card-form .head {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .card-form .head .mono {
    color: rgba(20, 17, 16, .6);
  }

  .card-form h3 {
    font: 700 clamp(26px, 3.2vw, 38px) / .98 var(--wp--preset--font-family--bricolage);
    letter-spacing: -.04em;
    text-transform: uppercase;
    color: #141110;
  }

  .card-fields {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 20px;
  }

  .card-fields .field label {
    color: rgba(20, 17, 16, .6);
  }

  .card-fields .field input {
    border-bottom-color: rgba(20, 17, 16, .35);
    color: #141110;
  }

  .card-fields .field input::placeholder {
    color: rgba(20, 17, 16, .6);
  }

  .card-fields .field input:focus {
    border-bottom-color: var(--accent);
  }

  .card-fields .field--wide {
    grid-column: 1 / -1;
  }

  .card-act {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
    padding-top: 6px;
    border-top: 1px solid rgba(20, 17, 16, .18);
  }

  .card-act .mono {
    color: rgba(20, 17, 16, .6);
    letter-spacing: .14em;
  }

  .card-act .mono.faint {
    color: rgba(20, 17, 16, .6);
  }

  .btn-drop {
    padding: 16px 30px;
    background: var(--accent);
    color: #fff;
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
  }

  .btn-drop:hover {
    background: #141110;
  }

  .queue {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--i14);
  }

  .queue-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--i14);
  }

  .queue li {
    display: flex;
    align-items: baseline;
    gap: 14px;
    padding: 11px 14px;
    border-bottom: 1px solid var(--i10);
  }

  .queue li .no {
    flex: none;
    letter-spacing: .14em;
    color: var(--t4);
  }

  .queue li:first-child .no {
    color: var(--accent-text);
  }

  .queue li .tr {
    display: block;
    min-width: 0;
    font: 400 15px / 1.3 var(--wp--preset--font-family--archivo);
    color: var(--i75);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .queue li .who {
    flex: none;
    margin-left: auto;
    letter-spacing: .12em;
    color: var(--t4);
  }

  .chat {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
  }

  .chat-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--i4);
  }

  .msg {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: baseline;
    padding-bottom: 13px;
    border-bottom: 1px solid var(--i14);
  }

  .msg .ava {
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--i10);
    color: var(--i7);
    align-self: center;
  }

  .msg .body {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
  }

  .msg .nm {
    display: flex;
    align-items: baseline;
    gap: 9px;
  }

  .msg .nm .mono {
    letter-spacing: .14em;
    color: var(--t5);
  }

  .msg p {
    font: 400 15px / 1.45 var(--wp--preset--font-family--archivo);
    color: var(--i84);
    text-wrap: pretty;
  }

  .msg .time {
    color: var(--t45);
    letter-spacing: 0;
  }

  .msg.is-host .ava {
    background: var(--accent);
    color: #fff;
  }

  .msg.is-host .nm .mono {
    color: var(--accent-text);
  }

  .typing {
    display: flex;
    align-items: center;
    gap: 9px;
  }

  .typing .eq {
    color: var(--accent);
  }

  .chat-input {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 6px;
  }

  .chat-contacts {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--i16);
  }

  .foot {
    background: var(--foot-bg);
    padding: 44px 40px;
  }

  .sheet {
    position: relative;
    background: #141416;
    border: 1px solid rgba(255, 255, 255, .12);
    box-shadow: 0 22px 54px var(--i6);
    color: #f5f4f1;
  }

  .sheet .mono {
    color: rgba(255, 255, 255, .55);
  }

  .sheet .accent,
  .sheet .mono.accent {
    color: var(--accent-text);
  }

  .perf {
    display: flex;
    justify-content: space-between;
    padding: 12px 20px;
    border-bottom: 1px dashed rgba(255, 255, 255, .16);
  }

  .perf--b {
    border-bottom: 0;
    border-top: 1px dashed rgba(255, 255, 255, .16);
  }

  .perf > span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: radial-gradient(circle at 50% 45%, var(--hole) 0 40%, rgba(0, 0, 0, .7) 100%);
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, .95), inset 0 -1px 1px rgba(255, 255, 255, .08), 0 1px 0 rgba(255, 255, 255, .05);
  }

  .sheet-in {
    padding: 26px 40px 34px;
  }

  .sheet-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    padding-bottom: 16px;
    border-bottom: 2px solid rgba(255, 255, 255, .5);
  }

  .sheet-brand {
    display: flex;
    align-items: flex-end;
    gap: 18px;
  }

  .sheet-brand img {
    height: clamp(34px, 3.4vw, 52px);
    width: auto;
  }

  .sheet-brand .mono {
    padding-bottom: 4px;
  }

  .sheet-date {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 22px;
  }

  .sheet-date > .mono {
    color: rgba(255, 255, 255, .6);
  }

  .sheet-onair {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
    color: var(--accent-text);
  }

  .sheet-onair .mono {
    color: var(--accent-text);
  }

  .log-head,
  .log-row {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) minmax(0, 110px) auto auto auto;
    gap: 12px;
  }

  .log-head {
    padding: 14px 0 8px;
  }

  .log-head .mono {
    letter-spacing: .22em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .52);
  }

  .log-head .mono:nth-child(n+5) {
    text-align: right;
  }

  .log {
    display: flex;
    flex-direction: column;
    padding-bottom: 20px;
  }

  .log-row {
    position: relative;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px dashed rgba(255, 255, 255, .14);
    transition: background .18s ease;
  }

  .log-row:hover {
    background: rgba(255, 255, 255, .04);
  }

  .log-row .t {
    letter-spacing: .08em;
    color: rgba(255, 255, 255, .6);
  }

  .log-row .what {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
  }

  .log-row .nm {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
  }

  .log-row .nm b {
    display: block;
    min-width: 0;
    font: 600 15px / 1.3 var(--wp--preset--font-family--archivo);
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .log-row .nm .eq {
    color: var(--accent);
  }

  .log-row .bar {
    height: 2px;
    background: rgba(255, 255, 255, .12);
  }

  .log-row .bar > span {
    display: block;
    height: 2px;
    background: rgba(255, 255, 255, .35);
  }

  .log-row .h {
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .6);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .log-row .g {
    letter-spacing: .06em;
    white-space: nowrap;
  }

  .log-row .p {
    letter-spacing: .1em;
    color: rgba(255, 255, 255, .52);
    white-space: nowrap;
    text-align: right;
  }

  .log-row .s {
    letter-spacing: .14em;
    color: rgba(255, 255, 255, .52);
    white-space: nowrap;
    text-align: right;
  }

  .log-row.is-live {
    padding-left: 12px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 60%);
  }

  .log-row.is-live::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--accent);
  }

  .log-row.is-live .t,
  .log-row.is-live .nm b,
  .log-row.is-live .p {
    color: var(--accent-text);
  }

  .log-row.is-live .bar > span {
    background: var(--accent);
  }

  .log-row.is-live .s {
    color: #fff;
    background: var(--accent);
    padding: 4px 8px;
    text-align: center;
  }

  .shift {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding-bottom: 22px;
  }

  .shift .row {
    display: flex;
    align-items: baseline;
    gap: 14px;
  }

  .shift .band {
    position: relative;
    height: 26px;
  }

  .shift .blocks {
    position: absolute;
    inset: 0;
    display: flex;
    gap: 2px;
  }

  .shift .blk {
    height: 26px;
    background: rgba(255, 255, 255, .14);
    display: flex;
    align-items: center;
    padding: 0 8px;
    min-width: 0;
  }

  .shift .blk .mono {
    letter-spacing: .04em;
    color: rgba(255, 255, 255, .6);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .shift .blk.is-on {
    background: var(--accent);
  }

  .shift .blk.is-on .mono {
    color: #fff;
  }

  .shift .needle {
    position: absolute;
    left: 53%;
    top: -6px;
    bottom: -6px;
    width: 2px;
    background: #fff;
    box-shadow: 0 0 10px rgba(255, 255, 255, .5);
  }

  .shift .ticks {
    display: flex;
    justify-content: space-between;
  }

  .shift .ticks > span {
    letter-spacing: .1em;
    color: rgba(255, 255, 255, .52);
  }

  .tally {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(14px, 2vw, 30px);
    padding: 20px 0;
    border-top: 2px solid rgba(255, 255, 255, .5);
    border-bottom: 1px dashed rgba(255, 255, 255, .2);
  }

  .tally li {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
  }

  .tally b {
    font: 800 clamp(24px, 2.6vw, 38px) / 1 var(--wp--preset--font-family--orbitron);
    color: #fff;
  }

  .tally b.accent {
    color: var(--accent);
  }

  .tally .lbl {
    letter-spacing: .2em;
    text-transform: uppercase;
  }

  .tally .bar {
    height: 3px;
    background: rgba(255, 255, 255, .12);
  }

  .tally .bar > span {
    display: block;
    height: 3px;
    background: rgba(255, 255, 255, .45);
  }

  .tally .bar > span.accent-bg {
    background: var(--accent);
  }

  .tally .of {
    letter-spacing: .14em;
    color: rgba(255, 255, 255, .52);
    text-wrap: pretty;
  }

  .sheet-cols {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr);
    gap: clamp(20px, 2.6vw, 44px);
    padding-top: 24px;
  }

  .sheet-col {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
  }

  .sheet-col h2 {
    font: 400 12px / normal 'DM Mono', monospace;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--accent-text);
  }

  .sheet-col > a {
    font: 400 12px / normal 'DM Mono', monospace;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .68);
  }

  .sheet-col > a:hover,
  .sheet-col address a:hover {
    color: var(--accent-text);
  }

  .sheet-col--studio {
    gap: 11px;
  }

  .sheet-col address {
    font: 400 12px / 1.5 'DM Mono', monospace;
    letter-spacing: .08em;
    color: rgba(255, 255, 255, .68);
    font-style: normal;
    display: flex;
    flex-direction: column;
    gap: 11px;
    overflow-wrap: anywhere;
  }

  .sheet-mail {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 8px;
  }

  .sheet-mail .rq {
    font-size: 14px;
    color: #fff;
    border-bottom-color: rgba(255, 255, 255, .5);
  }

  .sheet-mail .rq::placeholder {
    color: rgba(255, 255, 255, .62);
  }

  .sheet-social {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 4px;
  }

  .sheet-social a {
    font: 400 12px / normal 'DM Mono', monospace;
    letter-spacing: .12em;
    color: rgba(255, 255, 255, .55);
  }

  .sheet-social a:hover {
    color: var(--accent-text);
  }

  .sheet-sign {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 24px;
    padding-top: 28px;
  }

  .sheet-sign .by {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
  }

  .sheet-sign .by .serif {
    font-size: clamp(22px, 2.4vw, 32px);
    line-height: 1.15;
    color: #fff;
  }

  .stamp {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 12px 18px;
    border: 2px solid var(--accent);
    color: var(--accent-text);
    transform: rotate(-4deg);
  }

  .stamp .mono {
    color: var(--accent-text);
  }

  .stamp .no {
    opacity: .75;
  }

  .teeth {
    display: flex;
    height: 12px;
  }

  .teeth > span {
    flex: 1;
    height: 12px;
    background: #141416;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }

  .foot-bottom {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    padding-top: 18px;
    text-transform: uppercase;
    color: var(--t55);
  }

  .foot-bottom a {
    color: var(--t55);
  }

  .foot-bottom a:hover {
    color: var(--accent-text);
  }

  .foot-bottom .sep {
    letter-spacing: 0;
    color: var(--i28);
  }

  .foot-bottom .count {
    margin-left: auto;
    color: var(--accent-text);
    white-space: nowrap;
  }

  @media (min-width: 1101px) and (max-width: 2000px) {
    .btn-live {
      font-size: 17px;
    }
    .logo img {
      width: 201px;
      height: 50px;
    }
    .hero {
      padding: 14px 0 12px;
    }
    .hero-col {
      gap: 16px;
      transform: translateY(10px);
    }
    .hero-freq .num {
      font-size: clamp(52px, 7.6vw, 150px);
    }
    .hero-city h1 {
      font-size: clamp(28px, 3.6vw, 70px);
    }
    .hero-bone {
      font-size: clamp(24px, 2.9vw, 56px);
    }
    .hero-sub {
      font-size: clamp(15px, 1.15vw, 22px);
      margin-top: 6px;
    }
    .hero-sub:is(:first-child, :last-child) {
      margin-top: 6px;
    }
    .hero-facts {
      padding-top: 10px;
    }
    .hero-count {
      padding-top: 9px;
    }
    .pl {
      margin-top: 10px;
      gap: clamp(20px, 2.2vw, 36px);
    }
    .pl:is(:first-child, :last-child) {
      margin-top: 10px;
    }
    .dial {
      width: clamp(120px, 8.2vw, 156px);
    }
    .pl-readout {
      margin-top: 6px;
    }
    .pl-readout:is(:first-child, :last-child) {
      margin-top: 6px;
    }
    .pl-main {
      gap: 9px;
    }
    .pl-track {
      font-size: clamp(20px, 1.8vw, 32px);
    }
    .wave {
      height: 24px;
    }
    .pl-foot {
      padding-top: 9px;
    }
    .shell:not(.shell--page) {
      padding-bottom: 22px;
    }
  }

  @media (max-width: 1100px) {
    .hd-top > .hide-m {
      display: none;
    }
    .hd-main {
      flex-wrap: wrap;
      row-gap: 14px;
    }
    .nav-wrap {
      order: 3;
      width: 100%;
      margin-left: 0;
    }
    .nav {
      justify-content: flex-start;
    }
  }

  .ar-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 22px;
    margin-bottom: clamp(16px, 2vw, 26px);
  }
  .ar-head:is(:first-child, :last-child) {
    margin-bottom: clamp(16px, 2vw, 26px);
  }

  .am-hl {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .ar-totals {
    display: flex;
    align-items: flex-end;
    gap: clamp(16px, 2vw, 32px);
  }

  .ar-totals ul {
    display: flex;
    align-items: flex-end;
    gap: clamp(16px, 2vw, 32px);
  }

  .ar-totals li {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
  }

  .ar-totals .mono {
    white-space: nowrap;
  }

  .ar-totals .orb {
    font-size: clamp(17px, 1.8vw, 26px);
    line-height: 1;
    white-space: nowrap;
  }

  .ar-csv {
    padding: 9px 13px;
    border: 1px solid var(--i28);
    color: var(--i7);
    white-space: nowrap;
  }

  .ar-csv:hover {
    border-color: var(--accent);
    color: var(--accent-text);
  }

  .ar-tag {
    padding: 3px 8px;
    background: var(--accent);
    color: #fff;
    flex: none;
  }

  .ar-gh {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 12px;
    padding: 14px 0 8px;
  }

  .ar-gh .rule {
    flex: 1;
    min-width: 20px;
    height: 1px;
    background: var(--i14);
  }

  .ar-st--accent {
    background: var(--accent);
  }

  .ar-st--i2 {
    background: var(--i2);
  }

  .ar-st--i28 {
    background: var(--i28);
  }

  .ar-st--i35 {
    background: var(--i35);
  }

  .ar-st--i42 {
    background: var(--i42);
  }

  .ar-st--i45 {
    background: var(--i45);
  }

  .ar-st--i55 {
    background: var(--i55);
  }

  .ar-btn {
    justify-self: end;
    flex: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid var(--i28);
    color: var(--i7);
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
  }

  .is-new .ar-btn,
  .is-on > .ar-btn {
    border-color: var(--accent);
    background: var(--accent);
    color: #fff;
  }

  .ar-btn:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
  }

  a.ar-btn {
    display: grid;
    place-items: center;
    line-height: 1;
    text-decoration: none;
  }

  .ar-foot {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    padding-top: clamp(16px, 1.8vw, 24px);
  }

  .ar-more {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 14px 22px;
    background: var(--accent);
    color: #fff;
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .2em;
    text-transform: uppercase;
  }

  .ar-more:hover {
    background: var(--accent-hot);
    color: #fff;
  }

  :root:not([data-theme="dark"]) :where(:scope) .ar-more:hover {
    background: #141110;
  }

  .ar-prog {
    flex: 1;
    min-width: 120px;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  .ar-prog .abar {
    height: 3px;
    background: var(--i14);
  }

  .ar-prog .abar > span {
    background: var(--accent);
  }

  .pa-h {
    font-size: clamp(24px, 3.2vw, 52px);
    line-height: .95;
  }

  .pe-rh {
    display: flex;
    align-items: baseline;
    gap: 12px;
  }

  .pe-new {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-left: auto;
  }

  .pa-chip {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border: 1px solid var(--i2);
    color: var(--i7);
    font-family: var(--wp--preset--font-family--dm-mono);
    font-size: 12px;
    letter-spacing: .1em;
    line-height: normal;
    white-space: nowrap;
  }

  .pa-chip .c {
    opacity: .6;
  }

  .pa-chip.is-on {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 14%, transparent);
    color: var(--accent-text);
  }

  .pa-chip:hover {
    border-color: var(--accent);
    color: var(--accent-text);
  }

  .pa-switch {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: none;
    cursor: pointer;
  }

  .pa-switch input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
  }

  .pa-knob {
    position: relative;
    width: 34px;
    height: 18px;
    border-radius: 9px;
    background: var(--i2);
    flex: none;
  }

  .pa-knob::after {
    content: "";
    position: absolute;
    left: 2px;
    top: 2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    transition: left .15s ease;
  }

  .pa-switch input:checked + .pa-knob {
    background: var(--accent);
  }

  .pa-switch input:checked + .pa-knob::after {
    left: 18px;
  }

  .pa-switch input:focus-visible + .pa-knob {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
  }

  .pa-switch--s .pa-knob {
    width: 32px;
    height: 17px;
  }

  .pa-switch--s .pa-knob::after {
    width: 13px;
    height: 13px;
  }

  .pa-switch--s input:checked + .pa-knob::after {
    left: 17px;
  }

  .ar-btn--32 {
    width: 32px;
    height: 32px;
  }

  .play-btn--46 {
    width: 46px;
    height: 46px;
    font-size: 15px;
  }

  .play-btn--52 {
    width: 52px;
    height: 52px;
    font-size: 16px;
  }

  .bh-rules {
    display: flex;
    flex-direction: column;
    gap: 14px;
    flex: 1;
  }

  .bh-rules li {
    flex: 1;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 12px;
    align-content: center;
    padding-bottom: 11px;
    border-bottom: 1px solid var(--i14);
  }

  .bh-rules p {
    font: 400 14px / 1.6 var(--wp--preset--font-family--archivo);
    color: var(--i84);
    text-wrap: pretty;
  }

  .bh-how {
    display: flex;
    flex-direction: column;
    gap: 11px;
    margin-top: auto;
    padding-top: 8px;
  }
  .bh-how:is(:first-child, :last-child) {
    margin-top: auto;
  }

  .bh-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 8px;
  }

  .bh-steps li {
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 7px;
  }

  .bh-steps i {
    display: block;
    height: 8px;
    background: var(--i2);
  }

  .bh-steps .mono {
    color: var(--t45);
  }

  .bh-steps .n {
    font: 600 13px / 1.25 var(--wp--preset--font-family--archivo);
    color: var(--ink);
    text-wrap: pretty;
  }

  .bh-steps li.is-on i {
    background: var(--accent);
  }

  .bh-steps li.is-on .mono,
  .bh-steps li.is-on .n {
    color: var(--accent-text);
  }

  .bh-fh {
    display: flex;
    align-items: baseline;
    gap: 12px;
  }

  .bh-fh .grot {
    font-size: clamp(18px, 1.9vw, 24px);
    line-height: 1;
    letter-spacing: -.035em;
    color: var(--ink);
  }

  .bh-form .field,
  .mx-form .field {
    gap: 7px;
  }

  .bh-form .field label,
  .mx-form .field label {
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--t5);
  }

  .bh-form .field input,
  .mx-form .field input {
    padding: 6px 0;
    border-bottom-color: var(--i28);
    font-size: 16px;
  }

  .bh-form .lr,
  .mx-form .lr {
    display: flex;
    align-items: baseline;
    gap: 10px;
  }

  .bh-form .lr .mono:last-child,
  .mx-form .lr .mono:last-child {
    margin-left: auto;
  }

  .bh-row {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(12px, 1.6vw, 22px);
  }

  .bh-row .field {
    flex: 1 1 160px;
    min-width: 0;
  }

  .bh-send {
    margin-top: 4px;
    justify-content: space-between;
    padding: 16px 22px;
    letter-spacing: .22em;
  }
  .bh-send:is(:first-child, :last-child) {
    margin-top: 4px;
  }

  .bh-offer {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding-top: 12px;
    border-top: 1px solid var(--i16);
  }

  .bh-offer li {
    display: flex;
    align-items: baseline;
    gap: 12px;
  }

  .bh-offer .v {
    margin-left: auto;
    white-space: nowrap;
  }

  .pe-skip {
    flex: none;
    padding: 9px 11px;
    border: 1px solid var(--i28);
    color: var(--i75);
    text-transform: none;
  }

  .pe-skip:hover {
    border-color: var(--accent);
    color: var(--accent-text);
  }

  .play-btn--54 {
    width: 54px;
    height: 54px;
    font-size: 16px;
  }

  @media (max-width: 760px) {
    .hd {
      position: static;
      padding: 22px 18px 16px;
    }
    .hd--page::after {
      left: 18px;
      right: 18px;
    }
    .hd.is-stuck {
      background: transparent;
      box-shadow: none;
    }
    .shell,
    .shell--page {
      padding-top: 0;
    }
    .shell,
    .sec,
    .foot {
      padding-left: 18px;
      padding-right: 18px;
    }
    .divider {
      margin-left: 18px;
      margin-right: 18px;
    }
    .shell {
      min-height: auto;
    }
    .shell:not(.shell--page) {
      padding-bottom: 22px;
    }
    .hero-wrap {
      min-height: auto;
    }
    .hd {
      gap: 14px;
    }
    .hd-top > .hide-s {
      display: none;
    }
    .logo img {
      height: 42px;
      width: 169px;
    }
    .nav-wrap {
      overflow-x: auto;
      scrollbar-width: none;
    }
    .nav-wrap::-webkit-scrollbar {
      display: none;
    }
    .nav {
      flex-wrap: nowrap;
      gap: 18px;
      padding-bottom: 4px;
      font-size: 13px;
    }
    .nav .dd-panel a,
    .nav .dd-panel button {
      font-size: 13px;
    }
    .nav li.is-open > .dd {
      position: fixed;
      left: 18px;
      right: 18px;
      top: auto;
      padding-top: 0;
    }
    .btn-live {
      font-size: 13px;
      padding: 10px 14px;
    }
    .hero {
      padding-top: 24px;
    }
    .hero-col {
      width: 100%;
      transform: none;
    }
    .hero-air {
      flex-wrap: wrap;
      row-gap: 8px;
    }
    .hero-air .hr {
      flex-basis: 100%;
      order: 5;
    }
    .hero-air .meta {
      order: 6;
    }
    .chip {
      white-space: normal;
      text-align: left;
    }
    .pl {
      gap: 20px;
    }
    .dial {
      width: 200px;
      margin: 0 auto;
    }
    .dial:is(:first-child, :last-child) {
      margin-top: 0;
      margin-bottom: 0;
    }
    .pl-main {
      flex-basis: 100%;
    }
    .pl-line {
      flex-wrap: wrap;
    }
    .pl-line .count {
      margin-left: 0;
    }
    .ch-grid,
    .sc-grid,
    .tr-np,
    .rq-grid,
    .tally,
    .sheet-cols {
      grid-template-columns: minmax(0, 1fr);
    }
    .ch-grid--bottom {
      margin-top: 12px;
    }
    .ch-grid--bottom:is(:first-child, :last-child) {
      margin-top: 12px;
    }
    .stems,
    .axis {
      display: none;
    }
    .sc-live {
      height: auto;
    }
    .sc-ghost {
      display: none;
    }
    .sc-show h3 {
      font-size: clamp(34px, 11vw, 52px);
    }
    .sc-list {
      justify-content: flex-start;
    }
    .sh-wall .vlabel,
    .tr-wrap .vlabel {
      display: none;
    }
    .sh-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .host,
    .note {
      --top: 0;
      margin-top: 12px;
    }
    .host:is(:first-child, :last-child),
    .note:is(:first-child, :last-child) {
      margin-top: 12px;
    }
    .tr-slots {
      flex-wrap: wrap;
      gap: 8px;
    }
    .tr-slot {
      flex: 1 1 100%;
    }
    .tr-shape {
      padding-top: 110px;
    }
    .tr-now {
      left: 0;
      width: auto;
    }
    .bars {
      height: 120px;
    }
    .tr-time {
      justify-content: flex-start;
    }
    .pc-side {
      display: none;
    }
    .ep {
      display: grid;
      grid-template-columns: 44px minmax(0, 1fr) auto auto;
      gap: 6px 12px;
      align-items: center;
      grid-template-areas: "no title len play" "no host len play" "no wave wave wave";
    }
    .ep .no {
      grid-area: no;
      width: auto;
    }
    .ep .title {
      grid-area: title;
      white-space: normal;
    }
    .ep .host {
      grid-area: host;
      white-space: normal;
    }
    .ep .pill {
      grid-area: host;
      justify-self: end;
    }
    .ep .w {
      grid-area: wave;
    }
    .ep .len {
      grid-area: len;
    }
    .ep .ring-btn {
      grid-area: play;
    }
    .card {
      transform: none;
    }
    .card-corner {
      position: static;
      flex-direction: row;
      justify-content: flex-end;
      margin-bottom: 18px;
    }
    .card-corner:is(:first-child, :last-child) {
      margin-bottom: 18px;
    }
    .card-form {
      padding-right: 0;
    }
    .log-head {
      display: none;
    }
    .log-row {
      grid-template-columns: 62px minmax(0, 1fr);
      row-gap: 6px;
    }
    .log-row .h,
    .log-row .g,
    .log-row .p,
    .log-row .s {
      grid-column: 2;
      text-align: left;
    }
    .log-row.is-live .s {
      justify-self: start;
    }
    .shift .blk .mono {
      display: none;
    }
    .tally {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sheet-sign .stamp {
      align-self: flex-start;
    }
    .pc-play {
      flex-wrap: wrap;
    }
    .pc-play-body {
      flex-basis: 100%;
    }
  }

  @media (max-width: 420px) {
    .hd-top {
      gap: 10px;
    }
    .hd-top > .push {
      margin-left: 0;
    }
    .hero-title {
      flex-direction: column;
      gap: 14px;
    }
    .hero-seam {
      display: none;
    }
    .hero-city .tag {
      gap: 10px;
    }
    .pl-foot {
      gap: 12px;
    }
    .pl-foot .save {
      margin-left: 0;
    }
    .sh-grid {
      gap: 12px;
    }
    .sc-next-card {
      flex-basis: 100%;
    }
    .sc-row {
      grid-template-columns: 52px minmax(0, 1fr) 30px;
      gap: 10px;
    }
    .sc-row .nm {
      flex-wrap: wrap;
    }
    .card-fields {
      grid-template-columns: minmax(0, 1fr);
    }
    .msg {
      grid-template-columns: 30px minmax(0, 1fr);
    }
    .msg .time {
      grid-column: 2;
    }
    .tally {
      grid-template-columns: minmax(0, 1fr);
    }
    .sheet-cols {
      gap: 24px;
    }
  }

}