:root{color-scheme:light;--red:#ff3b1f;--ink:#14110f;--paper:#fff;--dock-height:124px}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--paper);color:var(--ink);font:14px/1.4 system-ui,-apple-system,Segoe UI,sans-serif}#magazine{display:block;width:100%;height:calc(100dvh - var(--dock-height));border:0;background:#fff}#radio{position:fixed;inset:auto 0 0;z-index:100;background:#fff;border-top:3px solid var(--ink);padding:14px max(18px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom));box-shadow:0 -4px 22px #0000000d}.radio-strip{display:flex;align-items:center;gap:12px;max-width:1400px;margin:auto}.radio-brand{display:flex;align-items:center;gap:10px;margin-right:auto;min-width:200px}.radio-brand strong{display:block;font-size:19px;font-weight:950;letter-spacing:-.8px}.radio-brand small{display:block;font:9px/1.6 ui-monospace,monospace;letter-spacing:1.3px}.live-dot{width:11px;height:11px;border-radius:50%;background:var(--red);flex-shrink:0}#radio[data-playing="true"] .live-dot{box-shadow:0 0 0 5px #ff3b1f20}#radio label{font:10px/1.6 ui-monospace,monospace;display:block}select{display:block;max-width:210px;width:100%;font:500 13px system-ui;padding:7px 24px 7px 9px;background:#fff;color:var(--ink);border:1px solid #bbb;border-radius:0}button{font:700 13px system-ui;cursor:pointer;min-height:38px;min-width:38px;border:1px solid var(--ink);background:#fff;color:var(--ink);padding:8px 12px}button:disabled{opacity:.35;cursor:default}#radio-play{background:var(--red);border-color:var(--red);color:#fff;white-space:nowrap}.radio-now{display:flex;justify-content:space-between;gap:12px;max-width:1400px;margin:10px auto 0;font-size:11px;color:#625a55;min-height:16px}.radio-now a{color:inherit;white-space:nowrap}#radio-status{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}#radio-detail{max-width:1400px;margin:12px auto 0}#radio-detail[hidden]{display:none}#radio-widget-wrap iframe{width:100%;height:166px;border:0;display:block}.radio-tools{display:flex;gap:12px;align-items:center;margin-top:10px}#radio-volume{width:100px;accent-color:var(--red)}#radio-date{margin-left:auto;font-size:11px;color:#625a55}#radio-note{font-size:11px;color:#625a55;margin:8px 0 0}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--red);outline-offset:3px}.skip-radio{position:fixed;top:-60px;left:12px;background:white;padding:10px;z-index:200}.skip-radio:focus{top:12px}#radio-retry{font-size:11px;min-height:28px;padding:4px 8px}
@media(max-width:850px){.radio-strip{gap:8px;flex-wrap:wrap}.radio-brand{min-width:180px;flex:1 1 45%}.radio-strip>label{order:2;flex:1 1 30%;min-width:0}.radio-strip>label select{max-width:none}.radio-brand strong{font-size:17px}#radio-play{margin-left:auto}.radio-now{font-size:10px}.radio-now a{display:none}}@media(max-width:450px){#radio{padding:10px 12px}.radio-brand{min-width:155px}.radio-brand strong{font-size:15px}.radio-brand small{font-size:8px}button{padding:7px;min-width:32px;min-height:34px;font-size:12px}#radio-prev{display:none}.radio-strip{gap:7px}#radio-note{font-size:10px}#radio-date{font-size:10px}.radio-tools{gap:8px}}

/* Compact dock. It expands only when the listener opens it. */
:root{--dock-height:59px}
#radio-summary{border:0;padding:0;background:transparent;text-align:left;white-space:nowrap}
#radio[data-expanded="false"]{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:14px;padding:8px max(18px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom));cursor:pointer}
#radio[data-expanded="false"] .radio-strip{display:contents}
#radio[data-expanded="false"] .radio-brand{grid-column:1;grid-row:1;margin:0;min-width:0}
#radio[data-expanded="false"] .radio-brand strong{font-size:16px;letter-spacing:-.5px}
#radio[data-expanded="false"] .radio-brand small{display:none}
#radio[data-expanded="false"] .radio-strip>label,#radio[data-expanded="false"] #radio-prev,#radio[data-expanded="false"] #radio-next{display:none}
#radio[data-expanded="false"] #radio-play{grid-column:3;grid-row:1;margin:0;font-size:12px}
#radio[data-expanded="false"] #radio-expand{grid-column:4;grid-row:1}
#radio[data-expanded="false"] .radio-now{grid-column:2;grid-row:1;min-width:0;width:100%;max-width:none;margin:0;display:block}
#radio[data-expanded="false"] #radio-status{display:block}
#radio[data-expanded="false"] .radio-now a{display:none}
@media(max-width:650px){#radio[data-expanded="false"]{gap:8px;padding:8px 12px}#radio[data-expanded="false"] .radio-brand{gap:7px}#radio[data-expanded="false"] .radio-brand strong{font-size:12px;letter-spacing:-.4px}#radio[data-expanded="false"] .live-dot{width:8px;height:8px}#radio[data-expanded="false"] #radio-play{font-size:11px;padding:7px}#radio[data-expanded="false"] #radio-status{font-size:10px}#radio[data-expanded="false"] #radio-expand{min-width:30px;padding:7px}}