/* Reset & base */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 14px; background: #f6f8fa; color: #1f2328; height: 100vh; overflow: hidden; }
button { cursor: pointer; font-family: inherit; font-size: 13px; }
input, textarea { font-family: inherit; font-size: 13px; }

/* Topbar */
.topbar { display: flex; align-items: center; justify-content: space-between; padding: 0 16px; height: 48px; background: #ffffff; border-bottom: 1px solid #d0d7de; position: sticky; top: 0; z-index: 100; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.topbar-left { display: flex; align-items: center; gap: 24px; }
.logo { font-weight: 600; font-size: 15px; color: #0969da; }

/* Main tabs */
.main-tabs { display: flex; gap: 2px; }
.tab-btn { background: none; border: none; color: #57606a; padding: 6px 14px; border-radius: 6px; font-weight: 500; transition: background .15s, color .15s; }
.tab-btn:hover { background: #f0f3f6; color: #1f2328; }
.tab-btn.active { background: #eaf1fb; color: #0969da; }

/* Buttons */
.btn { border: 1px solid #d0d7de; background: #f6f8fa; color: #24292f; padding: 5px 12px; border-radius: 6px; transition: background .15s, border-color .15s; }
.btn:hover { background: #eaeef2; border-color: #c6cdd5; }
.btn-primary { background: #1f883d; border-color: #1f883d; color: #fff; }
.btn-primary:hover { background: #1a7f37; border-color: #1a7f37; }
.btn-refresh  { border-color: #0969da; color: #0969da; }
.btn-refresh:hover  { background: #dbeafe; }
.btn-warning  { border-color: #9a6700; color: #9a6700; }
.btn-warning:hover  { background: #fff8e1; }
.btn-discover { border-color: #1a7f37; color: #1a7f37; }
.btn-discover:hover { background: #dcfce7; }
.btn-danger { background: #cf222e; border-color: #cf222e; color: #fff; }
.btn-danger:hover { background: #b91c1c; border-color: #b91c1c; }

/* Tab panels */
.tab-panel { display: none; height: calc(100vh - 48px); }
.tab-panel.active { display: flex; flex-direction: column; }

/* ── INBOX ────────────────────────────────────────────────────── */
.inbox-layout { display: grid; grid-template-columns: 280px 1fr 280px; height: 100%; overflow: hidden; }

/* Account tabs (inside sidebar) */
.sidebar { display: flex; flex-direction: column; border-right: 1px solid #d0d7de; overflow: hidden; background: #ffffff; }
.account-tabs { display: flex; padding: 8px; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid #eaeef2; }
.account-tab { font-size: 11px; padding: 4px 8px; border-radius: 5px; border: 1px solid #d0d7de; background: none; color: #57606a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; }
.account-tab.active { background: #eaf1fb; color: #0969da; border-color: #0969da; }

/* Contact search */
.contact-search { padding: 8px; border-bottom: 1px solid #eaeef2; }
.contact-search input { width: 100%; background: #f6f8fa; border: 1px solid #d0d7de; border-radius: 6px; padding: 6px 10px; color: #1f2328; outline: none; }
.contact-search input:focus { border-color: #0969da; background: #fff; box-shadow: 0 0 0 3px rgba(9,105,218,.1); }

/* Contact list */
.contact-list { flex: 1; overflow-y: auto; }
.contact-item { padding: 10px 12px; border-bottom: 1px solid #eaeef2; cursor: pointer; transition: background .1s; }
.contact-item:hover { background: #f6f8fa; }
.contact-item.active { background: #eaf1fb; border-left: 3px solid #0969da; }
.contact-name { font-weight: 500; color: #1f2328; display: flex; align-items: center; gap: 6px; }
.contact-email { font-size: 11px; color: #6e7781; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.contact-meta { display: flex; gap: 8px; margin-top: 4px; font-size: 11px; color: #6e7781; }
.badge { display: inline-block; padding: 1px 6px; border-radius: 10px; font-size: 10px; font-weight: 600; }
.badge-unread { background: #0969da; color: #fff; }
.badge-status { background: #f0f3f6; color: #57606a; border: 1px solid #d0d7de; }
.badge-status.negotiating { color: #bc4c00; border-color: #fb8f44; background: #fff7ed; }
.badge-status.contacted   { color: #0969da; border-color: #0969da; background: #dbeafe; }
.badge-status.agreed      { color: #1a7f37; border-color: #1a7f37; background: #dcfce7; }
.badge-status.ghosted     { color: #6e7781; background: #f0f3f6; }
.badge-status.prospecting { color: #57606a; }
.badge-status.completed   { color: #1a7f37; background: #dcfce7; }

/* Thread view */
.thread-view { display: flex; flex-direction: column; overflow: hidden; border-right: 1px solid #d0d7de; background: #fff; }
.thread-header { padding: 12px 16px; border-bottom: 1px solid #d0d7de; display: flex; align-items: center; justify-content: space-between; background: #f6f8fa; }
.thread-header h2 { font-size: 14px; color: #1f2328; }
.thread-messages { flex: 1; overflow-y: auto; padding: 12px 16px; display: flex; flex-direction: column; gap: 12px; background: #fff; }

.message { background: #ffffff; border: 1px solid #d0d7de; border-radius: 8px; overflow: hidden; min-height: 80px; flex-shrink: 0; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.message.inbound { border-left: 3px solid #0969da; }
.message.outbound { border-left: 3px solid #1f883d; }
.message-header { padding: 10px 14px; border-bottom: 1px solid #eaeef2; display: flex; align-items: center; justify-content: space-between; background: #f6f8fa; }
.message-from { font-weight: 500; font-size: 13px; }
.message-from.inbound { color: #0969da; }
.message-from.outbound { color: #1a7f37; }
.message-date { font-size: 11px; color: #6e7781; }
.message-subject { padding: 8px 14px 4px; font-weight: 500; font-size: 13px; color: #1f2328; }
.message-body { padding: 8px 14px 4px; color: #57606a; font-size: 12px; line-height: 1.7; white-space: pre-wrap; word-break: break-word; max-height: 180px; overflow: hidden; position: relative; }
.message-body.expanded { max-height: none; overflow: visible; }
.message-body:not(.expanded)::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 48px; background: linear-gradient(transparent, #ffffff); pointer-events: none; }
.toggle-body { padding: 6px 14px 10px; font-size: 12px; color: #0969da; cursor: pointer; user-select: none; }
.toggle-body:hover { text-decoration: underline; }
.filtered-msg { opacity: 0.4; }

/* Context panel */
.context-panel { overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 14px; background: #f6f8fa; }
.context-card { background: #ffffff; border: 1px solid #d0d7de; border-radius: 8px; padding: 12px 14px; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.context-card h4 { font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: #6e7781; margin-bottom: 8px; font-weight: 600; }
.context-row { display: flex; justify-content: space-between; padding: 4px 0; border-bottom: 1px solid #f0f3f6; font-size: 12px; }
.context-row:last-child { border-bottom: none; }
.context-row .label { color: #6e7781; }
.context-row .value { color: #1f2328; text-align: right; max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
.notes-text { font-size: 12px; color: #57606a; line-height: 1.5; }
.status-pill { display: inline-block; padding: 2px 8px; border-radius: 12px; font-size: 11px; font-weight: 600; background: #f0f3f6; color: #57606a; }
.status-pill.negotiating { background: #fff7ed; color: #bc4c00; }
.status-pill.contacted   { background: #dbeafe; color: #0969da; }
.status-pill.agreed      { background: #dcfce7; color: #1a7f37; }
.status-pill.ghosted     { background: #f0f3f6; color: #6e7781; }
.status-pill.completed   { background: #dcfce7; color: #1a7f37; }
.youtube-link { color: #0969da; text-decoration: none; font-size: 12px; }
.youtube-link:hover { text-decoration: underline; }

/* ── TEMPLATES ────────────────────────────────────────────────── */
.templates-layout { display: grid; grid-template-columns: 280px 1fr; height: 100%; overflow: hidden; }
.templates-sidebar { border-right: 1px solid #d0d7de; display: flex; flex-direction: column; overflow: hidden; background: #ffffff; }
.templates-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-bottom: 1px solid #d0d7de; background: #f6f8fa; }
.templates-header h3 { font-size: 14px; color: #1f2328; }
.template-list { flex: 1; overflow-y: auto; }
.template-item { padding: 10px 14px; border-bottom: 1px solid #eaeef2; cursor: pointer; transition: background .1s; }
.template-item:hover { background: #f6f8fa; }
.template-item.active { background: #eaf1fb; border-left: 3px solid #0969da; }
.template-item-name { font-weight: 500; color: #1f2328; }
.template-item-intent { display: inline-block; margin-top: 4px; font-size: 11px; color: #57606a; background: #f0f3f6; padding: 1px 6px; border-radius: 4px; }

/* Template editor */
.template-editor { padding: 20px 24px; overflow-y: auto; display: flex; flex-direction: column; gap: 16px; background: #fff; }
.form-row { display: flex; flex-direction: column; gap: 6px; }
.form-row label { font-size: 12px; color: #57606a; font-weight: 500; }
.form-row input, .form-row select, .form-row textarea {
  background: #ffffff; border: 1px solid #d0d7de; border-radius: 6px;
  padding: 8px 10px; color: #1f2328; outline: none; width: 100%;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus { border-color: #0969da; box-shadow: 0 0 0 3px rgba(9,105,218,.1); }
.form-row textarea { resize: vertical; line-height: 1.6; }
.form-actions { display: flex; gap: 10px; align-items: center; }
.placeholder-hint { font-size: 11px; color: #6e7781; margin-top: 4px; }
.placeholder-chip { display: inline-block; background: #eaf1fb; border: 1px solid #b6d4f7; color: #0969da; border-radius: 4px; padding: 2px 6px; font-size: 11px; margin: 2px; cursor: pointer; }
.placeholder-chip:hover { background: #dbeafe; }

/* Empty state */
.empty-state { display: flex; align-items: center; justify-content: center; height: 100%; color: #6e7781; font-size: 14px; }

/* Loading */
.loading { padding: 20px; text-align: center; color: #6e7781; }

/* Overlay */
.overlay { position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 200; display: flex; align-items: center; justify-content: center; }
.overlay-box { background: #ffffff; border: 1px solid #d0d7de; border-radius: 10px; width: 560px; max-height: 70vh; display: flex; flex-direction: column; box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.overlay-header { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid #d0d7de; background: #f6f8fa; border-radius: 10px 10px 0 0; }
.overlay-header h3 { font-size: 14px; color: #1f2328; }
#sync-log { flex: 1; overflow-y: auto; padding: 12px 16px; font-size: 12px; line-height: 1.6; color: #57606a; white-space: pre-wrap; background: #f6f8fa; }

/* ── LOGS ─────────────────────────────────────────────────── */
.logs-layout { display: grid; grid-template-columns: 160px 1fr; height: 100%; overflow: hidden; }
.logs-sidebar { border-right: 1px solid #d0d7de; display: flex; flex-direction: column; overflow: hidden; background: #ffffff; }
.logs-sidebar-header { padding: 10px 14px; border-bottom: 1px solid #d0d7de; font-size: 11px; color: #6e7781; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; background: #f6f8fa; }
#log-date-list { flex: 1; overflow-y: auto; }
.log-date-item { padding: 8px 14px; font-size: 13px; color: #57606a; cursor: pointer; border-bottom: 1px solid #eaeef2; }
.log-date-item:hover { background: #f6f8fa; color: #1f2328; }
.log-date-item.active { background: #eaf1fb; color: #0969da; border-left: 3px solid #0969da; }

.logs-main { display: flex; flex-direction: column; overflow: hidden; }
.logs-toolbar { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-bottom: 1px solid #d0d7de; background: #f6f8fa; flex-shrink: 0; }
.log-filters { display: flex; gap: 4px; }
.log-filter-btn { background: #fff; border: 1px solid #d0d7de; color: #57606a; padding: 3px 10px; border-radius: 5px; font-size: 12px; }
.log-filter-btn:hover { background: #f0f3f6; color: #1f2328; }
.log-filter-btn.active { background: #eaf1fb; color: #0969da; border-color: #0969da; }
#log-search { background: #fff; border: 1px solid #d0d7de; border-radius: 6px; padding: 4px 10px; color: #1f2328; font-size: 12px; outline: none; width: 220px; }
#log-search:focus { border-color: #0969da; box-shadow: 0 0 0 3px rgba(9,105,218,.1); }

#log-entries { flex: 1; overflow-y: auto; padding: 8px 0; font-family: 'SF Mono', 'Fira Code', monospace; font-size: 12px; background: #fff; }
.log-entry { display: flex; align-items: baseline; gap: 10px; padding: 4px 14px; border-bottom: 1px solid #f0f3f6; line-height: 1.5; }
.log-entry:hover { background: #f6f8fa; }
.log-ts        { color: #aab0b7; white-space: nowrap; flex-shrink: 0; }
.log-level     { width: 36px; flex-shrink: 0; font-weight: 700; }
.log-component { width: 100px; flex-shrink: 0; color: #6e7781; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.log-message   { color: #1f2328; flex: 1; }
.log-data      { color: #aab0b7; font-size: 11px; max-width: 400px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-shrink: 0; }

.log-level-info  .log-level { color: #57606a; }
.log-level-warn  .log-level { color: #9a6700; }
.log-level-error .log-level { color: #cf222e; }
.log-level-ai    .log-level { color: #8250df; }
.log-level-ai    .log-message { color: #6f42c1; }
.log-level-error { background: rgba(207,34,46,.03); }
.log-level-warn  { background: rgba(154,103,0,.03); }

/* Scrollbars */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d0d7de; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #b6bdc6; }

/* ── OUTBOX ───────────────────────────────────────────────── */
.outbox-layout { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
.outbox-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid #d0d7de; background: #f6f8fa; flex-shrink: 0; font-size: 13px; color: #57606a; }
.outbox-header strong { color: #1f2328; }
.pending-list { flex: 1; overflow-y: auto; padding: 12px 16px; display: flex; flex-direction: column; gap: 12px; background: #f6f8fa; }

.pending-item { background: #ffffff; border: 1px solid #d0d7de; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.pending-item.requires-payment { border-color: #fb8f44; }
.pending-item-header { display: flex; justify-content: space-between; align-items: flex-start; padding: 10px 14px 6px; border-bottom: 1px solid #eaeef2; background: #f6f8fa; }
.pending-item-to { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pending-item-to strong { color: #1f2328; }
.pending-to-addr { font-size: 11px; color: #6e7781; }
.pending-created { font-size: 11px; color: #6e7781; flex-shrink: 0; }
.pending-pay-badge { display: inline-block; background: #fff7ed; color: #bc4c00; border: 1px solid #fb8f44; border-radius: 10px; font-size: 10px; font-weight: 600; padding: 1px 7px; }
.pending-subject { padding: 8px 14px 4px; font-weight: 500; color: #1f2328; font-size: 13px; }
.pending-intent { padding: 2px 14px; font-size: 11px; color: #57606a; }
.pending-keypoints { padding: 4px 14px 4px 28px; font-size: 12px; color: #57606a; }
.pending-keypoints li { margin: 2px 0; }
.pending-body-preview { padding: 6px 14px 10px; font-size: 12px; color: #6e7781; white-space: pre-wrap; word-break: break-word; max-height: 100px; overflow: hidden; line-height: 1.5; border-top: 1px solid #eaeef2; margin-top: 4px; }
.pending-actions { display: flex; align-items: center; gap: 8px; padding: 8px 14px 10px; border-top: 1px solid #eaeef2; background: #f6f8fa; }
.pending-note { flex: 1; background: #fff; border: 1px solid #d0d7de; border-radius: 6px; padding: 5px 10px; color: #1f2328; font-size: 12px; outline: none; }
.pending-note:focus { border-color: #0969da; box-shadow: 0 0 0 3px rgba(9,105,218,.1); }
.pending-result { padding: 4px 14px 8px; font-size: 12px; }

/* Outbox badge in tab */
.outbox-badge { display: inline-block; background: #0969da; color: #fff; font-size: 10px; font-weight: 700; border-radius: 10px; padding: 1px 6px; margin-left: 4px; vertical-align: middle; }

/* Compose modal */
.compose-box { width: 680px; max-height: 90vh; display: flex; flex-direction: column; }
/* override compose inputs (darker prompt says background:#1c2128) */
#compose-to { background: #f6f8fa !important; color: #1f2328 !important; border: 1px solid #d0d7de !important; border-radius: 6px; padding: 8px 10px; outline: none; width: 100%; }
#compose-to:focus { border-color: #0969da !important; }

/* ── SOP ──────────────────────────────────────────────────── */
.sop-layout { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
.sop-toolbar { display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; border-bottom: 1px solid #d0d7de; background: #f6f8fa; flex-shrink: 0; }
.sop-filename { font-size: 12px; color: #6e7781; font-family: 'SF Mono', monospace; }
.sop-content { flex: 1; overflow-y: auto; padding: 32px 48px; background: #fff; }
.sop-rendered { max-width: 800px; margin: 0 auto; line-height: 1.75; color: #1f2328; }
.sop-rendered h1 { font-size: 22px; color: #1f2328; margin: 28px 0 12px; padding-bottom: 8px; border-bottom: 1px solid #d0d7de; }
.sop-rendered h2 { font-size: 17px; color: #1f2328; margin: 24px 0 10px; padding-bottom: 6px; border-bottom: 1px solid #eaeef2; }
.sop-rendered h3 { font-size: 14px; color: #1f2328; margin: 18px 0 8px; }
.sop-rendered h4, .sop-rendered h5, .sop-rendered h6 { font-size: 13px; color: #57606a; margin: 14px 0 6px; }
.sop-rendered p { margin: 6px 0; color: #1f2328; }
.sop-rendered p:empty { margin: 4px 0; }
.sop-rendered ul, .sop-rendered ol { padding-left: 22px; margin: 6px 0; }
.sop-rendered li { margin: 3px 0; }
.sop-rendered hr { border: none; border-top: 1px solid #d0d7de; margin: 20px 0; }
.sop-rendered blockquote { border-left: 3px solid #0969da; padding: 6px 14px; margin: 10px 0; color: #57606a; background: #f6f8fa; border-radius: 0 6px 6px 0; }
.sop-rendered strong { color: #1f2328; }
.sop-rendered a { color: #0969da; text-decoration: none; }
.sop-rendered a:hover { text-decoration: underline; }
.sop-code { background: #f6f8fa; border: 1px solid #d0d7de; border-radius: 6px; padding: 14px 16px; font-family: 'SF Mono', 'Fira Code', monospace; font-size: 12px; color: #57606a; overflow-x: auto; margin: 10px 0; white-space: pre; }
.sop-inline-code { background: #fff0e8; border: 1px solid #fac2a0; border-radius: 3px; padding: 1px 5px; font-family: 'SF Mono', monospace; font-size: 12px; color: #bc4c00; }
.sop-table { width: 100%; border-collapse: collapse; margin: 12px 0; font-size: 13px; }
.sop-table th { background: #f6f8fa; color: #1f2328; font-weight: 600; text-align: left; padding: 7px 12px; border: 1px solid #d0d7de; }
.sop-table td { padding: 6px 12px; border: 1px solid #eaeef2; color: #1f2328; }
.sop-table tr:nth-child(even) td { background: #f6f8fa; }

/* ── FILL EMAIL ───────────────────────────────────────────────── */
.fill-email-layout { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
.fill-email-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 20px; border-bottom: 1px solid #d0d7de; background: #f6f8fa; flex-shrink: 0; gap: 16px; }
.fill-email-progress-area { display: flex; align-items: center; gap: 12px; flex: 1; }
.fill-email-progress-area > span { font-size: 13px; color: #57606a; white-space: nowrap; }
.fill-email-progress-bar { flex: 1; max-width: 320px; height: 6px; background: #eaeef2; border-radius: 3px; overflow: hidden; }
#fill-email-progress-fill { height: 100%; background: #1f883d; border-radius: 3px; transition: width .3s; }

.fill-email-card-area { flex: 1; overflow-y: auto; display: flex; align-items: flex-start; justify-content: center; padding: 32px 20px; background: #f6f8fa; }

.fill-email-card { width: 100%; max-width: 560px; background: #ffffff; border: 1px solid #d0d7de; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.07); }
.fill-email-card-body { padding: 28px 32px; display: flex; flex-direction: column; gap: 18px; }
.fill-email-channel-name { font-size: 20px; font-weight: 600; color: #1f2328; line-height: 1.3; }
.fill-email-meta { display: flex; flex-wrap: wrap; gap: 8px; }
.fill-email-meta-chip { background: #f0f3f6; border: 1px solid #d0d7de; border-radius: 20px; padding: 3px 10px; font-size: 12px; color: #57606a; }
.fill-email-yt-btn { display: inline-flex; align-items: center; gap: 6px; background: #fff5f5; border: 1px solid #fca5a5; color: #cf222e; padding: 8px 16px; border-radius: 8px; font-size: 13px; font-weight: 500; text-decoration: none; transition: background .15s; }
.fill-email-yt-btn:hover { background: #fee2e2; }
.fill-email-no-url { font-size: 12px; color: #6e7781; }

.fill-email-input-area { display: flex; flex-direction: column; gap: 6px; }
.fill-email-input-area label { font-size: 12px; color: #57606a; font-weight: 500; }
#fill-email-input { background: #ffffff; border: 1px solid #d0d7de; border-radius: 8px; padding: 10px 14px; color: #1f2328; font-size: 15px; outline: none; width: 100%; }
#fill-email-input:focus { border-color: #0969da; box-shadow: 0 0 0 3px rgba(9,105,218,.12); }
#fill-email-input.error { border-color: #cf222e; }

.fill-email-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.fill-email-msg { min-height: 18px; font-size: 12px; text-align: center; }

.fill-email-card-footer { display: flex; align-items: center; justify-content: center; padding: 10px 32px; border-top: 1px solid #eaeef2; font-size: 12px; color: #aab0b7; background: #f6f8fa; }

.fill-email-done { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 60px 32px; text-align: center; color: #57606a; }
.fill-email-done h3 { font-size: 18px; color: #1f2328; }
.fill-email-done p { font-size: 14px; }

/* Responsive note */
@media (max-width: 900px) {
  .inbox-layout { grid-template-columns: 240px 1fr; }
  .context-panel { display: none !important; }
}