.totm-listener-hero .listener .outline{
    fill:none;
    stroke:#f1f3f5;
    stroke-width:7;
    stroke-linecap:round;
    stroke-linejoin:round;
  }.totm-listener-hero .listener .accent{
    fill:none;
    stroke:var(--saffron);
    stroke-width:7;
    stroke-linecap:round;
    stroke-linejoin:round;
  }.totm-listener-hero .listener .fine{
    fill:none;
    stroke:#75808b;
    stroke-width:2;
    stroke-linecap:round;
  }.totm-listener-hero .listener .glow{
    filter:drop-shadow(0 0 10px rgba(255,129,40,.62))
           drop-shadow(0 0 24px rgba(255,129,40,.28));
  }.totm-listener-hero .listener .a-headphones{
    transform-origin:250px 226px;
    animation:aBreathe 2.8s ease-in-out infinite;
  }.totm-listener-hero .listener .a-ring{
    transform-origin:250px 230px;
    animation:aRing 2.8s ease-out infinite;
  }.totm-listener-hero .listener .a-wave path{
    transform-box:fill-box;
    transform-origin:center bottom;
    animation:aWave 1.15s ease-in-out infinite alternate;
  }.totm-listener-hero .listener .a-wave path:nth-child(2){animation-delay:.12s}.totm-listener-hero .listener .a-wave path:nth-child(3){animation-delay:.24s}.totm-listener-hero .listener .a-wave path:nth-child(4){animation-delay:.36s}.totm-listener-hero .listener .a-wave path:nth-child(5){animation-delay:.48s}.totm-listener-hero .listener .note{
    opacity:0;
    animation:aNote 3.8s ease-in-out infinite;
  }.totm-listener-hero .listener .note.n2{animation-delay:1.1s}.totm-listener-hero .listener .note.n3{animation-delay:2.1s}@keyframes aBreathe{
    0%,100%{transform:scale(1)}
    50%{transform:scale(1.025)}
  }@keyframes aRing{
    0%{transform:scale(.86);opacity:.6}
    75%,100%{transform:scale(1.18);opacity:0}
  }@keyframes aWave{
    from{transform:scaleY(.65)}
    to{transform:scaleY(1.15)}
  }@keyframes aNote{
    0%{transform:translate(0,14px) scale(.8);opacity:0}
    18%{opacity:1}
    75%{opacity:1}
    100%{transform:translate(24px,-48px) scale(1.05);opacity:0}
  }

