:root{--bg:#141220;--surface:#1c1929;--surface-2:#242038;--border:#322c47;--ink:#efeceb;--ink-mute:#a8a1ba;--accent:#8d7bf7;--accent-ink:#0f0d18;--flag:#f0a53d;--ok:#57c688;--danger:#ef7a68;--s1:4px;--s2:8px;--s3:16px;--s4:24px;--s5:40px;--radius:8px;--radius-sm:4px;--tap:44px;--mono:ui-monospace, SFMono-Regular, Consolas, Menlo, monospace;--sans:system-ui, "Segoe UI", Roboto, sans-serif}*,:before,:after{box-sizing:border-box}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-sm)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.num{font-family:var(--mono);font-variant-numeric:tabular-nums}.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:var(--ink-mute);font-size:.72rem;font-weight:700}.muted{color:var(--ink-mute)}:root{--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-rebound:cubic-bezier(.34, 1.56, .64, 1);--dur-fast:.12s;--dur-mid:.22s;--dur-slow:.42s;--stagger:45ms}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes strike{0%{transform:scale(.4)}55%{transform:scale(1.15)}to{transform:scale(1)}}@keyframes grow-up{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes slide-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}@keyframes indicator-in{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes shimmer{0%{background-position:-180% 0}to{background-position:180% 0}}@keyframes tick{0%{opacity:1}60%{opacity:.45}to{opacity:1}}@media (prefers-reduced-motion:no-preference){.app-main{animation:rise var(--dur-slow) var(--ease-out) both}.home-head .eyebrow{animation:slide-in var(--dur-mid) var(--ease-out) both}.home-head h1{animation:rise var(--dur-slow) var(--ease-out) 60ms both}.home-head>p:not(.eyebrow){animation:rise var(--dur-slow) var(--ease-out) .12s both}.home-rail>li,.home-due>li,.home-unfinished>li,.home-quiet>li,.stat-row>li,.data-table tbody tr,.student-list>li,.assignments>li,.timeline>li,.playalong-history>li{animation:rise var(--dur-mid) var(--ease-out) both}.home-rail>li:first-child,.home-due>li:first-child,.home-unfinished>li:first-child,.home-quiet>li:first-child,.stat-row>li:first-child,.data-table tbody tr:first-child,.student-list>li:first-child,.assignments>li:first-child,.timeline>li:first-child,.playalong-history>li:first-child{animation-delay:calc(var(--stagger) * 1)}.home-rail>li:nth-child(2),.home-due>li:nth-child(2),.home-unfinished>li:nth-child(2),.home-quiet>li:nth-child(2),.stat-row>li:nth-child(2),.data-table tbody tr:nth-child(2),.student-list>li:nth-child(2),.assignments>li:nth-child(2),.timeline>li:nth-child(2),.playalong-history>li:nth-child(2){animation-delay:calc(var(--stagger) * 2)}.home-rail>li:nth-child(3),.home-due>li:nth-child(3),.home-unfinished>li:nth-child(3),.home-quiet>li:nth-child(3),.stat-row>li:nth-child(3),.data-table tbody tr:nth-child(3),.student-list>li:nth-child(3),.assignments>li:nth-child(3),.timeline>li:nth-child(3),.playalong-history>li:nth-child(3){animation-delay:calc(var(--stagger) * 3)}.home-rail>li:nth-child(4),.home-due>li:nth-child(4),.home-unfinished>li:nth-child(4),.home-quiet>li:nth-child(4),.stat-row>li:nth-child(4),.data-table tbody tr:nth-child(4),.student-list>li:nth-child(4),.assignments>li:nth-child(4),.timeline>li:nth-child(4),.playalong-history>li:nth-child(4){animation-delay:calc(var(--stagger) * 4)}.home-rail>li:nth-child(n+5),.home-due>li:nth-child(n+5),.home-unfinished>li:nth-child(n+5),.home-quiet>li:nth-child(n+5),.stat-row>li:nth-child(n+5),.data-table tbody tr:nth-child(n+5),.student-list>li:nth-child(n+5),.assignments>li:nth-child(n+5),.timeline>li:nth-child(n+5),.playalong-history>li:nth-child(n+5){animation-delay:calc(var(--stagger) * 5)}.card,.home-focus,.home-block,.region,.transport,.bar-grid{animation:rise var(--dur-mid) var(--ease-out) both}.home-focus{animation-duration:var(--dur-slow)}}.skeleton{background:linear-gradient(90deg, var(--surface) 25%, color-mix(in srgb, var(--accent) 12%, var(--surface-2)) 50%, var(--surface) 75%) 0 0 / 220% 100%;border-radius:var(--radius);animation:1.4s linear infinite shimmer}.skeleton-stack{gap:var(--s2);flex-direction:column;width:100%;max-width:40rem;display:flex}.skeleton-line{height:14px}.skeleton-line.wide{width:100%}.skeleton-line.mid{width:70%}.skeleton-line.short{width:40%}.skeleton-block{height:88px}@media (prefers-reduced-motion:reduce){.skeleton{background:var(--surface-2)}}.btn{font:inherit;min-height:var(--tap);padding:0 var(--s3);border-radius:var(--radius);border:1px solid var(--border);background:var(--surface-2);color:var(--ink);cursor:pointer;transition:background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-mid) var(--ease-out), opacity var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-rebound)}.btn:hover:not(:disabled){border-color:var(--accent);transform:translateY(-1px);box-shadow:0 6px 18px #00000047}.btn:active:not(:disabled){box-shadow:none;transform:translateY(0)scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}.btn-primary:hover:not(:disabled){box-shadow:0 8px 22px color-mix(in srgb, var(--accent) 38%, transparent)}.btn-danger{color:var(--danger);border-color:color-mix(in srgb, var(--danger) 45%, transparent)}a.btn{align-items:center;text-decoration:none;display:inline-flex}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--s3);gap:var(--s3);flex-direction:column;width:100%;display:flex}.card-head{justify-content:space-between;align-items:baseline;gap:var(--s3);flex-wrap:wrap;display:flex}.card-head h2{margin:0;font-size:1.05rem}.card-actions{gap:var(--s2);flex-wrap:wrap;display:flex}.card-toggle{align-items:center;gap:var(--s2);color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;padding:0;display:flex}.card-body{gap:var(--s3);flex-direction:column;display:flex}.table-scroll{width:100%;overflow-x:auto;container:table-scroll/inline-size}.data-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.data-table th,.data-table td{text-align:left;padding:var(--s2) var(--s3);border-bottom:1px solid var(--border);white-space:nowrap}.data-table th{text-transform:uppercase;letter-spacing:.1em;color:var(--ink-mute);font-size:.72rem;font-weight:700}.data-table .cell-elastic{white-space:normal;min-width:12ch}@container table-scroll (width<=900px){.data-table th,.data-table td{padding:var(--s2)}.row-actions{flex-wrap:wrap}}.data-table input[type=checkbox]{width:20px;height:20px;accent-color:var(--accent);cursor:pointer}.data-table input[type=checkbox]:disabled{cursor:not-allowed;opacity:.6}.pill{text-transform:uppercase;letter-spacing:.06em;padding:2px var(--s2);white-space:nowrap;border:1px solid;border-radius:999px;font-size:.72rem;font-weight:700;display:inline-block}.pill-ok{color:var(--ok)}.pill-flag{color:var(--flag)}.pill-accent{color:var(--accent)}.pill-neutral{color:var(--ink-mute)}.banner{padding:var(--s2) var(--s3);border-radius:var(--radius);border:1px solid;margin:0;font-size:.9rem}@media (prefers-reduced-motion:no-preference){.banner{animation:slide-in var(--dur-mid) var(--ease-rebound) both}}.banner-error{color:var(--danger);background:color-mix(in srgb, var(--danger) 10%, transparent)}.banner-ok{color:var(--ok);background:color-mix(in srgb, var(--ok) 10%, transparent)}.banner-info{color:var(--ink-mute)}.btn.icon-text{align-items:center;gap:var(--s1);padding:0 var(--s2);display:inline-flex}.row-actions{gap:var(--s2);align-items:center;display:flex}.star{width:var(--tap);height:var(--tap);color:var(--ink-mute);cursor:pointer;transition:color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out), transform var(--dur-mid) var(--ease-rebound);background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;padding:0;display:inline-flex}.star:hover{color:var(--flag);background:color-mix(in srgb, var(--flag) 14%, transparent);transform:scale(1.15)}.star.on{color:var(--flag)}.star:active{transform:scale(.88)}@media (prefers-reduced-motion:no-preference){.star.on svg{animation:strike var(--dur-mid) var(--ease-rebound)}}.selection-bar{align-items:center;gap:var(--s2);width:100%;padding:var(--s2) var(--s3);background:color-mix(in srgb, var(--accent) 10%, var(--surface));border:1px solid color-mix(in srgb, var(--accent) 40%, transparent);border-radius:var(--radius);flex-wrap:wrap;display:flex}@media (prefers-reduced-motion:no-preference){.selection-bar{animation:slide-in var(--dur-mid) var(--ease-rebound) both}}.data-table tr.row-selected td{background:color-mix(in srgb, var(--accent) 9%, transparent)}.confirm{max-width:min(30rem, calc(100vw - var(--s4)));padding:var(--s4);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--ink);box-shadow:0 30px 70px #0000008c}.confirm::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#06050ca6}.confirm h2{margin:0 0 var(--s2);font-size:1.15rem}.confirm p{margin:var(--s2) 0 0;font-size:.9rem}.confirm-list{padding-left:var(--s4);max-height:30vh;margin:0;font-size:.9rem;overflow-y:auto}.confirm-actions{justify-content:flex-end;gap:var(--s2);margin-top:var(--s4);display:flex}@media (prefers-reduced-motion:no-preference){.confirm[open]{animation:rise var(--dur-mid) var(--ease-rebound) both}}.consent{max-width:min(42rem, calc(100vw - var(--s4)))}.consent[open]{max-height:calc(100dvh - var(--s5));flex-direction:column;display:flex}.consent-terms{margin:var(--s3) 0 0;padding-left:var(--s4);flex:auto;min-height:3rem;font-size:.9rem;overflow-y:auto}.consent-terms li+li{margin-top:var(--s2)}.consent-agree{gap:var(--s2);margin-top:var(--s3);padding:var(--s3);border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb, var(--accent) 8%, transparent);cursor:pointer;align-items:flex-start;font-size:.9rem;display:flex}.consent-agree input[type=checkbox]{width:1.15rem;height:1.15rem;accent-color:var(--accent);flex:none;margin:.1rem 0 0}.replace-choice{gap:var(--s2);margin:var(--s3) 0 0;padding:var(--s3);border:1px solid var(--border);border-radius:var(--radius);font-size:.9rem;display:grid}.replace-choice legend{padding:0 var(--s1);font-weight:600}.replace-choice input[type=radio]{accent-color:var(--accent)}.replace-choice p{margin:0}.upload-row,.action-row{gap:var(--s2);flex-wrap:wrap;align-items:center;display:flex}.icon-button{width:var(--tap);height:var(--tap);color:var(--ink-mute);border-radius:var(--radius);cursor:pointer;background:0 0;border:1px solid #0000;place-items:center;padding:0;display:grid}.icon-button:hover:not(:disabled),.icon-button[aria-pressed=true]{color:var(--ink);border-color:var(--border);background:var(--surface-2)}.icon-button.danger:hover:not(:disabled){color:var(--danger);border-color:color-mix(in srgb, var(--danger) 45%, transparent)}.icon-button:disabled{opacity:.35;cursor:default}.pane{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;overflow:hidden}.pane+.pane{margin-top:var(--s3)}.pane-head{align-items:center;gap:var(--s2);width:100%;padding:var(--s3);color:var(--ink);font:inherit;cursor:pointer;text-align:left;background:0 0;border:none;font-weight:600;display:flex}.pane-head:hover{background:var(--surface-2)}.pane-chevron{color:var(--ink-mute);transition:transform var(--dur-fast) var(--ease-out);display:inline-block}.pane-chevron.open{transform:rotate(90deg)}.pane-title{flex:1}.pane-body{padding:0 var(--s3) var(--s3);gap:var(--s3);flex-direction:column;display:flex}.settings-form{gap:var(--s1);flex-direction:column;display:flex}.settings-form>label{margin-top:var(--s2);font-weight:600}.settings-form input,.settings-form textarea{width:100%;font:inherit;padding:var(--s1) var(--s2);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--ink)}.settings-form textarea{font-family:var(--mono);resize:vertical}.settings-actions{align-items:center;gap:var(--s2);margin-top:var(--s3);display:flex}.admin-external{margin-top:var(--s4)}.tabs{gap:var(--s1);border-bottom:1px solid var(--border);margin:var(--s3) 0 var(--s4);flex-wrap:wrap;display:flex}.tab{font:inherit;color:var(--ink-mute);padding:var(--s2) var(--s3);min-height:var(--tap);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000}.tab:hover{color:var(--ink)}.tab.active{color:var(--ink);border-bottom-color:var(--accent);font-weight:600}.tabs,[role=tabpanel]{width:100%}:root{font:16px/1.6 var(--sans);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--ink);background:radial-gradient(120% 90% at 50% 0%, #241f4d 0%, var(--bg) 60%) fixed;-webkit-font-smoothing:antialiased}body{min-height:100dvh;margin:0}#root{min-height:100dvh}a{color:var(--accent)}.shell{align-items:flex-start;gap:var(--s3);flex-direction:column;display:flex}.app-content:has(.shell-fit){height:100dvh;min-height:0}.app-main:has(>.shell-fit){min-height:0;padding:var(--s4) var(--s3);flex-direction:column;display:flex}.shell-fit{gap:var(--s2);flex:1;width:100%;min-height:0}.shell-fit .player-frame{width:324px}.page-head{align-items:center;gap:var(--s3);flex-wrap:wrap;display:flex}.page-head h2{margin:0}.head-actions{align-items:center;gap:var(--s2);margin-left:auto;display:flex}.home-head h1{margin:var(--s1) 0 var(--s2);letter-spacing:-.02em;text-wrap:balance;font-size:clamp(1.75rem,4vw,2.5rem)}.home-head p{margin:0}.login{text-align:center;min-height:100dvh;padding:var(--s4);justify-content:center;align-items:center}.login h1{letter-spacing:-.02em;margin:0;font-size:clamp(2rem,6vw,3.25rem)}.logo{border-radius:22%;box-shadow:0 10px 30px #00000059}@media (prefers-reduced-motion:no-preference){.login .logo{animation:strike var(--dur-slow) var(--ease-rebound) both}.login h1{animation:rise var(--dur-slow) var(--ease-out) .14s both}.login>p{animation:rise var(--dur-slow) var(--ease-out) .24s both}.login>div{animation:fade-in var(--dur-slow) var(--ease-out) .38s both}}.region{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin:0 0 var(--s3);padding:var(--s3);width:100%}.region.low-region{border-color:var(--flag)}.region>header{gap:var(--s3);color:var(--ink-mute);margin-bottom:var(--s2);flex-wrap:wrap;align-items:baseline;font-size:.85rem;display:flex}.crop{border-radius:var(--radius-sm);border:1px solid var(--border);width:100%;height:auto;display:block}.crop-missing{color:var(--ink-mute);font-size:.85rem}.low{color:var(--flag)}.warning{color:var(--flag);font-size:.85rem}.summary{border:1px solid var(--border);border-radius:var(--radius);padding:var(--s2) var(--s3);margin:var(--s3) 0;background:var(--surface)}.summary.bad{border-color:var(--flag);color:var(--flag)}.summary .ok{color:var(--ok);font-weight:600}.editor-toolbar{align-items:center;gap:var(--s3);margin:var(--s3) 0;flex-wrap:wrap;display:flex}.undo-group{gap:var(--s1);display:flex}.page-canvas{margin:0 0 var(--s3);border:1px solid var(--border);border-radius:var(--radius);touch-action:none;position:relative;overflow:hidden}.page-canvas>img{width:100%;height:auto;display:block}.page-canvas .overlay{cursor:crosshair;position:absolute;inset:0}.seg-box{border:2px solid var(--accent);background:color-mix(in srgb, var(--accent) 12%, transparent);box-sizing:border-box;position:absolute}.seg-box.highlighted{border-color:var(--flag);background:color-mix(in srgb, var(--flag) 20%, transparent)}.seg-box .label-input{width:120px;font-size:.75rem;position:absolute;top:-24px;left:0}.seg-box .del{padding:0 var(--s1);font-size:.75rem;line-height:1;position:absolute;top:-24px;right:0}.bar-grid{margin:var(--s3) 0 0;overflow-x:auto}.bar-head{color:var(--ink-mute);margin-bottom:var(--s1);font-size:.78rem;line-height:1.25;font-family:var(--mono)}table.grid{border-collapse:separate;border-spacing:2px}table.grid th{color:var(--ink-mute);padding:0 var(--s1);text-align:center;font-size:.66rem;font-weight:700;font-family:var(--mono)}table.grid th[scope=row]{text-align:right;white-space:nowrap;padding-right:var(--s2);font-family:var(--sans);letter-spacing:.04em}table.grid td{padding:0}table.grid td.beat,table.grid th.beat{border-left:2px solid var(--border);padding-left:2px}.cell{border-radius:var(--radius-sm);background:var(--surface-2);cursor:pointer;width:26px;height:26px;transition:background-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-rebound);border:0;padding:0;display:block}.cell:hover{background:color-mix(in srgb, var(--accent) 30%, var(--surface-2));transform:scale(1.14)}.cell:active{transform:scale(.9)}.cell.on{background:var(--accent)}.cell.on.low{background:var(--flag)}@media (prefers-reduced-motion:no-preference){.cell.on{animation:strike var(--dur-mid) var(--ease-rebound)}}.sticking-row th{font-size:.72rem}.stick{border-radius:var(--radius-sm);width:26px;height:22px;color:var(--ink-mute);text-align:center;background:0 0;border:0;padding:0;font-size:.82rem;font-weight:600;line-height:22px;display:block}button.stick{cursor:pointer}button.stick:hover{background:var(--surface-2)}.stick.set{color:var(--ink)}.flam-row th{font-size:.72rem}.flam{border-radius:var(--radius-sm);width:26px;height:22px;color:var(--ink-mute);text-align:center;background:0 0;border:0;padding:0;font-size:.9rem;line-height:22px;display:block}button.flam{cursor:pointer}button.flam:hover{background:var(--surface-2)}.flam.set{color:var(--accent)}.add-voice{margin-top:var(--s2);font-size:.85rem}.by-author{color:var(--ink-mute);font-size:.8rem;font-style:italic}.share-dialog .share-section{margin:var(--s3) 0}.share-dialog h3{color:var(--ink-mute);margin:0 0 var(--s2);font-size:.9rem}.user-hits{margin:var(--s2) 0 0;gap:var(--s1);flex-direction:column;padding:0;list-style:none;display:flex}.user-hits .chip{text-align:left;width:100%}.share-qr{margin:var(--s2) 0;border-radius:var(--radius-sm);padding:var(--s1);background:#fff;display:block}.share-link-actions{gap:var(--s2);display:flex}.trello-cards{margin:var(--s2) 0 0;padding:0;list-style:none}.trello-cards li{padding:var(--s2) 0;border-top:1px solid var(--border)}.trello-attachments{gap:var(--s2);margin-top:var(--s1);flex-wrap:wrap;display:flex}.exercise-name-cell{align-items:center;gap:var(--s2);display:inline-flex}.exercise-thumb{object-fit:cover;border-radius:var(--radius-sm);background:var(--surface-2);flex:none;width:40px;height:40px}.thumb-field{margin-top:var(--s3)}.exercise-cards{gap:var(--s3);flex-direction:column;width:100%;margin:0;padding:0;list-style:none;display:flex}.exercise-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--s3);gap:var(--s2);flex-direction:column;display:flex}.exercise-card-head{align-items:center;gap:var(--s2);display:flex}.exercise-card-title{overflow-wrap:anywhere;flex:1;min-width:0;font-weight:600}.exercise-card-head .star{flex:none}.exercise-card-meta{align-items:center;gap:var(--s2);flex-wrap:wrap;font-size:.85rem;display:flex}.exercise-card-actions{gap:var(--s2);display:flex}.exercise-card-actions>*{flex:1 1 0;justify-content:center;max-width:220px}.thumb-note{margin:var(--s1) 0 var(--s2);font-size:.8rem}.create-choices{gap:var(--s2);margin-top:var(--s2);flex-wrap:wrap;display:flex}.create-surface{position:relative}.create-surface.dragging .card{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 35%, transparent)}.drop-veil{pointer-events:none;border-radius:var(--radius);background:color-mix(in srgb, var(--surface) 82%, transparent);color:var(--ink);place-items:center;font-weight:600;display:grid;position:absolute;inset:0}.file-chosen{margin:0;font-size:.85rem}.section-label{min-width:12ch;font-size:.85rem}.region>header>.icon-button{margin-left:auto}.region>header>.icon-button~.icon-button{margin-left:0}.bar-row{align-items:flex-start;gap:var(--s2);margin-top:var(--s2);display:flex}.bar-row+.bar-row{padding-top:var(--s1);border-top:1px solid var(--border)}.bar-row>.bar-grid{flex:1;min-width:0;margin:0}.bar-actions{gap:var(--s1);grid-template-columns:repeat(2,auto);padding-top:1.1rem;display:grid}.drag-handle{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.drag-handle:active:not(:disabled){cursor:grabbing}.bar-row.dragging{opacity:.45}.bar-row.drop-before{box-shadow:inset 0 3px 0 -1px var(--accent)}.bar-row.drop-after{box-shadow:inset 0 -3px 0 -1px var(--accent)}.voice-remove-row{gap:var(--s1);margin-top:var(--s2);flex-wrap:wrap;display:flex}.chip{font:600 .75rem/1 var(--sans);padding:var(--s1) var(--s2);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-2);color:var(--ink-mute);cursor:pointer}.chip:hover:not(:disabled){color:var(--ink);border-color:var(--accent)}.chip:disabled{opacity:.4;cursor:default}.transport{align-items:center;gap:var(--s2);padding:var(--s2);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-wrap:wrap;display:flex}.practice-transport{align-items:flex-start;gap:var(--s3);padding:var(--s3)}.shell-fit .practice-transport{padding:var(--s2);gap:var(--s2)}.player-frame{aspect-ratio:16/9;border-radius:var(--radius);background:#000;flex:none;width:416px;max-width:100%;position:relative;overflow:hidden}.player-frame iframe{border:0;width:100%;height:100%;display:block}.clip-transport-readout{gap:var(--s1);padding-top:var(--s2);flex-direction:column;display:flex}.attach-track{gap:var(--s2);flex-wrap:wrap;align-items:center;display:flex}.bar-strip{gap:var(--s2);padding:var(--s2) 2px;width:100%;display:flex;overflow-x:auto}.bar-strip .bar{padding:var(--s2);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);cursor:pointer;opacity:.5;flex:none;transition:opacity .12s,border-color .12s}.bar-strip .bar.active{opacity:1;border-color:var(--accent)}.bar-strip .bar-number{font:.66rem var(--mono);color:var(--ink-mute)}.bar-strip table{border-collapse:separate;border-spacing:1px}.bar-strip th{color:var(--ink-mute);text-align:right;padding-right:var(--s1);white-space:nowrap;font-size:.6rem}.bar-strip td{background:var(--surface-2);border-radius:2px;width:10px;height:12px;padding:0}.bar-strip td.hit{background:var(--accent)}.bar-strip .bar.active .bar-number{animation:.6s ease-out infinite tick}.page-head-practice{flex-wrap:nowrap}.page-head-practice h2{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.view-switch{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);flex-shrink:0;gap:2px;margin-left:auto;padding:2px;display:flex}.practice-tools{align-items:center;gap:var(--s2);flex-shrink:0;margin-left:auto;display:flex}.practice-tools .view-switch{margin-left:0}.view-switch-btn{align-items:center;gap:var(--s1);font:600 .8rem var(--sans);color:var(--ink-mute);border-radius:var(--radius-sm);padding:var(--s1) var(--s2);cursor:pointer;background:0 0;border:0;min-height:32px;text-decoration:none;display:flex}.view-switch-btn-icon{padding:var(--s1);justify-content:center;min-width:32px}.view-switch-btn:hover{color:var(--ink)}.view-switch-btn:disabled{opacity:.4;cursor:default}.view-switch-btn:disabled:hover{color:var(--ink-mute)}.view-switch-btn.active{color:var(--accent-ink);background:var(--accent)}.loops-menu{position:relative}.loops-menu-list{top:calc(100% + var(--s1));z-index:20;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;min-width:260px;max-height:60vh;display:flex;position:absolute;right:0;overflow-y:auto;box-shadow:0 8px 24px #00000073}.loops-menu-item{padding:var(--s2) var(--s3);min-height:var(--tap);font:inherit;color:var(--ink);text-align:left;border:0;border-bottom:1px solid var(--border);cursor:pointer;background:0 0;flex-direction:column;align-items:flex-start;gap:2px;display:flex}.loops-menu-item:last-child{border-bottom:0}.loops-menu-item:hover,.loops-menu-item:focus-visible{background:var(--surface-2)}.loops-menu-item .muted{font-size:.8rem}.loops-btn-running{color:var(--accent-ink);background:var(--flag)}.loops-btn-running:hover{color:var(--accent-ink)}.loops-btn-title{text-overflow:ellipsis;white-space:nowrap;max-width:14ch;overflow:hidden}.pgrid{align-content:flex-start;gap:var(--s2);flex-direction:column;flex:1;width:100%;min-height:0;padding:2px;display:flex;overflow:auto}.pgrid-section{gap:var(--s1);flex-direction:column;display:flex}.pgrid-bars{align-content:flex-start;gap:var(--s2);flex-wrap:wrap;display:flex}.pgrid-section-name{font:700 .68rem var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-mute);margin:0}.pgrid-bar{padding:var(--s1) var(--s2) var(--s2);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);transition:border-color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);flex:none}.pgrid-bar.at{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, var(--surface))}.pgrid-bar.at-bar{background:color-mix(in srgb, var(--accent) 24%, var(--surface));box-shadow:0 0 0 2px var(--accent)}.pgrid-num{font:.66rem var(--mono);color:var(--ink-mute)}.pgrid table{border-collapse:separate;border-spacing:2px}.pgrid th{font:700 .6rem var(--mono);color:var(--ink-mute);text-align:center;padding:0}.pgrid th[scope=row]{font:.66rem var(--sans);text-align:right;white-space:nowrap;padding-right:var(--s1)}.pgrid td{padding:0}.pgrid td.beat,.pgrid th.beat{border-left:2px solid var(--border);padding-left:2px}.pgrid-sticking td{color:var(--ink-mute);text-align:center;font-size:.78rem;font-weight:600}.pgrid-flams td{color:var(--accent);text-align:center;font-size:.9rem}.pcell{border-radius:var(--radius-sm);background:var(--surface-2);width:16px;height:16px;display:block}.pcell.on{background:var(--accent)}.pgrid td.at,.pgrid th.at{background:color-mix(in srgb, var(--accent) 26%, transparent);border-radius:var(--radius-sm)}.pgrid td.at .pcell.on{background:color-mix(in srgb, var(--accent) 35%, var(--ink))}.pgrid-table{position:relative}.pgrid-cursor{background:var(--accent);width:2px;box-shadow:0 0 6px color-mix(in srgb, var(--accent) 60%, transparent);opacity:0;pointer-events:none;border-radius:1px;margin-left:-1px;position:absolute;top:0;bottom:0;left:0}.pgrid-cursor.at{opacity:1}@media (width<=599px){.app-content:has(.shell-fit) .app-footer{display:none}.page-head-practice{width:100%}.shell-fit .practice-transport{justify-content:center;width:100%;position:relative}.shell-fit .player-frame{flex:140px;min-width:0;max-width:240px}.shell-fit .practice-transport:has(.player-frame-audio) .seek-pad{grid-template-columns:repeat(2,auto);display:grid}.shell-fit .player-frame-audio{aspect-ratio:auto;border-radius:var(--radius);pointer-events:none;z-index:1;background:0 0;width:auto;max-width:none;position:absolute;inset:0}.shell-fit .player-frame-audio .audio-player{display:none}.shell-fit .player-frame-audio .count-in-number{font-size:3.2rem}}@media (height<=500px) and (orientation:landscape){.app-content:has(.shell-fit) .app-footer{display:none}.app-main:has(>.shell-fit){padding:var(--s1) var(--s3)}.shell-fit{grid-template-rows:auto minmax(0,1fr);grid-template-columns:auto minmax(0,1fr);align-items:stretch;display:grid}.shell-fit>.page-head-practice{grid-column:1/-1}.shell-fit>.practice-transport{grid-area:2/1;align-self:start}.shell-fit>.score,.shell-fit>.pgrid{grid-area:2/2;min-width:0;min-height:0}.shell-fit .seek-pad{grid-template-columns:repeat(2,auto);display:grid}.shell-fit .player-frame-audio{aspect-ratio:auto;border-radius:var(--radius);pointer-events:none;z-index:1;background:0 0;width:auto;max-width:none;position:absolute;inset:0}.shell-fit .player-frame-audio .audio-player{display:none}.shell-fit .player-frame-audio .count-in-number{font-size:3.2rem}.shell-fit .practice-transport{position:relative}.shell-fit .player-frame{width:240px}.shell-fit .transport-dial.compact,.shell-fit .transport-dial.compact .transport-dial-rig{width:116px}.shell-fit .transport-dial.compact .transport-dial-rig{height:116px}.shell-fit .transport-dial.compact .transport-dial-beast{width:32px;height:32px;font-size:.8rem}}.tempo-sections ol{padding:0;list-style:none}.tempo-sections li{gap:var(--s2);margin:var(--s2) 0;flex-wrap:wrap;align-items:center;font-size:.85rem;display:flex}.tempo-sections input[type=number]{width:5rem}.track-search ul{padding:0;list-style:none}.track-search li{gap:var(--s2);margin:var(--s2) 0;align-items:center;display:flex}.progress{width:100%}.progress section{margin-top:var(--s4)}.progress textarea{width:100%;max-width:40rem;margin-bottom:var(--s2);padding:var(--s2);background:var(--surface-2);color:var(--ink);border:1px solid var(--border);border-radius:var(--radius);font:inherit;display:block}.stat-row{gap:var(--s2);margin:var(--s3) 0;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));width:100%;padding:0;list-style:none;display:grid}.stat-row li{padding:var(--s3);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);transition:border-color var(--dur-mid) var(--ease-out), transform var(--dur-mid) var(--ease-rebound);flex-direction:column;gap:2px;display:flex}.stat-row li:hover{border-color:var(--accent);transform:translateY(-3px)}.stat-value{color:var(--ink);white-space:nowrap;font-size:1.3rem;font-weight:700;line-height:1.2}.student-list,.assignments,.timeline,.playalong-history{width:100%;padding:0;list-style:none}.student-list li,.assignments li,.timeline li,.playalong-history li{gap:var(--s2);padding:var(--s2) 0;border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:baseline;display:flex}.timeline .kind{text-transform:uppercase;letter-spacing:.06em;color:var(--ink-mute);font-size:.72rem}a.progress-exercise{color:inherit;text-decoration:none}a.progress-exercise:hover{color:var(--accent);text-decoration:underline}.status{padding:2px var(--s2);border:1px solid;border-radius:999px;font-size:.72rem}.status-received{color:var(--ink-mute)}.status-reviewed{color:var(--accent)}.status-practised{color:var(--ok)}.minutes-chart{margin:var(--s3) 0}.minutes-chart figcaption{margin-bottom:var(--s2);font-size:.85rem}.minutes-chart-plot{max-width:40rem;position:relative}.chart-bar{fill:var(--accent);transition:fill var(--dur-fast) var(--ease-out);transform-box:fill-box;transform-origin:bottom}.chart-bar.hovered{fill:color-mix(in srgb, var(--accent) 70%, white)}@media (prefers-reduced-motion:no-preference){.chart-bar{animation:grow-up var(--dur-slow) var(--ease-out) both}.chart-bar:nth-of-type(3n){animation-delay:60ms}.chart-bar:nth-of-type(3n+1){animation-delay:.12s}.chart-bar:nth-of-type(3n+2){animation-delay:.18s}}.chart-baseline{stroke:var(--border);stroke-width:1px}.chart-tooltip{background:var(--surface-2);color:var(--ink);border:1px solid var(--border);border-radius:var(--radius-sm);padding:2px var(--s2);font-size:.78rem;position:absolute;top:0;right:0}.chart-table{margin-top:var(--s2);font-size:.8rem}.chart-table td,.chart-table th{padding:1px var(--s3) 1px 0;text-align:left}.permanent-admin td{background:color-mix(in srgb, var(--accent) 7%, transparent)}.permanent-admin .pill{margin-left:var(--s2)}.tutor-map-heading{text-transform:uppercase;letter-spacing:.14em;color:var(--ink-mute);margin:var(--s4) 0 var(--s2);font-size:.72rem;font-weight:700}.score-section{width:100%}.score-section h2{margin:0 0 var(--s2);font-size:1.05rem}fieldset{border:1px solid var(--border);border-radius:var(--radius);padding:var(--s3);width:100%}legend{text-transform:uppercase;letter-spacing:.14em;color:var(--ink-mute);padding:0 var(--s2);font-size:.72rem;font-weight:700}.meta-form label{gap:var(--s1);margin-bottom:var(--s3);color:var(--ink-mute);flex-direction:column;font-size:.85rem;display:flex}.meta-form input,.meta-form textarea{color:var(--ink);font-size:1rem}.tempo-field{gap:var(--s4);margin-bottom:var(--s3);flex-wrap:wrap;align-items:flex-start;display:flex}.tempo-field label{flex:12ch;min-width:12ch}.form-status{margin-top:var(--s3);width:100%}.back-link{align-items:center;gap:var(--s1);min-height:var(--tap);color:var(--ink-mute);font-size:.9rem;text-decoration:none;display:inline-flex}.back-link:hover{color:var(--accent)}input[type=text],input[type=number],input:not([type]),select,textarea{font:inherit;min-height:var(--tap);padding:0 var(--s2);background:var(--surface-2);color:var(--ink);border:1px solid var(--border);border-radius:var(--radius)}input[type=file]{font:inherit;color:var(--ink-mute);max-width:100%}input[type=file]::file-selector-button{font:inherit;min-height:var(--tap);margin-right:var(--s2);padding:0 var(--s3);border-radius:var(--radius);border:1px solid var(--border);background:var(--surface-2);color:var(--ink);cursor:pointer;transition:border-color .12s}input[type=file]::file-selector-button:hover{border-color:var(--accent)}.app-footer{padding:var(--s3);text-align:center;color:var(--ink-mute);border-top:1px solid var(--border);font-size:.72rem}.app-footer a{color:inherit}.home{gap:var(--s4)}.home>.home-head h1{margin:0}.home-focus{align-items:center;gap:var(--s3);width:100%;padding:var(--s3);border:1px solid var(--border);border-radius:var(--radius);background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 18%, var(--surface)) 0%, var(--surface) 62%);display:flex;box-shadow:0 14px 34px #00000047}.home-focus .exercise-thumb{border-radius:var(--radius);flex:none}.home-focus-text{flex:1;min-width:0}.home-focus-text h2{margin:var(--s1) 0;overflow-wrap:anywhere;font-size:clamp(1.15rem,3.2vw,1.6rem);line-height:1.2}.home-focus-text p:last-child{margin:0;font-size:.9rem}.home-focus-go{flex:none}.home-focus-empty{background:var(--surface);box-shadow:none;display:block}.home-focus-empty h2{margin:var(--s1) 0 var(--s2)}.home-focus-empty p{margin:0 0 var(--s3);max-width:46rem}@media (width<=620px){.home-focus{flex-wrap:wrap}.home-focus-text{flex:60%}.home-focus-go{flex:1 0 100%;justify-content:center}}.home-block{width:100%}.home-block-head{justify-content:space-between;align-items:baseline;gap:var(--s3);margin-bottom:var(--s2);display:flex}.home-block-head h2{margin:0;font-size:1.05rem}.home-block-head a{color:var(--ink-mute);white-space:nowrap;font-size:.85rem;text-decoration:none}.home-block-head a:hover{color:var(--accent)}.home-stats{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));margin:0}.home-stats .stat-value{align-items:center;gap:var(--s1);display:flex}.home-stats .streak .stat-value{color:var(--ink-mute)}.home-stats .streak.lit .stat-value{color:var(--flag)}.home-stats .streak.lit{border-color:color-mix(in srgb, var(--flag) 40%, var(--border))}.home-spark{width:100%;height:34px;margin-top:var(--s3);display:block}.home-spark-bar{fill:var(--accent)}.home-spark-bar.empty{fill:var(--border)}.home-due,.home-unfinished,.home-quiet{width:100%;margin:0;padding:0;list-style:none}.home-due li,.home-unfinished li,.home-quiet li{align-items:center;gap:var(--s2);padding:var(--s2) 0;border-bottom:1px solid var(--border);flex-wrap:wrap;display:flex}.home-due-title{overflow-wrap:anywhere;flex:1;min-width:0}a.home-due-title{color:inherit;text-decoration:none}a.home-due-title:hover{color:var(--accent);text-decoration:underline}.home-due-when{color:var(--ink-mute);font-size:.85rem}.home-due-when.overdue{color:var(--danger);font-weight:600}.home-rail{padding:0 0 var(--s2);gap:var(--s2);scroll-snap-type:x proximity;width:100%;padding-top:var(--s1);margin:0;list-style:none;display:flex;overflow-x:auto}.home-rail>li{scroll-snap-align:start;flex:none}.home-tile{gap:var(--s1);width:150px;height:100%;padding:var(--s2);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:inherit;transition:border-color var(--dur-mid) var(--ease-out), background-color var(--dur-mid) var(--ease-out), transform var(--dur-mid) var(--ease-rebound);flex-direction:column;text-decoration:none;display:flex}.home-tile:hover{border-color:var(--accent);background:var(--surface-2);transform:translateY(-3px)}.home-tile:active{transform:translateY(0)scale(.98)}.home-tile .exercise-thumb{width:100%;height:56px}.home-tile-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.9rem;font-weight:600;line-height:1.25;display:-webkit-box;overflow:hidden}.home-tile-meta{align-items:center;gap:var(--s1);margin-top:auto;font-size:.78rem;display:flex}.home-tile-star{color:var(--flag);display:inline-flex}.home-unfinished a,.home-quiet a{overflow-wrap:anywhere;flex:1;min-width:0}.home-block>p.muted{margin:0 0 var(--s2);max-width:46rem}.tutor-map{width:100%}.tutor-map-bar{align-items:center;gap:var(--s3);min-height:var(--s4);display:flex}.tutor-map-bar p{margin:0;font-size:.85rem}.tutor-map-svg{width:100%;height:auto;margin-top:var(--s2);display:block;overflow:visible}.tutor-map-col{fill:var(--ink-mute);letter-spacing:.14em;text-transform:uppercase;font-size:10.5px;font-weight:700}.tutor-map-edge{fill:none;stroke:var(--border);stroke-width:1.5px;transition:stroke .12s,stroke-width .12s}.tutor-map-edge.lit{stroke:var(--accent);stroke-width:2.5px}.tutor-map-edge-hit{fill:none;stroke:#0000;stroke-width:16px;cursor:pointer}.tutor-map-node{cursor:pointer}.tutor-map-node rect{fill:var(--surface-2);stroke:var(--border);stroke-width:1px;transition:stroke .12s,fill .12s}.tutor-map-node text{fill:var(--ink);pointer-events:none;font-size:13px}.tutor-map-node .sub{fill:var(--ink-mute);font-size:10.5px}.tutor-map-node:hover rect,.tutor-map-node.lit rect{stroke:var(--accent)}.tutor-map-node.selected rect{stroke:var(--accent);stroke-width:2px;fill:color-mix(in srgb, var(--accent) 16%, var(--surface-2))}.tutor-map-node.orphan:not(.selected) rect{stroke:var(--flag);stroke-dasharray:4 3}.tutor-map-legend{align-items:center;gap:var(--s2);margin:var(--s2) 0 0;font-size:.78rem;display:flex}.tutor-map-key{border-top:2px dashed var(--flag);width:22px;height:0;display:inline-block}.tutor-map-empty{font-size:.85rem}.user-actions{align-items:center;gap:var(--s2);white-space:nowrap;display:flex}.icon-link{width:var(--s4);height:var(--s4);border-radius:var(--radius-sm);color:var(--ink-mute);border:1px solid var(--border);justify-content:center;align-items:center;display:inline-flex}.icon-link:hover{color:var(--accent);border-color:var(--accent)}.user-details-row>td{background:var(--surface-2)}.user-details{gap:var(--s2) var(--s3);padding:var(--s2) 0;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:0;display:grid}.user-fact dt{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-mute);font-size:.72rem;font-weight:700}.user-fact dd{font-variant-numeric:tabular-nums;margin:0}.setting-diff{gap:var(--s1);margin:0;display:grid}.setting-diff-row dt{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-mute);font-size:.72rem;font-weight:700}.setting-diff-row dd{align-items:baseline;gap:var(--s2);flex-wrap:wrap;max-width:46rem;margin:0;display:flex}.setting-diff-row .was{color:var(--ink-mute);text-decoration:line-through}.setting-diff-row .arrow{color:var(--ink-mute)}.settings-history-note{margin-top:0}.settings-history-group .pill{margin-left:var(--s2)}.tempo-dial{align-items:center;gap:var(--s2);flex-direction:column;width:150px;display:flex}.tempo-dial-knob{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:50%;place-items:center;width:150px;height:150px;display:grid;position:relative}.tempo-dial-knob:active{cursor:grabbing}.tempo-dial-knob svg{width:100%;height:100%;position:absolute;inset:0}.tempo-dial-track{fill:none;stroke:var(--border);stroke-width:9px;stroke-linecap:round}.tempo-dial-fill{fill:none;stroke:var(--accent);stroke-width:9px;stroke-linecap:round}.tempo-dial-cap{fill:var(--surface);stroke:var(--border);stroke-width:1px}.tempo-dial-dot{fill:var(--ink)}.tempo-dial-knob[data-unset=true] .tempo-dial-fill{stroke:var(--border)}.tempo-dial-knob[data-unset=true] .tempo-dial-dot{fill:var(--ink-mute)}.tempo-dial-readout{pointer-events:none;flex-direction:column;align-items:center;display:flex;position:relative}.tempo-dial-value{font-size:2rem;font-weight:700;line-height:1.1}.tempo-dial-unit{letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);font-size:.68rem}.tempo-dial-tap{width:100%;min-height:var(--tap);font:inherit;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:color-mix(in srgb, var(--accent) 14%, var(--surface));border:1px solid color-mix(in srgb, var(--accent) 45%, transparent);border-radius:var(--radius);cursor:pointer;font-size:.85rem;font-weight:700}.tempo-dial-tap:active{background:color-mix(in srgb, var(--accent) 30%, var(--surface))}.tempo-dial-hint{text-align:center;min-height:1.2em;margin:0;font-size:.74rem}.page-loader{gap:var(--s2);padding:var(--s3);background:var(--surface);flex-direction:column;display:flex}.page-loader-sheet{aspect-ratio:1/1.3;padding:var(--s4) var(--s3);border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface-2);color:var(--ink-mute);flex-direction:column;justify-content:space-evenly;display:flex;position:relative;overflow:hidden}.page-loader-staff{opacity:.35;height:33px;animation:page-loader-breathe 2.4s var(--ease-out) infinite;background:repeating-linear-gradient(currentColor 0 1px,#0000 1px 8px)}.page-loader-staff:nth-child(2){animation-delay:.16s}.page-loader-staff:nth-child(3){animation-delay:.32s}.page-loader-staff:nth-child(4){animation-delay:.48s}.page-loader-staff:nth-child(5){animation-delay:.64s}.page-loader-sheet:after{content:"";pointer-events:none;background:linear-gradient(100deg, transparent 35%, color-mix(in srgb, var(--accent) 20%, transparent) 50%, transparent 65%) 0 0 / 220% 100%;animation:1.8s linear infinite shimmer;position:absolute;inset:0}.page-loader-scan{background:linear-gradient(90deg, transparent, var(--accent), transparent);height:2px;box-shadow:0 0 14px color-mix(in srgb, var(--accent) 65%, transparent);animation:page-loader-scan 2.4s var(--ease-out) infinite;position:absolute;left:0;right:0}.page-loader-foot{align-items:center;gap:var(--s3);display:flex}.page-loader-steps{align-items:center;gap:var(--s1);display:flex}.page-loader-step{background-color:color-mix(in srgb, var(--ink-mute) 30%, transparent);width:8px;height:12px;animation:page-loader-step 1.2s var(--ease-rebound) infinite;border-radius:2px}.page-loader-step:nth-child(2){animation-delay:.15s}.page-loader-step:nth-child(3){animation-delay:.3s}.page-loader-step:nth-child(4){animation-delay:.45s}.page-loader-step:nth-child(5){animation-delay:.6s}.page-loader-step:nth-child(6){animation-delay:.75s}.page-loader-step:nth-child(7){animation-delay:.9s}.page-loader-step:nth-child(8){animation-delay:1.05s}.page-loader-label{font-family:var(--mono);color:var(--ink-mute);font-size:.8rem}@keyframes page-loader-scan{0%{opacity:0;top:0}12%{opacity:1}88%{opacity:1}to{opacity:0;top:100%}}@keyframes page-loader-breathe{0%,to{opacity:.25}50%{opacity:.6}}@keyframes page-loader-step{0%{background-color:color-mix(in srgb, var(--ink-mute) 30%, transparent);transform:scaleY(1)}12%{background-color:var(--accent);transform:scaleY(1.7)}45%,to{background-color:color-mix(in srgb, var(--ink-mute) 30%, transparent);transform:scaleY(1)}}.transcribe-progress{margin:var(--s3) 0;padding:var(--s2) var(--s3);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--ink-mute);font-size:.9rem}.transcribe-progress-head{justify-content:space-between;align-items:baseline;gap:var(--s2);display:flex}.transcribe-progress-head h3{color:var(--ink);margin:0;font-size:.95rem}.transcribe-progress-clock{font-family:var(--mono);font-variant-numeric:tabular-nums}.transcribe-progress-now{margin:var(--s1) 0 var(--s2);color:var(--ink)}.transcribe-progress-bar{margin:var(--s2) 0;background:color-mix(in srgb, var(--ink-mute) 20%, transparent);border-radius:999px;height:6px;position:relative;overflow:hidden}.transcribe-progress-fill{border-radius:inherit;background:var(--accent);height:100%}@media (prefers-reduced-motion:no-preference){.transcribe-progress-fill{transition:width var(--dur-mid) var(--ease-out)}.transcribe-progress-bar.is-working:after{content:"";background:linear-gradient(90deg, transparent 35%, color-mix(in srgb, var(--accent) 55%, transparent) 50%, transparent 65%) 0 0 / 220% 100%;animation:1.6s linear infinite shimmer;position:absolute;inset:0}}.transcribe-progress-steps{flex-wrap:wrap;gap:3px;margin:0;padding:0;list-style:none;display:flex}.transcribe-progress-steps li{background-color:color-mix(in srgb, var(--ink-mute) 25%, transparent);border-radius:2px;width:10px;height:14px}.transcribe-progress-steps .is-done{background-color:var(--accent)}.transcribe-progress-steps .is-now{background-color:var(--flag);animation:1s ease-in-out infinite tick}.transcribe-progress-foot{margin:var(--s2) 0 0;opacity:.8;font-size:.8rem}.import-progress{padding:var(--s2) var(--s3);border:1px solid var(--line);border-radius:var(--radius);color:var(--ink-mute);font-size:.9rem}.import-progress-head{justify-content:space-between;align-items:baseline;gap:var(--s2);display:flex}.import-progress-head h3{color:var(--ink);margin:0;font-size:.95rem}.import-progress-clock{font-variant-numeric:tabular-nums}.import-progress-bar{margin:var(--s2) 0;background:color-mix(in srgb, var(--ink-mute) 20%, transparent);border-radius:999px;height:6px;overflow:hidden}.import-progress-fill{border-radius:inherit;background:var(--accent);height:100%}@media (prefers-reduced-motion:no-preference){.import-progress-fill{transition:width var(--dur-mid) linear}}.import-progress-stages{gap:2px;margin:0;padding:0;list-style:none;display:grid}.import-progress-stages li{align-items:baseline;gap:var(--s1);display:flex}.import-progress-mark{text-align:center;width:1em;display:inline-block}.import-progress-stages .is-done{color:var(--ok)}.import-progress-stages .is-now{color:var(--ink)}.import-progress-stages .is-pending{opacity:.55}.import-progress-stages .is-yours{margin-top:var(--s1);padding-top:var(--s1);border-top:1px dashed var(--line)}.import-progress-note{opacity:.8;font-size:.8rem}.import-progress-foot{margin:var(--s2) 0 0;opacity:.8;font-size:.8rem}.score{width:100%}.score-paper{border-radius:var(--radius);padding:var(--s3) var(--s2);background:#fdfdfb;overflow-x:auto;box-shadow:0 12px 30px #00000059}.score-host{min-height:40px}.score-host svg{max-width:100%;height:auto}.notation-settings-link{border-radius:var(--radius-sm);width:32px;height:32px;color:var(--ink-mute);border:1px solid #0000;flex:none;justify-content:center;align-items:center;display:inline-flex}.notation-settings-link:hover,.notation-settings-link:focus-visible{color:var(--ink);border-color:var(--border);background:var(--surface-2)}.notation-settings-link svg{width:18px;height:18px}.shell-fit .score{flex:1;min-height:0;display:flex}.shell-fit .score-paper{min-height:0;padding:var(--s2);overscroll-behavior:contain;flex-direction:column;flex:1;display:flex}.shell-fit .score-host{flex:1;min-height:0}@media (width<=599px){.shell-fit .score-paper{padding:var(--s1)}}.transport-dial{align-items:center;gap:var(--s2);flex-direction:column;width:184px;display:flex}.transport-dial-rig{-webkit-user-select:none;user-select:none;isolation:isolate;place-items:center;width:184px;height:184px;display:grid;position:relative}.transport-dial-rig[data-disabled=true]{opacity:.5}.transport-dial-rings{z-index:1;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.transport-dial-ptrack{fill:none;stroke:color-mix(in srgb, var(--border) 80%, transparent);stroke-width:4px}.transport-dial-pfill{fill:none;stroke:var(--ok);stroke-width:4px;stroke-linecap:round}.transport-dial-track{fill:none;stroke:var(--border);stroke-width:10px;stroke-linecap:round}.transport-dial-fill{fill:none;stroke:var(--accent);stroke-width:10px;stroke-linecap:round}.transport-dial-tick{stroke:var(--border);stroke-width:2px;stroke-linecap:round}.transport-dial-tick.on{stroke:var(--ink-mute)}.transport-dial-reference{stroke:var(--ink-mute);stroke-width:2px;stroke-dasharray:2 2}.transport-dial-dot{fill:var(--ink)}.transport-dial-ring{z-index:1;cursor:ns-resize;touch-action:none;border-radius:50%;position:absolute;inset:0}.transport-dial-ring:active{cursor:grabbing}.transport-dial-core{z-index:2;border:1px solid color-mix(in srgb, var(--accent) 45%, transparent);background:radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--accent) 26%, var(--surface)), var(--surface) 70%);width:96px;height:96px;color:var(--ink);cursor:pointer;border-radius:50%;place-items:center;padding:0;transition:transform 90ms,box-shadow .16s;display:grid;position:relative}.transport-dial-core:hover:not(:disabled){border-color:var(--accent)}.transport-dial-core:active:not(:disabled){transform:scale(.96)}.transport-dial-core:disabled{cursor:default}.transport-dial-core[data-playing=true]{background:radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--accent) 55%, var(--surface)), color-mix(in srgb, var(--accent) 22%, var(--surface)) 72%);box-shadow:0 0 24px -4px color-mix(in srgb, var(--accent) 55%, transparent)}.transport-dial-core svg{fill:var(--ink);display:block}.transport-dial-beast{z-index:3;width:var(--tap);height:var(--tap);background:var(--surface);color:var(--ink);border:1px solid var(--border);cursor:pointer;border-radius:50%;place-items:center;padding:0;font-size:1.05rem;line-height:1;display:grid;position:absolute;transform:translate(-50%,-50%)}.transport-dial-beast:hover:not(:disabled){border-color:var(--accent)}.transport-dial-beast:active:not(:disabled){background:var(--surface-2)}.transport-dial-beast:disabled{opacity:.32;cursor:default}.transport-dial-beast.flip{transform:translate(-50%,-50%)scaleX(-1)}.transport-dial-readout{pointer-events:none;flex-direction:column;align-items:center;display:flex}.transport-dial-value{font-size:1.5rem;font-weight:700;line-height:1.1}.transport-dial-unit{letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);font-size:.66rem}.transport-dial.compact{width:140px}.transport-dial.compact .transport-dial-rig{width:140px;height:140px}.transport-dial.compact .transport-dial-core{width:72px;height:72px}.transport-dial.compact .transport-dial-core svg{width:26px;height:26px}.transport-dial.compact .transport-dial-beast{width:38px;height:38px;font-size:.92rem}.transport-dial.compact .transport-dial-value{font-size:1.15rem}.transport-dial.compact .transport-dial-unit{font-size:.6rem}@media (prefers-reduced-motion:reduce){.transport-dial-core{transition-duration:.01ms}}.clip-timeline{margin:var(--s4) 0 var(--s3)}.clip-timeline .transport{align-items:flex-start;gap:var(--s3);margin-bottom:var(--s2);flex-wrap:wrap;display:flex}.clip-player{gap:var(--s2);flex-direction:column;display:flex}.clip-timeline .clock{font-family:var(--mono);font-size:1.1rem}.hint{font-size:.85rem}.zoom-controls{justify-content:flex-end;align-items:center;gap:var(--s1);margin-bottom:var(--s1);display:flex}.zoom-factor{margin-right:var(--s1);font-size:.72rem}.timeline-viewport{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);touch-action:none;scrollbar-width:none;overflow:auto hidden}.timeline-viewport::-webkit-scrollbar{display:none}.timeline-track{cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;height:46px;position:relative}.timeline-track[aria-disabled=true]{opacity:.5;cursor:default}.timeline-track .tick{position:absolute;top:0;bottom:0}.timeline-track .tick i{background:var(--border);width:1px;height:10px;position:absolute;top:0}.timeline-track .tick em{font-style:normal;font-family:var(--mono);color:var(--ink-mute);font-size:.72rem;position:absolute;top:12px;left:3px}.playhead{background:var(--accent);pointer-events:none;border-radius:1px;width:2px;margin-left:-1px;position:absolute;top:-4px;bottom:-4px}.playhead:before{content:"";background:var(--accent);border-radius:50%;width:12px;height:12px;position:absolute;top:-4px;left:-5px}.lane-palette{align-items:center;gap:var(--s2);margin:var(--s3) 0 var(--s2);flex-wrap:wrap;display:flex}.range-chip{font:inherit;color:var(--ink);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);padding:var(--s1) var(--s3);cursor:grab;flex-direction:column;align-items:flex-start;gap:2px;display:flex}.range-chip:disabled{opacity:.5;cursor:default}.range-chip em{color:var(--ink-mute);font-size:.75rem;font-style:normal;font-family:var(--mono)}.lane-palette .palette-hint{flex-basis:100%;font-size:.85rem}.lane-viewport{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);touch-action:none;overflow:auto hidden}.lane{touch-action:none;height:72px;position:relative}.lane-empty{pointer-events:none;justify-content:center;align-items:center;margin:0;display:flex;position:absolute;inset:0}.lane-error{color:var(--danger);margin:var(--s1) 0}.lane-note{color:var(--ink);background:color-mix(in srgb, var(--accent) 10%, transparent);border-left:3px solid var(--accent);border-radius:var(--radius-sm);padding:var(--s1) var(--s2);margin:var(--s1) 0;font-size:.9rem}.lay-out-control{align-items:center;gap:var(--s2);margin:var(--s2) 0;flex-wrap:wrap;font-size:.85rem;display:flex}.lay-out-control .muted{flex:16rem}.lay-out-button{font:inherit;color:var(--accent);background:var(--surface-2);border:1px solid color-mix(in srgb, var(--accent) 50%, var(--border));border-radius:var(--radius-sm);padding:var(--s1) var(--s2);cursor:pointer;flex:none;font-size:.85rem}.lay-out-button:hover{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, transparent)}.lane-block{min-width:8px;padding:0 var(--s2);background:color-mix(in srgb, var(--accent) 28%, var(--surface-2));border:1px solid var(--accent);border-radius:var(--radius-sm);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;flex-direction:column;justify-content:center;gap:2px;display:flex;position:absolute;top:6px;bottom:6px;overflow:hidden}.lane-block.selected{background:color-mix(in srgb, var(--accent) 45%, var(--surface-2))}.block-label{white-space:nowrap;font-size:.85rem;font-weight:600}.block-meta{font-family:var(--mono);color:var(--ink-mute);white-space:nowrap;font-size:.72rem}.block-ticks{pointer-events:none;height:9px;position:absolute;top:0;left:0;right:0}.block-ticks>i{background:color-mix(in srgb, var(--ink) 55%, transparent);width:1px;height:5px;position:absolute;top:0}.block-ticks>i.major{background:var(--ink);width:2px;height:9px}.block-passes{pointer-events:none;position:absolute;inset:0}.block-passes>i{border-left:1px dashed color-mix(in srgb, var(--ink) 45%, transparent);width:0;position:absolute;top:3px;bottom:3px}.block-repeat{margin-left:var(--s1);color:var(--ink);font-style:normal;font-weight:600}.repeat-control{align-items:baseline;gap:var(--s1);display:inline-flex}.repeat-control input{width:4rem;font:inherit;font-family:var(--mono);padding:2px var(--s1);color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm)}.fit-button{font:inherit;color:var(--ink);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:2px var(--s2);cursor:pointer;font-size:.85rem}.fit-button:hover{border-color:var(--accent)}.bar-miss{align-items:center;gap:var(--s2);color:var(--flag);border:1px solid color-mix(in srgb, var(--flag) 45%, transparent);background:color-mix(in srgb, var(--flag) 12%, transparent);border-radius:var(--radius-sm);padding:2px var(--s2);font-size:.85rem;display:inline-flex}.bar-miss>button{font:inherit;color:inherit;border-radius:var(--radius-sm);padding:0 var(--s2);cursor:pointer;background:0 0;border:1px solid}.bar-miss>button:hover{background:color-mix(in srgb, var(--flag) 22%, transparent)}.pin-button{font:inherit;color:var(--accent);background:var(--surface-2);border:1px solid color-mix(in srgb, var(--accent) 50%, var(--border));border-radius:var(--radius-sm);padding:2px var(--s2);cursor:pointer;font-size:.85rem}.pin-button:hover{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, transparent)}.pinned{align-items:center;gap:var(--s2);color:var(--accent);border:1px solid color-mix(in srgb, var(--accent) 45%, transparent);background:color-mix(in srgb, var(--accent) 12%, transparent);border-radius:var(--radius-sm);padding:2px var(--s2);font-size:.85rem;display:inline-flex}.pinned>button{font:inherit;color:inherit;border-radius:var(--radius-sm);padding:0 var(--s2);cursor:pointer;background:0 0;border:1px solid}.pinned>button:hover{background:color-mix(in srgb, var(--accent) 22%, transparent)}.lane-block.pinned{box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--accent) 65%, transparent)}.block-delete{font:inherit;color:var(--ink-mute);cursor:pointer;background:0 0;border:none;line-height:1;position:absolute;top:2px;right:10px}.block-delete:hover{color:var(--danger)}.timeline-track .tick.minor i{opacity:.55;height:6px}.timeline-track.has-beats{height:62px}.beat-lane{border-top:1px solid var(--border);pointer-events:none;height:16px;position:absolute;bottom:0;left:0;right:0}.beat-lane .beat{background:var(--ink-mute);opacity:.45;width:1px;height:6px;position:absolute;bottom:0}.beat-lane .beat.major{background:var(--ink);opacity:.85;height:13px}.beat-lane .beat.ghost{opacity:.2}.beat-lane .beat.major.ghost{opacity:.4}.timeline-track.has-onsets{height:72px}.timeline-track.has-beats.has-onsets .beat-lane{bottom:10px}.onset-lane{pointer-events:none;height:10px;position:absolute;bottom:0;left:0;right:0}.onset-lane .onset{width:1px;position:absolute;bottom:0}.onset-lane .onset-snare{background:var(--flag);opacity:.9;height:10px}.onset-lane .onset-kick{background:var(--accent);opacity:.6;height:6px}.snap-control{justify-content:flex-end;align-items:center;gap:var(--s1);margin-bottom:var(--s1);font-size:.85rem;display:flex}.snap-option{font:inherit;color:var(--ink-mute);border-radius:var(--radius-sm);padding:2px var(--s2);cursor:pointer;background:0 0;border:1px solid #0000;font-size:.78rem}.snap-option:hover{color:var(--ink);border-color:var(--border)}.snap-option:disabled{opacity:.45;cursor:default}.map-click-control{align-items:center;gap:var(--s2);margin:var(--s2) 0;font-size:.85rem;display:flex}.map-click-control .snap-option{border-color:var(--border);flex:none}.snap-option.on{color:var(--ink);border-color:var(--accent);background:color-mix(in srgb, var(--accent) 22%, var(--surface-2))}.track-actions{align-self:flex-start;gap:var(--s1);display:flex}.track-source-actions{align-items:flex-start;gap:var(--s2);flex-direction:column;display:flex}.track-source-actions .audio-preserve-note{max-width:42rem;margin:0}.link-button{font:inherit;color:var(--ink-mute);padding:var(--s1) 0;cursor:pointer;background:0 0;border:none;align-self:flex-start;font-size:.85rem;text-decoration:underline}.link-button:hover{color:var(--ink)}.track-dialog{max-width:min(40rem, calc(100vw - var(--s4)))}.track-dialog .attach-track{align-items:center;gap:var(--s2);margin-bottom:var(--s3);flex-wrap:wrap;display:flex}.track-dialog .attach-track input{font:inherit;padding:var(--s1) var(--s2);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--ink);flex:16rem}.lane-palette{margin:var(--s3) 0 var(--s2)}.lane-readout{align-items:baseline;gap:var(--s3);margin:var(--s2) 0 0;flex-wrap:wrap;font-size:.85rem;display:flex}.lane-readout .num{font-family:var(--mono);font-size:1rem}.count-in{z-index:2;justify-content:center;align-items:center;gap:var(--s1);pointer-events:none;color:var(--ink);background:radial-gradient(circle at 50% 45%,#000000bd,#0000006b);flex-direction:column;display:flex;position:absolute;inset:0}.count-in-number{font-variant-numeric:tabular-nums;animation:count-in-pop var(--dur-mid) var(--ease-out) both;font-size:4.5rem;font-weight:800;line-height:1}.count-in-unit{letter-spacing:.18em;text-transform:uppercase;color:color-mix(in srgb, var(--ink) 76%, transparent);font-size:.68rem}.count-in[data-mode=beats] .count-in-number{color:var(--accent);animation:count-in-beat var(--dur-fast) var(--ease-rebound) both}.count-in[data-mode=beats] .count-in-unit{color:color-mix(in srgb, var(--accent) 82%, var(--ink))}.count-in-dots{margin-top:var(--s1);gap:6px;display:flex}.count-in-dots i{border:1px solid color-mix(in srgb, var(--ink) 55%, transparent);border-radius:50%;width:9px;height:9px}.count-in-dots i.on{background:var(--accent);border-color:var(--accent)}@keyframes count-in-pop{0%{opacity:0;transform:scale(1.35)}to{opacity:1;transform:scale(1)}}@keyframes count-in-beat{0%{opacity:.55;transform:scale(1.65)}to{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.count-in-number,.count-in[data-mode=beats] .count-in-number{animation-duration:.01ms}}.loops-layout{gap:var(--s4);align-items:flex-start;display:flex}.loops-main{gap:var(--s2);flex-direction:column;flex:1;min-width:0;display:flex}.loops-panel{gap:var(--s3);width:330px;padding-left:var(--s4);border-left:1px solid var(--border);flex-direction:column;flex:none;display:flex}.loops-lanes{gap:var(--s1);padding:var(--s2) 0;flex-direction:column;min-height:72px;display:flex;position:relative}.loops-row{height:32px;position:relative}.loops-section{padding:0 var(--s2);white-space:nowrap;color:var(--ink);background:color-mix(in srgb, var(--accent) 30%, var(--surface-2));border-radius:var(--radius-sm);cursor:grab;align-items:center;font-size:.75rem;display:flex;position:absolute;top:2px;bottom:2px;overflow:hidden}.loops-empty{padding:var(--s2);text-align:center;margin:0}.loop-band{padding:0 var(--s2);font:600 .75rem var(--sans);color:var(--ink);text-align:left;background:color-mix(in srgb, var(--ok) 18%, transparent);border:2px solid var(--ok);border-radius:var(--radius-sm);cursor:pointer;align-items:center;display:flex;position:absolute;top:0;bottom:0}.loop-band.selected{background:color-mix(in srgb, var(--flag) 22%, transparent);border-color:var(--flag)}.loop-band.outside{border-style:dashed;border-color:var(--danger)}.loop-band-label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.loop-handle{background:var(--flag);cursor:ew-resize;touch-action:none;border-radius:3px;width:10px;height:24px;margin-top:-12px;position:absolute;top:50%}.loop-handle-start{left:-6px}.loop-handle-end{right:-6px}.loops-field{gap:var(--s1);flex-direction:column;min-width:0;display:flex}.loops-field label{font-size:.85rem;font-weight:600}.loops-pair{gap:var(--s2);grid-template-columns:1fr 1fr;align-items:end;display:grid}.loops-endless{align-items:center;gap:var(--s1);min-height:36px;display:flex}.loops-editor>.action-row{margin-top:var(--s4)}.seek-pad{align-items:center;gap:var(--s2);align-self:center;display:flex}.seek-pad-button{border:1px solid color-mix(in srgb, var(--accent) 45%, transparent);background:radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--accent) 16%, var(--surface)), var(--surface) 70%);width:72px;height:72px;color:var(--ink);cursor:pointer;border-radius:50%;flex:none;place-items:center;padding:0;transition:transform 90ms,border-color .16s;display:grid}.seek-pad-button:hover:not(:disabled){border-color:var(--accent)}.seek-pad-button:active:not(:disabled){transform:scale(.94)}.seek-pad-button:disabled{opacity:.5;cursor:default}.seek-pad-button svg{display:block}.seek-pad-arc{fill:none;stroke:var(--ink);stroke-width:3.2px;stroke-linecap:round}.seek-pad-head{fill:var(--ink)}.seek-pad-secs{fill:var(--ink);text-anchor:middle;font-family:inherit;font-size:18px;font-weight:700}@media (prefers-reduced-motion:reduce){.seek-pad-button{transition-duration:.01ms}}.seek-stack{grid-template-rows:minmax(0,1fr) auto minmax(0,1fr);align-self:stretch;justify-items:center;display:grid}.seek-stack .seek-pad{grid-row:2}.pass-counter{z-index:3;white-space:nowrap;color:var(--accent);font-variant-numeric:tabular-nums;pointer-events:none;background:color-mix(in srgb, var(--accent) 14%, var(--surface));border:1px solid color-mix(in srgb, var(--accent) 46%, transparent);border-radius:999px;grid-row:3;align-self:center;align-items:baseline;gap:.35rem;margin:0;padding:.1rem .7rem;font-size:2.2rem;font-weight:800;line-height:1.1;display:flex}.pass-counter-n{animation:pass-counter-pop var(--dur-fast) var(--ease-rebound) both;display:inline-block}@keyframes pass-counter-pop{0%{opacity:.5;transform:scale(1.4)}to{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.pass-counter-n{animation-duration:.01ms}}.notation-options{gap:var(--s3);margin:var(--s3) 0;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));display:grid}.notation-option{gap:var(--s1);flex-direction:column;display:flex}.notation-option select,.notation-option input[type=range]{width:100%}.notation-option-check>label{align-items:center;gap:var(--s1);display:flex}.notation-option-check input[type=checkbox]{flex:none;width:20px;height:20px}.notation-hint{color:var(--ink-mute);margin:0;font-size:.85rem;line-height:1.4}.notation-value{font-variant-numeric:tabular-nums;color:var(--ink-mute);font-weight:500}.notation-preview-head{margin:var(--s4) 0 var(--s1)}.app-shell{min-height:100dvh}.app-content{flex-direction:column;min-width:0;min-height:100dvh;display:flex}.app-main{flex:1}.app-footer{margin-top:auto}.app-topbar{z-index:9;justify-content:flex-end;align-items:center;gap:var(--s2);padding:var(--s2) var(--s3);background:color-mix(in srgb, var(--bg) 82%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);display:flex;position:sticky;top:0}.topbar-icon{width:var(--tap);height:var(--tap);color:var(--ink-mute);transition:color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out), transform var(--dur-mid) var(--ease-rebound);border-radius:50%;justify-content:center;align-items:center;display:inline-flex}.topbar-icon:hover{color:var(--ink);background:var(--surface-2);transform:rotate(45deg)}.topbar-icon[aria-current=page]{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent)}.user-menu{position:relative}.user-trigger{align-items:center;gap:var(--s2);min-height:var(--tap);padding:var(--s1) var(--s2);color:var(--ink);font:inherit;cursor:pointer;transition:background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-rebound);background:0 0;border:1px solid #0000;border-radius:999px;display:flex}.user-trigger:hover{background:var(--surface-2);border-color:var(--border)}.user-trigger:active{transform:scale(.97)}.user-avatar{object-fit:cover;border:1px solid var(--border);border-radius:50%;flex:none;width:32px;height:32px}.user-initial{background:var(--accent);color:var(--accent-ink);border-color:#0000;justify-content:center;align-items:center;font-size:.95rem;font-weight:700;display:inline-flex}.user-name{text-overflow:ellipsis;white-space:nowrap;max-width:16ch;font-size:.9rem;overflow:hidden}.user-caret{color:var(--ink-mute);transition:transform var(--dur-mid) var(--ease-rebound)}.user-caret.open{transform:rotate(180deg)}.user-popup{right:0;top:calc(100% + var(--s1));min-width:220px;padding:var(--s1);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);z-index:20;transform-origin:100% 0;position:absolute;box-shadow:0 18px 40px #00000073}@media (prefers-reduced-motion:no-preference){.user-popup{animation:slide-in var(--dur-mid) var(--ease-rebound) both}}.user-popup-head{padding:var(--s2);border-bottom:1px solid var(--border);margin-bottom:var(--s1);flex-direction:column;gap:2px;display:flex}.user-popup-name{font-weight:600}.user-popup-email{text-overflow:ellipsis;font-size:.8rem;overflow:hidden}.user-popup-item{text-align:left;width:100%;min-height:var(--tap);padding:0 var(--s2);border-radius:var(--radius-sm);color:var(--ink);font:inherit;cursor:pointer;transition:background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);background:0 0;border:0;display:block}.user-popup-item:hover{background:var(--surface-2);color:var(--accent)}@media (width<=599px){.user-name{display:none}}.app-nav ul{margin:0;padding:0;list-style:none;display:flex}.app-nav a{align-items:center;gap:var(--s2);min-height:var(--tap);padding:var(--s2) var(--s3);color:var(--ink-mute);border-radius:var(--radius);transition:color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-rebound);text-decoration:none;display:flex;position:relative}.app-nav a:hover{color:var(--ink);background:var(--surface-2)}.app-nav a svg{transition:transform var(--dur-mid) var(--ease-rebound)}.app-nav a:hover svg{transform:translateY(-2px)scale(1.08)}.app-nav a:active{transform:scale(.97)}.app-nav a[aria-current=page]{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent)}.app-nav a[aria-current=page] svg{transform:scale(1.06)}.app-main{padding:var(--s4) var(--s3)}@media (width<=899px){.app-nav{z-index:10;background:color-mix(in srgb, var(--surface) 92%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom);position:fixed;inset:auto 0 0}.app-nav ul{justify-content:space-around}.app-nav a{min-width:var(--tap);padding:var(--s2) var(--s1);flex-direction:column;gap:2px;font-size:.68rem}.app-nav a[aria-current=page] svg{transform:translateY(-2px)scale(1.12)}@media (prefers-reduced-motion:no-preference){.app-nav{animation:rise var(--dur-slow) var(--ease-out) both}}.app-content{padding-bottom:calc(var(--tap) + var(--s3) + env(safe-area-inset-bottom))}}@media (width>=900px){.app-shell{grid-template-columns:232px 1fr;display:grid}.app-nav a[aria-current=page]:before{content:"";background:var(--accent);transform-origin:50%;border-radius:0 2px 2px 0;width:3px;position:absolute;top:20%;bottom:20%;left:0}@media (prefers-reduced-motion:no-preference){.app-nav a[aria-current=page]:before{animation:indicator-in var(--dur-mid) var(--ease-rebound) both}.app-nav li{animation:rise var(--dur-mid) var(--ease-out) both}.app-nav li:first-child{animation-delay:30ms}.app-nav li:nth-child(2){animation-delay:75ms}.app-nav li:nth-child(3){animation-delay:.12s}.app-nav li:nth-child(4){animation-delay:.165s}.app-nav li:nth-child(5){animation-delay:.21s}}.app-nav{height:100dvh;padding:var(--s4) var(--s2);border-right:1px solid var(--border);align-self:start;position:sticky;top:0}.app-nav ul{gap:var(--s1);flex-direction:column}.app-main{padding:var(--s5) var(--s5) calc(var(--s5) * 2);max-width:1100px}.app-main:has(>.shell-wide){max-width:none}.app-main:has(.pgrid){max-width:none}}.update-banner{left:50%;bottom:calc(var(--s3) + env(safe-area-inset-bottom,0px));z-index:100;align-items:center;gap:var(--s3);max-width:calc(100vw - 2 * var(--s3));padding:var(--s2) var(--s3);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);font-size:.9rem;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 8px 24px #0006}.update-banner-dismiss{color:var(--ink-mute);min-width:var(--tap);min-height:var(--tap);cursor:pointer;background:0 0;border:0;font-size:1.2rem;line-height:1}.update-banner-dismiss:hover{color:var(--ink)}