*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(180deg,#2d1f14,#1a120a);color:#e2e8f0;min-height:100vh;display:flex;align-items:center;justify-content:center}.radio-page{padding:24px}.radio-device{width:320px;padding:28px 24px 24px;background:linear-gradient(145deg,#4a3728,#2d2118 50%,#1f1812);border-radius:24px;box-shadow:inset 0 1px 0 hsla(0,0%,100%,.08),0 8px 24px rgba(0,0,0,.5),0 2px 4px rgba(0,0,0,.3);border:2px solid #3d2c20}.radio-display{width:100%;aspect-ratio:1;background:#0f0f0f;border-radius:12px;overflow:hidden;margin-bottom:16px;display:flex;align-items:center;justify-content:center;border:3px solid #1a1a1a;box-shadow:inset 0 0 20px rgba(0,0,0,.6)}.radio-status{color:#888;font-size:.9rem}.radio-error{color:#e57373}.radio-cover{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.radio-cover img{width:100%;height:100%;object-fit:cover}.radio-cover-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1e3a5f,#0d1f33);color:hsla(0,0%,100%,.4);font-size:4rem}.radio-title{text-align:center;font-size:.85rem;color:#c4b5a5;margin-bottom:16px;min-height:1.2em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 8px}.radio-controls{gap:20px;margin-bottom:20px}.radio-controls,.radio-controls button{display:flex;align-items:center;justify-content:center}.radio-controls button{width:52px;height:52px;border-radius:50%;border:2px solid #5c4a3a;background:linear-gradient(180deg,#6b5344,#3d2e24);color:#e8ddd0;font-size:1.4rem;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,.4),inset 0 1px 0 hsla(0,0%,100%,.1);transition:transform .1s,background .15s}.radio-controls button:hover:not(:disabled){background:linear-gradient(180deg,#7a6352,#4a3828);transform:scale(1.05)}.radio-controls button:active:not(:disabled){transform:scale(.98)}.radio-controls button:disabled{opacity:.5;cursor:not-allowed}.radio-volume{display:flex;align-items:center;gap:10px}.radio-volume label{font-size:.75rem;color:#8a7a6a;min-width:24px}.radio-volume input[type=range]{flex:1 1;height:8px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#2d2118;border-radius:4px;border:1px solid #3d2c20}.radio-volume input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:linear-gradient(180deg,#8b7355,#5c4a3a);border:2px solid #3d2c20;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.4)}.radio-volume input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:linear-gradient(180deg,#8b7355,#5c4a3a);border:2px solid #3d2c20;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.4)}