:root{--navy:#0a1a4a;--royal:#1b46c9;--gold:#d9a21b;--bg:#f6f7fb;--ink:#0d1330;--mute:#5b6382}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.shell{max-width:1100px;margin:0 auto;padding:0 16px 150px}.top{padding:calc(env(safe-area-inset-top) + 8px) 0 0}.top img{height:64px;width:auto;display:block}.nav{display:flex;gap:4px;border-bottom:2px solid #e3e6f1;margin:8px 0 16px}.nav a{padding:10px 14px;color:var(--mute);text-decoration:none;font-weight:600;border-bottom:3px solid transparent;margin-bottom:-2px}.nav a.active{color:var(--navy);border-color:var(--gold)}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--royal);outline-offset:2px}h1{font-size:1.6rem;margin:8px 0;color:var(--navy)}.hero{font-size:2.4rem;line-height:1.1;letter-spacing:-.02em;margin:16px 0 4px}.lede{color:var(--mute);margin:0 0 20px;max-width:46ch}.sec h2{font-size:1.1rem;margin:20px 0 8px}.empty{border:1px dashed #b9bfd8;border-radius:10px;padding:14px 16px;color:var(--mute);background:#fff}.empty p{margin:2px 0 0}.empty strong{color:var(--navy)}.search{width:100%;padding:12px 14px;border:1px solid #b9bfd8;border-radius:10px;font-size:1rem;margin-bottom:12px}.row{display:block;width:100%;text-align:left;padding:12px;border:0;border-bottom:1px solid #e3e6f1;background:none;font:inherit;cursor:pointer}.row span{color:var(--mute);margin-left:8px}.mini{position:fixed;left:0;right:0;bottom:0;background:var(--navy);color:#fff;padding:10px 16px calc(env(safe-area-inset-bottom) + 10px);display:grid;gap:6px;grid-template-columns:1fr auto;border-top:2px solid var(--gold)}.meta{display:flex;flex-direction:column;min-width:0}.meta b,.meta span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meta span{font-size:.85rem;opacity:.8}.ctl{display:flex;gap:6px;align-items:center}.ctl button{background:none;border:0;color:#fff;font-size:1.3rem;min-width:44px;min-height:44px;cursor:pointer}.ctl .go{background:var(--gold);color:var(--navy);border-radius:50%}.bar{grid-column:1/-1;display:flex;gap:8px;align-items:center;font-size:.8rem}.bar input{flex:1;accent-color:var(--gold)}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.mini .meta{background:none;border:0;color:#fff;text-align:left;font:inherit;cursor:pointer;padding:0}.ctl button.on{color:var(--gold)}.ctl.big{justify-content:center;gap:14px;margin:8px 0}.ctl.big .go{width:64px;height:64px;font-size:1.6rem}.err{background:#fde8e8;color:#8a1111;border-radius:8px;padding:8px 12px;margin:8px 0}.err button,.qhead button,.songs button:not(.qt),.cta{border:1px solid var(--gold);background:#fff;color:var(--navy);border-radius:8px;padding:8px 12px;min-height:40px;cursor:pointer;font:inherit}.note{color:var(--mute);font-size:.85rem;margin:4px 0}.cta{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important;margin:6px 0}.songs,.queue{list-style:none;padding:0;margin:8px 0}.songs li,.queue li{display:flex;gap:6px;align-items:center;border-bottom:1px solid #e3e6f1;padding:6px 0}.qt{flex:1;min-width:0;text-align:left;background:none;border:0;font:inherit;cursor:pointer;display:flex;flex-direction:column;padding:6px 0}.qt span{color:var(--mute);font-size:.85rem}.np{position:fixed;inset:0;z-index:50;background:var(--navy);color:#fff;overflow-y:auto;padding:env(safe-area-inset-top) 16px env(safe-area-inset-bottom)}.np-in{max-width:520px;margin:0 auto;padding:12px 0 32px}.np .close{background:none;border:0;color:#fff;font:inherit;min-height:44px;cursor:pointer}.np .art{display:block;width:min(70vw,300px);aspect-ratio:1;object-fit:cover;border-radius:24px;margin:8px auto 16px}.np h2{margin:0;text-align:center;font-size:1.4rem}.np .who{text-align:center;opacity:.8;margin:2px 0 8px}.np .ctl button{color:#fff}.np .ctl .go{color:var(--navy)}.np .note{color:#c5cdf0}.np .bar{margin:8px 0}.vol{display:flex;gap:8px;align-items:center}.vol input{flex:1;accent-color:var(--gold)}.vol button{background:none;border:0;color:#fff;font-size:1.3rem;min-width:44px;min-height:44px;cursor:pointer}.qhead{display:flex;justify-content:space-between;align-items:center;margin-top:16px}.qhead h3{margin:0}.queue li{border-color:#2a3a78}.queue li.now{background:#16286b;border-radius:8px;padding-left:8px}.queue .qt{color:#fff}.queue .qt span{color:#c5cdf0}.queue li>button:not(.qt){background:none;border:0;color:#fff;min-width:40px;min-height:40px;cursor:pointer}.queue li>button:disabled{opacity:.3;cursor:default}.np .err{background:#fde8e8}@media(min-width:700px){.mini{grid-template-columns:1fr auto 1.2fr;align-items:center}.mini .bar{grid-column:auto}}.nav .acct{margin-left:auto}.authbox{max-width:420px;margin:0 auto}.authbox form{display:grid;gap:12px}.authbox label{display:grid;gap:4px;font-weight:600;color:var(--navy)}.authbox input{padding:12px 14px;border:1px solid #b9bfd8;border-radius:10px;font:inherit}.authbox button:not(.cta){background:none;border:1px solid var(--gold);border-radius:8px;padding:8px 12px;color:var(--navy);cursor:pointer;font:inherit}.authbox a,.empty+p a{color:var(--royal)}.ok{background:#e6f6ea;color:#14532d;border-radius:8px;padding:8px 12px;margin:0}a.cta{display:inline-block;text-decoration:none;padding:10px 16px;border-radius:8px}.cta:disabled{opacity:.5;cursor:default}
