:root{--bg: #14141a;--surface: #1e1e26;--surface-2: #272731;--line: #35353f;--text: #eceaf0;--muted: #9a97a8;--accent: #7fb2ff;--error: #ff6b6b;--ok: #6bd68a;--tap: 48px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,Noto Sans JP,sans-serif;font-size:16px;line-height:1.6;overscroll-behavior:none}button{font:inherit;color:inherit;border:none;background:none;cursor:pointer}.screen{max-width:900px;margin:0 auto;padding:16px 16px calc(24px + env(safe-area-inset-bottom))}.muted{color:var(--muted)}.home-header h1{font-size:22px;margin:8px 0 4px}.home-header p{margin:0 0 20px;font-size:14px}.module-list,.level-list{list-style:none;margin:0;padding:0}.module-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:12px}.module-head{display:flex;align-items:center;gap:14px;width:100%;min-height:72px;padding:14px 16px;text-align:left}.module-head:disabled{opacity:.5}.module-icon{font-size:28px;line-height:1}.module-text{display:flex;flex-direction:column;flex:1;min-width:0}.module-title{font-size:17px;font-weight:600}.module-desc{font-size:13px;color:var(--muted)}.chevron{color:var(--muted);font-size:12px}.badge{font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 10px}.level-list{border-top:1px solid var(--line)}.level-item{display:flex;align-items:center;gap:12px;width:100%;min-height:var(--tap);padding:12px 16px;text-align:left;border-bottom:1px solid var(--line)}.level-list li:last-child .level-item{border-bottom:none}.level-item:active{background:var(--surface-2)}.level-no{flex:0 0 auto;font-size:13px;font-weight:700;color:var(--accent);width:34px}.level-text{display:flex;flex-direction:column;flex:1;min-width:0}.level-title{font-size:15px}.level-desc{font-size:12px;color:var(--muted)}.level-best{flex:0 0 auto;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}.screen-header{display:flex;align-items:center;gap:8px;margin-bottom:16px}.screen-header h2{font-size:17px;margin:0;font-weight:600}.btn-back{flex:0 0 auto;width:var(--tap);height:var(--tap);border-radius:12px;background:var(--surface);border:1px solid var(--line);font-size:20px}.btn-back:active{background:var(--surface-2)}.placeholder{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px}.placeholder p{margin:0 0 8px}.screen-fill{display:flex;flex-direction:column;min-height:100%}.header-text{min-width:0}.small{font-size:12px}.header-text h2{font-size:16px;margin:0}.header-text p{margin:0}.staff-wrap{position:relative;margin-bottom:10px;overflow:visible}.staff{background:#f7f6f4;border-radius:12px;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.staff svg{display:block}.ghost-note{position:absolute;width:22px;height:16px;margin:-8px 0 0 -11px;border:2px solid var(--accent);border-radius:50%;background:#7fb2ff59;pointer-events:none}.ghost-voice{display:inline-block;margin-right:6px;padding:1px 6px;border-radius:6px;background:var(--accent);color:#10131a;font-size:12px}.ghost-label{position:absolute;z-index:5;transform:translate(-50%);padding:6px 12px;border-radius:999px;background:#14141a;color:#fff;font-size:15px;font-weight:600;white-space:nowrap;pointer-events:none;box-shadow:0 4px 14px #0006}.hint{margin:0 0 10px;text-align:center}.pager{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:8px;font-variant-numeric:tabular-nums;color:var(--muted)}.pager button{width:var(--tap);height:var(--tap);border-radius:12px;background:var(--surface);border:1px solid var(--line);font-size:16px}.pager button:disabled{opacity:.35}.toolbar{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:10px}.voice-tabs{display:flex;gap:8px;flex:1 1 100%;min-width:0}@media(min-width:620px){.toolbar{flex-wrap:nowrap;gap:12px}.voice-tabs{flex:1 1 auto;max-width:340px}}.voice-tab{flex:1;min-width:0;min-height:56px;border-radius:14px;background:var(--surface);border:1px solid var(--line);font-size:18px;font-weight:700;color:var(--muted)}.voice-tab.is-auto{flex:1.6;font-size:15px;white-space:nowrap}.voice-tab.is-active{background:var(--accent);border-color:var(--accent);color:#10131a}.tool-buttons{display:flex;gap:8px;flex:1 1 100%}@media(min-width:620px){.tool-buttons{flex:0 0 auto}}.tool{flex:1;min-width:52px;height:56px;padding:0 6px;border-radius:14px;background:var(--surface);border:1px solid var(--line);font-size:20px}@media(min-width:620px){.tool{flex:0 0 auto}}.tool:disabled{opacity:.3}.tool{line-height:1}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:flex-end;z-index:20}.sheet{width:100%;background:var(--surface);border-radius:18px 18px 0 0;padding:16px 16px calc(20px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}.sheet-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;font-weight:600}.sheet-close{width:40px;height:40px;border-radius:10px;color:var(--muted);font-size:16px}.sheet-empty{margin:0 0 8px}.alter-row{display:flex;gap:8px;margin-bottom:14px}.alter-btn{flex:1;min-height:64px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line)}.alter-symbol{font-size:22px;line-height:1}.alter-label{font-size:11px;color:var(--muted)}.sheet-danger{width:100%;min-height:52px;border-radius:14px;background:#ff6b6b24;border:1px solid rgba(255,107,107,.4);color:var(--error);font-weight:600}.result{background:var(--surface);border:1px solid var(--line);border-radius:14px;margin-bottom:10px;overflow:hidden}.result-head{display:flex;align-items:center;gap:12px;padding:12px 14px}.score{display:flex;align-items:baseline;gap:2px}.score-value{font-size:30px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1}.score-unit{font-size:13px;color:var(--muted)}.score-progress{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--muted);line-height:1}.result-comment{flex:1;margin:0}.btn-retry{flex:0 0 auto;min-height:40px;padding:0 18px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);font-size:14px}.violation-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);max-height:42vh;overflow-y:auto}.violation{display:flex;align-items:flex-start;gap:10px;width:100%;padding:11px 14px;text-align:left;border-bottom:1px solid var(--line)}.violation-list li:last-child .violation{border-bottom:none}.violation.is-selected{background:#e0521f24}.violation-mark{flex:0 0 auto;width:20px;height:20px;margin-top:2px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#14141a}.sev-error .violation-mark{background:#d23c3c;color:#fff}.sev-warning .violation-mark{background:#c98a1e}.violation-body{display:flex;flex-direction:column;min-width:0}.violation-message{font-size:14px}.violation-meta{font-size:11px;color:var(--muted)}.violation-hint{margin-top:6px;font-size:12px;color:var(--accent)}.tool-grade{flex:1.4;padding:0 16px;font-size:15px;font-weight:600;background:var(--accent);border-color:var(--accent);color:#10131a}.transport{display:flex;align-items:center;gap:8px;margin-bottom:10px}.btn-play{flex:0 0 auto;min-height:46px;padding:0 18px;border-radius:12px;background:var(--surface);border:1px solid var(--line);font-size:14px;font-weight:600}.btn-play:disabled{opacity:.5}.mute-group{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.mute-label{font-size:10px;color:var(--muted);padding-left:2px}.mute-row{display:flex;gap:5px}.mute-chip{flex:1;max-width:48px;min-height:36px;border-radius:9px;font-size:13px;font-weight:600;border:1px solid transparent}.mute-chip.is-on{background:#7fb2ff38;border-color:#7fb2ff8c;color:var(--accent)}.mute-chip.is-muted{background:transparent;border-color:var(--line);color:var(--muted);opacity:.55;text-decoration:line-through}.tempo-btn{flex:0 0 auto;min-height:46px;padding:0 14px;border-radius:12px;background:var(--surface);border:1px solid var(--line);font-size:13px;font-variant-numeric:tabular-nums}.result-actions{display:flex;gap:8px;padding:0 14px 12px}.hint-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}.hint-row .hint{flex:1;margin:0;text-align:left}.btn-flat{flex:0 0 auto;min-height:42px;padding:0 16px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);font-size:13px;white-space:nowrap}.btn-flat.is-on{background:#2f8f5b33;border-color:#2f8f5b;color:#7fd6a4}.editor-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}.duration-picker,.chip-row{display:flex;flex-wrap:wrap;gap:6px}.chip{min-height:42px;padding:0 14px;border-radius:12px;background:var(--surface);border:1px solid var(--line);font-size:13px}.chip.is-active{background:var(--accent);border-color:var(--accent);color:#10131a;font-weight:600}.editor-settings{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:10px}.editor-settings summary{cursor:pointer;font-size:14px;min-height:28px}.field{display:flex;flex-direction:column;gap:6px;margin:14px 0}.field>span{font-size:12px;color:var(--muted)}.field input{min-height:44px;padding:0 12px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);color:var(--text);font-size:15px}.editor-check{margin:0 0 10px;padding:10px 14px;border-radius:12px;font-size:13px}.editor-check.is-ok{background:#2f8f5b29;border:1px solid rgba(47,143,91,.5);color:#8ddcae}.editor-check.is-ng{background:#d23c3c24;border:1px solid rgba(210,60,60,.45);color:#ff9b9b}.save-btn{margin-left:auto}.custom-item{display:flex;align-items:stretch;background:var(--surface);border:1px solid var(--line);border-radius:14px;margin-bottom:10px;overflow:hidden}.custom-open{flex:1;display:flex;flex-direction:column;gap:2px;padding:14px;text-align:left;min-width:0}.custom-title{font-size:15px}.custom-meta{font-size:12px;color:var(--muted)}.custom-edit,.custom-delete{flex:0 0 auto;width:52px;border-left:1px solid var(--line);font-size:16px;color:var(--muted)}.custom-delete{color:var(--error)}.credits{margin-top:28px;font-size:11px;line-height:1.7;text-align:center}.position-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}.small-chip{min-height:36px;padding:0 16px;font-size:13px}