.listening{padding-top:55px;padding-bottom:65px}
.listening-heading{margin-bottom:30px}
.listening-profile{margin-left:auto;font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}
.listening-profile svg{width:20px;height:20px;fill:#1ed760}.listening-profile:hover{color:var(--fg)}
.listening-studio{max-width:1060px;margin:0 auto}
.listening-toolbar{display:flex;align-items:center;gap:20px;margin-bottom:13px;font-size:11px;color:var(--muted);line-height:1.6}
.listening-instruction{margin-right:auto}
.listening-skins{display:flex;gap:5px}
.listening-toolbar button,.listening-intro{font:inherit;color:#a8a8ad;border:1px solid #303139;background:#121316;padding:6px 9px;cursor:pointer;min-height:30px}
.listening-toolbar button:hover,.listening-intro:hover{color:var(--fg);border-color:#75705a}
.listening-skins button[aria-pressed=true]{color:var(--amber);border-color:#776747;background:#1b1811}
.listening-reset{white-space:nowrap}.listening-toolbar button:disabled,.listening-intro:disabled{opacity:.4;cursor:default}
.listening-frame-shell{position:relative;border:1px solid #272931;background:#0c0d11}
.listening-frame{display:block;border:0;width:100%;height:630px;background:#0c0d11}
.listening-frame-loading{position:absolute;left:0;right:0;top:80px;padding:20px;text-align:center;font-size:12px;line-height:1.8;color:var(--muted);pointer-events:none}
.listening-studio-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:13px;font-size:11px;line-height:1.8;color:var(--muted)}
.listening-intro{font-size:11px;white-space:nowrap}
.listening-feedback{font-size:11px;line-height:1.8;color:var(--amber);margin:8px 0 0}.listening-feedback:empty{display:none}
@media(max-width:680px){.listening-frame{height:960px}.listening-toolbar{gap:10px;flex-wrap:wrap}.listening-instruction{width:100%;margin-right:0}.listening-reset{margin-left:auto}.listening-studio-foot{align-items:flex-start;font-size:10px}.listening-toolbar button{padding:7px 8px;min-height:34px}.listening-intro{min-height:36px}}
@media(max-width:640px){.listening{padding:38px 0 45px}.listening-heading{gap:12px;margin-bottom:24px}.listening-heading h2{font-size:16px}.listening-profile{font-size:11px}.listening-profile svg{width:17px;height:17px}}
