/* VA Operations — OFM-style chapter */
.ops-root {
  /* Platform tones (cross-cutting, also used in tags + tracker) */
  --ops-pink: #e91e8c;
  --ops-pink-soft: rgba(233, 30, 140, 0.15);
  --ops-teal: #14b8a6;
  --ops-teal-soft: rgba(20, 184, 166, 0.12);
  --ops-fb: #3b82f6;
  --ops-fb-soft: rgba(59, 130, 246, 0.15);

  /* Status tones */
  --ops-red: #ef4444;
  --ops-green: #22c55e;
  --ops-yellow: #eab308;

  /* KPI categories — same tokens used on cards, badges, status pills */
  --ops-cat-vas: #60a5fa;            /* blue   — VAs active */
  --ops-cat-vas-soft: rgba(96,165,250,0.14);
  --ops-cat-accounts: #a78bfa;       /* violet — accounts total */
  --ops-cat-accounts-soft: rgba(167,139,250,0.14);
  --ops-cat-active: #22c55e;         /* green  — active accounts */
  --ops-cat-active-soft: rgba(34,197,94,0.14);
  --ops-cat-banned: #ef4444;         /* red    — banned */
  --ops-cat-banned-soft: rgba(239,68,68,0.14);
  --ops-cat-daily: #f59e0b;          /* amber  — daily reports */
  --ops-cat-daily-soft: rgba(245,158,11,0.14);
  --ops-cat-weekly: #ec4899;         /* magenta— weekly reports */
  --ops-cat-weekly-soft: rgba(236,72,153,0.14);
  --ops-cat-time: #06b6d4;           /* cyan   — time tracking */
  --ops-cat-time-soft: rgba(6,182,212,0.14);
  --ops-cat-health: #14b8a6;         /* teal   — health average */
  --ops-cat-health-soft: rgba(20,184,166,0.14);

  --ops-card: #1a1a1a;
  --ops-border: #2e2e2e;
  --ops-card-hover: #1f1f1f;
  --ops-input-bg: #0d0d0d;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}
[data-theme="light"] .ops-root {
  --ops-card: var(--surface);
  --ops-border: var(--border);
  --ops-card-hover: var(--hover-bg);
  --ops-input-bg: var(--surface);
  --ops-cat-vas-soft: rgba(96,165,250,0.18);
  --ops-cat-accounts-soft: rgba(167,139,250,0.18);
  --ops-cat-active-soft: rgba(34,197,94,0.18);
  --ops-cat-banned-soft: rgba(239,68,68,0.16);
  --ops-cat-daily-soft: rgba(245,158,11,0.20);
  --ops-cat-weekly-soft: rgba(236,72,153,0.18);
  --ops-cat-time-soft: rgba(6,182,212,0.18);
  --ops-cat-health-soft: rgba(20,184,166,0.18);
}
.side-section {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin: 1rem 0 0.35rem 0.75rem;
  text-transform: uppercase;
}
/* Platform headers in sidebar — see app.css .sidebar .side-section--* */
.sidebar .side-section {
  margin-left: 0;
  margin-right: 0;
}
.side-link--boss.active {
  border-color: var(--ops-pink);
  background: var(--ops-pink-soft);
}
.va-ops-nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 0 0.5rem 0.5rem;
  max-height: 40vh;
  overflow-y: auto;
}
.va-ops-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  text-align: left;
  padding: 0.45rem 0.65rem;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  font: inherit;
  cursor: pointer;
}
.va-ops-btn:hover { background: rgba(255,255,255,0.04); }
.va-ops-btn.active {
  border-color: var(--ops-pink);
  background: var(--ops-pink-soft);
}
.ops-header-kicker {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--ops-pink);
  text-transform: uppercase;
  margin: 0 0 0.15rem;
}
.ops-header h2.ops-va-title {
  margin: 0 0 0.75rem;
  font-size: 2rem;
  font-weight: 700;
}
.ops-platform-tags { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.ops-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 600;
  border: 1px solid;
}
.ops-tag--ig { color: var(--ops-pink); border-color: var(--ops-pink); background: var(--ops-pink-soft); }
.ops-tag--tt { color: var(--ops-teal); border-color: var(--ops-teal); background: var(--ops-teal-soft); }
.ops-tag--th { color: #94a3b8; border-color: #94a3b8; background: rgba(148, 163, 184, 0.12); }
.ops-panel-h--teal { color: var(--ops-teal); }
.ops-plat-checks { display: flex; gap: 1rem; flex-wrap: wrap; }
.ops-plat-checks label { display: inline-flex; align-items: center; gap: 0.35rem; cursor: pointer; font-size: 0.9rem; }
.ops-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}
.ops-tab {
  padding: 0.5rem 1rem;
  border-radius: 8px;
  border: 1px solid var(--ops-border);
  background: var(--ops-card);
  color: var(--text);
  font: inherit;
  cursor: pointer;
}
.ops-tab.active {
  border-color: var(--ops-pink);
  box-shadow: 0 0 0 1px var(--ops-pink);
}
.ops-stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}
.ops-stat {
  --tone: var(--ops-cat-accounts);
  --tone-soft: var(--ops-cat-accounts-soft);
  background: linear-gradient(180deg, var(--tone-soft) 0%, var(--ops-card) 70%);
  border: 1px solid var(--ops-border);
  border-top: 2px solid var(--tone);
  border-radius: 12px;
  padding: 1rem 0.9rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  position: relative;
  overflow: hidden;
}
.ops-stat .ops-stat-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  background: var(--tone-soft);
  color: var(--tone);
  flex: 0 0 auto;
}
.ops-stat .ops-stat-body { display: flex; flex-direction: column; min-width: 0; }
.ops-stat .num { font-size: 1.65rem; font-weight: 700; color: var(--tone); line-height: 1.1; }
.ops-stat .lbl {
  font-size: 0.65rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-top: 0.15rem;
}
.ops-stat--vas       { --tone: var(--ops-cat-vas);       --tone-soft: var(--ops-cat-vas-soft); }
.ops-stat--accounts  { --tone: var(--ops-cat-accounts);  --tone-soft: var(--ops-cat-accounts-soft); }
.ops-stat--active    { --tone: var(--ops-cat-active);    --tone-soft: var(--ops-cat-active-soft); }
.ops-stat--banned    { --tone: var(--ops-cat-banned);    --tone-soft: var(--ops-cat-banned-soft); }
.ops-stat--daily     { --tone: var(--ops-cat-daily);     --tone-soft: var(--ops-cat-daily-soft); }
.ops-stat--weekly    { --tone: var(--ops-cat-weekly);    --tone-soft: var(--ops-cat-weekly-soft); }
.ops-panel {
  background: var(--ops-card);
  border: 1px solid var(--ops-border);
  border-radius: 12px;
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
}
.ops-panel-h {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--muted);
  margin: 0 0 1rem;
  text-transform: uppercase;
}
.ops-panel-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.ops-panel-head-row .ops-panel-h {
  margin: 0;
}
.ops-va-team-toolbar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ops-va-team-model-filter {
  min-width: 10rem;
}
.ops-va-card {
  display: grid;
  grid-template-columns:
    minmax(180px, 1.4fr)
    minmax(160px, 1fr)
    minmax(110px, 0.7fr)
    minmax(120px, 0.8fr)
    minmax(120px, 0.8fr);
  gap: 1rem;
  align-items: center;
  padding: 0.85rem 1rem;
  border: 1px solid var(--ops-border);
  border-radius: 12px;
  background: var(--ops-card);
  margin-bottom: 0.5rem;
}
.ops-va-card .va-cell-label { font-size: 0.6rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0.2rem; }
.ops-va-card .va-cell-value { font-weight: 600; }
.ops-va-card .va-cell-platforms { display: flex; gap: 0.35rem; flex-wrap: wrap; margin-top: 0.35rem; }
.ops-va-status {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.6rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  border: 1px solid;
}
.ops-va-status::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
}
.ops-va-status--ok      { color: var(--ops-cat-active); border-color: var(--ops-cat-active); background: var(--ops-cat-active-soft); }
.ops-va-status--missing-daily { color: var(--ops-cat-daily); border-color: var(--ops-cat-daily); background: var(--ops-cat-daily-soft); }
.ops-va-status--partial-daily { color: var(--warn-text, #fbbf24); border-color: var(--warn-text, #fbbf24); background: rgba(251, 191, 36, 0.12); }
.btn-warn {
  color: var(--warn-text, #fbbf24);
  border-color: rgba(251, 191, 36, 0.45);
  background: rgba(251, 191, 36, 0.08);
}
.btn-warn:hover { background: rgba(251, 191, 36, 0.16); border-color: var(--warn-text, #fbbf24); }
.ops-va-status--missing-weekly { color: var(--ops-cat-weekly); border-color: var(--ops-cat-weekly); background: var(--ops-cat-weekly-soft); }
.ops-va-status--idle    { color: var(--muted); border-color: var(--ops-border); background: transparent; }
.ops-time-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.3rem 0.55rem;
  border-radius: 8px;
  background: var(--ops-cat-time-soft);
  color: var(--ops-cat-time);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 0.95rem;
}
.ops-time-chip--zero {
  background: transparent;
  color: var(--muted);
  font-weight: 600;
}
.ops-health-wrap { display: flex; flex-direction: column; gap: 0.35rem; }
.ops-health-pct {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--ops-cat-health);
  font-variant-numeric: tabular-nums;
}
.ops-health-bar {
  height: 6px;
  background: #333;
  border-radius: 3px;
  overflow: hidden;
  margin-top: 0.35rem;
}
.ops-health-fill { height: 100%; background: var(--ops-green); transition: width 0.2s ease; }
.ops-health-fill--mid { background: var(--ops-yellow); }
.ops-health-fill--low { background: var(--ops-red); }
.ops-table-wrap { overflow-x: auto; }
.ops-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}
.ops-table th,
.ops-table td {
  padding: 0.5rem 0.4rem;
  border-bottom: 1px solid var(--ops-border);
  text-align: left;
}
.ops-table th { color: var(--muted); font-weight: 600; font-size: 0.72rem; text-transform: uppercase; }
.ops-table input,
.ops-table select {
  width: 100%;
  min-width: 3.5rem;
  padding: 0.35rem 0.4rem;
  border-radius: 6px;
  border: 1px solid var(--ops-border);
  background: var(--ops-input-bg);
  color: var(--text);
  font: inherit;
}
.ops-table input:disabled,
.ops-table select:disabled { opacity: 0.6; }
.ops-plat-ig { color: var(--ops-pink); }
.ops-plat-tt { color: var(--ops-teal); }
.ops-plat-fb { color: var(--ops-fb); }

/* Model checkbox grid for Add/Edit employee modal.
   We bump specificity with #empModelsBox so .field label (display:block,
   margin-bottom) from app.css doesn't kill the inline-flex layout / gap. */
#empModelsBox {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-top: 0.4rem;
}

#empModelsBox .ops-model-block,
#empModelsBox .ops-warmup-block {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.ops-model-slot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.75rem;
  padding: 0.35rem 0.45rem;
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.015);
}

