:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;color:#17241f;background:#f5f8f6}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:0}input,select{width:100%;border:1px solid #dce5df;padding:12px;border-radius:10px;background:#fff;color:#14251a}button.primary{background:#168553;color:#fff;border-radius:10px;padding:12px 17px;font-weight:700}.shell{display:flex;min-height:100vh}aside{width:245px;flex-shrink:0;background:#10241e;color:white;padding:27px 18px;display:flex;flex-direction:column}.brand{font-size:25px;padding:0 14px 28px}.brand small{display:block;font-size:11px;letter-spacing:.13em;color:#9ab2a5;margin-left:25px;margin-top:2px}.nav{display:block;text-align:left;width:100%;padding:14px 15px;background:transparent;color:#b8d0c4;border-radius:11px;margin:3px 0}.nav.active,.nav:hover{background:#275240;color:#fff}.side-note{color:#89a798;font-size:12px;line-height:1.8;margin-top:auto;padding:20px 12px}main{flex:1;min-width:0;padding:33px 42px;max-width:1600px;margin:0 auto}header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:29px}.eyebrow{letter-spacing:.16em;color:#429675;font-size:10px;font-weight:900}h1{margin:8px 0;font-size:32px;letter-spacing:-.04em}h2{font-size:21px;margin:0 0 8px}h3{font-size:15px;margin:18px 0 12px}p{margin:4px 0;color:#718378;font-size:13px;line-height:1.7}.status{border:1px solid #dce8de;background:white;padding:12px;border-radius:99px;color:#378a5b;font-size:12px;white-space:nowrap}.toolbar{display:flex;justify-content:space-between;align-items:center;margin:15px 0 20px}.toolbar span{font-size:12px;color:#6c8171}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:19px}.template{border:1px solid #e1eae3;background:#fff;border-radius:17px;overflow:hidden;box-shadow:0 5px 16px #1b423009}.template:hover{box-shadow:0 11px 30px #1b423021;transform:translateY(-2px)}.mock{height:200px;position:relative;padding:24px 22px 0;background:linear-gradient(150deg,color-mix(in srgb,var(--tone) 12%,white),white);overflow:hidden}.mock-header{background:var(--tone);color:white;padding:8px 12px;border-radius:11px 11px 0 0;font-weight:700;font-size:11px}.mock-hero{background:var(--tone);color:#fff;padding:17px 12px 24px;font-size:20px;font-weight:900}.mock-cards{display:flex;gap:7px;transform:translateY(-12px)}.mock-cards span{background:white;border:1px solid #e3e9e5;border-radius:9px;box-shadow:0 3px 9px #0001;padding:17px 8px;font-size:18px;flex:1;text-align:center}.template-info{padding:17px}.template-info b{display:block;font-size:15px;margin-bottom:5px}.template-info p{min-height:42px}.template-info button{margin-top:14px;width:100%;padding:10px;background:#ecf6f0;color:#178452;border-radius:9px;font-weight:750}.view.hidden{display:none}.auth{border:1px solid #d9e8de;border-radius:14px;background:#fff;padding:14px;display:flex;align-items:center;gap:16px;margin-bottom:25px}.auth div{flex:1}.auth input{max-width:280px}.auth p{max-width:580px}#notice:not(:empty){padding:12px;border-radius:9px;background:#e9f5ed;color:#20734b;margin-bottom:15px;font-size:13px}.workspace{display:grid;grid-template-columns:minmax(280px,390px) minmax(300px,1fr);gap:26px}.controls,.panel{background:white;border:1px solid #e3eae6;padding:25px;border-radius:16px}.controls label,dialog label{display:block;font-size:12px;font-weight:700;margin-bottom:13px}.controls input,.controls select,dialog input{margin-top:7px}.double{display:flex;gap:15px}.double>*{width:50%}input[type=color]{height:45px;padding:5px}.full{width:100%}.section-item{display:flex;align-items:center;gap:7px;padding:11px;border:1px solid #e1e8e2;border-radius:10px;margin:8px 0;font-size:12px}.section-item input{width:auto;margin:0}.section-item span{flex:1}.section-item button{padding:6px;border-radius:6px;background:#f0f5f2}.preview-area{background:#e9f0ea;border-radius:18px;padding:30px;display:flex;align-items:center;flex-direction:column}.device{border:8px solid #162820;background:white;border-radius:33px;width:310px;max-width:100%;min-height:590px;overflow:hidden;box-shadow:0 23px 45px #173a2c2b}.phone-top{padding:8px 19px;font-size:10px;font-weight:700;display:flex;justify-content:space-between}.preview-header{color:white;padding:14px}.preview-header .topline{display:flex;align-items:center;justify-content:space-between;font-size:12px}.preview-header h2{font-size:25px;line-height:1.2;margin:28px 0 10px}.preview-header p{color:#fff9}.preview-search{background:white;border-radius:7px;padding:9px;margin-top:18px;color:#708379;font-size:11px}.preview-section{padding:12px 15px;border-bottom:1px solid #e6ebe7}.preview-section h4{font-size:12px;margin:3px 0 9px}.tiles{display:flex;gap:8px}.tiles div{flex:1;min-height:68px;background:#f2f6f3;border-radius:7px;padding:10px 4px;font-size:9px;display:flex;align-items:center;justify-content:center;text-align:center}.preview-note,.hint{font-size:11px;color:#91a196;margin-top:12px}.site-list{display:grid;gap:12px}.site-row{display:flex;gap:12px;align-items:center;justify-content:space-between;background:#fff;border:1px solid #e0e9e2;padding:18px;border-radius:13px}.site-row .actions{display:flex;gap:8px}.site-row button{border:1px solid #dbe9df;padding:10px;border-radius:8px;background:#fff}.site-row button.primary{background:#168553;color:white}.site-row small{display:block;color:#83918a;margin-top:5px}dialog{max-width:460px;width:calc(100% - 25px);border:0;border-radius:18px;padding:27px;box-shadow:0 35px 120px #172e2445}dialog::backdrop{background:#132a1c9e}.modal-head{display:flex;justify-content:space-between;margin-bottom:20px}.iconbutton{background:none;font-size:20px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.modal-actions button:not(.primary){padding:10px;background:#eee;border-radius:9px}@media(max-width:900px){aside{width:73px;padding:14px 6px}.brand{font-size:13px;padding:10px 4px}.brand small,.side-note{display:none}.nav{font-size:0;text-align:center}.nav:first-letter{font-size:20px}main{padding:24px 15px}.workspace{grid-template-columns:1fr}header{align-items:flex-start}.status{display:none}}@media(max-width:550px){aside{display:none}h1{font-size:26px}.auth{flex-wrap:wrap}.auth input{max-width:none}.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.template-info{padding:12px}.template-info p{font-size:11px}.mock{height:150px;padding:18px 10px 0}}

