/* MusicFrame 2026-10-18: compact, single-flow workspace */
html,body,#root{min-width:0;min-height:0!important;height:auto!important;overflow-x:clip}
.app-shell{min-height:0!important;padding-bottom:24px!important}
.app-shell .topbar{position:relative!important;top:auto!important;min-height:62px;padding:12px clamp(16px,3vw,36px);gap:12px}
.app-shell .workspace-mode-button{display:none}
.app-shell .studio-grid{display:flex!important;flex-direction:column;width:min(1180px,calc(100% - 40px))!important;gap:16px!important;margin:0 auto;padding:18px 0 24px!important;min-width:0}
.app-shell .studio-grid>*{min-width:0;width:100%;box-sizing:border-box}
.app-shell .session-overview{min-height:0!important;grid-template-columns:minmax(0,1fr) minmax(290px,360px)!important;align-items:center;gap:24px;padding:24px 28px!important;border-radius:16px}
.app-shell .session-copy h1{font-size:clamp(28px,3.7vw,44px)!important;line-height:1.08;margin:6px 0 10px}
.app-shell .session-copy p{font-size:12px;line-height:1.7;max-width:620px;margin:0}
.app-shell .session-copy .eyebrow{font-size:9px}
.app-shell .session-specs{min-width:0!important;width:100%;margin:0!important;align-self:center}
.app-shell .session-specs div{padding:12px}
.app-shell .session-specs dd{font-size:12px}
.app-shell .workspace-tab-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:12px;align-items:stretch;position:static!important}
.app-shell .workspace-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:6px}
.app-shell .workspace-tabs button{min-width:0;min-height:60px!important;padding:10px 12px!important}
.app-shell .workspace-tabs small{font-size:10px}
.app-shell .workspace-quick-toggles{display:flex;gap:6px}
.app-shell .workspace-check{min-width:95px;min-height:60px;padding:10px!important}
.app-shell .easy-mode-shell{padding:0!important;gap:0!important;border-radius:16px;overflow:visible}
.app-shell .easy-mode-hero{padding:18px 22px!important;gap:16px}
.app-shell .easy-mode-hero h2{font-size:25px!important;line-height:1.2;margin:4px 0 8px}
.app-shell .easy-mode-hero p{font-size:12px;line-height:1.6}
.app-shell .easy-mode-layout{display:grid!important;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)!important;gap:0!important;align-items:start}
.app-shell .easy-genre-rail.mf-quick-selects{grid-column:1;grid-row:1;display:grid!important;gap:16px;max-height:none;overflow:visible;padding:22px!important;border:0!important}
.mf-quick-selects label{display:grid;gap:8px;min-width:0}.mf-quick-selects label>span{font-size:12px;font-weight:700;color:var(--studio-muted,#a3adbd)}
.mf-quick-selects select{width:100%;min-width:0;min-height:48px;padding:10px 34px 10px 12px;border:1px solid var(--studio-line,#343b4b);border-radius:10px;background:var(--studio-surface,#111522);color:var(--studio-ink,#eef2ff);font:inherit;font-size:14px}
.app-shell .easy-reference-stage.mf-foldout{grid-column:1;grid-row:2;max-height:none!important;overflow:visible!important;margin:0 22px 22px;padding:0!important;width:auto!important;border-radius:10px!important}
.app-shell .easy-reference-stage>.easy-column-label{display:none}
.app-shell .easy-reference-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px;padding:12px}
.app-shell .easy-reference-grid button{min-height:106px!important;min-width:0;padding:12px!important}
.app-shell .easy-reference-grid small{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5}
.app-shell .easy-compose-panel{grid-column:2;grid-row:1 / span 2;order:0!important;position:static!important;top:auto;min-height:0!important;width:auto!important;align-self:stretch;padding:22px!important;border-left:1px solid var(--studio-line)!important;border-top:0!important;border-bottom:0!important;border-radius:0 0 16px 0!important}
.app-shell .easy-compose-head{padding-bottom:10px!important;margin-bottom:14px}
.app-shell .easy-compose-head strong{font-size:18px!important}
.app-shell .easy-input-block{margin:0 0 14px!important}
.app-shell .easy-input-block textarea{min-height:100px!important;max-height:280px}
.app-shell .easy-reference-preview{margin:14px 0!important;padding:12px!important}
.app-shell .easy-reference-preview p{font-size:11px;line-height:1.7;overflow-wrap:anywhere}
.app-shell .easy-mode-actions,.app-shell .studio-grid[data-workspace=easy] .easy-mode-actions{position:static!important;inset:auto!important;width:100%!important;transform:none!important;margin:16px 0 0!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
.app-shell .generate-button{min-height:46px!important;border-radius:10px!important;padding:12px 18px!important;white-space:normal;font-size:14px;font-weight:750}
.app-shell .easy-mode-actions .generate-button{width:100%!important}
.app-shell .mf-foldout{display:block!important;padding:0;border:1px solid var(--studio-line,#343b4b);border-radius:12px;background:var(--studio-surface,#111522);color:var(--studio-ink,#eef2ff);min-width:0;box-shadow:none}
.app-shell .mf-foldout>summary{padding:15px 16px;font-size:13px;line-height:1.5;cursor:pointer;list-style-position:inside;user-select:none;overflow-wrap:anywhere}
.app-shell .mf-foldout>summary strong{font-size:13px}.app-shell .mf-foldout>summary span{display:inline;margin-left:12px;color:var(--studio-muted,#a3adbd);font-size:11px;font-weight:400}
.app-shell .mf-foldout:not([open])>:not(summary){display:none!important}
.app-shell .mf-foldout[open]>summary{border-bottom:1px solid var(--studio-line,#343b4b)}
.app-shell .mf-guide{margin:0;background:transparent}.app-shell .mf-guide>summary{padding:10px 14px;font-size:12px;color:var(--studio-muted,#a3adbd)}.mf-guide>div{padding:4px 16px 16px;font-size:12px;line-height:1.85}.mf-guide p{margin:10px 0}.mf-guide a{color:var(--studio-cyan,#67e8f9)}.mf-guide small{display:block;margin-top:10px;opacity:.65}
.app-shell .settings-grid.advanced-mode{display:block!important}
.app-shell .direction-panel{display:flex!important;flex-direction:column;gap:16px;padding:20px!important;min-width:0}
.app-shell .studio-command-strip{order:0;padding:16px;min-width:0}.app-shell .studio-waveform{display:none}
.app-shell .mf-section-heading{order:1;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.mf-section-heading h2{font-size:20px}.mf-section-heading .generate-button{flex:0 0 auto}
.app-shell .sound-board-fields{order:2}.app-shell .sound-preset-grid{order:3;display:block!important}.app-shell .lyric-craft-board{order:4}
.app-shell .sound-matrix-head,.app-shell .lyric-craft-head{padding:14px 16px}
.app-shell .sound-matrix>.matrix-category-rail,.app-shell .sound-matrix>.matrix-workspace{margin:14px}
.app-shell .lyric-craft-main,.app-shell .meta-tag-preview{padding:14px}
.app-shell .advanced-settings-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px}
.app-shell .advanced-section-head{padding:14px 14px 0}.app-shell .advanced-section>.field-grid{padding:14px}
.app-shell .slider-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.app-shell .field-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.app-shell .result-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}.app-shell .result-tabs button{flex:1 1 auto;min-height:42px;white-space:nowrap;font-size:12px}
.app-shell .result-title h2{font-size:30px}.mf-score-note{display:block;color:var(--studio-muted,#a3adbd);font-size:11px;line-height:1.65;margin-top:10px}
.app-shell .result-tab-panel{min-width:0}.mf-simple-output{margin-bottom:16px}.mf-simple-output>p{padding:0 16px 14px;font-size:12px;line-height:1.7}
.app-shell .mini-specs{grid-template-columns:repeat(6,minmax(0,1fr))!important}.app-shell .result-actions{justify-content:flex-end}
.app-shell .console-panel{position:static!important;max-height:none!important;min-height:0!important;padding:0!important}.app-shell .console-panel:has(.api-status):not(:has(button)){opacity:.8}
.app-shell input,.app-shell textarea,.app-shell select{max-width:100%;box-sizing:border-box}.app-shell button:focus-visible,.app-shell summary:focus-visible,.app-shell select:focus-visible{outline:2px solid var(--studio-cyan,#67e8f9);outline-offset:3px}
@media(max-width:900px){.app-shell .session-overview{grid-template-columns:minmax(0,1fr)!important;padding:22px!important;gap:16px}.app-shell .session-specs{max-width:none}.app-shell .workspace-tab-row{grid-template-columns:1fr!important}.app-shell .workspace-quick-toggles{justify-content:flex-end}.app-shell .workspace-check{min-height:42px;flex:1}.app-shell .advanced-settings-panel{grid-template-columns:1fr!important}.app-shell .slider-grid{grid-template-columns:1fr!important}}
@media(max-width:640px){.app-shell .studio-grid{width:calc(100% - 24px)!important;gap:12px!important;padding-top:12px!important}.app-shell .topbar{padding:10px 12px;flex-wrap:wrap}.app-shell .brand img{width:32px;height:32px}.app-shell .top-actions{gap:5px;flex-wrap:wrap}.app-shell .top-actions button{padding:8px;font-size:11px}.app-shell .session-overview{padding:18px!important;gap:14px;border-radius:12px}.app-shell .session-copy h1{font-size:29px!important}.app-shell .session-copy p{display:none}.app-shell .session-specs div{padding:10px 8px}.app-shell .session-specs dd{font-size:11px}.app-shell .workspace-tabs button{padding:10px 6px!important;min-height:56px!important;gap:4px}.app-shell .workspace-tabs small{display:none}.app-shell .easy-mode-hero{padding:16px!important;display:block}.app-shell .easy-mode-hero h2{font-size:22px!important}.app-shell .easy-mode-current{margin-top:10px;min-width:0}.app-shell .easy-mode-layout{grid-template-columns:minmax(0,1fr)!important}.app-shell .easy-genre-rail.mf-quick-selects{grid-column:1;grid-row:1;padding:16px!important;gap:12px}.app-shell .easy-reference-stage.mf-foldout{grid-column:1;grid-row:2;margin:0 16px 16px}.app-shell .easy-compose-panel{grid-column:1;grid-row:3;padding:16px!important;border-left:0!important;border-top:1px solid var(--studio-line)!important;border-radius:0 0 16px 16px!important}.app-shell .easy-reference-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.app-shell .mf-foldout>summary span{display:block;margin:4px 0 0 15px}.app-shell .direction-panel{padding:14px!important;gap:12px}.app-shell .studio-command-strip{display:block;padding:12px}.app-shell .studio-command-specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.app-shell .studio-command-specs>div{min-width:0}.app-shell .mf-section-heading{display:block}.mf-section-heading .generate-button{width:100%;margin-top:10px}.app-shell .field-grid.compact{grid-template-columns:1fr!important}.app-shell .mini-specs{grid-template-columns:repeat(3,minmax(0,1fr))!important}.app-shell .workspace-output-panel{padding:14px!important}.app-shell .result-title h2{font-size:26px}.app-shell .result-tabs button{flex:1 1 40%}.app-shell .api-popover{position:absolute;right:0;width:min(340px,calc(100vw - 28px))}.mf-guide>div{padding:0 12px 12px}}

.app-shell .session-copy .eyebrow{display:none}.app-shell .session-copy h1{font-size:clamp(27px,3vw,36px)!important}.app-shell .session-copy p{display:none!important}.app-shell .session-overview{padding:20px 24px!important}.app-shell .easy-mode-current{display:none!important}.app-shell .easy-mode-hero{padding:16px 22px!important}.app-shell .easy-mode-hero h2{font-size:22px!important}.app-shell .easy-mode-layout{grid-template-rows:min-content 1fr!important}.mf-intent-status{font-size:10px;font-weight:700;border-radius:5px;padding:4px 6px;color:var(--studio-cyan,#67e8f9);background:#67e8f914}@media(max-width:640px){.app-shell .session-copy h1{font-size:27px!important}.app-shell .session-overview{padding:16px!important}.app-shell .easy-mode-layout{grid-template-rows:auto auto auto!important}}