.totm-listener-hero{color-scheme:dark;--saffron:#ff8128;--white:#f4f2ed;--muted:#aaa9a5}.totm-listener-hero *{box-sizing:border-box}.totm-listener-hero{margin:0;background:#080a0b;color:var(--white);font-family:Work,Arial,sans-serif;-webkit-font-smoothing:antialiased}.totm-listener-hero a{color:inherit;text-decoration:none}.totm-listener-hero button{font:inherit;cursor:pointer}.totm-listener-hero a:focus-visible,.totm-listener-hero button:focus-visible{outline:2px solid var(--saffron);outline-offset:6px}.totm-listener-hero{position:relative;isolation:isolate;max-width:1920px;min-height:100vh;margin:auto;padding:36px 5vw 28px;background:radial-gradient(ellipse at 61% 62%,#a6541520,transparent 40%),linear-gradient(145deg,#10141655,transparent 45%)}.totm-listener-hero:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.15;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23888888' filter='url(%23n)' opacity='.3' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.totm-listener-hero .masthead{display:flex;align-items:center;gap:32px}.totm-listener-hero .wordmark{font-size:35px;font-weight:700;letter-spacing:-1.8px}.totm-listener-hero .wordmark span{color:var(--saffron)}.totm-listener-hero .masthead>p{font-size:10px;letter-spacing:2.2px;color:#949899;border-left:1px solid #ffffff30;padding-left:30px}.totm-listener-hero #listener-motion{margin-left:auto;background:transparent;border:1px solid #ffffff28;border-radius:24px;min-height:44px;padding:0 18px;color:#bcbdb8;font-size:12px;display:flex;gap:10px;align-items:center}.totm-listener-hero #listener-motion:hover{border-color:var(--saffron);color:white}.totm-listener-hero .intro{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-top:60px}.totm-listener-hero .eyebrow{font-size:10px;letter-spacing:3px;color:var(--saffron);margin:0 0 20px}.totm-listener-hero h1{font-size:clamp(48px,5.5vw,96px);line-height:1.02;letter-spacing:-.055em;margin:0;font-weight:700}.totm-listener-hero h1 em{font-style:normal;color:var(--saffron)}.totm-listener-hero .intro-aside{padding-bottom:5px;min-width:235px}.totm-listener-hero .intro-aside p{font-size:15px;line-height:1.65;color:#b7bab8;margin:0 0 22px}.totm-listener-hero .intro-aside a{display:flex;justify-content:space-between;gap:40px;border-bottom:1px solid #ff812867;min-height:44px;align-items:center;font-size:13px}.totm-listener-hero .intro-aside a span{color:var(--saffron);font-size:22px}.totm-listener-hero .flow{position:relative;display:grid;grid-template-columns:1fr 1.1fr 2.75fr 1fr;gap:32px;align-items:center;min-height:405px;margin-top:30px;padding:20px 0 0}.totm-listener-hero .connections{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}.totm-listener-hero .travelling{stroke-dasharray:5 10;animation:signal 16s linear infinite}.totm-listener-hero .flow-dot{filter:drop-shadow(0 0 6px #ff8128);animation:spark 3s ease-in-out infinite}.totm-listener-hero .person{text-align:center;min-width:0}.totm-listener-hero .listener{width:clamp(140px,15vw,245px);max-width:130%;position:relative;left:50%;transform:translateX(-50%);aspect-ratio:1}.totm-listener-hero .listener svg{width:100%;height:100%;overflow:visible}.totm-listener-hero .listener .glow{filter:drop-shadow(0 0 5px #ff812864)}.totm-listener-hero .listener .a-ring{stroke-width:1.5;opacity:.2}.totm-listener-hero .listener .outline,.totm-listener-hero .listener .accent{stroke-width:6}.totm-listener-hero .listener .outline{stroke:#cbcdd0}.totm-listener-hero .listener .a-headphones{animation-duration:4s}.totm-listener-hero .step{font-size:10px;letter-spacing:1.8px;color:var(--saffron);margin:0 0 14px}.totm-listener-hero .person-copy{font-size:13px;line-height:1.7;margin:0;color:#c0c2c0}.totm-listener-hero .services{min-width:0}.totm-listener-hero .small-label{font-size:9px;letter-spacing:1.8px;color:#aaada9}.totm-listener-hero .services>.small-label{margin:0 0 16px 30px}.totm-listener-hero .service{display:flex;align-items:center;gap:13px;min-height:40px;font-size:12px;color:#d5d7d4;white-space:nowrap}.totm-listener-hero .service>span{color:var(--brand);font-size:21px;width:20px;text-align:center;background:#0a0c0d;box-shadow:0 0 22px 8px #0a0c0d}.totm-listener-hero .deck-stage{position:relative;min-width:0;isolation:isolate;padding:25px 10px 0}.totm-listener-hero .deck-aura{position:absolute;z-index:-1;inset:10% -20% 0;background:radial-gradient(ellipse,#ff812825,transparent 66%);filter:blur(16px)}.totm-listener-hero .turntable-scene{padding-top:0}.totm-listener-hero .deck{transform:none;border-radius:16px;box-shadow:inset 0 2px 2px #b1b5b344,inset 0 -3px 2px #080909,0 5px 0 #141516,0 7px 0 #55595a,0 22px 30px #000a,0 25px 30px -16px #ff812891}.totm-listener-hero .deck[data-demo=true] .moving-arm{transform:rotate(23deg)}.totm-listener-hero .deck[data-demo=true] .vinyl{animation-play-state:running;animation-duration:9s}.totm-listener-hero .deck[data-demo=true] .power-lamp{background:#ff8128;box-shadow:0 0 6px #ff8128}.totm-listener-hero .record-label{background:radial-gradient(circle at 25% 70%,#ff8128 0 12%,transparent 13%),linear-gradient(140deg,#163b38 0 36%,#84a79e 37% 70%,#222 71%)}.totm-listener-hero .label-fallback{color:#f5eee8;font-size:16px;letter-spacing:-1px}.totm-listener-hero .deck-brand{font-size:22px}.totm-listener-hero .link-label{display:flex;justify-content:center;align-items:center;gap:10px;margin:38px auto 0;font-size:13px;color:#b3b6b5}.totm-listener-hero .link-label strong{color:#efede7;font-weight:400}.totm-listener-hero .link-label svg{width:20px;height:20px;fill:none;stroke:var(--saffron);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.totm-listener-hero .one-link{text-align:center;font-size:8px;margin-top:12px}.totm-listener-hero .caption{display:flex;align-items:center;gap:40px;margin-top:35px;padding-top:22px;border-top:1px solid #ffffff20}.totm-listener-hero .caption p{margin:0;font-size:17px;letter-spacing:-.5px}.totm-listener-hero .caption p>span{color:var(--saffron);margin-right:12px}.totm-listener-hero .caption>span{font-size:12px;color:#b0b3b0}.totm-listener-hero .caption small{margin-left:auto;font-size:10px;color:#919794}.totm-listener-hero.motion-paused *{animation-play-state:paused!important}.totm-listener-hero.motion-paused .note{opacity:.5}.totm-listener-hero.motion-paused .a-ring{opacity:.15}@keyframes signal{to{stroke-dashoffset:-150}}@keyframes spark{50%{opacity:.3}}@media(min-width:1700px){.totm-listener-hero .flow{margin-top:45px;min-height:480px}.totm-listener-hero .intro{margin-top:80px}}@media(max-width:1000px){.totm-listener-hero{padding:25px 4vw}.totm-listener-hero .intro{margin-top:44px}.totm-listener-hero .flow{gap:18px;grid-template-columns:.8fr 1fr 2.4fr .8fr;min-height:340px}.totm-listener-hero .listener{width:140px}.totm-listener-hero .service{font-size:10px;gap:8px;min-height:34px}.totm-listener-hero .service>span{font-size:18px}.totm-listener-hero .deck-brand{font-size:17px}.totm-listener-hero .deck-brand small{display:none}.totm-listener-hero .step{font-size:8px;letter-spacing:1px}.totm-listener-hero .person-copy{font-size:11px}.totm-listener-hero .intro-aside{min-width:205px}.totm-listener-hero .caption{gap:20px}.totm-listener-hero .caption>span{display:none}}@media(max-width:700px){.totm-listener-hero{padding:22px 22px 26px}.totm-listener-hero .masthead{gap:12px}.totm-listener-hero .wordmark{font-size:27px}.totm-listener-hero .masthead>p{display:none}.totm-listener-hero #listener-motion{font-size:11px;padding:0 12px}.totm-listener-hero .intro{display:block;margin-top:42px}.totm-listener-hero h1{font-size:clamp(40px,8.7vw,62px)}.totm-listener-hero .eyebrow{font-size:9px;letter-spacing:2px;margin-bottom:18px}.totm-listener-hero .intro-aside{margin-top:24px;display:flex;align-items:center;gap:20px}.totm-listener-hero .intro-aside p{font-size:12px;margin:0;flex:1}.totm-listener-hero .intro-aside a{font-size:12px;gap:16px;min-width:110px}.totm-listener-hero .flow{display:grid;grid-template-columns:1fr 1fr;gap:24px 14px;margin-top:28px;padding-top:0}.totm-listener-hero .flow>.person:first-of-type{grid-column:1;grid-row:1}.totm-listener-hero .flow>.services{grid-column:2;grid-row:1}.totm-listener-hero .deck-stage{grid-column:1/-1;grid-row:2;width:min(460px,100%);margin:auto;padding:10px 10px 0}.totm-listener-hero .flow>.person:last-child{grid-column:1/-1;grid-row:3;display:grid;grid-template-columns:110px auto;align-items:center;justify-content:center;column-gap:10px;text-align:left}.totm-listener-hero .flow>.person:last-child .listener{grid-row:1/3;width:110px;left:0;transform:none;max-width:100%}.totm-listener-hero .flow>.person:last-child .step{align-self:end;margin-bottom:8px}.totm-listener-hero .flow>.person:last-child .person-copy{align-self:start}.totm-listener-hero .listener{width:170px;max-width:100%}.totm-listener-hero .service{font-size:12px;min-height:30px}.totm-listener-hero .services>.small-label{margin:0 0 10px 28px;font-size:8px}.totm-listener-hero .step{font-size:9px}.totm-listener-hero .person-copy{font-size:12px}.totm-listener-hero .connections{display:none}.totm-listener-hero .caption{margin-top:28px;gap:14px;flex-wrap:wrap}.totm-listener-hero .caption p{font-size:16px}.totm-listener-hero .caption small{margin-left:0;font-size:10px;width:100%}.totm-listener-hero .deck-controls{font-size:9px}.totm-listener-hero .deck-brand{font-size:22px}.totm-listener-hero .deck-brand small{display:inline}.totm-listener-hero .one-link{font-size:8px}.totm-listener-hero .link-label{margin-top:32px}.totm-listener-hero .deck-stage:after{content:'';position:absolute;bottom:-29px;left:50%;height:22px;border-left:1px solid #ff81286b}}@media(prefers-reduced-motion:reduce){.totm-listener-hero *,.totm-listener-hero *:before,.totm-listener-hero *:after{animation:none!important;transition:none!important}.totm-listener-hero .listener .note{opacity:.55}.totm-listener-hero .listener .a-ring{opacity:.13}.totm-listener-hero .deck .vinyl{animation:none!important}}
.totm-listener-hero{min-height:0;max-width:1760px;padding:32px 5vw 36px;font-family:Work,Arial,sans-serif}.totm-listener-hero .masthead{justify-content:flex-end}.totm-listener-hero .intro{margin-top:12px}.totm-listener-hero .caption{grid-template-columns:none;padding:22px 0 0;max-width:none;border-bottom:0}.totm-listener-hero .turntable-scene{padding-top:0}.totm-listener-hero .deck{transform:none!important}.totm-listener-hero .deck-caption{margin-top:26px}.totm-listener-hero .audio-analyzer{margin-top:16px}.totm-listener-hero .deck-track strong{font-size:15px}.totm-listener-hero .flow{margin-top:38px}.totm-listener-hero .deck-stage{padding-top:0}.totm-listener-hero .deck-aura{inset:0 0 50%}.totm-listener-hero .connections{height:320px;top:0}.totm-listener-hero .person,.totm-listener-hero .services{align-self:start;margin-top:40px}.totm-listener-hero .listener{margin-top:0}.totm-listener-hero .deck-under{gap:8px}.totm-listener-hero .deck-under button{min-height:44px}.totm-listener-hero .caption small{font-size:10px}.totm-listener-hero .audio-analyzer button{min-height:44px}.totm-listener-hero .intro-aside p{margin:0 0 22px}@media(max-width:700px){.totm-listener-hero{padding:20px 22px 28px}.totm-listener-hero .intro{margin-top:15px}.totm-listener-hero .person,.totm-listener-hero .services{margin-top:0}.totm-listener-hero .flow{margin-top:30px}.totm-listener-hero .intro-aside p{margin:0}.totm-listener-hero .caption{display:flex;gap:14px;margin-top:26px}.totm-listener-hero .deck-caption{margin-top:22px}}.totm-listener-hero .masthead{height:auto;min-height:44px;padding:0;border:0;margin:0;max-width:none}.totm-listener-hero .caption{padding-bottom:0}
/* Seamless page surface; no full-section texture or expensive SVG glow filters. */
.totm-listener-hero{background:transparent;border:0;box-shadow:none}
.totm-listener-hero::before,.totm-listener-hero::after{content:none;display:none;background:none}
.totm-listener-hero .masthead{background:transparent;box-shadow:none}
.totm-listener-hero .listener .glow,.totm-listener-hero .flow-dot{filter:none}
.totm-listener-hero .deck-aura{filter:none}
.totm-listener-hero .a-headphones,.totm-listener-hero .a-ring,.totm-listener-hero .a-wave path,.totm-listener-hero .travelling,.totm-listener-hero .flow-dot{animation:none}
.totm-listener-hero .a-ring{opacity:.15}
.totm-listener-hero .note{will-change:transform,opacity}
.totm-listener-hero .vinyl{animation-play-state:running;animation-duration:9s;will-change:transform}
.totm-listener-hero .deck.motion-off .vinyl{animation-play-state:paused!important}
.totm-listener-hero.motion-suspended *{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.totm-listener-hero .vinyl,.totm-listener-hero .note{animation:none!important;will-change:auto}}

/* Explicit Resume overrides reduced-motion defaults for this illustration only.
   A shared play state keeps CSS animations frozen across both pause controls. */
.totm-listener-hero { --listener-play-state:running; }
.totm-listener-hero.motion-paused,.totm-listener-hero.motion-suspended { --listener-play-state:paused; }
.totm-listener-hero.motion-enabled .vinyl { animation:lp-spin 9s linear infinite var(--listener-play-state)!important; }
.totm-listener-hero.motion-enabled .listener .a-headphones { animation:aBreathe 4s ease-in-out infinite var(--listener-play-state)!important; }
.totm-listener-hero.motion-enabled .listener .a-ring { animation:aRing 4s ease-out infinite var(--listener-play-state)!important; }
.totm-listener-hero.motion-enabled .listener .a-wave path { animation:aWave 1.15s ease-in-out infinite alternate var(--listener-play-state)!important; }
.totm-listener-hero.motion-enabled .listener .a-wave path:nth-child(2) { animation-delay:.12s!important; }
.totm-listener-hero.motion-enabled .listener .a-wave path:nth-child(3) { animation-delay:.24s!important; }
.totm-listener-hero.motion-enabled .listener .a-wave path:nth-child(4) { animation-delay:.36s!important; }
.totm-listener-hero.motion-enabled .listener .a-wave path:nth-child(5) { animation-delay:.48s!important; }
.totm-listener-hero.motion-enabled .listener .note { animation:aNote 3.8s ease-in-out infinite var(--listener-play-state)!important; }
.totm-listener-hero.motion-enabled .listener .note.n2 { animation-delay:1.1s!important; }
.totm-listener-hero.motion-enabled .listener .note.n3 { animation-delay:2.1s!important; }
.totm-listener-hero.motion-enabled .travelling { animation:signal 16s linear infinite var(--listener-play-state)!important; }
.totm-listener-hero.motion-enabled .flow-dot { animation:spark 3s ease-in-out infinite var(--listener-play-state)!important; }
.totm-listener-hero .deck-under button { display:inline-block; }
/* Bring the people into proportion with the deck without shifting its center. */
.totm-listener-hero .listener { width:clamp(190px,19vw,300px);max-width:none; }
.totm-listener-hero .services { padding-left:18px; }
@media(min-width:701px) and (max-width:1000px) {
 .totm-listener-hero .listener { width:clamp(150px,19vw,190px); }
}
@media(max-width:700px) {
 .totm-listener-hero .listener { width:200px;max-width:150%; }
 .totm-listener-hero .flow>.person:last-child { grid-template-columns:160px auto; }
 .totm-listener-hero .flow>.person:last-child .listener { width:160px;max-width:100%; }
}


/* Large orange notes, no drawn connecting lines. The LP receives the notes above its artwork. */
.totm-listener-hero .flow .connections {display:block;height:100%;top:0;overflow:visible;z-index:3;pointer-events:none;}
.totm-listener-hero .traveling-note {color:#ff8128;opacity:0;}
.totm-listener-hero .record-label::after {content:'';position:absolute;inset:2px;border:3px solid #ff9b4e;border-radius:50%;z-index:3;opacity:var(--signal-arrival,0);pointer-events:none;}
.totm-listener-hero .person:last-child .listener-notes {opacity:var(--signal-received,1);}