.ops-model-plats {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.55rem;
  margin-left: 0.15rem;
}

.ops-model-plats.hidden {
  display: none;
}

.ops-plat-cb {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0.2rem 0.45rem;
  border-radius: 999px;
  border: 1px solid var(--ops-border);
  background: rgba(255, 255, 255, 0.03);
  font-size: 0.74rem;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
}

.ops-plat-cb:has(input:checked) {
  border-color: rgba(56, 189, 248, 0.45);
  background: rgba(56, 189, 248, 0.1);
  color: #7dd3fc;
}

.ops-plat-cb input[type="checkbox"] {
  margin: 0;
  accent-color: #38bdf8;
}
#empModelsBox label.ops-model-cb {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--text);
  user-select: none;
  margin: 0;
  padding: 0.35rem 0.65rem;
  border: 1px solid var(--ops-border);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.02);
  transition: border-color 0.12s ease, background 0.12s ease;
}
#empModelsBox label.ops-model-cb:hover {
  border-color: var(--ops-cat-vas);
  background: rgba(124, 58, 237, 0.08);
}
#empModelsBox label.ops-model-cb:has(input[type="checkbox"]:checked) {
  border-color: var(--ops-cat-vas);
  background: var(--ops-cat-vas-soft);
}
#empModelsBox label.ops-model-cb input[type="checkbox"] {
  width: auto !important;
  min-width: 0;
  flex: 0 0 auto;
  margin: 0;
  accent-color: var(--ops-cat-vas);
  cursor: pointer;
}

.ops-warmup-block {
  width: 100%;
  margin-bottom: 0.75rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--ops-border);
}
.ops-warmup-block label.ops-model-cb--warmup {
  border-color: rgba(251, 191, 36, 0.35);
  background: rgba(251, 191, 36, 0.06);
}
.ops-warmup-block label.ops-model-cb--warmup:hover,
.ops-warmup-block label.ops-model-cb--warmup:has(input[type="checkbox"]:checked) {
  border-color: rgba(251, 191, 36, 0.65);
  background: rgba(251, 191, 36, 0.12);
}
.ops-warmup-block label.ops-model-cb--warmup input[type="checkbox"] {
  accent-color: #fbbf24;
}
.ops-warmup-hint {
  margin: 0.45rem 0 0;
  font-size: 0.78rem;
  line-height: 1.35;
}
.ops-model-block {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1.2rem;
}
#empModelsBox label.ops-model-cb span { white-space: nowrap; }
.ops-tag--fb { color: var(--ops-fb); border-color: var(--ops-fb); background: var(--ops-fb-soft); }
.ops-tag--manual { color: var(--ops-teal); border-color: var(--ops-teal); background: var(--ops-teal-soft); }
.ops-tag--config { color: var(--muted); border-color: var(--border); background: transparent; }
.ops-va-card-head {
  display: grid;
  grid-template-columns:
    minmax(180px, 1.4fr)
    minmax(160px, 1fr)
    minmax(110px, 0.7fr)
    minmax(120px, 0.8fr)
    minmax(120px, 0.8fr);
  gap: 1rem;
  padding: 0 1rem 0.4rem;
  font-size: 0.6rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.ops-va-card-head--editor,
.ops-va-card--editor {
  grid-template-columns:
    minmax(180px, 1.4fr)
    minmax(160px, 1fr)
    minmax(140px, 1fr);
}
.ops-pill {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
}
.ops-pill--aktiv { background: rgba(34,197,94,0.15); color: var(--ops-green); }
.ops-pill--warmup { background: rgba(59,130,246,0.15); color: #93c5fd; }
.ops-pill--needs_verification { background: rgba(234,179,8,0.15); color: var(--ops-yellow); }
.ops-pill--warnung { background: rgba(234,179,8,0.15); color: var(--ops-yellow); }
.ops-pill--gesperrt { background: rgba(239,68,68,0.15); color: var(--ops-red); }
.ops-pill--ausgeloggt { background: rgba(148,163,184,0.18); color: #94a3b8; }
.ops-pill--gelöscht,
.ops-pill--deleted { background: rgba(100,116,139,0.22); color: #64748b; }
.ops-pill--tracker { background: rgba(148,163,184,0.14); color: var(--text-muted); }
.ops-tracker-inline-select {
  min-width: 5.5rem;
  max-width: 100%;
  padding: 0.15rem 0.35rem;
  font-size: 0.72rem;
  height: auto;
  font-weight: 600;
  cursor: pointer;
}
.ops-table td .ops-tracker-inline-select {
  vertical-align: middle;
}
.ops-pill-btn {
  border: none;
  cursor: pointer;
  font: inherit;
  line-height: 1.2;
  transition: filter 0.12s ease;
}
.ops-pill-btn:hover {
  filter: brightness(1.15);
}
.ops-pill-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.ops-btn-submit {
  background: var(--ops-red);
  border: none;
  color: #fff;
  font-weight: 700;
  padding: 0.65rem 1.5rem;
  border-radius: 8px;
  cursor: pointer;
  float: right;
  margin-top: 0.5rem;
}
.ops-btn-submit:disabled { opacity: 0.5; cursor: not-allowed; }
.ops-loading {
  opacity: 0.5;
  transition: opacity 0.18s ease;
  pointer-events: none;
}
body.ops-hide-pageheader .app-topbar header.top { display: none; }
@keyframes opsFadeSwap {
  from { opacity: 0.55; }
  to { opacity: 1; }
}
.ops-fade-swap {
  animation: opsFadeSwap 0.22s ease-out;
}

.ops-va-link {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: var(--text);
  font-weight: 600;
  cursor: pointer;
  text-align: left;
  text-decoration: none;
  transition: color 0.12s ease;
}
.ops-va-link:hover { color: var(--ops-cat-vas); text-decoration: underline; }

.ops-team-add-bar {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 0.85rem 1.25rem;
}
.ops-team-add-bar .ops-btn-submit {
  float: none;
  margin: 0;
}
.ops-tech-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.ops-select {
  background: var(--ops-input-bg);
  color: var(--text);
  border: 1px solid var(--ops-border);
  border-radius: 8px;
  padding: 0.45rem 0.7rem;
  font-size: 0.85rem;
  min-width: 180px;
}
.ops-select:focus { outline: none; border-color: var(--ops-cat-vas); }
.ops-tech-panel .block { padding: 0; background: transparent; border: none; }
.ops-tech-panel .block-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.6rem;
}
.ops-timer-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
}
.ops-timer-display {
  font-size: 2.5rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  min-width: 8rem;
}
.ops-timer-input {
  flex: 1;
  min-width: 200px;
  padding: 0.6rem 0.75rem;
  border-radius: 8px;
  border: 1px solid var(--ops-border);
  background: var(--ops-input-bg);
  color: var(--text);
  font: inherit;
}
.ops-btn-start {
  background: var(--ops-green);
  border: none;
  color: #0d0d0d;
  font-weight: 700;
  padding: 0.65rem 1.25rem;
  border-radius: 8px;
  cursor: pointer;
}
.ops-btn-stop { background: var(--ops-red); color: #fff; }
.ops-weekly-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 0.75rem;
}
.ops-metric-card {
  background: var(--ops-card);
  border: 1px solid var(--ops-border);
  border-radius: 10px;
  padding: 0.75rem;
}
.ops-metric-card label {
  display: block;
  font-size: 0.65rem;
  color: var(--muted);
  text-transform: uppercase;
  margin-bottom: 0.35rem;
}
.ops-metric-card input {
  width: 100%;
  padding: 0.4rem;
  border-radius: 6px;
  border: 1px solid var(--ops-border);
  background: var(--ops-input-bg);
  color: var(--text);
  font: inherit;
}
.ops-delta {
  font-size: 0.75rem;
  margin-top: 0.25rem;
}
.ops-delta--up { color: var(--ops-green); }
.ops-delta--down { color: var(--ops-red); }
.ops-delta--flat { color: var(--muted); }
.ops-acc-metric-cell {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
.ops-acc-metric-val { font-variant-numeric: tabular-nums; }
.ops-acc-stats-toggle-row { margin-top: 0.75rem; }
.ops-acc-stats-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  font-size: 0.9rem;
}
.ops-acc-content-table .ops-acc-content-thumb-wrap {
  position: relative;
  width: 84px;
  height: 84px;
}
.ops-acc-content-thumb {
  width: 84px;
  height: 84px;
  object-fit: cover;
  border-radius: 8px;
  display: block;
}
.ops-acc-content-thumb--empty {
  background: var(--ops-border);
}
.ops-acc-content-thumb-btn {
  position: relative;
  display: block;
  width: 84px;
  height: 84px;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  border-radius: 8px;
}
.ops-acc-content-thumb-btn:hover .ops-acc-content-thumb {
  opacity: 0.85;
}
.ops-acc-content-thumb-play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.ops-acc-content-thumb-play svg {
  width: 26px;
  height: 26px;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.6));
}

