/* خطوط النظام السريعة بدل الاعتماد على الإنترنت */
:root{--green:#063f31;--green2:#0f5a46;--gold:#c99a45;--gold2:#f1dfbd;--bg:#fbfaf7;--soft:#f4f6f3;--line:#e7e9e4;--text:#1f2933;--muted:#718096;--white:#fff;--red:#d94141;--shadow:0 18px 50px rgba(6,63,49,.08);--radius:22px}
*{box-sizing:border-box}body{margin:0;font-family:'Cairo','Tajawal','Segoe UI',Tahoma,Arial,sans-serif;background:var(--bg);color:var(--text)}a{text-decoration:none;color:inherit}button,input,textarea,select{font-family:inherit} .topbar,.app-topbar{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 7%;position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:10px;color:var(--green)}.brand b{font-size:30px;line-height:1}.brand small{display:block;letter-spacing:7px;font-size:12px;margin-top:2px}.brand-mark{width:42px;height:54px;border-radius:12px;border:5px solid var(--green);border-left-color:var(--gold);transform:skewY(-12deg);display:inline-block}.brand.light{color:#fff}.brand.light .brand-mark{border-color:#fff;border-left-color:var(--gold)}.nav{display:flex;gap:34px;font-weight:700;color:#28343b}.nav a{padding:25px 0}.nav a:hover{color:var(--green)}.btn,.top-actions .btn,.primary-btn{background:linear-gradient(135deg,var(--green),#00634b);color:#fff;padding:12px 24px;border-radius:10px;border:none;font-weight:800;box-shadow:0 8px 18px rgba(6,63,49,.18);cursor:pointer}.btn.ghost{background:#fff;color:var(--green);border:1px solid var(--line);box-shadow:none}.link{font-weight:700;color:#28343b}.top-actions{display:flex;align-items:center;gap:18px}.hero{min-height:620px;position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.80)),radial-gradient(circle at 15% 50%,#f5dec0 0,#fff0 30%),url('../img/pattern.svg')}.hero:before{content:"";position:absolute;inset:auto 0 0 0;height:280px;background:linear-gradient(0deg,rgba(217,187,144,.25),transparent);pointer-events:none}.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center;padding:70px 8%}.hero h1{font-size:54px;line-height:1.45;margin:0;color:var(--green);font-weight:900}.hero h1 span{color:var(--gold)}.hero p{font-size:19px;color:#5d6972;max-width:620px;line-height:2}.hero-actions{display:flex;gap:14px;margin-top:25px}.micro{display:flex;gap:22px;color:#4c5b63;font-size:14px;margin-top:16px}.hero-card{background:#fff;border:1px solid var(--line);border-radius:26px;padding:28px;box-shadow:var(--shadow);position:relative}.input-demo{background:#f8f8f6;border:8px solid #fff;border-radius:18px;padding:20px;text-align:center;box-shadow:inset 0 0 0 1px var(--line);color:#31424a}.platforms{display:flex;gap:16px;justify-content:center;margin-top:28px}.platforms span{background:#fff;border:1px solid var(--line);border-radius:14px;width:76px;height:76px;display:grid;place-items:center;box-shadow:0 8px 20px rgba(0,0,0,.04);font-weight:800}.features{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;padding:25px 8%}.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}.card-icon{width:58px;height:58px;border-radius:16px;background:linear-gradient(135deg,var(--green),#0a664f);color:#fff;display:grid;place-items:center;font-size:24px;margin-bottom:12px}.how{padding:20px 8% 50px}.section-title{text-align:center;color:var(--green);font-size:28px;margin:10px 0 25px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.step{text-align:center}.step .num{width:46px;height:46px;margin:auto;background:var(--green);color:#fff;border-radius:50%;display:grid;place-items:center;font-weight:900}.platform-strip{margin:20px 8% 35px;background:#fff;border:1px solid var(--line);border-radius:16px;display:grid;grid-template-columns:repeat(5,1fr);gap:12px;padding:10px}.platform-strip span{text-align:center;padding:12px;border-radius:12px;border:1px solid var(--line)}.site-footer{background:var(--green);color:#fff;margin-top:30px;padding:45px 8% 20px;background-image:linear-gradient(135deg,rgba(255,255,255,.05) 25%,transparent 25%)}.footer-grid{display:grid;grid-template-columns:1.4fr .7fr .7fr 1.1fr;gap:35px}.footer-grid a{display:block;margin:7px 0;color:#dfeee8}.subscribe input{padding:13px;border-radius:8px;border:0;width:65%}.subscribe button{padding:13px;border:0;border-radius:8px;background:var(--gold);color:#fff;font-weight:800}.footer-bottom{text-align:center;border-top:1px solid rgba(255,255,255,.15);padding-top:18px;margin-top:30px;color:#d9e4df}.auth-page{min-height:calc(100vh - 76px);display:grid;grid-template-columns:1fr 1fr;padding:50px 7%;gap:70px;background:#fff}.auth-visual{display:flex;flex-direction:column;justify-content:center;text-align:center;background:linear-gradient(135deg,#fff,#fbf1e2);border-radius:34px;padding:45px}.auth-visual h1{font-size:42px;color:var(--green);line-height:1.45}.auth-visual h1 span{color:var(--gold)}.auth-card{align-self:center;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:28px;padding:45px;max-width:560px;width:100%}.form-group{margin-bottom:18px}.form-group label{display:block;margin-bottom:8px;font-weight:800}.input,textarea,select{width:100%;border:1px solid var(--line);background:#fff;border-radius:12px;padding:14px 16px;color:var(--text);outline:none}.input:focus,textarea:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(6,63,49,.08)}.muted{color:var(--muted)}.alert{padding:14px 18px;border-radius:12px;margin:15px 0}.alert.error{background:#fff0f0;color:#9c2424}.alert.success{background:#eaf8f1;color:#11613f}.app-body{background:#fff}.app-layout{display:grid;grid-template-columns:280px 1fr;min-height:calc(100vh - 76px)}.sidebar{border-left:1px solid var(--line);background:#fff;padding:26px 20px;position:sticky;top:76px;height:calc(100vh - 76px);overflow:auto}.sidebar a,.admin-sidebar a{display:flex;align-items:center;gap:12px;padding:13px 16px;border-radius:12px;margin:4px 0;color:#31424a;font-weight:700}.sidebar a.active,.admin-sidebar a.active{background:#eaf4ef;color:var(--green);border-right:4px solid var(--green)}.side-btn.primary{background:var(--green);color:#fff;justify-content:center;margin-bottom:16px}.content{padding:34px 42px;overflow:hidden}.user-chip{display:flex;align-items:center;gap:10px}.avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--gold2),#fff);display:grid;place-items:center;border:1px solid var(--line);font-weight:900;color:var(--green)}.user-chip small{display:block;color:var(--muted);font-size:12px}.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.page-head h1{font-size:34px;color:var(--green);margin:0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:22px 0}.stat{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:var(--shadow);display:flex;justify-content:space-between;align-items:center}.stat b{display:block;font-size:34px;color:var(--green)}.stat small{color:#15915f}.grid-2{display:grid;grid-template-columns:1.4fr .9fr;gap:24px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.table-card{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);overflow:hidden}.table-card h3{margin:0;padding:20px;border-bottom:1px solid var(--line);color:var(--green)}table{width:100%;border-collapse:collapse}th,td{padding:15px;border-bottom:1px solid var(--line);text-align:right}th{color:#66727a;background:#fbfbfa}.badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:800}.badge.green{background:#e7f7ee;color:#117445}.badge.gold{background:#fff5df;color:#9a6a13}.badge.red{background:#fff0f0;color:#ad3030}.action-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.action-tile{border:1px solid var(--line);border-radius:16px;padding:22px;background:#fff;display:flex;align-items:center;gap:16px}.help-card{margin-top:20px;background:var(--green);color:#fff;border-radius:20px;padding:20px}.help-card button{background:var(--gold);color:#fff;border:0;border-radius:9px;padding:10px 18px;font-weight:800}.wizard{display:flex;justify-content:center;gap:120px;align-items:center;margin:18px 0 40px}.wizard .w-step{text-align:center;color:#7a858d;position:relative}.wizard .circle{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:#fff;display:grid;place-items:center;margin:auto;font-weight:900}.wizard .done .circle,.wizard .active .circle{background:var(--green);color:#fff}.wizard .active{color:var(--green);font-weight:800}.form-card{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);padding:28px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}.color-row{display:flex;gap:12px}.color-box{width:46px;height:46px;border-radius:12px;border:1px solid var(--line)}.upload-zone{border:2px dashed #ccd4d0;border-radius:18px;padding:32px;text-align:center;color:#75818a;background:#fbfbfa}.choices{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.choice{border:1px solid var(--line);border-radius:16px;padding:22px;text-align:center;background:#fff;cursor:pointer}.choice.selected{border-color:var(--green);box-shadow:0 0 0 3px rgba(6,63,49,.08)}.check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.check-card{border:1px solid var(--line);border-radius:14px;padding:14px 16px}.editor-layout{display:grid;grid-template-columns:1.1fr .65fr;gap:24px}.textarea-editor{min-height:360px}.analysis-card{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:25px}.metric-row{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}.metric{border:1px solid var(--line);border-radius:14px;padding:14px}.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-bottom:20px}.tab{padding:14px 22px;border:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;background:#fff;font-weight:800}.tab.active{color:var(--green);box-shadow:inset 0 -4px var(--green)}.post-list{display:flex;flex-direction:column;gap:14px}.post-item{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px}.post-actions{display:flex;gap:10px;margin-top:14px}.small-btn{border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 14px;cursor:pointer}.bridge-layout{display:grid;grid-template-columns:1fr 330px;gap:25px}.bridge-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.bridge-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px}.score{float:left;color:var(--green);font-weight:900}.template-page{display:grid;grid-template-columns:240px 1fr 310px;gap:22px}.filters,.preview-side{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:var(--shadow)}.template-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.tpl-card{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}.tpl-thumb{height:260px;padding:18px;display:flex;align-items:center;justify-content:center;background:#f7f3eb}.mini-post{width:180px;height:220px;border-radius:18px;padding:18px;background:linear-gradient(135deg,#fbf2e4,#fff);color:var(--green);box-shadow:0 14px 40px rgba(0,0,0,.08);display:flex;flex-direction:column;justify-content:space-between}.mini-post.dark{background:linear-gradient(135deg,#063f31,#0f7a5c);color:#fff}.mini-post.blue{background:linear-gradient(135deg,#d9ecf4,#fff);color:#0b3954}.tpl-card footer{padding:14px}.design-editor{display:grid;grid-template-columns:280px 1fr 260px;gap:18px}.tool-panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}.canvas-wrap{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:var(--shadow);overflow:auto}.post-canvas{width:760px;height:760px;margin:auto;background:linear-gradient(135deg,#fff,#fbf1e2 58%,#eef6f1);border-radius:26px;position:relative;padding:60px;box-shadow:inset 0 0 0 1px #eadfcf;color:var(--green);overflow:hidden}.post-canvas h1{font-size:48px;line-height:1.35;margin:80px 0 20px}.post-canvas .city{position:absolute;bottom:0;left:0;right:0;height:220px;background:linear-gradient(0deg,rgba(201,154,69,.22),transparent)}.post-canvas .canvas-logo{position:absolute;top:40px;right:50px;font-size:34px;font-weight:900}.post-canvas .point-row{background:rgba(255,255,255,.75);border:1px solid var(--line);border-radius:14px;margin:12px 0;padding:12px 20px;font-weight:800}.download-bar{position:sticky;bottom:0;background:#fff;border-top:1px solid var(--line);padding:14px;display:flex;justify-content:flex-end;gap:12px;margin-top:18px}.visual-lab{display:grid;grid-template-columns:260px 1fr 260px;gap:20px}.phone-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.phone-card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow)}.phone-screen{height:400px;background:linear-gradient(135deg,#fff,#f2eadc);padding:24px;color:var(--green);display:flex;flex-direction:column;justify-content:space-between}.phone-screen h3{font-size:26px}.export-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.image-card{border:1px solid var(--line);background:#fff;border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}.image-card .mini-post{width:100%;height:240px;border-radius:0}.project-detail{display:grid;grid-template-columns:1fr 320px;gap:24px}.summary-side{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:var(--shadow)}.chart-line{height:210px;background:linear-gradient(180deg,transparent 24%,#eef1ed 25%,transparent 26%,transparent 49%,#eef1ed 50%,transparent 51%,transparent 74%,#eef1ed 75%,transparent 76%);position:relative}.chart-line:after{content:"";position:absolute;left:20px;right:20px;top:65px;height:80px;border-bottom:4px solid var(--green);border-radius:50%;transform:rotate(-3deg)}.donut{width:190px;height:190px;border-radius:50%;background:conic-gradient(#0f8b62 0 38%,#c99a45 38% 66%,#e6e6e6 66% 100%);margin:auto;position:relative}.donut:after{content:"1.26M";position:absolute;inset:40px;background:#fff;border-radius:50%;display:grid;place-items:center;font-weight:900;color:var(--green)}.settings-grid{display:grid;grid-template-columns:1fr 1.2fr 280px;gap:22px}.settings-menu a{display:block;padding:16px;border-radius:12px}.settings-menu a.active{background:#f2f7f4;color:var(--green);border-right:4px solid var(--green)}.admin-top{height:70px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px}.admin-layout{display:grid;grid-template-columns:280px 1fr}.admin-sidebar{background:linear-gradient(180deg,#053b2e,#032e24);color:#eaf5ef;min-height:calc(100vh - 70px);padding:28px 18px;position:sticky;top:70px;height:calc(100vh - 70px);overflow:auto}.admin-sidebar a{color:#eaf5ef}.admin-content{padding:34px;background:#fff}.admin-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.admin-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:var(--shadow)}.admin-card b{font-size:32px;color:var(--green)}.admin-grid{display:grid;grid-template-columns:1fr 1fr .7fr;gap:20px;margin-top:22px}.inline-actions{display:flex;gap:8px}.icon-btn{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;cursor:pointer}.search-row{display:flex;gap:12px;margin:20px 0}.search-row .input{max-width:360px}.pagination{display:flex;gap:8px;justify-content:center;margin:18px}.pagination a{border:1px solid var(--line);border-radius:8px;padding:8px 12px}.pagination a.active{background:var(--green);color:#fff}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.price-card{border:1px solid var(--line);border-radius:22px;padding:28px;background:#fff;box-shadow:var(--shadow)}.price-card.featured{background:#eef7e9;border-color:#c7dbbd}.mobile-toggle{display:none}
@media(max-width:1100px){.nav{display:none}.hero-inner,.auth-page,.grid-2,.editor-layout,.bridge-layout,.template-page,.design-editor,.visual-lab,.project-detail,.settings-grid,.admin-grid{grid-template-columns:1fr}.features,.steps,.stats,.admin-cards,.export-grid,.phone-preview{grid-template-columns:repeat(2,1fr)}.app-layout,.admin-layout{grid-template-columns:1fr}.sidebar,.admin-sidebar{position:relative;top:0;height:auto;display:grid;grid-template-columns:repeat(2,1fr)}.content,.admin-content{padding:22px}.post-canvas{width:600px;height:600px}.template-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.topbar,.app-topbar{padding:0 16px}.hero-inner{padding:35px 18px}.hero h1{font-size:34px}.features,.steps,.stats,.admin-cards,.export-grid,.phone-preview,.template-grid,.choices,.form-row,.check-grid,.metric-row,.bridge-grid,.price-grid{grid-template-columns:1fr}.sidebar,.admin-sidebar{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.platform-strip{grid-template-columns:1fr 1fr}.auth-page{padding:20px}.post-canvas{width:430px;height:430px;padding:30px}.post-canvas h1{font-size:28px;margin-top:50px}.content{padding:16px}.wizard{gap:18px;overflow:auto}.admin-sidebar{min-height:auto}.app-topbar .brand small{display:none}}

/* ===== Medad Pro Upgrade: fixed header, premium interactions, responsive polish ===== */
html{scroll-behavior:smooth}body{padding-top:76px}.topbar,.app-topbar{position:fixed;inset:0 0 auto 0;height:76px;z-index:999;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);box-shadow:0 8px 28px rgba(6,63,49,.06)}.admin-body{padding-top:70px}.admin-top{position:fixed;inset:0 0 auto 0;z-index:999;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);box-shadow:0 8px 28px rgba(6,63,49,.06)}
.app-layout{min-height:calc(100vh - 76px)}.admin-layout{min-height:calc(100vh - 70px)}.sidebar{top:76px}.admin-sidebar{top:70px}.content,.admin-content{min-height:calc(100vh - 76px);background:linear-gradient(180deg,#fff 0,#fbfaf7 100%)}
.topbar:after,.app-topbar:after,.admin-top:after{content:"";position:absolute;bottom:-1px;right:0;left:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),var(--green),transparent);opacity:.35}.brand-mark{position:relative;overflow:hidden}.brand-mark:after{content:"";position:absolute;inset:7px;border-right:3px solid currentColor;border-radius:6px;opacity:.25}.btn,.primary-btn,.small-btn,.icon-btn,.tab,.choice,.tpl-card,.image-card,.action-tile,.side-btn{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}.btn:hover,.primary-btn:hover,.small-btn:hover,.icon-btn:hover,.action-tile:hover,.tpl-card:hover,.image-card:hover{transform:translateY(-2px);box-shadow:0 14px 35px rgba(6,63,49,.12)}.small-btn:hover,.icon-btn:hover{border-color:var(--green);color:var(--green)}.selected{outline:3px solid rgba(6,63,49,.15)!important;border-color:var(--green)!important}.live-counter{margin-top:8px;font-weight:700;text-align:left}.medad-toast{position:fixed;bottom:28px;left:28px;background:linear-gradient(135deg,var(--green),#087154);color:#fff;padding:14px 20px;border-radius:16px;box-shadow:0 18px 45px rgba(6,63,49,.22);display:flex;align-items:center;gap:10px;transform:translateY(25px);opacity:0;pointer-events:none;z-index:2000;transition:.25s ease}.medad-toast.show{opacity:1;transform:translateY(0)}.toast-icon{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.18);font-weight:900}.medad-modal{position:fixed;inset:0;background:rgba(6,30,25,.35);display:grid;place-items:center;z-index:1999;opacity:0;pointer-events:none;transition:.2s ease;backdrop-filter:blur(4px)}.medad-modal.show{opacity:1;pointer-events:auto}.medad-modal-card{width:min(520px,92vw);background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 28px 80px rgba(6,63,49,.25);padding:28px;position:relative}.modal-close{position:absolute;left:18px;top:16px;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:24px;cursor:pointer}.modal-actions{display:flex;gap:10px;justify-content:flex-start;margin-top:24px}.has-download-bar{padding-bottom:90px}.download-bar{z-index:500;border-radius:18px 18px 0 0;box-shadow:0 -12px 35px rgba(6,63,49,.07)}
.card,.form-card,.analysis-card,.table-card,.tool-panel,.filters,.preview-side,.summary-side,.admin-card,.stat{background:rgba(255,255,255,.9);backdrop-filter:blur(8px)}.card,.form-card,.analysis-card,.table-card,.tool-panel,.filters,.preview-side,.summary-side,.admin-card,.stat,.tpl-card,.image-card{position:relative}.card:before,.form-card:before,.analysis-card:before,.table-card:before,.tool-panel:before,.summary-side:before,.admin-card:before,.stat:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(201,154,69,.10),transparent 35%,rgba(6,63,49,.05));opacity:.55}.input,textarea,select{transition:.18s ease}.input:hover,textarea:hover,select:hover{border-color:#cfd9d4;background:#fff}.wizard .w-step:after{content:"";position:absolute;top:21px;right:calc(50% + 28px);width:110px;border-top:2px solid #e8ece8}.wizard .w-step:first-child:after{display:none}.post-canvas{--canvas-primary:var(--green);color:var(--canvas-primary);background:radial-gradient(circle at 88% 8%,rgba(6,63,49,.10),transparent 25%),radial-gradient(circle at 0 100%,rgba(201,154,69,.22),transparent 28%),linear-gradient(135deg,#fff,#fbf1e2 58%,#eef6f1)}.post-canvas h1,.post-canvas .canvas-logo{color:var(--canvas-primary)}.post-canvas.format-story{width:430px;height:760px}.post-canvas.format-wide{width:760px;height:430px}.post-canvas.format-linkedin{width:760px;height:430px}.post-canvas.format-wide h1,.post-canvas.format-linkedin h1{font-size:38px;margin:55px 0 15px}.post-canvas.format-wide .point-row,.post-canvas.format-linkedin .point-row{display:inline-block;width:31%;vertical-align:top;font-size:13px}.phone-screen,.mini-post{position:relative;overflow:hidden}.phone-screen:after,.mini-post:after{content:"";position:absolute;inset:auto -30px -40px auto;width:160px;height:160px;background:rgba(255,255,255,.16);border-radius:50%}.metric b{font-size:26px;color:var(--green)}
.mobile-toggle{display:none;background:#fff;border:1px solid var(--line);border-radius:12px;width:42px;height:42px;place-items:center;cursor:pointer;font-size:20px}.admin-sidebar .help-card.dark{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
@media(max-width:1100px){body{padding-top:76px}.mobile-toggle{display:grid}.topbar .nav,.app-topbar .nav{display:none}.top-actions{display:none}.user-sidebar,.admin-sidebar{display:none!important;position:fixed!important;top:76px;bottom:0;right:0;width:min(360px,88vw);height:auto!important;z-index:1200;box-shadow:-20px 0 45px rgba(6,63,49,.18);overflow:auto}.admin-sidebar{top:70px}.sidebar-open .user-sidebar,.sidebar-open .admin-sidebar{display:block!important}.app-layout,.admin-layout{display:block}.content,.admin-content{padding:24px 18px}.wizard .w-step:after{display:none}.design-editor,.visual-lab,.template-page{gap:14px}.post-canvas{max-width:100%}.download-bar{justify-content:center;flex-wrap:wrap}}
@media(max-width:680px){body{padding-top:70px}.topbar,.app-topbar{height:70px}.brand b{font-size:24px}.brand-mark{width:34px;height:44px}.hero-inner{grid-template-columns:1fr}.hero-card{order:-1}.stats,.features,.steps,.grid-3,.admin-cards{grid-template-columns:1fr}.page-head{align-items:flex-start;gap:14px;flex-direction:column}.page-head h1{font-size:28px}.table-card{overflow:auto}.table-card table{min-width:720px}.post-canvas,.post-canvas.format-story,.post-canvas.format-wide,.post-canvas.format-linkedin{width:360px;height:520px;padding:28px}.post-canvas h1{font-size:28px}.post-canvas.format-wide .point-row,.post-canvas.format-linkedin .point-row{display:block;width:auto}.tool-panel,.canvas-wrap{padding:14px}.medad-toast{right:16px;left:16px;bottom:16px}.auth-visual{display:none}.auth-card{padding:28px}.footer-grid{gap:18px}.subscribe input{width:100%;margin-bottom:8px}.subscribe button{width:100%}}


/* Smart generator */
.generator-layout{display:grid;grid-template-columns:minmax(420px,1.1fr) minmax(360px,.9fr);gap:22px;align-items:start}.compact-grid{grid-template-columns:1fr 1fr;gap:16px}.compact-grid .full-span{grid-column:1/-1}.generator-actions,.head-actions,.preview-actions,.inline-actions{display:flex;gap:10px;flex-wrap:wrap}.helper-box{margin-top:18px;padding:18px;border:1px dashed var(--line);border-radius:16px;background:#fbfcfb}.generator-preview{min-height:620px}.preview-header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px}.stage-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.chip{padding:8px 12px;background:#f1f5f2;border:1px solid var(--line);border-radius:999px;color:#29443b;font-weight:700;font-size:13px}.generator-stage-wrapper{position:relative;background:linear-gradient(180deg,#f7faf8,#fff);border:1px solid var(--line);border-radius:22px;min-height:560px;display:grid;place-items:center;overflow:hidden;padding:24px}.konva-stage canvas{border-radius:18px;box-shadow:0 18px 40px rgba(0,0,0,.12)}.svg-ornament{position:absolute;inset:0;pointer-events:none;opacity:1}.generator-bottom-grid{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:22px}.text-outputs{display:grid;grid-template-columns:1fr 1fr;gap:14px}.text-output-card{padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff}.text-output-card h4{margin:0 0 8px;color:var(--green)}.html-capture-card{margin-top:18px;background:linear-gradient(135deg,#fff,#fff9ef 58%,#eef7f2);border:1px solid var(--line);border-radius:24px;padding:28px;position:relative;overflow:hidden}.capture-badge{display:inline-flex;background:var(--green);color:#fff;padding:10px 18px;border-radius:999px;font-weight:800}.html-capture-card h2{color:var(--green);margin:16px 0 18px;font-size:30px}.capture-points{display:grid;gap:12px}.capture-point{display:flex;gap:12px;align-items:flex-start;border:1px solid rgba(6,63,49,.1);background:#fff;border-radius:18px;padding:14px}.capture-point span{min-width:44px;height:44px;border-radius:14px;background:var(--green);display:grid;place-items:center;color:#fff;font-weight:800}.capture-point p{margin:0;line-height:1.8;font-weight:700;color:#1f2933}.capture-footer{display:flex;justify-content:space-between;gap:12px;margin-top:18px;color:#59656b;font-weight:700}.fabric-panel{display:none;gap:14px}.fabric-panel.show{display:grid}.fabric-panel canvas{width:100%;max-width:100%;border:1px solid var(--line);border-radius:18px;background:#f8fafc}.fabric-tools{display:flex;flex-wrap:wrap;gap:10px}.real-image-thumb{height:260px;background:#f8fafc;border-radius:18px;overflow:hidden;border:1px solid var(--line)}.real-image-thumb img{width:100%;height:100%;object-fit:contain}.upload-zone.drag{border-color:var(--green);background:#eef7f2}
@media(max-width:1200px){.generator-layout,.generator-bottom-grid{grid-template-columns:1fr}.generator-panel{order:1;position:static}.generator-preview{order:0;position:static}}
@media(max-width:680px){.text-outputs{grid-template-columns:1fr}.generator-stage-wrapper{min-height:460px}.html-capture-card h2{font-size:24px}.compact-grid{grid-template-columns:1fr}}

.final-preview-image{display:none;width:100%;height:100%;object-fit:contain;border-radius:22px;box-shadow:0 18px 40px rgba(0,0,0,.12);background:#fff}.hidden-stage{position:absolute !important;left:-99999px;top:-99999px;visibility:hidden}.generator-stage-wrapper::after{content:"";position:absolute;inset:0;border-radius:22px;pointer-events:none}.preview-actions .small-btn,.generator-actions .btn{white-space:nowrap}.real-image-thumb img{object-fit:contain;background:#fff}
.preview-frame{position:relative;z-index:2;display:grid;place-items:center;width:min(100%,640px);height:auto;max-width:100%;max-height:100%;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 16px 35px rgba(0,0,0,.08);border:1px solid rgba(6,63,49,.08)}
.generator-stage-wrapper .svg-ornament{z-index:1}.hidden-stage{position:absolute !important;left:-99999px;top:-99999px;visibility:hidden}.generator-stage-wrapper::before{content:"";position:absolute;inset:14px;border-radius:18px;border:1px dashed rgba(6,63,49,.08);pointer-events:none} .upload-zone{display:grid;place-items:center;text-align:center;min-height:110px;border:2px dashed #d9dfdc;border-radius:18px;background:#fcfcfa;color:#6b7280;font-weight:700;cursor:pointer}.upload-zone small{display:block;margin-top:6px}.generator-preview .preview-header h3{margin-bottom:6px}.generator-panel{position:sticky;top:94px}.generator-preview{position:sticky;top:94px}

/* template library + composer */
.template-toolbar{display:grid;grid-template-columns:1.2fr .8fr .8fr auto;gap:12px;margin-bottom:20px}.template-library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px}.template-image-card{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.05)}.template-real-thumb{aspect-ratio:4/5;background:#f7f7f7}.template-real-thumb img{width:100%;height:100%;object-fit:cover}.template-meta{padding:14px}.template-tags{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 12px}.template-tags span{padding:6px 10px;border-radius:999px;background:#eef5f1;color:#23463a;font-weight:700;font-size:12px}.composer-layout{display:grid;grid-template-columns:420px 1fr;gap:22px;align-items:start}.composer-form,.composer-preview{position:sticky;top:94px}.selected-template-banner{display:flex;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:18px;background:#fafcfb;margin-bottom:14px}.selected-template-banner img{width:72px;height:90px;object-fit:cover;border-radius:12px;box-shadow:0 8px 16px rgba(0,0,0,.08)}.composer-actions,.head-actions{display:flex;gap:10px;flex-wrap:wrap}.tips-box{margin-top:16px;padding:16px;border-radius:18px;background:#fbfcfa;border:1px dashed var(--line)}.composer-preview-box{min-height:760px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,#f8fbf9,#fff);display:grid;place-items:center;padding:18px;overflow:hidden}.thumb-strip{display:flex;gap:12px;overflow:auto;padding-bottom:8px}.thumb-card{min-width:155px;max-width:155px;background:#fff;border:2px solid transparent;border-radius:18px;padding:8px;cursor:pointer}.thumb-card.active{border-color:#0F6A4D;box-shadow:0 10px 22px rgba(15,106,77,.12)}.thumb-card img{width:100%;height:180px;object-fit:cover;border-radius:12px}.thumb-card span{display:block;font-weight:700;font-size:13px;line-height:1.5;padding:8px 4px 2px}.upload-zone.compact{min-height:48px;padding:12px;border:2px dashed #d7ddda;border-radius:16px;background:#fbfcfb;cursor:pointer;display:grid;place-items:center}.hidden-stage{position:absolute;left:-99999px;top:-99999px}.composer-preview .final-preview-image{width:auto;max-width:100%;max-height:720px;object-fit:contain;border-radius:22px;box-shadow:0 18px 36px rgba(0,0,0,.12);background:#fff}@media(max-width:1200px){.composer-layout{grid-template-columns:1fr}.composer-form,.composer-preview{position:static}.template-toolbar{grid-template-columns:1fr 1fr}}@media(max-width:700px){.template-toolbar{grid-template-columns:1fr}.thumb-card{min-width:130px;max-width:130px}.thumb-card img{height:150px}.composer-preview-box{min-height:520px}}


/* Template DB composer and admin zone editor */
.composer-layout{display:grid;grid-template-columns:minmax(520px,1fr) minmax(430px,.8fr);gap:22px;align-items:start}.composer-form,.composer-preview{position:sticky;top:92px}.selected-template-banner{display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:18px;padding:12px;background:#fff;margin-bottom:16px}.selected-template-banner img{width:86px;height:110px;object-fit:cover;border-radius:14px;box-shadow:0 8px 18px rgba(0,0,0,.08)}.composer-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.composer-preview-box{min-height:720px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,#f8faf8,#fff);display:grid;place-items:center;padding:16px;overflow:hidden}.composer-preview-box .final-preview-image{display:block;max-width:100%;max-height:700px;border-radius:22px;box-shadow:0 18px 40px rgba(0,0,0,.16);background:#fff;object-fit:contain}.template-strip{margin-top:22px}.thumb-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:14px;max-height:430px;overflow:auto;padding:6px}.thumb-card{border:1px solid var(--line);background:#fff;border-radius:18px;padding:8px;cursor:pointer;text-align:center;color:#123;transition:.2s}.thumb-card.active{outline:3px solid rgba(15,61,46,.25);border-color:var(--green);background:#eef7f2}.thumb-card img{width:100%;height:160px;object-fit:cover;border-radius:14px;display:block;margin-bottom:8px}.thumb-card span{font-size:12px;font-weight:800}.hidden-stage{position:absolute!important;left:-99999px;top:-99999px;visibility:hidden}.upload-zone.compact{min-height:50px}.tips-box{border:1px dashed var(--line);background:#fbfcfb;border-radius:16px;padding:14px;margin-top:16px}.admin-template-thumb{width:74px;height:96px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}.admin-template-grid{grid-template-columns:minmax(600px,1fr) 380px}.alert{padding:14px 18px;border-radius:14px;margin-bottom:16px;font-weight:800}.alert.success{background:#eaf7ef;color:#0f5132}.alert.error{background:#fdecec;color:#842029}.zone-editor-layout{display:grid;grid-template-columns:minmax(560px,1fr) 440px;gap:22px}.zone-preview-wrap{position:relative;max-width:650px;margin:auto;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:0 14px 35px rgba(0,0,0,.12)}.zone-preview-wrap img{width:100%;display:block}.zone-box{position:absolute;border:2px solid #00a884;background:rgba(0,168,132,.14);cursor:move;box-sizing:border-box;border-radius:8px}.zone-box span{position:absolute;right:0;top:0;transform:translateY(-100%);background:#004d3d;color:#fff;font-size:11px;padding:3px 6px;border-radius:6px 6px 0 0;white-space:nowrap}.zone-box i{position:absolute;left:-6px;bottom:-6px;width:12px;height:12px;background:#d4af37;border:2px solid #fff;border-radius:50%;cursor:nwse-resize}.zones-json{height:360px;font-family:Consolas,monospace;direction:ltr;text-align:left;font-size:12px}
@media(max-width:1200px){.composer-layout,.admin-template-grid,.zone-editor-layout{grid-template-columns:1fr}.composer-form,.composer-preview{position:static}.composer-preview-box{min-height:520px}}
.code-head{align-items:center}.code-generator-layout{display:grid;grid-template-columns:minmax(520px,.9fr) minmax(520px,1.1fr);gap:24px;align-items:start}.code-controls,.code-preview-card{position:sticky;top:94px}.code-preview-box{min-height:760px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(180deg,#f7faf8,#fff);display:grid;place-items:center;padding:18px;overflow:hidden}.code-preview-box .final-preview-image{display:none;object-fit:contain;border-radius:24px;box-shadow:0 22px 50px rgba(0,0,0,.18);background:#fff}.upload-zone.compact{min-height:52px;padding:12px;border:2px dashed #d7ddda;border-radius:16px;background:#fbfcfb;cursor:pointer;display:grid;place-items:center;font-weight:800}.tips-box{margin-top:16px;padding:16px;border-radius:18px;background:#fbfcfa;border:1px dashed var(--line)}.tips-box ul{margin:10px 0 0;padding-right:18px}.tips-box li{margin-bottom:6px}.code-template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}.code-template-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:20px;box-shadow:0 14px 32px rgba(0,0,0,.06);position:relative;overflow:hidden}.code-template-card:before{content:"";position:absolute;inset:auto -40px -40px auto;width:140px;height:140px;border-radius:50%;background:rgba(15,61,46,.08)}.code-template-card .icon{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:#eef7f3;color:#0f3d2e;font-size:26px;margin-bottom:12px}.code-template-card h3{margin:0 0 8px}.code-template-card p{min-height:52px}.code-template-card .btn{margin-top:12px;width:100%}@media(max-width:1200px){.code-generator-layout{grid-template-columns:1fr}.code-controls,.code-preview-card{position:static}.code-preview-box{min-height:560px}}@media(max-width:700px){.code-template-grid{grid-template-columns:1fr}.code-preview-box{min-height:460px}.code-generator-layout{gap:16px}}
/* Medad professional code-generated designer improvements */
.pro-code-layout{grid-template-columns:minmax(560px,1fr) minmax(430px,.82fr);align-items:start}.section-mini-head{margin-bottom:14px}.section-mini-head h3{margin:0 0 6px;color:var(--green)}.template-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:18px}.template-type-card{border:1px solid var(--line);background:linear-gradient(180deg,#fff,#fbfcfb);border-radius:18px;padding:14px;min-height:112px;text-align:right;cursor:pointer;transition:.18s;box-shadow:0 8px 18px rgba(6,63,49,.04);color:var(--text)}.template-type-card:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(6,63,49,.10)}.template-type-card.active{border-color:var(--green);background:#eef7f2;box-shadow:0 12px 30px rgba(15,106,77,.15)}.template-type-card .type-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:var(--green);color:#fff;margin-bottom:9px}.template-type-card b{display:block;color:var(--green);font-size:16px;margin-bottom:5px}.template-type-card small{color:#64736c;line-height:1.6}.quick-actions-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:14px}.code-preview-card{position:sticky;top:92px}.code-preview-box{background:radial-gradient(circle at top,#fdfaf2,#fff 55%,#eef5f1);border:1px solid var(--line);border-radius:26px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),var(--shadow)}.code-preview-box .final-preview-image{border-radius:24px;box-shadow:0 22px 55px rgba(6,63,49,.17)}.workflow-grid,.resources-grid,.blog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px}.workflow-card,.resource-card,.blog-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:var(--shadow);transition:.18s}.workflow-card:hover,.resource-card:hover,.blog-card:hover{transform:translateY(-3px)}.workflow-card span,.resource-card b{width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,var(--green),#0e6a52);color:#fff;display:grid;place-items:center;font-weight:900;margin-bottom:12px}.clean-list{line-height:2.1}.timeline-list{display:grid;gap:10px}.timeline-list b{padding:14px 16px;border-radius:14px;background:#f6faf7;border:1px solid var(--line)}.blog-card a{color:var(--green);font-weight:900}.price-card b{display:block;font-size:32px;color:var(--green);margin:10px 0}.nav a.active-top{color:var(--green);border-bottom:3px solid var(--green)}@media(max-width:1100px){.pro-code-layout{grid-template-columns:1fr}.code-preview-card{position:static}.workflow-grid,.resources-grid,.blog-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:680px){.template-type-grid,.workflow-grid,.resources-grid,.blog-grid{grid-template-columns:1fr}.quick-actions-row .small-btn{width:100%}}
/* Code-generated design engine fixes */
.code-preview-box{min-height:760px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,#f8fbf9,#fff);display:grid;place-items:center;padding:18px;overflow:hidden}
#designCanvas{display:block;max-width:100%;max-height:730px;border-radius:22px;box-shadow:0 18px 40px rgba(0,0,0,.16);background:#fff}
.preview-error{margin-top:12px;padding:14px 18px;border:1px dashed #d4af37;border-radius:16px;background:#fff8ea;color:#7a4b00;font-weight:700;line-height:1.8}.template-type-card{cursor:pointer}.template-type-card.active{border-color:#0f5d45!important;background:#eef8f2!important;box-shadow:0 12px 28px rgba(15,93,69,.12)}
@media(max-width:900px){.code-preview-box{min-height:520px}#designCanvas{max-height:500px}}
.code-template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}.code-template-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:0 12px 28px rgba(0,0,0,.05);min-height:210px;display:flex;flex-direction:column;gap:10px}.code-template-card .icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#0f3d2e;color:#fff;font-size:24px}.code-template-card h3{margin:6px 0 0}.code-template-card .btn{margin-top:auto}.code-generator-layout{align-items:start}.code-controls{min-width:0}.code-preview-card{position:sticky;top:94px}.template-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:18px}.template-type-card{border:1px solid var(--line);background:#fff;border-radius:20px;padding:18px;text-align:right;min-height:130px}.template-type-card .type-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:#064f3b;color:#fff;margin-bottom:12px}.template-type-card b{display:block;color:#0f3d2e;font-size:20px;margin-bottom:6px}.template-type-card small{display:block;color:#718096;line-height:1.6}.quick-actions-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}@media(max-width:1200px){.code-preview-card{position:static}.template-type-grid{grid-template-columns:1fr}.code-generator-layout{grid-template-columns:1fr!important}}

/* polished generator improvements */
.code-controls,.code-preview-card{background:linear-gradient(180deg,#ffffff,#fbfcfb);border:1px solid var(--line);box-shadow:0 18px 48px rgba(6,63,49,.08)}
.app-topbar{backdrop-filter:blur(12px);background:rgba(255,255,255,.92)}
.template-type-card{position:relative;overflow:hidden}.template-type-card:after{content:'';position:absolute;inset:auto -24px -24px auto;width:110px;height:110px;border-radius:50%;background:rgba(15,61,46,.05)}
.template-type-card.active .type-icon{background:linear-gradient(135deg,#0f5d45,#0b7b5c)}
.small-btn,.btn.ghost,.btn{transition:.2s ease}.small-btn:hover,.btn:hover{transform:translateY(-1px)}
.code-preview-box{background:radial-gradient(circle at top right,#fffdf7,#f7faf8 58%,#eef5f1)}
.final-preview-image,#designCanvas{border-radius:26px}
@media(max-width:768px){.page-head.code-head{gap:12px}.head-actions,.composer-actions{width:100%}.head-actions .btn,.composer-actions .btn{width:100%}.app-topbar{padding:10px 12px}.nav{overflow:auto;gap:12px;white-space:nowrap}}


/* ===== Stage+ UI Enhancements ===== */
.nav a.active-top{color:var(--green);position:relative}.nav a.active-top:after{content:'';position:absolute;bottom:16px;right:0;left:0;height:3px;border-radius:3px;background:var(--gold)}
.mobile-toggle{display:none;border:1px solid var(--line);background:#fff;width:44px;height:44px;border-radius:12px;font-size:22px;color:var(--green)}
.generator-tip-card{margin-top:18px;border:1px solid var(--line);border-radius:18px;padding:16px 18px;background:linear-gradient(180deg,#fff,#f7fbf9);display:flex;justify-content:space-between;gap:14px;align-items:center}
.tip-mini-stats{display:flex;gap:10px;flex-wrap:wrap}.chip{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:999px;background:#f3f7f5;border:1px solid var(--line);font-weight:700;color:var(--green)}
.variant-hints{display:flex;gap:10px;flex-wrap:wrap}.variant-hints button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 12px;font-weight:700;color:#365048;cursor:pointer}.variant-hints button:hover,.variant-hints button.active{background:#eaf4ef;color:var(--green);border-color:rgba(6,63,49,.25)}
.template-badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:#edf6f2;color:var(--green);font-size:12px;font-weight:800;margin-bottom:10px}
.template-tags{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 14px}.template-tags span{background:#f7faf8;border:1px solid var(--line);padding:6px 10px;border-radius:999px;font-size:13px;color:#3f5550}
.page-head.code-head{align-items:flex-start}.pro-code-layout{grid-template-columns:1.04fr .96fr;align-items:start}.code-controls,.code-preview-card{border-radius:28px}.preview-header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.preview-actions{display:flex;gap:8px;flex-wrap:wrap}
.code-preview-box{min-height:780px;display:grid;place-items:center;border:1px solid var(--line);border-radius:26px;padding:14px;overflow:hidden;background:radial-gradient(circle at top right,#fffdf7,#f7faf8 58%,#eef5f1)}
.template-type-card{position:relative;overflow:hidden;text-align:right}.template-type-card::after{content:'';position:absolute;left:-22px;bottom:-22px;width:92px;height:92px;border-radius:50%;background:rgba(15,61,46,.05)}
.template-type-card.active{box-shadow:0 14px 34px rgba(6,63,49,.12)}.type-icon{position:relative;z-index:1}
.form-card h3{margin-top:0;color:var(--green)} .analysis-card,.tool-panel,.summary-side,.settings-menu,.code-template-card,.resource-card,.blog-card,.bridge-card,.workflow-card{box-shadow:var(--shadow)}
.dashboard-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:20px;margin-bottom:24px}.hero-info-card{background:linear-gradient(135deg,#ffffff,#f5faf7);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:var(--shadow)}
.hero-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.hero-kpis .mini-kpi{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;text-align:center}.mini-kpi b{display:block;font-size:22px;color:var(--green)}
.clean-list{padding:0;margin:0;list-style:none}.clean-list li{padding:10px 0;border-bottom:1px dashed var(--line)}.timeline-list{display:grid;gap:12px}.timeline-list b{padding:12px 14px;border-radius:14px;background:#f9fbfa;border:1px solid var(--line)}
.resources-grid,.blog-grid,.code-template-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.resource-card,.blog-card,.code-template-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px}
.workflow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:20px}.workflow-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:20px;position:relative}.workflow-card span{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--green),#0d6b52);color:#fff;font-weight:800;margin-bottom:12px}
.settings-grid{display:grid;grid-template-columns:1fr 1.2fr .6fr;gap:20px;align-items:start}.settings-menu{background:#fff;border:1px solid var(--line);border-radius:22px;padding:10px}.settings-menu a{display:block;padding:12px 14px;border-radius:12px;margin:4px 0}.settings-menu a.active{background:#eaf4ef;color:var(--green);font-weight:800}
.real-image-thumb img{width:100%;height:240px;object-fit:cover;border-radius:16px;display:block}.image-card{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
.export-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.project-detail{display:grid;grid-template-columns:1.3fr .7fr;gap:20px}.summary-side,.tool-panel,.analysis-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px}.visual-lab{display:grid;grid-template-columns:.75fr 1.2fr .75fr;gap:20px;align-items:start}.phone-preview{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.phone-card{border:1px solid var(--line);background:#fff;border-radius:22px;padding:14px;box-shadow:0 8px 22px rgba(0,0,0,.05)}.phone-screen{min-height:200px;border-radius:18px;background:linear-gradient(180deg,#fff,#f9fbfb);padding:20px;border:1px dashed rgba(6,63,49,.16)}
.bridge-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}.bridge-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.bridge-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px;position:relative}.bridge-card .score{position:absolute;left:18px;top:18px;color:var(--gold);font-weight:800}
.editor-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:start}.metric-row{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.metric{background:#f9fbfa;border:1px solid var(--line);border-radius:18px;padding:14px;text-align:center}.metric b{display:block;font-size:22px;color:var(--green)}
.action-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.action-tile{display:flex;align-items:center;gap:10px;justify-content:center;padding:14px;border:1px solid var(--line);border-radius:16px;background:#fbfdfc;font-weight:800}
.form-row{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.wizard{display:flex;gap:18px;margin-bottom:20px;flex-wrap:wrap}.w-step{display:flex;align-items:center;gap:10px;color:var(--muted);font-weight:700}.w-step .circle{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f2f5f3;border:1px solid var(--line)}.w-step.active{color:var(--green)}.w-step.active .circle{background:var(--green);color:#fff}
.filters,.inline-actions{display:flex;gap:10px;flex-wrap:wrap}.live-counter{margin-top:8px;font-size:13px}
@media (max-width:1200px){
  .grid-2,.dashboard-hero,.project-detail,.visual-lab,.bridge-layout,.editor-layout,.pro-code-layout,.settings-grid{grid-template-columns:1fr}
  .grid-3,.stats,.resources-grid,.blog-grid,.code-template-grid,.workflow-grid{grid-template-columns:repeat(2,1fr)}
  .app-layout{grid-template-columns:1fr}.sidebar{position:fixed;top:76px;right:-310px;width:290px;height:calc(100vh - 76px);z-index:15;transition:.25s ease;box-shadow:var(--shadow)}
  body.sidebar-open .sidebar,body.sidebar-open .admin-sidebar{right:0}
  body.sidebar-open::after{content:'';position:fixed;inset:76px 0 0 0;background:rgba(12,24,19,.35);z-index:14}
  .mobile-toggle{display:grid;place-items:center}
  .content{padding:24px}
}
@media (max-width:860px){
  .hero-inner,.auth-page{grid-template-columns:1fr;padding:34px 5%}
  .topbar,.app-topbar{padding:0 4%}
  .nav{position:fixed;top:76px;right:-100%;width:min(85vw,340px);height:calc(100vh - 76px);background:#fff;border-left:1px solid var(--line);padding:20px;display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow);transition:.25s ease;z-index:15}
  body.sidebar-open .nav{right:0}
  .top-actions{display:none}
  body.sidebar-open .top-actions{display:flex;position:fixed;top:calc(76px + min(85vw,340px) + 10px);right:10px;left:10px;background:#fff;padding:14px;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);z-index:15;justify-content:center;flex-wrap:wrap}
  .features,.steps,.platform-strip,.footer-grid,.resources-grid,.blog-grid,.workflow-grid,.stats,.grid-3,.code-template-grid,.hero-kpis,.bridge-grid,.export-grid,.phone-preview,.action-grid,.form-row{grid-template-columns:1fr}
  .page-head,.preview-header,.generator-tip-card{flex-direction:column;align-items:stretch}
  .content{padding:18px}.sidebar{top:76px}.code-preview-box{min-height:560px}.real-image-thumb img{height:200px}
}
@media (max-width:560px){
  .page-head h1{font-size:28px}.brand b{font-size:24px}.brand small{letter-spacing:4px}.content{padding:14px}.form-card,.tool-panel,.analysis-card,.summary-side,.code-template-card,.resource-card,.blog-card,.bridge-card,.workflow-card{padding:16px}
}

/* clean frame version: remove random background clutter from generated cards */
.code-preview-box canvas{background:#fff;}
/* Final completion actions and responsive polish */
.admin-search-row,.search-row{display:grid;grid-template-columns:1fr 170px auto;gap:12px;margin:0 0 18px;align-items:center}.inline-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.icon-btn{border:1px solid var(--line);background:#fff;color:var(--green);border-radius:10px;min-width:36px;height:36px;display:inline-grid;place-items:center;cursor:pointer;font-weight:800}.icon-btn:hover,.small-btn:hover{background:#eef7f2;border-color:rgba(6,63,49,.25)}.pagination{display:flex;gap:8px;justify-content:center;padding:16px;flex-wrap:wrap}.pagination a{border:1px solid var(--line);border-radius:10px;padding:8px 12px;cursor:pointer}.pagination a.active{background:var(--green);color:#fff}.medad-modal.show{display:flex}.medad-modal{position:fixed;inset:0;background:rgba(15,23,42,.36);z-index:999;align-items:center;justify-content:center;padding:20px;display:none}.medad-modal-card{background:#fff;border-radius:22px;padding:24px;max-width:480px;width:100%;box-shadow:0 30px 80px rgba(0,0,0,.25);position:relative}.modal-close{position:absolute;left:14px;top:14px;border:0;background:#f2f5f3;border-radius:50%;width:34px;height:34px;cursor:pointer}.modal-actions{display:flex;gap:10px;margin-top:18px}.medad-toast{position:fixed;bottom:24px;left:24px;background:var(--green);color:#fff;border-radius:16px;padding:14px 18px;box-shadow:0 14px 40px rgba(0,0,0,.2);z-index:1000;transform:translateY(120px);opacity:0;transition:.25s}.medad-toast.show{transform:translateY(0);opacity:1}.toast-icon{margin-left:8px}.admin-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:var(--shadow)}.admin-card b{font-size:28px;color:var(--green)}.admin-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}.admin-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;margin-bottom:20px}.admin-layout{display:grid;grid-template-columns:280px 1fr;min-height:calc(100vh - 76px)}.admin-sidebar{background:var(--green);color:#fff;padding:20px;position:sticky;top:0;height:100vh;overflow:auto}.admin-sidebar a{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:12px;margin:5px 0;color:#e7f4ee}.admin-sidebar a.active{background:rgba(255,255,255,.16);color:#fff;border-right:4px solid var(--gold)}.admin-content{padding:30px;min-width:0}.admin-top{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.admin-user{display:flex;gap:10px;align-items:center}.help-card.dark{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:18px;padding:14px;margin-top:20px}.help-card.dark button{width:100%;border:0;border-radius:12px;padding:10px;font-weight:800;color:var(--green)}
@media(max-width:1200px){.admin-layout{grid-template-columns:1fr}.admin-sidebar{position:fixed;right:-310px;top:76px;width:300px;height:calc(100vh - 76px);z-index:30;transition:.25s}.admin-content{padding:22px}.admin-cards,.admin-grid{grid-template-columns:repeat(2,1fr)}body.sidebar-open .admin-sidebar{right:0}.admin-search-row,.search-row{grid-template-columns:1fr}}
@media(max-width:720px){.admin-cards,.admin-grid,.stats,.grid-2,.grid-3{grid-template-columns:1fr!important}.admin-content,.content{padding:14px}.table-card{overflow:auto}.table-card table{min-width:720px}.admin-top{padding:0 14px}.medad-toast{left:12px;right:12px;bottom:12px}.modal-actions{flex-direction:column}.admin-search-row,.search-row{grid-template-columns:1fr}.page-head{gap:12px}.page-head .btn,.head-actions .btn{width:100%}}
/* Final database-backed polish */
.admin-crud-grid{grid-template-columns:minmax(640px,1.25fr) minmax(360px,.75fr);align-items:start}.compact-grid{gap:12px}.alert.success,.alert.error{display:block}.alert.success{background:#eaf7ef;color:#0f5132}.alert.error{background:#fdecec;color:#842029}.form-card[id]{scroll-margin-top:96px}.inline-actions form{margin:0}.table-card table td,.table-card table th{vertical-align:middle}.admin-template-thumb{width:78px;height:78px;object-fit:cover;border-radius:12px;border:1px solid var(--line);background:#fff}.badge.red{background:#fee2e2;color:#991b1b}.badge.green{background:#e8f7ef;color:#0f5132}.form-card form .btn{cursor:pointer}@media(max-width:1100px){.admin-crud-grid{grid-template-columns:1fr}.admin-template-thumb{width:62px;height:62px}}@media(max-width:760px){.inline-actions{gap:6px}.icon-btn{min-width:34px;height:34px}.admin-crud-grid .table-card{overflow:auto}.admin-crud-grid table{min-width:760px}}

/* Moyasar payment & subscription polish */
.real-pricing-grid{align-items:stretch}.plan-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.badge.gold{background:#fff7df;color:#9a6a00;border:1px solid #f0d38b}.badge.red{background:#ffe8e8;color:#9b1c1c;border:1px solid #f0b5b5}.plan-price{display:flex;align-items:baseline;gap:8px;margin:18px 0;color:#0f3d2e}.plan-price b{font-size:40px}.yearly-note{padding:10px 12px;border-radius:14px;background:#f8fbf9;border:1px solid var(--line);color:#687771;font-weight:700}.plan-features{list-style:none;padding:0;margin:18px 0;display:grid;gap:10px}.plan-features li{padding:10px 12px;border-radius:14px;background:#fbfdfc;border:1px dashed rgba(15,61,46,.16)}.payment-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}.billing-status-card{display:flex;gap:14px;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:18px 22px;margin-bottom:22px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,#fff,#f7fbf9);box-shadow:var(--shadow)}.billing-status-card b{color:#0f3d2e}.checkout-layout{display:grid;grid-template-columns:1fr .78fr;gap:22px;align-items:start}.payment-form-card,.order-summary-card{position:relative;overflow:hidden}.payment-form-card:before,.order-summary-card:before{content:'';position:absolute;inset:auto -50px -50px auto;width:170px;height:170px;border-radius:50%;background:rgba(212,175,55,.10)}.sandbox-card{padding:16px 18px;border-radius:18px;background:#fff8e8;border:1px solid #ecd69c;color:#6b4a00;margin-bottom:16px}.secure-box{margin-top:18px;padding:14px 16px;border-radius:18px;background:#eaf4ef;border:1px solid rgba(15,61,46,.15);font-weight:800;color:#0f3d2e}.pay-btn{font-size:18px;padding:16px 20px}.summary-plan{display:grid;gap:6px;padding:16px;border-radius:18px;background:#f9fbfa;border:1px solid var(--line)}.payment-result-card{max-width:760px;margin:60px auto;padding:44px;border-radius:34px;text-align:center;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.payment-result-card .result-icon{width:86px;height:86px;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;background:#0f5d45;color:#fff;font-size:44px;font-weight:900}.payment-result-card .result-icon.fail{background:#b42318}.result-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:22px}.settings-admin-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:start}.settings-stack{display:grid;gap:20px}.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.filters .input{max-width:280px}.inline-actions form{display:flex;gap:6px;flex-wrap:wrap}.admin-card b small{font-size:14px;color:var(--muted)}
@media(max-width:1000px){.checkout-layout,.payment-info-grid,.settings-admin-grid{grid-template-columns:1fr}.plan-price b{font-size:32px}.payment-result-card{margin:24px 0;padding:28px}.filters .input{max-width:100%;width:100%}}