.ls { display:flex; align-items:center; gap:6px; font-size:12px; }
.ls>button,.ls summary { border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--ink); cursor:pointer; padding:6px 10px; min-height:32px; font:inherit; }
.ls summary { list-style:none; }
.ls details { position:relative; }
.ls-panel { position:fixed; z-index:1200; right:12px; top:64px; width:300px; max-width:calc(100vw - 24px); max-height:calc(100dvh - 80px); overflow:auto; box-sizing:border-box; padding:18px; background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:12px; box-shadow:0 12px 35px #0004; }
.ls-panel label { display:flex; gap:10px; align-items:center; justify-content:space-between; margin:14px 0; font-size:14px; }
.ls-panel input[type=range] { width:130px; }
.ls-panel p { font-size:12px; line-height:1.6; color:var(--muted); }
.ls-panel button { background:var(--primary); color:var(--card); border:0; padding:10px; border-radius:8px; cursor:pointer; }
.ls-panel #ls-close { position:absolute; right:6px; top:4px; width:44px; height:44px; background:transparent; color:var(--ink); font-size:24px; padding:0; }
.ls-panel strong { display:block; padding-right:30px; }
.ls-panel #ls-panel-mute { background:var(--card); color:var(--ink); border:1px solid var(--line); margin:6px 0; }
.ls :focus-visible,.ls-panel :focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
.ls-panel[hidden] { display:none; }
.ls[hidden],.ls-learn-controls[hidden] { display:none!important; }
.ls-panel { z-index:12000; }
.ls-learn-controls { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 10px; }
.ls-learn-controls button { min-height:36px; background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:6px 12px; cursor:pointer; }
@media(max-width:860px) { .ls-learn-controls button { min-height:44px; } }
@media(max-width:860px) { .ls>button,.ls summary,.ls-panel button { min-height:44px; } }