.command-lab{max-width:960px;margin:0 auto;padding:1rem}.command-lab section{margin:1.5rem 0}.command-lab code{font-size:.9em}.lab-list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}.lab-list>li{border:1px solid #8884;border-radius:6px;padding:.5rem .75rem}.lab-hint{color:#888;font-size:.9em}.lab-reading{display:flex;align-items:center;gap:.5rem;margin-top:.25rem}.lab-reading meter{width:12rem}.lab-camera{position:relative;width:100%;max-width:640px;background:#111}.lab-camera video,.lab-camera canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.lab-camera video{object-fit:fill;transform:scaleX(-1)}.lab-lamp{display:inline-block;width:.9em;height:.9em;border-radius:50%;background:#8886}.lab-lamp[data-on=true]{background:#2ecc40;box-shadow:0 0 6px #2ecc40}[data-testid^=control-][data-flash=true]{background:#ffe9a8}[data-testid^=rule-][data-enabled=false]{opacity:.45}[data-testid^=rule-][data-fired=true]{background:#d7f5dc}[data-testid=lab-issues] li[data-level=error]{border-color:#d33}[data-testid=lab-issues] li[data-level=warning]{border-color:#e8a317}.lab-log{margin:0;padding-left:1.25rem;font-size:.9em}.lab-map-strip{margin:0 0 12px;padding:10px 14px 12px;border:1px dashed var(--rule-strong, #8888);border-radius:2px;background:color-mix(in srgb,var(--night, #0b0a0c) 40%,transparent);display:grid;gap:8px}.lab-map-heading{margin:0;font:var(--label-weight, 500) 11px/1.3 var(--sans, sans-serif);letter-spacing:var(--kicker-track, .08em);text-transform:uppercase;color:var(--muted, #888)}.lab-map-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}.lab-map-field{display:inline-flex;align-items:center;gap:8px;font:var(--label-weight, 500) 13px/1.2 var(--sans, sans-serif);color:var(--muted, #888)}.lab-map-field select{min-width:11rem;max-width:16rem}.lab-map-field>select{margin-left:0}.lab-map-arrow{font:400 20px/1 var(--serif, Georgia, serif);color:var(--muted, #888)}.lab-map-soon{margin-left:8px;padding:1px 7px;border:1px solid currentColor;border-radius:999px;font-size:9px;letter-spacing:.08em;opacity:.85}.lab-map-note{margin:0;font-size:12px;color:var(--muted, #888)}.command-lab .lab-rule-grid{--rule-gap: 12px;list-style:none;margin:0;padding:4px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--rule-gap);max-height:min(44vh,400px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--rule-strong, #8888) transparent}.command-lab .lab-rule-grid>.lab-rule-card{position:relative;min-height:132px;min-width:0;display:flex;flex-direction:column;gap:8px;padding:14px 16px 16px;border:1px solid var(--rule, #8884);border-radius:2px;background:color-mix(in srgb,var(--night, #0b0a0c) 55%,transparent);transition:transform .18s ease-out}.lab-rule-card{--tag: var(--paper-white, #f2eee6)}.lab-rule-card[data-section=learn]{--tag: var(--learn-a, #1fb3bf)}.lab-rule-card[data-section=play]{--tag: var(--play-a, #ff7a00)}.lab-rule-card[data-section=create]{--tag: var(--create-a, #c9a8ff)}.lab-rule-card[data-section=lab]{--tag: var(--lab-a, #2f5bff)}.lab-rule-card:after{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border:1.5px solid var(--tag);border-radius:2px;box-shadow:0 0 18px color-mix(in srgb,var(--tag) 45%,transparent);opacity:0;pointer-events:none;transition:opacity .42s ease-out}.command-lab .lab-rule-grid>.lab-rule-card[data-fired=true]{background:color-mix(in srgb,var(--night, #0b0a0c) 55%,transparent);border-color:var(--rule, #8884);transform:scale(1.025);transition-duration:90ms}.lab-rule-card[data-fired=true]:after{opacity:1;transition-duration:60ms}.lab-rule-top{display:flex;align-items:center;gap:8px;font:var(--label-weight, 500) 12px/1.2 var(--sans, sans-serif);letter-spacing:var(--label-track, 0);color:var(--muted, #888)}.lab-rule-number{flex:1}.lab-rule-tag{padding:3px 9px;border:1px solid var(--tag);border-radius:999px;color:var(--tag);font:var(--label-weight, 500) 12px/1.2 var(--sans, sans-serif);letter-spacing:var(--label-track, 0)}.lab-rule-name{font:400 24px/1.1 var(--serif, Georgia, serif);overflow-wrap:anywhere}.lab-rule-off{align-self:flex-start;font:var(--label-weight, 500) 12px/1.2 var(--sans, sans-serif);color:var(--muted, #888);border:1px dashed var(--rule-strong, #8888);padding:2px 8px}.lab-rule-facts{margin:auto 0 0;display:grid;gap:6px;font:var(--label-weight, 500) 13px/1.35 var(--sans, sans-serif);letter-spacing:var(--label-track, 0)}.lab-rule-facts>div{display:grid;grid-template-columns:3.2em 1fr;gap:6px;align-items:baseline}.lab-rule-facts dt{color:var(--muted, #888)}.lab-rule-facts dd{margin:0;min-width:0;overflow-wrap:anywhere}@media(prefers-reduced-motion:reduce){.command-lab .lab-rule-grid>.lab-rule-card,.command-lab .lab-rule-grid>.lab-rule-card[data-fired=true]{transform:none;transition:none}.lab-rule-card:after{transition:none}}.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at center,transparent 45%,rgba(0,0,0,.55) 100%),radial-gradient(circle,color-mix(in srgb,var(--a) 22%,transparent) 0 1px,transparent 1.6px) 0 0 / 9px 9px,var(--bg)}.backdrop-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .4s ease-out}.backdrop[data-scene=on] .backdrop-canvas{opacity:1}@media(prefers-reduced-motion:reduce){.backdrop-canvas{transition:none}}.command-toast{position:fixed;left:0;right:0;top:36%;display:flex;justify-content:center;pointer-events:none;z-index:60}.command-toast__word{font-family:"Instrument Serif",serif;font-weight:400;font-size:clamp(48px,9vw,120px);line-height:1;letter-spacing:-.01em;text-shadow:0 2px 24px rgba(0,0,0,.45);animation:command-toast 1.2s ease-out both}@keyframes command-toast{0%{opacity:0;transform:translateY(12px)}12.5%{opacity:1;transform:translateY(0)}87.5%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-8px)}}@media(prefers-reduced-motion:reduce){.command-toast__word{animation:none}}.hand-pointer{position:fixed;left:0;top:0;width:56px;height:56px;margin:-28px 0 0 -28px;pointer-events:none;z-index:9999;opacity:0;color:var(--hand-color, #f2eee6);transition:opacity .2s ease,color .15s ease;will-change:transform}.hand-pointer svg{display:block;overflow:visible}.hand-pointer-ring{transform-box:view-box;transform-origin:0 0;transition:transform .12s ease-out}.hand-pointer[data-grabbed=true] .hand-pointer-ring{transform:scale(.7)}.hand-pointer-dot{fill:none;stroke:currentColor;stroke-width:1.5}.hand-pointer-fill{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round}.hand-pointer[data-grabbed=true] .hand-pointer-dot{stroke-width:3}.hand-pointer[data-grabbed=true] .hand-pointer-fill{stroke-width:4.5}.hand-hover{outline:2px solid var(--hand-ink, currentColor);outline-offset:4px;scale:1.05;transition:scale .15s ease,translate .15s ease}.hand-grabbed{outline:3px solid var(--hand-ink, currentColor);outline-offset:4px;scale:1.09;translate:0 -4px;transition:scale .12s ease-out,translate .12s ease-out}.app-header button,.panel-toggle,.entrance button,.guide-overlay button,.hands-overlay button{position:relative}.app-header button:after,.panel-toggle:after,.entrance button:after,.guide-overlay button:after,.hands-overlay button:after{content:"";position:absolute;left:50%;top:50%;width:max(100%,48px);height:max(100%,48px);transform:translate(-50%,-50%)}.record.hand-hover,.record.hand-grabbed{transition:transform .6s cubic-bezier(.65,0,.35,1),opacity .6s ease-in-out,scale .12s ease-out,translate .12s ease-out}.history-page{position:fixed;--history-top: 250px;inset:var(--history-top) 48px 28px;height:calc(100vh - var(--history-top) - 28px);height:calc(100dvh - var(--history-top) - 28px);box-sizing:border-box;overflow:hidden;z-index:3;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:18px;padding:26px 32px 22px;color:var(--paper-white);background:#0c09079e;border:1px solid rgba(242,238,230,.16);border-radius:18px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto}.history-body{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:32px;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:4px}.history-progress{display:flex;flex-direction:column;gap:14px;min-height:0}.history-progress svg{width:100%;flex:0 1 auto;color:#ff7a00}.history-stats{display:flex;gap:40px;margin:0}.history-stats div{display:flex;flex-direction:column-reverse}.history-stats dt{font:500 11px / 1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#f2eee69e}.history-stats dd{margin:0;font:400 34px / 1 var(--serif)}.history-axis,.history-muted,.history-empty{margin:0;font:500 13px / 1.45 var(--sans);color:#f2eee6b8}.history-empty{font:400 26px / 1.2 var(--serif);color:var(--paper-white);align-self:center;margin:auto 0}.history-feedback{display:flex;flex-direction:column;gap:10px;min-height:0}.history-kicker{margin:0;font:500 11px / 1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#f2eee69e}.history-feedback-list{margin:0;padding:0;list-style:none;overflow:auto;min-height:0;font:500 13px / 1.45 var(--sans)}.history-feedback-list li{display:flex;flex-direction:column;gap:4px;padding:9px 0;border-top:1px solid rgba(242,238,230,.14)}.history-feedback-list li:first-child{border-top:0;padding-top:0}.history-feedback-list b{font:400 18px / 1.1 var(--serif)}.history-coach em{font-style:normal;color:#ff7a00}.history-foot{display:flex;align-items:center;gap:14px}.history-creations{position:absolute;left:32px;right:32px;top:118px;bottom:74px;box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain;padding:16px 20px;background:#0c0907f0;border:1px solid rgba(242,238,230,.18);border-radius:14px;z-index:4}.history-creations h3{margin:0 0 8px;font:400 22px / 1.1 var(--serif)}.learn-letters{z-index:1}.learn-tools{position:fixed;z-index:20;right:var(--gut, 28px);bottom:10px;display:flex;flex-direction:row;align-items:center;gap:6px}.learn-tools [data-testid=btn-restart]{order:-1}.learn-tools .pill{padding:5px 12px;font-size:12px;background:color-mix(in srgb,var(--bg) 40%,transparent)}.learn-tools .pill[aria-pressed=true]{background:var(--paper-white);color:var(--night)}.learn-pause-mark{position:fixed;z-index:10;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;gap:22px;pointer-events:none;opacity:.85;animation:learn-fade-in .4s ease-out}.learn-pause-mark span{display:block;width:30px;height:120px;border-radius:8px;background:currentColor}.learn-countdown{position:fixed;z-index:10;left:50%;top:50%;transform:translate(-50%,-50%);font:400 clamp(120px,24vh,240px) / 1 var(--serif, Georgia, serif);pointer-events:none;text-shadow:var(--halo, none);animation:learn-fade-in .25s ease-out}.learn-scrub-time{position:fixed;z-index:13;left:0;top:0;padding:4px 10px;border-radius:999px;background:#141210d9;color:var(--paper-white, #f2eee6);font:500 13px/1.2 var(--sans, sans-serif);font-variant-numeric:tabular-nums;opacity:0;pointer-events:none;will-change:transform}html[data-learn-scrub] .sheet-strip{cursor:grabbing}@keyframes learn-fade-in{0%{opacity:0}}.sound-unlock{position:fixed;left:50%;bottom:24px;z-index:60;transform:translate(-50%);display:inline-flex;align-items:center;gap:10px;margin:0;padding:9px 18px;border:1.5px solid var(--a, #ff7a00);border-radius:999px;font:var(--label-weight, 600) 13px / 1.2 var(--sans, sans-serif);letter-spacing:var(--label-track, .04em);color:var(--cream, #fff6e8);background:var(--panel-soft, rgba(20, 12, 24, .72));white-space:nowrap;pointer-events:none;animation:sound-unlock-in .5s ease-out both}.sound-unlock i{width:8px;height:8px;border-radius:50%;background:var(--a, #ff7a00);animation:sound-unlock-breathe 1.6s ease-in-out infinite}@keyframes sound-unlock-in{0%{opacity:0;transform:translate(-50%,8px)}}@keyframes sound-unlock-breathe{50%{opacity:.35}}@media(prefers-reduced-motion:reduce){.sound-unlock,.sound-unlock i{animation:none}}@font-face{font-family:Instrument Sans;font-style:normal;font-weight:400 600;font-display:swap;src:url(/fonts/instrument-sans-latin.woff2) format("woff2")}@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/instrument-serif-latin.woff2) format("woff2")}@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/instrument-serif-italic-latin.woff2) format("woff2")}@font-face{font-family:Mea Culpa;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/mea-culpa-latin.woff2) format("woff2")}@property --a{syntax: "<color>"; inherits: true; initial-value: #ff2d8a;}@property --bg{syntax: "<color>"; inherits: true; initial-value: #0b0a0c;}@property --b{syntax: "<color>"; inherits: true; initial-value: #f4e4a1;}:root{--night: #0b0a0c;--cream: #f4e4a1;--paper-white: #f2eee6;--field-teal: #5fe1d6;--panel: rgba(11, 10, 12, .78);--panel-strong: rgba(11, 10, 12, .9);--panel-soft: rgba(11, 10, 12, .55);--rule: rgba(244, 228, 161, .22);--rule-strong: rgba(244, 228, 161, .5);--muted: rgba(244, 228, 161, .72);--error: #ff6b5e;--warning: #ffb547;--sheet-paper: #f2eee6;--sheet-ink: #0b0a0c;--learn-a: #1fb3bf;--learn-b: #ff4a3d;--play-a: #ff7a00;--play-b: #ff2d8a;--create-a: #c9a8ff;--create-b: #ff4fa3;--lab-a: #2f5bff;--lab-b: #ff9a1f;--intro-a: #ff2d8a;--intro-b: #f4e4a1;--serif: "Instrument Serif", Georgia, "Times New Roman", serif;--sans: "Instrument Sans", "Segoe UI", system-ui, sans-serif;--label-weight: 500;--label-track: -.01em;--kicker-track: .06em;--script: "Mea Culpa", "Segoe Script", cursive;--m: 28px;--a: var(--intro-a);--b: var(--intro-b);--bg: var(--night);--a-text: var(--a);color-scheme:dark}.app[data-mode=learn]{--bg: #08161a;--a: var(--learn-a);--b: var(--learn-b)}.app[data-mode=play]{--bg: #170c06;--a: var(--play-a);--b: var(--play-b)}.app[data-mode=create]{--bg: #120d1a;--a: var(--create-a);--b: var(--create-b)}.app[data-mode=lab]{--bg: #070b1c;--a: var(--lab-a);--b: var(--lab-b);--a-text: #4a72ff;--on-a: var(--paper-white)}.app[data-screen=entrance]{--a: var(--intro-a);--b: var(--intro-b)}.app[data-screen=entrance],.app[data-screen=menu]{--bg: var(--night)}.app{transition:--a .5s ease-out,--b .5s ease-out,--bg .5s ease-out}@media(max-width:640px){:root{--m: 16px}}@media(prefers-reduced-motion:reduce){.app{transition:none}}:root{font-family:var(--sans);font-size:16px;line-height:1.45;color:var(--paper-white);background:var(--night);accent-color:var(--a);--on-a: var(--night)}*{box-sizing:border-box}body{margin:0;background:var(--night)}button,select,input::file-selector-button{font:800 11px/1.2 var(--sans);font-stretch:100%;letter-spacing:.1em;text-transform:uppercase;color:var(--paper-white);background:transparent;border:1.5px solid var(--a);border-radius:999px;padding:9px 16px;min-height:36px;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}select{text-transform:none;letter-spacing:.02em;font-weight:600;font-size:13px;padding:7px 12px;background:var(--panel-strong)}option{color:var(--paper-white);background:var(--night)}button:hover:not(:disabled),input::file-selector-button:hover{background:var(--a);color:var(--on-a)}select:hover:not(:disabled){border-color:var(--paper-white)}button:disabled,select:disabled{cursor:not-allowed;opacity:.4;border-color:var(--rule-strong)}[data-testid=btn-play],[data-testid=btn-practice-start],[data-testid=use-demo],button[aria-pressed=true]{background:var(--a);color:var(--on-a)}[data-testid=btn-play]:hover:not(:disabled),[data-testid=btn-practice-start]:hover:not(:disabled),[data-testid=use-demo]:hover:not(:disabled),button[aria-pressed=true]:hover:not(:disabled){background:var(--paper-white);border-color:var(--paper-white);color:var(--night)}input[type=file]{font:500 .85rem var(--sans);max-width:100%}input[type=range]{accent-color:var(--a)}label{font-weight:500}label>select,label>input:not([type=checkbox],[type=radio]){margin-left:.4rem}input[type=text],input[type=search],input[type=number],input:not([type]),textarea{font:500 .95rem var(--sans);color:var(--paper-white);background:var(--panel-strong);border:1px solid var(--rule-strong);border-radius:4px;padding:.45rem .7rem;max-width:100%}:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--paper-white);outline-offset:3px}.camera-preview{max-width:320px;padding:.6rem}.camera-preview-frame{position:relative;width:100%;overflow:hidden;background:var(--night);border:1px solid var(--rule)}.camera-preview-video,.camera-preview-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.camera-preview-video{object-fit:fill;transform:scaleX(-1)}.camera-preview figcaption{margin-top:.45rem;font:800 10px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}h1,h2,h3{font-weight:400;letter-spacing:0}h2{margin:0 0 .5rem;font:400 30px/.95 var(--serif);text-transform:uppercase}h3{margin:1rem 0 .4rem;font:var(--label-weight) 11px/1.3 var(--sans);letter-spacing:var(--kicker-track);text-transform:uppercase;color:var(--muted)}p{margin:.5rem 0}button,select,input::file-selector-button{font:var(--label-weight) 14px/1.2 var(--sans);letter-spacing:var(--label-track);text-transform:none}select{font-size:13px}.kicker,h2.kicker,h3.kicker{margin:0;font:var(--label-weight) 11px/1.3 var(--sans);letter-spacing:var(--kicker-track);text-transform:uppercase;color:var(--muted)}.kicker+h2{margin-top:.3rem}.small-note,.muted{color:var(--muted)}.small-note{margin:.4rem 0 0;font-size:.85rem}.row{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem .75rem;margin:.65rem 0}.row>span:first-child{font:var(--label-weight) 13px var(--sans);letter-spacing:var(--label-track);min-width:3.4rem}output{display:inline-block;min-width:4rem;text-align:center;font:400 20px/1 var(--serif);font-variant-numeric:tabular-nums;padding:.25rem .5rem}[data-testid=transport-state],[data-testid=transport-position]{font-variant-numeric:tabular-nums}.facts{display:flex;flex-wrap:wrap;gap:.6rem 1.75rem;margin:0}.facts dt{font:var(--label-weight) 13px var(--sans);letter-spacing:var(--label-track);color:var(--muted)}.facts dd{margin:0;font:400 24px/1.1 var(--serif)}.facts dd.unsure{font:400 13px var(--sans)}.analysis-warnings{margin:0 0 .75rem}.analysis-warnings-title{margin:0 0 .25rem;font-weight:600}.analysis-warnings ul{margin:0;padding-left:1.2rem}.notice{border-left:3px solid var(--warning);background:#ffb54714;padding:.45rem .8rem}.error{color:var(--error);font-weight:600}.badge{display:inline-block;padding:.2rem .6rem;border:1px solid var(--rule-strong);border-radius:999px;font:var(--label-weight) 12px var(--sans);letter-spacing:var(--label-track)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app{position:relative;z-index:1;min-height:100vh;overflow-x:clip;padding:20px var(--m) 3rem;background:var(--bg)}.app-header,.app-main{position:relative;z-index:1;max-width:120rem;margin:0 auto}.app-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px 20px;margin-bottom:18px}.brand-block{display:flex;align-items:center;gap:14px;min-width:0}h1.brand{margin:0;font:400 42px/.8 var(--script);white-space:nowrap;color:var(--paper-white)}.tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}.app[data-screen=mode] .tabs{padding:4px;border-radius:999px;background:color-mix(in srgb,var(--bg) 80%,transparent);border:1px solid var(--rule)}.app[data-screen=mode] .tabs [role=tab]{border-color:transparent}.app[data-screen=mode] .tabs [role=tab][aria-selected=true]{background:var(--a);color:var(--on-a)}.header-end{justify-self:end;display:flex;align-items:center;gap:10px}.login-box{font-size:.9rem}@media(max-width:899px){.app-header{grid-template-columns:minmax(0,1fr) auto}.tabs{grid-column:1 / -1;grid-row:2;justify-content:flex-start}}.stage{--dock-space: 10rem;display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}.stage-song{padding-bottom:var(--dock-space)}.song-controls{display:contents}.card{position:relative;z-index:2;min-width:0}.stage-main{min-width:0}@media(max-width:759px){.stage{--dock-space: 11.5rem}}@media(min-width:760px){.stage{grid-template-columns:minmax(16rem,20rem) minmax(0,1fr);column-gap:24px;grid-template-areas:"title title" "side right" "sheet sheet"}.stage:not(.stage-song){grid-template-areas:"title title" "side main"}.mode-title{grid-area:title}.side-card{grid-area:side}.stage-song .practice-card{grid-area:right}.stage-song .sheet-strip{grid-area:sheet}.stage-main{grid-area:main}}@media(min-width:1100px){.stage{grid-template-columns:20rem minmax(0,1fr) 23.5rem;grid-template-areas:"side title right" "sheet sheet sheet"}.stage:not(.stage-song){grid-template-columns:20rem minmax(0,1fr);grid-template-areas:"side title" "side main";grid-template-rows:auto 1fr}.stage-song .mode-title{align-self:center;padding:0 8px}}.side-column{grid-area:side}.stage-song .right-column{grid-area:right}.side-column,.right-column{display:flex;flex-direction:column;gap:10px}.card,[data-testid=create-panel],.command-lab>section,.camera-preview-waiting{margin:0;padding:20px 22px 22px;background:color-mix(in srgb,var(--bg) 88%,transparent);border:1px solid var(--rule);border-radius:2px}.practice-steps{list-style:none;counter-reset:step;margin:0 0 .75rem;padding:0}.practice-steps li{counter-increment:step;display:flex;gap:.7rem;align-items:flex-start;margin:.45rem 0;line-height:1.3}.practice-steps li:before{content:counter(step);flex:none;display:grid;place-items:center;width:1.6rem;height:1.6rem;border:1px solid var(--rule-strong);border-radius:50%;font:400 15px/1 var(--serif)}.practice-steps li[aria-current=step]:before{background:var(--paper-white);color:var(--night)}.feedback-card{margin-top:.85rem;padding:.8rem 1rem;border:1px solid var(--rule);background:#f2eee60d}.feedback-card h3{margin:0 0 .4rem}.feedback-card h4{margin:.6rem 0 .2rem;font:var(--label-weight) 11px var(--sans);letter-spacing:var(--kicker-track);text-transform:uppercase;color:var(--muted)}.feedback-card ul{margin:0;padding-left:1.25rem}.feedback-coach{margin-top:.6rem}.feedback-coach p{margin:.2rem 0}.history ul{margin:.4rem 0 0;padding-left:1.25rem}.song-loader .row{margin:.8rem 0 .4rem}.upload-button{display:inline-block;font:var(--label-weight) 14px/1.2 var(--sans);letter-spacing:var(--label-track);text-transform:none;color:var(--paper-white);background:transparent;border:1.5px solid var(--a);border-radius:999px;padding:10px 16px;cursor:pointer;white-space:nowrap}.upload-button:hover{background:var(--a);color:var(--on-a)}.upload-button:has(input:focus-visible){outline:2px solid var(--paper-white);outline-offset:3px}.upload-button:has(input:disabled){cursor:not-allowed;opacity:.5}.visually-hidden-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none}.side-card .analysis-warnings{margin:.6rem 0 0;font-size:.88rem}.devices-section{margin-top:.6rem}.stage-song .devices-heading{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.devices{list-style:none;margin:.3rem 0 0;padding:0}.device{margin:.25rem 0}.device-toggle{display:flex;align-items:center;gap:.75rem;width:100%;padding:.3rem .4rem .3rem .1rem;font:var(--label-weight) .95rem/1.2 var(--sans);letter-spacing:var(--label-track);text-transform:none;color:var(--paper-white);text-align:left;background:transparent;border:0;border-radius:14px;box-shadow:none}.device-toggle:before{content:"◉";flex:none;display:grid;place-items:center;width:2.25rem;height:2.25rem;border:1.5px solid var(--a);border-radius:50%;background:transparent;font-size:1rem;transition:background-color .12s}.device-toggle[data-device=audio-live]:before{content:"♪"}.device-toggle[data-device=touchdesigner]:before{content:"✦"}.device-toggle[aria-pressed=true],.device-toggle[aria-pressed=true]:hover:not(:disabled){background:transparent;color:var(--paper-white)}.device-toggle[aria-pressed=true]:before{background:var(--a);color:var(--on-a)}.device-toggle:hover:not(:disabled){background:#f2eee612;color:var(--paper-white);box-shadow:none}.device-toggle:active:not(:disabled){transform:none;box-shadow:none}.device-state{margin-left:auto;font:var(--label-weight) 12px var(--sans);letter-spacing:var(--label-track);color:var(--muted)}.device-toggle[aria-pressed=true] .device-state{color:var(--paper-white)}.device-note{display:block;margin:-.1rem 0 .2rem 3.1rem;font-size:.8rem;line-height:1.3;color:var(--muted);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.device-note[data-state=error]{color:var(--error);font-weight:600;white-space:normal}.devices-section details{font-size:.85rem}.side-card .camera-preview{margin:.75rem 0 0;padding:0;background:none;border:0;box-shadow:none}.side-card .camera-preview-waiting{margin:.6rem 0 0;padding:0;border:0;box-shadow:none;font-size:.85rem}.camera-preview figcaption{font:var(--label-weight) 12px var(--sans);letter-spacing:var(--label-track);text-transform:none}.sheet-strip{position:relative;isolation:isolate;margin:4px 0;padding:22px 0 26px;color:var(--sheet-ink);--a-text: var(--sheet-ink)}.sheet-strip:before{content:"";position:absolute;top:0;bottom:0;left:-100vw;right:-100vw;background:var(--sheet-paper);z-index:-1}.sheet-strip-inner{max-width:72rem;margin-inline:auto}.sheet-strip .kicker{color:#0b0a0c99;margin-bottom:.3rem}.sheet-strip .muted,.sheet-strip .small-note{color:#0b0a0ca8}.sheet-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.25rem;margin-bottom:.25rem;font-size:.88rem}.sheet-strip select,.sheet-strip button{color:var(--sheet-ink);background:transparent;border-color:#0b0a0c8c}.sheet-strip select{font-size:.85rem;padding:.25rem .5rem .25rem .75rem;min-height:32px}.sheet-strip option{color:var(--sheet-ink);background:var(--sheet-paper)}.sheet-strip button:hover:not(:disabled),.sheet-strip button[aria-pressed=true]{background:var(--sheet-ink);color:var(--sheet-paper)}.sheet-strip :focus-visible{outline-color:var(--sheet-ink)}.sheet-strip input[type=checkbox]{accent-color:var(--sheet-ink)}.sheet-status{margin:.2rem 0;font-size:.8rem}.sheet-host{position:relative;max-height:32rem;overflow:auto;background:transparent}.sheet-host[hidden]{display:none}.player-bar{position:fixed;z-index:10;left:50%;bottom:16px;width:min(62rem,calc(100vw - 2rem));transform:translate(-50%);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.6rem 1.4rem;padding:12px 20px 12px 14px;background:color-mix(in srgb,var(--bg) 94%,transparent);border:1px solid var(--rule);border-radius:999px}.play-button,.play-button:hover:not(:disabled){width:3.9rem;height:3.9rem;padding:0;border-radius:50%;display:grid;place-items:center}.play-button:after{content:"";margin-left:.3rem;border-left:1.1rem solid currentColor;border-top:.7rem solid transparent;border-bottom:.7rem solid transparent}.player-info{min-width:0}.song-title{margin:0;font:400 28px/1 var(--serif);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.song-meta{margin:.3rem 0 0;font:var(--label-weight) 13px/1.4 var(--sans);letter-spacing:var(--label-track);color:var(--muted)}.song-meta .fact+.fact:before{content:" · "}.song-meta .unsure{margin-left:.4em;text-transform:none;font-style:italic;letter-spacing:0}.progress{margin-top:.5rem;height:3px;background:var(--rule);overflow:hidden}.progress>span{display:block;height:100%;width:0;background:var(--paper-white)}.player-status{margin:.3rem 0 0;font-size:.8rem;color:var(--muted)}.player-controls{display:flex;flex-direction:column;align-items:flex-end;gap:.4rem}.player-row{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.45rem}.player-label,.player-label>span{font:var(--label-weight) 13px var(--sans);letter-spacing:var(--label-track);color:var(--muted)}.player-label.volume{display:inline-flex;align-items:center;gap:.4rem}.player-label.volume input{width:6.5rem;margin:0}@media(min-width:1100px){.stage-song .player-bar{--bar-inset: max(var(--m), (100vw - 120rem) / 2);left:var(--bar-inset);right:calc(var(--bar-inset) + 23.5rem + 24px);width:auto;max-width:62rem;margin-inline:auto;transform:none}}.seg{display:inline-flex;align-items:stretch;border:1.5px solid var(--a);border-radius:999px;overflow:hidden}.seg>button,.seg>button:hover:not(:disabled),.seg>button:active:not(:disabled){border:0;border-radius:0;min-height:0;padding:.25rem .75rem;font-size:15px;letter-spacing:0}.seg>button{background:transparent;color:var(--paper-white)}.seg>button:hover:not(:disabled){background:var(--a);color:var(--on-a)}.seg>button:focus-visible{outline-offset:-3px}.seg>output{min-width:3.2rem;padding:.3rem .4rem .2rem;font-size:18px;border-inline:1px solid var(--rule)}@media(max-width:759px){.player-bar{bottom:.5rem;width:calc(100vw - 1rem);grid-template-columns:auto minmax(0,1fr);gap:.25rem .75rem;padding:.3rem .7rem .35rem;border-radius:22px;transform:translate(-50%)}.play-button,.play-button:hover:not(:disabled){width:2.75rem;height:2.75rem}.play-button:after{margin-left:.25rem;border-left-width:.95rem;border-top-width:.6rem;border-bottom-width:.6rem}.player-info{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:.5rem;align-items:center}.player-info .song-facts{display:contents}.player-info .song-title{grid-column:1 / -1;font-size:1rem}.player-info .song-meta{grid-column:1;grid-row:2;margin:0;font-size:12px;letter-spacing:var(--label-track);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-testid=analysis-summary] .song-meta{display:flex}[data-testid=analysis-summary] .song-meta>.fact{min-width:0;overflow:hidden;text-overflow:ellipsis}[data-testid=analysis-summary] .song-meta>.fact:nth-child(2){flex-shrink:20}[data-testid=analysis-summary] .song-meta>.fact:nth-child(3){flex-shrink:400}[data-testid=analysis-summary] .song-meta>.fact:last-child{order:-1;flex-shrink:0}[data-testid=analysis-summary] .song-meta>.fact:last-child:before{content:none}[data-testid=analysis-summary] .song-meta>.fact:last-child:after{content:" · "}.player-info .progress{grid-column:1 / -1;grid-row:3;margin-top:.15rem;height:2px}.player-status{grid-column:2;grid-row:2;max-width:8.5rem;margin:0;font-size:.68rem;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-status[data-state=error]{grid-column:1 / -1;grid-row:4;max-width:none;white-space:normal}.player-controls{grid-column:1 / -1;align-items:stretch;gap:.25rem}.player-row{flex-wrap:wrap;justify-content:flex-start;gap:.3rem .4rem}.player-controls .player-row>button{height:2.5rem;padding:0 .8rem;font-size:.85rem}.player-label,.player-label>span{font-size:12px;letter-spacing:var(--label-track)}.player-label.volume{flex:1 1 7rem;min-width:0}.player-label.volume input{flex:1 1 auto;width:auto;min-width:4rem;height:2.5rem}#pitch-label{margin-left:auto}.player-bar .seg>button,.player-bar .seg>button:hover:not(:disabled),.player-bar .seg>button:active:not(:disabled){width:2.5rem;height:2.5rem;padding:0}.player-bar .seg>output{display:grid;place-items:center;min-width:2.6rem;padding:0 .3rem}}@media(max-width:379px){.player-controls .player-row>button{padding:0 .6rem}.player-label.volume input{min-width:3rem}.player-row:last-child{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;grid-auto-flow:column;justify-content:space-between;gap:.1rem .4rem}#pitch-label{margin-left:0}}.hand-meter{margin:.7rem 0}.hand-meter-name{display:flex;justify-content:space-between;gap:.5rem;font-size:.9rem;font-weight:var(--label-weight)}.hand-meter-value{font:400 18px var(--serif);color:var(--muted)}.bar{margin-top:.3rem;height:4px;border:0;border-radius:0;background:var(--rule);overflow:hidden}.bar>span{display:block;height:100%;background:var(--paper-white)}.hands-card h3.kicker{margin-top:1rem}.fired-list{list-style:none;margin:.4rem 0 0;padding:0}.fired-list li{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.4rem 0;border-top:1px solid var(--rule);font-size:.9rem;font-weight:var(--label-weight)}.fired-list em{flex:none;font:var(--label-weight) 12px var(--sans);font-style:normal;letter-spacing:var(--label-track);background:transparent;border:1px solid var(--rule-strong);border-radius:99px;padding:.15rem .6rem}.practice-card [data-testid=history-runs]{max-height:7.5rem;overflow:auto;font-size:.85rem}[data-testid=create-panel] [role=group]{display:flex;flex-wrap:wrap;gap:.6rem;margin:.6rem 0}[data-testid=create-panel]>h2:first-child{font-size:40px}.command-lab{max-width:none;margin:0;padding:0;display:grid;gap:1.25rem}.command-lab>section{margin:0;min-width:0}.command-lab>h1{margin:0;font:var(--label-weight) 11px/1.3 var(--sans);letter-spacing:var(--kicker-track);text-transform:uppercase;color:var(--muted)}.command-lab>p{margin:-.5rem 0 0;max-width:46rem}.command-lab code{font:600 .85em ui-monospace,Cascadia Mono,Consolas,monospace;background:#f2eee614;border:1px solid var(--rule);border-radius:3px;padding:0 .3em}.lab-list>li{border:1px solid var(--rule);border-radius:2px;padding:.55rem .8rem;background:#f2eee608}.lab-hint{color:var(--muted)}.lab-reading meter{width:12rem;max-width:100%}.lab-camera{max-width:640px;overflow:hidden;background:var(--night);border:1px solid var(--rule)}.lab-lamp{border:1px solid var(--rule-strong);background:transparent}.lab-lamp[data-on=true]{background:var(--paper-white);box-shadow:none}[data-testid^=control-][data-flash=true]{background:#f2eee624}[data-testid^=rule-][data-fired=true]{background:#f2eee61f;border-color:var(--paper-white)}[data-testid=lab-issues] li[data-level=error]{border-color:var(--error)}[data-testid=lab-issues] li[data-level=warning]{border-color:var(--warning)}@media(prefers-reduced-motion:reduce){button,select,input::file-selector-button{transition:none}}.app{padding-top:1.1rem}.app-header{margin-bottom:1rem}.card{padding:.85rem 1.2rem .95rem}.card h2:not(.kicker){font-size:1.4rem;margin-bottom:.35rem}.song-loader .row{margin:.5rem 0 .2rem;gap:.5rem}.device{margin:.1rem 0}.device-toggle{padding:.15rem .4rem .15rem .1rem}.device-toggle:before{width:1.9rem;height:1.9rem;font-size:.9rem}.device-note{margin-left:2.75rem}.small-note{margin-top:.25rem;font-size:.8rem}.practice-steps{margin-bottom:.4rem}.practice-steps li{margin:.25rem 0;font-size:.92rem}.practice-steps li:before{width:1.4rem;height:1.4rem}.practice-card .row{gap:.45rem;margin:.4rem 0}.practice-card .row button{font-size:.85rem;padding:.35rem .7rem}.practice-card [data-testid=practice-status]{margin:.25rem 0;font-size:.9rem}.practice-card .history{margin-top:.5rem}.practice-card [data-testid=history-message]{margin:.2rem 0;font-size:.88rem}.hand-meter{margin:.45rem 0}.sheet-status{margin:0}.sheet-host{margin-top:-1.25rem}@media(min-width:760px){.sheet-strip-inner{position:relative}.sheet-strip-inner>h2{position:absolute;left:0;top:.55rem;margin:0}.sheet-toolbar{padding-left:7.25rem;margin-bottom:0}.sheet-status{padding-left:7.25rem}.player-bar{bottom:.9rem;padding:.5rem 1.4rem .5rem .55rem;gap:.4rem 1.2rem}.play-button,.play-button:hover:not(:disabled){width:3.6rem;height:3.6rem}.song-title{font-size:24px}.progress{margin-top:.4rem}.player-controls{gap:.35rem}.player-controls button{padding-top:.32rem;padding-bottom:.32rem}}.pill,.tabs [role=tab]{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;font:var(--label-weight) 13px / 1.2 var(--sans);letter-spacing:var(--label-track);text-transform:none;color:var(--paper-white);background:transparent;border:1.5px solid var(--paper-white);border-radius:999px;box-shadow:none;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}.pill:hover:not(:disabled),.tabs [role=tab]:hover:not(:disabled){background:var(--paper-white);color:var(--night)}.guide-layer{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}.app[data-screen=entrance] .app-header,.app[data-screen=entrance] .app-main,.app[data-screen=menu] .app-main{visibility:hidden}.app[data-screen=entrance] .brand-block,.app[data-screen=menu] .brand-block{position:fixed;z-index:35;top:var(--m);left:var(--m);visibility:visible;pointer-events:auto}.app[data-screen=entrance] .records-button,.app[data-screen=menu] .records-button{display:none}.app[data-screen=menu] .tabs{position:fixed;z-index:25;right:var(--m);bottom:var(--m);justify-content:flex-end;max-width:min(460px,calc(100vw - 2 * var(--m)))}.app[data-screen=menu] .tabs [role=tab]{border-color:transparent;background:#f2eee61f;font-size:13px;letter-spacing:var(--label-track);padding:7px 13px}.app[data-screen=menu] .tabs [role=tab][aria-selected=true]{background:var(--a);color:var(--night)}.app[data-screen=menu] .header-end{position:fixed;z-index:25;right:var(--m);top:var(--m)}.app[data-screen=menu] .app-header{z-index:25;pointer-events:none}.app[data-screen=menu] .tabs,.app[data-screen=menu] .brand-block,.app[data-screen=menu] .header-end{pointer-events:auto}.sound-toggle,.sound-toggle[aria-pressed]{border-color:var(--rule-strong);background:transparent;color:var(--paper-white);padding:6px 12px;font-size:13px}.sound-toggle:hover:not(:disabled){background:var(--paper-white);color:var(--night)}.sound-icon{position:relative;width:10px;height:10px;border:1.5px solid currentColor;border-left:0;border-bottom:0;border-radius:0 100% 0 0;transform:rotate(45deg) scale(.8)}.sound-icon[data-on=false]{opacity:.5}.guide-pill{display:inline-flex;align-items:center;gap:8px;margin:14px 0 0;padding:6px 14px;border:1.5px solid var(--a);border-radius:999px;font:var(--label-weight) 12px / 1.2 var(--sans);letter-spacing:var(--label-track);text-transform:none;background:var(--panel-soft);white-space:nowrap}.guide-pill i{width:7px;height:7px;border-radius:50%;background:var(--a);animation:guide-blink 1.2s infinite}.guide-pill[data-lost=true]{border-color:var(--cream);opacity:.75}.guide-pill[data-lost=true] i{background:var(--cream);animation:none}@keyframes guide-blink{50%{opacity:.25}}.mode-title{position:relative;isolation:isolate;min-width:0;pointer-events:none}.mode-title .guide-pill{pointer-events:auto}.mode-word{position:relative;margin:0;font:400 clamp(72px,10.5vw,176px) / .84 var(--serif);letter-spacing:-.015em;text-transform:uppercase;color:var(--paper-white);white-space:nowrap}.mode-word-clip{display:inline-block;overflow:hidden;padding-top:.06em;vertical-align:top}.mode-word-line{display:inline-block;animation:line-rise .7s cubic-bezier(.16,1,.3,1) both}.mode-word-slip{position:absolute;left:0;top:0;padding-top:.06em;color:var(--b);z-index:-1;opacity:0;animation:type-slip .3s ease-out both}@keyframes type-slip{0%{opacity:.9;transform:translate3d(4px,-3px,0)}to{opacity:0;transform:translateZ(0)}}.mode-word{--gap: .165em}.mode-staff{position:absolute;left:-.12em;right:-.12em;bottom:.1em;height:calc(var(--gap) * 4 + 1px);background:repeating-linear-gradient(to bottom,var(--a) 0 1px,transparent 1px var(--gap));opacity:.55;z-index:-1}.mode-note{display:inline-block;margin-left:.24em;font-size:.34em;line-height:1;transform:translate3d(0,calc(var(--step) * var(--gap) / -.68),0)}.mode-note-in{display:inline-block;animation:line-rise .7s cubic-bezier(.16,1,.3,1) calc(.12s + var(--i) * 90ms) both}.mode-sub{margin:10px 0 0;max-width:26ch;font:var(--label-weight) clamp(15px,1.4vw,18px) / 1.3 var(--sans);letter-spacing:var(--label-track);color:var(--paper-white)}.bloom.mode-flower{position:absolute;width:clamp(110px,12vw,190px);aspect-ratio:1;right:4%;top:-14%;z-index:-1;opacity:.85}@media(max-width:759px){.mode-word{font-size:clamp(56px,18vw,96px)}.bloom.mode-flower{width:96px;right:0;top:-8px}}@media(prefers-reduced-motion:reduce){.mode-word-line,.mode-word-slip,.mode-note-in{animation:none}.mode-word-slip{display:none}}.brand-home,.brand-home:hover:not(:disabled),.brand-home:active:not(:disabled){min-height:0;padding:0;border:0;border-radius:0;background:none;color:inherit;font:inherit;letter-spacing:0;text-transform:none;box-shadow:none;cursor:pointer}.brand-home:focus-visible,.records-button:focus-visible{outline:2px solid var(--paper-white);outline-offset:4px;border-radius:6px}.records-button-wrap{display:inline-flex}.records-button{display:inline-grid;place-items:center;width:30px;height:30px;padding:0;border:1.5px solid var(--rule-strong);border-radius:50%;background:transparent;color:var(--muted);cursor:pointer;transition:background-color .3s,border-color .3s,color .3s}.records-button:focus-visible{border-radius:50%}.records-button:hover{border-color:var(--a);color:var(--a)}.records-button-icon{width:15px;height:15px;fill:currentColor}.overlay-pill{border-color:var(--rule-strong);padding:6px 12px;font-size:13px}.overlay-pill[aria-pressed=true]{border-color:var(--a);background:var(--a);color:var(--on-a, var(--night))}.app[data-screen=mode] .app-header{z-index:21}.guide-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;justify-content:flex-end;align-items:flex-end;padding:120px var(--m) calc(var(--m) * 2);background:linear-gradient(90deg,#0b0a0c66,#0b0a0c8c 20%,#0b0a0cf0 27%,#0b0a0cf2);color:var(--paper-white);pointer-events:none;animation:guide-in .5s ease-out both}.guide-overlay-inner{width:min(62rem,100%);max-height:100%;overflow:hidden}.guide-overlay-kicker,.guide-overlay-close{margin:0;font:var(--label-weight) 11px/1.4 var(--sans);letter-spacing:var(--kicker-track);text-transform:uppercase;color:var(--a)}.guide-overlay-close{font-size:13px;letter-spacing:var(--label-track);text-transform:none}.guide-overlay-title{margin:.1em 0 .35em;font:400 clamp(64px,9vw,148px) / .9 var(--serif);letter-spacing:-.02em}.guide-overlay-lines{margin:0 0 2rem;padding:0;list-style:none}.guide-overlay-lines li{display:grid;gap:4px;padding:.7rem 0;border-top:1px solid var(--rule)}.guide-big{font:400 clamp(26px,2.9vw,44px) / 1.05 var(--serif)}.guide-small{font:400 14px/1.4 var(--sans);color:var(--muted)}@keyframes guide-in{0%{opacity:0;transform:translate3d(0,12px,0)}}.hands-overlay{position:fixed;z-index:19;top:92px;right:var(--m);width:min(23.5rem,calc(100vw - 2 * var(--m)));max-height:calc(100vh - 92px - var(--m));overflow:auto;animation:guide-in .4s ease-out both}.hands-overlay .hands-card{margin:0;background:var(--bg);border-color:var(--a)}.app[data-mode=lab] :is(.guide-overlay-kicker,.guide-overlay-close,.records-button:hover){color:var(--a-text)}@media(prefers-reduced-motion:reduce){.guide-overlay,.hands-overlay{animation:none}}.app[data-screen=mode]{--wire: color-mix(in srgb, var(--a) 70%, var(--paper-white));--wire-fill: color-mix(in srgb, var(--bg) 78%, transparent);--halo: 0 0 2px rgba(5, 5, 6, .9), 0 1px 3px rgba(5, 5, 6, .75), 0 0 14px rgba(5, 5, 6, .55)}.app[data-screen=mode] .card,.app[data-screen=mode] [data-testid=create-panel],.app[data-screen=mode] .command-lab>section,.app[data-screen=mode] .camera-preview-waiting,.app[data-screen=mode] .feedback-card{background:var(--wire-fill);border:1px solid var(--wire);border-radius:0;box-shadow:none}.app[data-screen=mode] .player-bar{background:color-mix(in srgb,var(--bg) 78%,transparent);border-color:var(--wire);box-shadow:none}.app[data-screen=mode] .app-main,.app[data-screen=mode] .player-bar,.app[data-screen=mode] .mode-title{text-shadow:var(--halo)}.app[data-screen=mode] :is(button,select,input,textarea,option),.app[data-screen=mode] .sheet-strip{text-shadow:none}.app[data-screen=mode] .lab-camera{background:transparent;border-color:var(--wire)}.mode-visual{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.mode-readout{position:fixed;z-index:3;top:var(--top, 92px);right:var(--gut, 28px);display:grid;gap:8px;justify-items:end;text-align:right;pointer-events:none;text-shadow:var(--halo, none)}.mode-readout p{margin:0;font:var(--label-weight) 11px/1.2 var(--sans);letter-spacing:var(--label-track);color:var(--paper-white)}.mode-readout b{display:block;margin-top:2px;font:400 24px/1 var(--serif);letter-spacing:0}.mode-readout .hand-label{opacity:.85}.panel-toggles{position:fixed;z-index:20;left:var(--gut, 28px);bottom:20px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}.panel-toggle{padding:5px 12px;font-size:12px;background:color-mix(in srgb,var(--bg) 40%,transparent)}.panel-toggle[aria-pressed=true]{background:var(--paper-white);color:var(--night)}.stage-learn .panel-toggles{--learn-tools-w: 215px;right:calc(var(--gut, 28px) + var(--learn-tools-w));bottom:10px;flex-direction:row;flex-wrap:wrap;align-items:center}.stage-learn .panel-toggles [data-testid=toggle-practice]{margin-left:auto}.float-panel,.panel-slot>.player-bar{transition:opacity .18s ease-out,translate .18s ease-out,visibility 0s}.float-panel[data-open=false],.panel-slot[data-open=false]>.player-bar{opacity:0;translate:0 8px;visibility:hidden;pointer-events:none;transition:opacity .18s ease-in,translate .18s ease-in,visibility 0s .18s}.panel-slot{display:contents}.create-slot[data-layers=false] [data-testid=create-panel]>:not([data-testid=saved-tracks-section]),.create-slot[data-tracks=false] [data-testid=saved-tracks-section]{display:none}@media(max-width:700px){.float-panel[data-open=false],.panel-slot[data-open=false]>.player-bar{display:none}}@media(prefers-reduced-motion:reduce){.float-panel,.panel-slot>.player-bar{transition:none}}@media(min-width:701px){html,body{overflow:hidden}.app{--gut: 28px;--top: 88px;--toggles-w: 8.5rem;--player-h: 102px;--sheet-h: clamp(150px, 26vh, 260px);--row-h: 50px;--low: calc(var(--player-h) + var(--sheet-h) + 14px + var(--row-h));height:100dvh;min-height:0;overflow:hidden;display:flex;flex-direction:column;padding-bottom:0}.app-header{width:100%}.app-main{flex:1;min-height:0;width:100%}.app .stage:not(.stage-lab){display:block;padding-bottom:0}.stage:not(.stage-lab) .mode-title{max-width:calc(100vw - 2 * var(--gut) - 12rem)}.stage:not(.stage-lab) :is(.side-card,.practice-card,.create-slot){position:fixed;z-index:12;top:var(--top);overflow:auto;overscroll-behavior:contain}.stage:not(.stage-lab) .side-card{left:var(--gut);width:20rem;max-height:calc(100dvh - var(--top) - var(--low))}.stage-create .side-card{max-height:calc(100dvh - var(--top) - 9rem)}.stage-song .practice-card{right:var(--gut);width:23.5rem;max-height:calc(100dvh - var(--top) - var(--low))}.stage-create .create-slot{right:var(--gut);width:min(46rem,calc(100vw - 20rem - 3 * var(--gut)));max-height:calc(100dvh - var(--top) - 20px)}.stage-create .create-slot [data-testid=create-panel]{padding:14px 18px}.stage-song .sheet-strip{position:fixed;z-index:11;left:calc(var(--gut) + var(--toggles-w));right:var(--gut);bottom:calc(var(--player-h) + 6px + var(--row-h));height:var(--sheet-h);margin:0;padding:10px 18px 0;overflow:hidden}.stage-song .sheet-strip-inner,.stage-song .sheet{height:100%;display:flex;flex-direction:column;min-height:0}.stage-song .sheet-host{flex:1;min-height:0;overflow:hidden}.stage-song .player-bar{left:calc(var(--gut) + var(--toggles-w));right:var(--gut);bottom:calc(12px + var(--row-h));width:auto;max-width:62rem;margin:0 auto;transform:none}.stage-lab{height:100%;grid-template-rows:auto minmax(0,1fr);padding-bottom:12px}.stage-lab :is(.side-card,.stage-main){min-height:0;max-height:100%;overflow:auto;overscroll-behavior:contain}}@media(min-width:1100px){.stage-lab .side-card{grid-row:1 / 3}}@media(min-width:701px){.stage-learn .side-column,.stage-learn .right-column{position:fixed;z-index:12;top:var(--top);max-height:calc(100dvh - var(--top) - var(--low));display:flex;flex-direction:column;gap:10px;overflow:auto;overscroll-behavior:contain}.stage-learn .side-column{left:var(--gut);width:20rem}.stage-learn .right-column{right:var(--gut);width:23.5rem}.stage-learn .side-column>.side-card,.stage-learn .right-column>.practice-card,.stage-learn .right-column>.feedback-card-panel{position:static;width:auto;max-height:none;flex:0 0 auto}.stage-learn :is(.side-column,.right-column)>.float-panel[data-open=false]{display:none}}.entrance{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;overflow:hidden;color:var(--paper-white);background:radial-gradient(120% 90% at 70% 50%,rgba(255,45,138,.07),transparent 60%),var(--night)}.entrance-gate{position:absolute;left:6vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:calc(100% - 32px);z-index:2}.entrance-logo{margin:18px 0 0;font:400 clamp(76px,11vw,168px) / .8 var(--script);color:var(--paper-white);letter-spacing:0}.entrance-quiet{font:var(--label-weight) 12px / 1.4 var(--sans);letter-spacing:var(--label-track);color:var(--muted);background:none;border:0;padding:6px 2px;text-decoration:underline;text-underline-offset:3px;box-shadow:none}.entrance-quiet:hover{color:var(--paper-white)}.entrance-plate{position:absolute;right:var(--m);top:var(--m);margin:0;text-align:right;font:var(--label-weight) 11px / 1.6 var(--sans);letter-spacing:var(--label-track);color:var(--paper-white);z-index:2}.entrance-plate i{display:block;font:italic 400 22px / 1 var(--serif);letter-spacing:0;text-transform:none}.spray{--u: 13.2vh;position:absolute;left:64.6vw;top:53.2vh;width:0;height:0}.spray-sway{position:absolute;top:0;right:0;bottom:0;left:0;animation:spray-sway 11s ease-in-out infinite alternate}@keyframes spray-sway{0%{transform:rotate(-1.1deg)}to{transform:rotate(1.1deg)}}.spray-flower{position:absolute;left:calc(var(--x) * var(--u) - var(--r) * var(--u));top:calc(var(--y) * var(--u) * -1 - var(--r) * var(--u));width:calc(var(--r) * var(--u) * 2);height:calc(var(--r) * var(--u) * 2)}.spray-flower .bloom{position:absolute;top:0;right:0;bottom:0;left:0}.entrance .spray-flower .bloom .bloom-state{opacity:0}.entrance .spray-flower .bloom .bloom-open{opacity:1}.bloom-heart{position:absolute;left:43%;top:43%;width:14%;height:14%;border-radius:50%;view-transition-name:journey}:root[data-vt=enter] .bloom-heart{background:var(--a)}.bloom-state{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;-webkit-user-select:none;user-select:none;pointer-events:none;transition:opacity .7s cubic-bezier(.3,.7,.2,1) calc(var(--i, 0) * 45ms)}.bloom[data-stage="0"] .bloom-closed,.bloom[data-stage="1"] .bloom-half,.bloom[data-stage="2"] .bloom-open{opacity:1}.section-bloom img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.section-bloom .bloom-fill{opacity:.6}.bloom.beat .bloom-state{transition:none}.bloom.beat .bloom-open{animation:beat-open .72s linear both}.bloom.beat .bloom-half{animation:beat-half .72s linear both}.bloom.beat .bloom-closed{animation:beat-closed .72s linear both}@keyframes beat-open{0%{opacity:0}16%{opacity:1;animation-timing-function:cubic-bezier(.3,.7,.3,1)}60%{opacity:0}to{opacity:0}}@keyframes beat-half{0%,16%{opacity:0}50%{opacity:1}to{opacity:0}}@keyframes beat-closed{0%{opacity:1}10%{opacity:0}55%{opacity:0}to{opacity:1}}@media(max-width:700px){.spray{--u: 9.8vh;left:62vw;top:34vh}.entrance-gate{top:auto;bottom:64px;transform:none;left:16px}.entrance-logo{font-size:clamp(64px,22vw,110px)}}@media(prefers-reduced-motion:reduce){.spray-sway{animation:none}.bloom-state{transition:none}.bloom.beat .bloom-state{animation:none}}.menu{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;overflow:hidden;color:var(--paper-white);touch-action:pan-y}.records{position:absolute;top:0;right:0;bottom:0;left:0;perspective:1400px;z-index:1;pointer-events:none}.record{position:absolute;left:0;top:0;padding:0;border:0;border-radius:50%;background:none;box-shadow:none;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.65,0,.35,1),opacity .6s ease-in-out;pointer-events:auto;cursor:pointer}.record:hover:not(:disabled),.record:active:not(:disabled){background:none;box-shadow:none}.record:focus-visible{outline:2px solid var(--paper-white);outline-offset:10px}.record-art,.record-spin,.record-layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.record-art{opacity:0;transition:opacity .5s ease-out}.record-art[data-ready=true]{opacity:1}.record-layer{display:block;transition:opacity .6s ease-in-out}.record-gray,.record[data-chosen=true] .record-color{opacity:1}.record-color,.record[data-chosen=true] .record-gray{opacity:0}.record-spin{animation:record-turn 50s linear infinite;will-change:transform}@keyframes record-turn{to{transform:rotate(360deg)}}.record-hole{position:absolute;left:43.6%;top:43.6%;width:12.8%;height:12.8%;border-radius:50%}.record[data-chosen=true] .record-hole{view-transition-name:journey}:root[data-vt=portal] .record[data-chosen=true] .record-art{view-transition-name:portal-record}:root[data-vt=portal] .record[data-chosen=true] .record-hole{view-transition-name:none}.record-shadow{position:absolute;top:6%;right:4%;bottom:-10%;left:4%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.62),rgba(0,0,0,.25) 60%,transparent);transform:translate3d(0,9%,-1px);opacity:0;transition:opacity .6s}.record[data-chosen=true] .record-shadow{opacity:1}.record[data-grabbed=true] .record-art{animation:record-grab .26s ease-out}@keyframes record-grab{50%{transform:scale(1.08)}}.big{position:absolute;left:0;right:0;top:0;text-align:center;font:400 120px / .84 var(--serif);letter-spacing:-.01em;text-transform:uppercase;white-space:nowrap;pointer-events:none;color:var(--paper-white)}.big-back{z-index:0}.big-front{z-index:2}.big-clip{display:inline-block;overflow:hidden;padding:.06em .04em .02em;vertical-align:top}.big-line{display:inline-block;animation:line-rise .7s cubic-bezier(.16,1,.3,1) var(--delay, 0ms) both}.big-line.leaving{animation:line-leave .4s cubic-bezier(.5,0,.75,0) var(--delay, 0ms) both}@keyframes line-rise{0%{transform:translate3d(0,105%,0)}}@keyframes line-leave{to{transform:translate3d(0,-105%,0)}}@media(prefers-reduced-motion:reduce){.big-line,.big-line.leaving{animation:none}}.menu-about{position:absolute;left:var(--m);top:calc(var(--m) + 54px);max-width:240px;z-index:3}.menu-about b{display:block;margin-bottom:6px;font:var(--label-weight) 10px / 1.3 var(--sans);letter-spacing:var(--kicker-track);text-transform:uppercase;opacity:.7}.menu-about p{margin:0;font:var(--label-weight) 15px / 1.25 var(--sans);letter-spacing:var(--label-track);animation:about-in .5s ease-out both}@keyframes about-in{0%{opacity:0;transform:translate3d(0,6px,0)}}.menu-rule{position:absolute;left:var(--m);right:var(--m);bottom:calc(var(--m) + 96px);height:1px;background:var(--paper-white);opacity:.18;z-index:3}.menu-tag{position:absolute;left:var(--m);bottom:var(--m);margin:0;font:var(--label-weight) 12px / 1.3 var(--sans);letter-spacing:var(--label-track);z-index:3}.menu-staff{position:absolute;right:var(--m);bottom:calc(var(--m) + 52px);width:150px;height:28px;overflow:visible;opacity:.45;z-index:3;stroke:var(--paper-white);stroke-width:.7;fill:var(--paper-white)}.menu-staff .hollow{fill:none}@media(max-width:640px){.menu-tag{display:none}.menu-rule{bottom:calc(var(--m) + 120px)}.menu-about{max-width:60vw}.menu-staff{bottom:calc(var(--m) + 96px)}}@media(prefers-reduced-motion:reduce){.record,.record-shadow,.record-layer{transition:none}.record-spin,.menu-about p{animation:none}}:root[data-vt=mode]::view-transition-old(root){animation:.22s ease-in both vt-fade-out}:root[data-vt=mode]::view-transition-new(root){animation:.32s ease-out .06s both vt-fade-in}:root[data-vt=enter]::view-transition-old(root){animation:.5s cubic-bezier(.6,0,.8,.4) both vt-lift-out}:root[data-vt=enter]::view-transition-new(root){animation:.6s cubic-bezier(.2,.8,.2,1) .1s both vt-fade-in}::view-transition-group(journey){animation-duration:.7s;animation-timing-function:cubic-bezier(.65,0,.35,1)}::view-transition-group(portal-record){animation:none;z-index:3}::view-transition-old(portal-record){animation:.75s cubic-bezier(.7,0,.84,0) both vt-rush}:root[data-vt=portal]::view-transition-old(root){animation:.75s ease-in both vt-dim}:root[data-vt=portal]::view-transition-new(root){animation:.75s cubic-bezier(.7,0,.84,0) both vt-hole}:root[data-vt=back]::view-transition-old(root){animation:.3s ease-in both vt-fade-out}:root[data-vt=back]::view-transition-new(root){animation:.45s cubic-bezier(.2,.8,.2,1) both vt-settle}@keyframes vt-fade-out{to{opacity:0}}@keyframes vt-fade-in{0%{opacity:0}}@keyframes vt-dim{to{opacity:.25}}@keyframes vt-lift-out{to{opacity:0;transform:scale(1.06)}}@keyframes vt-rush{to{transform:scale(var(--vt-scale, 20))}}@keyframes vt-hole{0%{clip-path:circle(var(--vt-hole, 20px) at var(--vt-x, 50%) var(--vt-y, 50%))}to{clip-path:circle(var(--vt-far, 150vmax) at var(--vt-x, 50%) var(--vt-y, 50%))}}@keyframes vt-settle{0%{opacity:0;transform:scale(1.08)}}.app[data-arrive$="-0"] .mode-panel>*{animation:arrive-a .7s cubic-bezier(.16,1,.3,1) both}.app[data-arrive$="-1"] .mode-panel>*{animation:arrive-b .7s cubic-bezier(.16,1,.3,1) both}.app[data-arrive^=portal] .mode-panel>*{animation-delay:.7s}@keyframes arrive-a{0%{opacity:0;transform:translate3d(0,28px,0)}}@keyframes arrive-b{0%{opacity:0;transform:translate3d(0,28px,0)}}::view-transition-old(journey){animation:.7s cubic-bezier(.7,0,.9,.5) both vt-fade-out}::view-transition-new(journey){animation:.3s ease-out .4s both vt-fade-in}@media(prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*),.app .mode-panel>*{animation:none!important}}
