.banner-studio{padding-block:48px 70px}.banner-intro{display:flex;justify-content:space-between;align-items:center;gap:28px;margin-bottom:28px}.banner-intro h1{font-size:42px;margin-bottom:15px}.banner-intro p{max-width:630px;font-size:14px;margin:0}.banner-intro .text-button{flex-shrink:0}.banner-beta{background:#f0edfc;color:#6250da;border:1px solid #ddd6f4;border-radius:5px;padding:0 6px;font-size:12px}.banner-navigation{display:flex;gap:8px;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:26px;flex-wrap:wrap}.banner-navigation a{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:9px;font-size:12px;font-weight:700;color:var(--muted)}.banner-navigation [aria-current]{background:#ede8fc;color:#6250da}.banner-navigation a>span{opacity:.7}.banner-workspace{display:grid;grid-template-columns:minmax(0,1fr) 286px;gap:40px;align-items:start;max-width:1060px}.banner-controls{min-width:0;display:grid;gap:22px}.banner-controls .panel{border:1px solid var(--line);border-radius:18px;background:#fff;padding:27px}.banner-section-title{display:flex;align-items:center;gap:12px;margin-bottom:22px}.banner-section-title>span:first-child{font-size:11px;color:#9b91b5}.banner-section-title h2{font-size:18px;letter-spacing:-.45px;margin:0}.banner-size{margin-inline-start:auto;font-size:10px;color:#8d8598;white-space:nowrap}.banner-fields-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.banner-wide{grid-column:1/-1}.banner-controls .form-field{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:700;color:#625a70;margin:0;min-width:0}.banner-controls input,.banner-controls textarea,.banner-controls select{width:100%;font-size:12px;padding:11px 12px;min-width:0}.banner-controls select{min-height:43px}.banner-controls input[type=color]{height:43px;padding:6px;cursor:pointer}.banner-hint{font-size:10px;line-height:1.8;color:#89818e;margin:12px 0 0}.banner-ai{border-top:1px solid var(--line);padding-top:22px;margin-top:21px;display:grid;gap:16px}.banner-ai>.btn{justify-self:start;font-size:12px;max-width:100%;gap:12px}.banner-credit{border-inline-start:1px solid #ffffff50;padding-inline-start:11px;white-space:nowrap;font-size:11px}.banner-pricing{padding-top:18px;margin:20px 0 0;border-top:1px solid var(--line);font-size:11px;line-height:1.8;color:#777080}.banner-preview{position:sticky;top:105px;border-radius:18px;background:#f0edf4;padding:22px;scroll-margin-top:100px;min-width:0}.banner-preview-heading{display:flex;justify-content:space-between;gap:10px;margin-bottom:16px;font-size:9px;color:#877d93}.banner-preview-heading>span:first-child{font-weight:800;color:#5f556d}.banner-stage{width:240px;height:600px;position:relative;box-shadow:0 8px 20px #3325440d;background:#faf9f6}.banner-stage canvas{display:block;width:240px;height:600px;max-width:none}.banner-loading{position:absolute;left:12px;right:12px;top:270px;font-size:11px;text-align:center;border-radius:10px;background:#faf9f6ed;color:#6250da;padding:16px;line-height:1.7}.banner-play-controls{display:flex;justify-content:space-between;align-items:center;margin-block:8px 13px;font-size:9px;color:#8d8497}.banner-play-controls .text-button{font-size:10px}.banner-exports{display:grid;grid-template-columns:1fr 65px;gap:7px}.banner-exports .btn{font-size:11px;gap:7px;padding:11px 8px;min-height:42px}.banner-preview>.banner-hint{font-size:9px}.banner-upload{font-size:11px;position:relative;cursor:pointer;overflow:hidden}.banner-upload input[type=file]{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;padding:0;opacity:0;cursor:pointer}.banner-upload:focus-within{outline:3px solid #a5b4fc;outline-offset:4px}.banner-studio>.notice{max-width:1060px}.banner-controls fieldset:disabled{opacity:.65}.banner-studio [hidden]{display:none!important}@media(max-width:1000px){.banner-workspace{gap:24px;grid-template-columns:minmax(0,1fr) 274px}.banner-preview{padding:16px}.banner-controls .panel{padding:20px}.banner-fields-grid{grid-template-columns:1fr}.banner-wide{grid-column:auto}.banner-intro{align-items:flex-start}.banner-size{font-size:9px}}@media(max-width:720px){.banner-studio{padding-block:30px 45px}.banner-intro{display:block}.banner-intro h1{font-size:34px}.banner-intro p{font-size:13px}.banner-intro .text-button{margin-top:13px}.banner-workspace{grid-template-columns:minmax(0,1fr)}.banner-preview{position:static;width:274px;max-width:100%;justify-self:center}.banner-section-title{flex-wrap:wrap}.banner-controls .panel{padding:19px}.banner-stage{width:240px}.banner-navigation a{padding:8px 11px;font-size:11px}.banner-ai>.btn{justify-self:stretch}}@media(max-width:350px){.banner-studio.container{width:calc(100% - 24px)}.banner-controls .panel{padding:16px}.banner-preview{padding:12px;width:266px}.banner-intro h1{font-size:30px}}@media(prefers-reduced-motion:reduce){.banner-studio *{scroll-behavior:auto}}.banner-stage{margin-inline:auto}.banner-wide-preview{grid-template-columns:minmax(0,1fr)}.banner-wide-preview .banner-preview{grid-row:1;position:static;width:100%;max-width:100%}.banner-wide-preview .banner-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.banner-wide-preview .banner-stage{max-width:100%}@media(max-width:720px){.banner-wide-preview .banner-controls{grid-template-columns:minmax(0,1fr)}}.banner-options{border-top:1px solid var(--line);margin-top:24px;padding-top:19px}.banner-options summary{cursor:pointer;font-size:13px;font-weight:800;color:var(--ink);padding-block:5px}.banner-options summary:focus-visible{outline:3px solid #a5b4fc;outline-offset:4px}.banner-options[open]>div{padding-top:18px}.banner-toggles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.banner-toggles label{display:flex;align-items:center;gap:9px;font-size:11px;color:#625a70;cursor:pointer}.banner-toggles input[type=checkbox]{width:16px;height:16px;padding:0;margin:0;accent-color:#6250da}.banner-range{display:flex;align-items:center;gap:10px}.banner-range input[type=range]{padding:0;height:30px;accent-color:#6250da}.banner-range output{min-width:32px;font-size:10px;font-variant-numeric:tabular-nums;direction:ltr}.banner-options .text-button{text-align:start;justify-self:start;font-size:11px}.banner-options select:disabled,.banner-options input:disabled{opacity:.5;cursor:default}.banner-play-controls>span{text-align:end;max-width:65%}@media(max-width:450px){.banner-toggles{grid-template-columns:minmax(0,1fr)}}@font-face{font-family:Manrope;src:url(/fonts/banner-editor/cyrillic.woff2);font-weight:400 800;unicode-range:U+0400-045F;font-display:swap}@font-face{font-family:Manrope;src:url(/fonts/banner-editor/latin.woff2);font-weight:400 800;unicode-range:U+0000-00FF,U+2000-206F;font-display:swap}#banner-studio{--line:#e2e8f0;--muted:#64748b;--ink:#0f172a;container-type:inline-size;padding:0;font-family:Manrope,Arial,sans-serif}#banner-studio .banner-workspace{grid-template-columns:minmax(0,1fr);gap:20px}#banner-studio .banner-wide-preview .banner-controls{grid-template-columns:minmax(0,1fr)}#banner-studio .banner-preview{position:static;width:100%;max-width:100%;grid-row:auto}#banner-studio .banner-fields-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}#banner-studio .banner-wide{grid-column:1/-1}#banner-studio .banner-controls .panel{padding:16px}#banner-studio .btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border-radius:12px;padding:10px 14px;font-weight:700;line-height:1.4}#banner-studio .btn-primary{background:#4f46e5;color:#fff}#banner-studio .btn-outline{border:1px solid #cbd5e1;background:#fff;color:#334155}#banner-studio .text-button{min-height:44px;color:#4338ca;font-weight:600}#banner-studio .banner-exports{grid-template-columns:repeat(2,minmax(0,1fr))}#banner-studio input,#banner-studio textarea,#banner-studio select{border:1px solid #cbd5e1;border-radius:10px}#banner-studio button:disabled{opacity:.5;cursor:wait}#banner-studio .notice{margin-top:16px;border-radius:12px;background:#f0f9ff;padding:14px;font-size:14px;overflow-wrap:anywhere}#banner-studio .notice.error{background:#fff1f2;color:#9f1239}#banner-studio .banner-hint{font-size:12px;overflow-wrap:anywhere}@container (min-width:760px){#banner-studio .banner-workspace:not(.banner-wide-preview){grid-template-columns:minmax(0,1fr) 274px}#banner-studio .banner-workspace:not(.banner-wide-preview) .banner-preview{position:sticky;top:100px}}