/* v3 / Creative Studio — editorial premium, mobile-first controls */
.studio-page{--studio-ink:#1e2a21;--studio-lime:#d4ff69;max-width:1500px}
.studio-page .page-heading{margin-bottom:20px}
.studio-hero{background:#1c2a20;color:#eff6e9;border-radius:20px;min-height:230px;display:grid;grid-template-columns:1.1fr .9fr;overflow:hidden;position:relative}
.studio-hero>div:first-child{padding:28px 30px;position:relative;z-index:1}
.studio-hero-label{font-size:10px;color:#b1c1a8;font-weight:800;letter-spacing:2px;display:flex;gap:10px;align-items:center}
.studio-hero-label i{width:5px;height:5px;background:var(--studio-lime);border-radius:50%}
.studio-hero h2{font-size:clamp(34px,4vw,56px);font-weight:900;line-height:.99;letter-spacing:-2px;margin:20px 0 10px}
.studio-hero h2 em{font:italic 400 1.05em Georgia,serif;color:var(--studio-lime);letter-spacing:-1.5px}
.studio-hero p{font-size:12px;line-height:1.5;color:#b5c2b3;max-width:390px}
.studio-hero-tag{display:inline-flex;gap:6px;align-items:center;font-weight:700;font-size:10px;color:#d2e1c9;margin-top:16px}
.studio-hero-tag .ic{width:15px;height:15px;color:var(--studio-lime)}
.studio-hero-visual{position:relative;background:radial-gradient(ellipse at 50% 50%,#63765c,#344735 60%,#233425)}
.studio-hero-visual img{position:absolute;width:210px;height:230px;object-fit:cover;left:14%;top:2%;transform:rotate(-9deg);box-shadow:0 15px 30px #101d15a0;border:6px solid #ebeee6}
.studio-hero-visual span{position:absolute;color:var(--studio-lime);font-size:21px;line-height:.95;letter-spacing:-1px;font-weight:950;right:8%;bottom:14%;transform:rotate(5deg)}
.studio-progress{display:flex;gap:13px;align-items:center;margin:22px 0;font-size:10px;color:#778573;font-weight:800;letter-spacing:.4px}
.studio-progress span{display:flex;gap:8px;align-items:center;white-space:nowrap}
.studio-progress b{border:1px solid #d5dfcf;background:#e6ecdb;border-radius:6px;padding:5px 7px;color:#3b4e36}
.studio-progress i{height:1px;flex:1;background:#dce3d6}
.studio-workspace{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:20px;align-items:start}
.studio-controls{display:grid;gap:13px;min-width:0}
.studio-box{padding:22px;border:1px solid #e3e8df;background:#fff;border-radius:16px;min-width:0}
.studio-section-head{display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:900;letter-spacing:1.4px;color:#4c5e4d;margin-bottom:19px}
.studio-box .field{margin-bottom:14px}.studio-box .field label{display:block;font-weight:800;color:#4f5d50;font-size:11px;margin-bottom:7px}.studio-box .field input,.studio-box .field select,.studio-box .field textarea{background:#f8f9f6;font-size:12px;min-height:42px;border-radius:9px;max-width:100%}
.studio-box textarea{resize:vertical;min-height:90px}.studio-box .field-grid{gap:10px}.studio-box .field-grid>.field{min-width:0}
.studio-product-choice{display:flex;gap:13px;align-items:center;background:#f1f4ec;border:1px solid #e7ecde;border-radius:12px;padding:8px;min-width:0}
.studio-product-choice img{width:69px;height:74px;object-fit:cover;border-radius:8px;background:#dbe2d4;flex-shrink:0}
.studio-product-choice div{min-width:0}.studio-product-choice strong{display:block;font-size:12px;color:#344434;line-height:1.25}.studio-product-choice small{display:block;margin:5px 0;color:#697c68}.studio-product-choice span{display:block;font-size:10px;color:#90a08b}
.studio-styles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.studio-style{position:relative;border:1px solid #dfe7d9;background:#fafbf8;padding:10px;min-width:0;border-radius:12px;display:flex;flex-direction:column;text-align:left;gap:7px;cursor:pointer;color:#374837}
.studio-style.active{border:2px solid #405e32;background:#f5faeb;padding:9px;box-shadow:0 0 0 2px #d4ecb84d}
.studio-style-chip{display:block;border-radius:6px;width:100%;height:53px;position:relative;overflow:hidden}
.studio-style-chip:after{content:'A.';font-weight:950;letter-spacing:-1px;position:absolute;bottom:4px;left:8px;font-size:22px}
.studio-style-chip.editorial{background:#243a2a;color:#d4ff69}.studio-style-chip.bright{background:#d4ff69;color:#203221}.studio-style-chip.minimal{background:#e5e9db;color:#253b28}.studio-style-chip.contrast{background:linear-gradient(90deg,#283a29 55%,#d4ff69 55%);color:#f2fff0}
.studio-style strong{font-size:10px;letter-spacing:.3px}.studio-style small{color:#8b9789;font-size:10px;line-height:1.3;max-width:90%}.studio-style-check{position:absolute;right:9px;bottom:13px;color:#668b45}
.studio-help{font-size:10px;color:#9aa398;line-height:1.5;margin-top:-3px}
.studio-channel-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.studio-channel{border:1px solid #e1e7dc;border-radius:10px;padding:12px;display:flex;gap:10px;align-items:center;min-width:0;cursor:pointer;position:relative}
.studio-channel:has(input:checked){border-color:#b2c68b;background:#f2f8e6}.studio-channel input{accent-color:#456936;width:16px;height:16px;flex-shrink:0}
.studio-channel>span:nth-of-type(1){min-width:0;flex:1}.studio-channel strong{display:block;font-size:10px;line-height:1.25;color:#2e412e}.studio-channel small{display:block;font-size:9px;color:#7d8977;margin-top:4px}.studio-channel-check{font-size:12px;color:#95b46c;opacity:.35}.studio-channel:has(input:checked) .studio-channel-check{opacity:1}
.studio-submit{border-top:1px solid #e7ebe3;padding-top:18px;margin-top:17px}.studio-submit p{color:#889484;font-size:10px;margin-bottom:12px;line-height:1.5}.studio-submit .btn{justify-content:center;height:46px}
.studio-preview-side{border:1px solid #e2e8dd;background:#edf1e9;border-radius:16px;padding:19px;min-width:0;position:sticky;top:20px}
.studio-preview-bar{display:flex;align-items:start;justify-content:space-between;gap:9px;margin-bottom:16px}.studio-preview-bar h3{font-size:19px;letter-spacing:-.7px;line-height:1.1;margin:7px 0}.studio-preview-bar p{font-size:10px;color:#7c8978;line-height:1.45;max-width:310px}.studio-preview-bar .tag{white-space:nowrap}
.studio-previews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:start}
.studio-preview-card{background:#fff;min-width:0;border:1px solid #e0e6d9;overflow:hidden;border-radius:11px;box-shadow:0 6px 15px #2839280a}
.studio-art{position:relative;min-width:0;overflow:hidden;background:#27392b;color:#e9f0e4;aspect-ratio:4/5;font-synthesis:none;padding:11px;display:flex;flex-direction:column}
.studio-art.bright-template{background:#d4ff69;color:#1e2d1e}.studio-art.minimal-template{background:#e5e9db;color:#223326}.studio-art.contrast-template{background:#1e3023;color:#eaf4e4;border-left:7px solid #d4ff69}
.studio-art.vertical{aspect-ratio:9/16}.studio-art.wide{aspect-ratio:16/9}.studio-art.square{aspect-ratio:1/1}
.studio-art-brand{font-size:clamp(7px,.7vw,11px);font-weight:900;letter-spacing:1px;text-transform:uppercase;z-index:2;max-width:82%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.studio-art-offer{position:absolute;top:32px;left:11px;z-index:2;text-transform:uppercase;color:#d4ff69;font-weight:900;letter-spacing:1px;font-size:8px}
.studio-art.bright-template .studio-art-offer,.studio-art.minimal-template .studio-art-offer{color:#375b2a}
.studio-art-img{position:absolute;top:21%;left:11%;right:11%;height:44%;overflow:hidden;background:#d7dfd1}
.studio-art-img img{width:100%;height:100%;object-fit:contain}
.studio-art.wide .studio-art-img{top:10%;bottom:10%;left:51%;right:5%;height:auto}.studio-art.vertical .studio-art-img{top:22%;height:46%}.studio-art.square .studio-art-img{top:20%;height:41%}
.studio-art-copy{z-index:2;margin-top:auto;margin-bottom:11px;display:grid;gap:6px;max-width:96%;min-width:0}
.studio-art-copy strong{font-weight:950;letter-spacing:-.8px;line-height:1.03;overflow-wrap:anywhere;font-size:clamp(16px,2.3vw,26px);text-transform:uppercase;max-width:100%;word-break:normal}
.studio-art-copy span{font-size:clamp(8px,.9vw,10px);line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.studio-art-copy small{display:inline-block;width:max-content;max-width:95%;background:#d4ff69;color:#1e2e20;border-radius:2px;padding:4px 7px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:8px;font-weight:900}
.studio-art.bright-template .studio-art-copy small,.studio-art.minimal-template .studio-art-copy small{background:#263c2c;color:#e7f4dd}
.studio-art-index{position:absolute;right:10px;top:11px;font-size:7px;letter-spacing:1px;font-weight:800;opacity:.6}.studio-art.wide .studio-art-copy{max-width:48%}.studio-art.wide .studio-art-copy strong{font-size:clamp(12px,2vw,23px)}
.studio-preview-meta{padding:10px;display:flex;justify-content:space-between;gap:4px;align-items:center}.studio-preview-meta strong{font-size:10px;color:#3f4c3e;min-width:0}.studio-preview-meta span{font-size:9px;color:#94a18c;white-space:nowrap}
.studio-preview-empty{grid-column:1/-1;text-align:center;padding:50px 10px;display:grid;justify-items:center;gap:8px;color:#6f846a}.studio-preview-empty .ic{width:25px;height:25px}.studio-preview-empty strong{font-size:13px}
.studio-hint{background:#e3eada;border-radius:11px;padding:13px;margin-top:12px;font-size:10px;color:#53694f;display:flex;align-items:start;gap:8px;line-height:1.45}.studio-hint .ic{width:17px;height:17px;flex-shrink:0}
.studio-ready{display:grid;gap:10px;background:#fff;border:1px solid #bfd3a6;padding:17px;border-radius:13px;margin-top:13px}.studio-ready-icon{width:34px;height:34px;display:grid;place-items:center;background:#d4ff69;border-radius:50%}.studio-ready h3{font-size:18px;margin:4px 0}.studio-ready p{font-size:11px;line-height:1.5;margin-bottom:6px}.studio-ready .btn{justify-content:center}
.studio-empty{border-radius:19px;padding:50px 25px;background:#1e2a21;color:white;display:grid;justify-items:start;gap:15px;max-width:750px}.studio-empty h2{font-size:34px;line-height:1.05;letter-spacing:-1px}.studio-empty p{font-size:12px;color:#b1c1ae}.studio-empty-actions{display:flex;flex-wrap:wrap;gap:9px}.studio-empty .btn-secondary{background:#324634;color:white;border-color:#617b5d}
.campaign-detail-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.asset-visual .a-head{bottom:37px}.asset-visual .a-cta{position:absolute;left:15px;bottom:12px;font-size:9px;font-weight:850;background:#d4ff69;color:#233325;padding:5px 7px;border-radius:3px;max-width:85%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1300px){.studio-workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.studio-hero-visual img{width:180px;left:8%}.studio-page .page-title{font-size:34px}}
@media(max-width:1080px){.studio-workspace{grid-template-columns:1fr}.studio-preview-side{position:static}.studio-previews{grid-template-columns:repeat(4,minmax(0,1fr))}.studio-art-copy strong{font-size:16px}.studio-hero-visual span{font-size:17px}}
@media(max-width:730px){.studio-page{padding-top:20px}.studio-hero{min-height:0;grid-template-columns:1fr}.studio-hero>div:first-child{padding:23px}.studio-hero h2{font-size:40px}.studio-hero-visual{min-height:155px}.studio-hero-visual img{width:110px;height:150px;top:-6px;left:25%;border-width:4px}.studio-hero-visual span{font-size:19px;right:22%;bottom:20%}.studio-progress{margin:16px 0;gap:7px;font-size:9px}.studio-progress b{padding:4px 5px}.studio-box{padding:16px;border-radius:12px}.studio-preview-side{padding:12px;border-radius:12px}.studio-previews{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.studio-preview-bar h3{font-size:17px}.studio-art{padding:9px}.studio-art-brand{font-size:8px}.studio-art-offer{top:27px;left:9px;font-size:7px}.studio-art-copy strong{font-size:clamp(14px,5vw,19px)}.studio-art.wide .studio-art-copy strong{font-size:11px}.studio-art-index{font-size:7px}.studio-art-img{top:20%;height:45%}.studio-preview-meta{padding:8px}.studio-preview-meta strong{font-size:9px}.studio-preview-meta span{font-size:8px}.studio-channel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.studio-product-choice img{width:61px;height:68px}.campaign-detail-actions{justify-content:flex-start}.campaign-detail-actions .btn{font-size:11px;padding:9px}.asset-visual .a-head{bottom:30px}.asset-visual .a-cta{font-size:7px;left:10px;bottom:8px}}
@media(max-width:370px){.studio-styles,.studio-channel-grid{grid-template-columns:1fr 1fr}.studio-style{padding:7px}.studio-style.active{padding:6px}.studio-style strong{font-size:9px}.studio-style small{font-size:9px}.studio-art-copy strong{font-size:14px}.studio-preview-bar .tag{font-size:8px}}
/* Prevent the dashboard two-column minimum from widening 320px phones. */
@media(max-width:730px){.two-col{grid-template-columns:minmax(0,1fr)}.two-col>section{min-width:0}}
/* Give landscape deliverables a real banner-width preview instead of squeezing them into half a mobile column. */
.studio-preview-card:has(.studio-art.wide){grid-column:span 2}
.studio-art.wide .studio-art-copy{max-width:46%;gap:6px}
.studio-art.wide .studio-art-copy strong{font-size:clamp(15px,2.6vw,29px);line-height:1.02}
.studio-art.wide .studio-art-copy span{font-size:clamp(8px,1vw,12px)}
.studio-art.wide .studio-art-brand{font-size:10px}
.studio-art.wide .studio-art-offer{font-size:9px}
@media(max-width:730px){.studio-art.wide .studio-art-copy strong{font-size:clamp(17px,5vw,22px)}.studio-art.wide .studio-art-copy span{font-size:10px}.studio-art.wide .studio-art-copy small{font-size:9px}.studio-art.wide .studio-art-img{top:10%;left:51%;right:5%;bottom:10%;height:auto}}
