:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}body{color:#1a1a2e;background:#faf7ff;margin:0}@media (prefers-color-scheme:dark){body{color:#ece9f5;background:#14101f}}.shell{max-width:44rem;margin:3rem auto;padding:0 1.5rem}h1{margin-bottom:1.5rem;font-size:1.75rem}.card{background:#805ad50f;border:1px solid #805ad54d;border-radius:.75rem;padding:1.5rem}.card.error{background:#dc26260f;border-color:#dc262666}.account-bar{border-bottom:1px solid #805ad540;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;padding:.4rem .75rem;display:flex}.muted{opacity:.7;font-size:.9rem}button{color:#fff;cursor:pointer;background:#805ad5;border:none;border-radius:.5rem;margin-top:.5rem;padding:.5rem 1.25rem;font-size:1rem}button:hover{background:#6b46c1}button:disabled{opacity:.5;cursor:default}.btn-secondary{color:#805ad5;background:0 0;border:1px solid #805ad566;margin-top:0;padding:.25rem .65rem;font-size:.8rem}.btn-secondary:hover{background:#805ad51a}.btn-secondary:focus-visible{outline-offset:1px;outline:2px solid #805ad5}@media (prefers-color-scheme:dark){.btn-secondary{color:#b794f4}}.library{margin-top:1.5rem}.tabs{gap:.5rem;margin-bottom:1rem;display:flex}.tab{color:inherit;background:0 0;border:1px solid #805ad566}.tab.active{color:#fff;background:#805ad5}.controls{flex-wrap:wrap;align-items:flex-end;gap:.75rem;margin-bottom:1rem;display:flex}.controls input[type=search]{color:inherit;background:#805ad50f;border:1px solid #805ad54d;border-radius:.5rem;flex:12rem;padding:.5rem .75rem}.controls label{opacity:.85;flex-direction:column;gap:.2rem;font-size:.8rem;display:flex}.controls select{color:inherit;background:#805ad50f;border:1px solid #805ad54d;border-radius:.5rem;padding:.4rem}.controls button{margin-top:0}.modal-overlay{z-index:100;background:#14101f8c;justify-content:center;align-items:flex-start;padding:2.5rem 1rem;display:flex;position:fixed;inset:0;overflow-y:auto}.modal{background:#faf7ff;border:1px solid #805ad54d;border-radius:.75rem;width:100%;max-width:32rem;padding:1.5rem;box-shadow:0 12px 40px #0000004d}@media (prefers-color-scheme:dark){.modal{background:#1c1730}}.modal-title{margin:0 0 1rem;font-size:1.2rem}.song-form{flex-direction:column;gap:.75rem;display:flex}.form-row{flex-wrap:wrap;gap:.75rem;display:flex}.form-row label{flex:10rem}.song-form label{opacity:.85;flex-direction:column;gap:.2rem;font-size:.8rem;display:flex}.song-form input[type=text],.song-form select{color:inherit;background:#805ad50f;border:1px solid #805ad54d;border-radius:.5rem;padding:.5rem .75rem}.form-dns{opacity:1;align-items:center;gap:.4rem;font-size:.95rem;flex-direction:row!important}.form-dns input{margin-top:0}.form-actions{align-items:center;gap:.5rem;display:flex}.warn-text{color:#b45309;margin:0;font-size:.85rem}@media (prefers-color-scheme:dark){.warn-text{color:#fbbf24}}.songs{margin:0;padding:0;list-style:none}.song-row{border-bottom:1px solid #805ad533;grid-template-columns:minmax(0,1fr) 7rem 4rem;align-items:center;column-gap:.75rem;padding:.4rem 0;display:grid}.songs.reorderable .song-row{grid-template-columns:2.4rem minmax(0,1fr) 7rem 4rem}.song-row-clickable{cursor:pointer}.song-row-clickable:hover{background:#805ad512}.song-row-clickable:focus-visible{outline-offset:-2px;border-radius:.4rem;outline:2px solid #805ad5}.song-row.dragging{opacity:.6;background:#805ad51a}.song-head{text-transform:uppercase;letter-spacing:.05em;opacity:.55;padding:.25rem 0;font-size:.7rem}.col-drag{justify-content:center;align-items:center;display:flex}.drag-handle{color:#9ca3af;cursor:grab;touch-action:none;background:0 0;border:none;border-radius:6px;margin:0;padding:.25rem .4rem;font-size:1rem;line-height:1}.drag-handle:hover,.drag-handle:focus-visible{color:#6b46c1;background:#805ad51f}.drag-handle:active{cursor:grabbing}@media (prefers-color-scheme:dark){.drag-handle:hover,.drag-handle:focus-visible{color:#d6bcfa}}.col-title{flex-direction:column;min-width:0;display:flex}.col-title strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.col-artist-sub{text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;overflow:hidden}.col-played{text-align:center}.song-note{opacity:.7;text-overflow:ellipsis;white-space:nowrap;font-size:.78rem;overflow:hidden}.song-note.reason{color:#b91c1c;opacity:1}.readiness-pill{color:#6b46c1;white-space:nowrap;text-overflow:ellipsis;background:#805ad524;border-radius:999px;max-width:100%;padding:.1rem .5rem;font-size:.78rem;display:inline-block;overflow:hidden}@media (prefers-color-scheme:dark){.readiness-pill{color:#d6bcfa}}.played-toggle{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;min-width:2.5rem;min-height:2.5rem;margin:0;padding:0;font-size:1.1rem;line-height:1;display:inline-flex}.played-toggle:hover,.played-toggle:focus-visible{background:#805ad51f}.played-toggle.played-yes{color:#15803d;font-weight:700}.played-toggle.pending{opacity:.55}.played-yes{color:#15803d;font-weight:700}@media (width<=34rem){.song-row{grid-template-columns:minmax(0,1fr) 6rem 3rem}.songs.reorderable .song-row{grid-template-columns:2.2rem minmax(0,1fr) 6rem 3rem}}.error-text{color:#b91c1c}.toasts{z-index:50;flex-direction:column;gap:.5rem;width:max-content;max-width:90vw;display:flex;position:fixed;bottom:1.25rem;left:50%;transform:translate(-50%)}.toast{color:#fff;background:#b91c1c;border-radius:8px;padding:.6rem 1rem;font-size:.85rem;box-shadow:0 4px 12px #00000040}