.ops-media-overlay {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: rgba(0, 0, 0, 0.82);
}
.ops-media-modal {
  position: relative;
  width: min(420px, 100%);
  max-height: calc(100vh - 3rem);
}
.ops-media-close {
  position: absolute;
  top: -0.25rem;
  right: -0.25rem;
  z-index: 2;
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}
.ops-media-player {
  display: block;
  width: 100%;
  max-height: calc(100vh - 4rem);
  border-radius: 10px;
  background: #000;
}
.ops-media-player--img {
  object-fit: contain;
  max-height: calc(100vh - 6rem);
}
.ops-media-link {
  text-align: center;
  margin-top: 0.7rem;
}
.ops-media-link a {
  color: var(--ops-accent, #38bdf8);
  font-size: 0.9rem;
}
.ops-media-fallback {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
  padding: 2.5rem 1.5rem;
  border-radius: 10px;
  background: #111;
  color: #cbd5e1;
  text-align: center;
}
.ops-media-fallback[hidden] {
  display: none;
}
.ops-media-fallback a {
  color: var(--ops-accent, #38bdf8);
}
.ops-acc-hot-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  background: var(--ops-pink);
  color: #fff;
  font-size: 0.6rem;
  font-weight: 700;
  padding: 0.1rem 0.25rem;
  border-radius: 4px;
  line-height: 1.2;
}
.ops-acc-feed-panel {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  width: 100%;
}
.ops-acc-feed-head {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-height: 1.6rem;
}
.ops-acc-feed-sort {
  font-size: 0.78rem;
  padding: 0.28rem 0.5rem;
  min-width: 9.5rem;
}
.ops-score-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.1rem;
  padding: 0.18rem 0.4rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  cursor: default;
}
.ops-score-badge--great {
  color: #4ade80;
  background: rgba(34, 197, 94, 0.16);
}
.ops-score-badge--good {
  color: #a3e635;
  background: rgba(163, 230, 53, 0.14);
}
.ops-score-badge--meh {
  color: #fbbf24;
  background: rgba(251, 191, 36, 0.14);
}
.ops-score-badge--low {
  color: #f87171;
  background: rgba(248, 113, 113, 0.14);
}
.ops-score-badge--empty {
  color: var(--muted);
  background: transparent;
}
[data-theme="light"] .ops-score-badge--great {
  color: #15803d;
  background: rgba(21, 128, 61, 0.12);
}
[data-theme="light"] .ops-score-badge--good {
  color: #4d7c0f;
  background: rgba(77, 124, 15, 0.12);
}
[data-theme="light"] .ops-score-badge--meh {
  color: #b45309;
  background: rgba(180, 83, 9, 0.12);
}
[data-theme="light"] .ops-score-badge--low {
  color: #dc2626;
  background: rgba(220, 38, 38, 0.1);
}
.ops-account-picker {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.ops-account-pick {
  padding: 0.4rem 0.75rem;
  border-radius: 8px;
  border: 1px solid var(--ops-border);
  background: var(--ops-card);
  color: var(--text);
  cursor: pointer;
  font: inherit;
}
.ops-account-pick.active { border-color: var(--ops-pink); }
.ops-empty { color: var(--muted); text-align: center; padding: 2rem; }
.ops-locked-banner {
  background: var(--ops-pink-soft);
  border: 1px solid var(--ops-pink);
  border-radius: 8px;
  padding: 0.5rem 0.75rem;
  margin-bottom: 1rem;
  font-size: 0.85rem;
}
/* Admin override of a submitted (locked) report — uses an amber tone so the
   reviewer notices they're about to overwrite a finished day/week. */
.ops-locked-banner--admin {
  background: rgba(251, 146, 60, 0.12);
  border-color: rgba(251, 146, 60, 0.55);
  color: #fb923c;
}
.ops-edit-banner {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.6rem;
  border-radius: 999px;
  background: rgba(251, 146, 60, 0.12);
  color: #fb923c;
  border: 1px solid rgba(251, 146, 60, 0.55);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
}

/* "Add account" toolbar shown above the My-accounts list per VA. */
.ops-va-profile-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.75rem;
}
.ops-modal-section {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.ops-vault-cards {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 0.75rem;
}
.ops-vault-card .av-card-creds {
  grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
}
.ops-vault-acc-link {
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.ops-vault-acc-link:hover .vault-handle-current {
  text-decoration: underline;
}
.ops-modal-section-h {
  margin: 0 0 0.35rem;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}
.ops-accounts-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 0 0 0.75rem;
}
.ops-accounts-list-head .ops-panel-h {
  margin: 0;
}
.ops-accounts-filters {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.ops-va-acc-device {
  margin-top: 0.35rem;
}
.ops-acc-phone {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.28rem 0.72rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.2;
  background: rgba(56, 189, 248, 0.14);
  border: 1px solid rgba(56, 189, 248, 0.5);
  color: #7dd3fc;
  box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.08);
}
.ops-acc-phone-icon {
  font-size: 0.82rem;
  line-height: 1;
}
.ops-acc-phone-label {
  max-width: 14rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ops-acc-phone--default {
  background: rgba(167, 139, 250, 0.16);
  border-color: rgba(167, 139, 250, 0.55);
  color: #c4b5fd;
  box-shadow: 0 0 0 1px rgba(167, 139, 250, 0.1);
}

/* Phones / device cards */
.ops-phone-card {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 0.85rem 1rem;
  margin-bottom: 0.5rem;
}
.ops-phone-head {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  flex-wrap: wrap;
}
.ops-phone-name {
  font-size: 1rem;
}
.ops-phone-card--clickable {
  cursor: pointer;
  transition: border-color 0.12s ease, transform 0.08s ease;
}
.ops-phone-card--clickable:hover {
  border-color: var(--accent, #8b5cf6);
}
.ops-phone-card--clickable:focus-visible {
  outline: 2px solid var(--accent, #8b5cf6);
  outline-offset: 2px;
}
.ops-phone-card--archived {
  opacity: 0.72;
  border-style: dashed;
}
.ops-phone-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-left: auto;
}
.btn-danger-text {
  color: var(--danger, #f87171);
}
.btn-danger-text:hover {
  color: #fca5a5;
}
.ops-phone-detail-head {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin: 0.75rem 0 0.25rem;
}
.ops-phone-detail-name {
  margin: 0;
}
.ops-acc-plat {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-muted, #9aa);
}
.ops-acc-plat--tiktok { background: rgba(0, 0, 0, 0.35); color: #fff; }
.ops-acc-plat--threads { background: rgba(120, 120, 120, 0.25); }
.ops-acc-plat--instagram { background: rgba(193, 53, 132, 0.22); color: #f7a8d8; }
.ops-phone-meta {
  margin: 0;
}
.ops-phone-row {
  display: flex;
  gap: 0.5rem;
  align-items: baseline;
}
.ops-phone-row > span:first-child {
  min-width: 5.5rem;
}
.ops-phone-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 0.35rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--ops-border);
}
.ops-phone-count {
  font-size: 0.8rem;
  color: var(--muted);
}
.ops-phone-actions {
  display: flex;
  gap: 0.4rem;
  align-items: center;
}
.ops-phone-admin-panel {
  margin-top: 1rem;
  border-color: rgba(245, 158, 11, 0.35);
  background: rgba(245, 158, 11, 0.06);
}
.ops-phone-admin-details > summary {
  list-style: none;
  cursor: pointer;
}
.ops-phone-admin-details > summary::-webkit-details-marker {
  display: none;
}
.ops-phone-admin-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.ops-phone-admin-summary-label {
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 600;
}
.ops-phone-admin-summary-label::before {
  content: "▸ ";
  display: inline-block;
  margin-right: 0.15rem;
}
.ops-phone-admin-details[open] > .ops-phone-admin-summary .ops-phone-admin-summary-label::before {
  content: "▾ ";
}
.ops-phone-admin-summary-actions {
  flex-shrink: 0;
}
.ops-phone-admin-body {
  margin-top: 0.65rem;
  padding-top: 0.65rem;
  border-top: 1px dashed rgba(245, 158, 11, 0.25);
}
.ops-phone-admin-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.65rem;
}
.ops-phone-admin-head .ops-panel-h {
  margin: 0;
}
.ops-phone-admin-row > span:last-child {
  text-align: right;
  word-break: break-word;
}
.ops-phone-admin-fields {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px dashed var(--border);
}
.ops-accounts-toolbar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin: 0 0 1rem;
  padding: 0.65rem 0.85rem;
  border: 1px dashed var(--ops-border);
  border-radius: 10px;
  background: var(--ops-card);
}

/* Daily report — list view, status chips, detail view */
.ops-day-list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.ops-day-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1rem;
  align-items: center;
  padding: 1rem 1.25rem;
  border: 1px solid var(--ops-border);
  border-left: 4px solid var(--ops-border);
  border-radius: 12px;
  background: var(--ops-card);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.05s ease;
}
.ops-day-card:hover,
.ops-day-card:focus-visible {
  background: var(--ops-card-hover);
  outline: none;
}
.ops-day-card:active { transform: translateY(1px); }
.ops-day-card--done { border-left-color: var(--ops-cat-active); }
.ops-day-card--today { border-left-color: var(--ops-cat-vas); }
.ops-day-card--open { border-left-color: var(--ops-border); }
.ops-day-card--overdue { border-left-color: var(--ops-cat-banned); }
.ops-overdue-banner {
  margin: 0 0 1rem;
  padding: 0.65rem 0.85rem;
  border-radius: 10px;
  border: 1px solid rgba(239, 68, 68, 0.45);
  background: rgba(239, 68, 68, 0.1);
  color: var(--text);
  font-size: 0.82rem;
  line-height: 1.45;
}
.ops-day-date {
  margin: 0;
  font-size: 1.45rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.ops-daily-headline {
  margin: 0 0 1rem;
  color: #fff;
  font-size: 2.1rem;
  font-weight: 800;
  letter-spacing: -0.015em;
  line-height: 1.15;
}
.ops-day-sub {
  margin-top: 0.25rem;
  color: var(--muted);
  font-size: 0.82rem;
}
.ops-day-hours {
  margin-top: 0.45rem;
  font-size: 0.82rem;
}
.ops-flag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.55rem;
}
.ops-flag {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  border: 1px solid;
  white-space: nowrap;
}
.ops-flag--warn   { color: #facc15; border-color: #facc15; background: rgba(250,204,21,0.12); }
.ops-flag--shadow { color: #8b5cf6; border-color: #8b5cf6; background: rgba(139,92,246,0.14); }
.ops-flag--ban    { color: #ef4444; border-color: #ef4444; background: rgba(239,68,68,0.12); }
.ops-th-unit {
  display: block;
  font-weight: 400;
  font-size: 0.62rem;
  color: var(--muted);
  text-transform: none;
  letter-spacing: 0;
  margin-top: 0.05rem;
}

/* Daily report — status select tinting */
.ops-daystatus {
  border-radius: 8px;
  padding: 0.3rem 0.55rem;
  border: 1px solid;
  font-weight: 600;
  font-size: 0.78rem;
  background: transparent;
}
.ops-daystatus--ok      { color: #22c55e; border-color: #22c55e; background: rgba(34,197,94,0.10); }
.ops-daystatus--warn    { color: #facc15; border-color: #facc15; background: rgba(250,204,21,0.10); }
.ops-daystatus--shadow  { color: #8b5cf6; border-color: #8b5cf6; background: rgba(139,92,246,0.12); }
.ops-daystatus--ban     { color: #ef4444; border-color: #ef4444; background: rgba(239,68,68,0.10); }
.ops-daystatus option { color: var(--text); background: var(--ops-input-bg); }

/* Daily report — notes underline-style row beneath each table row */
.ops-table .ops-notes-tr td {
  padding-top: 0;
  padding-bottom: 0.65rem;
  border-bottom: 1px solid var(--ops-border);
  background: transparent;
}
.ops-daily-tr td {
  border-bottom: none !important;
}
.ops-notes-row {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding-left: 0.15rem;
}
.ops-notes-label {
  font-size: 0.62rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  flex-shrink: 0;
}
.ops-notes-text {
  color: var(--muted);
  font-size: 0.82rem;
  font-style: italic;
}
.ops-notes-input {
  flex: 1;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px dashed var(--ops-border) !important;
  border-radius: 0 !important;
  padding: 0.2rem 0 !important;
  color: var(--muted) !important;
  font-size: 0.82rem !important;
  font-style: italic;
}
.ops-notes-input:focus {
  outline: none !important;
  border-bottom-color: var(--ops-cat-vas) !important;
  color: var(--text) !important;
  font-style: normal;
}
.ops-notes-input:disabled {
  background: transparent !important;
  border-bottom-style: dotted !important;
}
.ops-submit-stack {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.2rem;
}
.ops-submit-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  border: 1px solid;
}
.ops-submit-chip--ok {
  color: var(--ops-cat-active);
  border-color: var(--ops-cat-active);
  background: var(--ops-cat-active-soft);
}
.ops-submit-chip--late {
  color: var(--ops-cat-daily);
  border-color: var(--ops-cat-daily);
  background: var(--ops-cat-daily-soft);
}
.ops-submit-chip--open {
  color: var(--muted);
  border-color: var(--ops-border);
  background: transparent;
}
.ops-submit-chip--overdue {
  color: var(--ops-cat-banned);
  border-color: var(--ops-cat-banned);
  background: var(--ops-cat-banned-soft);
}
.ops-submit-chip-row {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.ops-submit-meta {
  font-size: 0.72rem;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.ops-daily-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}
.ops-daily-detail-title { flex: 1; min-width: 0; }
/* Worked-time block on the daily report form (replaces the live stopwatch). */
.ops-worked-block {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.85rem 1rem;
  margin: 0 0 1rem;
  border: 1px solid var(--ops-border);
  border-radius: 10px;
  background: var(--ops-card-hover, var(--ops-card));
}
.ops-task-time-row {
  margin-bottom: 0.65rem;
}
.ops-task-time-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  margin-bottom: 0.25rem;
}
.ops-task-grand-total {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
}
.ops-worked-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
}
.ops-worked-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.ops-worked-field {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.55rem;
  border-radius: 8px;
  background: var(--ops-card);
  border: 1px solid var(--ops-border);
}
.ops-worked-field input {
  width: 4.5rem;
  background: transparent;
  border: none;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 1rem;
  text-align: right;
  padding: 0;
  outline: none;
}
.ops-worked-field input:focus { color: var(--ops-cat-time); }
.ops-worked-field span { color: var(--muted); font-size: 0.78rem; font-weight: 600; }
.ops-worked-summary {
  margin-left: auto;
  font-size: 0.85rem;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.ops-worked-summary strong { color: var(--ops-cat-time); }
.btn.btn-sm {
  padding: 0.35rem 0.7rem;
  font-size: 0.78rem;
}
.clearfix::after { content: ""; display: table; clear: both; }

a.ops-ig-link,
button.ops-ig-link {
  color: var(--ops-pink);
  text-decoration: none;
  font-weight: 600;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
}
a.ops-ig-link:hover,
button.ops-ig-link:hover {
  text-decoration: underline;
}
button.ops-account-pick a.ops-ig-link {
  pointer-events: auto;
}

.ops-acc-row-main {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
}

.ops-acc-row-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.ops-acc-row-avatar--placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ops-pink);
  background: rgba(233, 30, 140, 0.14);
}

.ops-va-acc-row {
  margin-bottom: 0.5rem;
  cursor: pointer;
  position: relative;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.ops-va-acc-external {
  position: absolute;
  top: 0.45rem;
  right: 0.45rem;
  z-index: 2;
  background: color-mix(in srgb, var(--panel-bg, var(--bg)) 85%, transparent);
}
.ops-va-acc-row:focus-visible {
  outline: 2px solid var(--ops-pink);
  outline-offset: 2px;
}
.ops-va-acc-row:hover {
  border-color: color-mix(in srgb, var(--ops-pink) 35%, var(--border));
  background: color-mix(in srgb, var(--ops-pink) 6%, transparent);
}
.ops-va-acc-row-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding-right: 2.25rem;
}
.ops-va-acc-row-main { min-width: 0; }
.ops-va-acc-handle {
  color: var(--ops-pink);
  font-weight: 600;
}
.ops-va-acc-row-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  flex-shrink: 0;
}
.ops-acc-followers-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 0.15rem;
  flex-wrap: wrap;
}
.ops-acc-followers-lbl {
  font-size: 0.78rem;
  white-space: nowrap;
}
.ops-acc-followers-select {
  min-width: 6.5rem;
  max-width: 100%;
  padding: 0.2rem 0.45rem;
  font-size: 0.78rem;
  height: auto;
}
.ops-acc-funnel-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 0.15rem;
  flex-wrap: wrap;
}
.ops-acc-funnel-lbl {
  font-size: 0.78rem;
  white-space: nowrap;
  min-width: 4.5rem;
}
.ops-acc-funnel-select {
  min-width: 9.5rem;
  max-width: 100%;
  padding: 0.2rem 0.45rem;
  font-size: 0.78rem;
  height: auto;
  font-weight: 600;
  pointer-events: auto;
  position: relative;
  z-index: 3;
}
.ops-acc-funnel-select--ready,
.ops-acc-funnel-row.ops-acc-funnel-select--ready .ops-acc-funnel-select {
  border-color: rgba(245, 158, 11, 0.65);
  background: rgba(245, 158, 11, 0.14);
  color: #fbbf24;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.2);
}
.ops-acc-funnel-select--active,
.ops-acc-funnel-row.ops-acc-funnel-select--active .ops-acc-funnel-select {
  border-color: rgba(34, 197, 94, 0.65);
  background: rgba(34, 197, 94, 0.15);
  color: var(--ops-green);
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.22);
}
.ops-acc-funnel-select--ready option,
.ops-acc-funnel-select--active option {
  color: var(--text);
  background: var(--surface);
}
.ops-acc-name-edit {
  margin: 1rem 0 0;
  padding-top: 0.85rem;
  border-top: 1px solid var(--border);
  max-width: 28rem;
}
.ops-acc-pfp-edit {
  margin: 1rem 0 0;
  padding-top: 0.85rem;
  border-top: 1px solid var(--border);
  max-width: 28rem;
}
.ops-acc-editors {
  max-width: 28rem;
}
.ops-acc-editors-hint {
  margin: 0.25rem 0 0.65rem;
}
.ops-acc-editor-list {
  list-style: none;
  margin: 0 0 0.75rem;
  padding: 0;
}
.ops-acc-editor-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid var(--border);
}
.ops-acc-editor-item:last-child {
  border-bottom: 0;
}
.ops-acc-editors-add {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: flex-end;
}
.ops-acc-editors-add .field {
  flex: 1 1 180px;
  min-width: 0;
  margin: 0;
}
.ops-acc-editor-pick {
  width: 100%;
}
.ops-acc-pfp-edit-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.ops-acc-pfp-input {
  flex: 1 1 180px;
  min-width: 0;
  font-size: 0.82rem;
}
.ops-acc-request-items {
  margin: 0.85rem 0 0;
  padding-top: 0.85rem;
  border-top: 1px solid var(--border);
}
.ops-acc-va-status-row {
  margin: 0.85rem 0 0;
  padding-top: 0.85rem;
  border-top: 1px solid var(--border);
  max-width: 28rem;
}
.ops-acc-va-status-actions {
  margin-top: 0.35rem;
}
.ops-acc-name-lbl {
  display: block;
  margin-bottom: 0.3rem;
}
.ops-acc-name-edit-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: flex-start;
}
.ops-acc-name-input {
  flex: 1 1 12rem;
  min-width: 10rem;
  min-height: 2.6rem;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--input-bg, rgba(0, 0, 0, 0.2));
  color: var(--text);
  font: inherit;
  line-height: 1.35;
  resize: vertical;
}
.ops-acc-name-edit-actions {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  flex-shrink: 0;
}
.ops-acc-save-status {
  margin-top: 0.35rem;
  font-size: 0.78rem;
  line-height: 1.35;
}
.ops-acc-save-status--ok {
  color: var(--ops-green, #22c55e);
  font-weight: 600;
}
.ops-acc-save-status--err {
  color: var(--ops-red, #ef4444);
  font-weight: 600;
}
.ops-acc-save-status--muted {
  color: var(--muted, #9ca3af);
}
.ops-funnel-compact {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  margin-top: 0.2rem;
  flex-wrap: wrap;
}
.ops-funnel-compact-lbl {
  font-size: 0.78rem;
  line-height: 1.6;
  white-space: nowrap;
  flex-shrink: 0;
}
.ops-funnel-compact-body {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
  min-width: 0;
  flex: 1;
}
.ops-funnel-compact-chips {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  align-items: center;
}
.ops-funnel-compact-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.08rem 0.35rem;
  border-radius: 999px;
  background: rgba(124, 58, 237, 0.12);
  border: 1px solid rgba(124, 58, 237, 0.22);
  font-size: 0.72rem;
  line-height: 1.3;
  max-width: 100%;
}
.ops-funnel-compact-chip .ops-funnel-tag {
  font-size: 0.65rem;
  padding: 0 0.2rem;
}
.ops-funnel-compact-chip .ops-funnel-peer {
  font-size: 0.72rem;
  padding: 0;
  min-height: auto;
}
.ops-funnel-compact-empty {
  font-size: 0.78rem;
}

/* ---------- Account detail (in-app IG profile view) ---------- */
.ops-acc-root {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ops-acc-panel {
  padding: 1rem;
}
.ops-acc-header {
  position: relative;
}
.ops-acc-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
}
.ops-acc-back {
  appearance: none;
  background: var(--input-bg, rgba(255, 255, 255, 0.05));
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 999px;
  padding: 0.35rem 0.85rem;
  font-size: 0.8rem;
  cursor: pointer;
}
.ops-acc-back:hover { background: var(--hover-bg, rgba(255, 255, 255, 0.08)); }
.ops-acc-external {
  color: var(--text-muted);
  text-decoration: none;
  font-size: 1rem;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  border: 1px solid var(--border);
}
.ops-acc-external:hover { color: var(--text); border-color: var(--text-muted); }
.ops-acc-handle-cell {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}
.ops-acc-external--inline {
  font-size: 0.72rem;
  padding: 0.12rem 0.42rem;
  line-height: 1;
  flex-shrink: 0;
}
.ops-acc-topbar-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-left: auto;
}

.ops-acc-card {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 1rem;
  align-items: start;
}
.ops-acc-avatar-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
  width: 92px;
}
.ops-acc-avatar-dl {
  width: 100%;
  min-height: 36px;
  padding: 0.35rem 0.4rem !important;
  font-size: 0.62rem;
  line-height: 1.2;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-weight: 600;
  white-space: normal;
  text-align: center;
}
.ops-acc-avatar {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--input-bg, rgba(255,255,255,0.06));
  border: 1px solid var(--border);
}
.ops-acc-avatar--fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  font-weight: 650;
  color: var(--muted);
}
.ops-acc-avatar--hidden {
  display: none !important;
}
.ops-acc-avatar--loading {
  opacity: 0.35;
}
.ops-acc-avatar--broken {
  display: none !important;
}
.ops-acc-info { min-width: 0; }
.ops-acc-identity {
  margin-bottom: 0.35rem;
}
.ops-acc-identity .ops-acc-copy-row + .ops-acc-copy-row {
  margin-top: 0.1rem;
}
.ops-acc-identity .ops-acc-copy-row .ops-acc-copy-btn {
  align-self: flex-start;
  margin-top: 0.15rem;
}
.ops-acc-handle {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--text);
}
.ops-acc-name {
  display: block;
  font-size: 0.92rem;
  font-weight: 500;
  line-height: 1.35;
  color: color-mix(in srgb, var(--text) 82%, var(--text-muted));
  margin-top: 0.12rem;
}
.ops-acc-name--missing,
.ops-acc-bio--missing {
  color: var(--text-muted);
  font-style: italic;
}
.ops-acc-bio {
  margin: 0.5rem 0 0;
  white-space: pre-wrap;
  color: var(--text);
  font-size: 0.85rem;
  line-height: 1.4;
}
.ops-acc-copy-row {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  min-width: 0;
}
.ops-acc-copy-row + .ops-acc-copy-row {
  margin-top: 0.35rem;
}
.ops-acc-copy-row--multiline {
  margin-top: 0.5rem;
}
.ops-acc-copy-row--multiline .ops-acc-bio {
  margin: 0;
}
.ops-acc-copy-hit {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0.15rem 0.25rem;
  margin: 0;
  text-align: left;
  cursor: pointer;
  flex: 1;
  min-width: 0;
  color: inherit;
  font: inherit;
  border-radius: 8px;
}
.ops-acc-copy-hit:hover {
  background: color-mix(in srgb, var(--ops-pink, #f472b6) 8%, transparent);
}
.ops-acc-copy-hit:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ops-pink, #f472b6) 45%, transparent);
  outline-offset: 2px;
}
.ops-acc-copy-btn {
  flex-shrink: 0;
  align-self: flex-start;
  min-height: 36px;
  padding: 0.35rem 0.7rem !important;
  font-size: 0.7rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 600;
}
.ops-acc-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.9rem;
  margin-top: 0.65rem;
  font-size: 0.75rem;
  color: var(--text-muted);
}
.ops-acc-stats {
  display: flex;
  gap: 1.2rem;
  margin-top: 0.85rem;
  flex-wrap: wrap;
}
.ops-acc-actions {
  margin-top: 0.85rem;
}
.ops-acc-stat {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.ops-acc-stat-val {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
}
.ops-acc-stat-lbl {
  font-size: 0.7rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.ops-acc-tabs {
  display: flex;
  gap: 0.4rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.ops-acc-content-plan {
  appearance: none;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--ops-pink, #f472b6);
  padding: 0.35rem 0.65rem;
  border-radius: 8px;
  border: 1px solid rgba(244, 114, 182, 0.35);
  background: rgba(244, 114, 182, 0.08);
  cursor: pointer;
  white-space: nowrap;
}
.ops-acc-content-plan:hover {
  border-color: var(--ops-pink, #f472b6);
  background: rgba(244, 114, 182, 0.14);
}
.ops-acc-tab {
  flex-shrink: 0;
  appearance: none;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--text-muted);
  padding: 0.55rem 0.9rem;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: 0.02em;
}
.ops-acc-tab:hover { color: var(--text); }
.ops-acc-tab.active {
  color: var(--text);
  border-bottom-color: var(--ops-pink, #f472b6);
}

.ops-acc-table-wrap { overflow-x: auto; }
.ops-acc-table th {
  position: sticky;
  top: 0;
  background: var(--panel-bg, rgba(255,255,255,0.03));
  z-index: 1;
  white-space: nowrap;
}
.ops-acc-table td { white-space: nowrap; }

/* Analytics daily table — compact OFM-Pro-style metrics.
   Value + delta chips stack vertically inside each cell instead of fighting
   for space on one line — on a growth day the abs delta ("+22,177") and pct
   delta ("1291.63%") next to a large value simply won't fit on one line at
   any reasonable column width, and clipped/overflowing text is worse than a
   slightly taller row. A horizontal scroll is kept as a last-resort fallback
   so nothing is ever silently swallowed. */
.ops-analytics-table-wrap {
  overflow-x: auto;
  width: 100%;
}
.ops-analytics-table {
  width: 100%;
  min-width: 760px;
  table-layout: fixed;
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
  border-collapse: collapse;
}
.ops-analytics-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 0.75rem 0.6rem;
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.015em;
  color: var(--muted);
  border-bottom: 1px solid var(--ops-border, var(--border));
  background: var(--ops-card, var(--surface));
  white-space: nowrap;
}
.ops-analytics-table td {
  padding: 0.65rem 0.6rem;
  vertical-align: middle;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  border-right: 1px solid rgba(255, 255, 255, 0.035);
  overflow: visible;
}
.ops-analytics-table td:last-child { border-right: none; }
[data-theme="light"] .ops-analytics-table td {
  border-bottom-color: rgba(0, 0, 0, 0.07);
  border-right-color: rgba(0, 0, 0, 0.05);
}
.ops-analytics-table tbody tr:hover td {
  background: rgba(255, 255, 255, 0.025);
}
[data-theme="light"] .ops-analytics-table tbody tr:hover td {
  background: rgba(0, 0, 0, 0.025);
}
/* Column widths tuned per metric: Views/Likes get the most room (large
   numbers + delta chips), Following/Posts get the least (small numbers). */
.ops-analytics-table th:nth-child(1),
.ops-analytics-table td:nth-child(1) { width: 11%; }  /* Date */
.ops-analytics-table th:nth-child(2),
.ops-analytics-table td:nth-child(2) { width: 14%; }  /* Followers */
.ops-analytics-table th:nth-child(3),
.ops-analytics-table td:nth-child(3) { width: 9%; }   /* Following */
.ops-analytics-table th:nth-child(4),
.ops-analytics-table td:nth-child(4) { width: 19%; }  /* Views */
.ops-analytics-table th:nth-child(5),
.ops-analytics-table td:nth-child(5) { width: 18%; }  /* Likes */
.ops-analytics-table th:nth-child(6),
.ops-analytics-table td:nth-child(6) { width: 15%; }  /* Comments */
.ops-analytics-table th:nth-child(7),
.ops-analytics-table td:nth-child(7) { width: 9%; }   /* Reposts */
.ops-analytics-table th:nth-child(8),
.ops-analytics-table td:nth-child(8) { width: 5%; }   /* Posts */
.ops-analytics-date-inner {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
  white-space: nowrap;
}
.ops-analytics-date-main {
  font-weight: 600;
  color: var(--text);
}
.ops-analytics-dow {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.42rem;
  border-radius: 4px;
  font-size: 0.7rem;
  font-weight: 500;
  line-height: 1.2;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.06);
  flex-shrink: 0;
}
[data-theme="light"] .ops-analytics-dow {
  background: rgba(0, 0, 0, 0.06);
}
.ops-analytics-metric {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.22rem;
  min-width: 0;
}
.ops-analytics-val {
  font-weight: 600;
  color: var(--text);
  font-variant-numeric: tabular-nums;
}
.ops-analytics-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem;
  min-width: 0;
}
.ops-analytics-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.4rem;
  border-radius: 5px;
  font-size: 0.74rem;
  font-weight: 500;
  line-height: 1.3;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.ops-analytics-chip--up {
  color: #4ade80;
  background: rgba(34, 197, 94, 0.14);
}
.ops-analytics-chip--down {
  color: #f87171;
  background: rgba(248, 113, 113, 0.12);
}
.ops-analytics-chip--flat {
  color: var(--muted);
  background: rgba(255, 255, 255, 0.05);
}
[data-theme="light"] .ops-analytics-chip--up {
  color: #15803d;
  background: rgba(21, 128, 61, 0.12);
}
[data-theme="light"] .ops-analytics-chip--down {
  color: #dc2626;
  background: rgba(220, 38, 38, 0.1);
}
[data-theme="light"] .ops-analytics-chip--flat {
  background: rgba(0, 0, 0, 0.05);
}
.ops-analytics-empty { color: var(--muted); }
@media (max-width: 1320px) {
  .ops-analytics-table { font-size: 0.85rem; min-width: 660px; }
  .ops-analytics-chip { font-size: 0.68rem; padding: 0.1rem 0.32rem; }
  .ops-analytics-dow { font-size: 0.64rem; }
  .ops-analytics-table th,
  .ops-analytics-table td { padding: 0.5rem 0.45rem; }
}
.ops-acc-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0.35rem;
  padding: 2rem 1rem;
  color: var(--text-muted);
}
.ops-acc-empty strong {
  color: var(--text);
  font-size: 0.95rem;
}
.ops-acc-empty span { font-size: 0.8rem; max-width: 36ch; }
.ops-acc-empty--feed { padding: 3rem 1rem; }

