:root{color-scheme:light;--surface: #ffffff;--canvas: #f4f4f2;--surface-hover: #ebedeb;--surface-sidebar: #f8f8f7;--ink: #1c211d;--muted: #555b56;--line: #d1d4d1;--line-strong: #aeb2af;--line-input: #9ea49f;--line-switch: #777d78;--green: #58e36d;--green-hover: color-mix(in srgb, var(--green) 82%, var(--black));--green-soft: color-mix(in srgb, var(--green) 20%, var(--surface));--green-ink: color-mix(in srgb, var(--green) 35%, var(--black));--danger: #b42332;--danger-line: #e3a5ac;--sand: #f5e7c9;--sand-ink: #684a12;--sky: #dcebf5;--sky-ink: #315b78;--black: #000000;--transparent: transparent;--shadow-popover: 0 12px 35px #00000015;--shadow-card: 0 5px 16px #0000000c;--shadow-dialog: 0 20px 70px #00000026;--dialog-backdrop: #1c211d66;font-family:Avenir Next,Segoe UI,Helvetica Neue,sans-serif;color:var(--ink);background:var(--canvas);font-synthesis:none}*,*:before,*:after{box-sizing:border-box}body,h1,h2,h3,p,ul,ol,dl,dd,fieldset{margin:0}ul,ol{padding:0;list-style:none}button,input,textarea{font:inherit;color:inherit}button{border:0;background:var(--transparent)}button:not(:disabled){cursor:pointer}button:disabled{cursor:not-allowed}a{color:inherit;text-decoration:none}svg,canvas{display:block}canvas{max-width:100%}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);text-align:center;text-decoration:none;line-height:1.4;transition:background-color .15s,border-color .15s;min-height:44px;height:auto;padding:.65rem 1.1rem;font-size:.875rem;font-weight:600;box-shadow:none}.button svg{flex-shrink:0}.button:hover{background:var(--surface-hover);border-color:var(--line-strong)}.button-primary{background:var(--green);border-color:var(--green);color:var(--ink)}.button-primary:hover{background:var(--green-hover);border-color:var(--green-hover)}.button-secondary{background:var(--surface);border-color:var(--green-ink);color:var(--green-ink)}.button-secondary:hover{background:var(--surface-hover);border-color:var(--green-ink)}.button-quiet{border-color:var(--transparent);background:var(--transparent);color:var(--muted)}.button-quiet:hover{border-color:var(--transparent)}.button:disabled{opacity:.45;pointer-events:none}.text-input,.text-area,.audio-file-input{border:1px solid var(--line-input);border-radius:9px;padding:12px 14px;line-height:1.5;width:100%;max-width:100%;font-size:1rem;background:var(--surface)}.text-input:focus,.text-area:focus,.audio-file-input:focus{border-color:var(--green-ink)}.text-input[aria-invalid=true],.text-area[aria-invalid=true]{border-color:var(--danger)}.text-area{display:block;resize:vertical;min-height:130px}.audio-file-input{padding:6px}.audio-file-input::file-selector-button{font:inherit;padding:8px 12px;margin-inline-end:12px;border:0;border-radius:6px;background:var(--green);color:var(--ink);cursor:pointer}.notice{display:flex;align-items:center;gap:12px;padding:16px;border:1px solid var(--line);border-radius:10px;margin-block:1rem}.notice-error{color:var(--danger);border-color:var(--danger-line);background:var(--surface)}.spinner{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-inline-end-color:var(--transparent);border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.account-menu{position:relative}.account-trigger{padding:0}.breadcrumbs{font-size:.875rem}.breadcrumbs ul{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.breadcrumbs li+li:before{content:"/";color:var(--muted);margin-inline-end:10px}.breadcrumbs a:hover{text-decoration:underline;text-underline-offset:3px}.exercise-row+.exercise-row{border-top:1px solid var(--line)}.exercise-row a,.page-description{white-space:pre-wrap}.exercise-row a{font-weight:500}.exercise-row>div:first-child:not(.exercise-number){grid-column:1 / 3}.exercise-list>li:not(.exercise-row):not(.history-title){padding:24px;font-size:.875rem}[data-history] .recording-time{grid-column:1 / -1;font-size:.875rem;margin-bottom:12px}[data-recorder]{padding-block:20px}[data-player] canvas{grid-column:2;grid-row:1;min-width:0;width:100%;cursor:pointer}.option-label{display:flex;align-items:center;gap:8px;cursor:pointer}.switch{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;width:36px;height:22px;margin:0;border:1px solid var(--line-switch);border-radius:20px;background:var(--surface);cursor:pointer;transition:background-color .15s}.switch:before{content:"";position:absolute;width:16px;height:16px;inset-block-start:2px;inset-inline-start:2px;border-radius:50%;background:var(--muted);transition:transform .15s}.switch:checked{background:var(--green);border-color:var(--green-ink)}.switch:checked:before{background:var(--ink);transform:translate(14px)}.switch:dir(rtl):checked:before{transform:translate(-14px)}.switch:disabled{cursor:not-allowed;opacity:.45}fieldset:disabled .option-label{cursor:not-allowed}.rating-actions{display:flex;justify-content:space-between;gap:16px}.rating-actions .button{flex:1}body{margin:0;background:var(--canvas);font-size:15px;line-height:1.6}button,a,input,textarea{-webkit-tap-highlight-color:var(--transparent)}a,button,input,textarea,canvas,summary{scroll-margin-block:1.5rem}:focus-visible{outline:3px solid var(--green-ink);outline-offset:4px}h1,h2,h3{line-height:1.2}h1{font-size:clamp(1.8rem,3vw,2.25rem);font-weight:650;letter-spacing:-.045em}h2{font-size:1.2rem;font-weight:650;letter-spacing:-.025em}h3{font-size:1.08rem;font-weight:600}p,h1,h2,h3,a{overflow-wrap:anywhere}.button-small{min-height:36px;padding:.4rem .7rem}.button-icon{width:40px;min-height:40px;height:40px;padding:0}.button-outline{border-color:var(--line)}.text-input{min-height:48px}.muted,.page-description{color:var(--muted)}.eyebrow{font-size:.65rem;font-weight:700;letter-spacing:.14em;color:var(--green-ink);margin-bottom:.65rem}.app-shell{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100svh}.sidebar{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;background:var(--surface-sidebar);border-inline-end:1px solid var(--line);padding:36px 22px 22px}.brand{display:inline-flex;align-items:center;font-size:1.45rem;font-weight:750;letter-spacing:-.065em;color:var(--ink)}.brand-mark{display:grid;place-items:center;width:36px;height:39px;border-radius:11px;margin-inline-end:8px;background:var(--green);color:var(--green-ink)}.brand-dot{color:var(--green-ink)}.sidebar-label{font-size:.58rem;letter-spacing:.13em;font-weight:700;color:var(--muted);margin:57px 12px 14px}.main-nav{display:flex;flex-direction:column;gap:7px}.main-nav a{display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:8px;color:var(--muted);font-size:.87rem;font-weight:550}.main-nav a:hover{background:var(--surface-hover)}.main-nav a.nav-active{background:var(--green-soft);color:var(--ink);box-shadow:inset 3px 0 var(--green-ink)}.workspace{display:flex;flex-direction:column;min-width:0}.topbar{min-height:84px;padding:18px 4.5%;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--surface)}.account-trigger{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:.75rem;min-height:44px}.avatar-initial{display:grid;place-items:center;width:33px;height:33px;border-radius:50%;background:var(--surface-hover);font-weight:650;color:var(--ink)}.account-email{max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-popover{position:absolute;right:0;top:52px;width:240px;max-width:85vw;background:var(--surface);border:1px solid var(--line);padding:12px;border-radius:12px;box-shadow:var(--shadow-popover);z-index:20}.account-popover p{font-size:.75rem;color:var(--muted);padding:8px}.account-popover a,.account-popover button{display:flex;align-items:center;gap:8px;width:100%;padding:10px;text-align:start;border-radius:7px;cursor:pointer}.account-popover a:hover,.account-popover button:hover{background:var(--surface-hover)}.mobile-brand,.mobile-nav{display:none}.main-content{width:100%;max-width:1240px;margin-inline:auto;padding:46px 4.5% 60px;flex:1}.main-content:focus{outline:none}.breadcrumbs{color:var(--muted);margin-bottom:25px;padding:0}.workspace-footer{display:flex;justify-content:space-between;gap:20px;margin:0 4.5%;border-top:1px solid var(--line);padding:19px 0;color:var(--muted);font-size:.65rem}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:30px}.page-description{margin-top:12px;font-size:.88rem;max-width:570px}.page-heading>.button,.page-heading>.form-actions{flex-shrink:0}.library-section{margin-top:36px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.section-heading>.muted{font-size:.73rem}.collection-count{display:inline-grid;place-items:center;vertical-align:middle;min-width:24px;height:24px;padding-inline:5px;font-size:.7rem;background:var(--green);color:var(--ink);border-radius:6px;margin-left:7px}.package-grid{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.package-grid>li{min-width:0}.package-card{display:flex;flex-direction:column;height:100%;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:23px;transition:border-color .15s,box-shadow .15s}.package-card:hover{border-color:var(--green-ink);box-shadow:var(--shadow-card)}.package-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:24px}.package-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:11px;flex-shrink:0}.mint{background:var(--green);color:var(--ink)}.sand{background:var(--sand);color:var(--sand-ink)}.sky{background:var(--sky);color:var(--sky-ink)}.package-kind{font-size:.5rem;font-weight:650;color:var(--muted);letter-spacing:.08em}.package-card h3{font-size:1.05rem;line-height:1.4}.package-card>p{color:var(--muted);font-size:.78rem;line-height:1.7;margin:10px 0 25px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.package-card-bottom{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:var(--green-ink);font-size:.74rem;font-weight:600}.add-package-card{display:flex;align-items:center;justify-content:center;text-align:center;flex-direction:column;border:1px dashed var(--line-input);border-radius:12px;background:var(--surface);padding:25px 20px;height:100%;min-height:242px}.add-package-card:hover{background:var(--surface-hover);border-color:var(--green-ink)}.add-circle{display:grid;place-items:center;width:42px;height:42px;background:var(--green);border-radius:50%;color:var(--ink);margin-bottom:17px}.add-package-card h3{font-size:.86rem}.add-package-card p{font-size:.73rem;color:var(--muted);margin-top:7px}.empty-state{border:1px dashed var(--line-input);border-radius:12px;padding:34px 24px;background:var(--surface);text-align:center}.empty-icon{display:inline-grid;place-items:center;width:54px;height:54px;background:var(--green);border-radius:14px;color:var(--ink);margin-bottom:15px}.empty-state p{max-width:440px;margin:12px auto 20px;color:var(--muted);font-size:.86rem}.loading-state{display:flex;align-items:center;gap:12px;padding:45px 20px;color:var(--muted);font-size:.85rem}.skip-link{position:fixed;top:-80px;left:20px;z-index:100;background:var(--surface);padding:12px 20px;border-radius:6px}.skip-link:focus{top:12px}.form-panel{padding:32px;border:1px solid var(--line);border-radius:15px;background:var(--surface);max-width:720px}.form-stack{display:flex;flex-direction:column;gap:23px}.form-field{display:flex;flex-direction:column;gap:8px;font-size:.85rem;font-weight:550}.field-hint{font-size:.75rem;font-weight:400;color:var(--muted)}.field-error{color:var(--danger);font-size:.8rem}.form-actions>.button{white-space:nowrap}.form-actions{display:flex;align-items:center;gap:12px;padding-top:8px;flex-wrap:wrap}.auth-layout{max-width:520px;margin:30px auto}.auth-panel h1{font-size:1.8rem;margin-bottom:9px}.auth-panel .button-primary{width:100%}.auth-switch{margin:24px 0 0;color:var(--muted);font-size:.8rem}.auth-switch a{color:var(--green-ink);text-decoration:underline;text-underline-offset:3px;font-weight:600}.exercise-list{border-radius:12px;border:1px solid var(--line);background:var(--surface);box-shadow:none;overflow:hidden}.exercise-row{display:grid;gap:16px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;padding:22px}.exercise-row>div{min-width:0}.exercise-row a:hover{color:var(--green-ink);text-decoration:underline;text-underline-offset:4px}.exercise-number{font-size:.8rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--muted);background:var(--surface-hover);border:1px solid var(--line);border-radius:10px;min-width:48px;height:38px;padding-inline:8px;display:grid;place-items:center}.exercise-controls{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.exercise-controls .button{font-size:.72rem;padding-inline:10px}.practice-surface{padding:32px;background:var(--surface);border:1px solid var(--line);border-radius:15px;margin-block:24px}.practice-surface :is(h1,h2){font-size:clamp(1.4rem,3vw,2rem);line-height:1.45;white-space:pre-wrap}.exercise-notes{white-space:pre-wrap;margin-top:12px;color:var(--muted)}[data-player]{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;column-gap:16px;padding:16px;border:1px solid var(--line);background:var(--surface);border-radius:12px}.player-toggle{grid-column:1;grid-row:1;width:44px;height:44px;padding:0;border-radius:50%;border-color:var(--green);background:var(--green);color:var(--ink)}.player-toggle:hover{border-color:var(--green-hover);background:var(--green-hover)}[data-player] canvas{width:100%;cursor:pointer;image-rendering:pixelated}.player-time{grid-column:3;grid-row:1;white-space:nowrap;text-align:end;color:var(--muted);font-size:.72rem;font-variant-numeric:tabular-nums}.player-error{grid-column:1 / -1;margin-top:12px;color:var(--danger);font-size:.8rem}.recording-delete{width:44px;height:44px;padding:0}.recording-delete:hover{color:var(--danger)}[data-history] .exercise-row{grid-template-columns:minmax(0,1fr) 44px}[data-history] .exercise-row>[data-player]{grid-column:1;grid-row:2}[data-history] .recording-delete{grid-column:2;grid-row:2}.recorder-settings{min-inline-size:0;border:1px solid var(--line);border-radius:12px;background:var(--surface);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-block:20px 8px;padding:16px}.recorder-settings legend{font-size:.68rem;font-weight:600;color:var(--muted);padding-inline:4px}.recorder-settings .option-label{font-size:.75rem;white-space:normal;gap:8px}.recorder-settings .switch{flex-shrink:0}.record-actions{display:flex;align-items:center;gap:18px;margin-top:24px}.record-actions>.button{min-width:150px}.record-actions>[role=status]{font-size:.82rem;color:var(--muted)}.history-title{font-size:.85rem;font-weight:600;padding:20px 22px}.learning-controls{margin-block:24px;padding:22px 24px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.learning-toolbar{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.learning-toolbar .rating-actions{flex:1;min-width:230px;gap:10px}.learning-summary{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin-inline-start:auto;font-size:.8rem;color:var(--muted)}.learning-summary span{white-space:nowrap}.learning-summary strong{color:var(--ink);font-variant-numeric:tabular-nums;margin-inline-start:4px}.learning-footer{margin-top:8px}.rating-recovery{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:12px;font-size:.8rem;color:var(--muted)}.config-trigger{width:44px;height:44px;padding:0;flex-shrink:0}.config-popup{width:min(460px,calc(100% - 32px));max-height:calc(100svh - 48px);margin:auto;padding:0;overflow-y:auto;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow-dialog)}.config-popup::backdrop{background:var(--dialog-backdrop)}.config-popup-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid var(--line)}.config-popup-content{padding:24px}.config-form{margin-block:24px 16px}.config-feedback{margin-top:16px;font-size:.8rem;color:var(--green-ink)}.main-content:has(.learning-controls){padding-top:16px;padding-bottom:20px}.main-content:has(.learning-controls) .breadcrumbs{margin-bottom:10px}.main-content:has(.learning-controls)>h1,.main-content:has(.learning-controls) .learn-heading h1{font-size:1.65rem;line-height:1.2}.main-content:has(.learning-controls) .practice-surface{margin-block:12px;padding:16px 20px}.main-content:has(.learning-controls) .practice-surface h2{font-size:1.25rem;line-height:1.3}.main-content:has(.learning-controls) .exercise-notes{margin-top:6px;font-size:.82rem}.main-content:has(.learning-controls) .recorder-settings{margin-block:10px 4px;padding:10px 12px;gap:10px}.main-content:has(.learning-controls) .record-actions{margin-top:10px}.main-content:has(.learning-controls) .learning-controls{margin-block:12px;padding:12px 16px 10px}.main-content:has(.learning-controls) .learning-toolbar{gap:14px}.main-content:has(.learning-controls) .learning-footer{margin-top:6px}@media(max-width:680px){.learning-controls{padding:18px 14px 12px}.learning-toolbar{gap:12px}.learning-toolbar .rating-actions{flex-basis:100%;min-width:0}.learning-summary{flex:1;margin:0;justify-content:start;gap:8px 14px}.main-content:has(.learning-controls) .learning-toolbar .rating-actions{flex-basis:auto}.main-content:has(.learning-controls) .learning-controls{padding:10px 12px 8px}.main-content:has(.learning-controls) .learning-toolbar{gap:8px 12px}.config-popup-content{padding:20px}}.account-panel{max-width:650px}.account-detail{padding-block:22px;border-bottom:1px solid var(--line);margin-bottom:24px}.account-detail dt{font-size:.7rem;color:var(--muted);margin-bottom:6px}.home-intro{padding-block:40px}.home-intro h1{font-size:clamp(2.5rem,5vw,4.3rem);line-height:1.08;max-width:700px}.home-intro>p:not(.eyebrow){max-width:510px;color:var(--muted);margin-block:22px}@media(min-width:1550px){.main-content{padding-top:58px}}@media(max-width:1150px){.app-shell{grid-template-columns:200px minmax(0,1fr)}.sidebar{padding-inline:16px}.brand{font-size:1.3rem}.package-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.package-kind{font-size:.55rem}.auth-layout{gap:30px}.guide-steps{gap:15px}}@media(max-width:800px){.app-shell{display:block}.sidebar{display:none}.workspace{min-height:100svh}.topbar{min-height:76px;padding-inline:24px}.mobile-brand{display:inline-flex}.mobile-nav{display:flex;gap:24px;padding:12px 24px;border-bottom:1px solid var(--line);background:var(--surface)}.mobile-nav a{white-space:nowrap;display:flex;align-items:center;gap:7px;padding-block:6px;color:var(--muted);font-size:.8rem}.mobile-nav a[aria-current]{color:var(--green-ink);font-weight:650;box-shadow:inset 0 -2px var(--green-ink)}.main-content{padding:30px 24px 45px}.auth-layout{margin-block:10px}.account-email{display:none}}@media(max-width:560px){.main-content{padding:28px 18px 40px}.topbar{padding-inline:18px}.main-content:has(.learning-controls){padding:18px 18px 20px}.main-content:has(.learning-controls) .practice-surface{padding:14px}.main-content:has(.learning-controls) .recorder-settings{gap:8px;padding:9px}.main-content:has(.learning-controls) .record-actions{margin-top:8px}.mobile-nav{gap:12px;padding-inline:18px}.page-heading{align-items:start;flex-direction:column;gap:18px;margin-bottom:24px}.page-description{font-size:.85rem}.package-grid{grid-template-columns:1fr;gap:14px}.package-card{display:flex;flex-direction:column;padding:22px}.package-card-top{margin-bottom:20px}.add-package-card{min-height:180px}.section-heading{align-items:start;gap:12px}.section-heading>.muted{max-width:105px;text-align:end;font-size:.65rem}.form-panel,.practice-surface{padding:23px 18px}.exercise-row{display:grid;gap:16px;padding:18px 14px;gap:12px}.exercise-row .exercise-controls{grid-column:2 / -1;justify-content:start}.exercise-row [data-player]{padding:10px}[data-history] .exercise-row{gap:8px;grid-template-columns:minmax(0,1fr) 44px}[data-history] .exercise-row [data-player]{column-gap:8px;padding:8px}.recorder-settings{min-inline-size:0;border:1px solid var(--line);border-radius:12px;grid-template-columns:1fr;gap:13px}.recorder-settings .option-label{justify-content:space-between}.record-actions{align-items:start;flex-direction:column;gap:12px}.record-actions>.button{width:100%}.workspace-footer{font-size:.6rem}.home-intro{padding-block:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.publication-panel{margin-block:1.5rem;padding:1.25rem;background:var(--surface);border:1px solid var(--line);border-radius:12px}.publication-panel .button{margin-block-start:.75rem}.discovery-list,.preview-exercises{padding:0;list-style:none}.discovery-list>li,.preview-exercises>li{padding-block:1.5rem;border-block-end:1px solid var(--line)}.discovery-list h2,.preview-exercises h2{overflow-wrap:anywhere;white-space:pre-wrap}.discovery-list .page-description,.preview-exercises .page-description{white-space:pre-wrap;overflow-wrap:anywhere}