/* Flutter版 score_theme.dart / score_widgets.dart / ScoreListScene のWeb再現。 */
@font-face {
    font-family: "EMMUScoreSymbols";
    src: url("/web-assets/5/public/static/assets/fonts/tools/score/EMMUScoreSymbols.otf?v=ecaed70c") format("opentype");
    font-display: block;
}

.tools-score-page {
    --score-bg: #F7F5F1;
    --score-surface: #FFFFFF;
    --score-surface-alt: #FBFAF7;
    --score-fill: #F2EFE9;
    --score-segment: #E8E3DA;
    --score-seg-track: #E8E3DA;
    --score-line: #E4DED5;
    --score-line-soft: #EFEBE4;
    --score-ink: #1E1C19;
    --score-ink2: #6B655C;
    --score-ink3: #A8A199;
    --score-ink4: #C6BFB5;
    --score-accent: #A0BC00;
    --score-accent-pressed: #7E9400;
    --score-on-accent: #2A3300;
    --score-accent-ink: #5A6B00;
    --score-accent-wash: #F4F7E1;
    --score-danger: #E5533D;
    --score-danger-wash: #FDEDE9;
    --score-warn: #F0A32B;
    --score-sky: #3FC1F2;
    --score-sky-wash: #E8F6FD;
}

[data-theme="dark"] .tools-score-page {
    --score-bg: #16191B;
    --score-surface: #1B1F21;
    --score-surface-alt: #1F2426;
    --score-fill: #272D30;
    --score-segment: #2A3033;
    --score-seg-track: #2A3033;
    --score-line: #2E3538;
    --score-line-soft: #262C2F;
    --score-ink: #F1EFEB;
    --score-ink2: #A7AEB1;
    --score-ink3: #79817F;
    --score-ink4: #5A6366;
    --score-accent: #BCD62F;
    --score-accent-pressed: #8FA41A;
    --score-on-accent: #16191B;
    --score-accent-ink: #C9DF55;
    --score-accent-wash: #242A10;
    --score-danger-wash: #35221F;
    --score-sky-wash: #153140;
}

.emmu-score {
    position: relative;
    color: var(--score-ink);
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, sans-serif;
}

.emmu-score,
.emmu-score * { box-sizing: border-box; }

.emmu-score button,
.emmu-score input,
.emmu-score select,
.emmu-score textarea {
    font: inherit;
}

.emmu-score button {
    color: inherit;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.emmu-score svg {
    display: block;
}

.est-screen {
    position: relative;
    z-index: 1;
    width: min(100%, var(--eat-screen-max));
    min-height: 100vh;
    margin: 0 auto;
}

.est-library {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 20px 16px 10px;
    background: transparent;
}

.est-new-score,
.est-print-screen {
    min-height: 100vh;
    background: var(--score-bg);
}

.est-new-header,
.est-print-header {
    position: sticky;
    top: 0;
    z-index: 5;
    min-height: 54px;
    display: grid;
    grid-template-columns: minmax(76px, 1fr) auto minmax(76px, 1fr);
    align-items: center;
    gap: 8px;
    padding: max(4px, env(safe-area-inset-top)) 14px 4px;
    border-bottom: 1px solid var(--score-line-soft);
    background: color-mix(in srgb, var(--score-bg) 94%, transparent);
    backdrop-filter: blur(18px);
}

.est-new-header h1,
.est-print-header h1 { margin: 0; color: var(--score-ink); font-size: 17px; font-weight: 800; text-align: center; }
.est-new-header button { min-height: 38px; padding: 0; border: 0; background: transparent; color: var(--score-ink2); font-size: 13px; font-weight: 700; }
.est-new-header button:first-child { text-align: left; }
.est-new-header button.is-create { color: var(--score-accent-ink); text-align: right; }

.est-new-form { display: grid; gap: 13px; padding: 16px 16px max(28px, env(safe-area-inset-bottom)); }
.est-new-card { overflow: hidden; border: 1px solid var(--score-line); border-radius: 18px; background: var(--score-surface); }
.est-new-identity label { min-height: 58px; display: grid; grid-template-columns: 108px 1fr; align-items: center; gap: 10px; padding: 0 15px; }
.est-new-identity label + label { border-top: 1px solid var(--score-line-soft); }
.est-new-identity label > span,
.est-new-settings label > span:first-child,
.est-new-settings div > span { color: var(--score-ink2); font-size: 12px; font-weight: 700; }
.est-new-identity input { width: 100%; min-width: 0; height: 42px; padding: 0; border: 0; outline: 0; background: transparent; color: var(--score-ink); font-size: 14px; text-align: right; }
.est-new-label { margin: 3px 2px -6px; color: var(--score-ink3); font-size: 10.5px; font-weight: 700; }
.est-new-select-row { position: relative; }
.est-copyright-selector {
    overflow: hidden;
    border: 1px solid var(--score-line);
    border-radius: 18px;
    background: var(--score-surface);
}
.est-policy-summary-row { min-height: 68px; display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: stretch; }
.est-policy-toggle {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 8px 10px 15px;
    border: 0;
    background: transparent;
    color: var(--score-ink);
    text-align: left;
}
.est-policy-toggle > span { min-width: 0; flex: 1; display: grid; gap: 4px; }
.est-policy-toggle small { color: var(--score-ink3); font-size: 10.5px; font-weight: 700; }
.est-policy-toggle strong { color: var(--score-ink2); font-size: 12px; line-height: 1.4; font-weight: 600; }
.est-policy-toggle b { color: var(--score-ink4); font-size: 19px; font-weight: 500; transition: transform .18s; }
.est-copyright-selector.is-expanded .est-policy-toggle b { transform: rotate(180deg); }
.est-policy-info { width: 44px; border: 0; background: transparent; color: var(--score-accent-ink); font-size: 20px; }
.est-policy-options { display: grid; gap: 10px; padding: 11px 13px 13px; border-top: 1px solid var(--score-line-soft); }
.est-policy-term { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(120px, auto); align-items: center; gap: 8px; }
.est-policy-term > span,
.est-policy-other > span { color: var(--score-ink2); font-size: 11px; font-weight: 700; line-height: 1.35; }
.est-policy-term > div { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.est-policy-term button,
.est-policy-other button {
    min-height: 32px;
    padding: 5px 10px;
    border: 1px solid var(--score-line);
    border-radius: 11px;
    background: var(--score-surface);
    color: var(--score-ink2);
    font-size: 10.5px;
    line-height: 1.25;
    font-weight: 700;
}
.est-policy-term button.is-on,
.est-policy-other button.is-on { border-color: var(--score-accent); background: var(--score-accent-wash); color: var(--score-accent-ink); }
.est-policy-term button:disabled,
.est-policy-other button:disabled { opacity: .52; }
.est-policy-other { display: grid; gap: 7px; padding-top: 2px; }
.est-policy-other > div { display: flex; flex-wrap: wrap; gap: 6px; }
.est-policy-other button { flex: 1 1 120px; }
.est-copyright-notice-backdrop {
    position: fixed;
    inset: 0;
    z-index: 240;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(0,0,0,.54);
}
.est-copyright-notice { width: min(620px, 100%); max-height: min(84vh, 620px); overflow: auto; padding: 14px 16px 16px; border: 1px solid var(--score-line); border-radius: 20px; background: var(--score-surface); box-shadow: 0 18px 54px rgba(0,0,0,.24); }
.est-copyright-notice > header { display: flex; align-items: center; gap: 10px; }
.est-copyright-notice h2 { flex: 1; margin: 0; color: var(--score-ink); font-size: 16px; }
.est-copyright-notice header button { width: 36px; height: 36px; border: 0; background: transparent; color: var(--score-ink3); font-size: 24px; }
.est-copyright-notice > div { display: grid; grid-template-columns: 24px 1fr; gap: 10px; margin-top: 6px; padding: 14px; border: 1px solid var(--score-line-soft); border-radius: 14px; background: var(--score-fill); }
.est-copyright-notice > div > span { color: var(--score-accent-ink); font-size: 20px; }
.est-copyright-notice p { margin: 0; color: var(--score-ink2); font-size: 12px; line-height: 1.65; }
.est-new-section-title { margin: 5px 2px -5px; color: var(--score-ink); font-size: 14px; font-weight: 800; }
.est-new-chips { display: flex; gap: 8px; overflow-x: auto; padding: 2px 1px 5px; scrollbar-width: none; }
.est-new-chips::-webkit-scrollbar { display: none; }
.est-new-chips button { min-width: max-content; height: 38px; padding: 0 15px; border: 1px solid var(--score-line); border-radius: 19px; background: var(--score-surface); color: var(--score-ink2); font-size: 12px; font-weight: 700; }
.est-new-chips button.is-on { border-color: var(--score-accent); background: var(--score-accent); color: var(--score-on-accent); }
.est-new-clefs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.est-new-clefs button { height: 68px; display: flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid var(--score-line); border-radius: 18px; background: var(--score-surface); color: var(--score-ink2); }
.est-new-clefs button .est-music { font-size: 38px; }
.est-new-clefs button strong { font-size: 12px; }
.est-new-clefs button.is-on { border: 2px solid var(--score-accent); background: var(--score-accent-wash); color: var(--score-accent-ink); }
.est-new-clefs button:disabled { opacity: .35; }
.est-new-switch { min-height: 66px; display: flex; align-items: center; gap: 14px; padding: 10px 15px; cursor: pointer; }
.est-new-switch > span { flex: 1; display: grid; gap: 3px; }
.est-new-switch strong { color: var(--score-ink); font-size: 13px; }
.est-new-switch small { color: var(--score-ink3); font-size: 10px; font-weight: 500; }
.est-new-switch input { position: absolute; opacity: 0; }
.est-new-switch i { position: relative; width: 44px; height: 26px; flex: none; border-radius: 14px; background: var(--score-segment); transition: background .18s; }
.est-new-switch i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #FFF; box-shadow: 0 1px 4px rgba(0,0,0,.2); transition: transform .18s; }
.est-new-switch input:checked + i { background: var(--score-accent); }
.est-new-switch input:checked + i::after { transform: translateX(18px); }
.est-new-settings > label,
.est-new-settings > div { position: relative; min-height: 54px; display: grid; grid-template-columns: 92px minmax(0, 1fr); align-items: center; gap: 8px; padding: 0 15px; }
.est-new-settings > * + * { border-top: 1px solid var(--score-line-soft); }
.est-new-settings .efc-dd { width: min(100%, 230px); justify-self: end; }
.est-new-setting-action > button {
    min-width: 0;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--score-ink);
    text-align: right;
}
.est-new-setting-action > button strong { min-width: 0; overflow: hidden; font-size: 13px; white-space: nowrap; text-overflow: ellipsis; }
.est-new-setting-action > button img { width: 16px; height: 16px; flex: none; opacity: .62; }
.est-new-score .efc-dd__field { color: var(--score-ink); }
.est-new-score .efc-dd__label,
.est-new-score .efc-dd__item { text-align: center; }
.est-new-settings > div strong { grid-column: 2 / -1; color: var(--score-ink); font-size: 13px; text-align: right; }
.est-new-tempo { display: flex; align-items: center; justify-content: flex-end; gap: 5px; color: var(--score-ink); }
.est-new-tempo > .est-music { font-size: 23px; }
.est-new-tempo input { width: 62px; height: 36px; padding: 0 6px; border: 1px solid var(--score-line); border-radius: 10px; outline: 0; background: var(--score-fill); color: var(--score-ink); font-size: 14px; font-weight: 800; text-align: center; }
.est-new-tempo small { color: var(--score-ink3); font-size: 9px; }
.est-new-note { margin: -2px 3px 0; color: var(--score-ink3); font-size: 10px; line-height: 1.5; }
.est-new-submit { margin-top: 3px; }

.est-editor-header {
    display: flex;
    align-items: center;
    min-height: 54px;
    gap: 5px;
}

.est-spacer { flex: 1; }

.est-library-actions {
    display: flex;
    align-items: center;
    gap: 5px;
}

.est-icon-btn {
    width: 38px;
    height: 38px;
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--score-line);
    border-radius: 13px;
    background: var(--score-surface);
    color: var(--score-ink2);
    text-decoration: none;
}