.ops-acc-feed {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
}
.ops-acc-feed-tile {
  position: relative;
  aspect-ratio: 1 / 1;
  background: var(--input-bg, rgba(255,255,255,0.04));
  overflow: hidden;
  border-radius: 4px;
}
.ops-acc-feed-tile img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ops-acc-feed-tile-empty { width: 100%; height: 100%; }

@media (max-width: 640px) {
  .ops-acc-card {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .ops-acc-avatar { margin: 0 auto; }
  .ops-acc-stats { justify-content: center; }
  .ops-acc-meta { justify-content: center; }
}

/* Archived employees / VAs */
.ops-emp-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  border: 1px solid;
  white-space: nowrap;
}
.ops-emp-pill--active {
  color: var(--ops-cat-active);
  border-color: var(--ops-cat-active);
  background: var(--ops-cat-active-soft);
}
.ops-emp-pill--out {
  color: var(--muted);
  border-color: var(--ops-border);
  background: transparent;
}
.ops-emp-row--archived td {
  opacity: 0.55;
}
.ops-emp-row--clickable {
  cursor: pointer;
}
.ops-emp-row--clickable:hover td,
.ops-emp-row--clickable:focus-visible td {
  background: rgba(255, 255, 255, 0.04);
}
.ops-emp-row--clickable:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}
.ops-table--clickrows tbody tr.ops-emp-row--clickable td {
  transition: background 0.12s ease;
}
.ops-profile-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 0.25rem;
}
.ops-profile-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.ops-archived-section {
  margin-top: 1.5rem;
  border-top: 1px dashed var(--ops-border);
  padding-top: 1rem;
}
.ops-archived-section > summary {
  cursor: pointer;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 0.6rem;
  list-style: none;
}
.ops-archived-section > summary::before {
  content: "▸ ";
  display: inline-block;
  margin-right: 0.25rem;
  transition: transform 0.15s ease;
}
.ops-archived-section[open] > summary::before {
  content: "▾ ";
}

