:root{--bg: #0c0d0a;--panel: #13150e;--ink: #e9edda;--dim: #7c856e;--acid: #c8f53c;--hot: #ff5ca8;--line: #2b2f20;--mono: "IBM Plex Mono", monospace;--display: "Bricolage Grotesque", sans-serif}*{box-sizing:border-box;margin:0}body{background:repeating-linear-gradient(0deg,transparent 0 2px,rgb(255 255 255 / .012) 2px 4px),radial-gradient(1200px 500px at 70% -10%,#1a2110 0%,transparent 60%),var(--bg);color:var(--ink);font-family:var(--mono);font-size:14px;padding-bottom:72px;font-variant-emoji:text}.masthead{position:sticky;top:0;z-index:10;display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:20px 28px 14px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(6px);border-bottom:2px solid var(--acid)}.masthead h1{font-family:var(--display);font-weight:800;font-size:28px;letter-spacing:-.03em}.masthead h1 span{color:var(--acid)}.nav{display:flex}.nav a{color:var(--dim);text-decoration:none;font-size:12px;border:1px solid var(--line);padding:6px 14px}.nav a+a{border-left:0}.nav a:hover{color:var(--acid)}.nav a.on{background:var(--acid);color:var(--bg);font-weight:600;border-color:var(--acid)}.filters{display:flex;gap:12px;align-items:center}.filters select,.seg button{background:var(--panel);color:var(--ink);border:1px solid var(--line);font-family:var(--mono);font-size:12px;padding:6px 10px;cursor:pointer}.filters select{max-width:220px;text-overflow:ellipsis}.seg{display:flex}.seg button+button{border-left:0}.seg button.on{background:var(--acid);color:var(--bg);font-weight:600}.batch{padding:28px 28px 8px;max-width:1100px;margin:0 auto}.batch h2{font-family:var(--display);font-weight:600;font-size:15px;color:var(--acid);text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}.batch h2 span{color:var(--dim);font-family:var(--mono);font-weight:400;text-transform:none;letter-spacing:0;margin-left:12px}.track{display:grid;grid-template-columns:56px 1fr 130px minmax(220px,1.2fr);grid-template-areas:"play meta rate notes" "play code code notes";gap:8px 16px;align-items:center;border:1px solid var(--line);background:var(--panel);padding:12px 16px;margin-bottom:10px;transition:border-color .15s ease}.track:hover{border-color:var(--dim)}.track.playing{border-color:var(--acid);box-shadow:0 0 24px #c8f53c1f}.track.cued{border-color:var(--acid);animation:cue-pulse 1.2s ease-out 2}.track.cued:not(.playing){box-shadow:0 0 0 1px var(--acid),0 0 18px #c8f53c2e}@keyframes cue-pulse{0%{box-shadow:0 0 #c8f53c80}to{box-shadow:0 0 0 12px #c8f53c00}}.track .by{display:block;font-size:.8rem;opacity:.7;margin:.1rem 0}.play{grid-area:play;width:48px;height:48px;background:transparent;color:var(--acid);border:1px solid var(--acid);font-size:16px;cursor:pointer}.play:hover{background:var(--acid);color:var(--bg)}.track.playing .play,.play.playing{background:var(--acid)}.eq{display:inline-flex;gap:3px;align-items:flex-end;height:18px}.eq i{width:4px;background:var(--bg);animation:eq .5s ease-in-out infinite alternate}.eq i:nth-child(2){animation-delay:.15s}.eq i:nth-child(3){animation-delay:.3s}@keyframes eq{0%{height:4px}to{height:18px}}.meta{grid-area:meta;min-width:0}.meta h3{font-family:var(--display);font-weight:600;font-size:17px}.meta h3 .title-link{color:inherit;text-decoration:none}.meta h3 .title-link:hover{color:var(--acid);text-decoration:underline}.meta .id{color:var(--dim);font-size:11px}.meta .desc{color:var(--dim);font-size:12px;margin-top:4px;max-width:60ch}.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.chip{font-size:11px;color:var(--acid);border:1px solid var(--line);padding:2px 8px;background:var(--bg);white-space:nowrap}.plays{display:block;margin-top:4px;font-size:11px;color:var(--dim);font-family:var(--mono)}.plays.has-breakdown{cursor:pointer}.plays.has-breakdown:hover .plays-total,.plays.has-breakdown.open .plays-total,.plays-breakdown{display:none}.plays.has-breakdown:hover .plays-breakdown,.plays.has-breakdown.open .plays-breakdown{display:inline;color:var(--acid)}.unplayed-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--acid);margin-right:6px;vertical-align:middle}.exports{display:flex;gap:6px;margin-top:8px}.export{background:transparent;color:var(--dim);border:1px solid var(--line);font-family:var(--mono);font-size:11px;padding:2px 8px;cursor:pointer}.export:hover:not(:disabled){color:var(--acid);border-color:var(--acid)}.export:disabled{opacity:.5;cursor:default}.export-rendering{background-image:linear-gradient(to right,color-mix(in srgb,var(--acid) 22%,transparent) 0% var(--export-fill, 0%),transparent var(--export-fill, 0%) 100%);opacity:1!important;transition:background-image .35s ease}@keyframes export-border-pulse{0%,to{border-color:var(--dim)}50%{border-color:color-mix(in srgb,var(--acid) 55%,transparent)}}.export-rendering--indeterminate{animation:export-border-pulse 1.6s ease-in-out infinite}.code .instruments{color:var(--dim);font-size:11px;margin:6px 0 0}.rate{grid-area:rate;display:flex;align-items:center;gap:4px;flex-wrap:wrap}.rate .block{width:15px;height:15px;cursor:pointer;background:transparent;border:1px solid var(--dim);padding:0;transition:background-color .12s ease,border-color .12s ease}.rate .block:hover:not(:disabled){border-color:var(--acid)}.rate .block.on{background:var(--acid);border-color:var(--acid)}.rate .block:disabled{cursor:default;opacity:.45}.agg{margin-left:6px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);white-space:nowrap}.agg.rated{font-size:11px;letter-spacing:.02em;text-transform:none;color:var(--ink)}.agg .star{color:var(--acid)}.agg .agg-n{color:var(--dim)}.feedback{grid-area:notes;display:flex;flex-direction:column;gap:6px;min-width:0}.notes{background:var(--bg);color:var(--ink);border:1px solid var(--line);font-family:var(--mono);font-size:12px;padding:8px;min-height:56px;resize:vertical;transition:border-color .3s ease}.lesson{min-height:36px;border-style:dashed}.notes:focus{outline:none;border-color:var(--dim)}.notes.saved{border-color:var(--acid)}.notes.error,.track.error{border-color:var(--hot)}.code{grid-area:code;font-size:12px}.code summary{color:var(--dim);cursor:pointer;user-select:none}.code summary:hover{color:var(--acid)}.code .eval-error{color:var(--hot);font-size:11px;margin:6px 0 0}.code .editor{margin-top:6px;border-left:2px solid var(--acid);--background: var(--bg);--foreground: var(--acid)}.code .editor .cm-editor{padding:6px 4px}#transport{position:fixed;inset:auto 0 0;z-index:10;display:flex;align-items:center;gap:20px;padding:12px 28px;background:var(--bg);border-top:1px solid var(--line)}.status{color:var(--dim);font-size:12px}.status.ready{color:var(--acid)}#now-playing{flex:1;color:var(--hot);font-size:12px;letter-spacing:.06em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#stop{background:var(--hot);color:var(--bg);border:0;font-family:var(--display);font-weight:700;font-size:14px;padding:8px 22px;cursor:pointer}#stop:disabled{background:var(--line);color:var(--dim);cursor:default}#stop.is-play:not(:disabled){background:var(--acid)}.seekbar{flex:1;display:flex;align-items:center;gap:10px;min-width:0}.seekbar[hidden]{display:none}.time{color:var(--dim);font-size:11px;min-width:36px;font-variant-numeric:tabular-nums}.time:last-child{text-align:right}.seek-rail{flex:1;height:6px;background:var(--line);position:relative;cursor:pointer;touch-action:none}.seek-fill{height:100%;width:0;background:var(--hot);pointer-events:none}.brand{display:flex;align-items:center;gap:12px}.sig{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--hot);white-space:nowrap;user-select:none}.empty{padding:48px 28px;color:var(--dim)}.empty code{color:var(--acid)}@media(max-width:760px){.track{grid-template-columns:56px 1fr;grid-template-areas:"play meta" "play rate" "code code" "notes notes"}.sig{display:none}.masthead{align-items:center;gap:10px 12px;padding:11px 16px 9px;border-bottom-width:1px}.masthead h1{font-size:19px}.batch{padding:20px 16px 8px}.nav{margin-left:auto}.nav a{padding:6px 11px}.job-bell{padding:0 10px}.user{order:2}.user .auth-btn{margin-left:0;padding:6px 11px}.user-chip{max-width:124px;padding:6px 10px}.filters{order:3;width:100%;flex-wrap:wrap;gap:8px}.filters select{flex:1 1 0;min-width:0}.seg{flex-basis:100%}.seg button{flex:1}.chips{width:100%}.chip{white-space:normal}.generate{padding:12px 16px;gap:8px}#gen-prompt{flex-basis:100%;min-width:0}.gen-status{margin-left:0}.auth-modal{padding:16px}.auth-card{width:min(380px,100vw - 32px);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow-y:auto;padding:22px 18px 18px}.lessons-list{max-height:none}body{padding-bottom:116px}#transport{flex-wrap:wrap;gap:12px 16px;padding:12px 16px}.status{display:none}#now-playing{flex:1 1 0}.seekbar{order:3;flex-basis:100%}.seek-rail{height:16px}}.versions{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.version{background:transparent;color:var(--dim);border:1px solid var(--line);font-family:var(--mono);font-size:11px;padding:2px 8px;cursor:pointer}.version:hover{color:var(--acid);border-color:var(--acid)}.version.on{background:var(--acid);color:var(--bg);border-color:var(--acid)}.generate{display:flex;align-items:center;gap:12px;flex-wrap:wrap;max-width:1100px;margin:0 auto;padding:14px 28px;border-bottom:1px solid var(--line)}.generate[hidden]{display:none}.gen-label{font-family:var(--display);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:var(--acid);white-space:nowrap;user-select:none}.gen-label:before{content:"▸";margin-right:7px}.gen-x{color:var(--dim);font-size:13px;user-select:none}.generate input{background:var(--bg);color:var(--ink);border:1px solid var(--line);font-family:var(--mono);font-size:13px;padding:9px 11px;transition:border-color .15s ease,box-shadow .15s ease}.generate input::placeholder{color:var(--dim)}.generate input:focus{outline:none;border-color:var(--acid);box-shadow:inset 0 0 0 1px var(--acid)}#gen-prompt{flex:1;min-width:200px;caret-color:var(--acid)}#gen-count{width:60px;text-align:center;caret-color:var(--acid)}#gen-go{background:var(--acid);color:var(--bg);border:1px solid var(--acid);font-family:var(--display);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.04em;padding:9px 22px;cursor:pointer;transition:background .15s ease,color .15s ease}#gen-go:hover{background:transparent;color:var(--acid)}#gen-go:active{transform:translateY(1px)}#gen-revise{background:transparent;color:var(--dim);border:1px solid var(--line);font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.04em;padding:9px 14px;cursor:pointer;transition:color .15s ease,border-color .15s ease}#gen-revise:hover{color:var(--acid);border-color:var(--dim)}.gen-status{font-family:var(--mono);font-size:12px;color:var(--dim);letter-spacing:.04em;white-space:nowrap;margin-left:auto}.gen-status.busy{color:var(--acid)}.gen-status.busy:before{content:"●";margin-right:7px;animation:gen-blink 1s steps(1,end) infinite}.gen-status.err{color:var(--hot)}@keyframes gen-blink{50%{opacity:0}}.job-bell{position:relative;display:inline-flex;align-items:center;background:transparent;color:var(--dim);border:1px solid var(--line);border-left:0;padding:0 12px;cursor:pointer;transition:color .15s ease}.job-bell:hover{color:var(--acid)}.job-bell .bell-ico{display:block}.job-unread{position:absolute;top:-7px;right:-7px;min-width:16px;height:16px;padding:0 4px;display:grid;place-items:center;background:var(--hot);color:var(--bg);border:1px solid var(--bg);border-radius:999px;font-family:var(--mono);font-weight:700;font-size:10px;line-height:1}.job-unread[hidden]{display:none}.job-log{position:fixed;top:58px;right:28px;z-index:30;width:min(360px,calc(100vw - 56px));display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--acid);box-shadow:0 16px 40px #0000008c,0 0 28px #c8f53c1a;max-height:62vh;overflow-y:auto;animation:job-log-in .15s ease}.job-log[hidden]{display:none}@keyframes job-log-in{0%{opacity:0;transform:translateY(-8px)}}.job-log:before{content:"recent jobs";position:sticky;top:0;z-index:1;font-family:var(--display);font-weight:700;font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:var(--dim);padding:10px 12px 8px;background:var(--panel);border-bottom:1px solid var(--line)}.job-log a,.job-log>span{display:block;word-break:break-word;font-family:var(--mono);font-size:12px;line-height:1.4;padding:9px 12px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}.job-log a{transition:background .12s ease,color .12s ease}.job-log a:before{content:"▸ ";color:var(--acid)}.job-log a:hover{background:var(--acid);color:var(--bg)}.job-log a:hover:before{color:var(--bg)}.job-log .active{color:var(--acid);font-variant-numeric:tabular-nums}.job-log .empty{color:var(--dim)}.job-log a:last-child,.job-log>span:last-child,.job-log .job-row:last-child{border-bottom:0}.job-log .job-row{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;line-height:1.4;padding:9px 12px;border-bottom:1px solid var(--line)}.job-row.failed .job-row-text{flex:1;min-width:0;color:var(--hot);word-break:break-word}.job-row.failed .job-row-text:before{content:"✕ "}.job-retry{flex:none;cursor:pointer;font-family:var(--mono);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap;color:var(--acid);background:transparent;border:1px solid var(--acid);padding:4px 8px;transition:background .12s ease,color .12s ease,box-shadow .12s ease,transform .06s ease}.job-retry:hover{background:var(--acid);color:var(--bg);box-shadow:0 0 12px #c8f53c73}.job-retry:active{transform:translateY(1px)}.job-retry:focus-visible{outline:1px solid var(--acid);outline-offset:2px}.job-requeued{flex:none;white-space:nowrap;font-family:var(--mono);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--dim)}.job-log::-webkit-scrollbar{width:9px}.job-log::-webkit-scrollbar-thumb{background:var(--line)}.job-log::-webkit-scrollbar-track{background:transparent}.auth-btn{margin-left:8px;background:transparent;color:var(--dim);border:1px solid var(--line);font-family:var(--mono);font-size:12px;padding:6px 14px;cursor:pointer}.auth-btn:hover{color:var(--acid);border-color:var(--acid)}.user{display:flex;align-items:center}.user-chip{display:inline-flex;align-items:center;gap:6px;max-width:180px;background:transparent;color:var(--ink);border:1px solid var(--line);font-family:var(--mono);font-size:12px;padding:6px 12px;cursor:pointer}.user-chip:hover{color:var(--acid);border-color:var(--acid)}.user-chip[hidden]{display:none}.user-chip-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-chip-caret{color:var(--dim);font-size:10px}.auth-modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(3px);padding:20px}.auth-modal[hidden]{display:none}.auth-card{position:relative;width:min(380px,100%);background:var(--panel);border:2px solid var(--acid);padding:26px 24px 24px;box-shadow:0 0 40px #c8f53c1f}.auth-card h2{font-family:var(--display);font-weight:700;font-size:22px;color:var(--acid);text-transform:uppercase;letter-spacing:.06em}.auth-sub{color:var(--dim);font-size:12px;margin:8px 0 18px;line-height:1.5}.auth-card form{display:flex;gap:8px}.auth-card form[hidden]{display:none}.auth-card input{flex:1;min-width:0;background:var(--bg);color:var(--ink);border:1px solid var(--line);font-family:var(--mono);font-size:13px;padding:9px 11px}.auth-card input:focus{outline:none;border-color:var(--acid)}.auth-card form button{background:var(--acid);color:var(--bg);border:1px solid var(--acid);font-family:var(--mono);font-size:12px;font-weight:600;padding:9px 14px;cursor:pointer;white-space:nowrap}.auth-card form button:hover{background:color-mix(in srgb,var(--acid) 82%,var(--ink))}.auth-x{position:absolute;top:8px;right:10px;background:none;border:0;color:var(--dim);font-size:22px;line-height:1;cursor:pointer}.auth-x:hover{color:var(--hot)}.auth-err{color:var(--hot);font-size:12px;margin-top:12px}.profile-saved{color:var(--acid);font-size:12px;margin-top:10px}.profile-saved[hidden]{display:none}.profile-email{color:var(--dim);font-size:12px;margin-top:16px;word-break:break-all}.profile-stats{color:var(--dim);font-size:12px;margin-top:4px}.profile-stats[hidden]{display:none}.profile-signout{margin-top:20px;width:100%;background:transparent;color:var(--dim);border:1px solid var(--line);font-family:var(--mono);font-size:12px;padding:9px;cursor:pointer}.profile-signout:hover{color:var(--hot);border-color:var(--hot)}.profile-lessons{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}.profile-lessons h3{font-family:var(--mono);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--ink)}.lessons-hint{color:var(--dim);font-weight:400;text-transform:none;letter-spacing:0}.lessons-list{list-style:none;margin:12px 0 0;padding:0;max-height:260px;overflow-y:auto;display:flex;flex-direction:column;gap:10px}.lesson-row{display:flex;flex-direction:column;gap:6px}.lesson-text,.lesson-add textarea{width:100%;box-sizing:border-box;resize:vertical;background:var(--bg);color:var(--ink);border:1px solid var(--line);font-family:var(--mono);font-size:12px;padding:8px 10px;line-height:1.4}.lesson-text:focus,.lesson-add textarea:focus{outline:none;border-color:var(--acid)}.lesson-text.flash-error,.lesson-add textarea.flash-error{border-color:var(--hot)}.lesson-row-meta,.lesson-add-row{display:flex;align-items:center;gap:8px}.lesson-from{color:var(--dim);font-size:11px;font-style:italic;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lesson-del{flex:none;background:none;border:1px solid var(--line);color:var(--dim);font-size:14px;line-height:1;width:24px;height:24px;cursor:pointer;padding:0}.lesson-del:hover{color:var(--hot);border-color:var(--hot)}.lesson-target{display:inline-flex;flex:none;border:1px solid var(--line)}.lesson-target button{background:var(--bg);color:var(--dim);border:0;font-family:var(--mono);font-size:11px;font-weight:600;padding:5px 10px;cursor:pointer}.lesson-target button+button{border-left:1px solid var(--line)}.lesson-target button.on{background:var(--acid);color:var(--bg)}.lesson-target button:not(.on):hover{color:var(--ink)}.lesson-add{display:flex;flex-direction:column;gap:8px;margin-top:12px}.lesson-add-row{justify-content:space-between}.lesson-add-btn{flex:none}.profile-access{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}.profile-access h3{font-family:var(--mono);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--ink)}.access-list{list-style:none;margin:12px 0 0;padding:0;max-height:260px;overflow-y:auto;display:flex;flex-direction:column;gap:10px}.access-row{display:flex;align-items:center;gap:8px}.access-row span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--mono);font-size:12px;color:var(--ink)}.access-del{flex:none;background:none;border:1px solid var(--line);color:var(--dim);font-size:14px;line-height:1;width:24px;height:24px;cursor:pointer;padding:0}.access-del:hover{color:var(--hot);border-color:var(--hot)}.access-add{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.access-add input[type=email]{flex:1 1 0;min-width:0;box-sizing:border-box;background:var(--bg);color:var(--ink);border:1px solid var(--line);font-family:var(--mono);font-size:12px;padding:8px 10px}.access-add input[type=email]:focus{outline:none;border-color:var(--acid)}.access-add-btn{flex:none}#song{max-width:900px;margin:0 auto;padding:24px 20px 96px}.song-back{color:var(--dim);text-decoration:none;font-size:12px}.song-back:hover{color:var(--acid)}.song-head{display:flex;align-items:center;gap:16px;margin:20px 0 8px}.song-play{width:52px;height:52px;font-size:22px;flex:none}.song-title{min-width:0;flex:1}.song-title h2{font-family:var(--display);font-weight:700;font-size:26px;line-height:1.1}.song-title .by{color:var(--dim);font-size:12px}.song-share{flex:none}.song-meta{margin:4px 0 16px}.song-meta .chips{display:flex;flex-wrap:wrap;gap:6px}.song-meta .desc{color:var(--dim);font-size:13px;margin-top:10px;max-width:70ch}.song-prompt{color:var(--dim);font-size:12px;margin-top:8px;font-style:italic;max-width:70ch}.song-editor{margin:8px 0 20px}.song-editor .eval-error{color:var(--hot);font-size:12px;margin:0 0 6px}.song-versions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.song-versions-label{color:var(--dim);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.song-versions .version{color:var(--dim);text-decoration:none;font-size:12px;padding:3px 8px;border:1px solid var(--line);font-family:var(--mono)}.song-versions .version:hover{color:var(--acid);border-color:var(--acid)}.song-versions .version.on{background:var(--acid);color:var(--bg);border-color:var(--acid)}.toast{position:fixed;bottom:84px;left:50%;transform:translate(-50%) translateY(8px);background:var(--acid);color:var(--bg);font-family:var(--mono);font-size:12px;font-weight:600;padding:8px 16px;border-radius:2px;pointer-events:none;opacity:0;transition:opacity .18s,transform .18s;z-index:50}.toast.on{opacity:1;transform:translate(-50%) translateY(0)}