.est-icon-btn:hover,
.est-icon-btn:focus-visible {
    border-color: var(--score-accent);
    outline: none;
}

.est-icon-btn svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.est-icon-btn > img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

[data-theme="dark"] .est-icon-btn > img,
[data-theme="dark"] .est-trash-button img,
[data-theme="dark"] .est-transport img,
[data-theme="dark"] .est-score-menu-row:not(.is-danger) > img {
    filter: brightness(0) invert(.72);
}

.est-icon-btn svg circle[fill], .est-icon-btn svg path[fill] { fill: currentColor; stroke: none; }

.est-sync {
    width: 14px;
    height: 14px;
    margin-left: 8px;
    border: 2px solid var(--score-line);
    border-top-color: var(--score-accent);
    border-radius: 50%;
    animation: est-spin .8s linear infinite;
}

@keyframes est-spin { to { transform: rotate(360deg); } }

.est-search {
    padding: 0 0 10px;
}

.est-search input,
.est-field input,
.est-field select,
.est-field textarea,
.est-number-field input {
    width: 100%;
    min-height: 42px;
    padding: 9px 12px;
    border: 1px solid var(--score-line);
    border-radius: 13px;
    outline: none;
    background: var(--score-surface);
    color: var(--score-ink);
}

.est-search input:focus,
.est-field input:focus,
.est-field select:focus,
.est-field textarea:focus,
.est-number-field input:focus {
    border-color: var(--score-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--score-accent) 17%, transparent);
}

.est-library-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 2px 0 12px;
}

.est-segments,
.est-mode-tabs {
    display: flex;
    gap: 4px;
    padding: 4px;
    border-radius: 16px;
    background: var(--score-segment);
}

.est-segments button,
.est-mode-tabs button {
    min-height: 36px;
    padding: 0 13px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--score-ink2);
    font-size: 12px;
    font-weight: 600;
}

.est-segments button.is-on {
    background: var(--score-ink);
    color: var(--score-bg);
    font-weight: 800;
}

.est-mode-tabs button.is-on {
    background: var(--score-accent);
    color: var(--score-on-accent);
    font-weight: 800;
}

.est-trash-button {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 32px;
    margin-left: auto;
    padding: 0 10px;
    border: 1px solid var(--score-line);
    border-radius: 11px;
    background: var(--score-surface);
    color: var(--score-ink2) !important;
    font-size: 12px;
    font-weight: 700;
}

.est-trash-button svg,
.est-trash-button img {
    width: 18px;
    height: 18px;
    object-fit: contain;
}

.est-trash-button svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.est-trash-button img { display: none; }
.est-trash-button::before {
    content: "";
    width: 18px;
    height: 18px;
    flex: none;
    background: currentColor;
    -webkit-mask: url("/web-assets/5/public/static/img/tools/score/ic_trash_can.svg") center / contain no-repeat;
    mask: url("/web-assets/5/public/static/img/tools/score/ic_trash_can.svg") center / contain no-repeat;
}

.est-offline-note {
    margin: 0 0 10px;
    padding: 9px 12px;
    border: 1px solid color-mix(in srgb, var(--score-warn) 35%, transparent);
    border-radius: 12px;
    background: color-mix(in srgb, var(--score-warn) 10%, var(--score-surface));
    color: var(--score-ink2);
    font-size: 11.5px;
}

.est-list {
    flex: 0 0 auto;
    min-height: 0;
}

.est-empty,
.est-score-card {
    border: 1px solid var(--score-line);
    border-radius: 20px;
    background: var(--score-surface);
}

.est-empty {
    padding: 28px 18px;
    text-align: center;
    color: var(--score-ink2);
    font-size: 13.5px;
    line-height: 1.6;
}

.est-empty svg {
    width: 42px;
    height: 42px;
    margin: 0 auto 11px;
    color: var(--score-ink4);
}

.est-score-card {
    margin-bottom: 9px;
    padding: 13px 15px 9px;
    overflow: hidden;
}

.est-card-group {
    min-height: 45px;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 10px;
    padding: 0 16px 5px;
    border-radius: 14px;
    background: var(--score-surface);
    box-shadow: 0 2px 10px rgba(30, 28, 25, .08);
}

.est-card-group-avatar {
    width: 40px;
    height: 40px;
    flex: none;
    display: block;
    border-radius: 50%;
    overflow: hidden;
    background: var(--score-fill);
    transform: translateY(2.5px);
}