/* Sidebar: archived VA visual */
.va-ops-btn--archived {
  opacity: 0.55;
}
.va-ops-btn--archived .va-ops-label {
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}
.va-ops-out {
  margin-left: auto;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--muted);
  border: 1px solid var(--ops-border);
  border-radius: 4px;
  padding: 0.05rem 0.3rem;
}

/* Inline checkbox label (e.g. Active toggle) — wins over .field label rules */
.field label.ops-inline-cb {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--text);
  cursor: pointer;
  user-select: none;
}
.field label.ops-inline-cb input[type="checkbox"] {
  width: auto !important;
  min-width: 0;
  flex: 0 0 auto;
  margin: 0;
  accent-color: var(--ops-cat-vas);
  cursor: pointer;
}
.field label.ops-inline-cb span { white-space: nowrap; }

.field-password-wrap {
  display: flex;
  align-items: stretch;
  gap: 0.35rem;
}

.field-password-wrap input {
  flex: 1;
  min-width: 0;
}

.field-password-toggle {
  flex-shrink: 0;
  align-self: stretch;
  padding: 0 0.65rem !important;
  min-width: 2.5rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  line-height: 1;
}

.field-password-toggle--visible {
  border-color: var(--accent);
}

/* Orphan-slot panel */
.orphan-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}

