:root{--ww-cream: #fdf3dc;--ww-orange: #ff8a2a;--ww-teal: #2fd6c3;--ww-yellow: #ffe23e;--ww-red: #ff5c39;--ww-ink: #2b1d12;--ww-paper: #fffdf6;--ww-tint: #ffd9ae;--ww-cell: #fff6e2;--ww-cell-border: #e8d3ae;--ww-shadow: 0 3px 0 var(--ww-ink);--ww-shadow-lg: 0 4px 0 var(--ww-ink);--ww-shadow-sm: 0 2px 0 var(--ww-ink);--ww-radius: 14px;--ww-radius-lg: 22px;--ww-radius-sm: 7px;--ww-border: 3px solid var(--ww-ink);--ww-border-thin: 2px solid var(--ww-ink);--ww-font: "ui-rounded", "SF Pro Rounded", "Arial Rounded MT Bold", "Nunito", sans-serif;--ww-track-0: var(--ww-orange);--ww-track-1: var(--ww-teal);--ww-track-2: var(--ww-yellow);--ww-track-3: var(--ww-red);--ww-track-4: #8c5a33}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background:var(--ww-orange);color:var(--ww-ink);font-family:var(--ww-font);font-size:16px;line-height:1.25;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}img,svg,canvas{display:block;max-width:100%}button,input,select{font:inherit;color:inherit}button{background:none;border:none;cursor:pointer;touch-action:manipulation}input[type=text],textarea{user-select:text;-webkit-user-select:text}#app{display:flex;flex-direction:column;height:100%;width:100%;max-width:640px;margin:0 auto;overflow:hidden}#app>header{flex:none}#app>main{flex:1 1 0;min-height:0;background:var(--ww-cream);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}#app>footer{flex:none}#overlay-root{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;pointer-events:none}#overlay-root>*{pointer-events:auto}.ww-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;min-width:48px;padding:10px 18px;background:var(--ww-paper);color:var(--ww-ink);border:var(--ww-border);border-radius:var(--ww-radius);box-shadow:var(--ww-shadow);font-family:var(--ww-font);font-weight:800;font-size:16px;letter-spacing:.01em;cursor:pointer;transition:transform 70ms ease-out,box-shadow 70ms ease-out;will-change:transform}.ww-btn:active,.ww-btn.is-pressed{transform:translateY(3px);box-shadow:0 0 0 var(--ww-ink)}.ww-btn:disabled{opacity:.45;pointer-events:none}.ww-btn--yellow{background:var(--ww-yellow)}.ww-btn--orange{background:var(--ww-orange)}.ww-btn--teal{background:var(--ww-teal)}.ww-btn--red{background:var(--ww-red);color:var(--ww-paper)}.ww-btn--green{background:#29a97f;color:var(--ww-paper)}.ww-btn--copy{background:#8a7bff;color:var(--ww-paper)}.ww-btn--round{border-radius:50%;padding:0;width:56px;height:56px;min-width:56px;font-size:22px}.ww-chip{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:7px 14px;background:var(--ww-paper);color:var(--ww-ink);border:var(--ww-border);border-radius:999px;box-shadow:var(--ww-shadow);font-family:var(--ww-font);font-weight:700;font-size:13px;white-space:nowrap;cursor:pointer;transition:transform 70ms ease-out,box-shadow 70ms ease-out}.ww-chip:active,.ww-chip.is-pressed{transform:translateY(3px);box-shadow:0 0 0 var(--ww-ink)}.ww-chip.is-active{background:var(--ww-yellow)}.ww-card{background:var(--ww-paper);color:var(--ww-ink);border:var(--ww-border);border-radius:var(--ww-radius-lg);box-shadow:var(--ww-shadow);padding:14px}.ww-sheet{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:var(--ww-cream);padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px));overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;animation:ww-sheet-in .18s ease-out}@keyframes ww-sheet-in{0%{transform:translateY(24px);opacity:0}to{transform:translateY(0);opacity:1}}.ww-toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom,0px));transform:translate(-50%);z-index:200;max-width:min(86vw,420px);padding:10px 18px;background:var(--ww-yellow);color:var(--ww-ink);border:var(--ww-border);border-radius:var(--ww-radius);box-shadow:var(--ww-shadow);font-weight:800;font-size:14px;text-align:center;pointer-events:none;animation:ww-toast-pop .16s cubic-bezier(.34,1.56,.64,1)}@keyframes ww-toast-pop{0%{transform:translate(-50%) translateY(10px) scale(.9);opacity:0}to{transform:translate(-50%) translateY(0) scale(1);opacity:1}}@keyframes ww-bounce{0%{transform:scale(1)}30%{transform:scale(1.25,.8) translateY(2px)}60%{transform:scale(.92,1.12) translateY(-2px)}to{transform:scale(1)}}@keyframes ww-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes ww-squash{0%{transform:scale(1)}40%{transform:scale(1.12,.84)}70%{transform:scale(.94,1.08)}to{transform:scale(1)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.ww-banner{background:var(--ww-orange);border-bottom:4px solid var(--ww-ink);padding:calc(max(10px,env(safe-area-inset-top,0px)) + 2px) 0 10px;display:flex;flex-direction:column;gap:9px}.ww-banner-head{display:flex;align-items:center;gap:8px;padding:0 12px}.ww-banner-label{font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#2b1d12b3}.ww-banner-len{font-size:11px;font-weight:800;color:#2b1d128c}.ww-banner-spacer{flex:1}.ww-banner-btn{font:inherit;font-weight:800;font-size:13px;padding:8px 10px;min-width:38px;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;background:var(--ww-paper);color:var(--ww-ink);border:var(--ww-border);border-radius:12px;box-shadow:var(--ww-shadow-sm)}.ww-banner-btn:active{transform:translateY(2px);box-shadow:0 0 0 var(--ww-ink)}.ww-banner-edit{padding:9px 13px}.ww-banner-btn.is-on{background:var(--ww-ink);color:var(--ww-yellow)}.ww-banner-btn:disabled{opacity:.38;box-shadow:0 2px #2b1d1259;pointer-events:none}.ww-stripwrap{position:relative}.ww-strip{display:flex;gap:8px;overflow-x:auto;scroll-behavior:smooth;padding:2px 12px;touch-action:pan-x;scrollbar-width:none;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}.ww-strip::-webkit-scrollbar{display:none}.ww-stripwrap:before,.ww-stripwrap:after{content:"";position:absolute;top:0;bottom:0;width:20px;z-index:3;pointer-events:none}.ww-stripwrap:before{left:0;background:linear-gradient(90deg,var(--ww-orange),transparent)}.ww-stripwrap:after{right:0;background:linear-gradient(270deg,var(--ww-orange),transparent)}.ww-block{position:relative;flex:none;width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:var(--ww-paper);border:var(--ww-border);border-radius:var(--ww-radius-sm);box-shadow:var(--ww-shadow-sm);color:var(--ww-ink);cursor:pointer;scroll-snap-align:center;transition:transform 60ms ease-out;touch-action:none}.ww-block:active{transform:translateY(2px);box-shadow:0 0 0 var(--ww-ink)}.ww-block-num{position:absolute;top:2px;left:4px;font-size:10px;font-weight:800;color:var(--ww-ink);opacity:.5;font-variant-numeric:tabular-nums}.ww-block-bars{display:flex;gap:2px;align-items:flex-end;height:20px}.ww-block-bars i{width:4px;border-radius:2px 2px 0 0;border:1.5px solid var(--ww-ink);display:block}.ww-block-empty{font-size:17px;font-weight:800;color:#cbb488}.ww-block.is-cursor{background:var(--ww-yellow);box-shadow:0 0 0 3px var(--ww-ink),var(--ww-shadow-sm)}.ww-block.is-sel{box-shadow:0 0 0 3px var(--ww-ink),var(--ww-shadow-sm)}.ww-block.is-loop{box-shadow:0 0 0 3px var(--ww-teal),var(--ww-shadow-sm)}.ww-block.is-cursor.is-loop{box-shadow:0 0 0 3px var(--ww-ink),0 0 0 6px var(--ww-teal),var(--ww-shadow-sm)}.ww-block.is-src{box-shadow:0 0 0 3px #8a7bff,var(--ww-shadow-sm);background:color-mix(in srgb,#8a7bff 14%,var(--ww-paper))}.ww-block.is-tgt{box-shadow:0 0 0 3px #29a97f,var(--ww-shadow-sm);background:color-mix(in srgb,#29a97f 16%,var(--ww-paper))}.ww-block.is-tgt.is-warn{box-shadow:0 0 0 3px var(--ww-red),var(--ww-shadow-sm);background:color-mix(in srgb,var(--ww-red) 14%,var(--ww-paper))}.ww-block.is-playing{outline:3px solid var(--ww-teal);outline-offset:1px}.ww-block.is-dragging{opacity:.28}.ww-block.is-dragging>*{visibility:hidden}.ww-block-add{border-style:dashed;background:var(--ww-yellow);font-size:22px;font-weight:800;box-shadow:none;color:var(--ww-ink)}.ww-banner.is-editing .ww-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;overflow-x:hidden;overflow-y:auto;max-height:42vh;scroll-snap-type:none;touch-action:pan-y}.ww-banner.is-editing .ww-block{width:auto;height:auto;aspect-ratio:1 / 1;scroll-snap-align:none}.ww-banner.is-editing .ww-stripwrap:before,.ww-banner.is-editing .ww-stripwrap:after{display:none}.ww-banner.is-editing .ww-mini,.ww-banner.is-editing .ww-chev{display:none!important}.ww-chev{position:absolute;top:50%;transform:translateY(-50%);z-index:5;display:none;align-items:center;gap:3px;background:var(--ww-ink);color:var(--ww-yellow);font-size:12px;font-weight:800;padding:5px 9px;border-radius:9px;cursor:pointer}.ww-chev.is-shown{display:flex}.ww-chev--left{left:6px}.ww-chev--right{right:6px}.ww-mini{display:flex;gap:3px;align-items:center;height:16px;padding:0 12px;cursor:pointer}.ww-mini i{flex:1;min-width:3px;max-width:16px;height:8px;border-radius:2px;border:1.5px solid var(--ww-ink);background:transparent}.ww-mini i.has{background:var(--ww-ink)}.ww-mini i.sel{background:var(--ww-yellow);box-shadow:0 0 0 1.5px var(--ww-ink);height:12px}.ww-mini i.ph{background:var(--ww-teal)}.ww-banner-tracklabel{display:none;font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:#2b1d1299;padding:0 12px;margin:-2px 0}.ww-banner.is-editing .ww-banner-tracklabel{display:block}.ww-tracks{display:flex;gap:6px;padding:0 12px}.ww-track{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 2px;background:var(--ww-paper);border:var(--ww-border);border-radius:var(--ww-radius-sm);box-shadow:var(--ww-shadow-sm);color:var(--ww-ink);cursor:pointer}.ww-track:active{transform:translateY(2px);box-shadow:0 0 0 var(--ww-ink)}.ww-track-ic{font-size:19px;line-height:1}.ww-track-nm{font-size:9px;font-weight:800;color:var(--ww-ink);opacity:.65;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ww-track-stripe{width:100%;height:5px;border-radius:3px;background:var(--tc)}.ww-track.is-active{background:var(--tc);box-shadow:0 0 0 3px var(--ww-ink),var(--ww-shadow-sm)}.ww-track.is-active .ww-track-nm{color:var(--ww-ink);opacity:1}.ww-track-chk{position:absolute;top:3px;right:4px;width:16px;height:16px;display:none;align-items:center;justify-content:center;border:2px solid var(--ww-ink);border-radius:4px;background:var(--ww-paper);font-size:11px;font-weight:900}.ww-banner.is-editing .ww-track-chk{display:flex}.ww-track.is-checked{box-shadow:0 0 0 3px var(--ww-ink),var(--ww-shadow-sm)}.ww-track.is-checked .ww-track-chk{background:var(--ww-ink);color:var(--ww-yellow)}.ww-banner-actions{display:flex;gap:6px;padding:0 12px}.ww-banner-actions:empty{display:none}.ww-banner-action{flex:1;min-width:0;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 4px;font:inherit;font-weight:800;font-size:12.5px;white-space:nowrap;background:var(--ww-paper);color:var(--ww-ink);border:var(--ww-border);border-radius:12px;box-shadow:var(--ww-shadow-sm)}.ww-banner-action:active{transform:translateY(2px);box-shadow:0 0 0 var(--ww-ink)}.ww-banner-action.ww-btn--green,.ww-banner-action.ww-btn--copy,.ww-banner-action.ww-btn--red{color:var(--ww-paper)}.ww-banner-action.ww-btn--green{background:#29a97f}.ww-banner-action.ww-btn--copy{background:#8a7bff}.ww-banner-action.ww-btn--red{background:var(--ww-red)}.ww-block-ghost{position:fixed;z-index:1200;display:none;align-items:center;justify-content:center;width:50px;height:50px;border:var(--ww-border);border-radius:var(--ww-radius-sm);background:var(--ww-paper);opacity:.58;box-shadow:0 8px #2b1d1240,0 12px 22px #2b1d1238;pointer-events:none;transform:translate(-50%,-50%) rotate(-4deg) scale(1.12)}.ww-block-ghost .ww-block-num{opacity:.5}.ww-block-caret{position:fixed;z-index:1210;display:none;width:6px;border-radius:3px;background:var(--ww-ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--ww-ink) 22%,transparent);transform:translate(-50%);pointer-events:none;animation:ww-caret-blink .5s ease-in-out infinite}@keyframes ww-caret-blink{0%,to{opacity:1}50%{opacity:.4}}.ww-banner-sheet-msg{font-size:13.5px;font-weight:700;line-height:1.4;color:var(--ww-ink);opacity:.8;text-align:center;padding:0 4px 2px}.ww-notegrid{--note-c: var(--ww-red);--ww-row-h: 30px;--edge-w: 40px;padding:0 12px 24px}.ww-notegrid.is-drums{--ww-row-h: 46px;--edge-w: 64px}.ww-grid-head{position:sticky;top:0;z-index:5;display:flex;gap:6px;background:var(--ww-cream);padding:10px 0 8px}.ww-grid-corner{flex:none;width:var(--edge-w)}.ww-mhead{position:relative;flex:1;display:flex;align-items:baseline;justify-content:center;gap:6px;min-height:34px;background:var(--ww-paper);border:var(--ww-border-thin);border-radius:var(--ww-radius-sm);box-shadow:var(--ww-shadow-sm);font-weight:900;transition:transform 70ms ease-out,box-shadow 70ms ease-out}.ww-mhead:active{transform:translateY(2px);box-shadow:0 0 0 var(--ww-ink)}.ww-mhead+.ww-mhead{margin-left:4px}.ww-mhead-letter{font-size:16px}.ww-mhead-num{font-size:12px;opacity:.7}.ww-mhead-dot{display:none;position:absolute;top:-5px;right:-5px;width:12px;height:12px;border-radius:50%;background:var(--ww-red);border:2px solid var(--ww-ink)}.ww-mhead.has-override .ww-mhead-dot{display:block}.ww-grid-body{display:flex;gap:6px}.ww-edge{flex:none;width:var(--edge-w);display:flex;flex-direction:column;gap:2px;touch-action:none}.ww-pkey{position:relative;height:var(--ww-row-h);display:flex;align-items:center;justify-content:flex-end;padding-right:5px;background:var(--ww-paper);border:var(--ww-border-thin);border-radius:5px;font-size:9px;font-weight:800;color:var(--ww-ink)}.ww-pkey.is-black{background:var(--ww-paper);z-index:1}.ww-pkey.is-black:after{content:"";position:absolute;left:-1px;top:2px;bottom:2px;width:64%;border:2px solid var(--ww-ink);border-left:none;border-radius:0 6px 6px 0;background:linear-gradient(180deg,#4a3524 0%,var(--ww-ink) 68%);box-shadow:inset 0 2px #ffffff2e,2px 2px 4px #2b1d1259;pointer-events:none}.ww-pkey.is-held:not(.is-black){background:var(--ww-yellow);transform:translate(2px)}.ww-pkey.is-black.is-held:after{background:var(--ww-yellow);transform:translate(2px)}.ww-pad{height:var(--ww-row-h);display:flex;align-items:center;justify-content:center;padding:0 4px;background:var(--ww-paper);border:var(--ww-border-thin);border-radius:var(--ww-radius-sm);box-shadow:var(--ww-shadow-sm);font-size:10px;font-weight:800;text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ww-pad.is-held{background:var(--ww-yellow);transform:translateY(2px);box-shadow:0 0 0 var(--ww-ink)}.ww-rows{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.ww-noterow{display:flex;gap:2px;height:var(--ww-row-h)}.ww-cell{flex:1;min-width:0;position:relative;display:flex;align-items:center;justify-content:center;background:var(--ww-cell);border:2px solid var(--ww-cell-border);border-radius:var(--ww-radius-sm);touch-action:pan-y;font-size:9px;font-weight:800;line-height:1;color:var(--ww-ink);overflow:hidden}.ww-noterow>.ww-cell:nth-child(8){margin-right:8px}.ww-noterow>.ww-cell:nth-child(9):before{content:"";position:absolute;left:-6px;top:-3px;bottom:-3px;width:3px;border-radius:2px;background:var(--ww-ink);pointer-events:none}.ww-noterow.is-black .ww-cell{background:#f6e8cb;border-color:#e0c9a3}.ww-cell.on,.ww-noterow.is-black .ww-cell.on{background:var(--note-c);border-color:var(--ww-ink);box-shadow:var(--ww-shadow-sm);touch-action:none}.ww-cell.is-tail,.ww-noterow.is-black .ww-cell.is-tail{background:color-mix(in srgb,var(--note-c) 40%,transparent);border-color:color-mix(in srgb,var(--note-c) 55%,var(--ww-cell-border))}.ww-cell.ph{background:#2fd6c34d;border-color:#2b1d1240}.ww-cell.on.ph{background:var(--note-c);border-color:var(--ww-ink);filter:brightness(1.18);animation:ww-bounce .28s ease-out}.ww-transport{position:relative;display:flex;flex-direction:column;gap:8px;background:var(--ww-orange);border-top:4px solid var(--ww-ink);padding:12px 12px calc(14px + env(safe-area-inset-bottom,0px))}.ww-transport-row{display:flex;align-items:center;gap:8px}.ww-transport-row:last-child .ww-chip{flex:1;min-width:0}.ww-play{font-size:24px}.ww-play.is-playing{background:var(--ww-red)}.ww-pause{display:flex;gap:5px;width:26px;height:26px;align-items:center;justify-content:center}.ww-pause:before,.ww-pause:after{content:"";width:7px;height:24px;border-radius:3px;background:var(--ww-cream)}.ww-loop{display:flex;flex:none;border:var(--ww-border);border-radius:12px;overflow:hidden;box-shadow:var(--ww-shadow-sm)}.ww-loop-btn{font:inherit;font-weight:800;font-size:12.5px;padding:10px 8px;display:flex;align-items:center;gap:5px;white-space:nowrap;background:var(--ww-paper);color:var(--ww-ink);cursor:pointer}.ww-loop-btn.is-on{background:var(--ww-teal)}.ww-loop-btn+.ww-loop-btn{border-left:var(--ww-border-thin)}.ww-inst{flex:1;min-width:0;justify-content:flex-start}.ww-inst-icon{font-size:17px;flex:none}.ww-inst-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ww-share{font-size:18px;min-width:52px}.ww-bpm-note{opacity:.6}.ww-bpm-strip{position:absolute;bottom:calc(100% + 12px);left:12px;right:12px;z-index:40;display:flex;align-items:center;gap:10px;padding:8px;background:var(--ww-paper);border:var(--ww-border);border-radius:var(--ww-radius-lg);box-shadow:var(--ww-shadow)}.ww-bpm-strip[hidden]{display:none}.ww-bpm-minus,.ww-bpm-plus{min-width:64px;font-size:24px;background:var(--ww-teal)}.ww-bpm-strip-val{flex:1;text-align:center;font-size:26px;font-weight:900;font-variant-numeric:tabular-nums}.ww-transport .ww-toast{bottom:calc(148px + env(safe-area-inset-bottom,0px))}.ww-spinner{width:18px;height:18px;border-radius:50%;border:3px solid var(--ww-ink);border-top-color:transparent;animation:ww-spin .8s linear infinite}.ww-overlay-root{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;pointer-events:none;font-family:var(--ww-font)}.ww-overlay-root.ww-overlay-open{pointer-events:auto}.ww-overlay-screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:var(--ww-cream);padding:calc(env(safe-area-inset-top,0px) + 10px) 14px calc(env(safe-area-inset-bottom,0px) + 14px);overflow:hidden;animation:ww-overlay-in .22s cubic-bezier(.2,1.4,.4,1)}@keyframes ww-overlay-in{0%{transform:translateY(24px) scale(.98);opacity:0}to{transform:none;opacity:1}}.ww-overlay-header{display:flex;align-items:center;gap:12px;padding:6px 2px 12px}.ww-overlay-titles{flex:1;min-width:0}.ww-overlay-title{margin:0;font-size:26px;font-weight:800;color:var(--ww-ink);letter-spacing:-.02em}.ww-overlay-sub{font-size:13px;font-weight:700;color:var(--ww-ink);opacity:.55;margin-top:2px}.ww-close-btn{width:56px;height:56px;flex:none;border-radius:var(--ww-radius);background:var(--ww-yellow);font-size:24px;font-weight:800;color:var(--ww-ink)}.ww-picker-tabs{display:flex;gap:8px;overflow-x:auto;margin:0 -14px;padding:4px 14px 12px;scroll-padding:0 14px;flex:none;-webkit-overflow-scrolling:touch;scrollbar-width:none}.ww-picker-tabs::-webkit-scrollbar{display:none}.ww-tab{flex:none;padding:10px 16px;border-radius:999px;background:#fffdf6;font-size:14px;font-weight:800;color:var(--ww-ink);white-space:nowrap}.ww-tab--selected{background:var(--ww-teal)}.ww-picker-grid{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px;align-content:start;padding:4px 2px 8px}.ww-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:104px;padding:12px 8px;border-radius:var(--ww-radius-lg);background:#fffdf6;color:var(--ww-ink)}.ww-tile--selected{background:var(--ww-orange);animation:ww-squash .18s ease-out}.ww-tile-icon{font-size:34px;line-height:1}.ww-tile-name{font-size:12.5px;font-weight:800;text-align:center;overflow-wrap:anywhere}.ww-picker-empty{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;gap:14px;padding:40px 16px;font-size:16px;font-weight:800;color:var(--ww-ink);opacity:.85;text-align:center}.ww-picker-empty p{margin:0}.ww-picker-rec-btn{padding:14px 22px;border-radius:var(--ww-radius-lg);background:var(--ww-red);color:#fffdf6;font-size:16px;font-weight:800}.ww-crate-now{display:flex;align-items:center;gap:14px;padding:10px 12px;margin-bottom:14px;flex:none;background:var(--ww-orange);border:var(--ww-border);border-radius:var(--ww-radius-lg);box-shadow:var(--ww-shadow)}.ww-crate-now-fields{flex:1;min-width:0}.ww-crate-now-label{display:block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--ww-ink);opacity:.65;margin-bottom:4px}.ww-rename{width:100%;box-sizing:border-box;padding:10px 12px;border:var(--ww-border);border-radius:var(--ww-radius);background:#fffdf6;font-family:var(--ww-font);font-size:17px;font-weight:800;color:var(--ww-ink);-webkit-user-select:text;user-select:text}.ww-rename:focus{outline:none;background:var(--ww-yellow)}.ww-vinyl-art{width:100%;aspect-ratio:1;border-radius:50%;overflow:hidden;border:var(--ww-border);background:var(--ww-ink);flex:none}.ww-vinyl-art svg{display:block;width:100%;height:100%}.ww-vinyl-art--now{width:64px}.ww-vinyl-art--spin{animation:ww-spin 3s linear infinite}.ww-crate-grid{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;display:grid;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:14px;align-content:start;padding:4px 2px 8px}.ww-vinyl{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 10px 10px;border-radius:var(--ww-radius-lg);background:#fffdf6;color:var(--ww-ink);touch-action:manipulation}.ww-vinyl--current{background:var(--ww-teal)}.ww-vinyl-name{font-size:13px;font-weight:800;text-align:center;overflow-wrap:anywhere;max-width:100%}.ww-vinyl-art--new{display:grid;place-items:center;background:var(--ww-yellow);font-size:34px;font-weight:800;color:var(--ww-ink)}.ww-action-scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:#2b1d1266;display:flex;align-items:flex-end;justify-content:center;padding:0 14px calc(env(safe-area-inset-bottom,0px) + 18px);animation:ww-overlay-in .15s ease-out}.ww-action-sheet{width:100%;max-width:420px;display:flex;flex-direction:column;gap:10px;padding:16px;background:var(--ww-cream);border:var(--ww-border);border-radius:var(--ww-radius-lg);box-shadow:0 5px 0 var(--ww-ink)}.ww-action-title{font-size:16px;font-weight:800;color:var(--ww-ink);text-align:center;padding-bottom:2px;overflow-wrap:anywhere}.ww-action-btn{padding:14px;border-radius:var(--ww-radius);background:#fffdf6;font-size:16px;font-weight:800;color:var(--ww-ink)}.ww-action-btn--danger{background:var(--ww-red);color:#fffdf6}.ww-action-btn--armed{background:var(--ww-ink);color:var(--ww-yellow)}.ww-mic-stage{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px}.ww-meter{display:flex;align-items:flex-end;gap:5px;height:88px;width:min(78vw,320px)}.ww-meter-bar{flex:1;height:8%;border-radius:6px;background:var(--ww-teal);border:2px solid var(--ww-ink);opacity:.35;transition:height .06s linear}.ww-meter--live .ww-meter-bar{opacity:1}.ww-meter--fake .ww-meter-bar{animation:ww-meter-pulse .9s ease-in-out infinite;animation-delay:calc(var(--bar-i) * .07s)}@keyframes ww-meter-pulse{0%,to{height:12%}50%{height:78%}}.ww-mic-btn{width:128px;height:128px;border-radius:50%;border:var(--ww-border);box-shadow:0 5px 0 var(--ww-ink);background:var(--ww-red);color:#fffdf6;font-family:var(--ww-font);display:grid;place-items:center;cursor:pointer;touch-action:manipulation}.ww-mic-btn:active{transform:translateY(5px);box-shadow:0 0 0 var(--ww-ink)}.ww-mic-btn-glyph{font-size:44px;line-height:1}.ww-mic-btn--recording{background:var(--ww-ink);color:var(--ww-red);animation:ww-mic-throb 1s ease-in-out infinite}@keyframes ww-mic-throb{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}.ww-mic-caption{font-size:15px;font-weight:800;color:var(--ww-ink);opacity:.7;font-variant-numeric:tabular-nums}.ww-mic-review{flex:1;min-height:0;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:14px;max-width:420px;width:100%;margin:0 auto;padding:0 6px}.ww-mic-review[hidden]{display:none}.ww-mic-review-label{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--ww-ink);opacity:.65}.ww-mic-review-btns{display:flex;gap:10px}.ww-mic-hear,.ww-mic-again{flex:1;padding:14px;border-radius:var(--ww-radius);background:#fffdf6;font-size:15px;font-weight:800;color:var(--ww-ink)}.ww-mic-save{padding:18px;border-radius:var(--ww-radius-lg);background:var(--ww-teal);font-size:19px;font-weight:800;color:var(--ww-ink)}.ww-overlay-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#2b1d1247}.ww-tray{position:absolute;left:50%;top:22%;transform:translate(-50%);width:min(92vw,380px);display:flex;flex-direction:column;gap:12px;padding:14px;background:var(--ww-cream);border:var(--ww-border);border-radius:var(--ww-radius-lg);box-shadow:0 5px 0 var(--ww-ink);animation:ww-tray-in .18s cubic-bezier(.2,1.4,.4,1)}@keyframes ww-tray-in{0%{transform:translate(-50%) translateY(-10px) scale(.96);opacity:0}to{transform:translate(-50%);opacity:1}}.ww-tray-header{display:flex;align-items:center;gap:10px}.ww-tray-dot{width:16px;height:16px;border-radius:50%;border:2px solid var(--ww-ink);flex:none}.ww-tray-title{flex:1;font-size:16px;font-weight:800;color:var(--ww-ink)}.ww-tray-close{width:44px;height:44px;flex:none;border-radius:var(--ww-radius);background:var(--ww-yellow);font-size:18px;font-weight:800;color:var(--ww-ink)}.ww-tray-instrument{display:flex;align-items:center;gap:10px;padding:12px 14px;font-size:16px;font-weight:800;background:#fffdf6;color:var(--ww-ink);border-radius:var(--ww-radius);text-align:left}.ww-tray-instrument-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ww-tray-swap{opacity:.55}.ww-tray-slider{display:flex;align-items:center;gap:12px}.ww-tray-slider-label{width:38px;flex:none;font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--ww-ink)}.ww-tray-slider input[type=range]{flex:1;-moz-appearance:none;appearance:none;-webkit-appearance:none;height:12px;border:2px solid var(--ww-ink);border-radius:999px;background:#fffdf6;outline:none;margin:10px 0}.ww-tray-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:30px;height:30px;border-radius:50%;background:var(--ww-orange);border:3px solid var(--ww-ink);box-shadow:0 2px 0 var(--ww-ink);cursor:pointer}.ww-tray-slider input[type=range]::-moz-range-thumb{width:30px;height:30px;border-radius:50%;background:var(--ww-orange);border:3px solid var(--ww-ink);box-shadow:0 2px 0 var(--ww-ink);cursor:pointer}.ww-tray-num-wrap{flex:none;display:flex;align-items:center;gap:2px;padding:4px 8px;border:2px solid var(--ww-ink);border-radius:var(--ww-radius);background:#fffdf6}.ww-tray-num{width:3ch;border:none;background:transparent;font:inherit;font-size:15px;font-weight:800;color:var(--ww-ink);text-align:right;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.ww-tray-num::-webkit-outer-spin-button,.ww-tray-num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.ww-tray-num:focus{outline:none}.ww-tray-num-wrap:focus-within{box-shadow:0 0 0 2px var(--ww-orange)}.ww-tray-num-suffix{font-size:12px;font-weight:800;color:var(--ww-ink);opacity:.6;min-width:1ch;text-align:center}[data-pan-num].ww-tray-num{width:4ch}.ww-tray-actions{display:flex;gap:10px}.ww-tray-clear{flex:1;padding:14px 10px;border-radius:var(--ww-radius);background:#fffdf6;font-size:14px;font-weight:800;color:var(--ww-ink)}.ww-tray-stamp{flex:2;position:relative;overflow:hidden;padding:14px 10px;border-radius:var(--ww-radius);background:var(--ww-red);font-size:15px;font-weight:800;color:#fffdf6;touch-action:manipulation}.ww-tray-stamp-fill{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--ww-yellow);transform:scaleX(0);transform-origin:left}.ww-tray-stamp--holding .ww-tray-stamp-fill{transition:transform .5s linear;transform:scaleX(1)}.ww-tray-stamp-label{position:relative}.ww-tray-stamp--holding .ww-tray-stamp-label{color:var(--ww-ink)}.ww-tray-hint{font-size:11.5px;font-weight:700;color:var(--ww-ink);opacity:.5;text-align:center}@media (prefers-reduced-motion: reduce){.ww-overlay-screen,.ww-action-scrim,.ww-tray,.ww-tile--selected,.ww-vinyl-art--spin,.ww-mic-btn--recording,.ww-meter--fake .ww-meter-bar{animation:none}.ww-tray-stamp--holding .ww-tray-stamp-fill{transition:none;transform:scaleX(1)}.ww-meter-bar{transition:none}.ww-meter--fake .ww-meter-bar{height:40%}}