:root,html[data-theme=stage]{--font-display: "Fraunces", "Iowan Old Style", Georgia, serif;--font-body: "Figtree", "Avenir Next", "Segoe UI", sans-serif;--bg: #d7e2d8;--bg-deep: #b7c9ba;--surface: #eef4ef;--ink: #1c2b24;--muted: #4d6358;--brand: #1f5c45;--accent: #d97706;--accent-ink: #1a1205;--danger: #b42318;--section-a: color-mix(in oklab, #cfe0d3 82%, white);--section-b: color-mix(in oklab, #d9d3c4 78%, white);--section-label: #2f5645;--beat-active: #f6c453;--beat-active-ink: #1c2b24;--beat-ring: #b45309;--glow-a: color-mix(in oklab, #7cb896 35%, transparent);--glow-b: color-mix(in oklab, #e8b86d 28%, transparent);color-scheme:light}html[data-theme=light]{--bg: #e8eef2;--bg-deep: #d0dae3;--surface: #f7fafc;--ink: #152028;--muted: #516070;--brand: #0f4c5c;--accent: #c45c26;--accent-ink: #fff8f2;--danger: #9f1239;--section-a: #e3ebf1;--section-b: #ebe4da;--section-label: #355466;--beat-active: #ffe08a;--beat-active-ink: #152028;--beat-ring: #c45c26;--glow-a: color-mix(in oklab, #7aa8c0 30%, transparent);--glow-b: color-mix(in oklab, #e0a070 22%, transparent);color-scheme:light}html[data-theme=dark]{--bg: #121a17;--bg-deep: #0b100e;--surface: #1c2823;--ink: #e6efe9;--muted: #9bb0a4;--brand: #8fd6b0;--accent: #f0a202;--accent-ink: #1a1205;--danger: #f97066;--section-a: #1e2f28;--section-b: #243029;--section-label: #9bb0a4;--beat-active: #f0a202;--beat-active-ink: #1a1205;--beat-ring: #ffd27a;--glow-a: color-mix(in oklab, #2f6b52 40%, transparent);--glow-b: color-mix(in oklab, #8a5a12 25%, transparent);color-scheme:dark}html[data-theme=contrast]{--bg: #000000;--bg-deep: #000000;--surface: #000000;--ink: #ffffff;--muted: #ffff00;--brand: #ffff00;--accent: #00ffff;--accent-ink: #000000;--danger: #ff4d4d;--section-a: #000000;--section-b: #111111;--section-label: #ffff00;--beat-active: #ffff00;--beat-active-ink: #000000;--beat-ring: #ffffff;--glow-a: transparent;--glow-b: transparent;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%}body{font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;background:var(--bg);color:var(--ink);overscroll-behavior:none}button,input,textarea,select{font:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.beat-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:.45rem;flex:1;min-height:0;width:100%;padding:.35rem .5rem .5rem}.beat-section{position:relative;display:flex;flex-direction:column;min-height:0;border-radius:.35rem;overflow:hidden;border:1px solid color-mix(in oklab,var(--ink) 12%,transparent)}.beat-section--a{background:var(--section-a)}.beat-section--b{background:var(--section-b)}.beat-section__label{position:absolute;top:.2rem;left:.35rem;z-index:2;font-family:var(--font-display);font-size:clamp(.7rem,1.4vw,.95rem);font-weight:600;letter-spacing:.04em;color:var(--section-label);opacity:.85;pointer-events:none}.beat-section__rows{display:flex;flex-direction:column;flex:1;min-height:0;padding-top:1.1rem}.beat-row{display:grid;flex:1;min-height:0;grid-template-columns:repeat(8,1fr)}.beat-grid--rows-4 .beat-row{grid-template-columns:repeat(4,1fr)}.beat-cell{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;padding:.15rem .2rem;border-right:1px solid color-mix(in oklab,var(--ink) 8%,transparent);border-bottom:1px solid color-mix(in oklab,var(--ink) 8%,transparent);cursor:pointer;transition:background 80ms linear,transform .12s ease;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.beat-row>.beat-cell:last-child{border-right:none}.beat-cell__text{font-family:var(--font-body);font-size:clamp(.65rem,1.35vw,.95rem);font-weight:600;line-height:1.15;text-align:center;color:var(--ink);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}.beat-cell--active{background:var(--beat-active);box-shadow:inset 0 0 0 2px var(--beat-ring);z-index:1;animation:beat-pulse .35s ease-out}.beat-cell--active .beat-cell__text{color:var(--beat-active-ink)}.beat-cell--editing{cursor:text;background:color-mix(in oklab,var(--surface) 70%,transparent)}.beat-cell__input{width:100%;height:100%;border:none;background:transparent;text-align:center;font-family:var(--font-body);font-size:clamp(.6rem,1.2vw,.85rem);font-weight:600;color:var(--ink);outline:none}@keyframes beat-pulse{0%{transform:scale(.98)}to{transform:scale(1)}}@media(max-width:700px)and (orientation:portrait){.beat-grid{grid-template-columns:1fr;grid-template-rows:repeat(4,1fr)}}.dance-header{display:flex;flex-direction:column;gap:.35rem;padding:.45rem .65rem .25rem;background:color-mix(in oklab,var(--surface) 88%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid color-mix(in oklab,var(--ink) 10%,transparent);z-index:5}.dance-header__brand-row{display:flex;align-items:center;gap:.5rem}.brand{flex:1;min-width:0}.brand__name{font-family:var(--font-display);font-size:clamp(1.35rem,3.2vw,1.85rem);font-weight:600;letter-spacing:-.02em;color:var(--brand);line-height:1}.dance-header__actions{display:flex;gap:.35rem}.icon-btn{width:2.25rem;height:2.25rem;border:1px solid color-mix(in oklab,var(--ink) 18%,transparent);border-radius:.4rem;background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer}.icon-btn__bars,.icon-btn__bars:before,.icon-btn__bars:after{display:block;width:1rem;height:2px;background:currentColor;border-radius:1px;position:relative}.icon-btn__bars:before,.icon-btn__bars:after{content:"";position:absolute;left:0}.icon-btn__bars:before{top:-5px}.icon-btn__bars:after{top:5px}.chip{border:1px solid color-mix(in oklab,var(--ink) 18%,transparent);background:var(--surface);color:var(--ink);border-radius:.4rem;padding:.35rem .65rem;font-family:var(--font-body);font-size:.8rem;font-weight:600;cursor:pointer}.chip--on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.dance-header__meta{display:flex;align-items:flex-start;gap:.75rem}.meta-view{flex:1;min-width:0}.meta-view__title{margin:0;font-family:var(--font-display);font-size:clamp(1rem,2.4vw,1.35rem);font-weight:550;color:var(--ink);line-height:1.15}.meta-view__sub{margin:.15rem 0 0;font-size:.78rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meta-view__sub .dot{margin:0 .3rem;opacity:.6}.meta-edit{flex:1;display:flex;flex-direction:column;gap:.3rem}.meta-edit__title{font-family:var(--font-display);font-size:1.15rem;font-weight:600;border:1px solid color-mix(in oklab,var(--ink) 15%,transparent);border-radius:.35rem;padding:.25rem .4rem;background:var(--surface);color:var(--ink)}.meta-edit__row{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:.3rem}.meta-edit__row input{border:1px solid color-mix(in oklab,var(--ink) 15%,transparent);border-radius:.3rem;padding:.25rem .35rem;font-size:.78rem;background:var(--surface);color:var(--ink)}.bpm-field{display:flex;flex-direction:column;align-items:flex-end;gap:.1rem;font-size:.65rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.bpm-field input{width:3.5rem;border:1px solid color-mix(in oklab,var(--ink) 15%,transparent);border-radius:.35rem;padding:.3rem .25rem;text-align:center;font-family:var(--font-body);font-size:1rem;font-weight:700;background:var(--surface);color:var(--ink)}.dance-header__panels{display:flex;gap:.4rem}.panel-toggle{border:none;background:transparent;color:var(--muted);font-family:var(--font-body);font-size:.72rem;font-weight:650;letter-spacing:.04em;text-transform:uppercase;padding:.15rem 0;cursor:pointer;border-bottom:2px solid transparent}.panel-toggle--open{color:var(--brand);border-bottom-color:var(--brand)}.expand-panel{animation:panel-in .18s ease-out}.expand-panel pre,.expand-panel textarea{margin:0;width:100%;box-sizing:border-box;white-space:pre-wrap;font-family:var(--font-body);font-size:.82rem;line-height:1.4;color:var(--ink);background:color-mix(in oklab,var(--surface) 80%,var(--bg));border:1px solid color-mix(in oklab,var(--ink) 10%,transparent);border-radius:.4rem;padding:.5rem .6rem}@keyframes panel-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media(max-width:640px){.meta-edit__row{grid-template-columns:1fr}}.side-menu{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:flex}.side-menu__backdrop{flex:1;border:none;background:color-mix(in oklab,black 45%,transparent);cursor:pointer;animation:fade-in .16s ease-out}.side-menu__panel{width:min(22rem,92vw);height:100%;background:var(--surface);color:var(--ink);box-shadow:8px 0 32px color-mix(in oklab,black 25%,transparent);display:flex;flex-direction:column;gap:.75rem;padding:.85rem;overflow:auto;animation:slide-in .2s ease-out}.side-menu__head{display:flex;align-items:center;justify-content:space-between}.side-menu__head h2,.side-menu__settings h3,.side-menu__premium h3{margin:0;font-family:var(--font-display);font-size:1.25rem;color:var(--brand)}.side-menu__settings h3,.side-menu__premium h3{font-size:1rem;margin-bottom:.4rem}.side-menu__actions{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.menu-btn{border:1px solid color-mix(in oklab,var(--ink) 16%,transparent);background:var(--bg);color:var(--ink);border-radius:.4rem;padding:.55rem .45rem;font-family:var(--font-body);font-size:.78rem;font-weight:650;cursor:pointer}.menu-btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);grid-column:1 / -1}.menu-btn--danger{color:var(--danger);grid-column:1 / -1}.side-menu__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3rem;flex:1;min-height:8rem}.dance-item{width:100%;text-align:left;border:1px solid transparent;background:color-mix(in oklab,var(--bg) 80%,var(--surface));border-radius:.4rem;padding:.55rem .6rem;cursor:pointer;color:inherit}.dance-item--active{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 18%,var(--surface))}.dance-item__title{display:block;font-weight:700;font-size:.9rem}.dance-item__meta{display:block;margin-top:.15rem;font-size:.72rem;color:var(--muted)}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.45rem;font-size:.85rem}.setting-row select{border:1px solid color-mix(in oklab,var(--ink) 16%,transparent);border-radius:.35rem;padding:.3rem .4rem;background:var(--bg);color:var(--ink)}.side-menu__premium p{margin:0;font-size:.78rem;line-height:1.4;color:var(--muted)}@keyframes slide-in{0%{transform:translate(-12px);opacity:.6}to{transform:translate(0);opacity:1}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.transport{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.45rem .65rem .65rem;background:color-mix(in oklab,var(--surface) 92%,transparent);border-top:1px solid color-mix(in oklab,var(--ink) 10%,transparent)}.transport__potatoes{border:1px solid color-mix(in oklab,var(--ink) 18%,transparent);background:var(--surface);color:var(--ink);border-radius:.45rem;padding:.7rem .85rem;font-family:var(--font-body);font-size:.78rem;font-weight:700;letter-spacing:.02em;cursor:pointer;min-height:3rem}.transport__potatoes:disabled{opacity:.4;cursor:not-allowed}.transport__main{display:flex;gap:.55rem;margin-left:auto}.transport--tap-left .transport__main{margin-left:0;margin-right:auto}.transport--tap-left{flex-direction:row-reverse}.transport__tap,.transport__stop{border:none;border-radius:.55rem;min-width:5.5rem;min-height:3.6rem;font-family:var(--font-body);font-size:1rem;font-weight:800;letter-spacing:.06em;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation}.transport__tap{background:var(--accent);color:var(--accent-ink);box-shadow:0 4px color-mix(in oklab,var(--accent) 65%,black);transition:transform 80ms ease,box-shadow 80ms ease}.transport__tap:active{transform:translateY(3px);box-shadow:0 1px color-mix(in oklab,var(--accent) 65%,black)}.transport__tap--live{animation:tap-glow 1.1s ease-in-out infinite}.transport__stop{background:color-mix(in oklab,var(--danger) 88%,black);color:#fff8f5;box-shadow:0 4px color-mix(in oklab,var(--danger) 55%,black)}.transport__stop:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}.transport__stop:not(:disabled):active{transform:translateY(3px);box-shadow:0 1px color-mix(in oklab,var(--danger) 55%,black)}@keyframes tap-glow{0%,to{filter:brightness(1)}50%{filter:brightness(1.08)}}.app-shell{position:relative;height:100dvh;width:100%;display:flex;flex-direction:column;overflow:hidden;color:var(--ink);background:var(--bg)}.app-atmosphere{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background:radial-gradient(120% 80% at 10% -10%,var(--glow-a),transparent 55%),radial-gradient(90% 70% at 100% 0%,var(--glow-b),transparent 50%),linear-gradient(160deg,var(--bg) 0%,var(--bg-deep) 100%);opacity:1}.app-atmosphere:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cpath fill='%23000000' fill-opacity='0.035' d='M0 60h120M60 0v120'/%3E%3C/svg%3E");mix-blend-mode:multiply;opacity:.55}.app-shell>*:not(.app-atmosphere){position:relative;z-index:1}.app-main{flex:1;min-height:0;display:flex}.toast{position:fixed;left:50%;bottom:5.5rem;transform:translate(-50%);background:var(--ink);color:var(--bg);padding:.55rem .9rem;border-radius:.45rem;font-size:.85rem;font-weight:650;z-index:50;animation:toast-in .2s ease-out}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}