/* Daily report — admin-only delete bar */
.ops-daily-admin-bar {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin-top: 1rem;
  padding-top: 0.8rem;
  border-top: 1px dashed var(--ops-border);
  flex-wrap: wrap;
}

/* Team & Access — admin date / timezone bar */
.ops-team-date-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin: 0 0 0.65rem;
  padding: 0.55rem 0.65rem;
  border-radius: 10px;
  border: 1px solid var(--ops-border);
  background: rgba(255, 255, 255, 0.02);
}
.ops-team-tz-toggle {
  display: inline-flex;
  border: 1px solid var(--ops-border);
  border-radius: 999px;
  overflow: hidden;
}
.ops-team-tz-btn {
  border: 0;
  background: transparent;
  color: var(--muted, #888);
  font: inherit;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 0.35rem 0.7rem;
  cursor: pointer;
}
.ops-team-tz-btn.active {
  background: rgba(251, 146, 60, 0.18);
  color: #fb923c;
}
.ops-team-tz-btn:hover:not(.active) {
  background: rgba(255, 255, 255, 0.04);
}
.ops-team-date-nav {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}
.ops-team-date-display {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.25rem 0.55rem;
  border-radius: 8px;
  min-width: 10rem;
  justify-content: center;
}
.ops-team-date-display--today {
  background: rgba(34, 197, 94, 0.12);
  border: 1px solid rgba(34, 197, 94, 0.45);
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.08);
}
.ops-team-date-text {
  font-weight: 600;
  font-size: 0.88rem;
}
.ops-team-date-tz {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.ops-team-today-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  background: rgba(34, 197, 94, 0.2);
  color: #4ade80;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.ops-team-today-btn--active {
  opacity: 0.55;
}
.ops-team-view-hint {
  margin: 0 0 0.65rem !important;
  font-size: 0.76rem !important;
}

/* Boss Overview: archived VA card */
.ops-va-card--archived {
  opacity: 0.55;
}
.ops-va-card--archived:hover {
  opacity: 0.75;
}

/* Boss Overview: whole VA card is clickable to open the operator's profile */
.ops-va-card--clickable {
  cursor: pointer;
  transition: border-color 0.12s ease, transform 0.12s ease, background 0.12s ease;
}
.ops-va-card--clickable:hover {
  border-color: var(--ops-cat-vas, var(--accent));
  background: var(--ops-card-hover, var(--ops-card));
}
.ops-va-card--clickable:focus-visible {
  outline: 2px solid var(--ops-cat-vas, var(--accent));
  outline-offset: 2px;
}
.ops-va-card--clickable:active {
  transform: translateY(1px);
}
/* Name styled like a link, but the click target is the whole card. */
.ops-va-card--clickable .ops-va-link {
  color: var(--text);
}
.ops-va-card--clickable:hover .ops-va-link {
  color: var(--ops-cat-vas, var(--accent));
  text-decoration: underline;
}

/* VA-detail archived banner */
.ops-archived-banner {
  margin-bottom: 0.8rem;
  padding: 0.55rem 0.85rem;
  border-radius: 8px;
  background: rgba(148, 163, 184, 0.10);
  border: 1px solid var(--ops-border);
  color: var(--muted);
  font-size: 0.82rem;
  letter-spacing: 0.01em;
}

/* Profile tab (read-only) */
.ops-model-info {
  border: 1px solid var(--ops-border);
  border-radius: 10px;
  padding: 0.85rem 1rem;
  background: rgba(124, 58, 237, 0.06);
}
.ops-model-info-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 0.45rem;
}
.ops-model-info-body {
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--text);
  white-space: pre-wrap;
}
.ops-profile-grid {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
.ops-profile-row {
  display: grid;
  grid-template-columns: 160px 1fr;
  align-items: start;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--ops-border);
}
.ops-profile-row:last-child { border-bottom: none; }
.ops-profile-key {
  color: var(--muted);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
}
.ops-profile-val {
  color: var(--text);
  font-size: 0.92rem;
}
.ops-profile-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.ops-profile-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  font-size: 0.88rem;
}
.ops-profile-tag {
  background: var(--ops-cat-vas-soft);
  color: var(--ops-cat-vas);
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
}
.ops-profile-primary {
  color: var(--ops-cat-active);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.ops-emp-profile-top {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0 0 1rem;
  flex-wrap: wrap;
}

.ops-emp-profile-top-meta {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}

.ops-emp-profile-name {
  margin: 0;
  font-size: 1.15rem;
}

.ops-emp-avatar-wrap {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: rgba(167, 139, 250, 0.12);
  border: 1px solid rgba(167, 139, 250, 0.25);
  position: relative;
}

.ops-emp-avatar-wrap--fallback {
  display: flex;
  align-items: center;
  justify-content: center;
}

.ops-emp-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ops-emp-avatar--loading {
  opacity: 0;
}

.ops-emp-avatar--hidden {
  display: none;
}

.ops-emp-avatar-fallback--overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ops-emp-avatar-fallback--hidden {
  display: none;
}

.ops-emp-avatar-fallback {
  font-size: 1.25rem;
  font-weight: 700;
  color: #c4b5fd;
}

.ops-emp-pic-edit,
.ops-emp-id-edit {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin-top: 0.15rem;
}

.ops-profile-val--stack {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  align-items: flex-start;
}

.ops-birthday-panel {
  margin-bottom: 1rem;
}

.ops-bday-head {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0 0 0.75rem;
}

.ops-bday-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(180px, 0.8fr);
  gap: 1rem;
}

.ops-bday-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.35rem;
}

.ops-bday-wd {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted, #9ca3af);
  text-align: center;
  padding-bottom: 0.15rem;
}

.ops-bday-cell {
  min-height: 3.1rem;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  padding: 0.25rem 0.3rem;
  background: rgba(0, 0, 0, 0.12);
}

.ops-bday-cell--pad {
  background: transparent;
  border-color: transparent;
}

.ops-bday-cell--has {
  border-color: rgba(167, 139, 250, 0.35);
  background: rgba(167, 139, 250, 0.08);
}

