: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}.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}.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}.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{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 .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}.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}.code .instruments{color:var(--dim);font-size:11px;margin:6px 0 0}.rate{grid-area:rate;display:flex;gap:4px}.rate .block{width:18px;height:18px;cursor:pointer;background:transparent;border:1px solid var(--dim);padding:0}.rate .block:hover{border-color:var(--acid)}.rate .block.on{background:var(--acid);border-color:var(--acid)}.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}.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}}.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:15px;height:15px;padding:0 3px;display:grid;place-items:center;background:var(--hot);color:var(--bg);border:1px solid var(--bg);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 .failed{color:var(--hot)}.job-log .failed:before{content:"✕ "}.job-log .empty{color:var(--dim)}.job-log a:last-child,.job-log>span:last-child{border-bottom:0}.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)}.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}