:root{--bg:#0e0e12;--bg-raised:#17171d;--bg-sheet:#1c1c24;--border:#2a2a34;--text:#ececf1;--text-dim:#9a9aa8;--text-faint:#62626e;--accent:#e8b34b;--accent-dim:#8a6a2c;--violet:#7c6cf0;--green:#4fc07a;--red:#e05656;--leaving:#e08b3a;--radius:12px;--tab-h:58px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);color:var(--text);margin:0;padding:0}body{overscroll-behavior-y:none}#root{max-width:640px;min-height:100dvh;margin:0 auto}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}input,textarea,select{font:inherit;color:var(--text);background:var(--bg-raised);border:1px solid var(--border);border-radius:8px;width:100%;padding:10px 12px;font-size:16px}input:focus,textarea:focus{outline:1px solid var(--accent-dim)}a{color:var(--accent)}.view{padding:12px 14px calc(var(--tab-h) + 24px)}.view-title{justify-content:space-between;align-items:center;margin:6px 2px 12px;font-size:22px;font-weight:700;display:flex}.view-title .icon-btn{color:var(--text-dim);padding:8px;font-size:20px}.tabbar{width:100%;max-width:640px;height:calc(var(--tab-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--border);z-index:40;background:#0e0e12eb;display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.tabbar button{color:var(--text-faint);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;font-size:11px;display:flex}.tabbar button.active{color:var(--accent)}.tabbar .tab-icon{font-size:20px;line-height:1}.chip-row{scrollbar-width:none;gap:8px;padding:2px 2px 10px;display:flex;overflow-x:auto}.chip-row::-webkit-scrollbar{display:none}.chip{background:var(--bg-raised);border:1px solid var(--border);color:var(--text-dim);white-space:nowrap;border-radius:20px;flex:none;padding:7px 14px;font-size:13px}.chip.active{background:var(--accent);border-color:var(--accent);color:#1c1608;font-weight:600}.badge{white-space:nowrap;border-radius:10px;align-items:center;gap:4px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge.leaving{color:var(--leaving);background:#e08b3a26}.badge.boost{color:var(--violet);background:#7c6cf026}.badge.platform{background:var(--bg-raised);color:var(--text-dim);border:1px solid var(--border);font-weight:500}.row-wrap{border-radius:var(--radius);margin-bottom:8px;position:relative;overflow:hidden}.row-under{background:var(--green);color:#0a2013;border-radius:var(--radius);align-items:center;padding-left:20px;font-weight:700;display:flex;position:absolute;inset:0}.row{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius);text-align:left;touch-action:pan-y;align-items:center;gap:12px;width:100%;padding:13px 14px;display:flex;position:relative}.row.dragging{opacity:.4}.row-thumb{object-fit:cover;background:var(--border);border-radius:7px;flex:none;width:92px;height:52px}.row-actions{flex-direction:column;flex:none;align-items:center;gap:8px;display:flex}.row-play{background:var(--accent);color:#1c1608;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;padding-left:2px;font-size:13px;text-decoration:none;display:flex}.row-check{border:2px solid var(--border);width:30px;height:30px;color:var(--text-faint);border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:14px;display:flex}.row-check:active,.row-check.done{border-color:var(--green);color:var(--green)}.row-main{flex:1;min-width:0}.row-title{text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:600;overflow:hidden}.row-sub{color:var(--text-dim);flex-wrap:wrap;align-items:center;gap:6px;margin-top:3px;font-size:12.5px;display:flex}.row-progress{background:var(--border);border-radius:2px;height:3px;margin-top:8px;overflow:hidden}.row-progress>div{background:var(--accent);height:100%}.drag-handle{color:var(--text-faint);cursor:grab;touch-action:none;flex:none;padding:8px 4px;font-size:18px}.sort-btns{flex-direction:column;gap:2px;display:flex}.sort-btns button{color:var(--text-dim);padding:2px 8px;font-size:14px}.upnext{margin-bottom:16px}.upnext-label{letter-spacing:.08em;text-transform:uppercase;color:var(--violet);margin:0 2px 8px;font-size:12px;font-weight:700}.upnext .row{border-color:#7c6cf066}.section-label{letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint);margin:16px 2px 8px;font-size:12px;font-weight:700}.sheet-backdrop{z-index:50;background:#0000008c;position:fixed;inset:0}.sheet{background:var(--bg-sheet);border:1px solid var(--border);width:100%;max-width:640px;max-height:92dvh;padding:10px 16px calc(24px + env(safe-area-inset-bottom));z-index:51;border-bottom:none;border-radius:18px 18px 0 0;position:fixed;bottom:0;left:50%;overflow-y:auto;transform:translate(-50%)}.sheet-grip{background:var(--border);border-radius:2px;width:40px;height:4px;margin:4px auto 14px}.sheet h2{margin:0 0 2px;font-size:19px}.sheet-banner{aspect-ratio:16/9;object-fit:cover;background:var(--border);border-radius:12px;width:100%;margin-bottom:12px}.sheet-description{color:var(--text-dim);white-space:pre-line;margin:0 0 14px;font-size:14px;line-height:1.55}.sheet-description.clamped{-webkit-line-clamp:4;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.sheet .sub{color:var(--text-dim);margin-bottom:14px;font-size:13.5px}.field{margin-bottom:14px}.field label{color:var(--text-dim);margin-bottom:6px;font-size:12.5px;display:block}.btn{background:var(--bg-raised);border:1px solid var(--border);border-radius:10px;justify-content:center;align-items:center;gap:6px;min-height:44px;padding:11px 16px;font-size:14px;font-weight:600;display:inline-flex}.btn.primary{background:var(--accent);border-color:var(--accent);color:#1c1608}.btn.danger{color:var(--red);border-color:#e0565666}.btn.small{min-height:34px;padding:6px 12px;font-size:13px;font-weight:500}.btn-row{flex-wrap:wrap;gap:8px;display:flex}.seg{background:var(--bg-raised);border:1px solid var(--border);border-radius:10px;display:flex;overflow:hidden}.seg button{color:var(--text-dim);flex:1;padding:10px 4px;font-size:13px}.seg button.active{background:var(--accent);color:#1c1608;font-weight:600}.mini-card{background:var(--bg-raised);border:1px solid var(--border);border-radius:10px;align-items:center;gap:10px;margin-bottom:8px;padding:10px 12px;display:flex}.mini-card .grow{flex:1;min-width:0}.mini-card .x{color:var(--text-faint);padding:6px;font-size:15px}.time-chip{font-variant-numeric:tabular-nums;color:var(--accent);background:#e8b34b1f;border-radius:8px;flex:none;padding:4px 9px;font-size:13px;font-weight:700;text-decoration:none}.stars{gap:4px;font-size:24px;display:flex}.stars button{color:var(--text-faint);padding:4px}.stars button.on{color:var(--accent)}.toast{bottom:calc(var(--tab-h) + env(safe-area-inset-bottom) + 12px);background:var(--bg-sheet);border:1px solid var(--border);z-index:60;border-radius:12px;justify-content:space-between;align-items:center;gap:12px;width:calc(100% - 32px);max-width:480px;padding:12px 16px;font-size:14px;display:flex;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 8px 30px #00000080}.toast button{color:var(--accent);font-weight:700}.search-input-wrap{background:var(--bg);z-index:10;padding:4px 0 10px;position:sticky;top:0}.result-add{background:var(--bg-sheet);border:1px solid var(--border);width:36px;height:36px;color:var(--accent);border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:18px;display:flex}.result-add.added{color:var(--green);border-color:#4fc07a66}.empty{color:var(--text-faint);text-align:center;padding:48px 24px;font-size:14px;line-height:1.6}.stat-row{gap:10px;margin-bottom:16px;display:flex}.stat{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius);text-align:center;flex:1;padding:12px}.stat .n{color:var(--accent);font-size:22px;font-weight:700}.stat .l{color:var(--text-dim);margin-top:2px;font-size:11.5px}details.group{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-raised);margin-bottom:10px;padding:0 14px}details.group summary{cursor:pointer;justify-content:space-between;align-items:center;padding:14px 0;font-size:14.5px;font-weight:600;list-style:none;display:flex}details.group summary:after{content:"›";color:var(--text-faint);font-size:16px;transform:rotate(90deg)}details.group[open] summary:after{transform:rotate(-90deg)}details.group .group-body{padding:2px 0 14px}