.creative-studio{--studio-accent:#6752bf;--studio-soft:#f5f1fc;--studio-border:#e1d9ef}
.studio-image{--studio-accent:#a33e83;--studio-soft:#fdf1f9;--studio-border:#eedce9}
body[data-page=images]{--accent:#a33e83;--soft:#fae8f5}
body[data-page=images] main{--page-action:#a33e83}
.workspace-nav a[href="#images"]{--nav-accent:#a33e83;--nav-soft:#fae8f5}
.studio-intro{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 22px}
.studio-intro p{margin:0;color:#5c6879}
.studio-intro a{white-space:nowrap}
.studio-layout{display:grid;grid-template-columns:minmax(285px,37%) minmax(0,1fr);gap:22px;align-items:stretch}
.studio-image .studio-layout{grid-template-columns:minmax(285px,34%) minmax(0,1fr)}
.studio-layout .panel{margin:0;border-radius:18px}
.studio-controls{padding:23px;min-width:0}
.studio-controls h2{margin:0 0 3px;display:flex;align-items:center;gap:8px}
.studio-controls h2 svg,.studio-text-button svg,.studio-generate svg{width:20px;height:20px;flex:none}
.studio-image .studio-controls h2,.studio-output-head h2{color:var(--studio-accent)}
.studio-controls>p{margin:2px 0 15px}
.studio-controls #generationPrompt{resize:vertical;line-height:1.7}
.studio-picker{min-width:0;border:0;margin:13px 0;padding:0}
.studio-picker legend{margin:0 0 6px;padding:0;font-weight:650;font-size:13px}
.studio-picker>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.studio-choice{display:block;position:relative;margin:0;min-width:0;color:var(--studio-accent);font-weight:500;cursor:pointer}
.studio-choice input{position:absolute;width:1px;height:1px;opacity:0;inset:auto auto 0 0}
.studio-choice span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:44px;border:1px solid #dfe3ee;border-radius:11px;padding:6px 3px;font-size:12px;text-align:center}
.studio-choice input:checked+span{border-color:var(--studio-accent);background:var(--studio-soft);box-shadow:inset 0 0 0 1px var(--studio-accent);font-weight:700}
.studio-choice input:focus-visible+span{outline:2px solid var(--studio-accent);outline-offset:2px}
.studio-picker-articleType .studio-choice{--choice-bg:#f5ecff;--choice-ink:#624293;color:var(--choice-ink)}
.studio-picker-articleType .studio-choice span{background:var(--choice-bg);min-height:61px;border-color:transparent}
.studio-picker-articleType .studio-choice input:checked+span{background:var(--choice-bg);border-color:var(--choice-ink);box-shadow:inset 0 0 0 1px var(--choice-ink)}
.studio-picker-articleType .studio-choice:nth-child(1){--choice-bg:#ffedcc;--choice-ink:#875019}
.studio-picker-articleType .studio-choice:nth-child(2){--choice-bg:#d9effa;--choice-ink:#276280}
.studio-picker-articleType .studio-choice:nth-child(4){--choice-bg:#f9e0ed;--choice-ink:#8b3b62}
.studio-picker-articleType .studio-choice:nth-child(5){--choice-bg:#def2e2;--choice-ink:#27694c}
.studio-picker-articleType .studio-choice:nth-child(6){--choice-bg:#fff2c4;--choice-ink:#79591b}
.studio-picker-articleType svg{width:22px;height:22px}
.studio-picker-length .studio-choice span{min-height:37px}
.studio-picker-ratio .studio-choice span{min-height:56px}
.studio-picker-ratio i{display:block;aspect-ratio:var(--ratio);height:18px;max-width:32px;border:1px solid currentColor;border-radius:3px}
.studio-text-button{display:inline-flex;align-items:center;gap:4px;color:var(--studio-accent);padding:5px 0;border:0;background:transparent;font-size:13px}
.studio-quote{display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid var(--studio-border);padding-top:14px;margin-top:13px;color:#536176}
.studio-quote strong{color:var(--studio-accent);font-size:19px;font-variant-numeric:tabular-nums}
.creative-studio .primary{background:var(--studio-accent);border-color:var(--studio-accent);color:#fff}
.studio-generate{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;min-height:43px;margin-top:7px}
.studio-charge-copy{text-align:center;margin:8px 0 0}
.studio-controls .error:empty,.article-upload-status:empty{display:none}
.studio-more{padding-top:13px;border-top:1px solid var(--studio-border);margin-top:13px}
.studio-more summary{cursor:pointer;font-weight:600}
.studio-more a{display:inline-block;margin-top:9px;color:var(--studio-accent)}
.studio-output{min-width:0;overflow:hidden;padding:0}
#studioResult{height:100%;display:flex;flex-direction:column}
.studio-output-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;border-bottom:1px solid var(--studio-border)}
.studio-output-head h2,.studio-output-head p{margin:0}
.studio-output-head .btn{white-space:nowrap}
.studio-canvas{min-height:460px;display:grid;align-content:center;flex:1}
.studio-canvas:has(.studio-article){align-content:start}
.studio-image .studio-canvas{background:var(--studio-soft)}
.studio-empty{padding:44px 24px;text-align:center;color:var(--studio-accent)}
.studio-empty svg{width:80px;height:80px}
.studio-empty h3{font-size:20px;font-weight:600;margin:14px 0 6px}
.studio-empty p{margin:0;color:#5b6273;overflow-wrap:anywhere}
.studio-article{padding:26px 32px}
.studio-article-meta{color:#635590;font-size:12px;display:flex;justify-content:space-between}
.studio-article h3{font-size:24px;margin:15px 0 20px;overflow-wrap:anywhere}
.studio-article p{font-size:15px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.9;margin:0}
.studio-image-result{margin:20px auto;text-align:center;padding:0 18px;max-width:100%;min-width:0}
.studio-image-result .generated-preview{margin:0 auto 10px}
#referencePreview .generated-preview{max-height:116px;margin:8px 0}
.studio-history{margin:20px 0}
.studio-history h2{margin:0}
.studio-history .scroll table{min-width:0;white-space:normal}
.studio-history td,.studio-history th{overflow-wrap:anywhere}
.article-rendered .article-figure{text-align:center;margin:16px 0}
.article-rendered .article-figure img{display:block;max-width:100%;max-height:640px;height:auto;margin:0 auto;border-radius:5px}
.article-image-actions{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:7px}
.article-image-actions button{padding:4px 8px;font-size:12px;min-height:30px}
.draft-preview-head{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #e2dbed;padding-bottom:7px;margin-bottom:12px;color:#594282}
.draft-preview-head button{padding:4px 8px;font-size:12px}
.draft-preview:focus-visible{outline:2px solid #8672b3;outline-offset:2px}
.draft-preview[hidden]{display:none}
[data-article-file][hidden]{display:none}
.b2b-batch summary{cursor:pointer;font-weight:650}
.b2b-batch .scroll{margin-block:12px}
.b2b-batch .scroll input:not([type=checkbox]){min-width:120px}
.b2b-batch .scroll label{margin:0}
@media(max-width:850px){
 .studio-layout,.studio-image .studio-layout{grid-template-columns:1fr;gap:15px}
 .studio-canvas{min-height:315px}
 .studio-intro{margin-bottom:14px}
}
@media(max-width:540px){
 .studio-intro{align-items:flex-start;flex-direction:column}
 .studio-controls,.studio-output-head{padding:16px}
 .studio-article{padding:20px 16px}
 .studio-article h3{font-size:20px}
}
@media(min-width:1000px){
 .draft-editor:has(.draft-preview:not([hidden])){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);column-gap:10px;align-items:start}
 .draft-editor:has(.draft-preview:not([hidden]))>:is(label,.draft-toolbar,.draft-editor-foot,.article-upload-status){grid-column:1/-1}
 .draft-editor:has(.draft-preview:not([hidden])) textarea{grid-column:1;grid-row:3;border-radius:0 0 9px 9px}
 .draft-editor:has(.draft-preview:not([hidden])) .draft-preview{grid-column:2;grid-row:3;min-height:220px;max-height:570px;overflow:auto;margin:0;border-radius:0 0 9px 9px}
}
