:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#fafaf7;--surface:#fff;--surface-2:#f3f1eb;--ink:#1c1c1c;--ink-2:#333;--ink-3:#555;--muted:#666;--muted-2:#777;--rule:#e5e2da;--rule-strong:#999;--accent:#06c;--accent-soft:#e6f0fa;--accent-strong:#004c99;--on-accent:#fff;--ok:#2f7a3b;--ok-strong:#3d8b45;--ok-soft:#e9f7ea;--warn:#c49a12;--warn-soft:#fdf6e3;--danger:#b23a48;--danger-soft:#fbecec;--track:#e8e4dc;--sans:-apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;--mono:"SF Mono", Menlo, Consolas, monospace}html[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#1e1e1e;--surface:#262626;--surface-2:#2c2a27;--ink:#e8e6e3;--ink-2:#d9d6d1;--ink-3:#b8b4ae;--muted:#a8a49e;--muted-2:#93908a;--rule:#3d3b37;--rule-strong:#5b5852;--accent:#4d9fef;--accent-soft:#1d3348;--accent-strong:#77b5f3;--on-accent:#10151a;--ok:#7cc98a;--ok-strong:#6dbb76;--ok-soft:#213827;--warn:#d9b04a;--warn-soft:#3a3117;--danger:#e07a86;--danger-soft:#3a2124;--track:#3a3833}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:18px;line-height:1.6}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button{font:inherit;cursor:pointer;border:1px solid var(--rule);background:var(--surface);color:var(--ink);border-radius:10px;padding:.5rem 1rem}button:disabled{opacity:.5;cursor:default}input,textarea,select{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--rule);border-radius:8px;padding:.4rem .6rem}.app-header{border-bottom:1px solid var(--rule);background:var(--surface);z-index:10;align-items:center;gap:1.25rem;padding:.6rem 1.25rem;display:flex;position:sticky;top:0}.app-header .brand{color:var(--ink);font-weight:700}.app-header nav{flex-wrap:wrap;gap:.9rem;display:flex}.app-header nav a{color:var(--ink-3)}.app-header nav a.active{color:var(--accent);font-weight:600}.app-header .spacer{flex:1}.app-main{max-width:980px;margin:0 auto;padding:1.5rem 1.25rem 4rem}.ui-panel{background:var(--surface);border:1px solid var(--rule);border-radius:14px;margin:0 0 1.1rem;padding:1.1rem 1.3rem}.ui-panel>h2{margin:0 0 .6rem;font-size:1.05rem}.ui-stats{flex-wrap:wrap;gap:1rem;display:flex}.ui-stat{background:var(--surface);border:1px solid var(--rule);border-radius:14px;flex:8rem;padding:.8rem 1rem}.ui-stat .value{font-variant-numeric:tabular-nums;font-size:1.8rem;font-weight:700}.ui-stat .label{color:var(--muted);font-size:.85rem}.ui-pill{border:1px solid var(--rule);color:var(--muted);background:var(--surface-2);border-radius:999px;padding:.1rem .65rem;font-size:.8rem}.ui-pill.ok{color:var(--ok);border-color:var(--ok-soft);background:var(--ok-soft)}.ui-pill.warn{color:var(--warn);border-color:var(--warn-soft);background:var(--warn-soft)}.ui-pill.bad{color:var(--danger);border-color:var(--danger-soft);background:var(--danger-soft)}.ui-empty{color:var(--muted);font-style:italic}.ui-error{background:var(--danger-soft);color:var(--danger);border:1px solid var(--danger);border-radius:10px;margin:0 0 1rem;padding:.6rem 1rem}.ui-banner{background:var(--warn-soft);color:var(--ink-2);border:1px solid var(--rule);border-radius:10px;margin:0 0 1rem;padding:.6rem 1rem}.ui-primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}.mono{font-family:var(--mono);font-size:.85em}.muted{color:var(--muted)}.small{font-size:.85rem}.pair{flex-direction:column;gap:20px;display:flex}.pair-code-block{text-align:center}.pair-code{font-family:var(--mono);letter-spacing:.08em;font-variant-numeric:tabular-nums;font-size:clamp(4rem,18vw,12rem);line-height:1}.pair-host{text-align:center}.pair-stage{aspect-ratio:16/9;background:var(--track);border-radius:14px;place-items:center;display:grid;overflow:hidden}.pair-stage img{object-fit:contain;width:100%;height:100%}.pair-stage img.dim{opacity:.5;filter:grayscale(.6)}.pair-status{margin-bottom:12px}.app-main-workbench{max-width:none;padding:0}.icon-text{justify-content:center;align-items:center;gap:.5rem;display:inline-flex}.icon-button{flex:0 0 42px;place-items:center;width:42px;height:42px;padding:0;display:inline-grid}.icon-button svg{width:20px;height:20px}.icon-button.active,.gesture-toggle.active{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}.danger-text{color:var(--danger)}.spin{animation:1s linear infinite practice-spin}@keyframes practice-spin{to{transform:rotate(360deg)}}.project-library{max-width:1080px;margin:0 auto}.project-library-heading{justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.5rem;display:flex}.project-library-heading h1{letter-spacing:0;margin:0;font-size:2rem}.project-library-heading p{margin:.15rem 0 0}.library-actions{gap:8px;display:flex}.project-empty{border-block:1px solid var(--rule);min-height:360px;color:var(--muted);place-content:center;justify-items:center;gap:.8rem;display:grid}.project-empty h2{color:var(--ink);margin:0;font-size:1.15rem}.project-list{border-top:1px solid var(--rule)}.project-row{border-bottom:1px solid var(--rule);align-items:stretch;min-height:88px;display:flex;position:relative}.project-open{min-width:0;color:var(--ink);flex:1;grid-template-columns:54px minmax(180px,1fr) repeat(3,minmax(90px,.35fr));align-items:center;gap:1rem;padding:.8rem .4rem;display:grid}.project-open:hover{background:var(--surface-2);text-decoration:none}.project-media-icon{background:var(--surface-2);border:1px solid var(--rule);width:46px;height:46px;color:var(--accent);border-radius:8px;place-items:center;display:grid}.project-summary{flex-direction:column;min-width:0;display:flex}.project-summary strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.project-summary span,.project-stat{color:var(--muted);font-size:.82rem}.project-stat{flex-direction:column;display:flex}.project-stat strong{color:var(--ink);font-size:1rem}.project-menu{align-self:center;margin-left:.5rem}.project-menu summary{cursor:pointer;border-radius:8px;place-items:center;width:42px;height:42px;list-style:none;display:grid}.project-menu summary::-webkit-details-marker{display:none}.project-menu[open]>div{z-index:4;border:1px solid var(--rule);background:var(--surface);border-radius:8px;width:160px;padding:.35rem;position:absolute;top:64px;right:0;box-shadow:0 10px 28px #00000029}.project-menu div button{background:0 0;border:0;justify-content:flex-start;width:100%}.practice-workbench{background:var(--bg);min-height:calc(100vh - 58px)}.workbench-bar{border-bottom:1px solid var(--rule);background:var(--surface);align-items:center;gap:10px;height:58px;padding:8px 14px;display:flex}.project-title-input{border-color:#0000;flex:1;min-width:140px;max-width:420px;font-weight:650}.project-title-input:focus{border-color:var(--accent)}.helper-state{color:var(--danger);white-space:nowrap;font-size:.72rem}.helper-state.online{color:var(--ok)}.gesture-toggle{height:42px;padding-inline:.75rem}.save-state{color:var(--muted);text-align:right;min-width:52px;font-size:.75rem}.save-state.failed{color:var(--danger)}.workbench-message{margin:12px 14px 0}.helper-banner{background:var(--warn-soft);color:var(--ink-2);border-bottom:1px solid var(--rule);padding:7px 14px;font-size:.78rem}.helper-banner code{font-family:var(--mono)}.workbench-grid{border-bottom:1px solid var(--rule);grid-template-columns:minmax(0,1fr) 72px;min-height:min(67vh,740px);display:grid}.workbench-grid.with-inspector{grid-template-columns:minmax(0,1fr) 72px 330px}.media-stage-wrap{background:#111;flex-direction:column;min-width:0;padding:12px;display:flex}.media-stage{flex:1;place-items:center;min-height:0;display:grid;position:relative;overflow:hidden}.media-stage video{object-fit:contain;width:100%;height:100%;max-height:min(62vh,680px)}.media-stage.mirrored video{transform:scaleX(-1)}.media-stage audio{display:none}.countdown-overlay{color:#fff;pointer-events:none;background:#00000052;place-content:center;justify-items:center;display:grid;position:absolute;inset:0}.countdown-overlay strong{font-variant-numeric:tabular-nums;font-size:clamp(4rem,12vw,9rem);line-height:1}.countdown-overlay span{text-transform:uppercase;font-size:.8rem}.audio-visual{color:#f7f7f7;flex-direction:column;align-items:center;gap:.7rem;display:flex}.audio-visual span{color:#aaa;font-size:.85rem}.source-gate{color:#eee;place-items:center;gap:.8rem;display:grid}.compatibility-gate{background:#151515;position:absolute;inset:0}.source-gate svg{color:#aaa;width:42px;height:42px}.transport-time{color:#aaa;font-family:var(--mono);justify-content:space-between;padding-top:5px;font-size:.72rem;display:flex}.control-rail{border-left:1px solid var(--rule);background:var(--surface);flex-direction:column;align-items:center;gap:9px;padding:12px 8px;display:flex}.primary-transport{width:52px;height:52px;color:var(--on-accent);background:var(--accent);border-color:var(--accent);place-items:center;padding:0;display:grid}.primary-transport svg{width:25px;height:25px}.paired-buttons{width:54px;display:flex}.paired-buttons .icon-button{border-radius:8px 0 0 8px;flex-basis:27px;width:27px;padding:0}.paired-buttons .icon-button+.icon-button{border-left:0;border-radius:0 8px 8px 0}.speed-control{text-align:center;color:var(--muted);gap:2px;font-size:.65rem;display:grid}.speed-control select{width:56px;padding:.25rem .1rem;font-size:.72rem}.countdown-control{width:56px;color:var(--muted);grid-template-columns:20px 1fr;align-items:center;gap:2px;display:grid}.countdown-control svg{width:18px}.countdown-control select{width:34px;padding:.2rem 0;font-size:.68rem}.setup-inspector{border-left:1px solid var(--rule);background:var(--surface);max-height:min(67vh,740px);overflow:auto}.inspector-heading{border-bottom:1px solid var(--rule);justify-content:space-between;align-items:center;height:52px;padding:12px 14px;display:flex}.inspector-heading h2{margin:0;font-size:1rem}.inspector-heading span{color:var(--muted);font-size:.68rem}.source-facts{border-bottom:1px solid var(--rule);margin:0;padding:10px 14px;font-size:.75rem}.source-facts div{grid-template-columns:54px minmax(0,1fr);gap:8px;display:grid}.source-facts dt{color:var(--muted)}.source-facts dd{text-overflow:ellipsis;white-space:nowrap;margin:0;overflow:hidden}.inspector-section{border-bottom:1px solid var(--rule);padding:12px 14px}.inspector-section h3{text-transform:uppercase;color:var(--muted);margin:0 0 9px;font-size:.78rem;font-weight:650}.bounds-row{grid-template-columns:1fr auto;align-items:end;gap:6px;margin-top:7px;display:grid}.bounds-row label{grid-template-columns:40px 1fr;align-items:center;gap:4px;font-size:.72rem;display:grid}.bounds-row input{width:100%;min-width:0;padding:.25rem .35rem}.bounds-row button{padding:.25rem .45rem;font-size:.68rem}.section-title-row{justify-content:space-between;align-items:baseline;display:flex}.confidence-good,.confidence-warn{color:var(--ok);font-size:.66rem}.confidence-warn{color:var(--warn)}.wide-button{width:100%}.tap-tempo-button{justify-content:space-between;width:100%;margin-top:6px;display:flex}.tap-tempo-button span{color:var(--muted);font-variant-numeric:tabular-nums}.grid-summary{color:var(--muted);justify-content:space-between;margin:10px 0;font-size:.72rem;display:flex}.grid-summary strong{color:var(--ink)}.correction-grid{grid-template-columns:1fr 1fr;gap:5px;display:grid}.correction-grid button{padding:.32rem;font-size:.68rem}.nudge-control{grid-template-columns:auto 1fr 48px;align-items:center;gap:5px;margin-top:10px;font-size:.68rem;display:grid}.nudge-control input{width:100%;padding:0}.section-create{grid-template-columns:1fr auto;gap:5px;display:grid}.section-create input{min-width:0}.section-list{gap:4px;margin-top:8px;display:grid}.section-item{text-align:left;grid-template-columns:1fr auto auto;align-items:center;gap:7px;padding:.4rem .5rem;display:grid}.section-item small,.section-item svg{color:var(--muted)}.music-timeline{-webkit-user-select:none;user-select:none;touch-action:none;cursor:crosshair;height:104px;margin:0 18px;position:relative;overflow:visible}.timeline-track{background:var(--track);border-radius:4px;height:7px;position:absolute;inset:38px 0 auto}.beat-marker{background:var(--muted-2);z-index:2;border-radius:2px;width:4px;height:17px;margin-left:-2px;position:absolute;top:33px}.beat-marker.downbeat{background:var(--ink-3);width:5px;height:25px;top:29px}.beat-marker.eight{background:var(--accent);height:33px;top:25px}.beat-marker.phrase{width:7px;height:41px;margin-left:-3px;top:21px}.beat-marker small{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.64rem;position:absolute;top:35px;left:50%;transform:translate(-50%)}.timeline-selection{background:color-mix(in srgb, var(--accent) 22%, transparent);border-inline:2px solid var(--accent);z-index:1;height:33px;position:absolute;top:25px}.timeline-playhead{background:var(--danger);z-index:3;pointer-events:none;width:2px;height:48px;position:absolute;top:18px}.timeline-playhead:before{content:"";border:6px solid #0000;border-top-color:var(--danger);position:absolute;top:-1px;left:-5px}.music-timeline.uncertain .beat-marker{color:var(--warn);background-color:#0000;background-image:repeating-linear-gradient(currentColor 0 3px,#0000 3px 6px)}.raw-seek{width:100%;position:absolute;inset:25px 0 auto}.workbench-loading{min-height:60vh;color:var(--muted);place-content:center;align-items:center;gap:.7rem;display:flex}@media (width<=960px){.workbench-grid.with-inspector{grid-template-columns:minmax(0,1fr) 64px}.setup-inspector{border-left:0;border-top:1px solid var(--rule);grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;display:grid}.inspector-heading,.source-facts{grid-column:1/-1}.helper-state{display:none}}@media (width<=660px){.app-header{position:static}.project-library-heading{align-items:flex-start}.project-open{grid-template-columns:48px minmax(0,1fr)}.project-stat{display:none}.workbench-bar{flex-wrap:wrap;height:auto}.project-title-input{flex-basis:calc(100% - 60px);order:2}.save-state{margin-left:auto}.gesture-toggle{display:none}.workbench-grid,.workbench-grid.with-inspector{grid-template-columns:1fr}.media-stage-wrap{min-height:42vh}.control-rail{border-left:0;border-top:1px solid var(--rule);flex-flow:wrap;justify-content:center}.setup-inspector{grid-template-columns:1fr}.inspector-heading,.source-facts{grid-column:auto}}
