@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500;600&family=IBM+Plex+Sans:wght@400;500;600;700&family=Newsreader:opsz,wght@6..72,500;6..72,600;6..72,700&display=swap";:root{--bg-canvas:#0f0f0d;--bg-surface:#171713;--bg-surface-2:#1d1c17;--bg-elevated:#29261e;--bg-overlay:#080806e0;--text-primary:#f3eadb;--text-secondary:#c9bca9;--text-muted:#918779;--accent-primary:#df6042;--accent-secondary:#b98b49;--accent-ink:#170f0a;--stroke-soft:#353129;--stroke-strong:#625646;--radius-sm:5px;--radius-md:8px;--radius-lg:12px;--control-sm:32px;--control-md:40px;--control-lg:44px;--shadow-sm:0 8px 20px #00000038;--shadow-md:0 16px 38px #00000047;--shadow-lg:0 28px 72px #0000006b;--font-display:"Newsreader", Georgia, serif;--font-body:"IBM Plex Sans", "Segoe UI", sans-serif;--font-label:"IBM Plex Mono", monospace;--motion-fast:.16s ease;--motion-med:.26s ease;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--bg-app:var(--bg-canvas);--bg-panel:var(--bg-surface-2);--bg-panel-2:var(--bg-surface);--bg-input:var(--bg-surface);--accent:var(--accent-primary);--accent-2:var(--accent-secondary);--accent-3:#e4c48d;--border-subtle:var(--stroke-soft);--border-strong:var(--stroke-strong);--panel-soft:var(--bg-surface);--panel-highlight:var(--bg-elevated);--ink:#0c0c0a;--transition-fast:var(--motion-fast);--transition-med:var(--motion-med)}*{box-sizing:border-box}html,body{background-color:var(--bg-canvas);min-height:100%;margin:0}body{font-family:var(--font-body);color:var(--text-primary);letter-spacing:.004em;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;background:linear-gradient(#14130f 0%,#0f0f0d 34rem,#0c0c0b 100%);min-height:100dvh;font-size:16.5px;line-height:1.45}body:before{content:"";z-index:-2;pointer-events:none;opacity:.34;background-image:linear-gradient(90deg,#0000 0,#f3eadb05 50%,#0000 100%);background-size:5px 100%;position:fixed;inset:0}.toast-host{top:max(14px, calc(10px + var(--safe-top)));right:max(14px, calc(10px + var(--safe-right)));z-index:1300;pointer-events:none;flex-direction:column;gap:.5rem;width:min(92vw,360px);display:flex;position:fixed}.toast{pointer-events:auto;border-radius:var(--radius-sm);border:1px solid var(--stroke-soft);color:var(--text-primary);cursor:pointer;background:#1d1c17fa;padding:.58rem .72rem .62rem;animation:.2s ease-out toastIn;box-shadow:0 14px 34px #00000061}.toast-title{letter-spacing:.1em;text-transform:uppercase;color:var(--accent-3);margin-bottom:.2rem;font-size:.66rem;font-weight:700}.toast-message{color:var(--text-primary);font-size:.84rem;line-height:1.36}.toast-success{background:linear-gradient(#14322cf2,#112421f2);border-color:#6ee7b773}.toast-warning{background:linear-gradient(#3d2c15f2,#271c0df2);border-color:#fbbf2473}.toast-error{background:linear-gradient(#401c29f2,#2c141ef2);border-color:#f8717173}.toast-hide{animation:.2s ease-in forwards toastOut}input,select,textarea,button{font:inherit}button,select,input,textarea{transition:border-color var(--motion-fast), box-shadow var(--motion-fast), background var(--motion-fast), color var(--motion-fast), transform var(--motion-fast)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:2px;outline:2px solid #df6042db}.site-nebula{display:none}.main-container{max-width:1360px;padding:max(1.6rem, calc(1rem + var(--safe-top))) 2rem max(3rem, calc(2rem + var(--safe-bottom)));margin:0 auto}#app{min-height:calc(100vh - var(--safe-top) - var(--safe-bottom));min-height:calc(100dvh - var(--safe-top) - var(--safe-bottom))}.app-header{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:.8rem 1.4rem;margin-bottom:1.25rem;display:grid}.app-header .header-actions{grid-area:1/2}.app-title{font-family:var(--font-display);letter-spacing:-.025em;margin:0;font-size:clamp(2rem,4vw,3.25rem);font-weight:600;line-height:.94}.collection-stats{color:var(--text-secondary);letter-spacing:.01em;margin:0;font-size:.9rem}.btn-primary,.btn-chip,.btn-ghost{border-radius:var(--radius-sm);cursor:pointer;border:1px solid #0000}.btn-primary{min-height:var(--control-md);background:var(--accent-primary);color:var(--accent-ink);text-transform:none;letter-spacing:.01em;box-shadow:none;padding:0 1rem;font-size:.88rem;font-weight:700}.btn-primary:hover{background:#ef7657;transform:translateY(-1px);box-shadow:0 8px 20px #df604233}.btn-chip{border-color:var(--stroke-soft);min-height:36px;color:var(--text-secondary);letter-spacing:.04em;text-transform:none;background:0 0;align-items:center;gap:.42rem;padding:0 .85rem;font-size:.72rem;display:inline-flex}.btn-chip:hover{border-color:var(--accent-primary);color:var(--text-primary)}.btn-ghost{min-height:var(--control-md);border-color:var(--stroke-soft);color:var(--text-secondary);background:0 0;padding:0 .9rem;font-size:.86rem}.header-action-btn{width:128px;min-width:128px;height:var(--control-md);min-height:var(--control-md);letter-spacing:.01em;justify-content:center;padding:0 .9rem;font-size:.82rem;font-weight:700}.header-action-btn svg{flex:none;width:15px;height:15px}.btn-ghost:hover{color:var(--text-primary);border-color:var(--stroke-strong);background:var(--bg-elevated)}.view-tabs{border:none;border-bottom:1px solid var(--stroke-soft);width:fit-content;box-shadow:none;background:0 0;border-radius:0;gap:.38rem;margin-bottom:1.2rem;padding:0;display:flex}.tab-btn{color:var(--text-muted);letter-spacing:.05em;text-transform:none;cursor:pointer;background:0 0;border:none;border-radius:0;padding:.55rem .8rem .65rem;font-size:.76rem;font-weight:600}.tab-btn:hover{color:var(--text-secondary)}.tab-btn.active{color:var(--text-primary);box-shadow:inset 0 -2px 0 var(--accent-primary);background:0 0}.controls-bar{border-radius:var(--radius-md);border:1px solid var(--stroke-soft);top:max(8px, var(--safe-top));z-index:40;backdrop-filter:blur(14px);background:#171713f5;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.78rem;margin-bottom:1.55rem;padding:.55rem;display:grid;position:sticky;box-shadow:0 12px 28px #0003}.controls-secondary{align-items:center;gap:.58rem;display:inline-flex}.search-container{min-height:var(--control-lg);border-radius:var(--radius-sm);border:1px solid var(--stroke-soft);background:var(--bg-canvas);align-items:center;display:flex;position:relative}.search-container:hover{border-color:var(--stroke-strong)}.search-container input{width:100%;height:var(--control-lg);color:var(--text-primary);background:0 0;border:none;outline:none;padding:0 2.45rem;font-size:.92rem;font-weight:500;line-height:normal}.search-container input::placeholder{color:var(--text-muted);opacity:.92}.sort-select{height:var(--control-lg);min-height:var(--control-lg);border-radius:var(--radius-sm);border:1px solid var(--stroke-soft);background:var(--bg-canvas);min-width:150px;color:var(--text-secondary);padding:0 2rem 0 .92rem;font-size:.84rem;font-weight:500}.sort-select:hover{border-color:var(--stroke-strong)}.view-toggle{height:var(--control-lg);min-height:var(--control-lg);border-radius:var(--radius-sm);border:1px solid var(--stroke-soft);background:var(--bg-canvas);align-items:center;gap:.22rem;padding:.2rem;display:inline-flex}.view-toggle .view-btn{width:auto;min-width:32px;height:32px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:3px;justify-content:center;align-items:center;gap:.32rem;padding:0 .5rem;display:flex}.view-btn-label{letter-spacing:.02em;font-size:.69rem;font-weight:600}.album-open-btn{all:unset;width:100%;color:inherit;cursor:pointer;box-sizing:border-box;display:block}.album-open-btn:focus-visible .album-cover-container{outline:2px solid var(--accent-primary);outline-offset:3px}.view-toggle .view-btn:hover{color:var(--text-secondary)}.view-toggle .view-btn.active{color:var(--accent-ink);background:var(--accent-3);box-shadow:none}.featured-section{border-radius:var(--radius-lg);border:1px solid var(--stroke-soft);background:var(--bg-surface-2);box-shadow:var(--shadow-sm);grid-template-columns:112px 1fr;align-items:center;gap:.9rem;margin-bottom:1.45rem;padding:.8rem;display:grid;position:relative;overflow:hidden}.featured-section:before{content:"";pointer-events:none;background:linear-gradient(90deg,#e4c48d0d,#0000 42%);position:absolute;inset:0}.featured-cover-container{aspect-ratio:1;border-radius:var(--radius-sm);border:1px solid var(--stroke-strong);width:100%;box-shadow:var(--shadow-sm);background:#100d1f;position:relative;overflow:hidden}.featured-info{z-index:1;position:relative}.featured-label{color:var(--accent-3);font-family:var(--font-label);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.5rem;font-size:.62rem;font-weight:700}.featured-title{font-family:var(--font-display);margin:0;font-size:clamp(1.28rem,3.1vw,1.85rem);font-weight:600;line-height:1.02}.featured-artist{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;margin-top:.28rem;font-size:.95rem;overflow:hidden}.featured-title-wrap{min-width:0}.featured-header-row{flex-direction:column;gap:.62rem;margin-top:.56rem;display:flex}.featured-actions{flex-wrap:wrap;align-items:center;gap:.62rem;display:flex}.featured-fact-strip{border-radius:var(--radius-sm);border:1px solid var(--stroke-soft);border-left:2px solid var(--accent-secondary);background:var(--bg-surface);margin-top:.72rem;padding:.54rem .68rem}.featured-fact-kicker{color:var(--accent-3);font-family:var(--font-label);text-transform:uppercase;letter-spacing:.1em;opacity:.95;margin-bottom:.2rem;font-size:.64rem;font-weight:700;display:inline-block}.featured-fact-copy{color:var(--text-secondary);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:.82rem;line-height:1.34;display:-webkit-box;overflow:hidden}@media (width>=981px){.featured-section{grid-template-columns:112px minmax(0,1fr);gap:.88rem;padding:.9rem .96rem}.featured-title{font-size:clamp(1.12rem,1.8vw,1.5rem)}.featured-artist{font-size:.84rem}.featured-header-row{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:.76rem;margin-top:.48rem;display:grid}.featured-actions{flex-wrap:nowrap;justify-content:flex-end}.featured-fact-strip{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.62rem;margin-top:.62rem;padding:.5rem .62rem;display:grid}.featured-fact-kicker{white-space:nowrap;margin:0}.featured-fact-copy{font-size:.81rem;line-height:1.3}}.shuffle-anim .featured-cover-container img{animation:.18s linear infinite remixPulse}.album-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:1.35rem 1rem;display:grid}.album-object{min-width:0;transition:transform var(--motion-fast)}.album-object:hover{transform:translateY(-2px)}.album-cover-container{aspect-ratio:1;border:1px solid var(--stroke-soft);background:#120f22;border-radius:4px;position:relative;overflow:hidden;box-shadow:0 6px 16px #0000003d}.album-cover-img{object-fit:cover;width:100%;height:100%;transition:transform var(--motion-med), filter var(--motion-med)}.album-object:hover .album-cover-img{filter:saturate(1.02);transform:scale(1.025)}.album-object:hover .album-cover-container{border-color:var(--vibe-color,var(--stroke-strong));box-shadow:0 10px 22px #00000057, 0 2px 0 var(--vibe-color,var(--accent-secondary))}.album-meta{padding-top:.68rem}.album-meta .album-artist{font-family:var(--font-display);color:var(--text-primary);font-size:1rem;font-weight:600}.album-meta .album-title{color:var(--text-secondary);font-size:.81rem}.edit-trigger-btn{width:32px;height:32px;color:var(--text-primary);opacity:0;transition:all var(--motion-fast);z-index:5;cursor:pointer;background:#0f0f0de6;border:1px solid #ffffff42;border-radius:4px;justify-content:center;align-items:center;display:flex;position:absolute;top:8px;right:8px;transform:scale(.85)}.album-cover-container:hover .edit-trigger-btn{opacity:1;transform:scale(1)}.edit-trigger-btn:hover{background:var(--accent-primary);color:var(--accent-ink);border-color:var(--accent-primary)}.list-header{color:var(--text-muted);text-transform:uppercase;letter-spacing:.11em;border-bottom:1px solid var(--stroke-soft)}.list-row{border-radius:var(--radius-sm);background:#f3eadb03;border:1px solid #0000}.list-row:hover{border-color:var(--stroke-soft);background:#f3eadb09}.list-row:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.list-edit-btn{border:1px solid var(--stroke-soft);color:var(--text-muted);background:0 0}.list-edit-btn:hover{border-color:var(--stroke-strong);color:var(--text-primary)}.timeline-container{border-left:2px solid var(--stroke-soft)}.artist-alpha-nav{right:max(4px, calc(4px + var(--safe-right)));z-index:80;user-select:none;touch-action:none;background:#0f0f0de6;border:1px solid #b98b4952;border-radius:12px;flex-direction:column;align-items:center;gap:1px;padding:5px 4px;display:none;position:fixed;top:50%;transform:translateY(-50%);box-shadow:0 12px 24px #00000059}.artist-alpha-btn{width:16px;height:11px;color:var(--text-secondary);letter-spacing:.02em;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:0;font-size:.57rem;font-weight:700;line-height:1}.artist-alpha-btn:hover,.artist-alpha-btn:focus-visible{color:var(--text-primary);background:#df60423d}.artist-alpha-btn.disabled{color:#9b8dbf73;cursor:default}.site-footer{border-top:1px solid var(--stroke-soft);text-align:center;color:var(--text-muted);margin-top:4rem;padding:2rem 0 1rem}.site-footer button{color:var(--text-secondary);cursor:pointer;background:0 0;border:none}.site-footer button:hover{color:var(--accent-primary)}.rec-card{transition:transform var(--motion-fast), border-color var(--motion-fast)}.rec-card:hover{transform:translateY(-4px);border-color:var(--accent-primary)!important}.modal-surface{background:var(--bg-surface-2);border:1px solid var(--stroke-soft);border-radius:var(--radius-md);color:var(--text-primary);box-shadow:var(--shadow-lg);backdrop-filter:blur(5px)}.modal-close-btn{border-radius:var(--radius-sm);width:44px;height:44px;color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #0000;justify-content:center;align-items:center;padding:0;display:inline-flex}.modal-close-btn:hover{color:var(--text-primary);border-color:var(--stroke-soft);background:var(--bg-elevated)}.login-record-mark{border:1px solid var(--stroke-strong);background:repeating-radial-gradient(circle,#0000 0 5px,#f3eadb14 5px 6px),#11110f;border-radius:50%;place-items:center;width:68px;height:68px;margin:0 auto 1.2rem;display:grid;box-shadow:0 12px 28px #00000057}.login-record-mark span{background:var(--accent-primary);border:7px solid var(--accent-primary);width:24px;height:24px;box-shadow:inset 0 0 0 2px var(--accent-ink);border-radius:50%}#featured-collapsed{border-left:3px solid var(--accent-secondary)!important;background:var(--bg-surface-2)!important;box-shadow:var(--shadow-sm)!important}#recent-grid{scrollbar-color:var(--stroke-strong) transparent;scrollbar-width:thin}@media (width>=769px){#recent-grid{grid-template-columns:repeat(8,minmax(0,1fr))!important}}.modal-title{font-family:var(--font-display);letter-spacing:.03em}#viewer-modal-content{border:1px solid var(--stroke-soft);border-radius:var(--radius-md);overflow:hidden}.cd-scale{transform-origin:bottom;transform:scale(.91)}.cd-spine:before{content:"";opacity:0;width:14px;transition:all var(--motion-med);pointer-events:none;z-index:2;background:linear-gradient(90deg,#c9a4ff61,#ffffff08);border-right:1px solid #c9a4ff3d;position:absolute;top:0;bottom:0;left:0;transform:translate(-5px)}.cd-spine:hover:before{opacity:1;transform:translate(0)}.skeleton{background:linear-gradient(90deg,#18122d 20%,#302454 45%,#18122d 70%) 0 0/240% 100%;animation:1.8s linear infinite shimmer}.skeleton-card{aspect-ratio:1;border-radius:12px}.fade-in{animation:.26s ease-out fadeIn}.spinner{animation:1s linear infinite spin;display:inline-block}.input-reset{background:var(--bg-canvas);border:1px solid var(--stroke-soft);color:var(--text-primary);border-radius:var(--radius-sm);padding:.67rem .88rem}.input-reset:focus{border-color:var(--accent-primary);outline:none;box-shadow:0 0 0 3px #df604233}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.flex-center{justify-content:center;align-items:center;display:flex}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#141027}::-webkit-scrollbar-thumb{background:#3f2f66;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#533f86}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes toastIn{0%{opacity:0;transform:translateY(-8px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes toastOut{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-8px)scale(.98)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes remixPulse{0%{opacity:1;transform:translateY(0)}50%{opacity:.66;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:220% 0}to{background-position:-20% 0}}@media (width<=980px){.controls-bar{grid-template-columns:1fr;gap:.62rem;padding:.62rem}.controls-secondary{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.55rem;display:grid}.sort-select{width:100%;min-width:0}.featured-section{text-align:center;grid-template-columns:1fr}.featured-cover-container{max-width:220px;margin:0 auto}}@media (width<=768px){.main-container{padding:max(.9rem, calc(.65rem + var(--safe-top))) 1rem max(2rem, calc(1.2rem + var(--safe-bottom)))}.app-header{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.45rem .7rem;margin-bottom:.85rem}.app-title{white-space:nowrap;font-size:1.9rem}.app-header .header-actions{flex-wrap:nowrap!important;justify-content:flex-end!important;align-items:center!important}.app-header .header-actions>div{gap:.45rem!important}.app-header .collection-stats{left:1rem;top:calc(max(.9rem, calc(.65rem + var(--safe-top))) + 2.55rem);font-size:.78rem;position:absolute}.app-header .btn-chip{justify-content:center;width:38px;min-width:38px;min-height:38px;padding:0;font-size:0}.app-header .btn-chip svg{width:15px;height:15px}.app-header .btn-primary{width:auto;min-width:0;min-height:38px;padding:.5rem .7rem;font-size:.8rem}.controls-bar{top:max(4px, var(--safe-top));border-radius:14px;margin-bottom:1rem}.search-container{min-height:42px}.search-container input{height:42px;padding:0 2.32rem;font-size:.9rem}.controls-secondary{grid-template-columns:1fr auto}.sort-select{min-height:40px;font-size:.82rem}.view-toggle{min-height:40px}.view-toggle .view-btn{width:auto;min-width:30px;height:30px;padding:0 .42rem}.album-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.95rem}.view-tabs{justify-content:flex-start;width:100%;margin-top:1.35rem;margin-bottom:.85rem}.tab-btn{text-align:center;flex:1;padding-left:.35rem;padding-right:.35rem}.toast-host{right:max(12px, calc(8px + var(--safe-right)));left:max(12px, calc(8px + var(--safe-left)));width:auto}.artist-alpha-nav{right:max(2px, calc(2px + var(--safe-right)));padding:4px 3px}.artist-alpha-btn{width:14px;height:10px;font-size:.54rem}.app-header{margin-bottom:.7rem;padding-bottom:1.15rem}.featured-section{margin-bottom:1.1rem;padding:1rem}#recent-section,#recs-section{margin-bottom:1.25rem!important}.site-footer{margin-top:2.25rem;padding:1.25rem 0 .75rem}#add-album-modal .modal-surface{max-height:90vh!important;margin:4vh auto!important;padding:1.1rem!important}#edit-album-modal>div,#stats-modal>div{padding:.5rem!important}.edit-modal-header,.edit-modal-body,.edit-modal-footer{padding:1rem!important}.edit-modal-footer{gap:.6rem!important}.edit-modal-footer>div{gap:.5rem!important}.edit-modal-footer #btn-delete{font-size:.68rem!important}.edit-modal-footer #btn-cancel{padding-inline:.72rem!important}.edit-modal-footer #btn-save{padding-inline:.82rem!important;font-size:.72rem!important}.edit-artwork-section{gap:.9rem!important;margin-bottom:1.2rem!important}.edit-cover-preview-wrap{width:118px!important}#recent-grid{overscroll-behavior-inline:contain;scroll-snap-type:inline proximity;grid-auto-columns:minmax(128px,41vw);grid-auto-flow:column;padding-bottom:.45rem;overflow-x:auto;grid-template-columns:none!important}#recent-grid .album-object{scroll-snap-align:start}.edit-trigger-btn{opacity:1;transform:scale(1)}#add-album-modal,#edit-album-modal,#stats-modal{background:#080806f0!important}#stats-container{width:100%!important;max-height:calc(100dvh - 1rem)!important}.insights-split-grid{grid-template-columns:1fr!important;gap:1.5rem!important}}@media (width<=520px){.controls-secondary{grid-template-columns:minmax(0,1fr) auto}.view-toggle{justify-self:end}.view-toggle .view-btn{padding:0 .34rem}.view-btn-label{font-size:.64rem}.edit-album-identity{gap:.65rem!important}}