.ops-bday-num {
  display: block;
  font-size: 0.72rem;
  color: var(--muted, #9ca3af);
  margin-bottom: 0.15rem;
}

.ops-bday-name {
  display: block;
  font-size: 0.68rem;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ops-bday-name--model {
  color: #f9a8d4;
}

.ops-bday-name--employee {
  color: #c4b5fd;
}

.ops-bday-side-h {
  margin: 0 0 0.5rem;
  font-size: 0.82rem;
}

.ops-bday-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ops-bday-list li {
  padding: 0.28rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 0.82rem;
}

.ops-bday-list-day {
  display: inline-block;
  width: 1.6rem;
  color: var(--muted, #9ca3af);
}

@media (max-width: 900px) {
  .ops-bday-layout {
    grid-template-columns: 1fr;
  }
}

/* Make any wide ops table horizontally scrollable on small screens */
.ops-table-wrap,
.ops-scroll-x {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ============================================================
   Boss Overview — greeting, KPIs, donut, mid grid, top IG
   ============================================================ */
.ops-greet-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1.1rem;
  flex-wrap: wrap;
}
.ops-greet {
  margin: 0;
  font-size: 1.7rem;
  font-weight: 650;
  letter-spacing: -0.01em;
  color: var(--text);
}
.ops-period-toggle {
  display: inline-flex;
  background: var(--ops-card);
  border: 1px solid var(--ops-border);
  border-radius: 999px;
  padding: 3px;
  gap: 2px;
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: none;
}
.ops-period-toggle::-webkit-scrollbar { display: none; }
.ops-period-btn {
  background: transparent;
  border: none;
  padding: 0.4rem 0.95rem;
  font: inherit;
  font-size: 0.82rem;
  color: var(--muted);
  cursor: pointer;
  border-radius: 999px;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.12s, color 0.12s;
}
.ops-period-btn:hover { color: var(--text); }
.ops-period-btn.active {
  background: var(--ops-cat-vas-soft);
  color: var(--ops-cat-vas);
  font-weight: 600;
}

.ops-boss-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 32%);
  gap: clamp(0.75rem, 1.5vw, 1.25rem);
  margin-bottom: 1.1rem;
  width: 100%;
}
.ops-bk-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.85rem;
  align-items: stretch;
}
.ops-bk {
  position: relative;
  padding: 0.9rem 1rem 0.6rem;
  border-radius: 14px;
  border: 1px solid var(--ops-border);
  background: var(--ops-card);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-height: 150px;
  /* overflow visible so chart tooltips can escape the tile */
}
.ops-bk::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--ops-bk-grad, transparent);
  opacity: 0.13;
  pointer-events: none;
  z-index: 0;
}
.ops-bk > * { position: relative; z-index: 1; }
.ops-bk-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}
.ops-bk-lbl {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text);
  letter-spacing: -0.01em;
}
.ops-bk-src {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--muted);
  text-transform: uppercase;
  white-space: nowrap;
}
.ops-bk-val {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--text);
  margin-top: 0.1rem;
}
.ops-bk-unit {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text);
  margin-left: 0.05rem;
}
.ops-bk-meta {
  font-size: 0.78rem;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}
.ops-bk-period { color: var(--muted); }
.ops-bk-delta { font-weight: 600; }
.ops-bk-delta--up { color: var(--ops-cat-active); }
.ops-bk-delta--down { color: var(--ops-cat-banned); }
.ops-bk-spark {
  margin: auto 0 0;
  width: 100%;
  height: 42px;
  position: relative;
}
.ops-bk-spark .chart-box { width: 100%; height: 100%; }
.ops-bk-spark-svg {
  width: 100%;
  height: 100%;
  display: block;
}
.ops-bk-spark .chart-tooltip {
  z-index: 30;
}
.ops-bk--views { --ops-bk-grad: linear-gradient(135deg, var(--ops-cat-accounts) 0%, transparent 70%); }
.ops-bk--clicks { --ops-bk-grad: linear-gradient(135deg, var(--ops-cat-vas) 0%, transparent 70%); }
.ops-bk--ctr { --ops-bk-grad: linear-gradient(135deg, var(--ops-cat-active) 0%, transparent 70%); }

.ops-donut-card {
  border: 1px solid var(--ops-border);
  background: var(--ops-card);
  border-radius: 14px;
  padding: 0.85rem 1rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.ops-donut-head {
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}
.ops-donut-body {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 0.85rem;
  align-items: center;
}
.ops-donut-wrap {
  position: relative;
  width: 130px;
  height: 130px;
}
.ops-donut-svg { width: 100%; height: 100%; display: block; }
.ops-donut-slice {
  transition: stroke-width 0.16s ease, opacity 0.16s ease;
  cursor: pointer;
}
.ops-donut-slice:hover,
.ops-donut-slice.active { stroke-width: 20; }
.ops-donut-card:hover .ops-donut-slice:not(:hover):not(.active) {
  opacity: 0.45;
}
.ops-donut-center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  text-align: center;
}
.ops-donut-center-num {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: -0.01em;
}
.ops-donut-center-lbl {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin-top: 2px;
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ops-donut-legend {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  max-height: 130px;
  overflow-y: auto;
}
.ops-donut-legend li {
  display: grid;
  grid-template-columns: 10px 1fr auto;
  gap: 0.5rem;
  align-items: center;
  font-size: 0.8rem;
}
.ops-donut-dot { width: 10px; height: 10px; border-radius: 50%; }
.ops-donut-name { color: var(--text); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.ops-donut-num { color: var(--muted); font-variant-numeric: tabular-nums; font-size: 0.78rem; }
.ops-donut-empty {
  text-align: center;
  padding: 1.5rem 0.5rem;
  color: var(--muted);
  font-size: 0.85rem;
}

.ops-boss-mid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: clamp(0.75rem, 1.5vw, 1.25rem);
  margin-bottom: 1.1rem;
  overflow: visible;
  width: 100%;
}
.ops-analytics-panel { display: flex; flex-direction: column; gap: 0.6rem; }
.ops-boss-accounts-panel { grid-column: 1 / -1; }
.ops-analytics-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.ops-analytics-meta {
  font-size: 0.78rem;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.ops-source-tag {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.1rem 0.45rem;
  border-radius: 4px;
}
.ops-source-tag--live { background: var(--ops-cat-active-soft); color: var(--ops-cat-active); }
.ops-source-tag--mock { background: var(--ops-cat-accounts-soft); color: var(--ops-cat-accounts); }
.ops-no-margin { margin: 0; }
.ops-analytics-panel .chart-area {
  width: 100%;
  height: clamp(200px, 26vh, 340px);
  min-height: 200px;
  position: relative;
}
.ops-analytics-panel .chart-box {
  width: 100%;
  height: 100%;
  position: relative;
}
.ops-analytics-panel .chart-main-svg {
  width: 100%;
  height: 100%;
  display: block;
}
.ops-analytics-panel .chart-tooltip {
  z-index: 30;
}

/* Boss Overview — Top Links (GMS-style rows) */
.ops-bt-panel { padding: 1.1rem 1.25rem; overflow: visible; }
.ops-bt-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.6rem;
}
.ops-bt-colhead {
  display: grid;
  grid-template-columns: 2.4rem 1fr 90px 3.5rem;
  gap: 0.7rem;
  align-items: center;
  padding: 0 0.5rem 0.45rem;
  border-bottom: 1px solid var(--ops-border);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}
.ops-bt-col-c { text-align: center; }
.ops-bt-col-r { text-align: right; }
.ops-bt-list {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  margin-top: 0.4rem;
  overflow: visible;
}
.ops-bt-row {
  display: grid;
  grid-template-columns: 2.4rem 1fr 90px 3.5rem;
  gap: 0.7rem;
  align-items: center;
  padding: 0.6rem 0.5rem;
  border-radius: 10px;
  border: 1px solid transparent;
  transition: background 0.12s ease;
  overflow: visible;
}
.ops-bt-row:hover { background: var(--ops-card-hover); }
.ops-bt-row--lead {
  background: var(--ops-cat-vas-soft);
  border-color: rgba(168, 85, 247, 0.25);
}
.ops-bt-row--lead:hover { background: var(--ops-cat-vas-soft); }
.ops-bt-medal {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.04);
  color: var(--muted);
  flex-shrink: 0;
}
.ops-bt-medal--1 {
  background: rgba(250, 204, 21, 0.18);
  color: #facc15;
}
.ops-bt-medal--2 {
  background: rgba(203, 213, 225, 0.18);
  color: #cbd5e1;
}
.ops-bt-medal--3 {
  background: rgba(249, 115, 22, 0.2);
  color: #fb923c;
}
.ops-bt-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
/* Truncated link label + hover tooltip (GetMySocial-style) */
.ops-link-tip-wrap {
  position: relative;
  display: block;
  min-width: 0;
  max-width: 100%;
}
.ops-link-tip-text {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ops-bt-title.ops-link-tip-wrap .ops-link-tip-text {
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--text);
}
.ops-bt-sub-line.ops-link-tip-wrap {
  display: block;
  flex: 1;
  min-width: 0;
}
.ops-bt-sub-line.ops-link-tip-wrap .ops-link-tip-text {
  font-size: 0.74rem;
  color: var(--muted);
}
.ops-link-tip {
  position: absolute;
  left: 0;
  top: calc(100% + 6px);
  padding: 0.4rem 0.65rem;
  background: #0f172a;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 500;
  color: #f1f5f9;
  white-space: nowrap;
  z-index: 60;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.12s ease, visibility 0.12s ease;
}
[data-theme="light"] .ops-link-tip {
  background: #1e293b;
  color: #f8fafc;
}
.ops-link-tip-wrap:hover .ops-link-tip,
.ops-link-tip-wrap:focus-within .ops-link-tip {
  opacity: 1;
  visibility: visible;
}
.ops-bt-sub {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  min-width: 0;
  max-width: 100%;
}
.ops-bt-link {
  flex-shrink: 0;
  opacity: 0.65;
}
.ops-bt-spark {
  width: 100%;
  height: 36px;
  position: relative;
}
.ops-bt-spark .chart-box { width: 100%; height: 100%; }
.ops-bt-spark .spark { width: 100%; height: 100%; display: block; }
.ops-bt-spark .chart-tooltip { z-index: 30; }
.ops-bt-val {
  text-align: right;
  font-size: 1.05rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}

@media (max-width: 760px) {
  .ops-bt-colhead,
  .ops-bt-row {
    grid-template-columns: 2rem 1fr 70px 2.8rem;
    gap: 0.5rem;
  }
  .ops-bt-medal { width: 1.9rem; height: 1.9rem; font-size: 0.85rem; }
}

