.listen-main{min-height:100svh;padding:clamp(.75rem,2vh,1.5rem)var(--margin-golden);justify-content:center;align-items:center;display:flex}.listen-room{flex-direction:column;align-items:center;gap:clamp(1rem,2.5vh,1.75rem);width:100%;max-width:max(16rem,min(86vw,100svh - 25rem));display:flex}.listen-stage{aspect-ratio:1;justify-content:center;align-items:center;width:100%;display:flex;position:relative}.listen-canvas{display:block}.listen-invite{cursor:pointer;font-family:var(--font-science);letter-spacing:.12em;text-transform:lowercase;color:var(--text-whisper);transition:color var(--duration-hover)var(--ease-museum);text-align:center;background:0 0;border:none;max-width:92%;font-size:clamp(.72rem,1vw,.85rem);position:absolute;bottom:8%;left:50%;transform:translate(-50%)}.listen-invite:hover{color:var(--accent-home)}.listen-credit{text-align:right;pointer-events:none;flex-direction:column;align-items:flex-end;gap:.15em;margin:0;display:flex;position:absolute;top:2%;right:1.5%}.listen-credit-title{font-family:var(--font-soul);letter-spacing:.02em;color:#ffffff6b;font-size:clamp(.7rem,1vw,.82rem);font-style:italic;font-weight:300}.listen-credit-artists{font-family:var(--font-science);letter-spacing:.14em;text-transform:lowercase;color:var(--text-whisper);font-size:clamp(.6rem,.85vw,.7rem)}.listen-textstack{flex-direction:column;align-items:center;gap:clamp(.15rem,.8vh,.4rem);width:100%;margin-top:calc(-1*clamp(1rem,4vh,3rem));display:flex}.listen-lyric{font-family:var(--font-soul);letter-spacing:.01em;color:#ffffffb8;text-align:center;white-space:nowrap;opacity:0;min-height:1.5em;transition:opacity .7s var(--ease-museum);will-change:opacity;margin:0;font-size:clamp(.9rem,1.5vw,1.2rem);font-style:italic;line-height:1.4}.listen-lyric[data-visible=true]{opacity:1}@media (prefers-reduced-motion:reduce){.listen-lyric{transition:none}}.listen-textrule{opacity:0;width:clamp(2rem,8vw,3.5rem);height:1px;transition:opacity .6s var(--ease-museum);background:#ffffff1a}.listen-textrule[data-visible=true]{opacity:1}@media (prefers-reduced-motion:reduce){.listen-textrule{transition:none}}.listen-caption{font-family:var(--font-science);letter-spacing:.05em;text-transform:lowercase;color:var(--text-secondary);text-align:center;text-wrap:balance;-webkit-line-clamp:2;opacity:0;max-width:min(56ch,90vw);min-height:2.6em;transition:opacity .6s var(--ease-museum);will-change:opacity;-webkit-box-orient:vertical;margin:0;font-size:clamp(.74rem,1.05vw,.88rem);line-height:1.3;display:-webkit-box;overflow:hidden}.listen-caption[data-visible=true]{opacity:1}.cap-grammar{color:#ffffffd1}.cap-meaning{color:var(--accent-home)}.cap-sep{color:var(--text-whisper);padding:0 .15em}@media (prefers-reduced-motion:reduce){.listen-caption{transition:none}}.listen-transport{width:80%;font-family:var(--font-science);align-items:center;gap:clamp(.75rem,2vw,1.5rem);margin:0 auto;display:flex}.listen-play{cursor:pointer;font-family:var(--font-science);letter-spacing:.1em;text-transform:lowercase;color:var(--accent-home);transition:color var(--duration-hover)var(--ease-museum);text-align:left;background:0 0;border:none;flex:none;min-width:3.5em;font-size:.85rem}.listen-play:hover{color:var(--text-primary)}.listen-mute{cursor:pointer;font-family:var(--font-science);letter-spacing:.08em;text-transform:lowercase;color:var(--text-whisper);transition:color var(--duration-hover)var(--ease-museum);background:0 0;border:none;flex:none;min-width:3.5em;font-size:.75rem}.listen-mute:hover{color:var(--accent-home)}.listen-scrub{appearance:none;background:var(--whisper-color);cursor:pointer;outline:none;flex:auto;min-width:0;height:1px}.listen-scrub::-webkit-slider-thumb{appearance:none;background:var(--accent-home);cursor:pointer;width:11px;height:11px;transition:transform var(--duration-hover)var(--ease-museum);border-radius:50%}.listen-scrub::-moz-range-thumb{background:var(--accent-home);cursor:pointer;border:none;border-radius:50%;width:11px;height:11px}.listen-scrub:hover::-webkit-slider-thumb{transform:scale(1.25)}.listen-scrub:focus-visible{outline:1px solid var(--accent-home);outline-offset:6px}.listen-time{letter-spacing:.04em;color:var(--text-secondary);font-variant-numeric:tabular-nums;flex:none;font-size:.8rem}.listen-volume{appearance:none;background:var(--whisper-color);cursor:pointer;outline:none;flex:none;width:64px;height:1px}.listen-volume::-webkit-slider-thumb{appearance:none;background:var(--text-secondary);cursor:pointer;border-radius:50%;width:9px;height:9px}.listen-volume::-moz-range-thumb{background:var(--text-secondary);cursor:pointer;border:none;border-radius:50%;width:9px;height:9px}.listen-volume:focus-visible{outline:1px solid var(--accent-home);outline-offset:6px}.listen-hint{font-family:var(--font-science);letter-spacing:.1em;text-transform:lowercase;color:var(--text-whisper);text-align:center;margin:0;font-size:.68rem}.listen-note{font-family:var(--font-soul);color:#ffffff6b;text-align:center;text-wrap:balance;max-width:min(82ch,92vw);margin:0 auto;font-size:clamp(.72rem,1vw,.8rem);font-weight:300;line-height:1.65}.listen-section{letter-spacing:.08em;text-transform:lowercase;color:var(--text-whisper);flex:none;min-width:7em;font-size:.72rem}.listen-error{font-family:var(--font-soul);color:var(--text-secondary);text-align:center;padding:var(--margin-golden)}@media (max-width:768px){.listen-room{max-width:94vw}.listen-transport{width:100%}}@media (max-width:520px){.listen-volume{display:none}.listen-room{overflow-x:clip}.listen-invite{letter-spacing:.05em;font-size:.66rem}}