:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;--bg: #0f1115;--bg-elevated: #181b22;--border: #262a33;--text: #e6e8ee;--text-dim: #8a92a3;--accent: #4f8cff;--danger: #ff5d5d}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text)}button{font:inherit;background:var(--accent);color:#fff;border:0;border-radius:6px;padding:.55rem 1rem;cursor:pointer}button:disabled{opacity:.5;cursor:default}button.secondary{background:transparent;color:var(--text);border:1px solid var(--border)}input{font:inherit;background:var(--bg-elevated);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:.55rem .75rem;width:100%}a{color:var(--accent)}.app{display:flex;flex-direction:column;min-height:100%}.topbar{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.25rem;border-bottom:1px solid var(--border);background:var(--bg-elevated)}.topbar h1{font-size:1rem;margin:0}.tabs{display:flex;gap:.5rem}.cutter-form{display:flex;flex-direction:column;gap:.85rem;max-width:560px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;padding:1rem 1.25rem}.cutter-form .field{margin-bottom:0}.topbar .user{display:flex;align-items:center;gap:.75rem;color:var(--text-dim);font-size:.9rem}.login-wrapper{display:grid;place-items:center;flex:1;padding:2rem}.login-card{width:100%;max-width:360px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:12px;padding:1.75rem}.login-card h2{margin:0 0 1.25rem;font-size:1.25rem}.field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.85rem}.field label{font-size:.85rem;color:var(--text-dim)}.error{color:var(--danger);font-size:.85rem;margin-top:.25rem}.dashboard{display:grid;grid-template-columns:320px 1fr;flex:1;min-height:0}.sidebar{border-right:1px solid var(--border);background:var(--bg-elevated);overflow-y:auto}.sidebar-header{padding:.75rem 1rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}.sidebar-header h3{margin:0;font-size:.85rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em}.pack-list{list-style:none;margin:0;padding:.5rem}.pack-list li{padding:.6rem .75rem;border-radius:6px;cursor:pointer;color:var(--text)}.pack-list li:hover{background:#ffffff0a}.pack-list li.active{background:#4f8cff26;color:var(--accent)}.player{padding:1.25rem 1.5rem;overflow-y:auto}.player h2{margin:0 0 1rem}.now-playing{background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;padding:1rem;margin-bottom:1.25rem}.now-playing .title{font-size:1rem;margin-bottom:.5rem;word-break:break-all}.now-playing audio,.now-playing video{width:100%}.queue{list-style:none;margin:0;padding:0;border:1px solid var(--border);border-radius:10px;overflow:hidden}.queue li{display:flex;align-items:center;gap:.75rem;padding:.65rem .85rem;border-top:1px solid var(--border);cursor:pointer}.queue li:first-child{border-top:0}.queue li:hover{background:#ffffff0a}.queue li.current{background:#4f8cff1f;color:var(--accent)}.queue .index{width:1.75rem;color:var(--text-dim);text-align:right;font-variant-numeric:tabular-nums}.queue .name{flex:1;word-break:break-all}.empty,.loading{color:var(--text-dim);padding:1rem}