.ops-stat-row--compact { margin: 0.2rem 0 0.85rem; }

@media (min-width: 1200px) {
  .ops-boss-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 28%);
  }
  .ops-boss-mid {
    grid-template-columns: minmax(0, 2.3fr) minmax(340px, 1fr);
  }
}
@media (min-width: 1600px) {
  .ops-boss-grid {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 22%);
  }
  .ops-boss-mid {
    grid-template-columns: minmax(0, 2.6fr) minmax(400px, 1fr);
  }
  .ops-donut-body {
    grid-template-columns: 145px 1fr;
  }
  .ops-donut-wrap {
    width: 145px;
    height: 145px;
  }
  .ops-donut-legend {
    max-height: 145px;
  }
}
@media (min-width: 2000px) {
  .ops-bk-row {
    gap: 1rem;
  }
  .ops-analytics-panel .chart-area {
    height: clamp(240px, 30vh, 400px);
  }
}
@media (max-width: 980px) {
  .ops-boss-grid { grid-template-columns: 1fr; }
  .ops-boss-mid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .ops-bk-row { grid-template-columns: 1fr 1fr; }
  .ops-bk { min-height: 130px; padding: 0.7rem 0.8rem 0; }
  .ops-bk-val { font-size: 1.55rem; }
  .ops-bk-spark { margin: auto -0.8rem 0; height: 32px; }
  .ops-greet { font-size: 1.3rem; }
  .ops-donut-body { grid-template-columns: 110px 1fr; }
  .ops-donut-wrap { width: 110px; height: 110px; }
}
@media (max-width: 420px) {
  .ops-bk-row { grid-template-columns: 1fr; }
}

/* ============================================================
   Mobile (≤ 800px) — VA Operations dashboard
   ============================================================ */
@media (max-width: 800px) {
  /* KPI / stat row collapse to 2 columns */
  .ops-stat-row {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem !important;
  }
  .ops-stat {
    padding: 0.7rem 0.85rem !important;
  }
  .ops-stat-num { font-size: 1.4rem !important; }
  .ops-stat-lbl { font-size: 0.62rem !important; }

  /* VA card: stack the 5-column header/row layout into a vertical list */
  .ops-va-card-head { display: none; }
  .ops-va-card {
    grid-template-columns: 1fr !important;
    gap: 0.45rem !important;
    padding: 0.85rem !important;
  }
  .ops-va-card > * {
    width: 100%;
  }

  /* Daily report cards */
  .ops-day-card {
    grid-template-columns: 1fr;
    padding: 0.85rem 1rem;
    gap: 0.55rem;
  }
  .ops-day-card .ops-submit-chip { justify-self: flex-start; }
  .ops-daily-headline { font-size: 1.4rem; }
  .ops-worked-row { gap: 0.5rem; }
  .ops-worked-summary { width: 100%; margin: 0.2rem 0 0; }

  /* Daily form: keep table readable, scroll horizontally */
  .ops-table { font-size: 0.82rem; }
  .ops-table th,
  .ops-table td { padding: 0.4rem 0.3rem; }

  /* Wrap any direct ops-table inside a scroll container fallback */
  .ops-table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
  .ops-table tbody,
  .ops-table thead,
  .ops-table tr { display: table; width: 100%; table-layout: auto; }

  /* Weekly grid: single column */
  .ops-weekly-grid {
    grid-template-columns: 1fr;
  }

  /* Profile rows: stack key over value */
  .ops-profile-row {
    grid-template-columns: 1fr;
    gap: 0.2rem;
    padding: 0.5rem 0;
  }

  /* Tabs: allow horizontal scroll if many tabs */
  .ops-tabs,
  .ops-va-tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap !important;
    white-space: nowrap;
  }

  /* Account picker: full-width pills */
  .ops-account-picker { gap: 0.4rem; }
  .ops-account-pick { flex: 1 1 calc(50% - 0.4rem); text-align: center; }

  /* Timer row stacks */
  .ops-timer-row { gap: 0.5rem; }
  .ops-timer-display { font-size: 2rem; min-width: 0; }
  .ops-timer-input { width: 100%; min-width: 0; }

  /* Model checkbox grid */
  #empModelsBox { gap: 0.4rem 0.6rem; }
  #empModelsBox label.ops-model-cb { padding: 0.3rem 0.55rem; font-size: 0.85rem; }

  /* Boss-Overview headings/buttons */
  .ops-boss-actions {
    flex-direction: column;
    align-items: stretch;
  }
}

/* Even tighter for phones */
@media (max-width: 480px) {
  .ops-stat-row { grid-template-columns: 1fr 1fr !important; }
  .ops-daily-headline { font-size: 1.2rem; }
  .ops-timer-display { font-size: 1.7rem; }
}

/* TikTok weekly screen recordings */
.ops-wk-media-panel {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.ops-wk-upload-box {
  padding: 0.85rem 1rem;
  border: 1px dashed var(--ops-border);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.02);
}
.ops-wk-file-input {
  display: block;
  width: 100%;
  margin-bottom: 0.5rem;
  color: var(--text);
}
.ops-wk-upload-queue {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-top: 0.65rem;
}
.ops-wk-upload-row {
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid var(--ops-border);
}
.ops-wk-upload-name {
  font-size: 0.85rem;
  margin-bottom: 0.35rem;
  word-break: break-word;
}
.ops-wk-progress {
  height: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
}
.ops-wk-progress-bar {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #22c55e, #4ade80);
  transition: width 0.15s ease;
}
.ops-wk-progress--err .ops-wk-progress-bar {
  background: linear-gradient(90deg, #ef4444, #f87171);
}
.ops-wk-upload-status {
  margin-top: 0.25rem;
}
.ops-wk-upload-done {
  margin-top: 0.65rem;
  padding: 0.65rem 0.85rem;
  border-radius: 8px;
  background: rgba(34, 197, 94, 0.12);
  border: 1px solid rgba(34, 197, 94, 0.35);
  color: #86efac;
  font-size: 0.88rem;
}
.ops-wk-upload-done--warn {
  background: rgba(234, 179, 8, 0.12);
  border-color: rgba(234, 179, 8, 0.35);
  color: #fde68a;
}
.ops-wk-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.85rem;
}
.ops-wk-att {
  border: 1px solid var(--ops-border);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.2);
}
.ops-wk-att-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  padding: 0.45rem 0.55rem;
  border-bottom: 1px solid var(--ops-border);
}
.ops-wk-att-name {
  font-size: 0.78rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}
.ops-wk-media-thumb,
.ops-wk-media-video {
  display: block;
  width: 100%;
  max-height: 280px;
  object-fit: contain;
  background: #000;
}

/* Funnel links on account profiles + posting lists */
.ops-funnel-panel {
  margin-top: 0.75rem;
}
.ops-funnel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.ops-funnel-head .ops-panel-h {
  margin: 0;
}
.ops-funnel-head-actions {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.ops-funnel-hint {
  margin: 0.35rem 0 0.75rem;
}
.ops-funnel-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.ops-funnel-cols--compact {
  gap: 0.75rem;
}
@media (max-width: 720px) {
  .ops-funnel-cols {
    grid-template-columns: 1fr;
  }
}
.ops-funnel-col-h {
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 0.35rem;
}
.ops-funnel-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.ops-funnel-item {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
  font-size: 0.82rem;
}
.ops-funnel-dir {
  color: var(--muted);
  font-weight: 700;
}
.ops-funnel-tag {
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
  background: rgba(148, 163, 184, 0.12);
}
.ops-funnel-peer {
  font-weight: 600;
}
.ops-funnel-modal-current {
  margin-top: 1rem;
  padding-top: 0.75rem;
  border-top: 1px dashed var(--ops-border);
}
.ops-funnel-empty {
  list-style: none;
}
.ops-wk-media-thumb {
  cursor: pointer;
}

.ops-va-acc-funnel {
  display: inline-block;
  margin-left: 0.35rem;
  vertical-align: middle;
}
.ops-tt-funnel-panel {
  margin-top: 0.75rem;
}
.ops-tt-funnel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.35rem;
}
.ops-tt-funnel-head .ops-panel-h {
  margin: 0;
}
.ops-tt-funnel-hint {
  font-size: 0.82rem;
  margin: 0 0 0.75rem;
}
.ops-tt-funnel-meta {
  display: grid;
  gap: 0.35rem;
  margin-bottom: 0.75rem;
}
.ops-tt-funnel-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
  align-items: baseline;
  font-size: 0.88rem;
}
.ops-tt-funnel-meta-row .muted {
  min-width: 6.5rem;
}
.ops-tt-funnel-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}
.ops-tt-funnel-assign-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  width: 100%;
  max-width: 36rem;
}
.ops-tt-funnel-link-input {
  flex: 1 1 14rem;
  min-width: 0;
  padding: 0.45rem 0.6rem;
  border-radius: 6px;
  border: 1px solid var(--ops-border, rgba(255, 255, 255, 0.12));
  background: var(--input-bg, rgba(0, 0, 0, 0.2));
  color: inherit;
}
.ops-pill--tt-funnel {
  font-size: 0.72rem;
  letter-spacing: 0.02em;
}
.ops-pill--tt-funnel-muted {
  background: rgba(120, 120, 120, 0.22);
  color: var(--text-muted, #aaa);
}
.ops-pill--tt-funnel-warn,
.ops-pill--tt-funnel-ready {
  background: rgba(245, 158, 11, 0.2);
  color: #fbbf24;
}
.ops-pill--tt-funnel-info {
  background: rgba(59, 130, 246, 0.2);
  color: #93c5fd;
}
.ops-pill--tt-funnel-ok {
  background: rgba(20, 184, 166, 0.22);
  color: #5eead4;
}
.ops-tt-ig-funnel-panel {
  margin-top: 0.75rem;
}

.ops-req-checks {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-top: 0.35rem;
}
.ops-req-check {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.92rem;
}
.ops-req-st {
  display: inline-block;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ops-req-st--open {
  background: rgba(245, 158, 11, 0.2);
  color: #fbbf24;
}
.ops-req-st--done {
  background: rgba(20, 184, 166, 0.22);
  color: #5eead4;
}

