*{box-sizing:border-box}body{margin:0;background:#071421;color:#e9f2fb;font:15px/1.5 'Segoe UI',Arial,sans-serif}a{color:#55b1ff;text-decoration:none}header{padding:18px max(24px,calc((100vw - 1200px)/2));background:#0b2033;border-bottom:1px solid #1e3d57;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}.brand{display:flex;gap:12px;align-items:center}.brand strong{font-size:19px;letter-spacing:1px}.brand em{font-style:normal;color:#1689ff}.brand small{display:block;color:#89a7bd;letter-spacing:2px}.logo{font-size:36px;color:#1689ff}nav{display:flex;gap:22px;flex-wrap:wrap}nav a{color:#bcd1e1}nav a:hover{color:white}main{max-width:1200px;margin:36px auto;padding:0 24px;min-height:65vh}.heading{display:flex;justify-content:space-between;align-items:center}h1{font-size:30px;margin:0}h2{margin:26px 0 12px;font-size:21px}h3{margin:0 0 4px}p,small{color:#91aabd}.panel{background:#10283c;border:1px solid #23445b;border-radius:14px;padding:23px;margin-bottom:16px}.narrow{max-width:450px;margin:60px auto}.stats,.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.cols{grid-template-columns:repeat(2,1fr)}.stats b{display:block;font-size:29px;margin-top:8px}.stats small{display:block}.chip{background:#193d57;color:#c4e6ff;padding:6px 12px;border-radius:40px}.device,.item{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.controls{display:flex;align-items:end;gap:8px;flex-wrap:wrap}form:not(.controls){display:flex;flex-direction:column;gap:13px}label{display:flex;flex-direction:column;gap:5px;color:#c3d9e9}input,select{border:1px solid #31516b;background:#071a2a;color:#fff;border-radius:7px;padding:10px;min-width:0}button{border:0;border-radius:7px;padding:11px 15px;background:#1689ff;color:white;cursor:pointer;font-weight:600}button:hover{filter:brightness(1.12)}button.secondary{background:#294b65}.danger{background:#9b3043}.volume input{width:85px}.alert{padding:13px;border-radius:9px;margin-bottom:16px}.error{background:#632d37}.success{background:#155a4a}.item small{display:block}footer{text-align:center;color:#6f8ca3;padding:25px;border-top:1px solid #17334a}@media(max-width:800px){.stats,.cols{grid-template-columns:1fr}header{padding:16px 24px}.device{align-items:stretch}.controls{width:100%}}
.website-actions{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.website-actions form{display:flex;gap:10px;align-items:end;flex-wrap:wrap}.website-actions button:disabled{opacity:.5;cursor:not-allowed}

.playlist-line{padding:10px 0;border-bottom:1px solid #23445b}.inline-actions{display:flex;gap:8px;align-items:end;flex-wrap:wrap;margin-top:12px}.inline-actions form{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.playlist-form{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));align-items:end;gap:12px;margin:15px 0}.playlist-form button{height:42px}input[type=checkbox]{width:auto;margin-right:8px}

/* v0.3.1 playlist controls */
.playlist-controls{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-top:16px}
.playlist-device-label{min-width:220px;max-width:360px;flex:1}
.playlist-controls .inline-actions{margin-top:0}
.playlist-controls .inline-actions form{display:flex;flex-direction:row;gap:8px}
.playlist-form .playlist-source[hidden]{display:none!important}
