:root{--clr-void:#170a08;--clr-awning:#fdd702;--clr-clay:#241211;--clr-ambed:#d99a44;--clr-cream:#f4e9da;--clr-cream-dim:#f4e9da99;--font-display:"Instrument Serif", "Tiro Devanagari Hindi", serif;--font-ui:"Inter", system-ui, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, monospace;--radius-pill:999px;--shadow-pill:0 20px 60px -20px #000000b3, 0 2px 0 #ffffff0a inset}*{box-sizing:border-box}html,body{background:var(--clr-void);height:100%;font-family:var(--font-ui);color:var(--clr-cream);margin:0;padding:0;overflow:hidden}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}#app{width:100vw;height:100vh;position:relative}.yt-mount{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*{transition-duration:.001ms!important;animation-duration:.001ms!important}}.bg-layer{z-index:0;position:absolute;inset:0}.bg-image{background-image:url(/bg.jpg);background-position:50%;background-size:cover;position:absolute;inset:0}.bg-decoy{-webkit-user-drag:none;-webkit-user-select:none;user-select:none;background:0 0;position:absolute;inset:0}.bg-vignette{pointer-events:none;background:radial-gradient(120% 90% at 50% 100%,#170a08bf 0%,#170a0800 55%),linear-gradient(#170a0859 0%,#170a0800 22%);position:absolute;inset:0}.title-mark{z-index:1;position:absolute;left:50%;transform:translate(-50%)}.title-mark-image{filter:drop-shadow(0 8px 30px #00000073);pointer-events:none;background-position:50%;background-repeat:no-repeat;background-size:contain;position:absolute;inset:0}.title-mark-decoy{-webkit-user-drag:none;-webkit-user-select:none;user-select:none;background:0 0;position:absolute;inset:0}.title-mark--upper{aspect-ratio:6;width:min(80vw,850px);top:14%;left:45%}.title-mark--upper .title-mark-image{background-image:url(/logo1.svg)}.title-mark--lower{aspect-ratio:6/1.4;width:min(65vw,650px);top:28%;left:55%}.title-mark--lower .title-mark-image{background-image:url(/logo2.svg)}.top-bar{z-index:3;justify-content:space-between;align-items:center;padding:20px 24px;display:flex;position:absolute;top:0;left:0;right:0}.top-bar-zone{align-items:center;gap:10px;display:flex}.top-bar-zone--center{flex:1;justify-content:center}.top-bar-zone--right{justify-content:flex-end}.top-bar-icon{width:38px;height:38px;color:var(--clr-cream);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff12;border:1px solid #ffffff24;border-radius:50%;align-items:center;gap:5px;transition:background .15s,transform .15s;display:flex;position:relative}.top-bar-icon:hover{background:#ffffff24;transform:scale(1.06)}.top-bar-icon svg{width:100%;height:100%;padding:9px}.top-bar-icon-arrow{background:var(--clr-cream);width:16px;height:16px;color:var(--clr-void);border-radius:50%;justify-content:center;align-items:center;font-size:10px;font-weight:700;line-height:1;display:flex;position:absolute;bottom:-3px;right:-3px}.top-bar-tooltip{white-space:nowrap;-webkit-backdrop-filter:blur(24px)saturate(140%);backdrop-filter:blur(24px)saturate(140%);box-shadow:var(--shadow-pill);color:var(--clr-cream);opacity:0;pointer-events:none;background:#1e120f8c;border:1px solid #ffffff2e;border-radius:14px;align-items:center;gap:8px;padding:10px 14px;font-size:.78rem;transition:opacity .15s,transform .15s;display:flex;position:absolute;top:calc(100% + 10px);right:0;transform:translateY(-4px)}.top-bar-icon:hover .top-bar-tooltip{opacity:1;transform:translateY(0)}.top-bar-tooltip img{object-fit:contain;width:18px;height:18px}.top-bar-tooltip--pink{background:#ff69b459}@media (width<=480px){.top-bar{padding:14px 16px}.top-bar-icon{width:32px;height:32px}}.player-pill{z-index:2;-webkit-backdrop-filter:blur(28px)saturate(140%);backdrop-filter:blur(28px)saturate(140%);border-radius:var(--radius-pill);width:min(94vw,520px);box-shadow:var(--shadow-pill);background:#ffffff12;border:1px solid #ffffff24;align-items:center;gap:16px;padding:14px 20px 14px 14px;display:flex;position:absolute;bottom:6%;left:50%;transform:translate(-50%)}.player-art-wrap{flex-shrink:0;width:68px;height:68px;position:relative}.player-art{object-fit:cover;object-position:center;background:var(--clr-clay);border-radius:50%;width:100%;height:100%;animation:9s linear infinite paused spin;display:block;box-shadow:inset 0 0 0 3px #170a0859,inset 0 0 0 4px #ffffff1f}.player-art-hole{background:var(--clr-void);pointer-events:none;border-radius:50%;width:18%;height:18%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #ffffff2e}#app.is-playing .player-art{animation-play-state:running}@keyframes spin{to{transform:rotate(360deg)}}.player-body{flex:1;min-width:0}.player-meta{flex-direction:column;margin-bottom:9px;line-height:1.25;display:flex}.player-title{color:var(--clr-cream);white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:.82rem;font-weight:600;overflow:hidden}.player-artist{color:var(--clr-cream-dim);white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:.68rem;overflow:hidden}.player-progress{cursor:pointer;background:#f4e9da40;border-radius:4px;height:4px;margin:10px 0;position:relative}.player-progress:before{content:"";position:absolute;inset:-7px 0}.player-progress-fill{pointer-events:none;background:#fff;border-radius:4px;width:0%;transition:width .2s linear;position:absolute;inset:0 auto 0 0}.player-progress-handle{background:#fff;border-radius:50%;width:12px;height:12px;transition:transform .15s;position:absolute;top:50%;right:-6px;transform:translateY(-50%)scale(0);box-shadow:0 1px 4px #0006}.player-progress:hover .player-progress-handle{transform:translateY(-50%)scale(1)}.player-time{font-family:var(--font-ui);color:var(--clr-cream-dim);gap:4px;font-size:.65rem;display:flex}.player-controls{flex-shrink:0;align-items:center;gap:4px;display:flex}.ctrl-btn{width:38px;height:38px;color:var(--clr-cream-dim);border-radius:50%;justify-content:center;align-items:center;transition:color .15s,background .15s;display:flex}.ctrl-btn svg{width:20px;height:20px}.ctrl-btn:hover{color:var(--clr-cream);background:#f4e9da14}.ctrl-btn--main{color:#170a08;background:#fff;width:50px;height:50px;transition:transform .15s}.ctrl-btn--main:hover{color:#170a08;background-color:#fff;transform:scale(1.06)}.ctrl-btn--main:active{transform:scale(.97)}.ctrl-btn--main svg{width:22px;height:22px}.ctrl-btn--toggle{position:relative}.ctrl-btn--toggle.is-active{color:var(--clr-amber)}.ctrl-btn-dot{background:var(--clr-amber);border-radius:50%;width:4px;height:4px;transition:transform .15s;position:absolute;bottom:4px;left:50%;transform:translate(-50%)scale(0)}.ctrl-btn--toggle.is-active .ctrl-btn-dot{transform:translate(-50%)scale(1)}.ctrl-icon-slot{justify-content:center;align-items:center;width:17px;height:17px;display:flex}.ctrl-icon-slot svg{width:100%;height:100%}.icon-tooltip{z-index:5;white-space:nowrap;-webkit-backdrop-filter:blur(20px)saturate(140%);backdrop-filter:blur(20px)saturate(140%);box-shadow:var(--shadow-pill);color:var(--clr-cream);opacity:0;pointer-events:none;background:#1e120f8c;border:1px solid #ffffff29;border-radius:8px;padding:6px 11px;font-size:.68rem;transition:opacity .15s,transform .15s;position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%)translateY(4px)}.ctrl-btn--toggle:hover .icon-tooltip{opacity:1;transform:translate(-50%)translateY(0)}.ctrl-btn--toggle svg{width:17px;height:17px}.shuffle-btn-wrap{display:flex;position:relative}.shuffle-hint{white-space:nowrap;-webkit-backdrop-filter:blur(24px)saturate(140%);backdrop-filter:blur(24px)saturate(140%);box-shadow:var(--shadow-pill);color:var(--clr-cream);opacity:0;pointer-events:none;background:#1e120f8c;border:1px solid #ffffff29;border-radius:14px;flex-direction:column;align-items:flex-start;gap:10px;padding:12px 14px;font-size:.78rem;transition:opacity .2s,transform .2s;display:flex;position:absolute;bottom:calc(100% + 16px);left:50%;transform:translate(-50%)translateY(4px)}.shuffle-hint.is-visible{opacity:1;pointer-events:auto;transform:translate(-50%)translateY(0)}.shuffle-hint:after{content:"";background:inherit;border-bottom:1px solid #ffffff29;border-right:1px solid #ffffff29;border-bottom-right-radius:2px;width:12px;height:12px;margin-top:-6px;margin-left:-6px;position:absolute;top:100%;left:50%;transform:rotate(45deg)}.shuffle-hint-actions{align-items:center;gap:14px;display:flex}.shuffle-hint-ok{color:#170a08;background-color:#fff;border:1px solid #fff;border-radius:999px;padding:6px 16px;font-size:.72rem;font-weight:600}.shuffle-hint-ok:hover{background-color:var(--clr-amber);border-color:var(--clr-amber)}.shuffle-hint-never{color:var(--clr-cream);background-color:#0000;border:1px solid #f4e9da80;border-radius:999px;padding:6px 16px;font-size:.72rem;font-weight:600}.shuffle-hint-never:hover{border-color:var(--clr-cream);background-color:#f4e9da1a}@media (width<=480px){.player-pill{gap:10px;padding:10px 14px 10px 10px;bottom:4%}.player-art-wrap{width:48px;height:48px}.player-title{font-size:.82rem}}