/* Music-region dimensions and typography from the user-provided Cherri snapshot.
   Keep Wave navigation/branding and all existing controls; shift pink palette to blue. */
@font-face{font-family:WaveMusicReference;src:url('./reference-google-sans.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
body{--accent:#6bbbff;--base:#050b12;--surface:#09121e;--raised:#101f30;--muted:#8b9fb4;--text:#f1f7ff;--border:#c8e5ff0d;background:var(--base);color:var(--text)}
.layout,main,.pane-header,.layout>aside,.player,dialog,.track-menu{font-family:WaveMusicReference,'Segoe UI',sans-serif}
.layout,body.sidebar-collapsed .layout{grid-template-columns:256px minmax(0,1fr);background:var(--base)}
.layout>aside,.has-track .layout>aside{display:flex;flex-direction:column;padding:24px 12px 72px;background:#070f19;border-right:1px solid var(--border);position:relative;overflow:auto}
.music-heading{padding:0 12px;margin:0 0 24px}.music-heading>span{display:none}.music-heading .music-label{font-size:20px;line-height:28px;font-weight:700;letter-spacing:-.5px;margin:0;color:var(--text)}
.side{height:40px;min-height:40px;padding:0 12px;gap:12px;margin:0 0 4px;border-radius:12px;font-size:14px;font-weight:500;color:var(--muted)}
.side.active{background:#102033;color:var(--text);box-shadow:none}.side:hover{background:#0c1929;color:var(--text)}
.side .icon{width:18px;height:18px;flex:0 0 18px;stroke-width:2}
.side-heading{font-size:12px;line-height:16px;letter-spacing:0;font-weight:600;margin:24px 12px 8px;color:var(--muted)}
.playlist-row>.side{height:40px}.playlist-more{padding:6px;color:var(--muted)}
.playlist-create{margin:0;padding:32px 12px;text-align:center}.playlist-create p{font-size:12px;line-height:16px;margin:0 0 12px}.playlist-create button{height:32px;background:var(--accent);border:0;border-radius:12px;color:#030b13;font-size:12px;padding:0 12px;gap:6px;font-weight:500}.playlist-create button:hover{background:#8acaff;color:#030b13}.playlist-create .icon{width:12px;height:12px;flex-basis:12px}
#shortcuts-button{position:absolute;inset:auto 0 0;width:100%;height:61px;margin:0;padding:12px 24px;display:flex;align-items:center;gap:12px;border:0;border-top:1px solid var(--border);border-radius:0;background:#070f19;font-size:14px;line-height:20px;color:var(--muted)}
#shortcuts-button:hover{background:#0c1929;color:var(--text)}#shortcuts-button .icon{width:16px;height:16px;flex:0 0 16px;margin:0;stroke-width:2}#shortcuts-button span{padding:0}
.pane-header{height:64px;padding:0 24px;border-color:var(--border);background:#050b12f2;backdrop-filter:blur(10px)}.pane-header h2{font-size:16px;line-height:24px;font-weight:700;letter-spacing:0}
.pane-header #spotify-source{height:32px!important;background:transparent!important;border:1px solid var(--border)!important;color:var(--muted)!important;border-radius:12px!important;font-size:11px!important;padding:0 12px!important}.pane-header #connect{background:transparent;border:0;color:var(--muted)}
.pane-content{max-width:none;padding:24px 24px 40px;margin:0}#hero{display:none!important}.search-status{font-size:11px;line-height:16px;margin:0 0 20px;color:var(--muted)}
.music-row{margin-bottom:32px}.row-heading{margin:0 0 12px}.row-heading h3,.section-title h2{font-size:14px;line-height:20px;font-weight:600;letter-spacing:0;color:var(--text)}.row-heading h3{display:flex;align-items:center;gap:8px}.row-heading h3:before{content:'';display:block;width:13px;height:13px;background:var(--muted);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Cpath d='M6 12c0-1.7.7-3.2 1.8-4.2M18 12c0 1.7-.7 3.2-1.8 4.2'/%3E%3C/svg%3E") center/contain no-repeat}
.row-heading>div{gap:4px}.row-heading button{width:24px;height:24px;border-radius:12px;border:1px solid var(--border);background:#070f19;color:var(--muted)}.row-heading button .icon{width:12px;height:12px}.row-heading button:hover{background:#101f30;border-color:#c8e5ff24;color:var(--text)}
.album-rail{grid-auto-columns:176px;gap:12px;padding:4px 0 8px;scrollbar-width:thin;scrollbar-color:#c8e5ff24 transparent;scroll-padding-inline:0}.album-rail::-webkit-scrollbar{display:block;height:4px}.album-rail::-webkit-scrollbar-thumb{background:#c8e5ff24;border-radius:4px}
.album-rail .cover{border-radius:12px;border:1px solid var(--border);background:#0c1929}.album-rail .track-text{margin:10px 2px 0}.album-rail .card:hover{transform:none}.album-rail .card:hover .cover{border-color:#c8e5ff38}.album-rail .card h3{font-size:14px;font-weight:500;line-height:20px;margin:0;letter-spacing:0}.album-rail .card p{font-size:12px;line-height:16px;color:var(--muted);margin:2px 0 0}.cover img{transition:filter .18s ease}.cover:hover img{filter:brightness(.8)}.cover:after{background-color:var(--accent);width:40px;height:40px;box-shadow:0 4px 12px #0005}
.cards .card{border-radius:12px;height:56px}.cards .card h3{font-size:14px;line-height:20px}.cards .card p{font-size:12px;line-height:16px}.cards .cover{border-radius:8px}.cards .card:hover,.cards .card.playing{background:#0c1929}
.search{height:40px;min-height:40px;border-radius:12px;background:#09121e;border-color:var(--border)}.search:focus-within{outline:1px solid #6bbbff70;box-shadow:none!important}.search input{font-size:14px}.bottom-note{font-size:10px;border-color:var(--border);color:var(--muted);margin-top:24px}
.player{left:256px;height:72px;background:#070f19;border-color:var(--border);padding:10px 20px}.has-track main,.has-track .layout>aside{height:calc(100% - 72px)}.controls .play{width:36px;height:36px;background:var(--accent)}.now img{width:42px;height:42px;border-radius:8px}.now strong{font-size:14px;line-height:20px}.now span{font-size:12px;line-height:16px}#seek{accent-color:var(--accent)}
dialog,.track-menu{background:#09121e;border-color:#c8e5ff24}.track-menu button:hover{background:#101f30}.dialog-actions .primary{background:var(--accent);color:#030b13}
@media(max-width:1000px) and (min-width:651px){.layout,body.sidebar-collapsed .layout{grid-template-columns:220px minmax(0,1fr)}.player{left:220px}.album-rail{grid-auto-columns:160px}.pane-content{padding:24px 20px}}
@media(max-width:650px){.layout,body.sidebar-collapsed .layout{display:flex}.layout>aside,.has-track .layout>aside{position:relative;display:flex;flex-direction:row;padding:10px 12px;border-bottom:1px solid var(--border);height:auto}.music-heading,.side-heading,#shortcuts-button{display:none}.side{height:40px;margin:0;font-size:13px}.side.active{background:#102033;border:0}.playlist-create{padding:0;text-align:left}.playlist-create button{height:36px}.pane-header{height:60px;padding:0 16px}.pane-content{padding:20px 16px 32px}.album-rail{grid-auto-columns:152px;gap:12px}.row-heading h3{font-size:14px}.player{left:0;height:calc(72px + env(safe-area-inset-bottom,0px));padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))}.has-track main{height:auto;margin-bottom:calc(72px + env(safe-area-inset-bottom,0px))}.has-track .layout>aside{height:auto}.search input{font-size:16px}.cards .card h3{font-size:13px}.bottom-note{font-size:10px}}
@media(prefers-reduced-motion:reduce){.cover img{transition:none}.pane-header{backdrop-filter:none}}

/* Song display: mirror the reference card anatomy and SVG control treatment. */
.row-heading h3:before{display:none}.section-symbol{display:inline-flex;color:var(--muted)}.section-symbol .icon{width:13px;height:13px;flex:0 0 13px;stroke-width:2}
.row-heading button{display:grid;place-items:center;padding:0}.row-heading button:disabled{opacity:.5;cursor:default;pointer-events:none}
.album-rail{scrollbar-width:none;gap:12px;padding-top:4px;padding-bottom:8px;scroll-behavior:smooth}.album-rail::-webkit-scrollbar{display:none}
.album-rail .card{width:176px;cursor:pointer;scroll-snap-align:start}.album-rail .cover{width:176px;height:176px;aspect-ratio:1;border-radius:12px;border:1px solid #c8e5ff0d;transition:border-color .15s}
.album-rail .card:hover .cover{border-color:#c8e5ff24}.album-rail .track-text{margin:10px 2px 0}.album-rail .track-text h3{font-size:14px;line-height:20px;font-weight:500;letter-spacing:0}.album-rail .track-text p{font-size:12px;line-height:16px;font-weight:400;margin-top:2px;color:var(--muted)}
.album-rail .cover:before{content:'';position:absolute;inset:0;background:#0006;opacity:0;transition:opacity .15s;z-index:1}.album-rail .cover:after{content:'';width:44px;height:44px;border-radius:50%;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z' fill='%23030b13'/%3E%3C/svg%3E") 52% 50%/14px 14px no-repeat;box-shadow:0 10px 15px -3px #0004;opacity:0;z-index:2;transition:opacity .15s}
.album-rail .card:hover .cover:before,.album-rail .card:focus-within .cover:before,.album-rail .card:hover .cover:after,.album-rail .card:focus-within .cover:after{opacity:1}.album-rail .cover:hover img{filter:none}
.album-rail .track-more{display:grid;place-items:center;position:absolute;right:8px;top:8px;width:28px;height:28px;padding:0;border-radius:12px;background:#000b;border:1px solid #ffffff1a;color:#fffc;z-index:3;letter-spacing:0;transition:opacity .15s,color .15s}.track-more .icon{width:12px;height:12px;flex:0 0 12px;stroke-width:2}.album-rail .track-more:hover{color:white}.album-rail .card:hover .track-more{backdrop-filter:blur(4px)}
.cards .track-more{display:grid;place-items:center}.cards .card h3{margin:0}.cards .cover:after{box-shadow:none}.controls .play .icon{fill:currentColor;stroke-width:0}
.track-menu{border-radius:12px;background:#09121e;padding:6px;border:1px solid #c8e5ff24;box-shadow:0 12px 35px #0005}.track-menu button{height:36px;border-radius:8px;font-size:12px;color:var(--text)}.track-menu button:hover{background:#101f30}
@media(max-width:650px){.album-rail{grid-auto-columns:160px}.album-rail .card,.album-rail .cover{width:160px}.album-rail .cover{height:160px}.album-rail .track-more{opacity:1}}
@media(prefers-reduced-motion:reduce){.album-rail{scroll-behavior:auto}.album-rail .cover:before,.album-rail .cover:after{transition:none}}