:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#101723;color:#edf2f7}*{box-sizing:border-box}body{max-width:980px;margin:0 auto;padding:1rem 1rem 4rem;line-height:1.5}a{color:#8de0ef}header,.row,nav{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}header{justify-content:space-between;border-bottom:1px solid #384b62;padding-bottom:.8rem}nav a{padding:.35rem}h1,h2{overflow-wrap:anywhere}h1{font-size:clamp(1.6rem,5vw,2.4rem)}.card,form.card{background:#1e2b3c;border:1px solid #334861;border-radius:16px;padding:clamp(1rem,3vw,1.5rem);margin:1.2rem 0;box-shadow:0 5px 22px #080c1666}.muted,small{color:#b4c6d3}.notice{min-height:1.6em;white-space:pre-wrap;overflow-wrap:anywhere}.error{color:#ffbdb6}label{display:block;margin:.85rem 0}input,select,textarea,button{font:inherit;background:#293c54;color:inherit;border:1px solid #7890a5;border-radius:8px;padding:.65rem;max-width:100%}input:not([type=checkbox]),select,textarea{display:block;width:100%;margin-top:.3rem}textarea{min-height:6rem;resize:vertical}button{cursor:pointer}button:hover{background:#395675}button:disabled{opacity:.5;cursor:not-allowed}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #72d9ec;outline-offset:2px}.row>button{flex:0 0 auto}ul{padding-left:1.3rem}li{padding:.7rem 0;border-bottom:1px solid #35445a;overflow-wrap:anywhere}li .row{margin-top:.5rem}pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#101723;padding:1rem;border-radius:8px;max-height:24rem;overflow:auto}.hidden,[hidden]{display:none!important}.pill{display:inline-block;background:#334e61;border-radius:1rem;padding:.1rem .6rem;margin:.2rem}.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:1rem}.split>.card{margin:0}.title-wrap{min-width:0;overflow-wrap:anywhere;word-break:break-word}.compact{max-width:580px}a[role=button]{display:inline-block;background:#293c54;color:#edf2f7;border:1px solid #7890a5;border-radius:8px;padding:.65rem;text-decoration:none}a[role=button]:hover{background:#395675}
/* Persistent media dock and same-origin content pane. */
.shell{max-width:1100px;padding-bottom:calc(var(--dock-height, 300px) + 1.5rem)}
.shell #player{position:fixed;z-index:20;bottom:0;left:0;right:0;margin:0;border-radius:16px 16px 0 0;padding:.7rem max(1rem,calc((100vw - 1050px)/2));max-height:65vh;overflow:auto;box-shadow:0 -8px 32px #080c16dd}
.shell #player .logo{width:48px;height:48px}.shell #player .track-info h2{font-size:1rem;margin:0}.shell #player .track-info p{margin:0}.shell #player .seekbox{margin:0}.shell #player .legend{display:none}
.shell #section-pane{min-height:55vh}.shell #section-frame{display:block;border:0;width:100%;min-height:75vh;background:#101723}
.shell #section-pane.modal-active{position:fixed;z-index:40;inset:0;background:#101723}.shell #section-pane.modal-active #section-frame{height:100vh;min-height:100vh}
.shell .site-nav a{white-space:nowrap}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.embedded body{max-width:none;padding:0 1rem 2rem}.embedded header{display:none}.embedded main{max-width:980px;margin:auto}
.user-list{list-style:none;padding:0;display:grid;gap:.7rem}.user-list li{display:flex;justify-content:space-between;align-items:center;gap:1rem;background:#24374b;border:1px solid #415670;border-radius:12px;padding:1rem;min-width:0}.user-list li>div{min-width:0;overflow-wrap:anywhere}.user-list strong,.user-list small{display:block}
.user-dialog{background:#1e2b3c;color:#edf2f7;border:1px solid #7890a5;border-radius:16px;width:min(95vw,530px);max-height:58vh;overflow:auto;padding:1.5rem;box-shadow:0 15px 50px #080c16;position:fixed;top:1rem;bottom:auto;margin:0 auto}.user-dialog::backdrop{background:#080c16cc}.user-dialog .row{justify-content:flex-end}
.cleanup{border-top:1px solid #415670;margin-top:1.3rem;padding-top:1rem}.cleanup h3{margin-top:0}.cleanup #cleanup-sample{max-height:15rem;overflow:auto;overflow-wrap:anywhere}.danger-note{color:#ffccba;font-weight:600}.danger-button{border-color:#ffb3a4;background:#793035;color:#fff}.danger-button:hover:not(:disabled){background:#a23b42}.user-dialog input[type=checkbox]{width:auto;display:inline;margin-right:.4rem}
/* Bootstrap supplies the grid, responsive navigation and dark controls; preserve the radio palette. */
html[data-bs-theme=dark]{--bs-body-bg:#101723;--bs-body-color:#edf2f7;--bs-secondary-color:#b4c6d3;--bs-link-color:#8de0ef;--bs-link-hover-color:#b1f1fc}
body.container-xl,body.shell.container-xl{max-width:1100px;margin:0 auto;padding:1rem 1rem 4rem}
body.shell.container-xl{padding-bottom:calc(var(--dock-height, 300px) + 1.5rem)}
header.navbar{border-bottom:1px solid #384b62;padding-bottom:.8rem;justify-content:space-between}
header.navbar .navbar-brand{color:#edf2f7;font-size:clamp(1.6rem,5vw,2.4rem)}
header.navbar .container-fluid{padding:0}
header.navbar nav.site-nav{flex-grow:0;overflow:visible}
header.navbar .nav-link{color:#8de0ef;padding:.35rem .55rem}
header.navbar .nav-link:hover,header.navbar .nav-link[aria-current=page]{color:#edf2f7}
.navbar-toggler{width:auto}.shell .navbar-nav{gap:.25rem}
.embedded body.container-xl{max-width:none;padding:0 1rem 2rem}
.row{margin:0}.row>*{width:auto;padding:0}
.shell .controls{display:flex;gap:.7rem;align-items:center;flex-wrap:wrap}.shell .controls label{display:inline-flex;gap:.5rem;align-items:center;margin:.2rem 0}.shell .controls select{width:auto;margin:0}
.shell .status{min-height:1.6em}.shell .seekbox{position:relative;height:42px;margin:.4rem 0;touch-action:pan-y}
.shell .seekmap{position:absolute;inset:9px 0;width:100%;height:24px;border-radius:12px;background:#111c2b;overflow:hidden;pointer-events:none}
.seekmap rect{fill:#52748b}.seekmap .buffer{fill:#439db0}.seekmap .played{fill:#7bdeef}.seekmap .unsafe{fill:#101723aa}.seekmap .tick{fill:#e6edf4}
#seek{position:absolute;inset:0;width:100%;height:42px;margin:0;background:transparent;appearance:none;-webkit-appearance:none;cursor:pointer;touch-action:pan-y}
#seek::-webkit-slider-runnable-track{height:42px;background:transparent}#seek::-moz-range-track{height:42px;background:transparent}
#seek::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:22px;height:22px;margin-top:10px;border:3px solid #efffff;border-radius:50%;background:#1a889d;box-shadow:0 0 0 3px #132434}
#seek::-moz-range-thumb{width:16px;height:16px;border:3px solid #efffff;border-radius:50%;background:#1a889d;box-shadow:0 0 0 3px #132434}
#seek:disabled{cursor:not-allowed;opacity:.65}.legend{display:flex;flex-wrap:wrap;gap:.35rem 1rem;font-size:.83rem;color:#b8cbd8;margin:.5rem 0}
.legend span::before{content:'';display:inline-block;width:.8em;height:.8em;margin-right:.4em;border-radius:2px;background:var(--swatch)}
.timeline{display:flex;justify-content:space-between;gap:.6rem;font-variant-numeric:tabular-nums}.tracks{max-height:420px;overflow:auto}.tracks li button{border:0;background:none;text-align:left;padding:0;color:inherit;max-width:100%;overflow-wrap:anywhere;word-break:break-word}.tracks li button:hover{text-decoration:underline}.tracks li.active{color:#7bdeef}
.track-info{display:flex;align-items:center;gap:1rem;min-width:0}.track-info>div{min-width:0;flex:1}.track-info h2,.track-info p{overflow-wrap:anywhere;word-break:break-word;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}.track-info p{-webkit-line-clamp:2;line-clamp:2}.logo{width:76px;height:76px;object-fit:contain;background:#101723;border-radius:12px;flex:none}
@media(max-width:767.98px){header.navbar .site-nav{order:3;width:100%;flex-basis:100%}header.navbar .navbar-nav{align-items:stretch!important}.shell #player{max-height:68vh;padding:.6rem 1rem}.shell #player .controls{gap:.35rem}.shell #player .controls button,.shell #player .controls select{padding:.4rem}.shell #player .status{margin:.2rem 0}.shell #player .timeline{font-size:.75rem}}
/* Keep forms above the media dock (including mobile browser safe areas). */
body.shell.container-xl{padding-bottom:calc(var(--dock-height, 300px) + env(safe-area-inset-bottom, 0px) + 2rem)}
.shell #player{padding-bottom:calc(.7rem + env(safe-area-inset-bottom, 0px))}
.shell #player .dock-head{display:flex;justify-content:flex-end;margin-bottom:.25rem}
.shell #player .dock-head button{padding:.2rem .6rem;font-size:.85rem}
.shell #player.collapsed #dock-details{display:none}
.shell #player.collapsed{max-height:40vh}
.shell #section-frame{min-height:calc(100vh - var(--dock-height, 160px) - 8rem)}
.player-toast{position:fixed;z-index:60;top:1rem;left:50%;transform:translateX(-50%);width:max-content;max-width:min(90vw,560px);padding:.7rem 1rem;background:#293c54;color:#edf2f7;border:1px solid #8de0ef;border-radius:12px;box-shadow:0 8px 32px #080c16dd;overflow-wrap:anywhere;pointer-events:none}
.player-toast.error{background:#512a32;color:#ffdfd9;border-color:#ffbdb6}
@media(max-width:767.98px){.shell #player.collapsed{max-height:35vh}.shell #player.collapsed .track-info{display:none}.shell #player.collapsed .controls label{display:none}.shell #player.collapsed .dock-head{margin:0}.shell #player.collapsed .controls{flex-wrap:wrap}.shell #player.collapsed .controls button{white-space:nowrap}}
/* Give dock actions breathing room without pushing them off the mobile viewport. */
.shell #player{display:flex;flex-direction:column;gap:.65rem;padding-top:1rem;padding-bottom:calc(1rem + env(safe-area-inset-bottom, 0px))}
.shell #player .dock-head{margin:0}
.shell #player .controls{display:flex;gap:.65rem 1rem;padding:.25rem 0;min-width:0}
.shell #player #dock-details{min-width:0}
.player-toast{max-height:40vh;overflow:auto;pointer-events:auto}
@media(max-width:767.98px){.shell #player{gap:.45rem;padding:.7rem .85rem calc(.8rem + env(safe-area-inset-bottom, 0px))}.shell #player .controls{gap:.45rem;padding:.3rem 0}.shell #player .controls button{flex:1 1 auto}.shell #player.collapsed .controls button{flex:1 1 auto}.player-toast{top:calc(.5rem + env(safe-area-inset-top, 0px));max-width:calc(100vw - 2rem)}}