:root{
  --app-bg:#f4f6f8;
  --app-surface:#ffffff;
  --app-border:#dfe5ec;
  --app-text:#17202a;
  --app-muted:#64748b;
  --app-primary:#155eef;
  --app-primary-dark:#0f46b8;
  --app-success:#0f8f63;
  --app-warning:#b7791f;
  --app-danger:#c2410c;
  --app-radius:8px;
  --app-shadow:0 10px 28px rgba(15,23,42,.08);
}
body{
  background:var(--app-bg);
  color:var(--app-text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.app-navbar{
  background:rgba(255,255,255,.94);
  border-bottom:1px solid var(--app-border);
  box-shadow:0 1px 0 rgba(15,23,42,.03);
  backdrop-filter:blur(10px);
}
.brand-mark{font-weight:760;letter-spacing:0;color:#111827}
.brand-dot{display:inline-block;width:10px;height:10px;background:var(--app-primary);border-radius:2px;margin-right:9px}
.nav-link{border-radius:6px;margin:0 2px;color:#475569}
.nav-link.active{background:#eef4ff;color:var(--app-primary)!important}
.app-main{max-width:1560px}
.page-head{display:flex;gap:1rem;align-items:center;justify-content:space-between;margin-bottom:1rem}
.page-head h1{font-size:1.75rem;font-weight:760;margin:0}
.card{border-radius:var(--app-radius);border-color:var(--app-border);box-shadow:0 1px 2px rgba(15,23,42,.03)}
.stat{font-size:1.7rem;font-weight:780;line-height:1}
.table td,.table th{vertical-align:middle}
.actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.form-label{font-weight:650;color:#334155}
.btn{border-radius:7px;font-weight:650}
.btn-primary{background:var(--app-primary);border-color:var(--app-primary)}
.btn-primary:hover{background:var(--app-primary-dark);border-color:var(--app-primary-dark)}
.metric-card{background:var(--app-surface);border:1px solid var(--app-border);border-radius:var(--app-radius);padding:1rem}
.metric-card .label{color:var(--app-muted);font-size:.85rem;font-weight:650}
.toolbar-card{background:var(--app-surface);border:1px solid var(--app-border);border-radius:var(--app-radius);padding:1rem;margin-bottom:1rem}
.report-chart{display:flex;flex-direction:column;gap:1rem}
.report-row{border-bottom:1px solid var(--app-border);padding-bottom:1rem}
.report-row:last-child{border-bottom:0;padding-bottom:0}
.report-row-head{display:flex;justify-content:space-between;gap:1rem;align-items:center;margin-bottom:.55rem}
.report-bars{display:flex;flex-direction:column;gap:.35rem}
.report-bar-line{display:grid;grid-template-columns:minmax(115px,170px) minmax(120px,1fr) 48px;gap:.6rem;align-items:center}
.report-label{font-size:.8rem;color:#475569;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.report-track{height:14px;background:#eef2f7;border-radius:4px;overflow:hidden}
.report-bar{height:100%;border-radius:4px}
.report-bar.current{background:#155eef}
.report-bar.compare{background:#94a3b8}
.report-bar-line.muted{opacity:.86}
.report-value{font-weight:750;text-align:right;color:#17202a}
.empty-state{padding:3rem 1rem;text-align:center;color:var(--app-muted)}
.template-grid,.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.template-thumb,.media-thumb{background:#f8fafc;border:1px solid var(--app-border);border-radius:var(--app-radius);min-height:150px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.media-thumb img{width:100%;height:180px;object-fit:cover}
.badge-soft{background:#eef4ff;color:var(--app-primary);border:1px solid #d8e6ff}
.preview-frame{width:100%;min-height:640px;border:1px solid var(--app-border);border-radius:var(--app-radius);background:#fff}
.phone-preview{max-width:390px;margin:0 auto}
.campaign-editor-visual{font-family:Arial,sans-serif;font-size:16px;line-height:1.5;color:#17202a}
.campaign-editor-visual p{margin:0 0 8px;line-height:1.5}
.campaign-editor-visual h1{margin:24px 0 10px;line-height:1.2}
.campaign-editor-visual h2{margin:22px 0 8px;line-height:1.25}
.campaign-editor-visual h3{margin:18px 0 8px;line-height:1.3}
.campaign-editor-visual ul,.campaign-editor-visual ol{margin:0 0 12px 22px;line-height:1.5}
.campaign-editor-visual li{margin:0 0 4px}
.upload-drop{border:2px dashed #b6c3d1;border-radius:var(--app-radius);padding:1.5rem;text-align:center;background:#f8fafc}
.upload-drop.dragover{border-color:var(--app-primary);background:#eef4ff}
.block-editor-shell{height:calc(100vh - 145px);min-height:720px;border:1px solid var(--app-border);border-radius:var(--app-radius);background:#fff;overflow:hidden;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.be-topbar{height:58px;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem;border-bottom:1px solid var(--app-border);background:#fff}
.be-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.be-workspace{height:calc(100% - 58px);display:grid;grid-template-columns:minmax(0,1fr) 340px;background:#e9eef4}
.be-canvas-wrap{position:relative;overflow:auto;padding:58px 24px 40px;transition:all .18s ease}
.be-email{min-height:100%;display:flex;justify-content:center;align-items:flex-start}
.be-email-inner{width:100%;background:#fff;box-shadow:0 18px 42px rgba(15,23,42,.15);transition:max-width .18s ease}
.be-tablet .be-email-inner{max-width:600px!important}
.be-phone .be-email-inner{max-width:375px!important}
.be-phone .be-columns{display:block}
.be-phone .be-column{width:100%;margin-bottom:12px}
.be-toolbar{position:absolute;top:10px;left:50%;transform:translateX(-50%);z-index:5;display:flex;gap:.3rem;align-items:center;background:#ffffff;border:1px solid var(--app-border);border-radius:7px;padding:.35rem;box-shadow:0 8px 24px rgba(15,23,42,.12)}
.be-toolbar button,.be-toolbar select,.be-toolbar input{height:30px;border:1px solid #cbd5e1;border-radius:5px;background:#fff;font-size:.8rem;padding:0 .45rem}
.be-toolbar input[type=color]{width:34px;padding:2px}
.be-section{position:relative;outline:1px solid rgba(21,94,239,.14);margin:0}
.be-section:hover{outline-color:rgba(21,94,239,.35)}
.be-section.selected,.be-column.selected,.be-block.selected{outline:2px solid var(--app-primary);outline-offset:2px}
.be-section-label,.be-column-label{position:absolute;top:4px;left:6px;z-index:2;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;color:#64748b;background:rgba(255,255,255,.88);border:1px solid #dbe3ec;border-radius:4px;padding:1px 5px;pointer-events:none}
.be-section-controls,.be-block-controls{position:absolute;right:6px;top:6px;z-index:4;display:none;gap:3px;background:#fff;border:1px solid var(--app-border);border-radius:6px;padding:3px;box-shadow:0 8px 20px rgba(15,23,42,.12)}
.be-section:hover>.be-section-controls,.be-section.selected>.be-section-controls,.be-block:hover>.be-block-controls,.be-block.selected>.be-block-controls{display:flex}
.be-section-controls button,.be-block-controls button{height:24px;border:1px solid #cbd5e1;background:#fff;border-radius:4px;font-size:.72rem;line-height:1;padding:0 .35rem}
.be-drag-handle{display:inline-flex;align-items:center;justify-content:center;height:24px;min-width:30px;color:#64748b;cursor:grab;font-size:.72rem}
.be-columns{display:flex;gap:18px}
.be-column{position:relative;flex:1;min-width:0;border:1px dashed rgba(100,116,139,.35);border-radius:6px;padding-top:18px!important}
.be-column.drag-over,.be-dropzone.drag-over{background:#eef4ff;outline:2px dashed var(--app-primary);outline-offset:3px}
.be-dropzone{min-height:54px}
.be-block{position:relative;margin:0 0 4px;border-radius:6px;outline:1px solid transparent}
.be-block:hover{outline-color:rgba(21,94,239,.25)}
.be-rich{min-height:1.4em;border-radius:5px}
.be-rich:focus{outline:2px solid #93c5fd;outline-offset:2px;background:#f8fbff}
.be-rich p,.be-rich h1,.be-rich h2,.be-rich h3,.be-rich ul,.be-rich ol{margin-top:0}
.be-rich p:last-child,.be-rich h1:last-child,.be-rich h2:last-child,.be-rich h3:last-child,.be-rich ul:last-child,.be-rich ol:last-child{margin-bottom:0}
.be-html,.be-html table,.be-html td,.be-html th,.be-html p,.be-html div,.be-html span,.be-html li,.be-html a{font-family:inherit}
.be-button{display:inline-block;text-decoration:none;font-weight:700;line-height:1.2}
.be-image{max-width:100%;height:auto;border:0}
.be-image-placeholder{border:2px dashed #b6c3d1;border-radius:7px;background:#f8fafc;color:#64748b;text-align:center;padding:34px 18px;font-weight:650}
.be-divider{border-top:1px solid #dfe5ec;height:0;font-size:0;line-height:0}
.be-spacer{background:repeating-linear-gradient(45deg,#f8fafc,#f8fafc 8px,#eef2f7 8px,#eef2f7 16px);border-radius:5px}
.be-quote{margin:0 0 16px;border-left:4px solid #155eef}
.be-video{background:#111827;color:#fff;text-align:center;padding:42px;border-radius:6px}
.be-video a{color:#fff;text-decoration:none;font-weight:700}
.be-empty{border:1px dashed #b6c3d1;border-radius:6px;padding:18px;text-align:center;color:#64748b;background:#f8fafc}
.be-sidebar{background:#ffffff;border-left:1px solid var(--app-border);display:flex;flex-direction:column;min-width:0}
.be-tabs{display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid var(--app-border)}
.be-tabs button{border:0;background:#f8fafc;color:#475569;padding:.75rem .25rem;font-weight:750;font-size:.78rem}
.be-tabs button.active{background:#fff;color:var(--app-primary);box-shadow:inset 0 -3px 0 var(--app-primary)}
.be-panel{padding:1rem;overflow:auto;min-height:0}
.be-block-palette{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}
.be-block-palette button{border:1px solid var(--app-border);background:#f8fafc;border-radius:7px;padding:.7rem .5rem;text-align:left;font-weight:700;color:#334155}
.be-block-palette button:hover{border-color:var(--app-primary);background:#eef4ff;color:var(--app-primary)}
.be-field{display:block;margin-bottom:.85rem}
.be-field span{display:block;font-size:.8rem;font-weight:750;color:#334155;margin-bottom:.25rem}
.be-field input,.be-field textarea,.be-field select{width:100%;border:1px solid #cbd5e1;border-radius:6px;padding:.48rem .55rem;font:inherit;font-size:.9rem}
.be-field textarea{resize:vertical;min-height:90px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.be-empty-panel{border:1px dashed #cbd5e1;border-radius:7px;padding:1rem;color:#64748b;background:#f8fafc}
.be-layers{display:flex;flex-direction:column;gap:.25rem}
.be-layers button{border:1px solid transparent;background:#fff;text-align:left;border-radius:5px;padding:.35rem .45rem;color:#334155;font-size:.88rem}
.be-layers button:hover{background:#eef4ff;color:var(--app-primary)}
.be-layers .indent-1{padding-left:1.25rem}
.be-layers .indent-2{padding-left:2rem;color:#475569}
.be-assets{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.be-assets button{border:1px solid var(--app-border);border-radius:7px;background:#fff;padding:.35rem;text-align:left;overflow:hidden}
.be-assets img{width:100%;height:78px;object-fit:cover;border-radius:5px;background:#f8fafc}
.be-assets span{display:block;font-size:.75rem;color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:.3rem}
.be-html-mode{height:calc(100% - 58px);display:flex;flex-direction:column;background:#fff}
.be-html-warning{padding:.75rem 1rem;background:#fff7ed;border-bottom:1px solid #fed7aa;color:#9a3412;font-weight:650}
.be-html-mode textarea{flex:1;border:0;border-radius:0;padding:1rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88rem;line-height:1.5;resize:none}
.be-html-actions{border-top:1px solid var(--app-border);padding:.75rem 1rem;background:#fff}
@media (max-width: 768px){
  .page-head{align-items:flex-start;flex-direction:column}
  .block-editor-shell{height:auto;min-height:900px}
  .be-workspace{grid-template-columns:1fr}
  .be-sidebar{border-left:0;border-top:1px solid var(--app-border);min-height:380px}
  .be-toolbar{left:12px;right:12px;transform:none;overflow:auto;justify-content:flex-start}
  .be-canvas-wrap{padding:62px 10px 24px}
}
