:root{color-scheme:dark;--paper: #0f131a;--paper-2: #0b0e14;--ink: #edf2f8;--ink-soft: #8d99ab;--rule: #2a3342;--cue: #e4454d;--span: #6e93b5;--warn: #e0b34a;--warn-bg: #3a2f14;--white: #171d28;--lift: #1d2532;--shadow: 0 18px 50px rgba(0, 0, 0, .45);--display: "Sofia Sans Extra Condensed", sans-serif;--body: "Bricolage Grotesque", sans-serif;--player-h: 88px;--vinyl: #0c0e12;--radius: 14px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%;height:100%}body{margin:0;color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.4;overflow-x:hidden;background:radial-gradient(1200px 480px at 80% -10%,rgba(228,69,77,.16),transparent 55%),radial-gradient(900px 500px at 0% 100%,rgba(110,147,181,.12),transparent 50%),var(--paper)}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer;background:none;border:0}:focus-visible{outline:2px solid var(--cue);outline-offset:2px}.app{min-height:100dvh;display:flex;flex-direction:column;padding-top:var(--safe-top);padding-left:var(--safe-left);padding-right:var(--safe-right)}.app.player-open{--player-h: 540px}.offline{background:var(--cue);color:#fff;text-align:center;padding:8px 16px;font-size:14px}.header{display:flex;align-items:center;gap:12px;padding:14px 18px 10px}.brand{font-family:var(--display);font-weight:800;font-size:30px;letter-spacing:.04em;line-height:1;text-transform:uppercase}.total{font-family:var(--display);font-size:24px;font-weight:700;color:var(--span);margin-left:auto;font-variant-numeric:tabular-nums}.icon-btn,.menu-btn{min-width:36px;min-height:36px;display:grid;place-items:center;border:1px solid var(--rule);background:var(--lift);border-radius:10px;color:var(--ink)}.save-state{font-size:12px;color:var(--ink-soft);white-space:nowrap}.ruler{display:flex;gap:4px;margin:0 18px 12px;overflow-x:auto;-webkit-overflow-scrolling:touch;height:40px;min-height:40px;padding:3px;background:var(--white);border-radius:999px;border:1px solid var(--rule)}.ruler-seg{min-width:56px;border:0;background:transparent;color:var(--ink-soft);font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:0 12px;display:flex;align-items:center;justify-content:center;flex:1 1 0;border-radius:999px}.ruler-seg:nth-child(2n){background:transparent}.ruler-seg:hover,.ruler-seg:focus-visible{background:var(--lift);color:var(--ink)}.search{margin:0 18px 8px;width:calc(100% - 36px);min-height:34px;height:34px;border:1px solid var(--rule);background:var(--white);padding:0 10px;border-radius:10px;font-size:14px}.tabs{display:flex;gap:8px;padding:0 18px 10px}.tab{min-height:32px;height:32px;padding:0 12px;border:1px solid var(--rule);background:transparent;color:var(--ink-soft);font-family:var(--display);font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:999px}.tab[aria-selected=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.columns{flex:1;display:flex;flex-direction:column;min-height:0;padding-bottom:calc(var(--player-h) + var(--safe-bottom) + 8px)}.pane{flex:1;overflow:auto;padding:0 18px 16px;-webkit-overflow-scrolling:touch}.pane.hidden-phone,.pane.is-away{display:none}.block{background:var(--white);border:1px solid var(--rule);margin-bottom:14px;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}.block-search{display:block;width:calc(100% - 20px);margin:12px 10px 8px;min-height:34px;height:34px;border:1px solid var(--rule);background:var(--lift);padding:0 10px;border-radius:10px;font-size:14px}.block-body{min-height:0}.block.is-focus{position:fixed;top:0;right:0;bottom:0;left:0;z-index:15;margin:0;border:0;border-radius:0;display:flex;flex-direction:column;background:var(--paper);box-shadow:none;padding-top:var(--safe-top);padding-bottom:calc(var(--player-h) + var(--safe-bottom))}.block.is-focus .block-head{background:transparent;border-bottom:1px solid var(--rule)}.block.is-focus .block-search{width:calc(100% - 36px);margin:14px 18px 8px;background:var(--white)}.quick-add{flex-shrink:0}.quick-add-input{border-color:color-mix(in srgb,var(--cue) 55%,var(--rule))}.quick-add-empty{margin:0 18px 8px;font-size:14px;color:var(--ink-soft)}.quick-add-hits{list-style:none;margin:0 18px 10px;padding:0;max-height:32dvh;overflow:auto;border:1px solid var(--rule);background:var(--white);border-radius:12px}.quick-add-hit{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:8px;align-items:center;width:100%;min-height:40px;padding:4px 12px 4px 0;text-align:left;border-bottom:1px solid var(--rule)}.quick-add-hit:last-child{border-bottom:0}.quick-add-plus{font-family:var(--display);font-size:28px;font-weight:800;color:var(--cue);text-align:center}.quick-add-text{min-width:0;display:flex;flex-direction:column}.quick-add-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quick-add-sub,.quick-add-from{font-size:12px;color:var(--ink-soft);white-space:nowrap}.quick-add-from{font-family:var(--display);letter-spacing:.06em;text-transform:uppercase}.block.is-focus .block-body{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;background:var(--white);margin:0 18px;border:1px solid var(--rule);border-radius:var(--radius)}.app.block-focus .header,.app.block-focus .ruler,.app.block-focus .tabs{display:none}.app.block-focus .columns{padding-bottom:0}.app.block-focus .pane{padding:0;overflow:hidden}.block-head{display:flex;align-items:center;gap:8px;padding:10px 10px 10px 6px;border-bottom:1px solid var(--rule)}.block-head.is-guest{padding-left:12px}.block-title{font-family:var(--display);font-size:24px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:none;border:0;padding:0;text-align:left}.block-meta{margin-left:auto;font-family:var(--display);font-size:18px;color:var(--span)}.handle{min-width:36px;min-height:36px;display:grid;place-items:center;color:var(--ink-soft);touch-action:none;cursor:grab}.handle.is-lock{cursor:default;touch-action:auto;color:var(--cue)}.row{display:grid;grid-template-columns:44px 44px 1fr auto 44px;align-items:center;min-height:56px;border-bottom:1px solid var(--rule);padding-right:4px}.row:last-child{border-bottom:0}.row.is-readonly{grid-template-columns:44px minmax(0,1fr) auto;padding:0 12px 0 10px}.row.playing{background:color-mix(in srgb,var(--cue) 12%,transparent)}.row.playing .num,.row.is-locked .num{color:var(--cue)}.row.missing{background:var(--warn-bg)}.num{font-family:var(--display);font-size:20px;font-weight:700;text-align:right;color:var(--span)}.rank{width:40px;height:34px;min-height:34px;min-width:40px;padding:0 2px;border:1px solid var(--rule);border-radius:8px;background:var(--lift);color:var(--span);font-family:var(--display);font-size:18px;font-weight:700;text-align:center;font-variant-numeric:tabular-nums}button.rank{display:grid;place-items:center;cursor:pointer}.rank:focus{border-color:var(--cue);color:var(--cue);outline:none}.rank:focus-visible{outline:none}.row.playing .rank{color:var(--cue)}.row-main{min-width:0;text-align:left;padding:8px;background:none;border:0}.row-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-sub{font-size:13px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dur{font-family:var(--display);font-size:16px;color:var(--ink-soft);padding-right:4px}.empty{color:var(--ink-soft);padding:24px 12px;font-size:15px}.add-block{width:100%;min-height:36px;height:36px;border:1px dashed var(--span);color:var(--span);font-family:var(--display);font-size:16px;text-transform:uppercase;border-radius:var(--radius);background:color-mix(in srgb,var(--span) 8%,transparent)}.player{position:fixed;left:0;right:0;bottom:0;max-width:100%;overflow-x:hidden;background:radial-gradient(ellipse at 50% -40%,rgba(228,69,77,.18),transparent 55%),#0a0d12;color:var(--ink);padding:10px 14px calc(10px + var(--safe-bottom));padding-left:max(14px,var(--safe-left));padding-right:max(14px,var(--safe-right));z-index:20;border-top:1px solid #2a3342;box-shadow:0 -24px 50px #00000080}.player-mini{display:grid;grid-template-columns:52px minmax(0,1fr) 36px;gap:8px;align-items:center;width:100%;max-width:100%}.player-mini-info{min-width:0;overflow:hidden}.player-mini-info .row-main{min-width:0;max-width:100%;padding-left:0;padding-right:0}.mini-vinyl{width:52px;height:52px;padding:0;display:grid;place-items:center;flex-shrink:0}.play{width:56px;height:56px;border-radius:50%;background:var(--cue);color:#fff;display:grid;place-items:center;box-shadow:0 8px 24px #e4454d73}.skip{width:36px;min-width:36px;max-width:36px;min-height:36px;height:36px;display:grid;place-items:center;color:var(--ink);border:1px solid var(--rule);background:var(--lift);border-radius:12px;justify-self:end}.player-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-kicker,.player-sub,.player-time{font-family:var(--display);font-size:16px;letter-spacing:.08em;text-transform:uppercase;opacity:.72;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-kicker{text-align:center;margin-top:4px}.player-sheet .player-title{text-align:center;white-space:normal;font-size:18px}.player-sheet .player-sub{text-align:center}.player-time{text-align:center;margin-top:2px}.seek{display:block;width:100%;max-width:100%;min-width:0;margin:6px 0 0;accent-color:var(--cue)}input[type=range].seek{min-width:0}.player-sheet{padding-bottom:4px;max-width:100%;overflow-x:hidden}.deck{display:grid;place-items:center;padding:8px 0 4px}.deck-hit{position:relative;width:200px;height:200px;display:grid;place-items:center;background:radial-gradient(circle at 50% 50%,#3a2a2c 0,#3a2a2c 42%,#1b1416 58%,#12161c);border-radius:50%;box-shadow:inset 0 0 0 10px #1a1214,0 18px 40px #0000008c}.arm{position:absolute;top:14%;right:22%;width:7px;height:46%;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,#d5dde6,#7c8796);transform-origin:50% 6%;transform:rotate(-28deg);box-shadow:2px 4px 8px #00000059;pointer-events:none;transition:transform .45s ease}.arm:after{content:"";position:absolute;left:50%;bottom:-6px;width:14px;height:14px;transform:translate(-50%);background:var(--cue);border-radius:50%;box-shadow:0 0 0 2px #0a0d12}.arm.is-down{transform:rotate(14deg)}.vinyl-disc{position:relative;flex-shrink:0}.vinyl-platter{width:100%;height:100%;border-radius:50%;position:relative;overflow:hidden;background:var(--vinyl);box-shadow:0 0 0 2px #050608,inset 0 0 0 1px #ffffff14,0 10px 24px #0006;animation:vinyl-spin 3.4s linear infinite;animation-play-state:paused}.vinyl-disc.is-on .vinyl-platter{animation-play-state:running}.vinyl-grooves{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:repeating-radial-gradient(circle at center,rgba(255,255,255,.07) 0 1px,transparent 1px 4px)}.vinyl-sheen{position:absolute;top:8%;right:8%;bottom:8%;left:8%;border-radius:50%;background:linear-gradient(125deg,rgba(255,255,255,.22) 0%,transparent 36%,transparent 62%,rgba(255,255,255,.08) 100%)}.vinyl-label{position:absolute;top:31%;right:31%;bottom:31%;left:31%;border-radius:50%;background:radial-gradient(circle at 30% 28%,#f06a70,var(--cue) 55%,#8a1a22);color:#fff8f4;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:1em;letter-spacing:.06em;box-shadow:inset 0 0 0 2px #ffffff2e}.vinyl-label span{line-height:1}.vinyl-spindle{position:absolute;left:50%;top:50%;width:9%;height:9%;transform:translate(-50%,-50%);border-radius:50%;background:#0c0e12;box-shadow:0 0 0 2px #ffffff40}@keyframes vinyl-spin{to{transform:rotate(360deg)}}.player-controls{display:flex;align-items:center;justify-content:center;gap:14px;margin:10px 0 6px}.vol{display:block;font-family:var(--display);letter-spacing:.08em;text-transform:uppercase;font-size:14px;opacity:.8}.player-actions{display:flex;gap:8px;margin-top:12px}.player-actions button{flex:1;min-height:34px;height:34px;border:1px solid var(--rule);background:var(--lift);color:var(--ink);font-family:var(--display);letter-spacing:.06em;text-transform:uppercase;border-radius:12px}.mode{display:flex;gap:6px;justify-content:center;margin:8px 0}.mode button{min-height:32px;height:32px;padding:0 12px;border:1px solid var(--rule);color:inherit;font-family:var(--display);letter-spacing:.06em;text-transform:uppercase;border-radius:999px}.mode button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#06080cb8;z-index:30;display:flex;align-items:flex-end;justify-content:center}.sheet{width:min(520px,100%);background:var(--white);color:var(--ink);padding:18px 18px calc(18px + var(--safe-bottom));border-top:3px solid var(--cue);border-radius:20px 20px 0 0;max-height:85dvh;overflow:auto}.sheet h2{font-family:var(--display);text-transform:uppercase;letter-spacing:.06em;margin:0 0 12px}.sheet label{display:block;font-size:13px;color:var(--ink-soft);margin:10px 0 4px}.sheet input,.sheet textarea{width:100%;min-height:34px;height:34px;border:1px solid var(--rule);background:var(--lift);padding:4px 10px;border-radius:10px;font-size:14px}.sheet textarea{height:auto;min-height:64px}.sheet-actions{display:flex;gap:8px;margin-top:16px}.sheet-actions button,.choice{min-height:34px;height:34px;flex:1;border:1px solid var(--ink);background:var(--ink);color:var(--paper);font-family:var(--display);letter-spacing:.05em;text-transform:uppercase;border-radius:10px;font-size:13px}.choice{width:100%;flex:none;height:auto;min-height:34px;line-height:1.2;padding:8px 10px;margin-bottom:8px;display:block}.sheet-actions .ghost,.choice.ghost{background:transparent;color:var(--ink);border-color:var(--rule)}.yt-hits{list-style:none;margin:12px 0 0;padding:0;max-height:40dvh;overflow:auto}.yt-hit{text-transform:none;letter-spacing:0;font-family:var(--body);text-align:left;display:flex;flex-direction:column;gap:2px;align-items:flex-start}.yt-hit-title{font-weight:600}.yt-hit-sub{font-size:12px;color:var(--ink-soft);font-family:var(--body);text-transform:none}.qr{display:none}.header-tools{display:flex;align-items:center;gap:8px;flex-shrink:0}.login-hint,.login-error{margin:0 0 12px;font-size:13px;color:var(--ink-soft)}.login-error{color:var(--cue, #e4454d)}@media (max-height: 720px){.deck-hit{width:148px;height:148px}.deck-hit .vinyl-disc{width:124px!important;height:124px!important}.app.player-open{--player-h: 440px}}@media (min-width: 768px){.tabs{display:none}.columns{flex-direction:row;gap:16px;padding:0 18px calc(var(--player-h) + var(--safe-bottom) + 8px)}.pane{padding:0 0 16px}.pane.hidden-phone,.pane{display:block}.pane.is-away{display:none}.inbox-pane{flex:0 0 300px;max-width:340px;position:sticky;top:0;align-self:flex-start;max-height:calc(100dvh - var(--player-h) - 120px)}}@media (min-width: 1024px){.qr{display:block;width:56px;height:56px;background:#fff;padding:4px;border:1px solid var(--rule);border-radius:10px}.brand{font-size:36px}}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}.vinyl-disc.is-on .vinyl-platter{animation:none}}