/* Phase 3: expanded section editor */
.section-actions{display:flex;gap:8px;margin:10px 0}.section-actions select{flex:1;min-width:0}.section-item{display:grid;grid-template-columns:25px minmax(100px,1fr) minmax(110px,1fr);gap:6px;align-items:center;padding:8px 0;border-bottom:1px solid #e5e7eb}.section-item input{min-width:0}.section-item input[placeholder="Banner image HTTPS URL"]{grid-column:2 / -1}.section-item button{min-width:30px}@media(max-width:800px){.section-item{grid-template-columns:25px 1fr 1fr}.section-item input[placeholder="Subtitle / content"]{grid-column:2 / -1}}
/* Page editor */
.controls textarea{width:100%;display:block;min-height:180px;resize:vertical;border:1px solid #dbe2e5;border-radius:10px;padding:12px;font:inherit;line-height:1.5;background:white;color:#162234}
.controls textarea:focus{outline:2px solid #18845a;outline-offset:2px}
.checkline{display:flex!important;align-items:center;gap:10px}.checkline input{width:auto!important}

/* Accessible drag handles and editor usability */
.drag-handle{font-size:22px;color:#80908b;cursor:grab;user-select:none}.section-item.drag-target{outline:2px dashed #16845a;outline-offset:2px}.section-item:focus-within{border-color:#268c64}.section-item input{min-width:0}.section-item input[aria-label="Section title"]{font-weight:700}

.preview-banner{color:#fff!important;border-radius:16px;padding:30px 20px!important;text-align:left}.preview-banner h3{font-size:22px;line-height:1.15;color:#fff}.preview-banner p{font-size:12px;color:#f0f4f2}.preview-cta{display:inline-block;margin-top:10px;background:#fff;color:#172923;padding:8px 12px;border-radius:7px;font-size:11px;font-weight:800}.preview-products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.preview-product{background:#fff;border:1px solid #e7e9e8;border-radius:10px;padding:8px}.preview-product-art{height:65px;display:grid;place-items:center;background:#edf1ef;border-radius:6px;color:#92a29b;font-size:23px}.preview-product small{font-size:10px}.preview-description{font-size:12px;line-height:1.6;color:#66756f}.preview-gallery{max-width:100%;border-radius:10px}.preview-faq{padding:12px;background:#f5f7f5;border-radius:8px;font-size:12px}.preview-membership{color:white;border-radius:12px}.preview-membership h4,.preview-membership p{color:white}

/* Full-page visual designer */
.canvas-toolbar,.canvas-toolbar-actions,.canvas-devices{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.canvas-toolbar-actions select{width:auto;min-width:130px}.canvas-toolbar-actions button,.canvas-devices button,.canvas-actions button{border:1px solid #dbe7df;border-radius:8px;padding:10px;background:#fff}.canvas-devices{justify-content:center;padding:14px}.canvas-devices button[aria-pressed=true]{background:#163e2d;color:white}.canvas-devices span{margin-left:auto;font-size:12px;color:#718378}.canvas-workspace{display:grid;grid-template-columns:210px minmax(340px,1fr) 290px;align-items:start;gap:14px}.canvas-library,.canvas-inspector{background:#fff;border:1px solid #dce7df;border-radius:14px;padding:18px;position:sticky;top:10px;max-height:85vh;overflow-y:auto}.canvas-library hr{border:0;border-top:1px solid #e2e9e4;margin:20px 0}.canvas-tool{display:block;width:100%;text-align:left;border:1px solid #e4ebe5;background:#f8fbf8;padding:11px;border-radius:9px;margin:7px 0;font-size:12px;cursor:grab}.canvas-tool:hover{border-color:#168553;background:#e8f5ee}.canvas-stage{background:#e8efeb;padding:25px;border-radius:16px;min-height:650px;overflow:auto;display:flex;align-items:center;flex-direction:column}.canvas-page{--accent:#168553;background:white;width:100%;min-height:560px;box-shadow:0 9px 40px #203c2920;transition:max-width .2s;overflow:hidden}.canvas-page[data-device=mobile]{max-width:390px}.canvas-page[data-device=tablet]{max-width:720px}.canvas-page[data-device=desktop]{max-width:1100px}.canvas-site-header{background:var(--accent);color:#fff;padding:17px 22px;font-weight:750}.canvas-block{margin:11px;border:2px solid transparent;border-radius:12px;background:white;cursor:pointer;box-shadow:0 1px 6px #00000010}.canvas-block.selected{border-color:#168553}.canvas-block.over{outline:3px dashed #168553}.canvas-block.inactive{opacity:.35}.canvas-block-head{display:flex;align-items:center;gap:8px;background:#f3f7f4;border-radius:9px 9px 0 0;color:#4a6455;padding:7px;font-size:11px}.canvas-block-head small{margin-left:auto}.canvas-handle{cursor:grab;font-size:20px}.canvas-item-content{padding:16px;overflow:hidden}.canvas-item-content img{max-width:100%;height:auto;border-radius:8px}.canvas-item-content h2{font-size:23px}.canvas-hero{background:var(--accent);padding:30px 20px;border-radius:11px;color:white}.canvas-hero strong{font-size:23px}.canvas-hero p{color:#fff9}.canvas-hero span,.canvas-cta{display:inline-block;background:#fff;color:#245039;padding:9px;border-radius:6px;margin-top:14px;font-weight:700}.canvas-cta{background:var(--accent);color:white}.canvas-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:13px}.canvas-product-card{border:1px solid #e5ede7;border-radius:7px;padding:26px 5px;background:#f6f8f6;text-align:center;font-size:10px}.canvas-commerce-core{background:#f0f6f2;border:1px dashed #95bea4;padding:45px 15px;border-radius:10px;text-align:center;font-size:12px;color:#286444}.canvas-spacer{height:30px}.canvas-field{display:block;margin:12px 0;font-size:12px;font-weight:650}.canvas-field span{display:block;margin-bottom:5px}.canvas-field input,.canvas-field select,.canvas-field textarea{width:100%;padding:10px;border:1px solid #dce7df;border-radius:8px;font:inherit}.canvas-field textarea{min-height:90px}.canvas-checkbox{display:flex;gap:10px;align-items:center;margin:12px 0;font-size:12px}.canvas-checkbox input{width:auto}.canvas-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}.canvas-delete{color:#b91c1c}.canvas-info{padding:11px;background:#f2f7f3;border-radius:8px}.canvas-page-options{padding:18px;border-bottom:1px solid #e5ede8}.canvas-page-options .canvas-field{max-width:470px}@media(max-width:1200px){.canvas-workspace{grid-template-columns:170px minmax(300px,1fr)}.canvas-inspector{grid-column:1 / -1;position:static;max-height:none}}@media(max-width:750px){.canvas-workspace{grid-template-columns:1fr}.canvas-library,.canvas-inspector{position:static;max-height:none}.canvas-stage{padding:10px}.canvas-toolbar-actions select{min-width:105px}}

/* Storefront showcase catalog: distinct editorial design directions, not emoji placeholders. */
#templates .toolbar{margin:28px 0 20px}#templates .toolbar h2{font-size:22px;letter-spacing:-.6px}#templates .toolbar span{font-size:12px;color:#76837e}
#gallery.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch}
.template-pro{min-width:0;overflow:hidden;border:1px solid #e4e8e6;border-radius:17px;background:white;box-shadow:0 5px 25px rgba(25,40,36,.035);transition:transform .22s,box-shadow .22s}
.template-pro:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(25,40,36,.12)}
.showcase-frame{height:330px;position:relative;overflow:hidden;background:var(--surface);isolation:isolate}
.showcase-photo{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center;inset:0;z-index:-2}
.showcase-frame:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.66),rgba(0,0,0,.05) 85%),linear-gradient(0deg,rgba(0,0,0,.66),transparent 52%);z-index:-1}
.showcase-pane{height:100%;display:flex;flex-direction:column;justify-content:space-between;color:#fff;padding:18px 19px 17px}
.showcase-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.28);padding-bottom:12px}
.showcase-wordmark{font-size:15px;font-weight:850;letter-spacing:-.5px}.showcase-bag{font-size:17px;letter-spacing:10px;white-space:nowrap}
.showcase-copy{margin-top:auto;margin-bottom:auto;display:flex;flex-direction:column;align-items:flex-start;gap:13px;padding-top:15px}
.showcase-kicker{font-size:9px;font-weight:850;letter-spacing:2.2px;opacity:.85}
.showcase-headline{font-size:clamp(27px,2.5vw,39px);line-height:1.03;letter-spacing:-1.7px;white-space:pre-line;font-weight:800;max-width:280px}
.showcase-cta{font-size:11px;font-weight:800;background:#fff;color:#162b23;border-radius:3px;padding:11px 15px}
.showcase-categories{display:flex;gap:8px;border-top:1px solid rgba(255,255,255,.24);padding-top:12px}
.showcase-category{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0;font-size:10px;font-weight:650;line-height:1.25}
.showcase-category-symbol{font-size:9px;opacity:.65;letter-spacing:1px}
.template-info-pro{padding:17px 20px 20px}.template-meta{display:flex;justify-content:space-between;gap:12px;margin-bottom:11px}
.template-label{font-size:9px;letter-spacing:1.3px;color:#7c8782;font-weight:800}
.template-heading h3{margin:0 0 5px;font-size:17px;letter-spacing:-.45px}.template-heading p{color:#74817b;min-height:0;margin:0;font-size:12px}
.template-actions{display:grid;grid-template-columns:95px 1fr;gap:8px;margin-top:17px}
.template-info-pro .template-actions button{margin:0;width:100%;padding:11px 10px;border-radius:8px;font-size:12px;cursor:pointer}
.template-info-pro button.template-preview{background:#f3f5f3;color:#34463b;border:1px solid #e6eae6}
.template-info-pro button.template-select{background:#143f32;color:#fff;border:1px solid #143f32}
.template-tech .showcase-headline,.template-devices .showcase-headline{font-weight:750;letter-spacing:-2px}.template-tech .showcase-frame:before,.template-devices .showcase-frame:before{background:linear-gradient(90deg,rgba(7,18,42,.87),rgba(7,18,42,.08)),linear-gradient(0deg,#0b1729b8,transparent 50%)}
.template-artisan .showcase-headline,.template-editorial .showcase-headline{font-family:Georgia,serif;font-weight:500;font-size:44px;letter-spacing:-1.3px}
.template-artisan .showcase-frame:before{background:linear-gradient(90deg,rgba(62,28,8,.77),rgba(62,28,8,.05)),linear-gradient(0deg,#312013a1,transparent 50%)}
.template-wellness .showcase-frame:before{background:linear-gradient(90deg,rgba(2,75,74,.87),rgba(2,75,74,.05)),linear-gradient(0deg,#073f4a99,transparent 50%)}
.template-fitness .showcase-frame:before,.template-industrial .showcase-frame:before{background:linear-gradient(90deg,rgba(10,15,18,.9),rgba(10,15,18,.05)),linear-gradient(0deg,#090b0cbb,transparent 50%)}
.template-fitness .showcase-headline,.template-industrial .showcase-headline{text-transform:uppercase;font-weight:950;letter-spacing:-1px}
.template-dining .showcase-headline{font-family:Georgia,serif;font-weight:500;font-size:42px}
.template-pro .showcase-photo{transition:transform .45s}.template-pro:hover .showcase-photo{transform:scale(1.05)}
.showcase-dialog{width:min(740px,calc(100% - 24px));max-width:740px;padding:22px;border:0;border-radius:18px}
.showcase-dialog-header{display:flex;justify-content:space-between;align-items:center;font-weight:800;margin-bottom:15px}.showcase-dialog-close{border:0;background:#f1f4f2;padding:9px 13px;border-radius:8px;cursor:pointer}
.showcase-dialog-image{width:100%;height:min(50vh,420px);object-fit:cover;border-radius:12px}.showcase-dialog-note{font-size:12px;color:#71817a;line-height:1.5}.showcase-dialog>.primary{padding:12px 17px;border-radius:9px}
@media(max-width:1320px){#gallery.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.showcase-frame{height:340px}}
@media(max-width:770px){#gallery.gallery{grid-template-columns:1fr;gap:16px}.showcase-frame{height:355px}.showcase-headline{font-size:38px}.template-info-pro{padding:15px}.template-heading h3{font-size:16px}}