.est-card-group-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.est-card-group-copy {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.est-card-group-copy > strong {
    max-width: 100%;
    overflow: hidden;
    color: var(--score-ink);
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.est-card-group-badges {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 0 0 4px;
}

.est-card-group-type,
.est-card-group-role {
    flex: none;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
}

.est-card-group-type { width: 80px; overflow: hidden; background: #696969; color: #FFF; text-overflow: ellipsis; }
.est-card-group-role { max-width: 104px; overflow: hidden; border: 1px solid #D8D8D8; background: transparent; color: #00FF00; text-overflow: ellipsis; }
.est-card-group-role.is-founder { color: #EEA87A; }
[data-theme="dark"] .est-card-group-role:not(.is-founder) { color: #00FF00; }

.est-score-card-main {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.est-score-card-title {
    flex: 1;
    min-width: 0;
}

.est-score-card-title strong {
    display: inline;
    color: var(--score-ink);
    font-size: 16px;
    line-height: 1.3;
    font-weight: 800;
}

.est-score-card-title p {
    margin: 2px 0 0;
    overflow: hidden;
    color: var(--score-ink3);
    font-size: 11.5px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.est-shared-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 3px 7px;
    border-radius: 6px;
    background: var(--score-sky-wash);
    color: #1B6E96;
    font-size: 9.5px;
    font-weight: 700;
    vertical-align: 2px;
}

[data-theme="dark"] .est-shared-badge { color: var(--score-sky); }

.est-card-menu {
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--score-ink4);
    font-size: 22px;
}

.est-card-chips {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 10px;
}

.est-card-chip {
    padding: 5px 8px;
    border-radius: 8px;
    background: var(--score-fill);
    color: var(--score-ink2);
    font-size: 9.5px;
    font-weight: 700;
    white-space: nowrap;
}

.est-card-chip.is-accent {
    background: var(--score-accent-wash);
    color: var(--score-accent-ink);
}

.est-preview-toggle {
    width: 32px;
    height: 28px;
    margin-left: auto;
    padding: 0;
    border: 1px solid var(--score-line);
    border-radius: 8px;
    background: var(--score-surface-alt);
    color: var(--score-ink3);
}

.est-preview-toggle.is-on {
    border-color: var(--score-accent);
    background: var(--score-accent-wash);
    color: var(--score-accent-ink);
}

.est-preview-toggle img { width: 20px; height: 21px; margin: auto; }
[data-theme="light"] .est-preview-toggle img { filter: brightness(0) invert(.38); }

.est-card-preview {
    margin-top: 8px;
    min-height: 76px;
    padding: 8px;
    border-radius: 12px;
    overflow: hidden;
    background: #FFF;
}

.est-card-preview .esr-clef,
.est-card-preview .esr-key-signature,
.est-card-preview .esr-time-signature,
.est-card-preview .esr-event-normal,
.est-card-preview .esr-tuplet { color: #1E1C19; }
.est-card-preview .esr-event-auto { color: #BEB7AD; }
.est-card-preview .esr-staff-line { stroke: #CFC8BE; }
.est-card-preview .esr-bar { stroke: #8C857B; }
.est-card-preview .esr-final-bar,
.est-card-preview .esr-grand-line,
.est-card-preview .esr-grand-bar { stroke: #1E1C19; }
.est-card-preview .esr-measure-number { fill: #A8A199; }
[data-theme="dark"] .est-card-preview .esr-brace-image { filter: none; }

.est-card-footer {
    min-height: 26px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 7px;
    color: var(--score-ink4);
    font-size: 10.5px;
    font-variant-numeric: tabular-nums;
}

.est-card-sync { color: var(--score-accent-ink); font-weight: 600; }

.est-library-bottom {
    position: sticky;
    bottom: 10px;
    z-index: 2;
    padding: 14px 0 10px;
    background: transparent;
}

.est-library-support {
    position: relative;
    z-index: 1;
    width: 100%;
}

.est-library-support > .tdoc {
    box-sizing: border-box;
    max-width: var(--eat-screen-max);
    margin-right: auto;
    margin-left: auto;
    padding-right: 16px;
    padding-left: 16px;
}

.est-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    min-height: 50px;
    padding: 0 16px;
    border: 0;
    border-radius: 14px;
    background: var(--score-accent);
    box-shadow: 0 2px 0 var(--score-accent-pressed);
    color: var(--score-on-accent);
    font-size: 15px;
    font-weight: 800;
}

.est-primary:active { transform: translateY(2px); box-shadow: none; }

/* 編集画面 */
.est-editor {
    width: min(100%, 1120px);
    display: flex;
    flex-direction: column;
    height: 100vh;
    min-height: 680px;
    overflow: hidden;
    background: var(--score-surface);
}

.est-editor-header {
    flex: none;
    padding: max(2px, env(safe-area-inset-top)) 6px 0;
    border-bottom: 1px solid var(--score-line-soft);
    background: var(--score-bg);
}

.est-editor-header .est-icon-btn {
    border-color: transparent;
    background: transparent;
}

.est-editor-title {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.est-editor-title strong {
    overflow: hidden;
    color: var(--score-ink);
    font-size: 15.5px;
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.est-editor-title span {
    color: var(--score-ink3);
    font-size: 10.5px;
}

.est-editor-save {
    height: 34px;
    min-width: 54px;
    padding: 0 13px;
    border: 0;
    border-radius: 17px;
    background: var(--score-accent);
    color: var(--score-on-accent);
    font-size: 12px;
    font-weight: 800;
}
.est-editor-save:disabled { opacity: .38; cursor: default; }
.est-editor-save.is-dirty { box-shadow: 0 0 0 2px var(--score-accent-wash); }

.est-transport {
    flex: none;
    min-height: 52px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    overflow-x: auto;
    scrollbar-width: none;
    border-bottom: 1px solid var(--score-line-soft);
    background: var(--score-bg);
}

.est-transport::-webkit-scrollbar { display: none; }
.est-transport button { flex: none; }

.est-transport-circle,
.est-transport-edit,
.est-transport-play,
.est-transport-small,
.est-transport-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--score-line);
    background: var(--score-surface);
    color: var(--score-ink2);
}

.est-transport-circle,
.est-transport-play { width: 40px; height: 40px; border-radius: 14px; }
.est-transport-edit,
.est-transport-small { width: 36px; height: 36px; border-radius: 12px; }
.est-transport-pill { height: 38px; gap: 4px; padding: 0 10px; border-radius: 19px; font-size: 12.5px; font-weight: 700; }
.est-transport-pill .est-tempo-glyph {
    display: inline-flex;
    height: 19px;
    align-items: center;
    font-size: 19px;
    line-height: 1;
    transform: translateY(7px);
}
.est-transport button.is-on { border-color: transparent; background: var(--score-accent); color: var(--score-on-accent); }
.est-transport button[aria-pressed="true"] { border-color: transparent; background: var(--score-accent); color: var(--score-on-accent); }
.est-transport svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.est-transport img { width: 20px; height: 24px; object-fit: contain; }
.est-transport .est-play-icon path, .est-transport .est-pause-icon path { fill: currentColor; stroke: none; }

.est-music {
    font-family: "EMMUScoreSymbols", "Noto Music", serif;
    font-size: 22px;
    line-height: 1;
}

.est-grand-row,
.est-accidental-row {
    flex: none;
    display: flex;
    align-items: center;
    min-height: 52px;
    gap: 8px;
    padding: 7px 18px 5px;
    background: var(--score-surface);
}

.est-accidental-row {
    min-height: 45px;
    justify-content: flex-end;
    padding-top: 4px;
    padding-bottom: 4px;
}

.est-accidental-row > span {
    margin-right: auto;
    color: var(--score-ink3);
    font-size: 10.5px;
}

.est-grand-switch,
.est-accidentals {
    display: flex;
    gap: 4px;
    padding: 4px;
    border-radius: 16px;
    background: var(--score-fill);
}

.est-grand-switch button,
.est-accidentals button {
    min-width: 44px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 10px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--score-ink2);
    font-size: 12px;
    font-weight: 600;
}

.est-grand-switch button.is-on,
.est-accidentals button.is-on { background: var(--score-accent); color: var(--score-on-accent); font-weight: 800; }
.est-accidentals .est-music { font-size: 26px; }
.est-accidentals [data-accidental="flat"] .est-music { transform: translateY(2.5px); }

.est-score-scroll {
    flex: 1;
    min-height: 150px;
    overflow: auto;
    overscroll-behavior: contain;
    background: var(--score-surface);
}

.est-score-stage {
    min-width: 100%;
    padding: 10px 14px 0;
    touch-action: pan-y;
}

.emmu-score-svg {
    display: block;
    width: 100%;
    min-width: 300px;
    overflow: visible;
    user-select: none;
}

.emmu-score-svg.is-compact { min-width: 0; }
.emmu-score-svg.is-compact .esr-symbol,
.emmu-score-svg.is-compact .esr-clef,
.emmu-score-svg.is-compact .esr-rest,
.emmu-score-svg.is-compact .esr-accidental,
.emmu-score-svg.is-compact .esr-key-signature,
.emmu-score-svg.is-compact .esr-dot,
.emmu-score-svg.is-compact .esr-flag,
.emmu-score-svg.is-compact .esr-time-signature { font-size: calc(26px * var(--score-render-scale, 1)); }
.emmu-score-svg.is-compact .esr-staff-line { stroke-width: calc(.85px * var(--score-render-scale, 1)); }
.emmu-score-svg.is-compact .esr-ledger { stroke-width: calc(1.05px * var(--score-render-scale, 1)); }
.emmu-score-svg.is-compact .esr-bar { stroke-width: calc(1.05px * var(--score-render-scale, 1)); }
.emmu-score-svg.is-compact .esr-final-bar { stroke-width: calc(3.25px * var(--score-render-scale, 1)); }
.esr-staff-line { stroke: #CFC8BE; stroke-width: calc(1.3px * var(--score-render-scale, 1)); }
.esr-ledger { stroke: currentColor; stroke-width: calc(1.6px * var(--score-render-scale, 1)); }
.esr-bar { stroke: #8C857B; stroke-width: calc(1.6px * var(--score-render-scale, 1)); }
.esr-final-bar { stroke: var(--score-ink); stroke-width: calc(5px * var(--score-render-scale, 1)); }
.esr-grand-line, .esr-grand-bar { stroke: var(--score-ink); stroke-width: calc(1.2px * var(--score-render-scale, 1)); }
.esr-brace { fill: none; stroke: var(--score-ink); stroke-width: calc(2.2px * var(--score-render-scale, 1)); stroke-linecap: round; }
.esr-brace-image { pointer-events: none; }
[data-theme="dark"] .esr-brace-image { filter: invert(1); }
.esr-symbol { font-family: "EMMUScoreSymbols", "Noto Music", serif; font-size: calc(40px * var(--score-render-scale, 1)); fill: currentColor; }
.esr-clef { font-size: calc(40px * var(--score-render-scale, 1)); color: var(--score-ink); }
.esr-head, .esr-rest { cursor: pointer; }
.esr-rest { font-size: calc(40px * var(--score-render-scale, 1)); }
.esr-accidental, .esr-key-signature { font-size: calc(40px * var(--score-render-scale, 1)); }
.esr-dot { font-size: calc(40px * var(--score-render-scale, 1)); }
.esr-flag { font-size: calc(40px * var(--score-render-scale, 1)); }
.esr-time-signature { color: var(--score-ink); font-size: calc(40px * var(--score-render-scale, 1)); }
.esr-tempo-note { color: var(--score-ink); font-size: calc(23px * var(--score-render-scale, 1)); }
.esr-tempo-text { fill: var(--score-ink); font-size: calc(11.5px * var(--score-render-scale, 1)); font-weight: 700; }
.esr-event-mark { font-size: calc(31px * var(--score-render-scale, 1)); pointer-events: none; }
.esr-event-mark.esr-dynamic-mark { font-size: calc(36px * var(--score-render-scale, 1)); }
.esr-event-mark.esr-articulation-mark,
.esr-event-mark.esr-tremolo-mark { font-size: calc(29px * var(--score-render-scale, 1)); }
.esr-event-mark.esr-arpeggio-mark { font-size: calc(27px * var(--score-render-scale, 1)); }
.emmu-score-svg.is-compact .esr-event-mark { font-size: calc(20px * var(--score-render-scale, 1)); }
.emmu-score-svg.is-compact .esr-event-mark.esr-dynamic-mark { font-size: calc(23px * var(--score-render-scale, 1)); }
.emmu-score-svg.is-compact .esr-tempo-text { font-size: calc(8px * var(--score-render-scale, 1)); }
.esr-measure-number { fill: var(--score-ink3); font-size: calc(9.5px * var(--score-render-scale, 1)); font-weight: 700; }
.esr-stem { fill: currentColor; stroke: none; }
.esr-beam { fill: currentColor; stroke: none; }
.esr-extra-flag { stroke: currentColor; stroke-width: calc(2.2px * var(--score-render-scale, 1)); stroke-linecap: round; }
.esr-tie { fill: none; stroke: currentColor; stroke-width: calc(1.6px * var(--score-render-scale, 1)); stroke-linecap: round; pointer-events: none; }
.esr-event-normal { color: var(--score-ink); }
.esr-event-auto { color: #BEB7AD; }
.esr-event-selected,
.esr-event-playing { color: #A0BC00; }
.esr-event-selected .esr-pitch-unselected { color: var(--score-ink); }
.esr-event-played { color: color-mix(in srgb, #A0BC00 42%, var(--score-ink)); }
.esr-selection { fill: rgba(160, 188, 0, .15); stroke: #A0BC00; stroke-width: calc(1.5px * var(--score-render-scale, 1)); }
.esr-cursor { fill: rgba(160, 188, 0, .14); stroke: #A0BC00; stroke-width: calc(1.5px * var(--score-render-scale, 1)); }
.esr-cursor-edge { fill: #A0BC00; }
.esr-playhead { stroke: #A0BC00; stroke-width: calc(2px * var(--score-render-scale, 1)); }
.esr-tuplet { cursor: pointer; color: var(--score-ink); }
.esr-tuplet.is-selected { color: #A0BC00; }
.esr-tuplet-bracket { fill: none; stroke: currentColor; stroke-width: calc(1.4px * var(--score-render-scale, 1)); stroke-linecap: round; }
.esr-tuplet-number { fill: currentColor; font-size: calc(13px * var(--score-render-scale, 1)); font-weight: 800; }
.emmu-score-svg.is-compact .esr-tuplet-number { font-size: calc(10px * var(--score-render-scale, 1)); }
.esr-tuplet-hit,
.esr-chord-hit { fill: transparent; stroke: none; pointer-events: all; }
.esr-chord-label { cursor: pointer; color: #A0BC00; }
.esr-chord-label-box { fill: var(--score-surface); stroke: currentColor; stroke-width: calc(1.6px * var(--score-render-scale, 1)); }
.esr-chord-label.is-whole .esr-chord-label-box { fill: #A0BC00; stroke: #A0BC00; }
.esr-chord-label-text { fill: currentColor; font-size: calc(10.5px * var(--score-render-scale, 1)); font-weight: 800; }
.esr-chord-label.is-whole .esr-chord-label-text { fill: #FFF; }
.esr-measure-hit { fill: transparent; pointer-events: all; cursor: crosshair; }
.esr-event { pointer-events: none; cursor: pointer; }
.esr-tuplet { pointer-events: all; cursor: pointer; }
.esr-event-hit { fill: transparent; stroke: none; pointer-events: all; cursor: pointer; }
.esr-event:focus,
.esr-tuplet:focus,
.esr-chord-label:focus { outline: none; }

.est-score-hint {
    margin: 10px 14px 0;
    padding: 9px 11px;
    border-radius: 12px;
    background: var(--score-bg);
    color: var(--score-ink2);
    font-size: 11.5px;
    line-height: 1.45;
}

.est-copyright {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 10px 16px 18px;
    color: var(--score-ink3);
    font-size: 9.5px;
}

/* 入力タブ */
.est-toolbar,
.est-playback-panel {
    flex: none;
    position: relative;
    z-index: 3;
    padding: 8px 12px max(12px, env(safe-area-inset-bottom));
    border-top: 1px solid var(--score-line);
    background: var(--score-fill);
}

.est-mode-tabs { margin-bottom: 9px; border-radius: 24px; }
.est-mode-tabs button { flex: 1; padding: 0 4px; border-radius: 20px; font-size: 13px; }

.est-tools-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(46px, 1fr));
    gap: 6px;
}

.est-tools-grid button {
    min-width: 0;
    height: 58px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 3px 1px;
    border: 0;
    border-radius: 18px;
    background: color-mix(in srgb, var(--score-segment) 62%, var(--score-surface));
    color: var(--score-ink);
}

.est-tools-grid button.is-on,
.est-tools-grid button[aria-pressed="true"] {
    background: var(--score-accent);
    color: var(--score-on-accent);
}

.est-tools-grid button:disabled { opacity: .35; cursor: default; }
.est-tools-grid .est-music { position: relative; display: inline-flex; height: 27px; align-items: center; font-size: 27px; }
.est-tools-grid .est-music i { position: absolute; right: -6px; bottom: 0; font: 800 12px/1 sans-serif; }
.est-tools-grid .est-sixty-fourth i {
    right: -3px;
    bottom: 2px;
    width: 8px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    transform: rotate(24deg);
}
.est-tools-grid .est-sixty-fourth.is-rest i { right: -1px; bottom: 4px; }
.est-tools-grid button > span:not(.est-music) { min-height: 25px; display: flex; align-items: center; font-size: 17px; font-weight: 800; }
.est-tools-grid .est-svg-icon { width: 21px; height: 21px; object-fit: contain; }
.est-tools-grid small { overflow: hidden; max-width: 100%; color: var(--score-ink2); font-size: 8.5px; line-height: 1.05; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; }
.est-tools-grid button.is-on small { color: color-mix(in srgb, var(--score-on-accent) 78%, transparent); font-weight: 800; }
.est-tuplet-icon { font-variant-numeric: tabular-nums; }
.est-trash-glyph { font-size: 21px !important; }

.est-select-grid { grid-template-columns: repeat(7, minmax(42px, 1fr)); }
.est-mark-category-grid {
    grid-template-columns: repeat(auto-fit, minmax(52px, 1fr));
    margin-top: 6px;
}
.est-mark-category-grid:empty { display: none; }
.est-mark-category-grid .est-mark-category-glyph { font-family: EMMUScoreSymbols, serif; font-size: 22px; font-weight: 400; }
.est-chord-grid { grid-template-columns: repeat(5, minmax(52px, 1fr)); }

.est-selected-bar {
    min-height: 48px;
    display: flex;
    align-items: center;
    margin-bottom: 9px;
    border: 1px solid var(--score-line);
    border-radius: 14px;
    background: var(--score-surface);
}

.est-selected-bar button {
    align-self: stretch;
    width: 52px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--score-ink2);
}
.est-selected-bar button img { width: 18px; height: 18px; margin: auto; }
.est-selected-bar button:disabled { opacity: .3; cursor: default; }

.est-selected-bar div { flex: 1; min-width: 0; text-align: center; }
.est-selected-bar strong { display: block; color: var(--score-ink); font-size: 12px; }
.est-selected-bar small { display: block; margin-top: 2px; color: var(--score-ink3); font-size: 9.5px; }

.est-tuplet-popup {
    position: absolute;
    left: 50%;
    bottom: calc(100% - 6px);
    display: flex;
    gap: 5px;
    padding: 6px;
    border: 1px solid var(--score-line);
    border-radius: 16px;
    transform: translateX(-50%);
    background: var(--score-surface);
    box-shadow: 0 8px 30px rgba(0, 0, 0, .18);
}

.est-tuplet-popup button {
    width: 42px;
    height: 40px;
    border: 0;
    border-radius: 12px;
    background: var(--score-fill);
    color: var(--score-ink);
    font-weight: 800;
}

.est-music-symbol-popup {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: calc(100% - 6px);
    z-index: 2;
    overflow-x: auto;
    padding: 8px;
    border: 1px solid var(--score-line);
    border-radius: 18px;
    background: var(--score-bg);
    box-shadow: 0 6px 20px rgba(30, 28, 25, .2);
    scrollbar-width: thin;
}
.est-music-symbol-popup[hidden] { display: none; }
.est-music-symbol-row { width: max-content; display: flex; gap: 5px; }
.est-music-symbol-choice {
    width: 76px;
    height: 54px;
    flex: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 0 3px;
    border: 0;
    border-radius: 14px;
    background: var(--score-surface);
    color: var(--score-ink);
}
.est-music-symbol-choice:disabled { opacity: .35; cursor: default; }
.est-music-symbol-choice.is-on { background: var(--score-accent); color: var(--score-on-accent); }
.est-music-symbol-choice > span { font-family: EMMUScoreSymbols, serif; font-size: 23px; font-weight: 400; line-height: 1; }
.est-music-symbol-choice > small { overflow: hidden; max-width: 70px; color: inherit; font-size: 8px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; }

/* 再生パネル */
.est-speed-options { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.est-speed-options button { min-height: 38px; border: 0; border-radius: 12px; background: var(--score-segment); color: var(--score-ink2); font-size: 11px; font-weight: 700; }
.est-speed-options button.is-on { background: var(--score-accent); color: var(--score-on-accent); }
.est-playback-options { display: grid; grid-template-columns: minmax(0, 1fr) 82px; align-items: center; gap: 10px; margin-top: 8px; }
.est-playback-toggles { display: grid; gap: 7px; }
.est-playback-toggles > label { min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 10px; border-radius: 12px; background: var(--score-surface); color: var(--score-ink2); font-size: 10.5px; font-weight: 700; }
.est-playback-options input[type="checkbox"] { position: absolute; opacity: 0; }
.est-playback-options label > i { width: 34px; height: 20px; position: relative; border-radius: 12px; background: var(--score-segment); }
.est-playback-options label > i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: var(--score-surface); box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: transform .16s; }
.est-playback-options input:checked + i { background: var(--score-accent); }
.est-playback-options input:checked + i::after { transform: translateX(14px); }
.est-volume { min-height: 88px !important; display: flex !important; flex-direction: column; align-items: center !important; justify-content: center !important; gap: 1px !important; padding: 0 !important; background: transparent !important; }
.est-volume output { color: var(--score-ink3); font-size: 8.5px; font-weight: 600; white-space: nowrap; }
.est-volume canvas { width: 72px; height: 72px; display: block; touch-action: none; cursor: ns-resize; }
.est-volume canvas:focus-visible { border-radius: 50%; outline: 2px solid var(--score-accent); outline-offset: 2px; }
.est-stop-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.est-fullscreen { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 0 12px; }
.est-fullscreen svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.est-play-icon.is-hidden,
.est-pause-icon.is-hidden,
.est-fullscreen-play-icon.is-hidden,
.est-fullscreen-pause-icon.is-hidden { display: none !important; }

.est-fullscreen-bar {
    position: fixed;
    top: max(8px, env(safe-area-inset-top));
    left: 10px;
    right: 10px;
    z-index: 9010;
    min-height: 48px;
    display: grid;
    grid-template-columns: 1fr minmax(120px, 40%) 1fr;
    align-items: center;
    gap: 8px;
    padding: 5px 7px;
    border: 1px solid var(--score-line);
    border-radius: 17px;
    background: color-mix(in srgb, var(--score-surface) 90%, transparent);
    box-shadow: 0 5px 24px rgba(0, 0, 0, .14);
    backdrop-filter: blur(12px);
}

.est-fullscreen-left,
.est-fullscreen-right { display: flex; align-items: center; gap: 5px; }
.est-fullscreen-right { justify-content: flex-end; }
.est-fullscreen-bar > strong { overflow: hidden; color: var(--score-ink); font-size: 14px; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.est-fullscreen-bar button {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: var(--score-fill);
    color: var(--score-ink2);
}
.est-fullscreen-bar button[aria-pressed="true"],
.est-fullscreen-bar #scoreFullscreenPlay { background: #A0BC00; color: #FFF; }
.est-fullscreen-bar svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.est-fullscreen-bar #scoreFullscreenPlay svg { fill: currentColor; stroke: none; }

/* ボトムシート */
.est-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-top: 20px;
    background: rgba(12, 12, 12, .45);
}

.est-sheet {
    width: min(100%, 620px);
    max-height: min(88vh, 760px);
    display: flex;
    flex-direction: column;
    border-radius: 26px 26px 0 0;
    border: 1px solid var(--score-line);
    border-bottom: 0;
    overflow: hidden;
    background: var(--score-bg);
    box-shadow: 0 -12px 40px rgba(0,0,0,.22);
}

.est-sheet-handle { width: 42px; height: 4px; margin: 9px auto 1px; border-radius: 3px; background: var(--score-ink4); }
.est-sheet > header { min-height: 48px; display: flex; align-items: center; padding: 0 16px; }
.est-sheet > header h2 { flex: 1; margin: 0; color: var(--score-ink); font-size: 17px; font-weight: 800; }
.est-sheet > header button { display: none; }
.est-sheet-body { overflow: auto; padding: 4px 16px max(18px, env(safe-area-inset-bottom)); }
.est-sheet-actions { display: grid; gap: 8px; margin-top: 14px; }
.est-sheet-action { width: 100%; min-height: 50px; display: flex; align-items: center; gap: 12px; padding: 0 14px; border: 0; border-radius: 14px; background: var(--score-surface); color: var(--score-ink); text-align: left; font-weight: 700; }
.est-sheet-action svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.est-sheet-action img { width: 22px; height: 22px; flex: none; object-fit: contain; }
.est-sheet-action small { margin-left: auto; color: var(--score-ink3); font-size: 10px; }
.est-sheet-action.is-danger { color: var(--score-danger); }
.est-sheet-action:disabled { opacity: .35; }
.est-measure-sheet { padding-bottom: 6px; }
.est-measure-summary { min-height: 36px; display: flex; align-items: center; justify-content: space-between; margin: 0 0 14px; padding-left: 1px; color: var(--score-ink3); font-size: 11px; }
.est-measure-summary button { height: 36px; display: flex; align-items: center; gap: 6px; padding: 0 12px; border: 0; border-radius: 12px; background: var(--score-fill); color: var(--score-ink2); font-size: 12px; font-weight: 700; }
.est-measure-summary img { width: 15px; height: 15px; object-fit: contain; }
.est-measure-number-input { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin: -6px 0 12px; padding: 8px; border-radius: 14px; background: var(--score-fill); }
.est-measure-number-input[hidden] { display: none; }
.est-measure-number-input input { min-width: 0; height: 38px; padding: 0 12px; border: 1px solid var(--score-line); border-radius: 10px; outline: 0; background: var(--score-surface); color: var(--score-ink); font-size: 16px; font-weight: 700; }
.est-measure-number-input input:focus { border-color: var(--score-accent); }
.est-measure-number-input button { min-width: 68px; border: 0; border-radius: 10px; background: var(--score-accent); color: var(--score-on-accent); font-weight: 700; }
.est-measure-scopes { display: grid; grid-template-columns: 1fr 1fr; gap: 0; padding: 4px; border-radius: 22px; background: var(--score-seg-track); }
.est-measure-scopes button { height: 36px; border: 0; border-radius: 18px; background: transparent; color: var(--score-ink2); font-size: 13px; font-weight: 500; }
.est-measure-scopes button.is-active { background: var(--score-accent); color: var(--score-on-accent); font-weight: 700; }
.est-measure-window { margin-top: 14px; }
.est-measure-window-row { min-width: 0; display: flex; align-items: stretch; gap: 6px; }
.est-measure-arrow { width: 36px; min-width: 36px; height: 48px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 13px; background: var(--score-fill); }
.est-measure-window-row.is-range .est-measure-arrow { height: 44px; }
.est-measure-arrow:disabled { opacity: .4; }
.est-measure-arrow img { width: 14px; height: 14px; object-fit: contain; }
.est-measure-number-strip { min-width: 0; flex: 1; display: flex; gap: 6px; }
.est-measure-number { min-width: 0; height: 48px; flex: 1 1 0; padding: 0; border: 0; border-radius: 14px; background: var(--score-bg); color: var(--score-ink3); font-size: 15px; font-weight: 600; }
.est-measure-number.is-neighbor { background: var(--score-fill); color: var(--score-ink2); font-size: 16px; }
.est-measure-number.is-current { flex-grow: 1.35; background: var(--score-accent); color: var(--score-on-accent); font-size: 21px; font-weight: 900; box-shadow: 0 2px 0 var(--score-accent-pressed); }
.est-measure-range-strip { min-width: 0; height: 44px; flex: 1; display: flex; overflow: hidden; border-radius: 14px; }
.est-measure-range-cell { min-width: 0; height: 44px; flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--score-bg); color: var(--score-ink3); }
.est-measure-range-cell strong { font-size: 14px; line-height: 1; font-weight: 600; }
.est-measure-range-cell small { margin-top: 3px; color: color-mix(in srgb, var(--score-on-accent) 65%, transparent); font-size: 8px; line-height: 1; }
.est-measure-range-cell.is-endpoint { background: var(--score-accent); color: var(--score-on-accent); }
.est-measure-range-cell.is-endpoint strong { font-size: 16px; }
.est-measure-range-cell.is-inner,
.est-measure-range-ellipsis { background: var(--score-accent-wash); color: var(--score-accent-ink); }
.est-measure-range-ellipsis { width: 26px; min-width: 26px; height: 44px; display: grid; place-items: center; font-size: 13px; font-weight: 700; }
.est-measure-selection { margin: 9px 0 13px; color: var(--score-accent-ink); font-size: 11px; font-weight: 600; text-align: center; }
.est-measure-steppers { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 14px; }
.est-measure-steppers[hidden] { display: none; }
.est-measure-steppers label { display: grid; gap: 5px; color: var(--score-ink3); font-size: 10px; font-weight: 700; }
.est-measure-steppers label > div { height: 42px; display: grid; grid-template-columns: 38px 1fr 38px; overflow: hidden; border: 1px solid var(--score-line); border-radius: 13px; background: var(--score-surface); }
.est-measure-steppers button { padding: 0; border: 0; background: var(--score-fill); color: var(--score-ink2); font-size: 18px; }
.est-measure-steppers button:disabled { opacity: .35; }
.est-measure-steppers input { min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: var(--score-ink); text-align: center; font-size: 15px; font-weight: 800; appearance: textfield; }
.est-measure-steppers input::-webkit-inner-spin-button,
.est-measure-steppers input::-webkit-outer-spin-button { margin: 0; appearance: none; }
.est-measure-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.est-measure-action { height: 82px; display: grid; place-items: center; align-content: center; gap: 5px; padding: 6px; border: 0; border-radius: 18px; background: var(--score-fill); color: var(--score-ink2); }
.est-measure-action.is-primary { border: 1px solid color-mix(in srgb, var(--score-accent) 26%, transparent); background: color-mix(in srgb, var(--score-accent) 16%, var(--score-bg)); color: var(--score-accent-ink); }
.est-measure-action:disabled { opacity: .35; }
.est-measure-action img { width: 22px; height: 22px; object-fit: contain; }
.est-measure-action span { font-size: 10.5px; line-height: 1; font-weight: 600; }
.est-measure-action small { color: var(--score-ink3); font-size: 9px; line-height: 1; }
.est-measure-changes { margin-top: 16px; }
.est-measure-changes[hidden] { display: none; }
.est-measure-changes > p { margin: 0 0 7px 2px; color: var(--score-ink3); font-size: 10.5px; font-weight: 700; }
.est-measure-changes > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.est-measure-changes button {
    min-width: 0;
    height: 76px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 6px;
    border: 1px solid var(--score-line);
    border-radius: 16px;
    background: var(--score-bg);
    color: var(--score-ink2);
}
.est-measure-changes button.is-changed { border-color: var(--score-accent); background: var(--score-accent-wash); color: var(--score-accent-ink); }
.est-measure-changes svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.est-measure-changes strong { max-width: 100%; overflow: hidden; font-size: 10.5px; line-height: 1; text-overflow: ellipsis; white-space: nowrap; }
.est-measure-changes small { max-width: 100%; overflow: hidden; color: var(--score-ink3); font-size: 8.5px; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.est-measure-changes button.is-changed small { color: inherit; }
.est-measure-delete { width: 100%; height: 48px; display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 12px; border: 0; border-radius: 16px; background: var(--score-danger-wash); color: var(--score-danger); font-size: 14px; font-weight: 700; }
.est-measure-delete:disabled { opacity: .4; }
.est-measure-delete img { width: 18px; height: 18px; object-fit: contain; }
[data-theme="dark"] .est-measure-delete { background: #35221F; }
[data-theme="dark"] .est-measure-summary img,
[data-theme="dark"] .est-measure-arrow img,
[data-theme="dark"] .est-measure-action:not(.is-primary) img { filter: invert(1); }
.est-fields { display: grid; gap: 11px; }
.est-field { display: grid; gap: 5px; color: var(--score-ink2); font-size: 11px; font-weight: 700; }
.est-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.emmu-score .est-field .efc-dd { width: 100%; }
.emmu-score .efc-dd__label,
.emmu-score .efc-dd__item { justify-content: center; text-align: center; }
.est-check { min-height: 48px; display: flex; align-items: center; gap: 10px; padding: 0 12px; border: 1px solid var(--score-line); border-radius: 13px; background: var(--score-surface); color: var(--score-ink2); font-size: 12px; }
.est-check input { width: 18px; height: 18px; accent-color: var(--score-accent); }
.est-license-info { margin: 5px 0 0; color: var(--score-ink3); font-size: 10px; line-height: 1.5; }

.est-score-settings { display: grid; gap: 14px; padding-bottom: 4px; }
.est-settings-text-card,
.est-settings-copyright {
    overflow: hidden;
    border: 1px solid var(--score-line);
    border-radius: 18px;
    background: var(--score-surface);
}
.est-settings-text-card > label {
    display: grid;
    gap: 5px;
    padding: 12px 15px;
}
.est-settings-text-card > label + label { border-top: 1px solid var(--score-line-soft); }
.est-settings-text-card span,
.est-settings-copyright > span,
.est-settings-section h3 {
    color: var(--score-ink3);
    font-size: 10.5px;
    font-weight: 700;
}
.est-settings-text-card input {
    width: 100%;
    height: 24px;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--score-ink);
    font-size: 15px;
}
.est-settings-text-card input::placeholder { color: var(--score-ink4); }
.est-settings-copyright { min-height: 68px; display: grid; gap: 4px; padding: 10px 15px; }
.est-settings-copyright .efc-dd { width: 100%; }
.est-settings-copyright .efc-dd__field { min-height: 34px; border: 0; background: transparent; box-shadow: none; }
.est-settings-section { display: grid; gap: 8px; }
.est-settings-section h3 { margin: 0 0 1px 4px; }
.est-settings-instruments {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding: 0 1px 3px;
    scrollbar-width: none;
}
.est-settings-instruments::-webkit-scrollbar { display: none; }
.est-settings-instruments button {
    height: 36px;
    flex: none;
    padding: 0 14px;
    border: 1px solid var(--score-line);
    border-radius: 12px;
    background: var(--score-surface);
    color: var(--score-ink2);
    font-size: 12.5px;
    font-weight: 700;
}
.est-settings-instruments button.is-on { border-color: transparent; background: var(--score-accent); color: var(--score-on-accent); }
.est-settings-clefs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; transition: opacity .16s ease; }
.est-settings-clefs.is-disabled { opacity: .42; }
.est-settings-clefs button {
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid var(--score-line);
    border-radius: 16px;
    background: var(--score-surface);
    color: var(--score-ink2);
}
.est-settings-clefs button.is-on { border: 2px solid var(--score-accent); color: var(--score-ink); }
.est-settings-clefs .est-music { color: var(--score-accent); font-size: 35px; line-height: 1; }
.est-settings-clefs strong { font-size: 12.5px; }
.est-settings-toggle {
    position: relative;
    height: 44px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0 12px;
    border: 1px solid var(--score-line);
    border-radius: 14px;
    background: var(--score-surface);
    color: var(--score-ink);
    cursor: pointer;
}
.est-settings-toggle-icon { width: 16px; display: grid; place-items: center; flex: none; color: var(--score-accent); }
.est-settings-toggle-icon .est-music { font-size: 17px; line-height: 1; white-space: nowrap; transform: translateX(-4px); }
.est-settings-toggle-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.est-settings-toggle-icon b { font-size: 9px; letter-spacing: -.5px; }
.est-settings-toggle > strong { min-width: 0; flex: 1; overflow: hidden; font-size: 12.5px; white-space: nowrap; text-overflow: ellipsis; }
.est-settings-toggle output { color: var(--score-ink3); font-size: 11px; }
.est-settings-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.est-settings-toggle > i {
    width: 44px;
    height: 26px;
    flex: none;
    position: relative;
    border-radius: 13px;
    background: var(--score-line);
    transition: background .16s ease;
}
.est-settings-toggle > i::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #FFF;
    transition: transform .16s ease;
}
.est-settings-toggle.is-on > i { background: var(--score-accent); }
.est-settings-toggle.is-on > i::after { transform: translateX(18px); }
.est-settings-toggle:has(input:disabled) { cursor: default; opacity: .58; }
.est-confirm-text { margin: 0 0 14px; color: var(--score-ink2); font-size: 13px; line-height: 1.65; }
.est-group-card { width: 100%; min-height: 62px; display: flex; align-items: center; gap: 11px; margin-bottom: 8px; padding: 8px 10px; border: 1px solid var(--score-line); border-radius: 15px; background: var(--score-surface); text-align: left; }
.est-group-card img, .est-group-fallback { width: 44px; height: 44px; border-radius: 12px; object-fit: cover; background: var(--score-fill); }
.est-group-card strong { color: var(--score-ink); font-size: 13px; }
.est-group-card small { display: block; margin-top: 2px; color: var(--score-ink3); font-size: 10px; }

.est-sheet-subtitle {
    margin: -4px 0 12px;
    color: var(--score-ink3);
    font-size: 10.5px;
    font-weight: 600;
}

.est-tempo-sheet,
.est-time-sheet { display: grid; }

.est-tempo-value {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

.est-tempo-value > button {
    width: 46px;
    height: 46px;
    border: 0;
    border-radius: 15px;
    background: var(--score-fill);
    color: var(--score-ink);
    font-size: 24px;
}

.est-tempo-value > div { display: flex; align-items: flex-end; gap: 7px; }
.est-tempo-value .est-music { margin-bottom: 7px; font-size: 30px; }
.est-tempo-value strong { color: var(--score-ink); font-size: 46px; line-height: 1; font-weight: 900; letter-spacing: -1px; font-variant-numeric: tabular-nums; }
.est-tempo-italian { min-height: 18px; margin: 4px 0 8px; color: var(--score-ink3); font-size: 10.5px; text-align: center; }
.est-tempo-range { width: 100%; height: 26px; margin: 0; accent-color: var(--score-accent); cursor: pointer; }
.est-tempo-range::-webkit-slider-runnable-track { height: 5px; border-radius: 4px; background: linear-gradient(to right, var(--score-accent) 0 var(--tempo-progress, 36%), var(--score-line-soft) var(--tempo-progress, 36%) 100%); }
.est-tempo-range::-webkit-slider-thumb { width: 22px; height: 22px; margin-top: -8.5px; border: 1px solid var(--score-line); border-radius: 50%; background: #FFF; box-shadow: 0 1px 4px rgba(0,0,0,.2); -webkit-appearance: none; }
.est-tempo-range { -webkit-appearance: none; }
.est-tempo-range::-moz-range-track { height: 5px; border-radius: 4px; background: var(--score-line-soft); }
.est-tempo-range::-moz-range-progress { height: 5px; border-radius: 4px; background: var(--score-accent); }
.est-tempo-range::-moz-range-thumb { width: 22px; height: 22px; border: 1px solid var(--score-line); border-radius: 50%; background: #FFF; box-shadow: 0 1px 4px rgba(0,0,0,.2); }
.est-tempo-limits { display: flex; justify-content: space-between; margin-top: -2px; color: var(--score-ink4); font-size: 10px; font-variant-numeric: tabular-nums; }
.est-tempo-presets { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; margin-top: 14px; }
.est-tempo-presets button { height: 38px; border: 1px solid var(--score-line); border-radius: 12px; background: var(--score-surface); color: var(--score-ink2); font-size: 11.5px; font-weight: 700; }
.est-tempo-presets button.is-on { border: 1.5px solid var(--score-accent); background: var(--score-accent-wash); color: var(--score-accent-ink); }
.est-tempo-change-sheet { display: grid; gap: 12px; }
.est-change-type { display: grid; grid-template-columns: 1fr 1fr; gap: 0; padding: 4px; border-radius: 20px; background: var(--score-seg-track); }
.est-change-type button { height: 36px; border: 0; border-radius: 17px; background: transparent; color: var(--score-ink2); font-size: 12px; font-weight: 600; }
.est-change-type button.is-on { background: var(--score-accent); color: var(--score-on-accent); }
.est-tempo-change-value { display: grid; grid-template-columns: 42px 1fr 42px; align-items: center; gap: 18px; padding: 6px 0 0; }
.est-tempo-change-value > button { width: 42px; height: 42px; border: 0; border-radius: 50%; background: var(--score-fill); color: var(--score-ink2); font-size: 22px; }
.est-tempo-change-value > div { display: grid; justify-items: center; gap: 3px; }
.est-tempo-change-value strong { color: var(--score-ink); font-size: 34px; line-height: 1; font-weight: 900; font-variant-numeric: tabular-nums; }
.est-tempo-change-value small { color: var(--score-ink3); font-size: 10px; font-weight: 600; font-variant-numeric: tabular-nums; }
.est-tempo-change-presets { display: flex; flex-wrap: wrap; gap: 7px; }
.est-tempo-change-presets button { min-width: 50px; height: 34px; padding: 0 12px; border: 1px solid var(--score-line); border-radius: 12px; background: var(--score-surface); color: var(--score-ink2); font-size: 10.5px; font-weight: 700; }
.est-tempo-change-presets button.is-on { border-color: var(--score-accent); background: var(--score-accent-wash); color: var(--score-accent-ink); }
.est-sheet-hint { margin: 12px 0 14px; }

.est-key-sheet { padding-bottom: 4px; }
.est-key-modes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    width: max-content;
    margin: 0 0 12px auto;
    padding: 3px;
    border-radius: 11px;
    background: var(--score-fill);
}
.est-key-modes button {
    min-width: 72px;
    height: 28px;
    padding: 0 14px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--score-ink2);
    font-size: 11.5px;
    font-weight: 600;
}
.est-key-modes button.is-on { background: var(--score-surface); color: var(--score-ink); font-weight: 700; box-shadow: 0 1px 2px rgba(30,28,25,.12); }
.est-key-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.est-key-choice {
    height: 76px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3px;
    border: 1px solid var(--score-ink4);
    border-radius: 15px;
    overflow: hidden;
    background: var(--score-bg);
    color: var(--score-ink);
}
.est-key-choice strong {
    max-width: 100%;
    overflow: hidden;
    font-size: 16px;
    line-height: 1.1;
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.est-key-choice span,
.est-key-choice small {
    max-width: 100%;
    margin-top: 1px;
    overflow: hidden;
    color: var(--score-ink3);
    font-size: 9.5px;
    line-height: 1.15;
    font-weight: 600;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.est-key-choice span:first-of-type { margin-top: 2px; }
.est-key-choice.is-on { border-color: var(--score-accent); background: var(--score-accent); color: var(--score-on-accent); }
.est-key-choice.is-on span,
.est-key-choice.is-on small { color: var(--score-on-accent); opacity: .66; }

.est-time-presets {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 7px;
}

.est-time-presets button {
    min-height: 72px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 2px;
    border: 1px solid var(--score-ink4);
    border-radius: 15px;
    background: var(--score-bg);
    color: var(--score-ink2);
    font-size: 12px;
    font-weight: 700;
}

.est-time-presets button strong { font-size: 18px; line-height: 1; font-variant-numeric: tabular-nums; }
.est-time-presets button i { width: 25px; height: 1.5px; background: currentColor; }
.est-time-presets button.is-on { border-color: var(--score-accent); background: var(--score-accent-wash); color: var(--score-accent-ink); }
.est-time-custom { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.est-time-stepper,
.est-time-denominator { padding: 9px 10px 10px; border: 1px solid var(--score-line); border-radius: 14px; background: var(--score-surface); }
.est-time-stepper > small,
.est-time-denominator > small { display: block; margin-bottom: 8px; color: var(--score-ink3); font-size: 10px; font-weight: 700; }
.est-time-stepper > div { display: grid; grid-template-columns: 38px 1fr 38px; gap: 4px; }
.est-time-stepper button,
.est-time-denominator button { height: 34px; border: 0; border-radius: 10px; background: var(--score-fill); color: var(--score-ink2); font-size: 15px; font-weight: 700; }
.est-time-stepper input { width: 100%; min-width: 0; height: 34px; padding: 0 3px; border: 0; outline: 0; background: transparent; color: var(--score-ink); font-size: 17px; font-weight: 800; text-align: center; appearance: textfield; }
.est-time-stepper input::-webkit-inner-spin-button { appearance: none; }
.est-time-denominator > div { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.est-time-denominator button.is-on { background: var(--score-accent); color: var(--score-on-accent); }

/* EMMU共通の確認ボトムシート。FlutterのThreeButtonBottomSheetと同寸法。 */
.est-sheet-backdrop.is-confirm {
    padding: 0 32px max(28px, env(safe-area-inset-bottom));
    background: transparent;
}

.est-sheet.is-confirm {
    width: min(240px, calc(100vw - 64px));
    max-height: 72vh;
    border: 1px solid rgba(255,255,255,.64);
    border-radius: 30px;
    background: rgba(216,216,216,.82);
    box-shadow: 0 12px 28px rgba(0,0,0,.22);
    backdrop-filter: blur(24px);
}

[data-theme="dark"] .est-sheet.is-confirm {
    border-color: rgba(255,255,255,.16);
    background: rgba(0,0,0,.72);
    box-shadow: 0 12px 28px rgba(255,255,255,.34);
}

.est-sheet.is-confirm .est-sheet-handle { display: none; }
.est-sheet.is-confirm > header { min-height: 0; padding: 22px 28px 0; }
.est-sheet.is-confirm > header h2 { font-size: 16px; line-height: 1.375; font-weight: 600; }
.est-sheet.is-confirm > header button { display: none; }
.est-sheet.is-confirm .est-sheet-body { padding: 0 16px 16px; }
.est-sheet.is-confirm .est-confirm-text { margin: 8px 12px 0; font-size: 12px; line-height: 1.5; }
.est-sheet.is-confirm .est-sheet-actions { gap: 8px; margin-top: 18px; }
.est-sheet.is-confirm .est-sheet-action,
.est-sheet.is-confirm .est-primary {
    min-height: 48px;
    justify-content: center;
    padding: 11px 14px;
    border-radius: 24px;
    background: #FFF;
    box-shadow: none;
    color: var(--score-ink);
    font-size: 16px;
    line-height: 1.375;
    font-weight: 600;
    text-align: center;
}
[data-theme="dark"] .est-sheet.is-confirm .est-sheet-action,
[data-theme="dark"] .est-sheet.is-confirm .est-primary { background: #333; color: #FFF; }
.est-sheet.is-confirm .est-sheet-action.is-danger { color: var(--score-danger); }
.est-sheet.is-confirm .est-sheet-action:disabled { opacity: .45; }
.est-sheet.is-confirm .est-sheet-action small { display: none; }

@media (min-width: 1140px) {
    .est-sheet-backdrop.is-confirm { align-items: center; padding: 32px; }
}

.est-transpose-sheet { display: grid; gap: 14px; padding-bottom: 4px; }
.est-transpose-keys { display: grid; grid-template-columns: 1fr 32px 1fr; align-items: center; gap: 9px; padding: 13px; border-radius: 17px; background: var(--score-fill); text-align: center; }
.est-transpose-keys span { display: grid; gap: 4px; }
.est-transpose-keys small { color: var(--score-ink3); font-size: 9px; font-weight: 700; }
.est-transpose-keys strong { color: var(--score-ink); font-size: 15px; }
.est-transpose-keys img { width: 24px; height: 24px; opacity: .7; }
[data-theme="dark"] .est-transpose-keys img { filter: invert(1); }
.est-stepper { display: grid; grid-template-columns: 48px 1fr 48px; align-items: center; gap: 8px; }
.est-stepper button { height: 44px; border: 0; border-radius: 14px; background: var(--score-fill); color: var(--score-ink); font-size: 22px; }
.est-stepper strong { color: var(--score-accent-ink); font-size: 22px; text-align: center; }
.est-transpose-presets { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.est-transpose-presets button { height: 34px; padding: 0; border: 1px solid var(--score-line); border-radius: 11px; background: var(--score-surface); color: var(--score-ink2); font-size: 10px; font-weight: 700; }
.est-transpose-presets button.is-on { border-color: var(--score-accent); background: var(--score-accent); color: var(--score-on-accent); }

.est-print-header { grid-template-columns: 42px 1fr auto auto; padding-left: 16px; padding-right: 16px; }
.est-print-header h1 { text-align: left; }
.est-print-header > button:not(.est-icon-btn) { height: 36px; padding: 0 13px; border: 1px solid var(--score-line); border-radius: 12px; background: var(--score-surface); color: var(--score-ink2); font-size: 11px; font-weight: 700; }
.est-print-wrap { min-height: calc(100vh - 54px); overflow: auto; padding: 20px; background: #D7D5D1; }
.est-print-document { min-width: 595px; display: grid; gap: 20px; justify-items: center; }
.est-print-page { width: min(100%, 794px); aspect-ratio: 595 / 842; margin: 0 auto; padding: 0; background: #FFF; box-shadow: 0 4px 22px rgba(0,0,0,.18); color: #111; }
.est-print-page svg { width: 100%; height: auto; }

/* Flutter版MoreMenuSheet。値チップと操作行を同じ順序・SVGで表示する。 */
.est-sheet.is-menu { background: var(--score-surface); }
.est-sheet.is-menu > header { display: none; }
.est-sheet.is-menu .est-sheet-body { padding: 0 0 max(8px, env(safe-area-inset-bottom)); }

.est-help-backdrop {
    position: fixed;
    inset: 0;
    z-index: 218;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 28px;
    background: rgba(0, 0, 0, .54);
}
.est-help-backdrop[hidden] { display: none; }
.est-help-dialog {
    width: min(440px, 100%);
    padding: 24px 22px 18px;
    border: 1px solid var(--score-line);
    border-radius: 20px;
    background: var(--score-surface);
    color: var(--score-ink);
    box-shadow: 0 18px 54px rgba(0, 0, 0, .24);
}
.est-help-dialog > header { display: flex; align-items: center; }
.est-help-dialog > header span,
.est-help-dialog > header output { color: var(--score-ink3); font-size: 10.5px; font-weight: 600; }
.est-help-dialog > header output { margin-left: auto; font-variant-numeric: tabular-nums; }
.est-help-visual {
    height: 84px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 18px;
    border-radius: 16px;
    background: var(--score-bg);
    color: var(--score-accent);
}
.est-help-visual svg { width: 40px; height: 40px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.est-help-note-row { display: flex; align-items: center; gap: 10px; }
.est-help-note-row .est-music { color: var(--score-ink3); font-size: 30px; }
.est-help-note-row .est-music.is-current { color: var(--score-accent); }
.est-help-dialog h2 { margin: 16px 0 0; font-size: 17px; line-height: 1.45; font-weight: 800; }
.est-help-dialog > p { min-height: 58px; margin: 8px 0 0; color: var(--score-ink2); font-size: 13px; line-height: 1.65; }
.est-help-dialog > footer { display: flex; align-items: center; margin-top: 18px; }
.est-help-dots { display: flex; align-items: center; gap: 5px; }
.est-help-dot { width: 6px; height: 6px; border-radius: 3px; background: var(--score-line); transition: width .18s ease, background .18s ease; }
.est-help-dot.is-on { width: 18px; background: var(--score-accent); }
.est-help-skip,
.est-help-next { border: 0; font-weight: 700; cursor: pointer; }
.est-help-skip { margin-left: auto; padding: 8px 10px; background: transparent; color: var(--score-ink3); font-size: 12px; }
.est-help-next { min-width: 76px; height: 40px; margin-left: 6px; padding: 0 18px; border-radius: 12px; background: var(--score-accent); color: var(--score-on-accent); font-size: 13.5px; }
@media (max-width: 420px) {
    .est-help-backdrop { padding-inline: 20px; }
    .est-help-dialog { padding-inline: 18px; }
}
.est-score-menu { padding: 0 0 4px; }
.est-score-menu-label {
    margin: 0;
    padding: 6px 22px;
    color: var(--score-ink3);
    font-size: 10.5px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: .63px;
}
.est-score-menu-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 2px 20px 8px; }
.est-score-menu-values button {
    height: 56px;
    display: grid;
    align-content: center;
    gap: 5px;
    padding: 6px;
    border: 0;
    border-radius: 14px;
    background: var(--score-bg);
    color: var(--score-ink);
}
.est-score-menu-values small { color: var(--score-ink3); font-size: 9.5px; line-height: 1; font-weight: 600; }
.est-score-menu-values strong { overflow: hidden; font-size: 15px; line-height: 1; font-weight: 700; white-space: nowrap; text-overflow: ellipsis; }
.est-score-menu-row {
    width: 100%;
    height: 44px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 22px;
    border: 0;
    background: transparent;
    color: var(--score-ink);
    text-align: left;
    font-size: 15px;
    line-height: 1;
    font-weight: 400;
}
.est-score-menu-row > img { width: 19px; height: 19px; flex: none; object-fit: contain; }
.est-history-menu-icon { width: 19px; flex: none !important; color: var(--score-ink2); font-size: 21px; text-align: center; }
.est-score-menu-row > span { flex: 1; }
.est-score-menu-row > small { margin-right: -5px; color: var(--score-ink3); font-size: 12.5px; font-weight: 600; }
.est-score-menu-row > b { padding: 5px 8px; border-radius: 7px; background: var(--score-accent-wash); color: var(--score-accent-ink); font-size: 10px; }
.est-score-menu-row > img.is-chevron { width: 12px; height: 12px; }
.est-score-menu-row.is-danger { color: var(--score-danger); }
.est-score-menu-row:disabled { opacity: .35; }
.est-score-menu hr { height: 1px; margin: 6px 22px; border: 0; background: var(--score-line-soft); }

.est-history-list { padding-bottom: 5px; }
.est-history-list .est-score-menu-label { padding-inline: 2px; margin-bottom: 7px; }
.est-history-list .est-group-card:disabled { opacity: .45; cursor: default; }
.est-history-icon {
    width: 44px;
    height: 44px;
    flex: none;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: var(--score-fill);
    color: var(--score-accent-ink);
    font-size: 13px;
    font-weight: 800;
}
.est-history-note {
    margin: 10px 2px 0;
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--score-bg);
    color: var(--score-ink2);
    font-size: 10.5px;
    line-height: 1.5;
}

.est-toast {
    position: fixed;
    left: 50%;
    bottom: max(28px, env(safe-area-inset-bottom));
    z-index: 11000;
    max-width: min(90vw, 480px);
    padding: 11px 15px;
    border-radius: 12px;
    transform: translateX(-50%);
    background: var(--score-ink);
    box-shadow: 0 8px 28px rgba(0,0,0,.24);
    color: var(--score-bg);
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.est-toast.is-error { background: var(--score-danger); color: #FFF; }

.est-loading {
    position: fixed;
    inset: 0;
    z-index: 12000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--score-bg) 78%, transparent);
    backdrop-filter: blur(3px);
}

.est-loading span { width: 36px; height: 36px; border: 3px solid var(--score-line); border-top-color: var(--score-accent); border-radius: 50%; animation: est-spin .8s linear infinite; }
.est-loading p { margin: 10px 0 0; color: var(--score-ink2); font-size: 12px; }

.emmu-score.is-fullscreen .est-editor {
    position: fixed;
    inset: 0;
    z-index: 9000;
    width: 100%;
    height: 100%;
    max-width: none;
}

.emmu-score.is-fullscreen .est-editor-header,
.emmu-score.is-fullscreen .est-grand-row,
.emmu-score.is-fullscreen .est-accidental-row,
.emmu-score.is-fullscreen .est-toolbar,
.emmu-score.is-fullscreen .est-playback-panel,
.emmu-score.is-fullscreen .est-score-hint { display: none !important; }
.emmu-score.is-fullscreen .est-transport { display: none; }
.emmu-score.is-fullscreen .est-fullscreen-bar { display: grid; }
.emmu-score.is-fullscreen .est-editor { background: var(--score-bg); }
.emmu-score.is-fullscreen .est-score-scroll { height: 100vh; max-height: none; overflow: auto; }
.emmu-score.is-fullscreen .est-score-scroll { padding-top: 68px; }
.emmu-score.is-fullscreen .est-copyright { display: flex; }
.emmu-score.is-fullscreen.is-playhead-hidden .esr-playhead { display: none; }
.emmu-score.is-fullscreen.is-landscape .est-editor { transform: rotate(90deg); transform-origin: center; width: 100vh; height: 100vw; left: calc((100vw - 100vh) / 2); top: calc((100vh - 100vw) / 2); }

@media (max-width: 620px) {
    .est-library { padding-left: 12px; padding-right: 12px; }
    .est-library-header .est-icon-btn { width: 36px; height: 36px; }
    .est-segments button { padding: 0 9px; font-size: 11px; }
    .est-card-chip:nth-of-type(3) { display: none; }
    .est-editor-header .est-icon-btn { width: 34px; height: 38px; }
    .est-editor-title strong { font-size: 14px; }
    .est-transport { gap: 5px; padding-left: 7px; padding-right: 7px; }
    .est-tools-grid { gap: 5px; }
    .est-tools-grid button { height: 56px; border-radius: 16px; }
    .est-select-grid { grid-template-columns: repeat(7, minmax(38px, 1fr)); }
    .est-select-grid button > span:not(.est-music) { font-size: 13px; }
    .est-chord-grid { grid-template-columns: repeat(5, minmax(46px, 1fr)); }
    .est-playback-options { grid-template-columns: minmax(0, 1fr) 82px; }
    .est-policy-term { grid-template-columns: 1fr; gap: 5px; }
}

@media (min-width: 769px) {
    #scoreFullscreenRotate { display: none; }
}

@media (max-height: 760px) {
    .est-tools-grid button { height: 51px; }
    .est-toolbar { padding-top: 6px; }
    .est-mode-tabs { margin-bottom: 6px; }
    .est-selected-bar { min-height: 43px; }
}

@media print {
    @page { size: A4 portrait; margin: 0; }
    body.tools-score-page { margin: 0 !important; padding: 0 !important; background: #FFF !important; }
    /* 非表示にした画面やプレビューの余白で、末尾に空白ページを作らない。 */
    body.tools-score-page *:has(#scorePrintPreview) { display: contents !important; }
    body.tools-score-page *:not(:has(#scorePrintPreview)):not(#scorePrintPreview):not(#scorePrintPreview *) { display: none !important; }
    body.tools-score-page * { visibility: hidden; }
    #scorePrintPreview, #scorePrintPreview * { visibility: visible; }
    #scorePrintPreview { position: static; width: 210mm; min-width: 0; display: block; margin: 0; padding: 0; background: #FFF; }
    #scorePrintPreview .est-print-page { width: 210mm; height: 297mm; break-after: page; page-break-after: always; margin: 0; box-shadow: none; }
    #scorePrintPreview .est-print-page:last-child { break-after: auto; page-break-after: auto; }
    #scorePrintPreview svg { display: block; width: 100%; height: 100%; }
}