/* Page-level ZBMail adaptation, based on the supplied video and existing EJS views.
   No live metrics or actions are simulated by the presentation layer. */
body{background:#090b0f;font-size:13px}
.shell{grid-template-columns:280px minmax(0,1fr)}
.shell>main{max-width:none;padding:20px 24px}
.shell>aside.sidebar{padding:12px;background:radial-gradient(240px 180px at 12% 0%,rgba(79,110,247,.09),transparent 65%),linear-gradient(180deg,#111215,#0b0d10)}
.sidebar-head{padding:16px 12px;margin-bottom:14px;border:1px solid var(--border);border-radius:22px;background:linear-gradient(120deg,#21232a,#18191d);min-height:86px}
.sidebar-head .brand-mark{box-shadow:0 10px 24px var(--accent-soft);background:linear-gradient(160deg,color-mix(in srgb,var(--accent),white 25%),var(--accent))}
nav.side-nav{gap:6px}nav .side-link{border:1px solid rgba(255,255,255,.04);border-radius:16px;min-height:55px;background:linear-gradient(120deg,rgba(255,255,255,.025),transparent);padding:9px 10px}
body nav .side-link.selected{border:1px solid color-mix(in srgb,var(--accent),transparent 55%);background:linear-gradient(125deg,var(--accent-soft),rgba(255,255,255,.035))}
nav .side-copy strong{font-size:12px;font-weight:700}nav .side-copy small{font-size:10px}nav .side-icon{width:32px;height:32px;flex-basis:32px;border:1px solid var(--border);border-radius:10px;background:rgba(255,255,255,.025)}nav .side-icon svg{width:16px;height:16px}
.sidebar-foot{border:1px solid var(--border);border-radius:18px;padding:12px;background:linear-gradient(115deg,#1b1c21,var(--accent-soft));gap:8px}
#workspace>.shell-topbar{padding:19px 22px;min-height:94px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(110deg,#17191e,#101216 65%,var(--accent-soft));margin-bottom:18px}
.shell-topbar h2{font-size:23px;font-weight:800}.shell-topbar .page-lead{font-size:13px;margin-top:6px}
.panel{background:linear-gradient(145deg,#1c1e23,#14161a);border-radius:20px;padding:22px}.metric{border-radius:20px;background:linear-gradient(145deg,#1d2026,#13151a);border-top:2px solid var(--accent);min-height:128px}.metric:nth-child(2){border-top-color:#20c693}.metric:nth-child(3){border-top-color:#38b6ed}.metric:nth-child(4){border-top-color:#e5b752}
.metric strong{font-size:27px}.metric small{font-size:11px;font-weight:700}.metric p{font-size:12px}
button{font-size:12px;min-height:37px;border-radius:11px}button.secondary{background:linear-gradient(150deg,#292b32,#22242b)}button.small{min-height:32px;padding:7px 11px}
.table-wrap{border-radius:18px;background:#1b1d22}table{background:linear-gradient(110deg,#1c1e23,#1a1c21)}th{font-size:10px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;background:rgba(255,255,255,.025);padding:14px 16px}td{font-size:12px;padding:15px 16px}.badge{font-size:10px;font-weight:700}
.zb-stats{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:14px;margin-bottom:18px}
.zb-stat{--tone:#8ca0ff;position:relative;overflow:hidden;isolation:isolate;border:1px solid color-mix(in srgb,var(--tone),transparent 78%);border-radius:24px;padding:16px;min-height:150px;background:radial-gradient(circle at top right,color-mix(in srgb,var(--tone),transparent 87%),transparent 44%),linear-gradient(180deg,#202329,#13151a)}
.zb-stat::after{content:'';position:absolute;right:-18px;bottom:-26px;width:108px;height:108px;border-radius:32px;background:#ffffff06;transform:rotate(18deg);z-index:-1}
.zb-stat.tone-green{--tone:#20cd93}.zb-stat.tone-cyan{--tone:#54cee7}.zb-stat.tone-red{--tone:#ff787f}.zb-stat.tone-gold{--tone:#efd070}
.zb-stat-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.zb-stat-top>strong{font-size:29px;line-height:1.2;font-weight:850;color:var(--tone);overflow-wrap:anywhere;letter-spacing:-.5px}
.zb-stat-icon{width:43px;height:43px;border:1px solid #ffffff0e;background:#ffffff08;border-radius:15px;display:grid;place-items:center;flex-shrink:0;color:#d7dce4}.zb-stat-icon svg{width:18px;height:18px}
.zb-stat-label{display:inline-block;padding:4px 9px;background:#ffffff05;border:1px solid #ffffff09;border-radius:16px;font-size:10px;text-transform:uppercase;letter-spacing:1px;font-weight:800;color:#b4becd}
.zb-stat p{font-size:11px;color:#c3cbd7;line-height:1.5;margin:12px 0 0}
.zb-campaign-list{border:1px solid var(--border);border-radius:24px;background:linear-gradient(135deg,#1d1f24,#15171b);overflow:hidden;margin-bottom:18px}
.zb-list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 12px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.zb-filter-tabs{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.zb-filter{font-size:11px!important;padding:7px 10px!important;min-height:32px!important}.zb-filter.active{border-color:color-mix(in srgb,var(--accent),transparent 45%);background:var(--accent-soft);color:#ffb476}.zb-filter span{margin-left:5px;background:#ffffff0b;padding:2px 5px;border-radius:7px;color:#d6dfea}
#campaign-list-actions{margin-left:auto}#new-campaign{white-space:nowrap;box-shadow:0 8px 22px var(--accent-soft)}
.zb-search{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--border);flex-wrap:wrap}.zb-search input{max-width:410px;flex:1;min-width:160px;font-size:12px;min-height:36px}.zb-search>span{font-size:11px;color:var(--muted);margin-left:auto}
.zb-campaign-list .table-wrap{border:0;border-radius:0;margin:0}.zb-campaign-list table{min-width:870px;table-layout:auto}.zb-campaign-list th:first-child{width:31%}.zb-campaign-list td:first-child{white-space:normal;min-width:220px}.zb-campaign-name{display:block;font-size:13px;color:#ffa96b;line-height:1.5;max-width:380px;overflow-wrap:anywhere}.zb-row-meta{display:block;font-size:10px;color:var(--muted);margin-top:5px}.zb-campaign-list td progress{width:100px;height:5px;margin-top:7px}.zb-row-actions,.zb-row-actions .actions{display:flex;gap:5px;flex-wrap:nowrap}.zb-row-actions button{min-width:32px;height:32px;min-height:32px;padding:6px;border:1px solid #6ca0c63b;color:#9ccbe8}.zb-row-actions button[data-action=cancel]{border-color:#cf55553b;color:#ec9292}.zb-row-actions svg{width:15px;height:15px;display:block}.zb-row-actions span{font-size:16px}
.zb-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;font-size:11px;color:var(--muted)}
.zb-template-library{padding:0;overflow:hidden}.zb-library-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 20px;border-bottom:1px solid var(--border);font-size:12px}.zb-library-heading>span{font-size:11px;color:var(--muted)}
.zb-template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:12px;padding:20px}.zb-template-card{min-width:0;display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(150deg,#22242b,#191b20);transition:border-color .15s}.zb-template-card:hover{border-color:color-mix(in srgb,var(--accent),transparent 45%)}.zb-template-card-head{display:flex;gap:8px;align-items:flex-start;justify-content:space-between}.zb-template-card h3{font-size:14px;margin:0;overflow-wrap:anywhere;line-height:1.45}.zb-template-card .badge{white-space:nowrap;font-size:9px}.zb-template-subject{font-size:12px!important;margin:0!important;color:#cbd2df;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.zb-template-card small{font-size:10px;color:var(--muted)}.zb-template-card .actions{margin-top:auto}.zb-template-grid>.empty{grid-column:1/-1}
.zb-record-toolbar{display:flex;align-items:end;flex-wrap:wrap;gap:10px;padding:15px 18px;border:1px solid var(--border);border-bottom:0;border-radius:18px 18px 0 0;background:#202229}.zb-record-toolbar+ .table-wrap{border-radius:0 0 18px 18px}.zb-record-toolbar label{font-size:10px;gap:5px}.zb-record-toolbar input{min-width:260px;font-size:12px}.zb-record-toolbar select{font-size:12px}.zb-record-count{margin-left:auto;font-size:11px;color:var(--muted);padding-bottom:12px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}
.zb-stat-icon svg,.zb-row-actions svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:1350px){.shell{grid-template-columns:244px minmax(0,1fr)}.shell>main{padding:20px}.zb-stats{gap:10px}.zb-stat{padding:14px;border-radius:20px}.zb-stat-icon{width:30px;height:30px;border-radius:10px}.zb-stat-top>strong{font-size:25px}.zb-stat-label{font-size:9px;letter-spacing:.4px}.zb-template-grid{grid-template-columns:repeat(auto-fill,minmax(195px,1fr))}}
@media(max-width:1000px){.zb-stats{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr))}.zb-stat:last-child:nth-child(odd){grid-column:1/-1}.zb-stat{min-height:125px}.zb-template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.zb-search>span{width:100%;margin-left:0}}
@media(max-width:700px){.shell{display:block}.shell>aside.sidebar{padding:10px 14px}.sidebar-head{padding:0;min-height:45px;border:0;background:none;border-radius:0;margin:0}.shell>main{padding:16px 12px}#workspace>.shell-topbar{padding:16px;border-radius:20px;min-height:85px}.shell-topbar h2{font-size:21px}.shell-topbar .page-lead{font-size:11px}.zb-stats{gap:9px}.zb-stat{border-radius:18px;padding:13px;min-height:134px}.zb-stat-top>strong{font-size:25px}.zb-stat p{font-size:10px}.zb-stat-label{font-size:9px}.zb-filter-tabs{flex-wrap:nowrap;overflow:auto;width:100%;padding-bottom:4px}.zb-filter-tabs button{white-space:nowrap}.zb-list-toolbar{padding:12px}.zb-search{padding:12px}.zb-search input{width:100%;flex-basis:100%;max-width:none}.zb-campaign-list{border-radius:18px}.zb-pagination{flex-wrap:wrap}.zb-library-heading{align-items:flex-start;flex-direction:column}.zb-template-grid{grid-template-columns:minmax(0,1fr);padding:14px}.zb-template-card{padding:16px}.zb-record-toolbar{padding:12px}.zb-record-toolbar label:first-child{width:100%}.zb-record-toolbar input{min-width:0;width:100%}.zb-record-count{padding-bottom:10px}.sidebar-foot{padding:12px}.panel{border-radius:18px}}

/* Shared compact controls: every authenticated workspace page uses the same scale. */
#workspace #content button:not(.campaign-title-link),
#workspace .shell-topbar button {
  min-height: 34px;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 12.5px;
  line-height: 1.2;
}
#workspace #content button.small,
#workspace #content :is(.composer-toolbar,.studio-controls,.studio-blocks,.template-modebar,.report-grouping) button {
  min-height: 30px;
  padding: 5px 9px;
  border-radius: 7px;
  font-size: 12px;
}
#workspace #content .zb-row-actions .campaign-action {
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  padding: 5px;
}
#workspace #content .actions { gap: 7px; }

@media(max-width:700px) {
  #workspace #content button:not(.campaign-title-link),
  #workspace .shell-topbar button {
    min-height: 36px;
    padding: 7px 12px;
  }
  #workspace #content button.small,
  #workspace #content :is(.composer-toolbar,.studio-controls,.studio-blocks,.template-modebar,.report-grouping) button {
    min-height: 34px;
  }
  #workspace #content .zb-row-actions .campaign-action {
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
  }
}

.member-scan-metrics { grid-template-columns: repeat(auto-fit,minmax(130px,1fr)) !important; margin: 16px 0; }
.member-scan-metrics > div { display: grid; gap: 3px; padding: 12px 14px; border: 1px solid #dfe8f5; border-radius: 10px; background: #f8fbff; }
.member-scan-metrics strong { font-size: 22px; color: #16355c; font-variant-numeric: tabular-nums; }
.member-scan-metrics small { color: #64748b; }
.contact-layout > .panel .table-wrap { max-height: 330px; overflow: auto; }
@media(max-width:700px) { .member-scan-metrics { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } }