/* Past Inspirations. Loaded only by past-inspirations.html.
   Uses the site palette, type, and card language from styles.css. */

.pi-stage{margin-top:1.5rem;scroll-margin-top:5.5rem}

/* 1950s/60s tabletop set. Cabinet, bezel, and grille are CSS only.
   The glass layer never takes clicks, so the Archive player stays usable. */
.tv-set{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 5.6rem;gap:.85rem;align-items:stretch;
  margin:0 0 .85rem;padding:1.05rem 1.05rem 1.2rem;border-radius:1.15rem 1.15rem 1.55rem 1.55rem;
  background-color:#5a341c;
  background-image:
    linear-gradient(180deg,rgba(255,226,180,.16),transparent 22%),
    repeating-linear-gradient(88deg,rgba(255,214,160,.06) 0 1px,transparent 1px 3px),
    repeating-linear-gradient(92deg,rgba(28,10,4,.22) 0 2px,transparent 3px 8px),
    radial-gradient(ellipse at 18% 0%,rgba(255,196,130,.22),transparent 46%),
    radial-gradient(ellipse at 90% 110%,rgba(0,0,0,.38),transparent 52%),
    linear-gradient(168deg,#8b5a32 0%,#6b3e20 42%,#4a2b16 78%,#2c1a0e 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,224,176,.32),
    inset 0 0 0 7px rgba(36,18,8,.62),
    inset 0 0 0 8px rgba(201,163,96,.34),
    0 26px 48px -22px #000}
.tv-set::before,.tv-set::after{content:"";position:absolute;bottom:-8px;width:18%;max-width:6.5rem;height:8px;border-radius:0 0 3px 3px;
  background:linear-gradient(#3a2414,#140c08);box-shadow:0 3px 4px rgba(0,0,0,.45)}
.tv-set::before{left:8%}
.tv-set::after{right:8%}
.tv-screen{padding:.62rem;border-radius:1.35rem;
  background:radial-gradient(120% 90% at 50% 0%,#6a6158 0%,#2c2824 46%,#100e0c 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 -8px 12px rgba(0,0,0,.55),0 0 0 2px #161310,0 10px 16px rgba(0,0,0,.28)}
.pi-frame{position:relative;width:100%;aspect-ratio:16/9;background:#050403 center/cover no-repeat;border:0;border-radius:.95rem;overflow:hidden;
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.12)}
.pi-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.tv-glass{position:absolute;inset:0;z-index:1;border-radius:inherit;pointer-events:none;
  background:
    linear-gradient(118deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,.07) 14%,rgba(255,255,255,0) 30%),
    radial-gradient(ellipse at 50% 45%,rgba(255,255,255,.04) 0%,rgba(0,0,0,0) 52%,rgba(0,0,0,.42) 100%),
    repeating-linear-gradient(to bottom,rgba(0,0,0,.15) 0 1px,transparent 1px 4px)}
.tv-glass::after{content:"";position:absolute;left:7%;top:5%;width:34%;height:18%;border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0));transform:rotate(-12deg)}
.tv-screen{grid-column:1;grid-row:1}
.tv-side{grid-column:2;grid-row:1;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:.7rem;min-width:0;padding:.15rem 0 .05rem}
.pi-slot-tv .set-shade{grid-column:1 / -1;grid-row:1}
#tv-power{grid-column:2;grid-row:1;justify-self:center;align-self:start;margin-top:.2rem}
.tv-knobs{display:flex;flex-direction:column;align-items:center;gap:.72rem}
.tv-dial-spacer{width:3.35rem;height:3.5rem}
.tv-dial{position:relative;display:grid;place-items:center;width:3.35rem;height:3.35rem}
.tv-dial-ring{position:absolute;inset:0;width:100%;height:100%}
.tv-knob{position:relative;width:1.85rem;height:1.85rem;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#fff6e6 0 8%,#e7d0a4 22%,#a67c48 48%,#5a3a20 74%,#24160c 100%);
  box-shadow:0 1px 0 rgba(255,236,200,.45),0 3px 4px rgba(0,0,0,.55),inset 0 -3px 4px rgba(0,0,0,.4)}
.tv-knob::before{content:"";position:absolute;left:50%;top:14%;width:2px;height:28%;border-radius:1px;background:#1a1008;transform:translateX(-50%)}
.tv-knob-channel{width:1.7rem;height:1.7rem}
.tv-knob-channel::before{transform:translateX(-50%) rotate(32deg);transform-origin:50% 150%}
.tv-knob-volume::before{transform:translateX(-50%) rotate(-18deg);transform-origin:50% 160%}
.tv-lamp{width:.48rem;height:.48rem;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffe7b0,#e07020 55%,#6a2408);
  box-shadow:0 0 6px rgba(255,140,40,.9),inset 0 0 0 1px rgba(80,20,0,.6)}
.tv-speaker{display:block;width:100%;flex:1 1 auto;min-height:5.2rem;border-radius:.4rem;
  background-color:#3a2718;
  background-image:radial-gradient(circle,#120c08 1.05px,transparent 1.25px);
  background-size:5px 5px;
  box-shadow:inset 0 0 0 2px rgba(16,8,4,.75),inset 0 0 0 3px rgba(201,163,96,.32),inset 0 10px 14px rgba(0,0,0,.28)}
@media (max-width:700px){
  .tv-set{grid-template-columns:1fr;grid-template-rows:auto auto;gap:.55rem;padding:.5rem .5rem .65rem;border-radius:.85rem .85rem 1.05rem 1.05rem}
  .tv-screen{grid-column:1;grid-row:1;padding:.4rem;border-radius:.85rem}
  .pi-frame{border-radius:.55rem}
  .tv-side{grid-column:1;grid-row:2;flex-direction:row;align-items:center;gap:.7rem;padding:0 .1rem}
  .pi-slot-tv .set-shade{grid-row:1 / -1}
  #tv-power{grid-column:1;grid-row:2;justify-self:start;align-self:center;margin:.1rem 0 .1rem .15rem}
  .tv-knobs{flex-direction:row;gap:.65rem}
  .tv-dial-spacer{width:4.6rem;height:2.6rem}
  .tv-dial{width:2.7rem;height:2.7rem}
  .tv-speaker{min-height:2.15rem;height:2.15rem;flex:1}
  .tv-set::before,.tv-set::after{height:6px;bottom:-6px}
}
.pi-now{margin-top:.75rem;font-size:.95rem;color:var(--muted)}
.pi-now strong{color:#ffe2b0;font-family:"Cinzel",serif;font-weight:700;letter-spacing:.02em}
.pi-now span{margin-left:.35rem;letter-spacing:.12em;font-size:.8rem}
.pi-credit{margin-top:.35rem;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:#a89a88}
.pi-credit a{color:var(--fire2);text-decoration:none}
.pi-credit a:hover{text-decoration:underline}

.pi-h{font-family:"Cinzel",serif;font-weight:900;text-transform:uppercase;font-size:clamp(1.5rem,3.2vw,2.2rem);line-height:1;margin:2.4rem 0 .9rem}
.pi-filters{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.1rem}
.pi-filters button{font:700 .74rem/1 "Inter",system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);background:none;border:1px solid rgba(244,236,225,.25);border-radius:999px;padding:.8rem 1.1rem;min-height:44px;cursor:pointer;transition:.25s var(--ease)}
.pi-filters button:hover,.pi-filters button:focus-visible{color:var(--fire2);border-color:var(--fire2);outline:none}
.pi-filters button.on{background:var(--fire);border-color:var(--fire);color:#140803}

.pi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.pi-card{display:flex;flex-direction:column;width:100%;padding:0;text-align:left;font:inherit;color:inherit;background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:6px;overflow:hidden;cursor:pointer;appearance:none;-webkit-appearance:none;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease)}
.pi-card:hover,.pi-card:focus-visible{transform:translateY(-4px);border-color:rgba(255,193,94,.45);box-shadow:0 24px 60px -24px rgba(255,120,30,.55);outline:none}
.pi-card.on{border-color:var(--fire);box-shadow:0 0 0 1px rgba(255,138,42,.4)}
.pi-poster{display:block;position:relative;aspect-ratio:16/9;background:#120c06;overflow:hidden}
.pi-poster img{width:100%;height:100%;object-fit:cover;object-position:center}
.pi-poster.is-missing img{opacity:0}
.pi-poster.is-missing::after{content:"Archive still";position:absolute;inset:0;display:grid;place-items:center;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:#8d7d6b}
.pi-meta{display:flex;flex-direction:column;gap:.28rem;padding:.9rem 1rem 1.05rem;min-width:0}
.pi-kicker{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem}
.pi-tag{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--fire2)}
.pi-card[data-tag="Comedy"] .pi-tag{color:#ffc15e}
.pi-card[data-tag="Pulp"] .pi-tag{color:#9ec0ff;font-family:"Orbitron",sans-serif;letter-spacing:.12em;font-size:.58rem}
.pi-card[data-tag="Classic"] .pi-tag{color:#e7c9d4}
.pi-lead{color:var(--muted);max-width:44rem;margin:-.2rem 0 1rem;font-size:1.02rem}
.pi-group + .pi-group{margin-top:.4rem}
.pi-year{flex:none;font-size:.75rem;letter-spacing:.12em;color:var(--muted);font-variant-numeric:tabular-nums}
.pi-title{font-family:"Cinzel",serif;font-weight:700;font-size:1.05rem;line-height:1.2}
.pi-note{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:1.08rem;line-height:1.3;color:#e6d6c2;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

.pi-search{margin-top:.2rem}
.pi-search label{display:block;margin:0 0 .45rem;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--muted)}
.pi-search-row{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.pi-q{flex:1 1 16rem;min-width:0;min-height:46px;padding:.65rem .9rem;font:400 1rem/1.4 "Inter",system-ui,sans-serif;color:var(--ink);background:rgba(0,0,0,.35);border:1px solid rgba(244,236,225,.25);border-radius:3px}
.pi-q:focus{outline:none;border-color:var(--fire2)}
.pi-q::placeholder{color:#8d7d6b}
.pi-status{color:var(--muted);margin:.85rem 0 0;min-height:1.5em}
.pi-results-h{margin-top:1.4rem}

@media (max-width:640px){
  .pi-grid{grid-template-columns:1fr;gap:.75rem}
  .pi-card{flex-direction:row;align-items:stretch}
  .pi-card:hover,.pi-card:focus-visible{transform:none}
  .pi-poster{flex:0 0 42%;aspect-ratio:auto;min-height:7.5rem}
  .pi-poster img{position:absolute;inset:0}
  .pi-meta{padding:.75rem .8rem .85rem}
  .pi-q{flex:1 1 100%}
  .pi-search-row .btn{flex:1 1 auto}
}

/* Old-time radio. Cathedral cabinet, cloth, dial, and knobs are CSS and SVG only. */
#movies,#radio{scroll-margin-top:4.75rem}
.otr-page{padding:clamp(1.2rem,3vw,2rem) clamp(1.2rem,4vw,3rem) clamp(4rem,8vw,6rem);background:
  radial-gradient(ellipse at 50% 0%,rgba(255,176,70,.1),transparent 58%),#0a0807}
.otr-h{font-family:"Cinzel",serif;font-weight:900;text-transform:uppercase;font-size:clamp(2rem,6vw,3.4rem);line-height:.95;margin:.35rem 0 .75rem}
.otr-layout{display:grid;grid-template-columns:minmax(260px,400px) minmax(0,1fr);gap:1.4rem 1.6rem;align-items:start;margin-top:1.15rem}
.otr-cabinet{position:relative}
.otr-set{position:relative;overflow:hidden;padding:4.6rem 1rem 1rem;border-radius:8rem 8rem 16px 16px;
  background-color:#5a341c;
  background-image:
    linear-gradient(180deg,rgba(255,226,180,.18),transparent 18%),
    repeating-linear-gradient(88deg,rgba(255,214,160,.06) 0 1px,transparent 1px 3px),
    repeating-linear-gradient(92deg,rgba(28,10,4,.22) 0 2px,transparent 3px 8px),
    radial-gradient(ellipse at 50% 0%,rgba(255,196,130,.28),transparent 42%),
    radial-gradient(ellipse at 50% 120%,rgba(0,0,0,.45),transparent 50%),
    linear-gradient(180deg,#8d5c34 0%,#6b3e20 38%,#4a2b16 72%,#2c1a0e 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,224,176,.34),
    inset 0 0 0 7px rgba(36,18,8,.55),
    inset 0 0 0 8px rgba(201,163,96,.35),
    0 26px 48px -22px #000}
.otr-cabinet::before,.otr-cabinet::after{content:"";position:absolute;bottom:-7px;width:16%;height:7px;border-radius:0 0 3px 3px;background:linear-gradient(#3a2414,#140c08);box-shadow:0 3px 4px rgba(0,0,0,.45);z-index:1}
.otr-cabinet::before{left:14%}
.otr-cabinet::after{right:14%}
.otr-grille{position:relative;height:6.6rem;margin:.15rem .45rem .8rem;border-radius:46% 46% 10px 10px / 78% 78% 10px 10px;
  background-color:#5c3d24;
  background-image:
    repeating-linear-gradient(90deg,rgba(28,12,4,.55) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(0deg,rgba(28,12,4,.42) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(45deg,rgba(255,214,160,.07) 0 1px,transparent 1px 5px),
    radial-gradient(ellipse at 50% 28%,#b18452,#3d2616 74%);
  box-shadow:inset 0 0 0 3px rgba(42,22,10,.55),inset 0 0 0 4px rgba(232,201,138,.5),inset 0 14px 18px rgba(0,0,0,.28)}
.otr-badge{position:absolute;left:50%;bottom:.65rem;transform:translateX(-50%);margin:0;padding:.18rem .7rem;white-space:nowrap;
  font-family:"Cinzel",serif;font-weight:700;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:#f3e2c0;
  background:linear-gradient(#6a4324,#3a2414);border:1px solid rgba(232,201,138,.75);border-radius:2px;box-shadow:0 2px 0 rgba(0,0,0,.35)}
.otr-dial{margin:0 .2rem .35rem;cursor:pointer;user-select:none;touch-action:none}
.otr-dial:focus-visible{outline:2px solid var(--fire2);outline-offset:3px;border-radius:8px}
.otr-dial-face{position:relative;aspect-ratio:320/176}
.otr-dial-svg{display:block;width:100%;height:100%;filter:drop-shadow(0 8px 10px rgba(0,0,0,.35))}
.otr-set.is-on .otr-dial-svg{filter:drop-shadow(0 0 10px rgba(255,170,60,.55)) drop-shadow(0 8px 10px rgba(0,0,0,.35))}
.otr-needle{position:absolute;left:50%;bottom:10.2%;width:2px;height:58%;margin-left:-1px;border-radius:2px 2px 0 0;z-index:1;
  background:linear-gradient(#ffd0b0,#e23b22 45%,#7a120c);box-shadow:0 0 6px rgba(255,50,20,.8);
  transform-origin:50% 100%;transform:rotate(var(--a,-75deg));transition:transform .35s var(--ease)}
.otr-dial.is-drag .otr-needle{transition:none}
.otr-dial-face::after{content:"";position:absolute;left:50%;bottom:10.2%;width:11px;height:11px;transform:translate(-50%,50%);border-radius:50%;z-index:2;
  background:radial-gradient(circle at 35% 35%,#fff6e4,#e8c98a 42%,#6a4a20);box-shadow:0 1px 2px rgba(0,0,0,.55)}
.otr-readout{display:flex;flex-direction:column;align-items:center;gap:.05rem;margin:.15rem 0 .2rem;min-height:2.7rem;text-align:center}
.otr-readout span{font-family:"IM Fell English SC",Palatino,serif;font-size:1.35rem;letter-spacing:.08em;color:#ffe1a8;line-height:1;text-shadow:0 0 10px rgba(255,170,60,.45)}
.otr-readout em{font-family:"Cinzel",serif;font-style:normal;font-weight:700;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#f0ddb4}
.otr-panel{display:flex;align-items:flex-end;justify-content:space-between;gap:.45rem;padding:.1rem .1rem .15rem}
.otr-knobs{display:flex;justify-content:space-between;align-items:flex-end;gap:.6rem;flex:1;padding:.15rem .2rem .2rem}
.otr-knob-wrap,.otr-play-wrap{display:flex;flex-direction:column;align-items:center;gap:.28rem}
.otr-knob-wrap span{font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:#f0ddb4}
.otr-knob{position:relative;width:3.15rem;height:3.15rem;min-width:44px;min-height:44px;border:0;border-radius:50%;padding:0;cursor:pointer;touch-action:none;
  background:radial-gradient(circle at 32% 28%,#fff6e6 0 8%,#e7d0a4 22%,#a67c48 48%,#5a3a20 74%,#24160c 100%);
  box-shadow:0 1px 0 rgba(255,236,200,.45),0 4px 6px rgba(0,0,0,.55),inset 0 -4px 6px rgba(0,0,0,.4)}
.otr-knob::before{content:"";position:absolute;left:50%;top:14%;width:3px;height:26%;border-radius:2px;background:#1a1008;transform:translateX(-50%) rotate(var(--turn,0deg));transform-origin:50% 150%}
.otr-knob:focus-visible,.otr-play:focus-visible,.otr-skip:focus-visible{outline:2px solid var(--fire2);outline-offset:3px}
.otr-play-wrap{position:relative}
.otr-lamp{width:.5rem;height:.5rem;border-radius:50%;background:radial-gradient(circle at 35% 35%,#6a5038,#2a1a10);box-shadow:inset 0 0 0 1px rgba(0,0,0,.5)}
.otr-set.is-on .otr-lamp{background:radial-gradient(circle at 35% 35%,#ffe7b0,#e07020 55%,#6a2408);box-shadow:0 0 8px rgba(255,140,40,.95),inset 0 0 0 1px rgba(80,20,0,.6)}
.otr-play{width:3.5rem;height:3.5rem;min-width:48px;min-height:48px;border:0;border-radius:50%;cursor:pointer;display:grid;place-items:center;
  background:radial-gradient(circle at 32% 28%,#5a4030,#2a1c12 46%,#120c08 78%);
  box-shadow:0 1px 0 rgba(255,220,170,.25),0 5px 8px rgba(0,0,0,.55),inset 0 0 0 2px rgba(201,163,96,.35)}
.otr-play-icon{width:0;height:0;margin-left:3px;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent #f0ddb4}
.otr-play.is-playing .otr-play-icon{width:11px;height:12px;margin-left:0;border:0;background:linear-gradient(#f0ddb4,#f0ddb4) left/3px 100% no-repeat,linear-gradient(#f0ddb4,#f0ddb4) right/3px 100% no-repeat}
.otr-transport{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.45rem;align-items:center;margin-top:.2rem}
.otr-skip{min-width:44px;min-height:44px;padding:.4rem .55rem;border-radius:999px;border:1px solid rgba(240,221,180,.35);background:rgba(20,10,4,.35);
  color:#f0ddb4;font:700 .66rem/1 "Inter",system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.otr-skip:disabled{opacity:.4;cursor:default}
.otr-seek-wrap{min-width:0;display:flex;flex-direction:column;gap:.1rem}
.otr-seek{width:100%;height:1.7rem;accent-color:#e07020;cursor:pointer}
.otr-time{font-size:.68rem;letter-spacing:.08em;color:#e6d3b4;font-variant-numeric:tabular-nums;text-align:center}
.otr-now{margin:.45rem 0 0;min-height:2.6em;text-align:center;font-size:.82rem;line-height:1.35;color:#e6d3b4}
.otr-now strong{display:block;color:#ffe2b0;font-family:"Cinzel",serif;font-weight:700;font-size:.92rem}
/* Chrome hides audio without controls (display:none !important). Override that so a locked phone can keep playing. */
/* controls keeps Chrome from forcing display:none, which would stop playback when a phone locks. The bar itself is clipped to a pixel. */
.otr-audio-el{display:block !important;position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;opacity:0;pointer-events:none}
.otr-stations{display:flex;flex-wrap:wrap;gap:.45rem;margin:0 0 .9rem}
.otr-stations button{font:700 .68rem/1.2 "Inter",system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:none;border:1px solid rgba(244,236,225,.25);border-radius:999px;padding:.7rem .85rem;min-height:44px;cursor:pointer}
.otr-stations button:hover,.otr-stations button:focus-visible{color:var(--fire2);border-color:var(--fire2);outline:none}
.otr-stations button.on{background:var(--fire);border-color:var(--fire);color:#140803}
.otr-sub{font-family:"Cinzel",serif;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.78rem;margin:0 0 .55rem;color:#f0ddb4}
.otr-shows{display:flex;flex-direction:column;gap:.55rem}
.otr-show{display:flex;gap:.7rem;align-items:center;width:100%;padding:.55rem .65rem;text-align:left;font:inherit;color:inherit;background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:6px;cursor:pointer}
.otr-show img{width:52px;height:52px;object-fit:cover;border-radius:3px;flex:none;background:#120c06}
.otr-show.is-missing img{visibility:hidden}
.otr-show span{display:flex;flex-direction:column;gap:.05rem;min-width:0}
.otr-show strong{font-family:"Cinzel",serif;font-weight:700;font-size:.98rem;line-height:1.2}
.otr-show em{font-style:normal;font-size:.72rem;letter-spacing:.12em;color:var(--muted)}
.otr-show small{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:1.02rem;line-height:1.25;color:#e6d6c2}
.otr-show:hover,.otr-show:focus-visible{border-color:rgba(255,193,94,.45);outline:none}
.otr-show.on{border-color:var(--fire);box-shadow:0 0 0 1px rgba(255,138,42,.4)}
.otr-ep-status{color:var(--muted);margin:.15rem 0 .35rem;min-height:0}
.otr-ep-status:empty{display:none}
.otr-episodes{display:flex;flex-direction:column;gap:.35rem;max-height:22rem;overflow:auto;margin-top:.15rem;padding-right:.15rem}
.otr-ep{display:flex;justify-content:space-between;gap:.7rem;align-items:baseline;width:100%;min-height:44px;padding:.55rem .7rem;text-align:left;font:inherit;color:inherit;background:rgba(0,0,0,.22);border:1px solid rgba(244,236,225,.14);border-radius:4px;cursor:pointer}
.otr-ep b{font-weight:600;font-size:.86rem;line-height:1.3}
.otr-ep i{flex:none;font-style:normal;font-size:.72rem;letter-spacing:.06em;color:var(--muted);font-variant-numeric:tabular-nums}
.otr-ep:hover,.otr-ep:focus-visible{border-color:rgba(255,193,94,.45);outline:none}
.otr-ep.on{border-color:var(--fire);background:rgba(255,138,42,.1)}
.otr-results{margin-top:.35rem}
@media (max-width:800px){
  .otr-layout{grid-template-columns:1fr}
}
@media (max-width:420px){
  .otr-set{padding:3.6rem .7rem .8rem;border-radius:6.5rem 6.5rem 14px 14px}
  .otr-grille{height:5.4rem;margin:.1rem .25rem .55rem}
  .otr-knob{width:2.85rem;height:2.85rem}
  .otr-play{width:3.15rem;height:3.15rem}
  .otr-readout em{letter-spacing:.08em}
}
@media (prefers-reduced-motion:reduce){
  .otr-needle{transition:none}
  .otr-set.is-on .otr-dial-svg{filter:drop-shadow(0 8px 10px rgba(0,0,0,.35))}
  .tv-screen.is-flicker,.otr-dial.is-warm .otr-dial-svg,.cab-knob{animation:none}
  .cab-knob::before{transition:none}
}

/* The two sets sit together under the title. One is on; the other stays as a smaller dark set. */
.pi-pair{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(220px,.72fr);gap:1rem 1.15rem;align-items:start;margin-top:.35rem}
html[data-set="radio"] .pi-pair{grid-template-columns:minmax(220px,.72fr) minmax(0,1.5fr)}
.pi-slot{min-width:0;scroll-margin-top:4.75rem}
.pi-slot .pi-stage{margin-top:0}
.pi-slot .tv-set{margin-bottom:0}
.set-face{min-width:0;border-radius:1rem}
html:not([data-set="radio"]) .otr-transport,
html:not([data-set="radio"]) .otr-now,
html:not([data-set="radio"]) .otr-knobs,
html:not([data-set="radio"]) .otr-readout,
html[data-set="radio"] .pi-slot-tv figcaption{display:none}
html:not([data-set="radio"]) .pi-slot-radio .otr-panel{justify-content:center}
html:not([data-set="radio"]) .pi-slot-radio .otr-dial,
html:not([data-set="radio"]) .pi-slot-radio .otr-transport,
html[data-set="radio"] .pi-slot-tv .tv-screen,
html[data-set="radio"] .pi-slot-tv .tv-side{pointer-events:none}
.set-shade{display:none}
html:not([data-set="radio"]) .pi-slot-radio .set-shade,
html[data-set="radio"] .pi-slot-tv .set-shade{display:block;position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;background:rgba(5,3,2,.58)}
html[data-set="radio"] .pi-frame::after{content:"";position:absolute;inset:0;background:#070605;z-index:3}
html:not([data-set="radio"]) #radio-shelf{display:none}
html[data-set="radio"] #movies-shelf{display:none}
.pi-shelf-lead{color:var(--muted);max-width:44rem;font-size:1.05rem;margin:1.5rem 0 0}
/* Power lives on the cabinet: the television's top dial, and the radio's left knob. */
.cab-power{position:relative;z-index:6;display:flex;flex-direction:column;align-items:center;gap:.08rem;width:auto;margin:0;padding:0;border:0;background:none;cursor:pointer;color:#e7d2b4}
.cab-ring{position:relative;display:grid;place-items:center;width:3.05rem;height:3.05rem;min-width:48px;min-height:48px}
.cab-ring .tv-dial-ring{position:absolute;inset:-6px;width:auto;height:auto}
.cab-mark{position:absolute;z-index:2;font:800 .46rem/1 "Inter",system-ui,sans-serif;letter-spacing:.06em;color:#b9a484;pointer-events:none}
.cab-mark-off{left:7%;top:16%}
.cab-mark-on{right:7%;top:16%}
html[data-set="tv"] #tv-power .cab-mark-on,
html[data-set="radio"] #radio-power .cab-mark-on,
html[data-set="radio"] #tv-power .cab-mark-off,
html:not([data-set="radio"]) #radio-power .cab-mark-off{color:#ffe7b8;text-shadow:0 0 6px rgba(255,160,40,.8)}
.cab-knob{position:relative;z-index:1;width:1.85rem;height:1.85rem;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#fff6e6 0 8%,#e7d0a4 22%,#a67c48 48%,#5a3a20 74%,#24160c 100%);
  box-shadow:0 1px 0 rgba(255,236,200,.45),0 3px 4px rgba(0,0,0,.55),inset 0 -3px 4px rgba(0,0,0,.4)}
.cab-knob::before{content:"";position:absolute;left:50%;top:12%;width:3px;height:30%;border-radius:2px;background:#1a1008;
  transform:translateX(-50%) rotate(-58deg);transform-origin:50% 155%;transition:transform .45s cubic-bezier(.34,1.35,.64,1)}
html[data-set="tv"] #tv-power .cab-knob::before,
html[data-set="radio"] #radio-power .cab-knob::before{transform:translateX(-50%) rotate(58deg)}
.cab-state{font:800 .62rem/1 "Inter",system-ui,sans-serif;letter-spacing:.16em;color:#cbb892}
html[data-set="tv"] #tv-power .cab-state,
html[data-set="radio"] #radio-power .cab-state{color:#ffe7b8;text-shadow:0 0 8px rgba(255,160,40,.9)}
.cab-power:focus-visible{outline:2px solid var(--fire2);outline-offset:3px;border-radius:10px}
html[data-set="radio"] #tv-power .cab-knob,
html:not([data-set="radio"]) #radio-power .cab-knob{animation:cab-hint 1.6s ease-in-out infinite}
@keyframes cab-hint{
  0%,100%{box-shadow:0 0 0 0 rgba(255,170,60,0),0 1px 0 rgba(255,236,200,.45),0 3px 4px rgba(0,0,0,.55),inset 0 -3px 4px rgba(0,0,0,.4)}
  50%{box-shadow:0 0 0 4px rgba(255,176,70,.5),0 0 12px 2px rgba(255,140,40,.85),inset 0 -3px 4px rgba(0,0,0,.4)}
}
@keyframes crt-power{
  0%{filter:brightness(0)}
  12%{filter:brightness(2.4) contrast(1.3)}
  22%{filter:brightness(.15)}
  38%{filter:brightness(1.7)}
  52%{filter:brightness(.45)}
  70%{filter:brightness(1.15)}
  100%{filter:none}
}
.tv-screen.is-flicker{animation:crt-power .65s linear}
@keyframes dial-warm{
  0%{filter:brightness(.25) saturate(.3)}
  45%{filter:brightness(1.45) saturate(1.25)}
  100%{filter:brightness(1) saturate(1)}
}
.otr-dial.is-warm .otr-dial-svg{animation:dial-warm .8s ease-out}
@media (max-width:760px){
  .ab-page{padding-top:5.5rem}
  .page-head h1{margin:.35rem 0 .45rem;font-size:2.15rem}
  .pi-pair,html[data-set="radio"] .pi-pair{grid-template-columns:1fr;gap:.4rem}
  html:not([data-set="radio"]) .pi-slot-tv,html[data-set="radio"] .pi-slot-radio{order:1}
  html:not([data-set="radio"]) .pi-slot-radio,html[data-set="radio"] .pi-slot-tv{order:2}
  .otr-set{padding:2.5rem .7rem .6rem;border-radius:5.5rem 5.5rem 14px 14px}
  .otr-grille{height:4.4rem}
  .otr-now{min-height:1.2em}
  html[data-set="radio"] .pi-slot-radio .otr-set{padding-top:1.7rem}
  html[data-set="radio"] .pi-slot-radio .otr-grille{height:3.5rem}
  html[data-set="radio"] .pi-slot-radio .otr-dial{zoom:.8}
  /* Off radio: arch, cloth, a short dial, and the power knob on the wood. */
  html:not([data-set="radio"]) .pi-slot-radio .otr-set{padding:1.05rem .6rem .4rem;border-radius:3rem 3rem 12px 12px}
  html:not([data-set="radio"]) .pi-slot-radio .otr-grille{height:2rem;margin:0 .15rem .25rem}
  html:not([data-set="radio"]) .pi-slot-radio .otr-readout{display:none}
  html:not([data-set="radio"]) .pi-slot-radio .otr-dial{margin:0}
  html:not([data-set="radio"]) .pi-slot-radio .otr-dial-face{height:3.15rem;aspect-ratio:auto;overflow:hidden}
  /* Off television: a short dark screen, with the power dial still on the cabinet. */
  html[data-set="radio"] .pi-slot-tv .tv-set{padding:.4rem;border-radius:.85rem}
  html[data-set="radio"] .pi-slot-tv .pi-frame{aspect-ratio:auto;height:4.2rem}
  html[data-set="radio"] .pi-slot-tv .tv-speaker{min-height:1.7rem;height:1.7rem}
}
@media (prefers-reduced-motion:reduce){
  .set-face{transition:none}
}
