:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#071015;color:#edf6fa;--cyan:#27d9ff;--blue:#0781b7;--panel:#101b22;--metal1:#56626c;--metal2:#141d24;--line:#4c7181;--green:#38e977}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(ellipse at 50% 0,#173744,#071015 56%)}button,input{font:inherit}.console{min-height:100vh;padding:clamp(12px,2vw,32px);display:grid;grid-template-rows:auto auto auto 1fr auto;gap:clamp(10px,1.3vw,20px);background:linear-gradient(135deg,#111b22bb,#03090d)}.topbar,.now-playing,.deck,.playlist-panel,.remote-help{border:1px solid #66808b;border-radius:8px;background:linear-gradient(145deg,#29333a,#071015 55%,#1b2931);box-shadow:inset 0 1px #a7b8bd55,0 6px 20px #0008}.topbar{min-height:clamp(52px,6vw,78px);padding:0 clamp(16px,2.3vw,34px);display:flex;align-items:center;justify-content:space-between;border-radius:7px;background:repeating-linear-gradient(0deg,#313d43 0 2px,#111a20 2px 5px)}.brand{display:flex;align-items:center;gap:14px;letter-spacing:.13em;font-size:clamp(18px,2vw,31px);text-shadow:0 2px #000}.infinity{font-size:1.45em;color:#d9f2ff;line-height:1}.connection{display:flex;align-items:center;gap:10px;color:#cfe4eb;font-weight:800;letter-spacing:.06em;font-size:clamp(11px,1.1vw,17px)}.connection i{width:11px;height:11px;border-radius:50%;background:#a4b4bc;box-shadow:0 0 8px #a4b4bc}.connection.online i{background:var(--green);box-shadow:0 0 15px var(--green)}.now-playing{padding:clamp(12px,1.5vw,24px);display:grid;grid-template-columns:clamp(125px,15vw,225px) 1fr auto;gap:clamp(14px,2vw,30px);align-items:center}.cover{width:100%;aspect-ratio:1;object-fit:cover;border:3px solid #829aa5;border-radius:5px;box-shadow:inset 0 0 0 4px #03070a,0 4px 18px #000b}.cover.fallback{display:grid;place-items:center;border:3px solid #829aa5;border-radius:5px;aspect-ratio:1;font-size:clamp(52px,8vw,105px);color:#28d9ff;background:radial-gradient(circle,#0d4456,#02070b);text-shadow:0 0 16px #0ff}.track-info{min-width:0}.eyebrow{margin:0 0 8px;color:#9dd5e8;letter-spacing:.1em;font-size:clamp(11px,1.05vw,16px);font-weight:800}.track-info h1{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#7eeaff;font-family:Consolas,monospace;font-size:clamp(22px,3.15vw,51px);letter-spacing:.01em;text-shadow:0 0 8px #0b9ab999}.meta{margin:7px 0 18px;color:#d4e0e5;font-size:clamp(14px,1.45vw,23px)}.progress-area{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(9px,1.2vw,18px);align-items:center;font-family:Consolas,monospace;color:#ccf5ff;font-size:clamp(14px,1.5vw,25px);font-weight:bold}.progress-area input,.volume input{accent-color:var(--cyan);width:100%}.meter{display:grid;grid-template-columns:repeat(2,7px);align-content:end;gap:4px;height:clamp(100px,14vw,170px);padding:12px;background:#03080a;border:2px solid #728690}.meter span{height:var(--h);background:linear-gradient(#ff4b3e 0 18%,#ffe445 18% 35%,#61ef48 35%);box-shadow:0 0 5px #4aff64}.meter span:nth-child(1){--h:25%}.meter span:nth-child(2){--h:35%}.meter span:nth-child(3){--h:44%}.meter span:nth-child(4){--h:57%}.meter span:nth-child(5){--h:68%}.meter span:nth-child(6){--h:52%}.meter span:nth-child(7){--h:76%}.meter span:nth-child(8){--h:62%}.deck{display:flex;align-items:stretch;justify-content:center;gap:clamp(5px,1vw,16px);padding:clamp(9px,1.2vw,16px);flex-wrap:wrap}.control{min-width:clamp(64px,7vw,116px);min-height:clamp(58px,7vw,102px);padding:7px 9px;display:grid;place-items:center;gap:3px;border:2px solid #748692;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fbffff,#8a969d 37%,#253039 47%,#0d1419 70%);color:#0a1116;font-size:clamp(18px,2.3vw,34px);font-weight:900;box-shadow:inset 0 2px #fff9,0 4px 8px #000a;cursor:pointer}.control span{font-size:clamp(8px,.77vw,11px);color:#e6f4f8;text-shadow:0 1px #000;letter-spacing:.05em}.control:focus-visible,.playlist-panel li:focus-visible{outline:4px solid #fff;outline-offset:3px}.control:disabled{opacity:.34;cursor:default}.control.primary{border-color:#60ecff;box-shadow:inset 0 2px #fff9,0 0 13px #0edfff99}.control.utility,.control.mode{border-radius:8px;background:linear-gradient(#2e3e47,#10181e);color:#adf1ff}.control.mode[aria-pressed=true]{background:linear-gradient(#19a4b4,#07515f);border-color:#adffff}.volume{min-width:min(230px,30vw);padding:0 13px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;background:#050a0d;border:1px solid #5b717d;color:#ccedf6;font-weight:bold}.volume output{font-family:Consolas,monospace}.playlist-panel{min-height:0;overflow:auto;background:#03090d}.playlist-panel header{padding:clamp(10px,1.1vw,17px) clamp(13px,1.7vw,25px);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #638292;background:linear-gradient(#2b353d,#10191f)}.playlist-panel h2{display:inline;margin:0 0 0 10px;font-size:clamp(14px,1.5vw,23px);letter-spacing:.06em}.deck-tag{font:700 clamp(11px,1.15vw,17px) Consolas,monospace;color:#a3f2ff}.playlist-panel header>span{font:700 clamp(11px,1.1vw,16px) Consolas,monospace;color:#a3f2ff}ol{margin:0;padding:0;list-style:none}li{display:grid;grid-template-columns:clamp(40px,4vw,72px) 1fr auto;gap:12px;align-items:center;padding:clamp(9px,1.15vw,16px) clamp(13px,1.7vw,25px);border-bottom:1px solid #1e3742;color:#e9f3f5;cursor:pointer;font-size:clamp(14px,1.55vw,24px)}li:hover,li:focus{background:#14303a}li.active{color:#e9ffff;background:linear-gradient(90deg,#087d8b,#0ca4b640,#0b333e);box-shadow:inset 5px 0 #39edff}.number,.duration{font:700 .86em Consolas,monospace;color:#9ddced}.duration{color:#fff}#empty{padding:clamp(30px,7vw,100px);text-align:center;color:#b4c9d2;font-size:clamp(16px,1.6vw,24px)}.remote-help{padding:clamp(11px,1.3vw,19px);display:flex;justify-content:space-around;gap:15px;flex-wrap:wrap;color:#d7edf2;font-size:clamp(10px,1.15vw,18px);font-weight:700;letter-spacing:.05em;background:linear-gradient(#233039,#080f14)}dialog{border:1px solid #7a97a4;border-radius:12px;max-width:min(560px,90vw);padding:0;background:#0e1a20;color:#eef7fb;box-shadow:0 20px 60px #000c}dialog::backdrop{background:#000b}dialog form{position:relative;padding:clamp(24px,3vw,40px);display:grid;gap:14px}dialog h2{margin:0;font-size:clamp(23px,3vw,35px)}dialog p{line-height:1.45;color:#c8dce3}dialog label{display:grid;gap:7px;font-weight:700;color:#b6dce7}dialog input[type=text],dialog input:not([type]){color:#071015;background:#eef8fb;border:2px solid #5c8797;border-radius:6px;padding:14px;font-size:21px;letter-spacing:.08em}.dialog-close{position:absolute;top:10px;right:12px;color:#d4e7ed;background:transparent;border:0;font-size:28px;cursor:pointer}.pair-submit,.secondary,.danger{padding:14px;border-radius:7px;border:1px solid #78a6b5;background:#0d9aac;color:#fff;font-weight:900;letter-spacing:.06em;cursor:pointer}.secondary{background:#253a44}.danger{background:#722d31}.error{min-height:1.2em;margin:0;color:#ff9696!important}.toggle{display:flex;grid-template-columns:auto 1fr;align-items:center;gap:10px}.toggle input{width:22px;height:22px;accent-color:#14c9e4}@media(max-width:760px){.now-playing{grid-template-columns:100px 1fr}.meter{display:none}.deck{justify-content:space-around}.volume{order:3;width:100%;min-width:0}.control{min-width:64px}.track-info h1{white-space:normal}.remote-help span:nth-last-child(-n+2){display:none}}@media(max-width:480px){.now-playing{grid-template-columns:1fr}.cover{width:120px}.control span{display:none}.deck{gap:8px}.control{min-height:56px}.playlist-panel header{align-items:flex-start;gap:8px;flex-direction:column}}body.large-text li{font-size:clamp(18px,2vw,31px)}body.large-text .track-info h1{font-size:clamp(28px,3.8vw,61px)}