*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}*{scrollbar-width:none}*::-webkit-scrollbar{display:none}:root{--color-bg: #EDE8DC;--color-fg: #1E2028;--color-surface: #E2DDD3;--color-muted: #9A9680;--color-olive: #787845;--color-blue: #4472B4;--color-salmon: #E8A090;--color-purple: #9B6BA0;--color-teal: #4A9B9B;--color-chance: #5b7dba;--color-danger: #f87171;--danger-border: rgba(248,113,113,.4);--danger-bg-hover: rgba(248,113,113,.15);--lz-divider: rgba(30,32,40, .06);--lz-bg-hover: rgba(30,32,40, .06);--lz-border-subtle: rgba(30,32,40, .08);--lz-bg-active: rgba(30,32,40, .08);--lz-border: rgba(30,32,40, .1);--lz-border-mid: rgba(30,32,40, .12);--lz-bg-press: rgba(30,32,40, .14);--lz-border-strong: rgba(30,32,40, .15);--lz-text-hint: rgba(30,32,40, .35);--lz-text-mid: rgba(30,32,40, .5);--lz-step-border: rgba(30,32,40, .5);--lz-text: rgba(30,32,40, .55);--lz-text-strong: rgba(30,32,40, .7);--dz-divider: rgba(237,232,220, .06);--dz-bg-hover: rgba(237,232,220, .08);--dz-border-subtle: rgba(237,232,220, .1);--dz-bg-active: rgba(237,232,220, .12);--dz-bg-press: rgba(237,232,220, .15);--dz-border: rgba(237,232,220, .15);--dz-border-mid: rgba(237,232,220, .25);--dz-border-strong: rgba(237,232,220, .3);--dz-text-dim: rgba(237,232,220, .35);--dz-btn-border: rgba(237,232,220, .35);--dz-text-mid: rgba(237,232,220, .55);--dz-transport-border: rgba(237,232,220, .45);--dz-text: rgba(237,232,220, .7);--dz-text-strong: rgba(237,232,220, .85);--dz-text-bright: rgba(237,232,220, .9);--olive-bg-subtle: rgba(120,120,69, .08);--olive-bg: rgba(120,120,69, .15);--olive-border: rgba(120,120,69, .3);--olive-border-strong: rgba(120,120,69, .4);--blue-bg-subtle: rgba(68,114,180, .08);--blue-bg-playhead: rgba(68,114,180, .13);--salmon-bg-scale: rgba(232,160,144, .06);--salmon-bg-key: rgba(232,160,144, .08);--fs-min: 8px;--fs-sm: 9px;--fs-md: 10px;--fs-lg: 11px;--fs-base: 12px;--radius-sm: 4px;--radius-md: 6px;--font-display: "Bebas Neue", "Anton", sans-serif;--font-data: "JetBrains Mono", "Fira Code", monospace}html,body,#app{height:100%;overscroll-behavior:none}body{background:var(--color-bg);color:var(--color-fg);font-family:var(--font-data);font-size:12px;line-height:1.4;-webkit-font-smoothing:antialiased;overscroll-behavior:none}#app{display:flex;flex-direction:column}button{font-family:var(--font-data);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none}button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--color-olive);outline-offset:1px}.flip-host{perspective:80px}.flip-card{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .18s ease-out}.flip-card.flipped{transform:rotateY(180deg)}.flip-host:active .flip-card{transform:scale(.85)}.flip-host:active .flip-card.flipped{transform:rotateY(180deg) scale(.85)}.flip-card>.flip-face{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;backface-visibility:hidden}.flip-card>.flip-face.back{transform:rotateY(180deg)}@keyframes ph-glow{0%{filter:brightness(1.5)}to{filter:brightness(1)}}@keyframes vel-glow{0%{filter:brightness(1.5)}to{filter:brightness(1)}}.tap-pulse{position:fixed;width:8px;height:8px;margin-left:-4px;margin-top:-4px;border-radius:50%;background:var(--color-blue);pointer-events:none;z-index:9999;animation:tap-pulse .2s ease-out forwards}@keyframes tap-pulse{0%{transform:scale(1);opacity:.6}to{transform:scale(2) translateY(8px);opacity:0}}@media(prefers-reduced-motion:reduce){.tap-pulse{animation:none;display:none}}