:root{--ink:#111936;--muted:#667085;--bg:#F4F6FF;--card:#fff;--pink:#FF0F57;--hover:#E9004F;--dark:#0d1228;--line:#e5e7ef}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,"Noto Sans Bengali",sans-serif;background:var(--bg);color:var(--ink)}button,input,textarea,select{font:inherit}button{cursor:pointer}.app{min-height:100vh}.topbar{height:58px;background:#0b1022;color:#fff;display:flex;align-items:center;gap:12px;padding:8px 12px;position:sticky;top:0;z-index:50}.brand{font-weight:950;letter-spacing:.5px}.version{font-size:11px;background:#7c3aed;padding:4px 7px;border-radius:7px}.top-actions{margin-left:auto;display:flex;gap:6px}.top-actions button{border:1px solid #343b59;background:#171d38;color:#fff;border-radius:8px;padding:8px 11px;font-weight:800}.top-actions .publish{background:var(--pink);border-color:var(--pink)}.workspace{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:calc(100vh - 58px)}.tools{background:#10162d;padding:12px;display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:8px;position:sticky;top:58px;height:calc(100vh - 58px);overflow:auto}.tool{min-height:66px;border:1px solid #303958;background:#171e39;color:#fff;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-weight:900}.tool span{font-size:20px}.tool small{font-size:11px}.tool:hover{border-color:#7c3aed;background:#202849}.canvas-wrap{min-width:0;padding:18px;overflow:auto}.canvas{max-width:900px;margin:auto;background:var(--bg);border-radius:18px;box-shadow:0 12px 35px #1119361c;overflow:hidden}.section{padding:38px 28px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;min-height:580px;background:linear-gradient(135deg,#fff,#f7f1ff)}.badge{display:inline-block;background:#111936;color:#fff;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:900}.text-el h1{font-size:clamp(35px,5vw,57px);line-height:1.08;margin:17px 0}.hero-copy>p{color:var(--muted);font-size:17px}.element.selected{outline:3px solid #7c3aed;outline-offset:5px;border-radius:8px}.cta{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:11px;background:var(--pink);color:#fff;font-weight:950;text-decoration:none;border:0;cursor:pointer}.cta:hover{background:var(--hover)}.trust-inline{display:flex;gap:9px;flex-wrap:wrap;color:#667085;font-size:11px;margin-top:14px}.image-placeholder{min-height:320px;border-radius:25px;background:linear-gradient(145deg,#111936,#343d68);display:grid;place-items:center;color:#fff;font-weight:900;overflow:hidden}.image-placeholder img{width:100%;height:320px;object-fit:cover}.mock-device{margin-top:-230px;margin-left:20px;width:160px;height:210px;border:7px solid #0a0f22;border-radius:25px;background:#fff;box-shadow:0 15px 35px #0004;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;color:#111936}.mock-device b{font-size:22px}.mock-device strong{font-size:26px;color:var(--pink)}.mock-device small{margin-top:10px;color:#667085}.trust-section{padding-top:18px;padding-bottom:18px}.trust-grid,.cards,.pay-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.trust-grid>div,.cards article,.pay-grid>div{background:#fff;border:1px solid var(--line);padding:16px;border-radius:15px}.section h2{font-size:28px;margin-top:0}.rating{text-align:center;background:#fff}.stars{font-size:30px;color:#ffb400}.rating strong{display:block;font-size:42px}.offer-card,.payment-card,.order-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px}.offer-card{display:flex;justify-content:space-between;align-items:center}.offer-card strong{display:block;font-size:43px;color:var(--pink)}.offer-card del{color:#98a2b3}.countdown-section{text-align:center}.countdown{display:flex;justify-content:center;gap:9px}.countdown>div{background:#111936;color:#fff;border-radius:11px;padding:10px 13px;min-width:65px}.countdown b{display:block;font-size:24px}.countdown small{font-size:9px;color:#cbd2e1}.order-card{max-width:600px;margin:auto}.order-card input{display:block;width:100%;padding:12px;border:1px solid #d0d5dd;border-radius:9px;margin:8px 0}.pay-grid>div span{display:block;margin-top:7px;color:#667085}.faq{display:grid;gap:9px}.faq details{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px}.faq summary{cursor:pointer;font-weight:850}.inspector{position:fixed;right:-360px;top:58px;width:350px;height:calc(100vh - 58px);background:#fff;border-left:1px solid var(--line);box-shadow:-15px 0 35px #11193618;z-index:60;padding:15px;transition:right .2s;overflow:auto}.inspector.open{right:0}.ins-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.ins-head button{border:0;background:#f2f4f7;border-radius:8px;padding:5px 10px}.ins-id{font-size:10px;color:#98a2b3;margin-bottom:16px}.inspector label{display:block;font-size:11px;font-weight:800;margin:10px 0 5px}.inspector input,.inspector textarea,.inspector select{width:100%;border:1px solid #d0d5dd;border-radius:9px;padding:9px}.inspector textarea{min-height:110px}.apply{width:100%;border:0;background:var(--pink);color:#fff;border-radius:9px;padding:11px;margin-top:12px;font-weight:900}.muted{color:var(--muted)}.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);background:#111936;color:#fff;padding:10px 15px;border-radius:10px;opacity:0;pointer-events:none;transition:.2s;z-index:100}.toast.show{opacity:1;transform:translate(-50%,0)}.share-modal{display:none;position:fixed;inset:0;background:#0008;z-index:90;place-items:center;padding:18px}.share-modal.open{display:grid}.share-box{background:#fff;width:min(520px,100%);border-radius:18px;padding:22px}.share-box input{width:100%;padding:12px;border:1px solid #d0d5dd;border-radius:9px;margin:10px 0}.share-actions{display:flex;gap:8px}.share-actions button{flex:1;border:0;border-radius:9px;padding:11px;background:#111936;color:#fff;font-weight:900}.share-actions button:first-child{background:var(--pink)}.preview-mode .tools,.preview-mode .top-actions [data-action="undo"],.preview-mode .top-actions [data-action="redo"],.preview-mode .top-actions [data-action="publish"],.preview-mode .inspector{display:none}.preview-mode .workspace{display:block}.preview-mode .canvas-wrap{padding:0}.preview-mode .canvas{max-width:1100px;border-radius:0}.preview-bar{display:none;position:fixed;bottom:15px;left:50%;transform:translateX(-50%);z-index:80;background:#111936;color:#fff;padding:8px;border-radius:12px}.preview-bar.open{display:block}@media(max-width:800px){.workspace{grid-template-columns:1fr}.tools{position:fixed;left:10px;right:10px;bottom:10px;top:auto;height:auto;max-height:55vh;border-radius:18px;z-index:70;grid-template-columns:repeat(2,1fr);box-shadow:0 15px 40px #0005}.canvas-wrap{padding:8px}.hero{grid-template-columns:1fr;padding:28px 18px;min-height:auto}.section{padding:26px 16px}.trust-grid,.cards,.pay-grid{grid-template-columns:1fr}.top-actions button{padding:7px 8px}.brand{font-size:13px}.offer-card{display:block}.inspector{width:min(350px,92vw)}}
.save-state{font-size:10px;color:#aeb7d2}.tool:focus-visible,.top-actions button:focus-visible,.cta:focus-visible,.inspector button:focus-visible,.inspector input:focus-visible,.inspector textarea:focus-visible,.inspector select:focus-visible{outline:3px solid #7c3aed;outline-offset:2px}.target-nav{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:8px 0 14px}.target-nav button{border:1px solid #d0d5dd;background:#f8f9fc;border-radius:8px;padding:7px;font-weight:800}.target-nav span{font-size:11px;color:#667085}@media(max-width:800px){.topbar{gap:7px}.top-actions{overflow-x:auto;max-width:65vw}.top-actions button{white-space:nowrap}.tools{left:8px;right:8px}.canvas-wrap{overflow-x:hidden}.canvas{width:100%;max-width:100%}}

.share-actions{flex-wrap:wrap}.share-actions button{min-width:120px}@media(max-width:520px){.share-box{padding:16px}.share-box h2{font-size:24px}.share-actions button{flex:1 1 46%}.topbar{height:auto;min-height:58px;flex-wrap:wrap}.top-actions{margin-left:0;max-width:100%;width:100%;overflow-x:auto}.top-actions button{flex:0 0 auto}.brand{font-size:15px}.version{font-size:10px}}
.tools-toggle{display:none;border:1px solid #343b59;background:#171d38;color:#fff;border-radius:8px;padding:8px 10px;font-weight:800}.tools-head{display:none}.tools-backdrop{display:none}.tools button{touch-action:manipulation}@media(max-width:800px){.tools-toggle{display:block;order:0}.tools{display:none;position:fixed;left:8px;right:8px;top:70px;bottom:10px;height:auto;max-height:none;padding:12px;overflow:auto;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start}.tools-head{display:flex;grid-column:1/-1;position:sticky;top:-12px;z-index:2;justify-content:space-between;align-items:center;padding:2px 2px 10px;background:#10162d;color:#fff}.tools-head button{border:1px solid #343b59;background:#171d38;color:#fff;border-radius:8px;min-width:42px;min-height:42px;font-size:24px}.tools-backdrop{position:fixed;inset:58px 0 0;background:#0007;z-index:65}.tools-open .tools{display:grid}.tools-open .tools-backdrop{display:block}.tools-open .canvas-wrap{position:relative;z-index:1}.tools-open .tools{z-index:70}.topbar{z-index:80}.top-actions{flex:1;min-width:0}.top-actions button{min-height:44px}.tools-toggle{min-height:44px}.tool{min-height:70px}.share-actions button{min-height:46px}}

/* RC2 audit refinement: mobile tool drawer + image empty state */
.image-empty{min-height:320px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#fff;text-align:center}.image-empty b{font-size:18px}.image-empty small{font-size:12px;color:#cbd2e1}.tools-head{border-bottom:1px solid #303958}.tools-head b{font-size:14px;letter-spacing:.5px}.tools-head button{touch-action:manipulation}.tools-open{overflow:hidden}.tools-open .tools{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.tools .tool:first-of-type{margin-top:2px}@media(max-width:800px){.tools{scroll-padding-top:54px}.tools-head{top:-12px;min-height:48px}.tools-head button{display:grid;place-items:center}.tool{min-height:72px}.image-empty{min-height:280px}}

/* V4 UI REFERENCE — desktop editor + mobile overlay */
:root{--editor-bg:#080d1f;--editor-panel:#10162d;--editor-card:#171e39;--editor-border:#303958;--editor-muted:#9ca7c4}
body{background:#eef1fa}
.topbar{height:58px;background:#080d1f;padding:7px 16px;gap:10px;border-bottom:1px solid #1e2642;position:sticky;top:0;z-index:80}
.menu-btn{width:34px;height:40px;border:0;background:transparent;color:#fff;font-size:25px;border-radius:8px;display:grid;place-items:center}
.menu-btn:hover{background:#171e39}
.brand{font-size:16px;font-weight:950;letter-spacing:.1px;white-space:nowrap}
.version{font-size:11px;background:#6d32e8;padding:5px 9px;border-radius:8px;font-weight:900;white-space:nowrap}
.save-state{font-size:11px;color:#9ca7c4;white-space:nowrap}
.device-switch{display:flex;align-items:center;gap:5px;margin-left:auto}
.device{width:39px;height:42px;border:1px solid #303958;background:#10162d;color:#fff;border-radius:8px;font-size:20px;font-weight:900;opacity:.75}
.device.active{background:#fff;color:#111936;opacity:1}
.device:hover{opacity:1}
.top-actions{margin-left:6px;display:flex;gap:6px;overflow:visible}
.top-actions button{min-width:42px;height:42px;border:1px solid #303958;background:#171e39;color:#fff;border-radius:8px;padding:7px 12px;font-weight:900;font-size:14px}
.top-actions button[data-action=undo],.top-actions button[data-action=redo]{font-size:21px;padding:5px 10px}
.top-actions button[data-action=preview],.top-actions button[data-action=code-view]{font-size:20px;padding:5px 12px}
.top-actions .publish{background:#ff0f57;border-color:#ff0f57}
.top-actions .publish:hover{background:#e9004f}
.workspace{grid-template-columns:242px minmax(0,1fr);min-height:calc(100vh - 58px)}
.tools{background:#090e20;padding:14px 15px 16px;grid-template-columns:1fr 1fr;gap:7px;position:sticky;top:58px;height:calc(100vh - 58px);border-right:1px solid #202944;box-shadow:10px 0 30px #0003;overflow:auto}
.tools-head{display:flex;grid-column:1/-1;align-items:center;justify-content:space-between;position:sticky;top:-14px;z-index:4;background:#090e20;padding:3px 2px 12px;border-bottom:1px solid #27304d;color:#fff}
.tools-head b{font-size:13px;letter-spacing:.2px}
.tools-head button{border:0;background:transparent;color:#fff;font-size:24px;width:32px;height:32px;border-radius:7px}
.tool{min-height:86px;border:1px solid #2c3656;background:#0e152d;color:#fff;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-weight:900;box-shadow:inset 0 0 0 1px #101a36}
.tool span{font-size:28px;line-height:1;font-weight:500}
.tool small{font-size:12px;line-height:1.15;font-weight:900}
.tool:hover{border-color:#6d7cff;background:#17213e;transform:translateY(-1px)}
.tool-button span{color:#d400ff}.tool-icon span{color:#ff8c00}.tool-shape span{color:#ffe000}.tool-video span{color:#ff174f}.tool-input span{color:#00eaa0}.tool-line span{color:#c000ff}.tool-section span{color:#00a0ff}.tool-column span{color:#52d000}.tool-offer{background:linear-gradient(135deg,#5310e9,#9b14ff);border-color:#6e1cff}.tool-countdown{background:linear-gradient(135deg,#9b1b00,#e26c00);border-color:#b95000}.tool-payment{background:linear-gradient(135deg,#0824c5,#004bd8);border-color:#214cff}.tool-faq{background:linear-gradient(135deg,#0b6e61,#10a58f);border-color:#16b9a0}.tool-json-in{background:linear-gradient(135deg,#5b0798,#9d12d7);border-color:#9d12d7}.tool-json-out{background:linear-gradient(135deg,#064a92,#0876bd);border-color:#087bc7}.tool-html{background:linear-gradient(135deg,#4a2100,#7b3b00);border-color:#925300}.tool-preview{background:linear-gradient(135deg,#075f38,#07875b);border-color:#0aa76e}.tool-settings{background:#101a30;border-color:#31506d}.tool-seo{background:linear-gradient(135deg,#24104d,#5e1fb3);border-color:#742be4}.tool-analytics{background:linear-gradient(135deg,#3a1800,#704000);border-color:#8c5000}.tool-template{background:linear-gradient(135deg,#063f99,#0759d8);border-color:#1b6bff}
.tool-footer{grid-column:1/-1;display:grid;gap:8px;margin-top:92px;padding-top:12px;border-top:1px solid #27304d}
.tool-footer button{min-height:49px;border-radius:7px;border:1px solid #2f3b5e;color:#fff;font-weight:900;text-align:left;padding:0 16px;font-size:13px}
.save-tool{background:#006b3f;border-color:#008d54!important}.publish-tool{background:#0647a7;border-color:#1266d1!important}.clean-tool{background:#5a0aa4;border-color:#7b13d0!important}
.canvas-wrap{padding:16px;background:#eef1fa;overflow:auto}
.canvas{max-width:980px;background:#f4f6ff;border-radius:10px;box-shadow:0 12px 30px #1119361a;overflow:hidden}
.hero{min-height:520px;padding:54px 38px;gap:36px;background:linear-gradient(135deg,#f7f8ff,#f3f5ff)}
.hero-copy{padding-left:4px}.badge{background:#111936;padding:8px 13px;font-size:11px}.text-el h1{font-size:clamp(38px,4.6vw,58px);line-height:1.05;margin:20px 0 12px}.hero-copy>p{font-size:15px;line-height:1.7}.cta{min-height:60px;padding:0 32px;border-radius:8px;font-size:18px}.trust-inline{margin-top:17px;font-size:12px}
.image-placeholder{min-height:320px;border-radius:0;background:transparent}.image-empty{min-height:320px;border-radius:25px;background:linear-gradient(145deg,#111936,#343d68)}
.mock-device{margin-top:-240px;margin-left:20px;width:180px;height:240px;border-width:7px}
.section{padding:32px 26px}.section h2{font-size:25px}.trust-grid>div,.cards article,.pay-grid>div{border-radius:8px}.rating{background:linear-gradient(135deg,#1a2170,#7d159c);color:#fff}.offer-card,.payment-card,.order-card{border-radius:10px}
@media(min-width:801px){.tools-toggle{display:none}.tools-backdrop{display:none!important}.tools{display:grid!important}.menu-btn{cursor:pointer}.workspace{align-items:start}.canvas-wrap{min-height:calc(100vh - 58px)}}
@media(max-width:800px){
  .topbar{padding:7px 10px;min-height:58px;flex-wrap:nowrap}.menu-btn{display:none}.brand{font-size:14px}.device-switch{display:none}.top-actions{display:flex;max-width:none;flex:0 0 auto;margin-left:auto}.top-actions button{min-width:40px;padding:6px 8px}.top-actions button[data-action=preview],.top-actions button[data-action=code-view],.top-actions button[data-action=save],.top-actions button[data-action=publish]{display:none}.tools-toggle{display:block;min-height:42px;font-size:15px;order:0;padding:8px 12px}.save-state{display:inline}.version{font-size:10px;padding:5px 7px}
  .workspace{grid-template-columns:1fr}.tools{position:fixed;left:8px;right:8px;top:70px;bottom:10px;height:auto;max-height:none;padding:14px 13px;z-index:90;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid #2c3656;border-radius:16px;box-shadow:0 20px 50px #0009}.tools-head{top:-14px;padding:4px 2px 12px}.tool{min-height:76px}.tool-footer{margin-top:24px}.canvas-wrap{padding:8px}.canvas{border-radius:14px}.hero{grid-template-columns:1fr;padding:36px 20px;min-height:auto}.text-el h1{font-size:clamp(35px,9vw,48px)}.section{padding:26px 16px}
}

/* RC3 MOBILE-FIRST OVERRIDES */
html,body{width:100%;max-width:100%;overflow-x:hidden}
.canvas-wrap,.canvas,.section,.hero,.hero-copy,.hero-visual,.offer-card,.payment-card,.order-card,.faq{min-width:0}
.element{max-width:100%;overflow-wrap:anywhere}
@media(max-width:800px){
  .topbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;grid-template-rows:50px 48px;gap:0 7px;padding:5px 8px;height:auto;min-height:103px;align-items:center;position:sticky;top:0}
  .menu-btn{display:grid;grid-column:1;grid-row:1;width:38px;height:40px}
  .brand{grid-column:2;grid-row:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}
  .version{grid-column:3;grid-row:1;white-space:nowrap}
  .save-state{grid-column:4;grid-row:1;white-space:nowrap;font-size:9px}
  .device-switch{display:none}
  .tools-toggle{display:block;grid-column:1/3;grid-row:2;justify-self:stretch;width:100%;min-height:40px;padding:7px 10px;font-size:13px}
  .top-actions{grid-column:3/5;grid-row:2;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;width:100%;min-width:0;margin:0;overflow:visible}
  .top-actions button{display:grid!important;place-items:center;min-width:0;width:100%;height:40px;min-height:40px;padding:5px 3px;border-radius:8px;font-size:12px;white-space:nowrap}
  .top-actions button[data-action=code-view]{display:none!important}
  .workspace{display:block;width:100%;min-height:calc(100vh - 103px)}
  .canvas-wrap{width:100%;padding:6px;overflow-x:hidden}
  .canvas{width:100%;max-width:none;margin:0;border-radius:12px}
  .section{width:100%;padding:24px 14px}
  .hero{display:flex;flex-direction:column;gap:18px;padding:26px 15px 22px;min-height:0}
  .hero-copy,.hero-visual{width:100%;max-width:100%}
  .text-el h1{font-size:clamp(28px,8.5vw,42px);line-height:1.12;margin:12px 0}
  .hero-copy>p{font-size:15px;line-height:1.6}
  .hero .cta{width:100%;min-height:50px}
  .hero-visual{display:flex;flex-direction:column;align-items:center}
  .image-placeholder{width:100%;min-height:250px;max-height:320px;border-radius:18px}
  .image-placeholder img{width:100%;height:250px;max-height:320px;object-fit:cover}
  .mock-device{margin:12px 0 0;width:150px;height:190px}
  .trust-inline{font-size:10px;gap:6px}
  .trust-grid,.cards,.pay-grid{grid-template-columns:1fr;gap:10px}
  .trust-grid>div,.cards article,.pay-grid>div{padding:14px}
  .section h2{font-size:24px;line-height:1.2}
  .offer-card{display:block;padding:18px}
  .offer-card strong{font-size:36px}
  .countdown{gap:5px;flex-wrap:nowrap}
  .countdown>div{min-width:0;flex:1;padding:9px 5px}
  .countdown b{font-size:20px}
  .order-card{padding:16px}
  .order-card input{font-size:16px;min-height:46px}
  .cta{width:100%;min-height:48px}
  .tools{left:6px;right:6px;top:108px;bottom:6px;border-radius:16px;padding:11px;max-height:none;grid-template-columns:repeat(2,minmax(0,1fr));}
  .tools-head{top:-11px;padding:3px 2px 10px}
  .tool{min-height:68px;padding:7px 4px}
  .tool span{font-size:19px}
  .tool small{font-size:10px;text-align:center}
  .tool-footer{grid-column:1/-1;display:grid;grid-template-columns:1fr;gap:7px;margin-top:12px}
  .tool-footer button{min-height:46px}
  .inspector{left:0;right:0;bottom:-80%;top:auto;width:100%;height:auto;max-height:78vh;border-left:0;border-top:1px solid var(--line);border-radius:18px 18px 0 0;padding:14px;transition:bottom .2s;box-shadow:0 -15px 35px #1119362a;z-index:95}
  .inspector.open{right:0;bottom:0}
  .inspector textarea{min-height:90px}
  .target-nav button{min-height:40px}
  .share-modal{padding:10px}
  .share-box{width:100%;max-height:90vh;overflow:auto;padding:16px;border-radius:16px}
}
@media(max-width:380px){
  .brand{font-size:13px}.version{font-size:9px;padding:4px 5px}.save-state{font-size:8px}
  .top-actions{gap:3px}.top-actions button{font-size:11px}
  .tools-toggle{font-size:12px}
  .hero{padding-left:12px;padding-right:12px}
  .section{padding-left:12px;padding-right:12px}
}