*,:before,:after{box-sizing:border-box}html,body{color:#fff;-webkit-font-smoothing:antialiased;background:#000;height:100%;min-height:100%;margin:0;font-family:Inter,system-ui,-apple-system,sans-serif}body{flex-direction:column;min-height:100%;display:flex}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}a{color:inherit;text-decoration:none}#app{flex:1;min-height:100dvh}.main{flex-direction:column;flex:1;justify-content:space-between;align-items:center;min-height:100dvh;display:flex;position:relative;overflow:hidden}.hero-bg{z-index:0;background-color:#000;background-image:url(/bg.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;position:fixed;inset:0}.hero-bg__light{pointer-events:none;z-index:0;mix-blend-mode:soft-light;opacity:.85;background:radial-gradient(70% 55% at 72% 38%,#ffc47838 0%,#ffa04614 28%,#0000 62%),radial-gradient(45% 40% at 28% 48%,#ffd2961a 0%,#0000 55%);transition:opacity 50ms linear,filter 50ms linear;animation:4.8s ease-in-out infinite street-hum;position:absolute;inset:0}.hero-bg__light.is-flickering{opacity:var(--flicker,.45);filter:brightness(.55)saturate(.7);animation:none}html.is-late .hero-bg__light{background:radial-gradient(65% 50% at 74% 36%,#ffaa5a2e 0%,#b46e280f 30%,#0000 60%),radial-gradient(40% 35% at 26%,#78a0ff0f 0%,#0000 55%)}@keyframes street-hum{0%,to{opacity:.72;filter:brightness(.92)}40%{opacity:.95;filter:brightness(1.08)}55%{opacity:.8;filter:brightness(.98)}70%{opacity:1;filter:brightness(1.12)}}.hero-bg__shade{pointer-events:none;z-index:1;background:linear-gradient(#0000001a 0%,#0000 50%,#0006 100%);transition:background 1.2s;position:absolute;inset:0}html.is-late .hero-bg__shade{background:linear-gradient(#02061273 0%,#0003 42%,#0000009e 100%)}.rain{pointer-events:none;z-index:2;position:absolute;inset:0;overflow:hidden}.rain__drop{background:linear-gradient(#0000,#d2e1ffb3);width:1px;animation-name:rain-fall;animation-timing-function:linear;animation-iteration-count:infinite;position:absolute;top:-40px}@keyframes rain-fall{to{transform:translateY(110vh)}}.rain.is-storm .rain__drop{opacity:1;background:linear-gradient(#0000,#e6f0fff2);animation-duration:.35s!important}.clock{z-index:20;font-variant-numeric:tabular-nums;color:#fff;filter:drop-shadow(0 1px 6px #00000080);font-size:.875rem;font-weight:500;position:fixed;top:1.25rem;left:1.25rem}.clock__blink{animation:1s step-end infinite blink}.clock__ampm{color:#ffffffb3;margin-left:.375rem}.online{z-index:20;color:#fff;filter:drop-shadow(0 1px 6px #00000080);border-radius:999px;align-items:center;gap:.5rem;padding:.375rem 1rem .375rem .75rem;font-size:.875rem;font-weight:500;display:inline-flex;position:fixed;top:1.25rem;left:50%;transform:translate(-50%)}.online__dot-wrap{width:.625rem;height:.625rem;display:flex;position:relative}.online__ping{opacity:.75;background:#4ade80;border-radius:999px;animation:1.2s cubic-bezier(0,0,.2,1) infinite ping;position:absolute;inset:0}.online__dot{background:#4ade80;border-radius:999px;width:.625rem;height:.625rem;display:inline-flex;position:relative;box-shadow:0 0 8px #4ade80e6}.online__count{font-variant-numeric:tabular-nums}.online__label{color:#ffffffb3}.top-links{z-index:20;align-items:center;gap:.5rem;display:flex;position:fixed;top:1.25rem;right:1.25rem}.top-links a,.top-links__suggest{color:#fff;filter:drop-shadow(0 1px 6px #00000080);border-radius:999px;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;padding:0;transition:opacity .15s,transform .15s;display:flex}.top-links a:hover,.top-links__suggest:hover{opacity:.8}.top-links a:active,.top-links__suggest:active{transform:scale(.95)}.brand-wrap{z-index:10;flex-direction:column;align-items:center;margin-top:14vh;padding:0 1.5rem;display:flex;position:relative}.logo{letter-spacing:.02em;color:#fff;text-align:center;filter:drop-shadow(0 4px 24px #00000080);margin:0;font-family:Noto Serif Devanagari,Georgia,serif;font-size:clamp(3.5rem,14vw,6.5rem);font-weight:700;line-height:1}.player-wrap{z-index:10;justify-content:center;width:100%;margin-bottom:8vh;padding:0 1.5rem;display:flex;position:relative}.player{width:100%;max-width:40rem}.player-slot{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute;overflow:hidden}.player-bar{-webkit-backdrop-filter:blur(40px)saturate(150%);background:#ffffff1a;border:1px solid #fff3;border-radius:999px;align-items:center;gap:1rem;padding:.75rem 1.25rem .75rem .75rem;transition:box-shadow .6s,border-color .6s;display:flex;position:relative;box-shadow:0 8px 40px #00000073,inset 0 1px #ffffff40}.player.is-playing .player-bar{border-color:#ffffff6b;animation:2.8s ease-in-out infinite player-breathe;box-shadow:0 8px 40px #00000073,0 0 0 1px #b4d2ff29,0 0 42px #8cb4ff52,inset 0 1px #ffffff57}@keyframes player-breathe{0%,to{border-color:#ffffff47;box-shadow:0 8px 40px #00000073,0 0 0 1px #a0c8ff1a,0 0 22px #78aaff29,inset 0 1px #ffffff38}50%{border-color:#e6f0ff8c;box-shadow:0 8px 44px #00000080,0 0 0 1px #d2e6ff47,0 0 64px #96c3ff7a,0 0 110px #78aaff38,inset 0 1px #ffffff6b}}.vinyl{width:5rem;height:5rem;color:inherit;cursor:pointer;background:0 0;border:0;flex-shrink:0;padding:0;position:relative}.vinyl:focus-visible{outline-offset:3px;outline:2px solid #ffffff8c}.vinyl__disc{border-radius:999px;outline:1px solid #fff3;width:100%;height:100%;animation:8s linear infinite paused spin;overflow:hidden;box-shadow:0 10px 24px #00000059}.vinyl__disc.is-spinning{animation-play-state:running}.vinyl__disc img{object-fit:cover;border-radius:999px;width:100%;height:100%;display:block}.vinyl__hub{pointer-events:none;z-index:2;background:#000000b3;border-radius:999px;outline:2px solid #fff6;width:.75rem;height:.75rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.vinyl__film{pointer-events:none;z-index:3;text-align:center;letter-spacing:.02em;color:#ffffffeb;opacity:0;background:#00000073;border-radius:999px;place-items:center;margin:0;padding:.35rem;font-size:9px;font-weight:500;line-height:1.15;transition:opacity .25s,transform .25s;display:grid;position:absolute;inset:0;transform:scale(.96)}.vinyl:hover .vinyl__film,.vinyl:focus-visible .vinyl__film,.vinyl.is-copied .vinyl__film{opacity:1;transform:scale(1)}.vinyl.is-copied .vinyl__film{background:#0000008c}.meta{flex:1;min-width:0}.meta__title{text-overflow:ellipsis;white-space:nowrap;color:#fff;text-shadow:0 1px 2px #00000040;margin:0;font-size:15px;font-weight:600;overflow:hidden}.meta__artist{text-overflow:ellipsis;white-space:nowrap;color:#ffffffb3;margin:0;font-size:13px;overflow:hidden}.meta__whisper{text-overflow:ellipsis;white-space:nowrap;letter-spacing:.01em;color:#d2e1ff8c;margin:.15rem 0 0;font-size:11px;font-style:italic;overflow:hidden}.meta__from{text-overflow:ellipsis;white-space:nowrap;letter-spacing:.04em;text-transform:lowercase;color:#ffd2aa8c;margin:.1rem 0 0;font-size:10px;overflow:hidden}.meta__from[hidden]{display:none!important}.seek{margin-top:.5rem}.seek__bar{cursor:pointer;width:100%;height:.5rem;position:relative}.seek__track{inset-inline:0;background:#fff3;border-radius:999px;height:.25rem;position:absolute;top:50%;overflow:hidden;transform:translateY(-50%)}.seek__fill{background:#ffffffe6;border-radius:999px;width:0%;height:100%}.seek__thumb{opacity:0;background:#fff;border-radius:999px;width:.75rem;height:.75rem;transition:opacity .15s;position:absolute;top:50%;left:0%;transform:translate(-50%,-50%);box-shadow:0 1px 4px #00000059}.seek__bar:hover .seek__thumb{opacity:1}.seek__time{text-align:left;font-variant-numeric:tabular-nums;color:#fff9;margin-top:.375rem;font-size:11px}.controls{align-items:center;gap:.25rem;display:flex}.ctrl{color:#fffc;border-radius:999px;place-items:center;width:2.25rem;min-width:2.25rem;height:2.25rem;min-height:2.25rem;transition:background .15s,color .15s,transform .15s,opacity .15s;display:grid}.ctrl:hover{color:#fff;background:#ffffff26}.ctrl:active{transform:scale(.95)}.ctrl--mode{color:#ffffff73;width:2rem;min-width:2rem;height:2rem;min-height:2rem}.ctrl--mode.is-on{color:#fff;background:#ffffff24}.ctrl--play{color:#000;background:#fff;width:2.75rem;min-width:2.75rem;height:2.75rem;min-height:2.75rem;box-shadow:0 8px 20px #00000040}.ctrl--play:hover{color:#000;background:#fff;transform:scale(1.05)}.ctrl--play:active{transform:scale(.95)}.ctrl--play:disabled{opacity:.5}@keyframes blink{50%{opacity:0}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes spin{to{transform:rotate(360deg)}}@media (width>=640px){.top-links a{padding:.625rem}}@media (width<=520px){.player-bar{gap:.55rem;padding:.7rem .7rem .7rem .65rem}.vinyl{width:3.75rem;height:3.75rem}.meta__title{font-size:14px}.meta__whisper{font-size:10px}.controls{gap:.1rem}.ctrl{width:2.5rem;min-width:2.5rem;height:2.5rem;min-height:2.5rem}.ctrl--mode{width:2.25rem;min-width:2.25rem;height:2.25rem;min-height:2.25rem}.ctrl--play{width:2.85rem;min-width:2.85rem;height:2.85rem;min-height:2.85rem}.seek__bar{height:.75rem}}@media (prefers-reduced-motion:reduce){.clock__blink,.online__ping,.vinyl__disc,.rain__drop,.hero-bg__light,.player.is-playing .player-bar,.ticker__track,.storm__flash,.storm__bolt{animation:none!important}.hero-bg__light.is-flickering{opacity:.85;filter:none}.storm.is-on .storm__flash{opacity:.35}}body.suggest-open{overflow:hidden}.suggest{z-index:80;place-items:center;padding:1.25rem;display:grid;position:fixed;inset:0}.suggest[hidden]{display:none!important}.suggest__backdrop{cursor:pointer;background:#00000094;border:0;position:absolute;inset:0}.suggest__panel{--napkin:#e7e2d6;--ink:#1c1915;--ink-soft:#1c19158c;--pen:#243a55;z-index:1;width:min(100%,19.5rem);color:var(--ink);background:radial-gradient(ellipse 55% 40% at 18% 12%, #ffffff73, transparent 55%), radial-gradient(ellipse 70% 50% at 88% 92%, #a091782e, transparent 60%), repeating-linear-gradient(115deg, transparent 0 2px, #5a4b3704 2px 3px), linear-gradient(155deg, #efebe1 0%, var(--napkin) 48%, #ddd6c6 100%);clip-path:polygon(1.2% 3.5%,4% .8%,11% 2.2%,22% .4%,38% 1.8%,52% .6%,67% 2%,81% .5%,93% 1.6%,98.8% 4%,99.6% 14%,98.2% 28%,99.4% 42%,98% 58%,99.5% 72%,97.8% 86%,99% 95%,94% 98.8%,80% 97.4%,64% 99.2%,48% 97.6%,33% 99%,18% 97.2%,6% 98.6%,.8% 94%,2% 78%,.4% 62%,1.8% 46%,.5% 30%,1.6% 16%);isolation:isolate;border:1px solid #5a4b372e;border-radius:18px 42px 22px 36px/28px 16px 40px 20px;padding:1.35rem 1.4rem 1.15rem;font-family:Caveat,Segoe Print,Comic Sans MS,cursive;animation:.55s cubic-bezier(.22,1,.36,1) both napkin-settle;position:relative;overflow:hidden;transform:rotate(-1.6deg);box-shadow:0 18px 50px #00000080,inset 0 2px #ffffff59,inset -1px -1px #0000000a}.suggest__panel:before{content:"";pointer-events:none;border-radius:inherit;opacity:.9;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #ffffff40,inset 0 0 24px #78644614}.suggest__stain{pointer-events:none;opacity:.9;background:radial-gradient(circle at 45% 42%,#0000 36%,#6e462312 42%,#5a37191f 52%,#6e46230d 62%,#0000 72%);border-radius:50%;width:3.4rem;height:3.4rem;position:absolute;top:.7rem;right:.85rem;transform:rotate(18deg)}.suggest__fold{pointer-events:none;background:linear-gradient(105deg,#0000 30%,#0000000b 48%,#0000 62%);width:28%;height:42%;position:absolute;top:38%;left:-8%;transform:rotate(-8deg)}.suggest__form{z-index:1;flex-direction:column;gap:1rem;min-height:10.5rem;display:flex;position:relative}.suggest__field{display:block}.suggest__input{width:100%;color:var(--pen);caret-color:var(--pen);background:0 0;border:0;border-bottom:1.5px solid #1c191547;border-radius:0;outline:none;padding:.55rem .15rem .3rem;font-family:inherit;font-size:1.55rem;font-weight:500;line-height:1.25;transition:border-color .15s}.suggest__input::placeholder{color:#0000}.suggest__input:focus{border-bottom-color:#243a558c}.suggest__hp{opacity:0;pointer-events:none;width:0;height:0;position:absolute;left:-9999px}.suggest__status{min-height:0;color:var(--ink-soft);margin:0;font-size:1.05rem;font-weight:500}.suggest__status:empty{display:none}.suggest__actions{justify-content:space-between;align-items:center;gap:.65rem;margin-top:auto;padding-top:.85rem;display:flex}.suggest__cancel,.suggest__submit{font:inherit;cursor:pointer;background:0 0;border:0;border-radius:0;padding:0;font-weight:600;line-height:1;transition:opacity .15s,transform .15s,color .15s}.suggest__cancel{color:var(--ink-soft);font-size:1.65rem;transform:rotate(-2deg)}.suggest__cancel:hover{color:var(--ink)}.suggest__submit{color:var(--pen);font-size:1.85rem;transform:rotate(2deg)}.suggest__submit:hover:not(:disabled){color:#152536;transform:rotate(2deg)translate(2px)}.suggest__submit:disabled{opacity:.45;cursor:wait}@keyframes napkin-settle{0%{opacity:0;transform:translateY(14px)rotate(-4deg)scale(.96)}to{opacity:1;transform:translateY(0)rotate(-1.6deg)scale(1)}}@media (prefers-reduced-motion:reduce){.suggest__panel{animation:none}}.ticker{left:50%;bottom:max(.75rem, env(safe-area-inset-bottom));z-index:12;pointer-events:none;width:min(100%,42rem);padding:0 1.25rem;position:fixed;transform:translate(-50%)}.ticker[hidden]{display:none!important}.ticker__viewport{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 8% 92%,#0000);mask-image:linear-gradient(90deg,#0000,#000 8% 92%,#0000)}.ticker__track{pointer-events:auto;align-items:center;gap:.85rem;width:max-content;padding:.35rem 0;animation:140s linear infinite ticker-scroll;display:flex}.ticker:hover .ticker__track{animation-play-state:paused}.ticker.is-pulse .ticker__track{animation-duration:90s}.ticker__item{color:#ffffffb8;max-width:18rem;font:inherit;letter-spacing:.02em;white-space:nowrap;cursor:pointer;filter:drop-shadow(0 1px 4px #0000008c);background:0 0;border:0;align-items:baseline;gap:.35rem;padding:0;font-size:11px;transition:color .15s;display:inline-flex}.ticker__item:hover{color:#fff}.ticker__alias{color:#ffd2aad9;font-style:italic}.ticker__sep{color:#ffffff59;text-transform:lowercase;font-size:10px}.ticker__song{text-overflow:ellipsis;font-weight:500;overflow:hidden}.ticker__dot{color:#ffffff47;-webkit-user-select:none;user-select:none;font-size:14px;line-height:1}@keyframes ticker-scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.storm{z-index:90;pointer-events:none;place-items:center;display:grid;position:fixed;inset:0}.storm[hidden]{display:none!important}.storm__flash{opacity:0;background:radial-gradient(80% 60% at 50% 20%,#dcebff8c,#0000 55%),linear-gradient(#b4c8ff33,#0000 60%);position:absolute;inset:0}.storm.is-on .storm__flash{animation:2.1s ease-out forwards storm-flash}.storm__bolt{z-index:1;fill:#f0f8fff2;filter:drop-shadow(0 0 18px #b4d2ffd9);opacity:0;width:clamp(2.5rem,8vw,3.75rem);height:auto;position:relative;transform:translateY(-8%)scale(.85)}.storm.is-on .storm__bolt{animation:2.1s ease-out forwards storm-bolt}.storm__line{z-index:1;text-align:center;letter-spacing:.01em;color:#f5f8fff2;text-shadow:0 2px 18px #000000a6;opacity:0;max-width:22rem;margin:1.25rem 1.5rem 0;font-family:Noto Serif Devanagari,Georgia,serif;font-size:clamp(1.05rem,3.5vw,1.45rem);font-weight:500;position:relative}.storm.is-on .storm__line{animation:2.1s ease-out forwards storm-line}@keyframes storm-flash{0%{opacity:0}8%{opacity:.95}14%{opacity:.15}22%{opacity:.7}32%{opacity:.08}to{opacity:0}}@keyframes storm-bolt{0%{opacity:0;transform:translateY(-12%)scale(.8)}10%{opacity:1;transform:translateY(0)scale(1)}28%{opacity:.85}55%{opacity:.35}to{opacity:0;transform:translateY(6%)scale(1.05)}}@keyframes storm-line{0%{opacity:0;transform:translateY(8px)}18%{opacity:1;transform:translateY(0)}70%{opacity:1}to{opacity:0;transform:translateY(-4px)}}@media (width<=640px){.ticker{padding:0 .75rem}.ticker__item{max-width:14rem;font-size:10px}}
