.header-right{align-items:center}.header-action{width:auto;min-width:44px;padding:0 10px;font:600 .85rem Inter,system-ui,sans-serif}
.header-center{min-width:0}.header-center h1{font-size:1.25rem}.header-content{gap:16px}
#appStatus{max-width:1000px;margin:0 auto;padding:0 16px}#appStatus:empty{display:none}
.export-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.export-actions select{flex:1;min-width:160px}.export-actions .pri{width:auto;flex:1;min-width:160px}.export-actions label{font-weight:700;font-size:.9rem}
.app-dialog{width:min(680px,calc(100% - 32px));max-height:85dvh;overflow:auto;margin:auto;padding:24px;border:1px solid var(--border-color);border-radius:16px;background:var(--bg-secondary);color:var(--text-primary);box-shadow:var(--card-shadow)}
.app-dialog::backdrop{background:rgba(0,0,0,.5)}
.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}.dialog-heading h2{font-size:1.3rem;font-weight:700}.dialog-close{border:0;background:transparent;color:var(--text-primary);font-size:1.5rem;min-width:44px;min-height:44px;cursor:pointer}
.dialog-form{display:grid;gap:16px}.dialog-form label{display:grid;gap:6px;font-weight:700;font-size:.9rem}.dialog-form input:not([type=range]),.dialog-form select{width:100%;text-align:left;min-width:0;font:inherit;border:1px solid var(--border-color);border-radius:10px;padding:10px;background:var(--bg-primary);color:var(--text-primary)}
.dialog-form .mute{font-weight:400}.dialog-divider{border:0;border-top:1px solid var(--border-color);margin:20px 0}.dialog-row{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.dialog-row label{flex:1;min-width:140px}.dialog-row .btn{padding:.75rem 1rem;min-height:44px}
#savedLoops{display:grid;gap:12px;margin-top:20px}.saved-loop{display:flex;gap:8px;flex-wrap:wrap;align-items:center;border:1px solid var(--border-color);border-radius:12px;padding:12px}.saved-loop>div{flex:1;min-width:180px;overflow-wrap:anywhere}.saved-loop .btn{padding:.6rem .8rem}.saved-loop .mute{font-size:.8rem;margin-top:6px}.saved-loop strong{font-size:.95rem}
[data-theme="dark"]{color-scheme:dark;--accent-hover:#fcd34d;--accent-light:rgba(251,191,36,.14)}
[data-theme="dark"] body{background:linear-gradient(135deg,#1f2937,#111827)}
[data-theme="dark"] .header-center h1{background-image:linear-gradient(45deg,#fbbf24,#fde68a,#f59e0b)}
[data-theme="dark"] .pri,[data-theme="dark"] #play,[data-theme="dark"] .btn:not(.btn-secondary){color:#1f2937}
[data-theme="dark"] .export-plan text{fill:var(--text-primary)}
.btn:hover{color:#fff}[data-theme="dark"] .btn:hover{color:#1f2937}
@media(max-width:640px){.header-content{flex-wrap:wrap;gap:10px}.header-center{order:-1;flex-basis:100%}.header-left{margin-right:auto}.header-action{font-size:.8rem}.app-dialog{padding:16px}.dialog-row .btn{flex:1}.header-center .subtitle{font-size:.8rem}}

[data-theme="dark"] .export-plan rect[fill="#fde68a"]+text,[data-theme="dark"] .export-plan rect[fill="#fbbf24"]+text{fill:#1f2937}

.export-types{border:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;min-width:0}.export-types legend{font-weight:700;padding:0 0 12px}.format-choice{border:1px solid var(--border-color);border-radius:12px;padding:12px;min-width:0}.format-choice-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.format-choice-heading label{display:flex;align-items:center;gap:8px;font-weight:700;cursor:pointer;min-height:32px}.format-choice input{width:18px;height:18px;accent-color:var(--accent-color)}.format-choice .mute{font-size:.8rem;margin-top:6px}.format-choice .control-help{margin-top:10px;font-size:.8rem}.format-choice:has(input:checked){border-color:var(--accent-hover);background:var(--accent-light)}
@media(max-width:560px){.export-types{grid-template-columns:1fr}}

.button-icon{width:20px;height:20px;flex:none;fill:none;vertical-align:middle}.header-action{display:inline-flex;align-items:center;justify-content:center;gap:9px}.header-action .button-icon{width:26px;height:26px}.file-actions .btn,#dl{display:inline-flex;align-items:center;justify-content:center;gap:9px}.theme-sun{display:none}[data-theme="dark"] .theme-sun{display:block}[data-theme="dark"] .theme-moon{display:none}@media(max-width:560px){.header-action .button-icon{width:24px;height:24px}.header-action{gap:7px}}

.export-types{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:560px){.export-types{grid-template-columns:1fr}}