:root{--ink: #070d10;--soil: #0c1519;--bark: #122027;--moss-line: #1f343a;--leaf: #cfe6d6;--leaf-dim: #8fa89b;--leaf-faint: #5d7468;--glow: #ffd97a;--accent: #9be3b7;--warn: #f5c16c;--error: #ff8a7a;--t0: #8fcf73;--t1: #f497bd;--t2: #93a8ff;--t3: #f3cd62;--radius: 14px;--serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;--sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:radial-gradient(1200px 600px at 15% -10%,#173028 0%,transparent 60%),radial-gradient(900px 500px at 110% 10%,#1b2140 0%,transparent 55%),var(--ink);color:var(--leaf);font:14px/1.45 var(--sans);-webkit-font-smoothing:antialiased}button,input,select{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--glow);outline-offset:2px}.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.topbar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:14px 22px;border-bottom:1px solid var(--moss-line);background:linear-gradient(180deg,#0a1416e6,#070d1099);position:sticky;top:0;z-index:8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.brand{display:flex;align-items:center;gap:10px;margin-right:auto}.brand>.btn{margin-left:6px}.brand h1{font:600 22px/1 var(--serif);letter-spacing:.01em;margin:0;color:#eaf6ec}.brand .tag{margin:3px 0 0;font:italic 13px/1 var(--serif);color:var(--leaf-dim)}.sprout{width:34px;height:34px;color:var(--accent);filter:drop-shadow(0 0 8px rgba(155,227,183,.35))}.transport{display:flex;align-items:center;gap:8px}.readout{font:12px var(--mono);color:var(--leaf-dim);min-width:118px;font-variant-numeric:tabular-nums}.globals{display:flex;gap:14px;flex-wrap:wrap}.globals .field{min-width:150px}.btn{border:1px solid #2c4a45;background:linear-gradient(180deg,#1c3a35,#142a27);color:#e3f5e8;border-radius:999px;padding:7px 14px;cursor:pointer;transition:background .15s,border-color .15s,transform .08s}.btn:hover{border-color:var(--accent)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.6;cursor:progress}.btn.ghost{background:transparent;border-color:var(--moss-line);color:var(--leaf)}.btn.ghost:hover{border-color:var(--leaf-dim)}.btn.small{padding:4px 10px;font-size:12px}.btn.play{width:46px;height:46px;padding:0;font-size:16px;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#ffe9a8,#e4a93c 70%);color:#2a1a04;border:none;box-shadow:0 0 0 3px #ffd97a26,0 0 24px #ffc85a40}.btn.play.on{background:radial-gradient(circle at 35% 30%,#d8ffe6,#58b985 70%);box-shadow:0 0 0 3px #9be3b733,0 0 26px #78dca059}.transport .btn.ghost{width:36px;height:36px;padding:0;border-radius:50%}.field{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}.field.wide{grid-template-columns:56px 1fr}.lab{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--leaf-faint)}.val{font:12px var(--mono);color:var(--leaf-dim);min-width:48px;text-align:right;font-variant-numeric:tabular-nums}input[type=text],input[type=number],select{background:#0b1619;border:1px solid var(--moss-line);border-radius:9px;padding:6px 9px;min-width:0;width:100%}input[type=text]:focus,input[type=number]:focus,select:focus{border-color:var(--accent);outline:none}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;cursor:pointer;background:transparent;min-width:70px}input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(90deg,#2a4a44,#3c6a5d)}input[type=range]::-moz-range-track{height:3px;border-radius:3px;background:linear-gradient(90deg,#2a4a44,#3c6a5d)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-7.5px;border-radius:50%;background:#dff5e6;box-shadow:0 0 0 3px #9be3b72e}input[type=range]::-moz-range-thumb{width:18px;height:18px;border:none;border-radius:50%;background:#dff5e6}.layout{display:grid;gap:18px;padding:18px 22px 40px;grid-template-columns:minmax(0,1fr) 330px;grid-template-areas:"stage side" "beds side";grid-template-rows:auto 1fr;align-items:start;max-width:1500px;margin:0 auto}.stage{grid-area:stage;position:sticky;top:calc(var(--topbar-height, 76px) + 8px);z-index:6;border-radius:20px;overflow:hidden;border:1px solid var(--moss-line);height:clamp(200px,calc(46vh - var(--topbar-height, 76px) / 2),540px);min-height:200px;box-shadow:0 30px 80px -40px #000000e6;background:#050a0c}.garden{display:block;width:100%;height:100%}.stage-caption{position:absolute;left:22px;top:18px;pointer-events:none;max-width:60%}.scene-title{margin:0;font:italic 600 28px/1.1 var(--serif);color:#f1f8f1;text-shadow:0 2px 18px rgba(0,0,0,.8)}.scene-blurb{margin:6px 0 0;color:var(--leaf-dim);font:14px/1.4 var(--serif);text-shadow:0 1px 10px rgba(0,0,0,.9)}.bed-wrap{grid-area:beds}.side{grid-area:side;display:flex;flex-direction:column;gap:14px}.panel{background:linear-gradient(180deg,#122027b8,#0c1519b8);border:1px solid var(--moss-line);border-radius:var(--radius);padding:14px 16px 16px;display:grid;gap:10px}.panel h3,.bed-head h3{margin:0;font:600 15px/1 var(--serif);letter-spacing:.02em;color:#e8f4ea}.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.row3{display:grid;grid-template-columns:1fr 1.3fr;gap:8px}.row3 .field{grid-template-columns:1fr;gap:4px}.seedrow{display:flex;gap:6px}.fine{margin:0;font-size:12px;color:var(--leaf-faint)}.presets{display:grid;gap:6px}.preset{--h: 160;display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:10px;text-align:left;padding:8px 10px;border-radius:11px;border:1px solid transparent;background:#ffffff05;cursor:pointer}.preset:hover{border-color:var(--moss-line);background:#ffffff0a}.preset.active{border-color:hsl(var(--h) 60% 45% / .7);background:hsl(var(--h) 50% 30% / .18)}.swatch{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 35%,hsl(calc(var(--h) + 40) 90% 75%),hsl(var(--h) 70% 38%) 60%,hsl(calc(var(--h) + 180) 50% 10%));box-shadow:0 0 12px hsl(var(--h) 80% 50% / .4)}.pname{font:600 14px var(--serif);color:#eef7ee}.pmeta{font:11px var(--mono);color:var(--leaf-faint)}.library{list-style:none;margin:0;padding:0;display:grid;gap:4px;max-height:190px;overflow:auto}.library li{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:4px 0;border-bottom:1px dashed #1a2c31}.library li.empty{display:block;color:var(--leaf-faint);font-size:12px;border:none}.library li.err{color:var(--error)}.library time{font:11px var(--mono);color:var(--leaf-faint)}.linkish{background:none;border:none;padding:0;color:var(--leaf);text-align:left;cursor:pointer;font:14px var(--serif);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.linkish:hover{color:var(--glow)}.del.armed{border-color:var(--error);color:var(--error)}.progress{height:4px;border-radius:4px;background:#13262a;overflow:hidden}.progress span{display:block;height:100%;width:40%;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:sweep 1.1s linear infinite}@keyframes sweep{0%{transform:translate(-100%)}to{transform:translate(250%)}}.bed-head{display:flex;align-items:baseline;gap:14px;margin:2px 2px 10px;flex-wrap:wrap}.hint{margin:0;font-size:12px;color:var(--leaf-faint)}.beds{display:grid;gap:10px}.bed{--c: var(--t0);display:grid;grid-template-columns:250px 1fr;gap:12px;align-items:center;padding:10px 12px;border-radius:var(--radius);background:linear-gradient(90deg,color-mix(in srgb,var(--c) 7%,transparent),#0c151999 40%);border:1px solid var(--moss-line);transition:opacity .2s}.bed.t1{--c: var(--t1)}.bed.t2{--c: var(--t2)}.bed.t3{--c: var(--t3)}.bed.muted{opacity:.45}.track-head{display:grid;grid-template-columns:30px 1fr;grid-template-rows:auto auto;gap:2px 10px;align-items:center}.chip{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;grid-row:span 2;font-size:15px;color:#0a1210;background:var(--c, var(--t0));box-shadow:0 0 14px color-mix(in srgb,var(--c, var(--t0)) 45%,transparent)}.chip.t0{--c: var(--t0)}.chip.t1{--c: var(--t1)}.chip.t2{--c: var(--t2)}.chip.t3{--c: var(--t3)}.tname{font:600 15px/1.1 var(--serif);color:#eef7ee;display:flex;gap:8px;align-items:baseline}.tname small{font:11px var(--mono);color:var(--leaf-faint);font-weight:400}.tctl{display:grid;grid-template-columns:1fr 52px 30px;gap:6px;align-items:center}.oct{padding:3px 4px;font-size:12px}.mute{width:28px;height:26px;border-radius:8px;border:1px solid var(--moss-line);background:transparent;color:var(--leaf-dim);cursor:pointer;font:600 11px var(--mono)}.mute.on{background:#3a2222;color:var(--error);border-color:#6b3434}.plots{display:grid;grid-template-columns:repeat(var(--steps, 16),minmax(0,1fr));gap:5px}.plot{position:relative;aspect-ratio:1 / 1.35;min-height:34px;border-radius:9px;cursor:pointer;padding:0;border:1px solid #1b2e33;background:linear-gradient(180deg,#0d1a1d,#0a1417);touch-action:pan-y;overflow:hidden}.plot.beat{background:linear-gradient(180deg,#10201f,#0b1618);border-color:#213a3b}.plot:nth-child(4n){margin-right:4px}.plot:hover{border-color:color-mix(in srgb,var(--c) 45%,#1b2e33)}.plot .bead{--lift: 0;position:absolute;left:50%;width:46%;aspect-ratio:1;border-radius:50%;bottom:calc(6% + var(--lift) * 70%);transform:translate(-50%) scale(0);background:radial-gradient(circle at 35% 30%,#fff 0%,var(--c) 45%,color-mix(in srgb,var(--c) 40%,#000) 100%);box-shadow:0 0 12px color-mix(in srgb,var(--c) 70%,transparent);transition:transform .14s ease-out,bottom .1s ease-out}.plot.on .bead{transform:translate(-50%) scale(1)}.plot .bead:before{content:"";position:absolute;left:50%;top:92%;width:2px;transform:translate(-50%);height:calc(var(--lift) * 205% + 10%);border-radius:2px;background:linear-gradient(180deg,color-mix(in srgb,var(--c) 70%,transparent),transparent)}.plot .deg{position:absolute;top:3px;right:5px;font:10px var(--mono);color:color-mix(in srgb,var(--c) 70%,#fff);opacity:.75}.plot.now{border-color:color-mix(in srgb,var(--glow) 55%,transparent);box-shadow:inset 0 0 0 1px #ffd97a40,0 0 16px -4px #ffd97a80}.plot.hit .bead{animation:hit .35s ease-out}@keyframes hit{0%{filter:brightness(2.2);transform:translate(-50%) scale(1.35)}to{filter:none;transform:translate(-50%) scale(1)}}.plot:focus-visible{outline:2px solid var(--glow);outline-offset:1px}.status{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#10201f;border:1px solid #2c4a45;color:var(--leaf);padding:10px 16px;border-radius:12px;box-shadow:0 16px 40px -10px #000c;transition:opacity .2s,transform .2s;max-width:min(560px,90vw);z-index:20}.status.show{opacity:1;transform:translate(-50%)}.status[data-kind=error]{border-color:#7a3a33;color:#ffd6cf;background:#2a1413}.status[data-kind=warn]{border-color:#7a6233}.onboarding{max-width:560px;width:calc(100vw - 32px);border-radius:18px;border:1px solid #2c4a45;padding:26px 28px 22px;background:radial-gradient(500px 240px at 0% 0%,#17302a,transparent),#0b1518;color:var(--leaf);box-shadow:0 40px 120px -20px #000000e6}.onboarding::backdrop{background:#030708b8;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.onboarding h2{margin:0 0 10px;font:italic 600 26px var(--serif);color:#f1f8f1}.onboarding p{margin:10px 0;color:#bdd3c5}.onboarding strong{color:#eaf6ec}.ob-list{list-style:none;padding:0;margin:12px 0;display:grid;gap:7px}.ob-list li{display:flex;gap:10px;align-items:center}.ob-list .chip{width:24px;height:24px;font-size:12px;grid-row:auto}.onboarding form{display:flex;justify-content:flex-end;margin-top:14px}@media(max-width:1100px){.layout{grid-template-columns:1fr;grid-template-areas:"stage" "beds" "side"}.side{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}}@media(max-width:760px){.stage{height:clamp(160px,32vh,300px);top:calc(var(--topbar-height, 120px) + 4px)}.topbar{padding:10px 14px;gap:10px}.globals{width:100%;display:grid;grid-template-columns:1fr;gap:4px}.layout{padding:12px 12px 40px;gap:14px}.stage{aspect-ratio:4 / 3.2;border-radius:16px}.scene-title{font-size:22px}.bed{grid-template-columns:1fr;padding:10px}.plots{gap:3px}.plot{min-height:30px;border-radius:6px}.plot:nth-child(4n){margin-right:2px}.plot .deg{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}.edit-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}.edit-state{color:var(--muted, #b9c9bf);font-size:.72rem}.working-scenes{padding:0;margin:.5rem 0;list-style:none;max-height:12rem;overflow-y:auto}.working-scenes li{display:flex;align-items:center;justify-content:space-between;gap:.35rem;padding:.25rem 0}.working-scenes .linkish{min-width:0;overflow-wrap:anywhere;text-align:left}.working-scenes .active{color:#f3d594;text-decoration:underline;text-underline-offset:.2em}.recovery-warning{position:sticky;bottom:0;z-index:30;margin:0;padding:1rem;color:#fff4d9;background:#643618;border-top:1px solid #e7b15a}.recovery-warning[hidden]{display:none}.scene-meta{margin:.35rem 0 0;font-size:.7rem;opacity:.85}.mapping-legend{position:absolute;left:1rem;right:1rem;bottom:.75rem;z-index:3;font-size:.72rem;color:#dfefe7}.mapping-legend summary{cursor:pointer;width:fit-content;padding:.35rem .65rem;background:#10251de8;border-radius:.3rem}.mapping-legend-list{margin:.3rem 0 0;padding:.65rem .8rem .65rem 1.5rem;background:#10251df0;border-radius:.4rem;display:grid;gap:.25rem}.mapping-legend[open] .mapping-legend-list{max-height:10rem;overflow:auto}.bed-head{flex-wrap:wrap}.btn:disabled{opacity:.4;cursor:default}@media(max-width:600px){.edit-actions{width:100%}.working-scenes{max-height:9rem}}.composition-panel,.note-inspector{border:1px solid #29413d;border-radius:12px;padding:14px;margin:12px 0;background:#101e20;min-width:0}.composition-heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}.composition-heading h3,.note-inspector h3{margin:0 0 8px}.composition-controls,.composition-tools,.view-tools,.note-fields,.tone-fields{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0}.composition-field{display:flex;flex-direction:column;gap:5px;font-size:.72rem;color:#b8c9c6;min-width:0}.composition-field input,.composition-field select{max-width:100%;min-width:0}.composition-field input[type=text]{width:170px}.arrangement-strip{display:flex;gap:6px;overflow-x:auto;padding:6px 0;max-width:100%}.arrangement-item{flex:0 0 auto;max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#182d30;color:#adc5c3;border:1px solid #365251;border-radius:6px;padding:9px 12px;font:inherit;font-size:.75rem;cursor:pointer}.arrangement-item.selected{border-color:#e6c783;background:#393e2e;color:#f6e0b0}.section-more summary{cursor:pointer;color:#b8c9c6;font-size:.75rem;padding:8px 0}.track-sound{grid-column:1 / -1;display:flex;gap:10px;align-items:center;margin-top:6px}.track-sound select{min-width:0;width:105px;font-size:.7rem}.track-sound label{min-width:0;flex:1;font-size:.6rem;color:#a9bfba}.track-sound input{width:100%}.tone-field{display:flex;gap:4px;align-items:end}.tone-field select{max-width:125px;font-size:.72rem}.note-fields[hidden],.note-inspector button[hidden]{display:none}.note-fields>.composition-field{flex:1;min-width:125px}.note-fields output{color:#edd3a4}.bed-wrap{min-width:0}@media(max-width:600px){.composition-panel,.note-inspector{padding:10px}.composition-controls>*{flex:1 1 42%}.tone-fields{width:100%}.tone-field{flex-wrap:wrap}}.note-inspector{min-height:188px;overflow-anchor:none}.bpm-entry{width:64px;font-size:.76rem;padding:4px 6px}.globals .field:has(.bpm-entry){grid-template-columns:auto 1fr auto auto}@media(max-width:600px){.note-inspector{min-height:290px}}.tone-field select{width:115px}.note-fields output{min-height:1.45em}.view-tools select{width:auto;font-size:.75rem}.view-status{min-height:1.45em}.stage-view-status{pointer-events:auto;max-width:640px;padding:3px 6px;margin-top:5px;border-radius:6px;background:#071512c9}.stage-view-status .view-status{margin:0;color:#e1ece4;font-size:.7rem}.stage-view-status button{margin-top:5px;background:#112923}.stage-view-status button[hidden]{display:none}html{scroll-padding-top:calc(var(--topbar-height, 76px) + var(--garden-height, 44vh) + 12px)}.inspector-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.inspector-head h3{margin:0 0 8px}.remove-note[hidden]{display:none}.plot.selected{border-color:color-mix(in srgb,var(--glow) 70%,transparent);box-shadow:inset 0 0 0 1px #ffd97a59,0 0 14px -4px #ffd97a8c}html[data-layout=desktop],html[data-layout=desktop] body{height:100%;overflow:hidden}html[data-layout=desktop] #app{height:100vh;display:flex;flex-direction:column;position:relative;overflow:clip}html[data-layout=desktop] .topbar{position:relative;flex:0 0 auto}html[data-layout=desktop] .layout{flex:1 1 auto;min-height:0;width:100%;align-items:stretch;grid-template-rows:auto minmax(0,1fr);padding-bottom:0}html[data-layout=desktop] .stage{position:relative;top:auto}html[data-layout=desktop] .bed-wrap{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 6px 28px 0;scrollbar-gutter:stable;scrollbar-width:thin}html[data-layout=desktop] .side{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-bottom:28px;scrollbar-width:thin;align-content:start}html[data-layout=desktop] .bed-head{position:sticky;top:0;z-index:4;margin:0 0 8px;padding:2px 0 6px;background:linear-gradient(180deg,#0a1114 75%,#0a111400)}html[data-layout=desktop] .bed-head .view-tools{margin:0 0 0 auto}html[data-layout=desktop] .bed-head .hint{flex-basis:100%}.desk-pane[hidden]{display:none}.desk-pane>.composition-panel{margin-top:0}.desk-tabs{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--moss-line);border-radius:999px;background:#080f1199}.desk-tab{border:0;background:none;color:var(--leaf-dim);padding:5px 16px;border-radius:999px;cursor:pointer;font:600 14px/1.1 var(--serif);letter-spacing:.02em}.desk-tab:hover{color:var(--leaf)}.desk-tab.on{background:#ffd97a1a;color:#f6e0b0;box-shadow:inset 0 0 0 1px #ffd97a40}html.shell .desk-tabs{display:none}.phase-strip{display:flex;align-items:center;gap:10px 14px;margin:0 0 10px;flex-wrap:wrap}.phase-chips{display:flex;gap:6px;overflow-x:auto;flex:1 1 280px;min-width:0;padding:2px;scrollbar-width:none}.phase-chips::-webkit-scrollbar{display:none}.phase-chip{flex:0 0 auto;display:inline-flex;align-items:baseline;gap:6px;border:1px solid #28413f;background:#122326b3;color:#b9cdc9;border-radius:999px;padding:5px 12px;cursor:pointer;font:13px/1.2 var(--serif)}.phase-chip small{font:11px var(--mono);color:var(--leaf-faint)}.phase-chip:hover{border-color:#3e5f5a;color:var(--leaf)}.phase-chip.selected{border-color:#e6c783;background:#34392a;color:#f6e0b0}.phase-chip.selected small{color:#d9c28c}.phase-bars{display:flex;align-items:center;gap:4px;flex:0 0 auto}.phase-label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--leaf-faint);margin-right:2px}.phase-bar{min-width:26px;height:26px;padding:0 6px;border-radius:8px;border:1px solid var(--moss-line);background:transparent;color:var(--leaf-dim);cursor:pointer;font:12px var(--mono)}.phase-bar:hover{border-color:var(--leaf-dim)}.phase-bar.selected{border-color:color-mix(in srgb,var(--glow) 65%,transparent);color:var(--glow);background:#ffd97a12}.phase-tools{display:flex;gap:4px;flex:0 0 auto}.phase-tool.btn{width:30px;height:30px;padding:0;border-radius:9px;font-size:13px;display:grid;place-items:center}html.shell .phase-strip{gap:8px}html.shell .phase-chips{flex-basis:100%}html.shell .phase-label{font-size:12px}html.shell .phase-chip{min-height:44px;align-items:center;font-size:15px;padding:6px 14px}html.shell .phase-bar,html.shell .phase-tool.btn{min-width:44px;width:auto;height:44px;font-size:14px;border-radius:12px}html.shell .phase-tools{margin-left:auto}.confirm-dialog{max-width:360px;width:calc(100vw - 40px);border-radius:16px;border:1px solid #2c4a45;padding:20px 20px 16px;background:radial-gradient(300px 160px at 0% 0%,#17302a,transparent),#0b1518;color:var(--leaf);box-shadow:0 30px 90px -20px #000000e6}.confirm-dialog::backdrop{background:#03070899;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.confirm-dialog p{margin:0 0 16px;font:16px/1.4 var(--serif);color:#e6f1e8}.confirm-dialog form{display:flex;justify-content:flex-end;gap:8px}html.shell .confirm-dialog form .btn{min-height:44px;min-width:88px}.scene-title{font-size:20px;text-shadow:0 1px 10px rgba(0,0,0,.7)}.stage .scene-meta{margin:4px 0 0;font:11px/1.2 var(--sans);color:#dfece49e;letter-spacing:.02em;opacity:1}.stage-caption{max-width:55%}.stage>.stage-view-status{position:absolute;right:12px;top:12px;z-index:3;margin:0;max-width:min(46%,320px);padding:4px 10px;border-radius:999px;background:#060d0f73;border:1px solid rgba(143,168,155,.18);opacity:0;transition:opacity .6s ease;pointer-events:none}.stage>.stage-view-status.show{opacity:.9;transition-duration:.2s}.stage>.stage-view-status .view-status{margin:0;font:11.5px/1.3 var(--sans);color:#dfece4cc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stage>.stage-view-status button{display:none}.mapping-legend .scene-blurb{margin:.35rem 0 0;padding:.55rem .8rem;background:#10251df0;border-radius:.4rem;font:13px/1.45 var(--serif);color:#cfe0d4;text-shadow:none;max-width:36em}.mapping-legend:not([open]) .scene-blurb{display:none}.pane .mapping-legend .scene-blurb{background:none;padding:4px 0 6px;font-size:15px;color:var(--leaf-dim)}.globals .field{grid-template-columns:auto minmax(0,1fr) auto}.globals .val{text-align:left;min-width:3.4em}.phase-nav{display:flex;gap:4px;flex:0 0 auto}.phase-step.btn{width:30px;height:30px;padding:0;border-radius:9px;display:grid;place-items:center}.phase-chip{touch-action:pan-x;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;transition:transform .16s ease,box-shadow .16s ease,border-color .15s}.phase-chips.reordering .phase-chip:not(.lifted){transition:transform .18s cubic-bezier(.2,.8,.2,1)}.phase-chip.lifted{transition:none;z-index:2;position:relative;cursor:grabbing;box-shadow:0 10px 22px -8px #000000e6,0 0 0 1px #ffd97a80;background:#3a3f2c}html.shell .phase-step.btn{width:44px;height:44px;border-radius:12px}html.shell .phase-nav{margin-left:auto}.btn.compose{border-color:#e6c78373;display:inline-flex;align-items:center;gap:6px}.btn.compose svg{flex:0 0 auto;color:var(--glow)}.btn.compose:hover{border-color:var(--glow)}.bed-head .btn.compose{margin-left:4px}.scene-actions{gap:6px}.btn.create-random{background:linear-gradient(180deg,#2a3f33,#1c2d27);border-color:#3d5d4c}.piece-compose{margin:0 0 2px}html[data-pointer=coarse] input[type=range]{pointer-events:none;touch-action:pan-y}input[type=range].grabbed::-webkit-slider-thumb{transform:scale(1.3);box-shadow:0 0 0 6px #ffd97a40,0 0 14px #ffd97a80;background:#fff6d8}input[type=range].grabbed::-moz-range-thumb{transform:scale(1.3);background:#fff6d8}.phase-strip{position:relative}html.shell .phase-chip{touch-action:pan-x}button,a,input,select,summary,label,.plot,.tab,.track-tab{-webkit-tap-highlight-color:transparent}button,input,select,summary,label,.dock,.tools-head{touch-action:manipulation}.plot{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.plot.held{box-shadow:inset 0 0 0 2px var(--glow),0 0 18px -4px #ffd97ab3}.plot.picked{border-color:color-mix(in srgb,var(--c) 70%,#fff);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 60%,transparent),0 0 20px -4px color-mix(in srgb,var(--c) 80%,transparent)}.plot.picked{touch-action:none}html.picking .tools-body,html.picking body{overflow:hidden;overscroll-behavior:none;touch-action:none}.plot.picked .bead{transform:translate(-50%) scale(1.22);filter:brightness(1.25)}.pblurb{display:none}.preset-item{display:grid;gap:4px}.preset-item>.restore{justify-self:start;margin-left:36px}.preset-item>.restore[hidden],.restore-all[hidden]{display:none}.restore-all{justify-self:start}.status.has-action{pointer-events:auto}.status-action{background:none;border:0;padding:4px 6px;margin:-4px 0;color:var(--glow);font-family:inherit;font-size:inherit;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:.2em}html.shell .status-action{min-height:44px;min-width:44px}.mapping-legend-list li[data-track]{cursor:pointer;border-radius:.3rem}.mapping-legend-list li[data-track]:hover{color:#fff}.mapping-legend-list li.on,.mapping-legend-list li.on strong{color:var(--glow)}.ob-touch,.ob-silent{display:none}html.shell .ob-touch,html.shell .ob-silent,html[data-pointer=coarse] .ob-silent{display:block}html.shell .ob-mouse{display:none}.resume-pill{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:5;display:flex;align-items:center;gap:12px;min-height:52px;width:max-content;max-width:calc(100% - 28px);text-align:left;padding:8px 20px 8px 8px;border-radius:999px;cursor:pointer;background:#081113e6;border:1px solid #3a5d52;color:#eaf6ec;font:15px/1.2 var(--sans);box-shadow:0 16px 40px -12px #000000e6,0 0 30px -8px #ffc85a59;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:resume-in .35s ease-out}.resume-pill[hidden]{display:none}.resume-copy{display:grid;gap:2px}.resume-text{font-weight:600}.resume-cta{font-size:13px;color:var(--glow);letter-spacing:.02em}.resume-icon{flex:0 0 36px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:13px;background:radial-gradient(circle at 35% 30%,#ffe9a8,#e4a93c 70%);color:#2a1a04}@keyframes resume-in{0%{opacity:0;transform:translate(-50%,calc(-50% + 10px))}to{opacity:1;transform:translate(-50%,-50%)}}html.shell,html.shell body{height:100%;overflow:hidden;overscroll-behavior:none}html.shell #app{height:100vh;height:100dvh;display:grid;overflow:hidden;overflow:clip;position:relative;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto}html.shell .topbar{grid-row:1;position:relative;top:auto}html.shell .layout{grid-row:2;display:flex;align-items:stretch;min-height:0;max-width:none;margin:0;padding:8px max(10px,env(safe-area-inset-left)) 8px max(10px,env(safe-area-inset-right));gap:12px}html.shell .bed-wrap,html.shell .side{display:none}html.shell .stage{position:relative;top:auto;flex:1 1 auto;min-width:0;min-height:0;height:auto;aspect-ratio:auto;border-radius:18px}html.shell .garden{position:absolute;inset:0;width:100%;height:100%}html.shell .recovery-warning{position:fixed;top:0;left:0;right:0}html.shell .status{font-size:14px;z-index:30}html.shell .btn{min-height:44px;min-width:44px}html.shell .tools .library li.empty{font-size:14px}html.shell .btn.small{min-height:44px;padding:8px 14px;font-size:14px}html.shell .transport .btn.ghost{width:44px;height:44px}html.shell .brand>.btn{width:44px;height:44px;padding:0;border-radius:50%;font-size:16px}html.shell .tools select,html.shell .tools input[type=text],html.shell .tools input[type=number]{min-height:44px;font-size:16px}html.shell .tools input[type=range]{height:44px}html.shell .tools input[type=range]::-webkit-slider-thumb{width:24px;height:24px;margin-top:-10.5px}html.shell .tools input[type=range]::-moz-range-thumb{width:24px;height:24px}html.shell .tools .linkish{min-height:44px;font-size:15px}html.shell .tools summary{min-height:44px;display:flex;align-items:center;gap:6px}html.shell .tools .mute{width:44px;height:44px;border-radius:12px;font-size:13px}html.shell .tools .arrangement-item{min-height:44px;font-size:14px}html.shell .tools{font-size:15px}html.shell .tools .fine,html.shell .tools .hint,html.shell .tools .edit-state,html.shell .tools .view-status,html.shell .tools .composition-field,html.shell .tools .section-more summary,html.shell .tools .track-sound label,html.shell .tools .mapping-legend,html.shell .tools .library time,html.shell .tools .scene-meta{font-size:14px}html.shell .tools .lab{font-size:12px}html.shell .tools .val{font-size:13px}html.shell .tools .pmeta{font-size:12px}html.shell .tools .track-sound select,html.shell .tools .tone-field select,html.shell .tools .view-tools select{font-size:16px}.tools{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}.tools-head{display:flex;align-items:center;gap:8px}.sheet-title{margin:0;font:italic 600 17px/1 var(--serif);color:#e8f3ea;letter-spacing:.01em;flex:1;min-width:0}.sheet-close{flex:0 0 44px;width:44px;height:44px;margin:-6px -8px -6px 0;border-radius:50%;border:0;background:transparent;color:var(--leaf-dim);font-size:22px;font-weight:300;line-height:1;cursor:pointer}.sheet-close:active{background:#ffffff0f;color:var(--leaf)}.sheet-handle{position:absolute;left:50%;top:0;transform:translate(-50%);width:120px;height:44px;z-index:1;border:0;background:none;cursor:grab;touch-action:none;display:grid;place-items:start center;padding-top:7px}.sheet-handle span{width:36px;height:4px;border-radius:4px;background:#34514b}.tools-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.pane{display:flex;flex-direction:column;gap:10px;padding:2px 14px calc(20px + env(safe-area-inset-bottom))}.pane[hidden]{display:none}.pane>.panel{margin:0}html.shell .pane>.panel{background:none;border:0;border-radius:0;padding:10px 2px 4px}html.shell .pane>.panel+.panel,html.shell .pane>.globals+.panel{border-top:1px solid rgba(31,52,58,.7);padding-top:14px}html.shell .pane>.panel h3{font-size:14px;letter-spacing:.06em;text-transform:uppercase;font-family:var(--sans);color:var(--leaf-faint);font-weight:600}html.shell .pane .composition-panel,html.shell .pane .note-inspector{background:#101e208c;border-color:#29413db3}.pane .composition-panel,.pane .note-inspector{margin:0}.pane-title{margin:0;font:600 15px/1 var(--serif);color:#e8f4ea}.tab-bar{display:flex;min-width:0}.tab{flex:1 1 0;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:12px;background:none;color:var(--leaf-faint);cursor:pointer;padding:4px;font:500 12px/1 var(--sans);letter-spacing:.03em;transition:color .15s,background .15s}.tab svg{width:19px;height:19px;flex:0 0 auto;stroke-width:1.6}.tab.on{color:var(--glow);background:none}.tab.on svg{filter:drop-shadow(0 0 6px rgba(255,217,122,.45))}.tab:active{background:#ffffff0f}html.shell .preset{grid-template-columns:30px 1fr;grid-template-rows:auto auto auto;row-gap:3px;padding:10px 12px;min-height:56px}html.shell .preset .swatch{grid-row:1 / span 3;align-self:start;width:30px;height:30px;margin-top:2px}html.shell .preset .pname{font-size:16px}html.shell .preset .pblurb{display:block;grid-column:2;font:14px/1.35 var(--serif);color:var(--leaf-dim)}html.shell .library li{grid-template-columns:1fr auto}html.shell .library li time{display:none}html.shell .library{max-height:none}.pane>.globals{display:grid;gap:4px;padding:12px 16px;border-radius:var(--radius);border:1px solid var(--moss-line);background:linear-gradient(180deg,#122027b8,#0c1519b8);width:auto}.pane>.globals .field{min-width:0;grid-template-columns:62px minmax(0,1fr) auto}.pane>.globals .field:has(.bpm-entry){grid-template-columns:62px minmax(0,1fr) auto 70px}.pane>.globals .bpm-entry{width:70px}.pane .mapping-legend{position:static;font-size:14px;color:var(--leaf)}.pane .mapping-legend summary{background:none;padding:0;font:600 15px/1 var(--serif);color:#e8f4ea;pointer-events:none;list-style:none}.pane .mapping-legend summary::-webkit-details-marker{display:none}.pane .mapping-legend[open] .mapping-legend-list{max-height:none;overflow:visible}.pane .mapping-legend-list{list-style:none;padding:0;margin:4px 0 0;background:none;gap:8px}.pane .mapping-legend-list li{padding:11px 14px;min-height:44px;border:1px solid var(--moss-line);border-radius:12px;background:#ffffff05;line-height:1.4}.pane .mapping-legend-list li:nth-child(1){border-left:3px solid var(--t0)}.pane .mapping-legend-list li:nth-child(2){border-left:3px solid var(--t1)}.pane .mapping-legend-list li:nth-child(3){border-left:3px solid var(--t2)}.pane .mapping-legend-list li:nth-child(4){border-left:3px solid var(--t3)}.pane .mapping-legend-list li.on{border-color:color-mix(in srgb,var(--glow) 60%,transparent);background:#ffd97a12;color:#f6ecd0}.legend-tip{margin:-4px 0 0}.pane .bed-head{margin:0;gap:8px 12px}.pane .bed-head h3{display:none}.pane .bed-head .hint{flex-basis:100%}.pane .stage-view-status{order:1;margin:0;padding:0;background:none}.pane .stage-view-status .view-status{font-size:14px;color:var(--leaf-dim)}.pane .bed-head{order:0}.pane .phase-strip{order:2;margin:0}.pane .track-tabs{order:3}.pane .beds{order:4}.pane .note-inspector{order:5;min-height:0}.pane .view-tools{order:6;margin:0}.track-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.track-tab{--c: var(--t0);display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:6px 6px;min-height:50px;min-width:0;padding:7px 8px;border-radius:12px;border:1px solid var(--moss-line);background:#ffffff05;color:var(--leaf-dim);cursor:pointer;text-align:left}.track-tab.t1{--c: var(--t1)}.track-tab.t2{--c: var(--t2)}.track-tab.t3{--c: var(--t3)}.track-tab .chip{width:22px;height:22px;font-size:11px;grid-row:auto}.track-tab .chip svg{width:12px;height:12px}.tt-name{font:600 14px/1 var(--serif);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-tab.on{border-color:color-mix(in srgb,var(--c) 70%,transparent);background:color-mix(in srgb,var(--c) 12%,transparent);color:#f1f8f1}.mini{grid-column:1 / -1;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:2px}.mini i{height:5px;border-radius:2px;background:#1c3035}.mini i:nth-child(4n+1){background:#243c3f}.mini i.on{background:var(--c);box-shadow:0 0 5px color-mix(in srgb,var(--c) 60%,transparent)}.mini i.now{background:var(--glow);box-shadow:0 0 7px #ffd97acc}.track-tab.muted{opacity:.55}.pane{container-type:inline-size}@container (max-width: 460px){.track-tab{grid-template-columns:minmax(0,1fr);padding:8px 7px;gap:7px}.track-tab .chip{display:none}.tt-name{font-size:14px;color:color-mix(in srgb,var(--c) 55%,#cfe0d4);text-overflow:clip}.track-tab.on .tt-name{color:color-mix(in srgb,var(--c) 35%,#ffffff)}}html.shell .beds{gap:0}html.shell .beds .bed{display:none}html.shell .beds .bed.focus{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:12px}html.shell .beds .bed .plots{order:-1;grid-template-columns:repeat(var(--cols, 4),minmax(0,1fr));gap:6px}html.shell .beds .track-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}html.shell .beds .track-head>.chip,html.shell .beds .track-head>.tname{display:none}html.shell .beds .tctl{flex:1 1 100%;grid-template-columns:minmax(0,1fr) 76px 44px;gap:10px}html.shell .beds .tctl .oct{min-height:44px;font-size:16px}html.shell .beds .track-sound{flex:1 1 100%;margin:0;gap:12px}html.shell .beds .track-sound select{flex:1 1 150px;width:auto;max-width:220px;min-height:44px}html.shell .beds .track-sound label{display:grid;gap:0;flex:2 1 160px}html.shell .plot{aspect-ratio:auto;height:54px;min-height:44px;border-radius:11px}html.shell .plot:nth-child(4n){margin-right:0}html.shell .plot .bead{width:auto;height:34%;bottom:calc(8% + var(--lift) * 60%)}html.shell .plot .bead:before{height:calc(var(--lift) * 176% + 24%)}html.shell .plot .deg{display:block;font-size:11px;top:4px;right:6px}.stage-readout{position:absolute;right:12px;bottom:10px;z-index:3;pointer-events:none}.stage-readout .readout{min-width:0;padding:4px 9px;border-radius:8px;background:#04090b9e;color:#cfe0d4;font-size:12px}.stage-readout .readout[data-idle=true]{display:none}.stage-corner{position:absolute;right:10px;top:10px;z-index:4}.stage-corner .btn{width:44px;height:44px;padding:0;border-radius:50%;background:#060c0e8c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}html[data-layout=phone] .topbar{flex-wrap:nowrap;gap:10px;padding:calc(env(safe-area-inset-top) + 6px) max(14px,env(safe-area-inset-right)) 4px max(14px,env(safe-area-inset-left));border-bottom:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none}html[data-layout=phone] .brand{gap:8px;margin-right:0;flex:1}html[data-layout=phone] .brand>.btn{margin-left:auto}html[data-layout=phone] .brand h1{font-size:20px}html[data-layout=phone] .brand .tag{display:none}html[data-layout=phone] .sprout{width:28px;height:28px}html[data-layout=phone] .layout{padding-top:2px;padding-bottom:8px}html[data-layout=phone][data-sheet=open] .topbar{display:none}html[data-layout=phone][data-sheet=open] .layout{padding-top:calc(env(safe-area-inset-top) + 8px)}html[data-layout=phone] .stage-caption{left:16px;top:14px;right:16px;max-width:none}html[data-layout=phone] .scene-title{font-size:18px}html[data-layout=phone][data-sheet=open] .stage .scene-meta{display:none}html[data-layout=phone][data-sheet=open] .scene-title{font-size:16px}html[data-layout=phone] .tools{grid-row:3;height:0;visibility:hidden;position:relative;background:linear-gradient(180deg,#10201f,#0b1518 70%);border-top:1px solid #2c4a45;border-radius:22px 22px 0 0;box-shadow:0 -24px 60px -20px #000000e6;transition:height .3s cubic-bezier(.2,.8,.2,1),visibility 0s linear .3s}html[data-layout=phone][data-sheet=open] .tools{height:60vh;height:60dvh;visibility:visible;transition:height .3s cubic-bezier(.2,.8,.2,1),visibility 0s}html[data-layout=phone][data-sheet=open][data-expanded] .tools{height:calc(100vh - 200px);height:calc(100dvh - 190px - env(safe-area-inset-top))}html[data-layout=phone] .tools-head{position:relative;padding:14px 10px 2px 18px}html[data-layout=phone] .sheet-handle{top:-4px}html[data-layout=phone] .pane .pane-title{display:none}html[data-layout=phone] .pane>.panel:first-child>h3,html[data-layout=landscape] .pane>.panel:first-child>h3{display:none}html[data-layout=landscape] .pane .pane-title{display:none}html[data-layout=phone] .dock{grid-row:4;display:flex;align-items:center;gap:2px;z-index:9;padding:3px max(8px,env(safe-area-inset-right)) calc(3px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:#070d10f0;border-top:1px solid rgba(31,52,58,.6)}html[data-layout=phone] .dock .btn.play{flex:0 0 48px;width:48px;height:48px;font-size:15px;box-shadow:0 0 0 2px #ffd97a1f,0 0 18px #ffc85a38}html[data-layout=phone] .dock .btn.play.on{box-shadow:0 0 0 2px #9be3b729,0 0 18px #78dca047}html[data-layout=phone] .dock>.btn.ghost{flex:0 0 44px;width:44px;height:44px;padding:0;border-radius:50%;border-color:transparent;font-size:12px;color:var(--leaf-dim)}html[data-layout=phone] .dock .tab-bar{flex:1 1 auto;margin-left:2px}html[data-layout=phone] .dock .tab{flex-direction:column;gap:3px;min-height:48px;font-size:10.5px;padding:3px 0}html[data-layout=phone] .status{bottom:calc(66px + env(safe-area-inset-bottom))}@media(max-width:400px){html[data-layout=phone] .dock .tab{font-size:10px;letter-spacing:0}html[data-layout=phone] .dock .tab-bar{gap:2px}}@media(max-width:350px){html[data-layout=phone] .dock{padding-left:4px;padding-right:4px;gap:0}html[data-layout=phone] .dock .btn.play{flex-basis:48px;width:48px;height:48px}html[data-layout=phone] .dock .tab .tab-label{font-size:10px}html[data-layout=phone] .dock .tab-bar{gap:0;margin-left:0}html[data-layout=phone] .dock .tab{min-width:0}}html[data-layout=landscape] #app{grid-template-columns:minmax(0,1fr) auto auto;grid-template-rows:minmax(0,1fr)}html[data-layout=landscape] .topbar{display:none}html[data-layout=landscape] .layout{grid-row:1;grid-column:1;padding:max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}html[data-layout=landscape] .stage{border-radius:16px}html[data-layout=landscape] .stage-caption{left:14px;top:10px;max-width:70%}html[data-layout=landscape] .scene-title{font-size:16px}html[data-layout=landscape] .stage .scene-meta{display:none}html[data-layout=landscape] .tools{grid-row:1;grid-column:2;width:0;visibility:hidden;background:linear-gradient(180deg,#10201f,#0b1518 70%);border-left:1px solid #2c4a45;transition:width .3s cubic-bezier(.2,.8,.2,1),visibility 0s linear .3s}html[data-layout=landscape][data-sheet=open] .tools{width:min(380px,48vw);visibility:visible;transition:width .3s cubic-bezier(.2,.8,.2,1),visibility 0s}html[data-layout=landscape] .tools-head{padding:max(8px,env(safe-area-inset-top)) 8px 6px 16px;min-width:280px}html[data-layout=landscape] .sheet-handle{display:none}html[data-layout=landscape] .pane{min-width:280px;padding-bottom:max(16px,env(safe-area-inset-bottom))}html[data-layout=landscape] .dock{grid-row:1;grid-column:3;display:flex;flex-direction:column;align-items:center;gap:2px;width:calc(58px + env(safe-area-inset-right));padding:max(6px,env(safe-area-inset-top)) env(safe-area-inset-right) max(6px,env(safe-area-inset-bottom)) 0;overflow-y:auto;background:#070d10f0;border-left:1px solid rgba(31,52,58,.6)}html[data-layout=landscape] .dock .btn.play{flex:0 0 46px;width:46px;height:46px;font-size:15px}html[data-layout=landscape] .dock>.btn.ghost{border-color:transparent;font-size:12px;color:var(--leaf-dim)}html[data-layout=landscape] .dock>.btn.ghost{flex:0 0 44px;width:44px;height:44px;padding:0;border-radius:50%}html[data-layout=landscape] .dock .tab-bar{flex-direction:column;gap:2px;margin-top:4px}html[data-layout=landscape] .dock .tab{flex:0 0 44px;width:50px;min-height:44px}html[data-layout=landscape] .dock .tab .tab-label{display:none}html[data-layout=landscape] .status{left:calc(50% - 29px);bottom:14px}@media(max-height:340px){html[data-layout=landscape] .dock{gap:0}html[data-layout=landscape] .dock .btn.play{flex-basis:46px;width:46px;height:46px}html[data-layout=landscape] .dock .tab-bar{margin-top:0;gap:0}}html[data-layout=tablet] #app{grid-template-rows:auto minmax(0,1fr)}html[data-layout=tablet] .topbar{flex-wrap:nowrap;padding:calc(env(safe-area-inset-top) + 12px) max(22px,env(safe-area-inset-right)) 12px max(22px,env(safe-area-inset-left))}html[data-layout=tablet] .layout{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,44fr) minmax(0,56fr);gap:14px;padding:14px max(18px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}html[data-layout=tablet] .stage{grid-area:auto;height:100%}html[data-layout=tablet] .tools{border:1px solid var(--moss-line);border-radius:20px;min-height:0;background:linear-gradient(180deg,#122027d1,#0a1215e6)}html[data-layout=tablet] .tools-head{padding:4px 8px;border-bottom:1px solid rgba(31,52,58,.6)}html[data-layout=tablet] .tools-head .sheet-title,html[data-layout=tablet] .sheet-close,html[data-layout=tablet] .sheet-handle{display:none}html[data-layout=tablet] .tools-head .tab-bar{flex:1;gap:6px}html[data-layout=tablet] .tab{min-height:44px;font-size:13px}html[data-layout=tablet] .pane{padding:14px 16px 22px}@media(orientation:landscape){html[data-layout=tablet] .layout{grid-template-columns:minmax(0,1fr) minmax(360px,42%);grid-template-rows:minmax(0,1fr)}html[data-layout=tablet] .tab{flex-direction:column;gap:3px;font-size:11px;min-height:48px}}html.shell .onboarding{width:calc(100vw - 24px);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:22px 20px 0;overflow-y:auto;overscroll-behavior:contain;font-size:15px}html.shell .onboarding h2{font-size:24px}html.shell .onboarding p{margin:8px 0}html.shell .onboarding form{position:sticky;bottom:0;margin:8px -20px 0;padding:18px 20px calc(16px + env(safe-area-inset-bottom));background:linear-gradient(180deg,#0b151800,#0b1518 40%)}html.shell .onboarding form .btn{width:100%;min-height:50px;font-size:16px}html[data-layout=landscape] .onboarding{max-width:640px}html.shell .stage .mapping-legend summary{min-height:44px;display:flex;align-items:center;gap:6px;padding:0 .9rem;font-size:14px}html.shell .stage .mapping-legend summary:before{content:"▸";font-size:12px;transition:transform .15s}html.shell .stage .mapping-legend[open] summary:before{transform:rotate(90deg)}html.shell .stage .mapping-legend summary::-webkit-details-marker{display:none}html.shell .stage .mapping-legend{font-size:14px}.roll-row{display:grid;gap:8px}.btn.roll{justify-self:stretch;background:linear-gradient(180deg,#2a3f33,#1c2d27);border-color:#3d5d4c}.btn.roll:hover{border-color:var(--glow)}.look-locks{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.look-locks .lab{margin-right:2px}.lock{border:1px solid var(--moss-line);background:transparent;color:var(--leaf-dim);border-radius:999px;padding:3px 10px;font-size:12px;cursor:pointer}.lock[aria-pressed=true]{border-color:color-mix(in srgb,var(--glow) 60%,transparent);color:var(--glow);background:#ffd97a14}.lock[aria-pressed=true]:before{content:"🔒︎ ";font-size:10px}html.shell .lock{min-height:44px;min-width:44px;padding:6px 14px;font-size:14px}html.shell .btn.roll{min-height:48px;font-size:15px}.follow-chip{position:absolute;right:12px;top:12px;z-index:4;display:inline-flex;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:5px 6px 5px 12px;border-radius:999px;cursor:pointer;background:#081012c7;border:1px solid rgba(230,199,131,.45);color:#e9dfc4;font:12.5px/1.2 var(--sans);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 8px 24px -10px #000000e6;animation:chip-in .25s ease-out}@keyframes chip-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.follow-chip[hidden]{display:none}.follow-chip-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.follow-chip-go{flex:0 0 auto;padding:3px 10px;border-radius:999px;background:#ffd97a29;color:var(--glow);font-weight:600}.follow-chip:hover .follow-chip-go{background:#ffd97a42}html.shell .follow-chip{min-height:44px;font-size:13px}html[data-layout=phone] .follow-chip{inset:auto 10px 12px;justify-content:space-between}html[data-layout=phone] .follow-chip~.resume-pill{z-index:6}html[data-layout=landscape] .follow-chip{inset:auto auto 10px 10px;max-width:calc(100% - 20px)}html[data-layout=desktop] .follow-chip{top:auto;bottom:16px;right:16px}.playback-slot{display:contents}.check-row{display:flex;align-items:center;gap:10px;cursor:pointer}.check-row input{width:18px;height:18px;accent-color:var(--accent);flex:0 0 auto}html.shell .check-row{min-height:44px;font-size:15px}html.shell .check-row input{width:22px;height:22px}html.shell .pane>.playback-slot>.panel{background:none;border:0;border-radius:0;padding:14px 2px 4px;border-top:1px solid rgba(31,52,58,.7)}html.shell .pane>.playback-slot>.panel h3{font-size:14px;letter-spacing:.06em;text-transform:uppercase;font-family:var(--sans);color:var(--leaf-faint);font-weight:600}.head-slot{display:none}html[data-layout=phone][data-tab=beds] .head-slot,html[data-layout=landscape][data-tab=beds] .head-slot{display:flex;align-items:center;gap:2px;margin-left:auto;min-width:0}.head-slot .edit-actions{display:flex;flex-wrap:nowrap;gap:2px;width:auto}.head-slot .edit-actions .btn.small{min-height:44px;width:44px;min-width:44px;padding:0;font-size:0;color:transparent;border-color:transparent;border-radius:50%;background:transparent center / 20px 20px no-repeat}.head-slot .edit-actions .btn.small:disabled{opacity:.35}.head-slot .act-undo{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23cfe6d6' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 14L4 9l5-5'/%3E%3Cpath d='M4 9h10a6 6 0 0 1 0 12h-3'/%3E%3C/svg%3E")!important}.head-slot .act-redo{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23cfe6d6' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 14l5-5-5-5'/%3E%3Cpath d='M20 9H10a6 6 0 0 0 0 12h3'/%3E%3C/svg%3E")!important}.head-slot .act-reset{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23cfe6d6' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7'/%3E%3Cpath d='M3 4v5h5'/%3E%3C/svg%3E")!important}.tools-head>:not(.sheet-handle){position:relative;z-index:2}.head-slot .edit-state{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.hint-btn{flex:0 0 44px;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:var(--leaf-dim);font:600 15px var(--sans);cursor:pointer}html[data-layout=phone][data-tab=beds] .sheet-title{flex:0 0 auto}html[data-layout=phone].hint-seen .pane .bed-head,html[data-layout=landscape].hint-seen .pane .bed-head{display:none}html[data-layout=phone] .pane#pane-beds,html[data-layout=landscape] .pane#pane-beds{gap:8px;padding-top:0}html.shell .phase-strip .btn.compose{width:44px;min-width:44px;height:44px;padding:0;justify-content:center;border-radius:12px}html.shell .phase-strip .btn.compose span{display:none}html.shell .phase-bars{flex:1 1 0;min-width:0;overflow-x:auto;scrollbar-width:none}html.shell .phase-bars::-webkit-scrollbar{display:none}html.shell .phase-nav{margin-left:0}html[data-layout=phone] .track-tab,html[data-layout=landscape] .track-tab{min-height:44px;padding-top:6px;padding-bottom:6px;gap:5px}html[data-layout=landscape] .plot{height:46px}html[data-layout=phone] .pane .bed-head .hint,html[data-layout=landscape] .pane .bed-head .hint{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}@media(max-height:600px){html[data-layout=phone][data-sheet=open] .tools{height:67vh;height:67dvh}}html[data-layout=landscape] .pane#pane-beds{gap:6px}html[data-layout=landscape] .tools-head{padding-top:max(4px,env(safe-area-inset-top));padding-bottom:2px}html[data-layout=landscape] .plot{height:44px}html[data-layout=landscape] .phase-chip{min-height:44px;padding-top:4px;padding-bottom:4px}html.shell .phase-bars{padding-right:2px}html.shell .phase-bars.fade-r{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent)}html.shell .phase-bars.fade-l{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent)}html.shell .phase-bars.fade-l.fade-r{-webkit-mask-image:linear-gradient(to right,transparent,#000 28px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,transparent,#000 28px,#000 calc(100% - 28px),transparent)}
