.fal-radio-app .fal-radio-player.fa-record-player{height:auto;min-height:0;display:flex;align-items:stretch;justify-content:flex-start;gap:20px;padding:26px 28px 24px;text-align:left;color:#fff;background:radial-gradient(ellipse at 0 0,#8e397e88,transparent 55%),linear-gradient(135deg,#3e225c,#21173f 60%,#154e75);border:1px solid #9668b088;border-radius:26px;box-shadow:0 18px 45px #32134d20;position:relative;isolation:isolate}
.fa-record-top{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;font-weight:700;letter-spacing:1px;color:#eed8f7}.fa-record-top span{display:flex;align-items:center;gap:9px}.fa-record-top i{width:8px;height:8px;border-radius:50%;background:#69ffcb;box-shadow:0 0 14px #69ffcb}.fa-record-top small{font:600 10px/1.4 system-ui;letter-spacing:2px}
.fa-record-stage{position:relative;display:grid;place-items:center;aspect-ratio:1.4;background:linear-gradient(135deg,#342745,#271e40);border-radius:18px;overflow:hidden;padding:22px}
.fa-record-disc{position:relative;width:72%;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,#090910 0 2px,#202028 3px,#0b0b13 5px);box-shadow:0 0 0 2px #ae71ff,0 0 28px #a371ff28;display:grid;place-items:center;animation:fa-record-spin 18s linear infinite;animation-play-state:paused}
.fa-record-disc:before{content:'';position:absolute;inset:-15px;border-radius:50%;border:4px dotted #a58cff;filter:drop-shadow(0 0 3px #80f1d9)}
.fa-record-label{width:45%;aspect-ratio:1;border:2px solid #9365b4;border-radius:50%;background:radial-gradient(circle,#59336d,#291737);display:grid;place-items:center;overflow:hidden}
.fal-radio-app .fa-record-label .fal-radio-logo{width:92%;height:92%;object-fit:contain;margin:0;filter:drop-shadow(0 2px 4px #0008)}
.fa-record-arm{position:absolute;width:24%;height:9px;background:linear-gradient(#ece9fa,#7e89a3);right:14%;bottom:24%;transform:rotate(-26deg);transform-origin:right center;border-radius:10px;box-shadow:0 3px 6px #0007}.fa-record-arm:before{content:'';position:absolute;width:28px;height:28px;right:-8px;top:-10px;border-radius:50%;background:radial-gradient(circle,#9fffee,#677de7 60%,#8b4cd0);box-shadow:0 0 14px #8c78ee}.fa-record-arm:after{content:'';position:absolute;width:27px;height:13px;left:-3px;top:-2px;border-radius:3px;background:#9cf6ef}
.fa-record-controls{display:flex;align-items:center;justify-content:space-between;gap:18px}.fa-record-copy{min-width:0}.fal-radio-app .fa-record-copy h1{font-size:clamp(19px,2vw,27px);color:#fff;margin:0 0 5px;line-height:1.4}.fal-radio-app .fa-record-copy p{color:#d8c6e9;font-size:13px;margin:0 0 9px}.fal-radio-app .fa-record-copy .fal-radio-status{display:block;color:#e7c9f8;font-size:12px}.fa-record-copy>small{font-size:11px;color:#baa7d0}
.fal-radio-app .fa-record-player .fal-radio-play{flex:none;width:74px;height:74px;background:linear-gradient(135deg,#ffd37c,#ff6c98);color:#3b164e;box-shadow:0 0 0 8px #c2a5ed18;font-size:30px}
.fal-radio-app .fa-record-player .fa-radio-wave{max-width:none;height:48px;gap:3px;opacity:1}.fal-radio-app .fa-record-player .fa-radio-wave i{flex:1;max-width:none;background:linear-gradient(#b5faff,#c37fff,#ffacdc);box-shadow:0 0 5px #daabf980}
.fa-record-volume{display:flex;align-items:center;gap:18px;font-size:12px;color:#e9d9f4}.fa-record-volume input{width:100%;min-width:0;accent-color:#ff83b7;cursor:pointer}.fa-record-playing .fa-record-disc{animation-play-state:running}
@keyframes fa-record-spin{to{transform:rotate(360deg)}}
@media(max-width:800px){.fal-radio-app .fal-radio-player.fa-record-player{padding:20px;gap:17px;border-radius:22px}.fa-record-stage{aspect-ratio:1.25}.fa-record-top{font-size:11px}.fal-radio-app .fa-record-player .fal-radio-play{width:62px;height:62px}.fal-radio-app .fa-record-copy h1{font-size:20px}.fal-radio-app .fa-record-copy p{font-size:12px}}
@media(prefers-reduced-motion:reduce){.fa-record-disc{animation:none}}
/* Compact radio page and two playback-linked decorative spectra. */
.fal-radio-app .fal-layout{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);max-width:1120px;margin-inline:auto}
.fal-radio-app .fal-radio-player.fa-record-player{padding:21px 24px;gap:15px;border-radius:24px}
.fa-record-stage{aspect-ratio:1.6;padding:26px}
.fa-record-disc{width:66%}
.fa-record-disc:before{display:none}
.fa-record-spectrum-ring{position:absolute;inset:-6px;pointer-events:none;animation:fa-record-spin 18s linear infinite reverse;animation-play-state:paused}
.fa-record-spectrum-ring i{position:absolute;inset:0;transform:rotate(var(--angle));border-radius:50%}
.fa-record-spectrum-ring i:after{content:'';position:absolute;left:calc(50% - 2px);bottom:100%;width:4px;height:24px;border-radius:4px;background:hsl(var(--hue) 95% 65%);box-shadow:0 0 7px hsl(var(--hue) 95% 65% / .65);transform-origin:center bottom;transform:scaleY(.28);animation:fa-record-ring-pulse .75s ease-in-out var(--delay) infinite alternate;animation-play-state:paused}
.fa-record-playing .fa-record-spectrum-ring,.fa-record-playing .fa-record-spectrum-ring i:after{animation-play-state:running}
.fa-record-color-spectrum{height:92px;border-radius:12px;overflow:hidden;background:#0b0b0b}
.fa-record-color-spectrum img{display:block;width:100%;height:100%;object-fit:fill;animation:fa-record-wave-glow 1.1s ease-in-out infinite alternate;animation-play-state:paused;opacity:.6}
.fa-record-playing .fa-record-color-spectrum img{animation-play-state:running;opacity:1}
@keyframes fa-record-ring-pulse{from{transform:scaleY(.28);filter:brightness(.8)}to{transform:scaleY(1);filter:brightness(1.35)}}
@keyframes fa-record-wave-glow{from{transform:scaleY(.8);filter:brightness(.85)}to{transform:scaleY(1.04);filter:brightness(1.2)}}
@media(max-width:800px){.fal-radio-app .fal-layout{grid-template-columns:minmax(0,1fr)}.fal-radio-app .fal-radio-player.fa-record-player{padding:18px;gap:14px}.fa-record-stage{aspect-ratio:1.4}.fa-record-color-spectrum{height:80px}}
@media(prefers-reduced-motion:reduce){.fa-record-spectrum-ring,.fa-record-spectrum-ring i,.fa-record-color-spectrum img{animation:none}}

/* Keep the entire disc and outer bars inside the available stage. */
.fal-radio-app .fa-record-stage{width:100%;height:clamp(230px,28vw,340px);min-height:0;aspect-ratio:auto;padding:0;overflow:hidden}
.fal-radio-app .fa-record-disc{height:calc(100% - 76px);width:auto;max-width:calc(100% - 76px);aspect-ratio:1;min-width:0;min-height:0}
.fal-radio-app .fa-record-color-spectrum{background:transparent;height:78px;border-radius:0;overflow:visible}
.fal-radio-app .fa-record-color-spectrum img{width:100%;height:100%;object-fit:fill;animation:none!important;transform:none!important;filter:none;opacity:1}
.fa-record-arm{right:19%;bottom:25%;width:21%}
@media(max-width:800px){.fal-radio-app .fa-record-stage{height:250px}.fal-radio-app .fa-record-color-spectrum{height:65px}}

@media(prefers-reduced-motion:reduce){.fa-record-spectrum-ring i:after{animation:none}}

.fa-record-color-spectrum canvas{display:block;width:100%;height:100%;background:transparent}
