:root{--sans:-apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic UI", "Meiryo", system-ui, sans-serif;--mono:ui-monospace, "SF Mono", Consolas, monospace;font-family:var(--sans);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{color:#2d3a5a;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;background:linear-gradient(#eaf1fb 0%,#f7f9fc 100%);margin:0}button{font-family:inherit}.piano-keyboard{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:linear-gradient(#2b3147 0%,#1a1f30 100%);border-radius:12px;width:100%;padding:14px;box-shadow:inset 0 2px 4px #0006,0 4px 16px #00000026}.piano-keyboard__svg{width:100%;height:clamp(110px,18vh,180px);display:block}.piano-keyboard__white{fill:#fafafa;stroke:#555;stroke-width:.4px;transition:fill 80ms ease-out}.piano-keyboard__white.is-active{fill:#ffd95a}.piano-keyboard__white.is-guide{fill:#dff6fc;stroke:#0891b2;stroke-width:1.3px}.piano-keyboard__white.is-correct-flash{fill:#86efac}.piano-keyboard__white.is-wrong-flash{fill:#fca5a5}.piano-keyboard__black{fill:#1d1d1d;stroke:#000;stroke-width:.4px;transition:fill 80ms ease-out}.piano-keyboard__black.is-active{fill:#ff8c42}.piano-keyboard__black.is-guide{fill:#164e63;stroke:#38bdf8;stroke-width:1px}.piano-keyboard__black.is-correct-flash{fill:#22c55e}.piano-keyboard__black.is-wrong-flash{fill:#dc2626}.piano-keyboard--interactive{touch-action:none}.piano-keyboard__key--interactive{-webkit-tap-highlight-color:transparent}.falling-notes-lane{margin-bottom:10px}.falling-notes-lane__toolbar{flex-wrap:wrap;align-items:center;gap:8px 14px;margin-bottom:8px;display:flex}.falling-notes-lane__title{color:#3d4a63;font-size:13px;font-weight:800}.falling-notes-lane__hint{color:#667085;flex:220px;font-size:11px;line-height:1.45}.falling-notes-lane__controls{flex-wrap:wrap;gap:8px;display:flex}.falling-notes-lane__btn{touch-action:manipulation;color:#374151;cursor:pointer;background:#f8fafc;border:1px solid #c5cfe0;border-radius:999px;padding:7px 14px;font-family:inherit;font-size:12px;font-weight:700}.falling-notes-lane__btn:hover{background:#eef2f7}.falling-notes-lane__svg{border-radius:10px;width:100%;height:clamp(200px,28vh,300px);display:block;overflow:hidden;box-shadow:inset 0 0 0 1px #0000000f,0 4px 14px #00000014}.falling-notes-lane__bg{fill:#101520}.falling-notes-lane__grid{stroke:#ffffff0f;stroke-width:1px}.falling-notes-lane__hitline{stroke:#f5d547;stroke-width:2px;opacity:.95;filter:drop-shadow(0 0 4px #f5d54799)}.falling-notes-lane__block{stroke:#00000059;stroke-width:.6px}.falling-notes-lane__block--lane-0{fill:#4ade80;fill-opacity:.92}.falling-notes-lane__block--lane-1{fill:#60a5fa;fill-opacity:.92}.sheet-music-viewer{flex-direction:column;gap:10px;width:100%;display:flex}.sheet-music-viewer__head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;display:flex}.sheet-music-viewer__title{color:#2d3a5a;letter-spacing:.06em;font-size:14px;font-weight:700}.sheet-music-viewer__status{color:#8090ad;font-size:13px}.sheet-music-viewer__error{color:#a82a2a;margin:0;font-size:13px;line-height:1.45}.sheet-music-viewer__host{-webkit-overflow-scrolling:touch;width:100%;min-height:120px;overflow-x:auto}.sheet-music-viewer__host svg{max-width:100%;height:auto;display:block}.piece-catalog{border-bottom:1px dashed #e2e8f3;margin-bottom:14px;padding-bottom:14px}.piece-catalog__head{margin-bottom:12px}.piece-catalog__title{color:#2d4d8a;letter-spacing:.04em;margin:0 0 6px;font-size:15px;font-weight:800}.piece-catalog__note{color:#6a7a9a;margin:0;font-size:12px;line-height:1.55}.piece-catalog__note a{color:#3d6ccf}.piece-catalog__import-row{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:8px;display:flex}.piece-catalog__file-input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.piece-catalog__btn{cursor:pointer;touch-action:manipulation;border:none;border-radius:999px;padding:9px 18px;font-family:inherit;font-size:13px;font-weight:700}.piece-catalog__btn--primary{color:#fff;background:#2d4d8a}.piece-catalog__btn--muted{color:#3d4d68;background:#eef2fb;border:1px solid #d6dfee}.piece-catalog__btn:disabled{opacity:.45;cursor:not-allowed}.piece-catalog__url-wrap{flex-wrap:wrap;flex:1;gap:8px;min-width:min(100%,280px);display:flex}.piece-catalog__url-field{border:1px solid #d6dfee;border-radius:10px;flex:1;min-width:160px;padding:8px 12px;font-family:inherit;font-size:13px}.piece-catalog__url-error{color:#b45309;margin:0 0 10px;font-size:12px;line-height:1.45}.piece-catalog__levels{flex-direction:column;gap:14px;display:flex}.piece-catalog__level-title{color:#568;letter-spacing:.06em;margin:0 0 8px;font-size:12px;font-weight:800}.piece-catalog__chips{flex-wrap:wrap;gap:8px;display:flex}.piece-catalog__chip{cursor:pointer;touch-action:manipulation;text-align:left;background:#fafcff;border:1px solid #dce8fb;border-radius:12px;flex-direction:column;align-items:flex-start;gap:2px;max-width:min(100%,240px);padding:8px 12px;font-family:inherit;display:flex}.piece-catalog__chip:hover{border-color:#b8cce8}.piece-catalog__chip--active{background:linear-gradient(135deg,#eef5ff 0%,#e4ecfc 100%);border-color:#4d7ccf;box-shadow:0 1px 4px #4d7ccf2e}.piece-catalog__chip-title{color:#2d3a5a;font-size:13px;font-weight:700}.piece-catalog__chip-sub{color:#8090ad;font-size:11px;line-height:1.35}.event-log{background:#fff;border:1px solid #e0e6f1;border-radius:12px;flex-direction:column;min-height:0;padding:16px;display:flex}.event-log__header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.event-log__title{color:#2d3a5a;margin:0;font-size:16px;font-weight:600}.event-log__clear{color:#5a6a8a;cursor:pointer;touch-action:manipulation;background:0 0;border:1px solid #cdd5e6;border-radius:8px;padding:4px 12px;font-size:13px}.event-log__clear:disabled{opacity:.4;cursor:not-allowed}.event-log__empty{color:#8090ad;text-align:center;margin:12px 0 0;padding:20px 0;font-size:14px}.event-log__list{flex-direction:column;gap:4px;max-height:280px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.event-log__item{background:#f6f8fc;border-radius:8px;grid-template-columns:44px 24px 52px 56px 1fr auto;align-items:center;gap:8px;padding:6px 10px;font-size:14px;display:grid}.event-log__item--on{background:#fff7e0}.event-log__item--off{color:#99a2b8;background:#f1f3f7}.event-log__src{letter-spacing:.02em;text-align:center;border-radius:6px;align-self:center;padding:2px 6px;font-size:10px;font-weight:700}.event-log__src--midi{color:#176c34;background:#e6f5ea}.event-log__src--touch{color:#2d4d8a;background:#e6eeff}.event-log__type{text-align:center;color:#b07a00;font-size:12px}.event-log__item--off .event-log__type{color:#99a2b8}.event-log__note-ja{color:#2d3a5a;font-size:16px;font-weight:700}.event-log__item--off .event-log__note-ja{color:#99a2b8;font-weight:500}.event-log__note-en{font-family:var(--mono,ui-monospace, Consolas, monospace);color:#5a6a8a;font-size:13px}.event-log__velocity{color:#6a7894;font-size:12px}.event-log__time{font-family:var(--mono,ui-monospace, Consolas, monospace);color:#8090ad;font-size:12px}.practice-tester{grid-template-columns:1fr 1fr;grid-template-areas:"header header""status status""sheet sheet""last keyboard""log log";gap:14px;width:100%;max-width:1200px;margin:0 auto;padding:16px 16px 32px;display:grid}.practice-tester__status-slot{grid-area:status}.practice-tester__sheet-panel{grid-area:sheet;position:relative;overflow:visible}.practice-tester__listen-toolbar{background:linear-gradient(135deg,#fff9ed 0%,#fff4dc 100%);border:1px solid #f0dea8;border-radius:12px;margin-top:12px;padding:12px 14px}.practice-tester__listen-toolbar__title{color:#8a6820;letter-spacing:.06em;margin-bottom:10px;font-size:13px;font-weight:800;display:block}.practice-tester__listen-toolbar__row{flex-wrap:wrap;align-items:center;gap:12px 18px;display:flex}.practice-tester__listen-toolbar__play{color:#3d2f08;cursor:pointer;touch-action:manipulation;background:#ffb020;border:none;border-radius:999px;padding:10px 22px;font-family:inherit;font-size:14px;font-weight:800}.practice-tester__listen-toolbar__play:disabled{opacity:.45;cursor:not-allowed}.practice-tester__listen-toolbar__stop{color:#fff;cursor:pointer;touch-action:manipulation;background:#6b7280;border:none;border-radius:999px;padding:10px 22px;font-family:inherit;font-size:14px;font-weight:700}.practice-tester__listen-toolbar__gain{color:#5c4a28;flex:1;align-items:center;gap:8px;min-width:min(100%,220px);font-size:13px;display:inline-flex}.practice-tester__listen-toolbar__gain input{accent-color:#d49200;flex:1}.practice-tester__listen-toolbar__hint{color:#875;margin:10px 0 0;font-size:12px;line-height:1.5}.practice-tester__tempo-meter{border-top:1px dashed #8a682059;margin-top:14px;padding-top:12px}.practice-tester__tempo-meter__header{flex-wrap:wrap;align-items:baseline;gap:8px 14px;margin-bottom:6px;display:flex}.practice-tester__tempo-meter__label{color:#6b5420;font-size:13px;font-weight:800}.practice-tester__tempo-meter__caption{color:#5c4a28;font-size:13px;font-weight:700}.practice-tester__tempo-meter__caption-muted{color:#986;font-size:11px;font-weight:600}.practice-tester__tempo-meter__scale{height:16px;margin-bottom:2px;position:relative}.practice-tester__tempo-meter__scale-num{color:#986;white-space:nowrap;font-size:10px;font-weight:700;position:absolute;transform:translate(-50%)}.practice-tester__tempo-meter__track{background:linear-gradient(#faf6ef 0%,#e8dfd0 100%);border-radius:10px;height:30px;position:relative;overflow:hidden;box-shadow:inset 0 1px 3px #00000017}.practice-tester__tempo-meter__fill{pointer-events:none;background:linear-gradient(#ffe08a 0%,#f0b030 55%,#e09610 100%);border-radius:10px 0 0 10px;transition:width 80ms ease-out;position:absolute;inset:0 auto 0 0}.practice-tester__tempo-meter__tick{pointer-events:none;background:#5a462838;width:1px;position:absolute;top:0;bottom:0;transform:translate(-50%)}.practice-tester__tempo-meter__range{cursor:pointer;appearance:none;background:0 0;width:100%;height:100%;margin:0;position:absolute;inset:0}.practice-tester__tempo-meter__range:disabled{cursor:not-allowed;opacity:.55}.practice-tester__tempo-meter__range::-webkit-slider-thumb{appearance:none;background:#fffdf8;border:3px solid #d49200;border-radius:50%;width:26px;height:26px;box-shadow:0 2px 8px #0000002e}.practice-tester__tempo-meter__range::-moz-range-thumb{background:#fffdf8;border:3px solid #d49200;border-radius:50%;width:26px;height:26px;box-shadow:0 2px 8px #0000002e}.practice-tester__tempo-meter__range::-webkit-slider-runnable-track{background:0 0;height:30px}.practice-tester__tempo-meter__range::-moz-range-track{background:0 0;height:30px}.practice-tester__tempo-meter__footer{justify-content:flex-end;margin-top:10px;display:flex}.practice-tester__tempo-meter__reset{touch-action:manipulation;color:#5c4a28;cursor:pointer;background:#fffef8;border:1px solid #d4b878;border-radius:999px;padding:8px 14px;font-family:inherit;font-size:12px;font-weight:700}.practice-tester__tempo-meter__reset:hover:not(:disabled){background:#fff7e4}.practice-tester__tempo-meter__reset:disabled{opacity:.45;cursor:not-allowed}.practice-tester__ease-toolbar{background:#fafcff;border:1px solid #e6eefc;border-radius:12px;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:12px;padding:10px 12px;display:flex}.practice-tester__ease-toolbar__slider-label{flex:1;gap:6px;min-width:min(100%,240px);display:grid}.practice-tester__ease-toolbar__label-text{color:#6a7a9a;letter-spacing:.06em;font-size:12px;font-weight:700}.practice-tester__ease-toolbar__range{accent-color:#4d7ccf;width:100%}.practice-tester__ease-toolbar__hint{color:#8090ad;font-size:12px}.practice-tester__ease-toolbar__sound{color:#4a5a78;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;font-size:13px;font-weight:600;display:inline-flex}.practice-tester__ease-toolbar__sound input{accent-color:#4d7ccf;width:18px;height:18px}.practice-tester__star-burst{pointer-events:none;z-index:4;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;inset:52px 0 0}.practice-tester__star-burst__star{color:#ffb800;text-shadow:0 2px 8px #ffb80073;opacity:0;font-size:clamp(28px,8vw,44px);line-height:1;animation:.9s cubic-bezier(.34,1.56,.64,1) forwards practice-star-pop}.practice-tester__star-burst__star:first-child{animation-delay:0s}.practice-tester__star-burst__star:nth-child(2){animation-delay:70ms}.practice-tester__star-burst__star:nth-child(3){animation-delay:.14s}.practice-tester__star-burst__star:nth-child(4){animation-delay:.21s}.practice-tester__star-burst__star:nth-child(5){animation-delay:.28s}@keyframes practice-star-pop{0%{opacity:0;transform:scale(.2)rotate(-28deg)}35%{opacity:1;transform:scale(1.05)rotate(8deg)}to{opacity:0;transform:scale(1.2)translateY(-28px)rotate(18deg)}}.practice-tester__score-wrap{margin-top:10px;position:relative}.practice-tester__score-wrap .practice-tester__score-strip{margin-top:0}.practice-tester__sparkles{pointer-events:none;z-index:2;gap:6px;display:flex;position:absolute;top:6px;right:10px}.practice-tester__sparkles__s{color:#ffb800;opacity:0;font-size:14px;animation:.65s ease-out forwards practice-sparkle-fade}.practice-tester__sparkles__s:nth-child(2){animation-delay:40ms}.practice-tester__sparkles__s:nth-child(3){animation-delay:80ms}@keyframes practice-sparkle-fade{0%{opacity:0;transform:translateY(6px)scale(.6)}40%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-16px)scale(.9)}}.practice-tester__follow-panel{border-top:1px dashed #e2e8f3;flex-direction:column;gap:10px;margin-top:14px;padding-top:12px;display:flex}.practice-tester__follow-msg{color:#4a5a78;margin:0;font-size:14px;line-height:1.55}.practice-tester__follow-msg--neutral{color:#5a6a8a}.practice-tester__follow-msg--perfect{color:#0d5c28;font-weight:800}.practice-tester__follow-msg--good{color:#176c34;font-weight:700}.practice-tester__follow-msg--miss{color:#a84a00;font-weight:600}.practice-tester__follow-msg--cleared{color:#155fb8;font-weight:800}.practice-tester__follow-msg--almost{color:#6b5b00;font-weight:700}.practice-tester__score-strip{background:linear-gradient(135deg,#f6f9ff 0%,#eef5ff 100%);border:1px solid #dce8fb;border-radius:12px;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:12px;padding:10px 12px;display:flex}.practice-tester__score-strip__chip{color:#4a5a78;font-size:13px}.practice-tester__score-strip__chip strong{color:#2d4d8a;font-weight:800}.practice-tester__score-strip__chip--wide{flex-basis:100%}.practice-tester__score-strip__hint{color:#8090ad;font-size:13px}.practice-tester__follow-reset{color:#2d4d8a;cursor:pointer;touch-action:manipulation;background:#f0f4fb;border:1px solid #d6dfee;border-radius:999px;align-self:flex-start;padding:8px 16px;font-family:inherit;font-size:13px;font-weight:600}.practice-tester__follow-reset:active{background:#e2eafc}.practice-tester__keyboard-panel{grid-area:keyboard;justify-content:center;gap:10px}.practice-tester__falling-toggle{color:#455065;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:10px;margin:4px 0 2px;font-size:13px;font-weight:600;display:flex}.practice-tester__falling-toggle input{accent-color:#5b8fd8;cursor:pointer;width:18px;height:18px}.practice-tester__keyboard-label{margin-bottom:0}.practice-tester__header{text-align:center;grid-area:header}.practice-tester__title{color:#2d3a5a;letter-spacing:.04em;margin:0;font-size:clamp(24px,4vw,36px)}.practice-tester__subtitle{color:#8090ad;margin:4px 0 0;font-size:13px}.practice-tester__panel{background:#fff;border-radius:16px;flex-direction:column;padding:16px;display:flex;box-shadow:0 2px 8px #2d3a5a0f}.practice-tester__last-note{text-align:center;grid-area:last;justify-content:center;align-items:center;min-height:180px}.practice-tester__panel-label{color:#8090ad;letter-spacing:.08em;font-size:13px}.practice-tester__big-note{flex-direction:column;align-items:center;gap:4px;margin-top:8px;display:flex}.practice-tester__big-note-ja{color:#f08a3e;font-size:clamp(64px,12vw,110px);font-weight:800;line-height:1}.practice-tester__big-note-en{font-family:var(--mono,ui-monospace, Consolas, monospace);color:#5a6a8a;letter-spacing:.05em;font-size:clamp(16px,2.4vw,22px)}.practice-tester__big-note--empty .practice-tester__big-note-ja{color:#cfd6e6}.practice-tester__log-panel{box-shadow:none;background:0 0;grid-area:log;padding:0}.practice-tester__status-slot .status-card{width:100%}@media (width<=720px){.practice-tester{grid-template-columns:1fr;grid-template-areas:"header""status""sheet""last""keyboard""log"}}.status-card__devices{border-top:1px dashed #e2e8f3;flex-direction:column;gap:4px;margin:6px 0 0;padding:6px 0 0;list-style:none;display:flex}.status-card__device{color:#2d3a5a;align-items:center;gap:8px;font-size:13px;display:flex}.status-card__device-dot{background:#5fcf80;border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 3px #5fcf802e}.status-card__device-name{font-weight:600}.status-card__device-mfr{color:#8090ad;font-size:12px}.status-card{background:#fff;border-radius:16px;flex-direction:column;gap:8px;padding:14px 18px;display:flex;box-shadow:0 2px 8px #2d3a5a0f}.status-card__row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.status-card__badge{letter-spacing:.04em;border-radius:999px;padding:4px 14px;font-size:14px;font-weight:700;display:inline-block}.status-card__badge--enabling{color:#b07a00;background:#fff4d6}.status-card__badge--ok{color:#176c34;background:#d6f5dd}.status-card__badge--waiting{color:#2d4d8a;background:#e2ecff}.status-card__badge--ng{color:#a82a2a;background:#ffe1e1}.status-card__retry{color:#fff;cursor:pointer;touch-action:manipulation;background:#2d4d8a;border:none;border-radius:999px;padding:8px 18px;font-size:14px;font-weight:600}.status-card__message{color:#4a5a78;margin:0;font-size:14px;line-height:1.5}
