:root{--ink:#2a241e;--muted:#8d8274;--paper:#eee8dc;--wood:#8a4f2b;--wood-dark:#5b2e1c;--copper:#d39a53;--green:#b8d77d}*{box-sizing:border-box}body{min-width:320px;color:var(--ink);background:#28221d;margin:0;font-family:Inter,ui-sans-serif,system-ui,sans-serif}button{font:inherit}.radio-shell{background:radial-gradient(circle at 50% -10%,#6e4934 0,#28221d 55%);min-height:100vh;padding:18px 14px 28px}.radio-app{background:var(--paper);border:1px solid #bd8a5b;border-radius:30px;width:min(100%,560px);margin:0 auto;padding:22px 16px 16px;overflow:hidden;box-shadow:0 22px 60px #17110d99,inset 0 1px #fff8}.radio-header,.visualizer-label{justify-content:space-between;align-items:center;display:flex}.radio-header{margin-bottom:18px}.brand-lockup{align-items:center;gap:10px;display:flex}.eyebrow{color:var(--wood-dark);letter-spacing:.19em;text-transform:uppercase;margin:0;font-size:11px;font-weight:800}.live-indicator{color:#55722f;letter-spacing:.12em;text-transform:uppercase;align-items:center;gap:6px;font-size:10px;font-weight:800;display:flex}.live-indicator span,.preset-light{background:var(--green);border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 3px #b8d77d33,0 0 10px #b8d77d}.tuner-panel{color:#f4d9ae;background:linear-gradient(135deg,#8f5431,#62321f 55%,#4e281c);border:1px solid #422317;border-radius:22px;padding:16px;position:relative;overflow:hidden;box-shadow:inset 0 1px #e8b77c88,inset 0 -10px 24px #32170f55,0 8px 16px #4d271a40}.tuner-panel:after{content:"";pointer-events:none;opacity:.13;mix-blend-mode:soft-light;background:repeating-linear-gradient(102deg,#0000 0 5px,#fff 6px 7px,#0000 8px 17px);position:absolute;inset:0}.radio-display{z-index:1;background:#211c16;border:1px solid #382016;border-radius:10px;margin:20px 0 14px;padding:15px 14px 18px;position:relative;overflow:hidden;box-shadow:inset 0 3px 8px #0009,0 1px #d39a5388}.radio-visualizer{z-index:0;color:#d78947;opacity:.68;filter:drop-shadow(0 0 10px #d789474d);mix-blend-mode:screen;pointer-events:none;width:100%;position:absolute;inset:0;height:100%!important}.radio-display:after{content:"";z-index:1;pointer-events:none;background:linear-gradient(90deg,#211c16b8 0%,#211c1659 45%,#211c16a8 100%);position:absolute;inset:0}.radio-display-content{z-index:2;position:relative}.radio-display h1{color:#f7d9a9;letter-spacing:-.03em;margin:7px 0 18px;font-family:Georgia,serif;font-size:clamp(23px,6vw,34px);font-weight:500;line-height:1.05}.frequency-line{color:#ad8355;justify-content:space-between;align-items:center;font-size:9px;font-weight:700;display:flex}.frequency-line i{background:#8d603c;width:1px;height:6px;display:block}.active-frequency{color:#f3bd68}.needle{background:#ffca70;width:1px;height:25px;transition:left .28s;position:absolute;bottom:10px;box-shadow:0 0 7px #ffb64c}.tuner-controls{z-index:1;justify-content:center;align-items:center;gap:18px;display:flex;position:relative}.audio-engine{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.metal-button{color:#59301e;background:linear-gradient(#efc47e,#af6e35);border:1px solid #f1c886;border-radius:50%;width:38px;min-width:38px;height:38px;box-shadow:inset 0 2px #fff8,0 3px 4px #3c1d1288}.radio-play-button{color:#ffe3b2;background:linear-gradient(145deg,#a36338,#542b1d);border:2px solid #f1c886;border-radius:50%;width:58px;min-width:58px;height:58px;transition:transform .16s,filter .16s,box-shadow .16s;box-shadow:inset 0 2px #f5c17d88,0 4px 5px #32160e99}.radio-play-button:hover{filter:brightness(1.1);transform:translateY(-1px)}.radio-play-button:active{transform:translateY(2px);box-shadow:inset 0 2px #f5c17d66,0 1px 2px #32160e99}.visualizer-card{background:#e7dfd2;border:1px solid #cfc2b0;border-radius:16px;margin-top:14px;padding:12px 14px 8px;box-shadow:inset 0 2px 7px #a4948040}.visualizer-card canvas{height:76px;color:var(--wood)}.preset-grid{gap:8px;margin-top:22px;display:grid}.preset{color:#5d5145;text-align:left;cursor:pointer;background:#e6ded1;border:1px solid #d4c8b8;border-radius:12px;grid-template-columns:1fr 8px;align-items:center;gap:8px;width:100%;min-height:49px;padding:0 14px;transition:transform .18s,background .18s,color .18s;display:grid;box-shadow:0 2px #c8bbaa,inset 0 1px #fff9}.preset:hover{transform:translateY(-1px)}.preset.is-selected{color:#fce2b4;background:var(--wood);border-color:#6e3a24;box-shadow:0 3px #4d291c,inset 0 1px #e5a66c88}.preset-title{font-size:14px;font-weight:700}.preset-light{opacity:0}.is-selected .preset-light{opacity:1}.radio-footer{color:#a39482;text-align:center;margin-top:16px;font-family:Georgia,serif;font-size:12px}.radio-footer a{color:var(--wood-dark);text-underline-offset:3px;-webkit-text-decoration:underline #c18b58;text-decoration:underline #c18b58}.radio-footer a:hover{color:var(--wood)}@media (width>=600px){.radio-shell{padding:42px 24px}.radio-app{padding:28px 25px 18px}}