@property --radio-theme{syntax:"<color>";inherits:true;initial-value:#e3b44b}.radio-player,.radio-player *{--radio-light:color-mix(in oklab, var(--radio-theme) 50%, var(--om-ink-base));--radio-signal:color-mix(in oklab, var(--radio-theme) 55%, var(--om-gold-200))}.radio-player{width:100%;max-width:1040px;margin:0 auto}.radio-console{isolation:isolate;border:1px solid rgb(var(--om-ink-base-rgb) / .09);background:radial-gradient(120% 70% at 50% 0%, color-mix(in srgb, var(--radio-theme) 16%, transparent), transparent 70%), linear-gradient(165deg, #1b1925 0%, #0e0d17 38%, #07070d 100%);box-shadow:0 60px 140px -50px color-mix(in srgb, var(--radio-theme) 60%, transparent), 0 40px 90px -30px rgb(var(--om-black-rgb) / .9), 0 0 0 1px rgb(var(--om-gold-500-rgb) / .06), inset 0 1px 0 rgb(var(--om-ink-white-rgb) / .09), inset 0 -1px 0 rgb(var(--om-black-rgb) / .6);transition:--radio-theme var(--om-dur-reveal) var(--om-ease-out);border-radius:30px;gap:28px;padding:22px 16px 16px;display:grid;position:relative}.radio-console:focus-within{border-color:rgb(var(--om-ink-base-rgb) / .13)}.radio-console-aura{z-index:-1;background:radial-gradient(closest-side, var(--radio-theme), transparent);filter:blur(60px);opacity:.32;pointer-events:none;transition:opacity var(--om-dur-fade) var(--om-ease);border-radius:50%;position:absolute;inset:6% 8% -4%}.radio-console[data-phase=playing] .radio-console-aura{opacity:.5}.radio-console-grille{z-index:-1;border-radius:inherit;background-image:radial-gradient(rgb(var(--om-ink-base-rgb) / .07) 1px, transparent 1.4px);pointer-events:none;background-size:7px 7px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 55%);mask-image:linear-gradient(#000,#0000 55%)}.radio-console-body{gap:28px;display:grid}.radio-console-controls{justify-content:center;display:flex}.radio-dial{height:58px;margin:0 6px;position:relative}.radio-dial-ticks{border-bottom:1px solid rgb(var(--om-ink-base-rgb) / .2);background:repeating-linear-gradient(90deg, rgb(var(--om-ink-base-rgb) / .34) 0 1px, transparent 1px 40px) left bottom / 100% 16px no-repeat, repeating-linear-gradient(90deg, rgb(var(--om-ink-base-rgb) / .16) 0 1px, transparent 1px 8px) left bottom / 100% 8px no-repeat;height:16px;position:absolute;inset:auto 0 0;-webkit-mask-image:linear-gradient(90deg,#0000,#000 6% 94%,#0000);mask-image:linear-gradient(90deg,#0000,#000 6% 94%,#0000)}.radio-dial-mark{color:var(--om-text-tertiary);transition:color var(--om-dur-state) var(--om-ease);white-space:nowrap;flex-direction:column;align-items:center;gap:2px;display:flex;position:absolute;top:0;transform:translate(-50%)}.radio-dial-mark[data-active]{color:var(--om-gold-200)}.radio-dial-mark-number{font:500 var(--om-t-mono-meta-size)/1 var(--om-font-mono);letter-spacing:var(--om-track-mono)}.radio-dial-mark-name{font:500 12px/1 var(--om-font-sans);letter-spacing:var(--om-track-label);text-transform:uppercase;display:none}.radio-dial-needle{border-radius:var(--om-r-bar);background:linear-gradient(180deg, var(--om-gold-100), var(--om-gold-500) 60%, var(--om-gold-700));width:2px;box-shadow:0 0 12px 1px rgb(var(--om-gold-500-rgb) / .7), 0 0 30px 4px color-mix(in srgb, var(--radio-theme) 50%, transparent);transition:left var(--om-dur-reveal) var(--om-ease-out);position:absolute;top:18px;bottom:-6px;transform:translate(-50%)}.radio-dial-needle:before{content:"";border-radius:var(--om-r-full);background:var(--om-gold-100);width:8px;height:8px;box-shadow:var(--om-shadow-glow-sm);position:absolute;top:-4px;left:50%;transform:translate(-50%)}.radio-display{border:1px solid rgb(var(--om-ink-base-rgb) / .07);background:radial-gradient(90% 80% at 0% 0%, color-mix(in srgb, var(--radio-theme) 22%, transparent), transparent 70%), var(--om-screen);min-height:300px;box-shadow:inset 0 2px 24px rgb(var(--om-black-rgb) / .85), inset 0 0 0 1px rgb(var(--om-black-rgb) / .5), 0 1px 0 rgb(var(--om-ink-white-rgb) / .06);border-radius:22px;flex-direction:column;gap:12px;padding:22px 20px 20px;display:flex;position:relative;overflow:hidden}.radio-display-glass{background:linear-gradient(170deg, rgb(var(--om-ink-white-rgb) / .06), transparent 34%), repeating-linear-gradient(0deg, rgb(var(--om-ink-white-rgb) / .018) 0 1px, transparent 1px 3px);pointer-events:none;position:absolute;inset:0}.radio-display>:not(.radio-display-glass){position:relative}.radio-display-top{justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px;display:flex}.radio-status{font:500 var(--om-t-mono-meta-size)/1 var(--om-font-mono);letter-spacing:var(--om-track-mono-wide);text-transform:uppercase;color:var(--om-gold-200);align-items:center;gap:9px;display:inline-flex}.radio-status-dot{border-radius:var(--om-r-full);background:rgb(var(--om-ink-base-rgb) / .3);width:7px;height:7px;transition:background-color var(--om-dur-state) var(--om-ease), box-shadow var(--om-dur-state) var(--om-ease);flex:none}[data-phase=playing] .radio-status-dot,.radio-mini .radio-status-dot{background:var(--radio-signal);box-shadow:0 0 10px 2px color-mix(in srgb, var(--radio-signal) 70%, transparent)}[data-phase=loading] .radio-status-dot,[data-phase=paused] .radio-status-dot{background:var(--om-gold-500)}.radio-display-number{font:500 var(--om-t-mono-meta-size)/1 var(--om-font-mono);letter-spacing:var(--om-track-mono);color:var(--om-text-secondary);text-transform:uppercase}.radio-display-of{color:var(--om-text-tertiary)}.radio-display-title{font:400 clamp(44px, 11vw, 68px) / .98 var(--om-font-serif);letter-spacing:-.01em;color:var(--om-ink-base);text-shadow:0 0 44px color-mix(in srgb, var(--radio-theme) 75%, transparent);overflow-wrap:anywhere;margin:0}.radio-display-description{max-width:46ch;color:var(--om-text-secondary);text-wrap:pretty;margin:0;font-size:15px;line-height:1.7}.radio-display-note{font:italic 400 18px/1.4 var(--om-font-serif);color:var(--om-gold-200);margin:0}.radio-meter{align-items:flex-end;gap:3px;height:46px;margin-top:auto;padding-top:14px;display:flex}.radio-meter-bar{height:calc(var(--level) * 100%);background:linear-gradient(0deg, color-mix(in srgb, var(--radio-signal) 50%, transparent), var(--radio-signal));transform-origin:bottom;opacity:.45;transition:transform var(--om-dur-fade) var(--om-ease-out), opacity var(--om-dur-fade) var(--om-ease);border-radius:2px;flex:1;transform:scaleY(.16)}[data-phase=playing] .radio-meter-bar{opacity:.95;transform:scaleY(.75)}[data-phase=paused] .radio-meter-bar{opacity:.5;transform:scaleY(.3)}.radio-transport{flex-direction:column;align-items:center;gap:22px;width:100%;display:flex}.radio-transport-main{justify-content:center;align-items:center;gap:clamp(18px,6vw,30px);display:flex}.radio-step{border:1px solid rgb(var(--om-ink-base-rgb) / .14);border-radius:var(--om-r-full);background:linear-gradient(180deg, rgb(var(--om-ink-base-rgb) / .06), rgb(var(--om-ink-base-rgb) / .01));width:52px;height:52px;box-shadow:inset 0 1px 0 rgb(var(--om-ink-white-rgb) / .08), 0 8px 18px -10px rgb(var(--om-black-rgb) / .9);color:var(--om-text-secondary);cursor:pointer;transition:border-color var(--om-dur-state) var(--om-ease), color var(--om-dur-state) var(--om-ease), transform .16s var(--om-ease);place-items:center;display:grid}.radio-step:hover{border-color:rgb(var(--om-gold-500-rgb) / .55);color:var(--om-gold-200)}.radio-step:active{transform:scale(.94)}.radio-orb{border-radius:var(--om-r-full);width:112px;height:112px;box-shadow:0 0 0 1px rgb(var(--om-gold-500-rgb) / .6), 0 0 0 8px rgb(var(--om-ink-base-rgb) / .025), 0 0 0 9px rgb(var(--om-gold-500-rgb) / .16), 0 26px 50px -14px rgb(var(--om-black-rgb) / .95), inset 0 1px 1px rgb(var(--om-ink-white-rgb) / .16);color:var(--om-gold-200);cursor:pointer;transition:transform .2s var(--om-ease), box-shadow var(--om-dur-state) var(--om-ease), color var(--om-dur-state) var(--om-ease);background:radial-gradient(circle at 34% 28%,#2c2937,#0d0c15 72%);border:0;place-items:center;display:grid;position:relative}.radio-orb:hover{transform:scale(1.03)}.radio-orb:active{transform:scale(.97)}.radio-orb[data-playing]{background:var(--om-grad-gold-fab);color:var(--om-gold-on);box-shadow:0 0 0 1px rgb(var(--om-gold-200-rgb) / .8), 0 0 0 8px rgb(var(--om-gold-500-rgb) / .08), 0 0 0 9px rgb(var(--om-gold-500-rgb) / .28), var(--om-shadow-fab)}.radio-orb[aria-busy=true]{cursor:progress}.radio-orb:disabled{transform:none}.radio-orb-face{place-items:center;display:grid;translate:2px}.radio-orb[data-playing] .radio-orb-face{translate:0}.radio-orb-halo{border:1px solid color-mix(in srgb, var(--radio-light) 45%, transparent);border-radius:var(--om-r-full);opacity:0;pointer-events:none;transition:opacity var(--om-dur-fade) var(--om-ease);position:absolute;inset:-18px}.radio-orb[data-playing] .radio-orb-halo,.radio-orb[aria-busy=true] .radio-orb-halo{opacity:1}.radio-orb[aria-busy=true] .radio-orb-halo{border-style:dashed;border-color:rgb(var(--om-gold-500-rgb) / .55)}.radio-transport-row{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.radio-key{border:1px solid rgb(var(--om-ink-base-rgb) / .13);border-radius:var(--om-r-full);background:rgb(var(--om-ink-base-rgb) / .03);min-height:44px;font:500 13px/1 var(--om-font-sans);color:var(--om-text-secondary);cursor:pointer;transition:border-color var(--om-dur-state) var(--om-ease), color var(--om-dur-state) var(--om-ease), opacity var(--om-dur-state) var(--om-ease);align-items:center;gap:7px;padding:8px 15px;display:inline-flex}.radio-key:hover:not(:disabled){border-color:rgb(var(--om-gold-500-rgb) / .5);color:var(--om-gold-200)}.radio-key:disabled{opacity:.4;cursor:default}.radio-key[data-on]{border-color:rgb(var(--om-gold-500-rgb) / .55);color:var(--om-gold-200)}.radio-key-value{font:500 12px/1 var(--om-font-mono);letter-spacing:.04em;font-variant-numeric:tabular-nums;color:var(--om-text-secondary)}.radio-key[data-on] .radio-key-value{color:var(--om-gold-100)}.radio-volume{width:min(240px,100%);color:var(--om-text-secondary);align-items:center;gap:12px;display:flex}.radio-volume input{appearance:none;cursor:pointer;background:0 0;flex:1;height:24px;margin:0}.radio-volume input::-webkit-slider-runnable-track{border-radius:var(--om-r-full);background:linear-gradient(90deg, var(--om-gold-500) calc(var(--volume) * 100%), rgb(var(--om-ink-base-rgb) / .16) 0);height:3px}.radio-volume input::-moz-range-track{border-radius:var(--om-r-full);background:rgb(var(--om-ink-base-rgb) / .16);height:3px}.radio-volume input::-moz-range-progress{border-radius:var(--om-r-full);background:var(--om-gold-500);height:3px}.radio-volume input::-webkit-slider-thumb{border-radius:var(--om-r-full);background:var(--om-gold-200);width:16px;height:16px;box-shadow:0 0 12px rgb(var(--om-gold-500-rgb) / .7);appearance:none;border:0;margin-top:-6.5px}.radio-volume input::-moz-range-thumb{border-radius:var(--om-r-full);background:var(--om-gold-200);width:16px;height:16px;box-shadow:0 0 12px rgb(var(--om-gold-500-rgb) / .7);border:0}.radio-volume input:focus-visible{outline:2px solid var(--om-gold-500);outline-offset:4px;border-radius:var(--om-r-xs)}.radio-presets{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:0;padding:0;list-style:none;display:grid}.radio-preset{border:1px solid rgb(var(--om-ink-base-rgb) / .09);background:linear-gradient(180deg, rgb(var(--om-ink-base-rgb) / .055), rgb(var(--om-ink-base-rgb) / .012));box-shadow:inset 0 1px 0 rgb(var(--om-ink-white-rgb) / .07), 0 12px 24px -16px rgb(var(--om-black-rgb) / .95);transition:border-color var(--om-dur-state) var(--om-ease), background-color var(--om-dur-state) var(--om-ease), transform .2s var(--om-ease), box-shadow var(--om-dur-state) var(--om-ease);border-radius:18px;grid-template-columns:1fr auto;grid-template-areas:"head action""title title""subtitle subtitle";align-content:start;align-items:center;gap:6px 12px;padding:16px 18px 18px;display:grid;position:relative}.radio-preset:hover{border-color:rgb(var(--om-ink-base-rgb) / .2);transform:translateY(-2px)}.radio-preset[data-tuned]{border-color:color-mix(in srgb, var(--radio-theme) 55%, rgb(var(--om-ink-base-rgb) / .2))}.radio-preset[data-active]{background:radial-gradient(120% 120% at 0% 0%, color-mix(in srgb, var(--radio-theme) 30%, transparent), transparent 70%), rgb(var(--om-ink-base-rgb) / .02);box-shadow:inset 0 2px 10px rgb(var(--om-black-rgb) / .6), 0 0 0 1px color-mix(in srgb, var(--radio-theme) 35%, transparent);transform:translateY(1px)}.radio-preset:has(.radio-preset-hit:focus-visible){outline:2px solid var(--om-gold-500);outline-offset:3px}.radio-preset-head{grid-area:head;align-items:center;gap:10px;display:flex}.radio-preset-number{font:500 var(--om-t-mono-meta-size)/1 var(--om-font-mono);letter-spacing:var(--om-track-mono);color:var(--om-text-tertiary)}.radio-preset-lamp{border-radius:var(--om-r-full);background:color-mix(in srgb, var(--radio-theme) 45%, rgb(var(--om-ink-base-rgb) / .15));width:7px;height:7px;transition:background-color var(--om-dur-state) var(--om-ease), box-shadow var(--om-dur-state) var(--om-ease)}.radio-preset[data-tuned] .radio-preset-lamp,.radio-preset[data-active] .radio-preset-lamp{background:var(--radio-light);box-shadow:0 0 10px 2px color-mix(in srgb, var(--radio-theme) 80%, transparent)}.radio-preset-title{font:400 28px/1.05 var(--om-font-serif);color:var(--om-ink-base);grid-area:title;margin:4px 0 0}.radio-preset-subtitle{font:400 16px/1.4 var(--om-font-serif);color:var(--om-text-secondary);text-wrap:pretty;grid-area:subtitle;margin:0}.radio-preset-hit{color:inherit;cursor:pointer;background:0 0;border:0;grid-area:action;padding:0;display:flex}.radio-preset-hit:after{content:"";border-radius:inherit;position:absolute;inset:0}.radio-preset-hit:focus-visible{outline:none}.radio-preset-hit[aria-busy=true]{cursor:progress}.radio-preset-action{border:1px solid rgb(var(--om-ink-base-rgb) / .16);border-radius:var(--om-r-full);font:600 12px/1 var(--om-font-sans);letter-spacing:var(--om-track-wider);text-transform:uppercase;color:var(--om-text-secondary);transition:background-color var(--om-dur-state) var(--om-ease), border-color var(--om-dur-state) var(--om-ease), color var(--om-dur-state) var(--om-ease);align-items:center;gap:6px;padding:7px 11px 7px 9px;display:inline-flex}.radio-preset:hover .radio-preset-action{border-color:rgb(var(--om-gold-500-rgb) / .55);color:var(--om-gold-200)}.radio-preset[data-playing] .radio-preset-action{background:var(--om-gold-500);color:var(--om-gold-on);border-color:#0000}.radio-error{text-align:center;color:var(--om-gold-200);margin:-8px 0 0;font-size:14px}.radio-mini{z-index:40;left:50%;bottom:max(16px, env(safe-area-inset-bottom));border:1px solid rgb(var(--om-ink-base-rgb) / .12);border-radius:var(--om-r-full);-webkit-backdrop-filter:blur(18px)saturate(1.2);backdrop-filter:blur(18px)saturate(1.2);width:min(480px,100% - 32px);box-shadow:var(--om-shadow-panel);background:#0d0d1cdb;align-items:center;gap:12px;padding:8px 8px 8px 18px;display:flex;position:fixed;transform:translate(-50%)}.radio-mini-label{min-width:0;color:inherit;flex:1;align-items:center;gap:12px;text-decoration:none;display:flex}.radio-mini-text{flex-direction:column;gap:3px;min-width:0;display:flex}.radio-mini-artist{font:500 var(--om-t-mono-meta-size)/1 var(--om-font-mono);letter-spacing:var(--om-track-mono-wide);text-transform:uppercase;color:var(--om-text-secondary)}.radio-mini-title{font:400 20px/1.1 var(--om-font-serif);white-space:nowrap;text-overflow:ellipsis;color:var(--om-ink-base);overflow:hidden}.radio-mini-toggle{border-radius:var(--om-r-full);background:var(--om-grad-gold-fab);width:44px;height:44px;color:var(--om-gold-on);cursor:pointer;border:0;flex:none;place-items:center;display:grid}.radio-mini-toggle:disabled{opacity:.6;cursor:progress}@media (min-width:520px){.radio-dial{height:70px}.radio-dial-mark-name{display:block}.radio-dial-needle{top:32px}}@media (min-width:760px){.radio-console{border-radius:36px;gap:32px;padding:30px 32px 28px}.radio-console-body{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:stretch;gap:36px}.radio-console-controls{align-items:center}.radio-display{min-height:340px;padding:26px 28px 24px}.radio-orb{width:124px;height:124px}}@media (min-width:1000px){.radio-console{padding:36px 44px}}@media not (prefers-reduced-motion:reduce){.radio-display-title{animation:radio-tune-in var(--om-dur-fade) var(--om-ease-out) both}[data-phase=playing] .radio-meter-bar{animation:radio-level calc(.9s + var(--level) * .9s) var(--om-ease) calc(var(--i) * -.17s) infinite alternate}[data-phase=playing] .radio-status-dot,.radio-mini[data-playing] .radio-status-dot{animation:radio-pulse 2.4s var(--om-ease) infinite}.radio-orb[data-playing] .radio-orb-halo{animation:radio-breathe 6s var(--om-ease) infinite}.radio-orb[aria-busy=true] .radio-orb-halo{animation:2.4s linear infinite radio-spin}.radio-console[data-phase=playing] .radio-console-aura{animation:radio-aura 10s var(--om-ease) infinite}.radio-mini{animation:radio-rise var(--om-dur-state) var(--om-ease-out) both}}@media (prefers-reduced-motion:reduce){.radio-console,.radio-dial-needle,.radio-preset,.radio-orb,.radio-meter-bar{transition:none}}@keyframes radio-tune-in{0%{opacity:0;filter:blur(6px);transform:translateY(6px)}to{opacity:1;filter:blur();transform:none}}@keyframes radio-level{0%{transform:scaleY(.25)}55%{transform:scaleY(.9)}to{transform:scaleY(.45)}}@keyframes radio-pulse{0%,to{opacity:1}50%{opacity:.35}}@keyframes radio-breathe{0%,to{opacity:.9;transform:scale(1)}50%{opacity:.35;transform:scale(1.1)}}@keyframes radio-spin{to{transform:rotate(1turn)}}@keyframes radio-aura{0%,to{opacity:.42;transform:scale(1)}50%{opacity:.58;transform:scale(1.05)}}@keyframes radio-rise{0%{opacity:0;transform:translate(-50%,16px)}to{opacity:1;transform:translate(-50%)}}
