.fe-editor { --fe-accent:#177f78; --fe-border:#dce7e5; color:#24373a; letter-spacing:0; }
.fe-toolbar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.fe-toolbar #feVersionLabel { color:#697c78; font-size:12px; }
.fe-toolbar-actions { margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; }
.fe-status { min-height:20px; margin:0 0 12px; font-size:13px; color:var(--fe-accent); }
.fe-status.error { color:#b33939; }
.fe-layout { display:grid; grid-template-columns:225px minmax(300px,1fr) 260px; align-items:start; gap:16px; }
.fe-panel { padding:18px; background:#fff; border:1px solid var(--fe-border); border-radius:6px; min-width:0; box-sizing:border-box; max-height:calc(100dvh - 190px); overflow-y:auto; position:sticky; top:16px; }
.fe-editor h3 { font-size:14px; font-weight:700; margin:0 0 16px; }
.fe-editor h4 { font-size:12px; font-weight:700; margin:24px 0 12px; color:#24373a; }
.fe-block-picker { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.fe-block-picker button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; min-height:78px; width:100%; padding:10px 4px; background:#fff; border:1px solid var(--fe-border); border-radius:6px; font-size:11px; color:#24373a; cursor:pointer; }
.fe-block-picker button:hover { background:#eef8f5; border-color:var(--fe-accent); }
.fe-editor button:disabled { cursor:default; opacity:.5; }
.fe-block-picker img { width:22px; height:22px; }
.fe-editor .fe-default { margin-top:16px; width:100%; font-size:11px; white-space:normal; line-height:1.5; text-align:left; padding:10px; }
.fe-editor label { display:block; margin:14px 0 6px; font-size:12px; color:#4c6460; font-weight:500; }
.fe-editor input:not([type=checkbox]):not([type=file]), .fe-editor textarea, .fe-editor select { width:100%; max-width:100%; min-width:0; box-sizing:border-box; background:#fff; border:1px solid var(--fe-border); border-radius:5px; padding:10px; font:13px Arial,sans-serif; color:#24373a; outline:none; }
.fe-editor input:focus, .fe-editor textarea:focus, .fe-editor select:focus { border-color:var(--fe-accent); box-shadow:0 0 0 2px #177f7814; }
.fe-editor textarea { min-height:90px; resize:vertical; }
.fe-editor input[type=color] { height:38px; padding:4px!important; cursor:pointer; }
.fe-editor .fe-checkbox { display:flex; gap:8px; align-items:center; font-size:12px; }
.fe-checkbox input { accent-color:var(--fe-accent); }
.fe-design { min-width:0; }
.fe-design-heading { display:flex; align-items:center; justify-content:space-between; padding:0 2px; }
.fe-design-heading span { color:#697c78; font-size:11px; margin-bottom:16px; }
.fe-canvas { background:#eaf0ef; border:1px solid var(--fe-border); padding:20px 14px; height:calc(100dvh - 210px); min-height:360px; overflow-y:auto; border-radius:6px; box-sizing:border-box; }
.fe-email { max-width:600px; margin:auto; background:#fff; box-shadow:0 2px 10px #263d3610; min-height:160px; }
.fe-block { position:relative; outline:2px solid transparent; outline-offset:-2px; cursor:pointer; min-height:12px; }
.fe-block:hover { outline-color:#80bcb3; z-index:1; }
.fe-block.selected { outline-color:var(--fe-accent); z-index:2; }
.fe-block:focus-visible { outline-color:var(--fe-accent); }
.fe-block-content { overflow:hidden; }
.fe-block-actions { display:flex; position:absolute; top:0; right:0; transform:translateY(-100%); gap:2px; padding:3px; align-items:center; background:var(--fe-accent); border-radius:4px 4px 0 0; color:#fff; }
.fe-block:first-child .fe-block-actions { top:0; transform:none; }
.fe-block-actions span { font-size:10px; margin:0 6px; }
.fe-block-actions button { width:28px; height:28px; border:0; border-radius:3px; background:#fff; padding:6px; cursor:pointer; }
.fe-block-actions img { width:16px; height:16px; }
.fe-email-section { padding:24px 32px; font-size:16px; line-height:1.55; overflow-wrap:anywhere; }
.fe-section-header { font-size:22px; }
.fe-section-footer { font-size:13px; }
.fe-email-heading { padding:12px 32px; font-weight:700; line-height:1.25; overflow-wrap:anywhere; }
.fe-email-text { padding:10px 32px; font-size:16px; line-height:1.6; overflow-wrap:anywhere; }
.fe-email-image { padding:12px 32px; }
.fe-email-image.bleed { padding:0; }
.fe-email-image img { display:inline-block; height:auto; max-width:100%; vertical-align:middle; }
.fe-email-button { padding:16px 32px; }
.fe-email-button span { border-radius:7px; max-width:100%; padding:0 8px; box-sizing:border-box; overflow-wrap:anywhere; }
.fe-email-divider { padding:14px 32px; }
.fe-email-divider hr { border:0; border-top:1px solid #e7e3e9; margin:0; }
.fe-social { display:grid; grid-template-columns:32% 38% 30%; padding:24px 28px; font-size:13px; line-height:1.5; align-items:center; overflow-wrap:anywhere; }
.fe-social>div { padding:8px; min-width:0; }
.fe-social-slogan { border-left:1px solid currentColor; }
.fe-social-logo { max-width:100%; height:auto; }
.fe-social-links { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-bottom:9px; }
.fe-social.stack { grid-template-columns:1fr; text-align:center; }
.fe-social.stack .fe-social-slogan { border-left:0; border-top:1px solid currentColor; border-bottom:1px solid currentColor; padding:14px 8px; }
.fe-placeholder { color:#78918a; font-size:12px; padding:8px 0; margin:0; }
.fe-selected-name { background:#eef8f5; color:var(--fe-accent); padding:9px 12px; border-radius:4px; font-size:12px; font-weight:700; }
.fe-upload { position:relative; display:flex!important; align-items:center; gap:8px; padding:9px; border:1px dashed #96bdb6; border-radius:5px; color:var(--fe-accent)!important; overflow:hidden; cursor:pointer; }
.fe-upload img { width:16px; height:16px; }
.fe-upload input { position:absolute; inset:0; opacity:0; width:100%; cursor:pointer; }
.fe-type-toggles { display:flex; gap:6px; margin-top:12px; }
.fe-type-toggles button { width:34px; height:34px; background:#fff; border:1px solid var(--fe-border); border-radius:4px; color:#24373a; font-size:14px; cursor:pointer; }
.fe-type-toggles button[aria-pressed=true] { background:#e7f4ef; border-color:var(--fe-accent); color:var(--fe-accent); }
.fe-type-toggles button[data-toggle=bold] { font-weight:700; }
.fe-type-toggles button[data-toggle=italic] { font-style:italic; }
.fe-type-toggles button[data-toggle=underline] { text-decoration:underline; }
.fe-number-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 8px; }
.fe-number-grid label:nth-of-type(2) { grid-column:2; grid-row:1; }
.fe-number-grid input:nth-of-type(1) { grid-column:1; grid-row:2; }
.fe-number-grid input:nth-of-type(2) { grid-column:2; grid-row:2; }
.fe-preview-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.fe-preview-tabs button[aria-pressed=true] { background:#e7f4ef; color:#177f78; border-color:#177f78; }
.fe-preview-stage { background:#eaf0ef; padding:12px; text-align:center; border-radius:6px; }
.fe-preview-stage iframe { display:block; width:100%; max-width:100%; height:65vh; min-height:360px; border:0; margin:auto; background:#fff; }
.fe-preview-stage pre { text-align:left; white-space:pre-wrap; overflow-wrap:anywhere; min-height:360px; margin:0; padding:16px; font:13px/1.7 monospace; background:#fff; }
.fe-preview-stage [hidden] { display:none; }
@media(max-width:1200px) { .fe-layout { grid-template-columns:200px minmax(280px,1fr); } .fe-properties { grid-column:1/-1; max-height:none; position:static; } #feProperties { max-width:600px; } }
@media(max-width:760px) { .fe-layout { grid-template-columns:minmax(0,1fr); } .fe-properties { grid-column:auto; } .fe-panel { max-height:none; position:static; } .fe-block-picker { grid-template-columns:repeat(3,minmax(0,1fr)); } .fe-toolbox { order:0; } .fe-design { order:1; } .fe-properties { order:2; } .fe-toolbar-actions { margin-left:0; } .fe-canvas { height:auto; min-height:300px; padding:14px 6px; overflow:visible; } .fe-social { grid-template-columns:1fr; text-align:center; } .fe-social-slogan { border-left:0; border-top:1px solid currentColor; border-bottom:1px solid currentColor; } .fe-email-heading,.fe-email-text,.fe-email-section { padding-left:18px; padding-right:18px; } .fe-email-heading { font-size:24px!important; } }