:root{color:#def2fb;background:#020b12;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:#020b12;min-width:320px;margin:0}button,input{font:inherit}button{cursor:pointer}.app-shell{grid-template-rows:auto 1fr auto;gap:14px;width:min(1280px,100% - 32px);min-height:100vh;margin:auto;display:grid}.header{align-items:center;gap:14px;min-height:110px;padding:8px 2px;display:flex}.brand{color:#dff5ff;background:0 0;border:0;align-items:center;gap:7px;margin-right:auto;padding:0;font-size:1.15rem;display:flex}.brand-logo{object-fit:contain;width:76px;height:96px}.navigation{gap:8px;display:flex}.round-button{color:#e5f5fb;background:#102433;border:0;border-radius:50%;width:48px;height:48px;font-size:2.1rem;line-height:1}.home-button{font-size:1.7rem}.shuffle-button{place-items:center;display:grid}.shuffle-button svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.2px;width:23px;height:23px}.shuffle-button.is-active{color:#102433;background:#e5f5fb}.search{background:#102433;border-radius:26px;width:min(520px,52vw);display:flex;overflow:hidden}.search input{color:#eaf7fc;background:0 0;border:0;outline:0;width:100%;min-width:0;padding:11px 18px;font-size:1.2rem}.search input::placeholder{color:#d8e8ef;opacity:1}.search button{color:#effbff;background:0 0;border:0;width:60px;font-size:2.5rem;line-height:1}main{background:#0d2331;border-radius:8px;min-height:620px;padding:32px 26px;overflow:hidden}.album-grid{grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:22px;display:grid}.album-card{aspect-ratio:1;text-align:left;background:#18394a;border:0;border-radius:2px;padding:0;transition:transform .18s,box-shadow .18s;position:relative;overflow:hidden}.album-card:hover,.album-card:focus-visible{outline:2px solid #48d2ff;transform:translateY(-4px);box-shadow:0 10px 30px #000a}.cover{object-fit:cover;background:#1d3d4e;width:100%;height:100%;display:block}.album-label{color:#fff;opacity:0;background:linear-gradient(#0000,#000d);gap:2px;padding:28px 10px 10px;transition:opacity .18s;display:grid;position:absolute;bottom:0;left:0;right:0}.album-card:hover .album-label,.album-card:focus-visible .album-label{opacity:1}.album-label small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.album-detail{min-height:620px;margin:-32px -26px}.album-hero{background-image:linear-gradient(90deg, #0d2331ec, #0d233188), var(--cover);background-position:50%;background-size:cover;align-items:end;gap:28px;min-height:292px;padding:34px 26px;display:flex}.hero-cover{flex:none;width:230px;height:230px;box-shadow:0 8px 30px #0009}.album-meta{text-shadow:0 2px 8px #000;padding-bottom:8px}.album-meta p{color:#d9f6ff;text-transform:uppercase;margin:0 0 8px;font-size:clamp(1.7rem,4vw,3rem);font-weight:800}.album-meta h1{max-width:800px;margin:0 0 8px;font-size:clamp(1.4rem,3vw,2.2rem);font-weight:500}.album-meta span{font-size:1.6rem}.track-list{margin:0;padding:24px 52px 48px 76px;font-size:1.25rem;line-height:2.2}.message,.empty{margin:0;padding:12px;font-size:1.1rem}.error{color:#ffb4b4}footer{color:#d1e8f1;text-align:center;padding:24px 0 34px;font-size:.9rem}.graphql-toggle{z-index:50;color:#03111a;background:#12c9f1;border:0;border-radius:999px;align-items:center;gap:10px;padding:15px 20px;font-size:1rem;font-weight:700;display:inline-flex;position:fixed;bottom:24px;right:24px;box-shadow:0 8px 24px #0008}.graphql-toggle svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;width:21px;height:21px}.graphql-toggle.is-open{bottom:calc(min(46vh,460px) + 20px)}.graphql-panel{z-index:40;color:#172a38;background:#edf1f4;height:min(46vh,460px);padding:24px 14px 14px;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -8px 24px #0006}.graphql-panel-tab{color:#254663;background:#fff;border-radius:8px 8px 0 0;padding:7px 18px;font-size:.9rem;position:absolute;top:0;left:16px}.graphql-panel-content{background:#fff;border-radius:8px;grid-template-columns:1fr 1fr;height:100%;display:grid;overflow:hidden}.graphql-pane{border-right:1px solid #cdd7df;grid-template-rows:auto 1fr;min-width:0;display:grid}.graphql-pane:last-child{border-right:0}.graphql-pane header{color:#2b5070;border-bottom:1px solid #dce4e9;justify-content:space-between;align-items:center;padding:10px 15px;font-size:.9rem;font-weight:700;display:flex}.graphql-pane small{color:#617486;font-size:.75rem;font-weight:500}.graphql-pane pre{color:#183d54;white-space:pre-wrap;background:#fbfdfe;min-width:0;margin:0;padding:18px;font:.88rem/1.55 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;overflow:auto}.graphql-response pre{color:#204f86}.graphql-inspector:has(.graphql-panel){display:contents}@media (width<=650px){.app-shell{width:min(100% - 20px,1280px)}.header{flex-wrap:wrap}.brand{margin-right:auto}.navigation{order:2}.search{order:3;width:100%}.album-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}main{padding:16px}.album-detail{margin:-16px}.album-hero{align-items:flex-start;gap:16px;min-height:0;padding:18px}.hero-cover{width:115px;height:115px}.album-meta p{font-size:1.2rem}.album-meta h1,.album-meta span{font-size:1.1rem}.track-list{padding:18px 30px 30px 46px;font-size:1.05rem;line-height:2}.graphql-toggle{padding:12px 15px;font-size:.9rem;bottom:12px;right:12px}.graphql-toggle.is-open{bottom:calc(min(62vh,540px) + 12px)}.graphql-panel{height:min(62vh,540px);padding:24px 8px 8px}.graphql-panel-content{grid-template-rows:1fr 1fr;grid-template-columns:1fr}.graphql-pane{border-bottom:1px solid #cdd7df;border-right:0}.graphql-pane:last-child{border-bottom:0}.graphql-pane pre{padding:12px;font-size:.76rem}}