.logo{color:var(--ink);align-items:center;gap:10px;text-decoration:none;display:inline-flex}.logo--dark{color:var(--white)}.logo__mark{background:var(--sun);border:var(--border);border-radius:10px;flex:none;gap:3px;width:36px;height:36px;padding:5px 5px 0;display:flex;transform:rotate(-6deg)}.logo--dark .logo__mark{border-color:var(--white)}.logo__mark span{background:var(--ink);border-radius:0 0 3px 3px;flex:1;height:15px}.logo__word{font-family:var(--font-display);letter-spacing:-.03em;font-size:24px;font-weight:800}.logo__word em{color:var(--tomato);font-style:normal}.logo--dark .logo__word em{color:var(--sun)}.hl{border-radius:.14em;padding:0 .12em;display:inline-block;transform:rotate(-2deg)}.hl--gum{background:var(--gum)}.hl--sun{background:var(--sun)}.btn{border:var(--border);background:var(--sun);min-height:48px;color:var(--ink);cursor:pointer;box-shadow:4px 4px 0 var(--ink);border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 22px;font-size:16px;font-weight:700;text-decoration:none;display:inline-flex}.btn:hover{box-shadow:5px 5px 0 var(--ink);transform:translate(-1px,-1px)}.btn:active{box-shadow:2px 2px 0 var(--ink);transform:translate(2px,2px)}.btn:disabled{opacity:.6;cursor:default;box-shadow:4px 4px 0 var(--ink);transform:none}.btn--ghost{background:var(--white)}.btn--big{min-height:62px;font-family:var(--font-display);box-shadow:6px 6px 0 var(--ink);font-size:21px;font-weight:800}.btn--small{min-height:44px;box-shadow:3px 3px 0 var(--white);border-color:var(--white);width:100%;padding:0 14px;font-size:14px}.btn--rec{background:var(--white)}.btn--rec.is-on{background:var(--tomato)}.rec-dot{background:var(--ink);border-radius:50%;width:12px;height:12px;animation:1s infinite blink}@keyframes blink{50%{opacity:.2}}.link{color:var(--ink);font-weight:700}.muted{color:var(--muted)}.small{font-size:13px;line-height:1.45}.chip{font-family:var(--font-mono);background:var(--ink);color:var(--white);vertical-align:middle;border-radius:6px;padding:4px 7px;font-size:11px;font-weight:700;line-height:1;display:inline-block}.chip--audio{background:var(--mint);color:var(--ink)}.chip--midi{background:var(--sky);color:var(--ink)}.chip--demo{background:var(--sun);color:var(--ink)}.icon-btn{width:44px;height:44px;color:var(--ink);cursor:pointer;background:0 0;border:2px solid #0000;border-radius:12px;flex:none;justify-content:center;align-items:center;display:inline-flex}.icon-btn:hover{border-color:var(--ink)}.icon-btn--dark{color:var(--white);border-color:var(--line-dark)}.icon-btn--dark:hover{border-color:var(--white)}.icon-btn.is-loop{border-color:var(--mint);color:var(--mint);background:#3ddc9726}.center-msg{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:100dvh;padding:24px;font-size:18px;display:flex}.lib{flex-direction:column;min-height:100dvh;display:flex}.lib__bar{justify-content:space-between;align-items:center;gap:12px;padding:18px clamp(16px,4vw,48px);display:flex}.lib__main{flex-direction:column;flex:1;gap:48px;width:100%;max-width:1180px;margin:0 auto;padding:8px clamp(16px,4vw,48px) 48px;display:flex}.lib__hero{flex-direction:column;align-items:flex-start;gap:22px;display:flex}.lib__hero h1{font-family:var(--font-display);letter-spacing:-.045em;max-width:900px;margin:12px 0 0;font-size:clamp(40px,6.4vw,76px);font-weight:800;line-height:.96}.drop{border:3px dashed var(--ink);background:var(--white);width:100%;max-width:760px;box-shadow:8px 8px 0 var(--gum);cursor:pointer;border-radius:26px;align-items:center;gap:18px;padding:22px;display:flex;position:relative}.drop.is-drag{box-shadow:8px 8px 0 var(--mint);background:#fff6d9}.drop:focus-within{outline:3px solid var(--sky);outline-offset:4px}.drop__icon{background:var(--tomato);border:var(--border);border-radius:18px;flex:none;justify-content:center;align-items:center;width:60px;height:60px;display:flex}.drop__text{flex-direction:column;gap:4px;display:flex}.drop__text strong{font-family:var(--font-display);letter-spacing:-.02em;font-size:clamp(22px,3vw,28px);font-weight:800}.drop__text span{color:var(--muted);font-size:15px}.lib__or{flex-wrap:wrap;gap:12px;display:flex}.lib__error{border:var(--border);background:#ffe1da;border-radius:14px;max-width:760px;margin:0;padding:12px 16px;font-weight:600}.lib__section h2{font-family:var(--font-display);letter-spacing:-.03em;margin:0 0 18px;font-size:32px;font-weight:800}.cards{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;display:grid}.card{border:var(--border);border-radius:var(--radius);box-shadow:var(--shadow);color:var(--ink);flex-direction:column;align-items:flex-start;gap:8px;min-height:150px;padding:22px;text-decoration:none;display:flex}.card strong{font-family:var(--font-display);letter-spacing:-.02em;font-size:24px;font-weight:800;line-height:1.05}.card:nth-child(odd){transform:rotate(-1deg)}.card:nth-child(2n){transform:rotate(.8deg)}.card:hover{box-shadow:8px 8px 0 var(--ink);transform:rotate(0)translate(-2px,-2px)}.songs{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.song{background:var(--white);border:var(--border);box-shadow:4px 4px 0 var(--ink);border-radius:18px;align-items:center;gap:8px;padding:6px 8px 6px 6px;display:flex}.song__main{min-width:0;color:var(--ink);border-radius:12px;flex:1;align-items:center;gap:12px;padding:10px 12px;text-decoration:none;display:flex}.song__main strong{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:17px;overflow:hidden}.song__main:hover{background:var(--ground)}.lib__foot{border-top:3px solid var(--ink);background:var(--ink);color:var(--muted-dark);flex-wrap:wrap;justify-content:space-between;gap:12px;padding:22px clamp(16px,4vw,48px);font-size:14px;display:flex}.lib__foot a{color:var(--white)}.conv{flex-direction:column;gap:24px;min-height:100dvh;padding:18px clamp(16px,4vw,48px) 40px;display:flex}.conv__bar{justify-content:space-between;align-items:center;display:flex}.conv__body{flex-wrap:wrap;align-items:flex-start;gap:32px;display:flex}.conv__left{flex-direction:column;flex:1.25 520px;gap:22px;min-width:0;display:flex}.conv__left h1{font-family:var(--font-display);letter-spacing:-.045em;margin:0;font-size:clamp(40px,5.4vw,64px);font-weight:800;line-height:.95}.filecard{background:var(--white);border:var(--border);box-shadow:8px 8px 0 var(--ink);border-radius:24px;flex-direction:column;gap:16px;padding:20px;display:flex}.filecard__head{align-items:center;gap:14px;min-width:0;display:flex}.filecard__head>div{flex-direction:column;gap:2px;min-width:0;display:flex}.filecard__head strong{text-overflow:ellipsis;white-space:nowrap;font-size:18px;overflow:hidden}.filecard__icon{background:var(--sun);border:var(--border);border-radius:14px;flex:none;justify-content:center;align-items:center;width:48px;height:48px;font-size:22px;font-weight:700;display:flex}.wave{background:var(--ink);border-radius:16px;align-items:center;gap:3px;height:140px;padding:0 14px;display:flex}.wave span{border-radius:3px;flex:1;transition:opacity .3s}.steps{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.step{border:var(--border);background:var(--white);border-radius:18px;flex-direction:column;gap:8px;min-height:112px;padding:14px;display:flex}.step strong{font-size:15px;line-height:1.25}.step .mono{color:var(--muted);font-size:12px}.step__dot{border:var(--border);width:32px;height:32px;font-family:var(--font-mono);background:var(--white);border-radius:50%;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}.step--done{background:var(--mint)}.step--active{background:var(--sun)}.step--active .step__dot{background:var(--ink);color:var(--white);animation:1.2s infinite pulse}.step--error{background:#ffe1da}@keyframes pulse{50%{transform:scale(1.12)}}.conv__right{background:var(--white);border:var(--border);min-width:0;box-shadow:10px 10px 0 var(--sky);border-radius:28px;flex-direction:column;flex:380px;gap:22px;padding:26px;display:flex}.field{border:0;flex-direction:column;gap:10px;min-width:0;margin:0;padding:0;display:flex}.field:disabled{opacity:.55}.field legend{font-family:var(--font-display);letter-spacing:-.02em;margin-bottom:10px;padding:0;font-size:24px;font-weight:800}.field p{margin:0}.levels{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.level{border:var(--border);cursor:pointer;background:var(--white);border-radius:16px;flex-direction:column;gap:8px;padding:12px;display:flex}.level.is-on{background:var(--gum);box-shadow:4px 4px 0 var(--ink)}.level__head{align-items:center;gap:8px;font-weight:800;display:flex}.level__head input{width:18px;height:18px;accent-color:var(--ink);margin:0}.level__bars{background:var(--ink);border-radius:10px;align-items:flex-end;gap:3px;height:50px;padding:0 6px 6px;display:flex}.level__bars span{background:var(--sun);border-radius:3px;flex:1}.level__d{font-size:13px;line-height:1.35}.slider{grid-template-columns:auto 1fr auto;align-items:center;gap:10px;font-size:13px;font-weight:700;display:grid}.slider input{width:100%;accent-color:var(--ink)}@media (max-width:520px){.levels,.slider{grid-template-columns:1fr}}.prac{background:var(--stage);height:100dvh;color:var(--white);flex-direction:column;display:flex;overflow:hidden}.prac__bar{background:var(--ink);border-bottom:3px solid var(--white);flex-wrap:wrap;flex:none;align-items:center;gap:10px 14px;padding:10px 14px;display:flex}.prac__title{flex-direction:column;gap:3px;min-width:0;max-width:240px;display:flex}.prac__title strong{font-family:var(--font-display);letter-spacing:-.02em;white-space:nowrap;text-overflow:ellipsis;font-size:19px;font-weight:800;overflow:hidden}.prac__title>span{color:var(--muted-dark);white-space:nowrap;align-items:center;gap:6px;font-size:13px;display:flex}.prac__transport{align-items:center;gap:8px;display:flex}.play-btn{border:3px solid var(--white);background:var(--sun);width:52px;height:52px;color:var(--ink);box-shadow:3px 3px 0 var(--tomato);cursor:pointer;border-radius:50%;flex:none;justify-content:center;align-items:center;display:flex}.play-btn:active{box-shadow:1px 1px 0 var(--tomato);transform:translate(2px,2px)}.prac__progress{flex-direction:column;flex:200px;gap:4px;min-width:160px;display:flex}.prac__progress input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:22px;margin:0}.prac__progress input[type=range]::-webkit-slider-runnable-track{border:2px solid var(--line-dark);background:linear-gradient(90deg, var(--sun) var(--pct), var(--stage-2) var(--pct));border-radius:6px;height:12px}.prac__progress input[type=range]::-moz-range-track{border:2px solid var(--line-dark);background:linear-gradient(90deg, var(--sun) var(--pct), var(--stage-2) var(--pct));border-radius:6px;height:8px}.prac__progress input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--white);border:3px solid var(--ink);border-radius:50%;width:20px;height:20px;margin-top:-6px}.prac__progress input[type=range]::-moz-range-thumb{background:var(--white);border:3px solid var(--ink);border-radius:50%;width:16px;height:16px}.prac__times{color:var(--muted-dark);justify-content:space-between;gap:8px;font-size:12px;display:flex}.loop-label{color:var(--mint);text-align:center}.prac__controls{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.stepper{border:2px solid var(--line-dark);border-radius:12px;align-items:center;gap:2px;padding:3px;display:flex}.stepper button{background:var(--stage-2);width:36px;height:36px;color:var(--white);cursor:pointer;border:0;border-radius:8px;font-size:18px;font-weight:700}.stepper .mono{text-align:center;min-width:50px;font-size:14px;font-weight:700}.stepper--sm .mono{min-width:36px}.seg{border:2px solid var(--line-dark);border-radius:12px;gap:3px;padding:3px;display:flex}.seg button{min-width:40px;min-height:36px;color:var(--muted-dark);cursor:pointer;background:0 0;border:2px solid #0000;border-radius:8px;justify-content:center;align-items:center;padding:0 11px;font-size:14px;font-weight:700;display:inline-flex}.seg button.is-on{background:var(--gum);color:var(--ink);border-color:var(--ink)}.hand{border:2px solid var(--white);width:20px;height:20px;font-family:var(--font-mono);color:var(--ink);border-radius:5px;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:inline-flex}.hand--L{background:var(--left)}.hand--R{background:var(--right)}.toggle{border:2px solid var(--line-dark);min-height:44px;color:var(--white);cursor:pointer;background:0 0;border-radius:12px;align-items:center;gap:8px;padding:0 12px;font-size:14px;font-weight:700;display:inline-flex}.toggle__dot{background:var(--line-dark);border-radius:50%;width:10px;height:10px}.toggle.is-on{border-color:var(--mint);background:#3ddc9726}.toggle.is-on .toggle__dot{background:var(--mint)}.prac__stage{flex:1;min-height:0;position:relative}.prac__canvas{touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;inset:0}.prompter{pointer-events:none;white-space:nowrap;align-items:center;gap:12px;display:flex;position:absolute;top:14px;left:50%;transform:translate(-50%)}.prompter__cur{font-family:var(--font-display);color:var(--ink);background:var(--sun);border:3px solid var(--white);box-shadow:4px 4px 0 var(--tomato);border-radius:14px;padding:0 16px;font-size:clamp(26px,4vw,40px);font-weight:800;transform:rotate(-2deg)}.prompter__side{font-family:var(--font-display);color:var(--faint-dark);font-size:clamp(15px,2vw,21px);font-weight:700}.prompter__next{color:var(--muted-dark)}.waiting-pill,.midi-pill,.loading-pill{font-family:var(--font-mono);pointer-events:none;border-radius:8px;padding:5px 9px;font-size:12px;font-weight:700;position:absolute;left:14px}.waiting-pill{background:var(--sun);color:var(--ink);animation:1.2s infinite pulse;top:64px}.midi-pill{background:var(--mint);color:var(--ink);top:14px}.loading-pill{background:var(--ink);color:var(--white);border:3px solid var(--white);box-shadow:6px 6px 0 var(--sky);text-align:center;flex-direction:column;gap:10px;min-width:260px;padding:14px 18px;font-size:14px;display:flex;top:40%;left:50%;transform:translate(-50%,-50%)}.loading-pill__bar{background:var(--stage-2);border-radius:6px;height:10px;overflow:hidden}.loading-pill__bar span{background:var(--sun);height:100%;display:block}.loading-pill--err{box-shadow:6px 6px 0 var(--tomato);pointer-events:auto}.panel{background:var(--ink);border:3px solid var(--white);width:min(300px,100% - 28px);max-height:calc(100% - 28px);box-shadow:6px 6px 0 var(--sky);z-index:2;border-radius:18px;flex-direction:column;gap:8px;padding:14px 16px;display:flex;position:absolute;top:14px;right:14px;overflow-y:auto}.panel__title{font-family:var(--font-mono);color:var(--muted-dark);margin-top:6px;font-size:11px;font-weight:700}.panel .row{justify-content:space-between;align-items:center;gap:10px;min-height:40px;font-size:15px;font-weight:700;display:flex}.panel .row input[type=checkbox]{width:22px;height:22px;accent-color:var(--mint);margin:0}.panel .row input[type=range]{width:120px;accent-color:var(--sun)}.row__btns{gap:6px;display:flex}.mini{border:2px solid var(--line-dark);width:38px;height:34px;color:var(--faint-dark);cursor:pointer;background:0 0;border-radius:9px;justify-content:center;align-items:center;display:flex}.mini.is-on{background:var(--sun);border-color:var(--sun);color:var(--ink)}.mini--hear.is-on{background:var(--mint);border-color:var(--mint)}.legend{color:var(--muted-dark);border-top:2px solid var(--stage-2);align-items:center;gap:6px;padding-top:8px;font-size:13px;display:flex}.muted-dark{color:var(--muted-dark);margin:0}.rotate-hint{display:none}@media (orientation:portrait) and (max-width:600px){.rotate-hint{background:var(--sun);color:var(--ink);border:2px solid var(--ink);pointer-events:none;white-space:nowrap;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;animation:6s forwards fadeout;display:block;position:absolute;bottom:34%;left:50%;transform:translate(-50%)}}@keyframes fadeout{0%,80%{opacity:1}to{opacity:0}}@media (max-height:500px),(max-width:760px){.prac__bar{gap:6px 8px;padding:6px 10px}.prac__title{max-width:150px}.prac__title>span{display:none}.play-btn{width:44px;height:44px}.prac__progress{flex-basis:100%;order:10}.prac__times{display:none}.seg button{min-width:36px;padding:0 8px;font-size:13px}.toggle{padding:0 9px;font-size:13px}}@media (max-height:500px){.prac__progress{flex-basis:120px;order:0}}.btn--sm{min-height:44px;box-shadow:3px 3px 0 var(--ink);padding:0 16px;font-size:14px}.link-btn{cursor:pointer;color:var(--ink);background:0 0;border:0;align-self:flex-start;padding:4px 0;font-weight:700;text-decoration:underline}.lib__note{border:var(--border);background:#ddf8ec;border-radius:14px;max-width:760px;margin:0;padding:10px 14px;font-weight:600}.linkbox{flex-direction:column;gap:8px;width:100%;max-width:760px;display:flex}.linkbox__label{font-size:15px;font-weight:700}.linkbox__row{gap:10px;display:flex}.linkbox__row input{border:var(--border);background:var(--white);border-radius:14px;flex:1;min-width:0;height:52px;padding:0 16px;font-size:16px}.linkbox__row .btn{min-height:52px}.card__stat{font-family:var(--font-mono);background:#15112e1f;border-radius:6px;margin-top:auto;padding:3px 7px;font-size:12px;font-weight:700}.song__text{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.song__text strong{text-overflow:ellipsis;white-space:nowrap;font-size:17px;overflow:hidden}.backup{flex-wrap:wrap;gap:12px;margin-top:20px;display:flex}.backup label{cursor:pointer}.stepnav{gap:4px;display:inline-flex}.score-pill{font-family:var(--font-mono);background:var(--mint);color:var(--ink);pointer-events:none;border-radius:8px;padding:5px 9px;font-size:12px;font-weight:700;position:absolute;top:96px;left:14px}@media (max-height:500px),(max-width:760px){.stepnav{display:none}}.choice{border:var(--border);cursor:pointer;background:var(--white);border-radius:16px;align-items:flex-start;gap:12px;padding:14px;display:flex}.choice.is-on{box-shadow:4px 4px 0 var(--ink);background:#ffe9f5}.choice input{width:20px;height:20px;accent-color:var(--ink);flex:none;margin:2px 0 0}.choice>span{flex-direction:column;gap:4px;display:flex}.stems{flex-wrap:wrap;gap:8px;display:flex}.stem{border:var(--border);background:var(--white);cursor:pointer;border-radius:999px;min-height:44px;padding:0 16px;font-weight:700}.stem.is-on{background:var(--sun);box-shadow:3px 3px 0 var(--ink)}.warn{border:2px solid var(--ink);background:#fff1c9;border-radius:12px;margin:0;padding:10px 12px}.howto{counter-reset:how;flex-direction:column;gap:18px;margin:0;padding:0;list-style:none;display:flex}.howto li{counter-increment:how;flex-direction:column;align-items:flex-start;gap:8px;padding-left:44px;display:flex;position:relative}.howto li:before{content:counter(how);border:var(--border);background:var(--sun);width:32px;height:32px;font-family:var(--font-mono);border-radius:50%;justify-content:center;align-items:center;font-size:14px;font-weight:700;display:flex;position:absolute;top:-2px;left:0}.howto strong{font-size:18px}.capture__thumb{object-fit:cover;border:var(--border);border-radius:10px;flex:none;width:72px;height:54px}.capture__live{align-items:center;gap:12px;font-weight:700;display:flex}.capture__meter{background:var(--ground);border:2px solid var(--ink);border-radius:6px;flex:1;height:12px;overflow:hidden}.capture__meter span{background:var(--mint);height:100%;transition:width 80ms;display:block}@media (max-width:520px){.linkbox__row{flex-direction:column}}.embed{border:var(--border);width:100%;box-shadow:8px 8px 0 var(--ink);background:var(--ink);border-radius:22px;overflow:hidden}.embed--youtube{aspect-ratio:16/9}.embed--soundcloud{background:var(--white);height:320px}.embed--spotify{height:352px}.embed iframe{border:0;width:100%;height:100%;display:block}.seg--light{border-color:var(--ink);align-self:flex-start}.seg--light button{color:var(--ink)}.seg--light button.is-on{background:var(--sun)}.seg--light button:disabled{opacity:.5;cursor:default}.share{border:var(--border);box-shadow:10px 10px 0 var(--sky);width:min(620px,100vw - 32px);color:var(--ink);background:var(--white);border-radius:24px;padding:22px}.share::backdrop{background:#15112e99}.share__head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.share__head h2{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:26px;font-weight:800}.share__body{flex-wrap:wrap;align-items:flex-start;gap:20px;display:flex}.qr{border:var(--border);border-radius:14px;flex:none;width:200px;height:200px}.share__side{flex-direction:column;flex:240px;gap:12px;min-width:0;display:flex}.share__side p{margin:0}.share__url{border:var(--border);width:100%;height:46px;font-family:var(--font-mono);background:var(--ground);border-radius:12px;padding:0 12px;font-size:13px}.share__btns{flex-wrap:wrap;gap:10px;display:flex}.ios-hint{background:var(--white);border:2px solid var(--ink);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600}@media (max-width:520px){.ios-hint{display:none}}
