/* All creation controls share one rounded, consistent surface. */
#studioPage .mn-refined-composer{z-index:10;max-width:900px;padding:20px!important;border-radius:28px!important;border-color:#e4e3ef!important;background:linear-gradient(150deg,#fff 20%,#fdfcff)!important;box-shadow:0 22px 62px -22px #3e357c26,0 3px 12px #27365306!important;transform:none!important}
.mn-composer-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 6px 15px;color:#51566d;font-size:13px;font-weight:650}
.mn-composer-heading>span:first-child{display:inline-flex;align-items:center;gap:8px}
.mn-composer-heading svg{width:17px;height:17px;color:#8172d9}
.mn-composer-badge{padding:5px 9px;border:1px solid #ece8f8;border-radius:99px;color:#a097ba;background:#faf8ff;font-size:9px;letter-spacing:.1em;font-weight:600}
.mn-prompt-surface{padding:14px 16px;border:1px solid #efedf5;border-radius:20px;background:linear-gradient(130deg,#f9f9fc,#fcfbff);transition:background .2s,border-color .2s,box-shadow .2s}
.mn-prompt-surface:focus-within{border-color:#ded7f8;background:#fdfcff;box-shadow:inset 0 1px 3px #79709b04}
body #studioPage #prompt,body #studioPage #prompt:hover,body #studioPage #prompt:focus{display:block;min-height:105px!important;max-height:340px;padding:0!important;border:0!important;border-radius:13px!important;outline:none!important;box-shadow:none!important;background:transparent!important;color:#36364c!important;font-size:15px!important;line-height:1.85!important;animation:none!important;resize:none!important}
body #studioPage #prompt::placeholder{color:#a5a3b4!important}
.mn-refined-composer .composer-tools{position:relative;gap:12px!important;margin:16px 0 0!important;min-height:44px!important}
.mn-refined-composer .composer-left{flex:1;gap:9px!important;flex-wrap:wrap}
.mn-refined-composer #uploadReference{height:42px;min-height:42px!important;padding:0 13px;border:1px solid #e9e5f1!important;border-radius:14px!important;color:#666477;background:#fff!important;font-size:12px;font-weight:550;box-shadow:0 2px 4px #29233b03}
.mn-refined-composer #uploadReference svg{width:16px;height:16px;color:#8a7cba}
.mn-refined-composer #uploadReference:hover{background:#f8f6ff!important;border-color:#d8cef2!important;box-shadow:0 3px 12px #8c76c510}
.mn-refined-composer #referenceName{max-width:110px;font-size:10px}
#studioPage .mn-refined-composer #generateButton{display:inline-flex;align-items:center;justify-content:center;gap:13px;flex-shrink:0;height:44px;min-height:44px!important;padding:0 20px!important;border:1px solid #7863d0;border-radius:15px!important;background:linear-gradient(115deg,#6854c7,#8873db)!important;color:white;font-size:13px;font-weight:650;box-shadow:0 7px 18px #7962ce30,inset 0 1px 0 #ffffff35!important;transition:box-shadow .2s,transform .2s,opacity .2s}
#studioPage .mn-refined-composer #generateButton:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 24px #7962ce45!important}
#studioPage .mn-refined-composer #generateButton:disabled{opacity:.45;box-shadow:0 3px 10px #7962ce12!important}
.mn-refined-composer .composer-foot{gap:10px!important;margin:13px 3px 0!important;padding:0!important;border:0!important;min-height:18px}
.mn-refined-composer #composerHint{display:none}
.mn-composer-save{display:inline-flex;align-items:center;gap:6px;color:#9692a5;font-size:10px}
.mn-composer-save i{width:5px;height:5px;border-radius:50%;background:#7cb8aa}
.mn-refined-composer .composer-foot .composer-hint{color:#aaa6b8;font-size:10px}
.mn-refined-composer>.mn-electric-frame{inset:-1px!important;border-radius:29px!important;opacity:.32!important}
.mn-refined-composer>.mn-electric-frame:before{padding:2px}
.mn-refined-composer>.mn-electric-frame:after{width:6px;height:6px;offset-path:inset(1px round 28px);box-shadow:0 0 8px #8baaf980,0 0 16px #a99cfa66}
.mn-refined-composer:focus-within>.mn-electric-frame{opacity:.75!important}
.mn-refined-composer .reference-preview{margin:13px 0 0;padding:9px 11px;border:1px solid #e5dfef;border-radius:14px;background:#faf8fd}
.mn-refined-composer .reference-preview img{width:42px;height:42px;border-radius:10px}
.mn-refined-composer .remove-reference{border-radius:9px}
.mn-refined-composer .remove-reference:hover{background:#f6e9ee}
.mn-quick-actions{display:none!important}
#studioPage:not(.has-output) .work-grid,#studioPage .mn-prompt-gallery{max-width:900px}
#studioPage:not(.has-output) .right-stack{grid-template-columns:1fr!important}
#studioPage.has-output .work-grid{grid-template-columns:minmax(0,1fr) 285px}
.mn-model-picker{position:relative;min-width:0;max-width:100%;z-index:30}
.mn-model-trigger{display:flex;align-items:center;gap:8px;min-width:0;max-width:320px;height:42px;padding:0 12px;border:1px solid #e7e0f3;border-radius:14px;color:#5f537e;background:linear-gradient(110deg,#faf8ff,#f4f1fb);font:inherit;font-size:12px;cursor:pointer;transition:background .2s,border-color .2s,box-shadow .2s}
.mn-model-trigger>svg:first-child{flex-shrink:0;width:17px;height:17px;color:#9181ba}
.mn-model-trigger>svg:last-child{flex-shrink:0;width:15px;height:15px;margin-left:2px;color:#a094b8;transition:transform .2s}
.mn-model-caption{padding-right:8px;border-right:1px solid #e5dff0;color:#a297b4;font-size:10px}
.mn-model-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.mn-model-trigger:hover,.mn-model-picker.is-open .mn-model-trigger{border-color:#cfc1e9;background:#f6f1ff;box-shadow:0 0 0 3px #9d86ce10}
.mn-model-picker.is-open .mn-model-trigger>svg:last-child{transform:rotate(180deg)}
.mn-model-trigger.is-unavailable{color:#a19aaa}
.mn-native-model{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;opacity:0!important;pointer-events:none!important}
.mn-model-panel{position:absolute;z-index:80;top:calc(100% + 10px);left:0;width:360px;max-width:calc(100vw - 36px);padding:15px;border:1px solid #e4deef;border-radius:22px;background:#fff;box-shadow:0 20px 60px #49366b26,0 4px 14px #3428490a;animation:mnModelReveal .18s ease both}
.mn-model-picker.opens-up .mn-model-panel{top:auto;bottom:calc(100% + 10px)}
.mn-model-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:2px 3px 14px}
.mn-model-panel-head strong{display:block;color:#494154;font-size:13px;font-weight:650}
.mn-model-panel-head div>span{display:block;margin-top:5px;color:#a19aaa;font-size:10px}
.mn-model-count{padding:5px 8px;border-radius:99px;background:#f5f1fb;color:#9d8eb4;font-size:10px;white-space:nowrap}
.mn-model-search{display:flex;align-items:center;gap:8px;min-height:42px;padding:0 12px;border:1px solid #e8e2f0;border-radius:14px;background:#f9f7fc;transition:border-color .2s,box-shadow .2s}
.mn-model-search>svg{flex-shrink:0;width:16px;height:16px;color:#a391bb}
body .mn-model-search input,body .mn-model-search input:focus{min-width:0;width:100%;height:40px;padding:0;border:0!important;border-radius:12px!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#554963;font-size:12px;animation:none!important}
.mn-model-search input::placeholder{color:#ada3b8}
.mn-model-search:focus-within{border-color:#bda9df;box-shadow:0 0 0 3px #a78ccd12}
.mn-model-search input::-webkit-search-cancel-button{cursor:pointer}
.mn-model-options{display:grid;gap:3px;max-height:230px;overflow-y:auto;overscroll-behavior:contain;padding:8px 2px;margin:6px -2px;scrollbar-width:thin;scrollbar-color:#e3dbed transparent}
.mn-model-option{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:38px;padding:9px 11px;border:1px solid transparent;border-radius:11px;background:white;color:#756c82;text-align:left;font-size:12px;overflow-wrap:anywhere}
.mn-model-option:hover{color:#5f4c81;background:#f8f5fc}
.mn-model-option[aria-pressed=true]{color:#7760a5;background:#f1ebfa;border-color:#e9dff6;font-weight:650}
.mn-model-option svg{flex-shrink:0;width:16px;height:16px;color:#8f74ba}
.mn-model-panel-foot{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:11px 3px 0;border-top:1px solid #f0ebf5}
.mn-model-panel-foot .model-state{min-width:0;max-width:215px;line-height:1.5;font-size:10px;overflow-wrap:anywhere}
.mn-model-panel-foot .mini-dot{flex-shrink:0}
.mn-model-panel-foot #refreshModels{min-height:30px;flex-shrink:0;padding:0 9px;border:1px solid #eae3f1;border-radius:10px;background:#fcfaff;color:#9a86ae;font-size:10px}
.mn-model-empty{padding:12px 8px;color:#a094ad;font-size:12px;text-align:center;line-height:1.7}
.mn-model-trigger:focus-visible,.mn-model-option:focus-visible,#uploadReference:focus-visible,#generateButton:focus-visible,.mn-search-clear:focus-visible{outline:2px solid #a995db;outline-offset:3px}
.history-page .card{border-color:#e8e4ef;border-radius:24px;box-shadow:0 12px 34px #4b3c6b07}
.history-toolbar{gap:20px;padding:23px 24px;background:linear-gradient(115deg,#fff,#fdfbff)}
.history-toolbar>div:first-child{flex:1}
.history-toolbar .matrix-search{order:2}
.history-toolbar #refreshHistory{order:3}
.history-toolbar .matrix-search{width:min(410px,45%);height:46px;padding:0 14px;gap:10px;border:1px solid #e6e0ef;border-radius:17px;background:#f9f7fc;box-shadow:inset 0 1px 2px #44345003;transition:box-shadow .2s,border-color .2s,background .2s}
.history-toolbar .matrix-search:hover{border-color:#d4c8e4;background:#fbf9ff}
.history-toolbar .matrix-search:focus-within{border-color:#bda9df;background:white;box-shadow:0 0 0 4px #a78ccd13;animation:none}
.history-toolbar .matrix-search>svg{color:#9b8bae;width:18px;height:18px}
.history-toolbar .matrix-search input{height:42px;border-radius:14px!important;color:#5f536e;font-size:12px}
.history-toolbar .matrix-search input::placeholder{color:#b1a7bd}
.history-toolbar .matrix-search input::-webkit-search-cancel-button{display:none}
.history-toolbar .matrix-search:before{inset:-1px;padding:1px;border-radius:18px;filter:none;opacity:0!important}
.history-toolbar .matrix-search:after{display:none}
.mn-search-clear{display:grid;place-items:center;flex-shrink:0;width:24px;height:24px;padding:0;border:0;border-radius:8px;background:#eee7f5;color:#a38eb7}
.mn-search-clear svg{width:15px;height:15px}
.mn-search-clear:hover{background:#e7dcf2;color:#806299}
.history-toolbar #refreshHistory{min-height:38px;border-radius:12px;border-color:#e8e0f0;background:#fff;color:#9c89b1;font-size:12px}
.history-row{border-radius:17px;border-color:#eee9f4;padding:14px}
.history-thumb{border-radius:12px}
#studioPage .recent-card{border-radius:20px!important}
#studioPage:not(.has-output) .recent-card .card-head{padding:18px 18px 13px!important;border-bottom-color:#f1edf6}
#studioPage:not(.has-output) .recent-card .card-head h2{font-size:13px!important;color:#62596f}
#studioPage:not(.has-output) .recent-list{padding:12px 15px 15px!important}
#studioPage:not(.has-output) .recent-item{padding:10px!important;border-radius:13px!important;background:#faf8fd}
@keyframes mnModelReveal{from{opacity:0;transform:translateY(-5px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px){#studioPage .mn-refined-composer{padding:15px!important;border-radius:24px!important}.mn-composer-heading{padding-bottom:12px}.mn-composer-badge{font-size:8px}.mn-prompt-surface{padding:13px;border-radius:17px}body #studioPage #prompt{font-size:14px!important;min-height:114px!important}.mn-refined-composer .composer-tools{align-items:flex-start;flex-wrap:wrap}.mn-refined-composer .composer-left{gap:7px!important}.mn-model-trigger{max-width:230px;height:40px}.mn-model-caption{display:none}.mn-refined-composer #uploadReference{height:40px;min-height:40px!important}.mn-model-panel{width:320px}.mn-refined-composer .composer-foot{flex-wrap:wrap}.mn-refined-composer .composer-foot .composer-hint{font-size:9px}.mn-refined-composer>.mn-electric-frame{border-radius:25px!important}.mn-refined-composer>.mn-electric-frame:after{offset-path:inset(1px round 24px)}#studioPage.has-output .work-grid{grid-template-columns:1fr}.history-toolbar{padding:18px;flex-wrap:wrap;gap:14px}.history-toolbar .matrix-search{order:3;width:100%;height:46px;min-width:0}.history-row{padding:11px}}
@media(max-width:760px){.history-toolbar #refreshHistory{order:2}.history-toolbar .matrix-search{order:3;flex-basis:100%}}
@media(max-width:440px){.mn-model-trigger{max-width:190px}.mn-refined-composer .composer-left{flex-basis:100%}.mn-refined-composer .composer-tools #generateButton{margin-left:auto;width:100%;height:42px!important}.mn-model-panel{max-width:calc(100vw - 56px);width:290px}.mn-composer-save{font-size:9px}}
@media(prefers-reduced-motion:reduce){.mn-model-panel{animation:none}.mn-prompt-surface,.mn-model-trigger,.mn-model-trigger>svg,.mn-model-search{transition:none}}

/* One viewport layout for empty, loading, successful and failed creations. */
body.studio-open{height:100dvh;overflow:hidden}
.studio-view{height:100dvh;min-height:0!important;overflow:hidden}
.studio-sidebar{height:100dvh;overflow-y:auto}
.studio-main{display:flex;flex-direction:column;width:100%;height:100dvh;min-height:0;padding:0 clamp(14px,2.4vw,36px)!important;overflow:hidden}
.studio-main>.studio-topbar{flex:0 0 64px;width:100%;min-height:64px;margin:0!important}
body.mn-workbench-active .studio-heading{display:none!important}
.studio-main>.studio-heading{flex-shrink:0;width:100%;margin:0!important;padding:22px 0}
#studioPage.mn-docked-workspace{display:flex;flex:1;flex-direction:column;min-height:0;overflow:visible}
.mn-workspace-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:24px 18px 28px;scrollbar-width:thin;scrollbar-color:#ded9e9 transparent;overflow-anchor:none}
.mn-composer-dock{position:relative;z-index:25;flex-shrink:0;padding:14px 18px max(16px,env(safe-area-inset-bottom));border-top:1px solid #eae5f180;background:linear-gradient(180deg,#f8f9fce6,#f8f9fc 30%);box-shadow:0 -12px 28px #53477804}
#studioPage .mn-composer-dock .mn-refined-composer{max-width:1060px;margin:0 auto!important;padding:14px 18px!important;border-radius:24px!important}
.mn-composer-dock .mn-composer-heading{padding:0 4px 10px;font-size:12px}
.mn-composer-dock .mn-prompt-surface{padding:10px 13px;border-radius:16px}
body #studioPage .mn-composer-dock #prompt{height:68px;min-height:68px!important;max-height:140px;font-size:14px!important;line-height:1.7!important}
.mn-composer-dock .composer-tools{margin-top:10px!important}
.mn-composer-dock .composer-foot{margin-top:9px!important}
.mn-composer-dock .mn-refined-composer>.mn-electric-frame{border-radius:25px!important}
.mn-composer-dock .mn-refined-composer>.mn-electric-frame:after{offset-path:inset(1px round 24px)}
.mn-composer-dock .alert-box:not(:empty){max-width:1060px;margin:0 auto 10px!important}
#studioPage .mn-workspace-scroll .mn-workbench-intro{margin:20px auto 28px}
#studioPage .mn-workspace-scroll .mn-prompt-gallery{margin:0 auto 22px}
#studioPage .mn-workspace-scroll>.work-grid{width:100%;max-width:1180px;margin:0 auto!important;animation:none}
#studioPage:not(.has-output) .mn-workspace-scroll>.work-grid{display:block;max-width:900px}
#studioPage.has-output .mn-workspace-scroll>.work-grid{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:18px;align-items:start}
#studioPage .mn-workspace-scroll .canvas-card{min-height:0}
#studioPage .mn-workspace-scroll .canvas{min-height:260px!important;margin:14px}
#studioPage .mn-workspace-scroll .canvas-result{width:100%;padding:16px}
#studioPage .mn-workspace-scroll .canvas-result img{max-height:max(220px,calc(100dvh - 440px))!important;object-fit:contain}
#studioPage .mn-workspace-scroll #canvasImage{max-height:var(--mn-preview-image-height,calc(100dvh - 500px))!important}
.studio-main>.history-page{flex:1;min-height:0;width:100%;overflow:auto;padding-bottom:24px;scrollbar-width:thin}
.mn-model-panel{display:flex;flex-direction:column;max-height:min(450px,var(--mn-model-max-height,450px))}
.mn-model-panel-head,.mn-model-search,.mn-model-panel-foot{flex-shrink:0}
.mn-model-options{min-height:0;flex:0 1 auto}
@media(max-width:1000px){#studioPage.has-output .mn-workspace-scroll>.work-grid{grid-template-columns:1fr}.mn-workspace-scroll{padding-inline:8px}.mn-composer-dock{padding-inline:8px}#studioPage.has-output .right-stack{grid-template-columns:1fr}}
@media(max-width:720px){.studio-view{display:block}.studio-main{height:100dvh;padding:0 10px calc(66px + env(safe-area-inset-bottom))!important}.studio-main>.studio-topbar{flex-basis:54px;min-height:54px}.studio-sidebar{position:fixed;display:flex;top:auto;bottom:0;z-index:40;width:100%;height:calc(66px + env(safe-area-inset-bottom));padding:6px 8px calc(6px + env(safe-area-inset-bottom));overflow:hidden}.studio-sidebar .side-nav{display:flex;width:100%;gap:4px}.studio-sidebar .nav-item{flex:1;min-width:0;height:52px;min-height:52px;padding:0 2px;font-size:9px}.mn-workspace-scroll{padding:16px 4px 20px}.mn-composer-dock{padding:9px 4px 10px}#studioPage .mn-composer-dock .mn-refined-composer{padding:12px!important;border-radius:21px!important}.mn-composer-dock .mn-composer-heading{padding-bottom:8px}.mn-composer-dock .mn-composer-badge{font-size:7px}.mn-composer-dock .mn-prompt-surface{padding:9px 11px;border-radius:14px}body #studioPage .mn-composer-dock #prompt{height:56px;min-height:56px!important;max-height:100px;font-size:13px!important}.mn-composer-dock .composer-tools{gap:8px!important;margin-top:8px!important}.mn-composer-dock .composer-left{flex-basis:auto;flex:1;gap:6px!important}.mn-composer-dock #uploadReference{height:36px;min-height:36px!important;padding:0 9px;font-size:10px}.mn-composer-dock .mn-model-trigger{max-width:190px;height:36px;padding:0 9px;font-size:10px}.mn-composer-dock .mn-model-caption{display:none}#studioPage .mn-composer-dock #generateButton{width:auto;min-height:36px!important;height:36px!important;padding:0 13px!important;font-size:11px}.mn-composer-dock .composer-foot .composer-hint{display:none}.mn-composer-dock .composer-foot{margin-top:7px!important}.mn-composer-dock .mn-refined-composer>.mn-electric-frame{border-radius:22px!important}.mn-composer-dock .mn-refined-composer>.mn-electric-frame:after{offset-path:inset(1px round 21px)}#studioPage .mn-workspace-scroll .mn-workbench-intro{margin:8px auto 20px}#studioPage .mn-workspace-scroll .mn-workbench-intro h1{font-size:27px}#studioPage .mn-workspace-scroll .canvas{min-height:200px!important;margin:10px}#studioPage .mn-workspace-scroll .canvas-result{padding:10px}#studioPage .mn-workspace-scroll .canvas-result img{max-height:max(180px,calc(100dvh - 430px))!important}.mn-model-panel{max-height:min(380px,var(--mn-model-max-height,380px))}}
@media(max-width:440px){.mn-composer-dock .composer-left{flex-basis:100%}.mn-composer-dock .composer-tools #generateButton{width:100%;margin-left:0}.mn-composer-dock .mn-model-trigger{max-width:215px}}
@media(max-height:650px){.mn-composer-dock .mn-composer-heading,.mn-composer-dock .composer-foot{display:none}.mn-composer-dock{padding-block:8px}body #studioPage .mn-composer-dock #prompt{height:44px;min-height:44px!important}.mn-model-panel-head{padding-bottom:8px}.mn-model-panel-head div>span{display:none}}
