/* Campaigns screen — extra styles on top of analytics tokens */

/* Hero */
.cp-hero-row {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  flex-wrap: wrap;
}
.cp-hero-actions {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.cp-new {
  display: inline-flex;
  height: 32px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--aq-accent) 50%, transparent);
  background: color-mix(in srgb, var(--aq-accent) 18%, transparent);
}
.cp-new-main, .cp-new-arrow {
  background: transparent;
  border: 0;
  color: var(--aq-text);
  font: inherit;
  font-size: 12.5px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 14px;
  height: 100%;
  transition: background var(--aq-d-1) var(--aq-ease);
}
.cp-new-arrow {
  padding: 0 8px;
  border-left: 1px solid color-mix(in srgb, var(--aq-accent) 40%, transparent);
}
.cp-new-main:hover, .cp-new-arrow:hover {
  background: color-mix(in srgb, var(--aq-accent) 14%, transparent);
}

/* Quick-start tiles */
.cp-quickstart {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 20px;
}
.cp-qs-tile {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--aq-line);
  border-radius: var(--aq-r-md, 8px);
  background: var(--aq-surface);
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: var(--aq-text);
  position: relative;
  overflow: hidden;
  transition: background 160ms, border-color 160ms;
}
.cp-qs-tile:hover {
  background: var(--aq-surface-2);
  border-color: color-mix(in srgb, var(--aq-line) 60%, var(--aq-text-faint));
}
.cp-qs-bar {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  opacity: 0.85;
}
.cp-qs-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--aq-surface-2);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.cp-qs-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.cp-qs-label {
  font-family: var(--aq-ff-display);
  font-size: 13.5px;
  font-weight: 500;
  color: var(--aq-text);
}
.cp-qs-desc {
  font-size: 11.5px;
  color: var(--aq-text-faint);
}
.cp-qs-plus {
  margin-left: auto;
  color: var(--aq-text-faint);
}

/* Toolbar */
.cp-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.cp-tabs {
  display: inline-flex;
  align-items: center;
  gap: 0;
  background: var(--aq-surface);
  border: 1px solid var(--aq-line);
  border-radius: 8px;
  padding: 3px;
}
.cp-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  font: inherit;
  font-size: 12px;
  color: var(--aq-text-dim);
  background: transparent;
  border: 0;
  border-radius: 6px;
  cursor: pointer;
  transition: background var(--aq-d-1) var(--aq-ease), color var(--aq-d-1) var(--aq-ease);
}
.cp-tab:hover { color: var(--aq-text); background: rgba(255,255,255,0.04); }
.cp-tab.is-active {
  background: var(--aq-surface-2);
  color: var(--aq-text);
  box-shadow: var(--aq-edge-top);
}
.cp-tab-count {
  font-family: var(--aq-ff-mono);
  font-size: 10.5px;
  color: var(--aq-text-faint);
  background: rgba(255,255,255,0.04);
  border-radius: 99px;
  padding: 1px 6px;
  font-variant-numeric: tabular-nums;
  min-width: 16px;
  text-align: center;
}
.cp-tab.is-active .cp-tab-count {
  background: rgba(255,255,255,0.08);
  color: var(--aq-text);
}
.cp-tab-count.is-warn {
  background: color-mix(in srgb, var(--aq-warn) 18%, transparent);
  color: var(--aq-warn);
}
.cp-tab-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--aq-success);
  box-shadow: 0 0 6px var(--aq-success);
}

.cp-tools {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.cp-search {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 30px;
  padding: 0 10px;
  border: 1px solid var(--aq-line);
  border-radius: 8px;
  background: var(--aq-surface);
  width: 280px;
}
.cp-search svg { color: var(--aq-text-faint); }
.cp-search input {
  flex: 1;
  background: transparent;
  border: 0;
  outline: none;
  color: var(--aq-text);
  font: inherit;
  font-size: 12px;
}
.cp-search input::placeholder { color: var(--aq-text-faint); }

/* List view */
.cp-list-head, .cp-list-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 2fr) 100px 130px 100px 160px 220px 28px;
  gap: 12px;
  align-items: center;
  padding: 11px 14px;
  border-bottom: 1px solid var(--aq-line);
  font-size: 12.5px;
}
.cp-list-head {
  font-size: 10.5px;
  color: var(--aq-text-faint);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 500;
  background: rgba(255,255,255,0.012);
  padding: 8px 14px;
}
.cp-list-row { transition: background var(--aq-d-1) var(--aq-ease); cursor: pointer; }
.cp-list-row:hover { background: var(--aq-surface-2); }
.cp-list-row:last-of-type { border-bottom: 0; }

.cp-checkbox {
  width: 14px;
  height: 14px;
  appearance: none;
  border: 1px solid var(--aq-line);
  border-radius: 3px;
  background: var(--aq-surface);
  cursor: pointer;
  position: relative;
}
.cp-checkbox:checked {
  background: var(--aq-accent);
  border-color: var(--aq-accent);
}
.cp-checkbox:checked::after {
  content: "";
  position: absolute;
  inset: 2px;
  background: var(--aq-bg-2);
  -webkit-mask: linear-gradient(to bottom right, transparent 45%, black 50%) center/100% 100% no-repeat;
}

.cp-cell-name {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.cp-thumb {
  width: 40px;
  height: 30px;
  border-radius: 5px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.08);
}
.cp-thumb-glyph {
  font-size: 16px;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.4));
}
.cp-name-stack {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cp-name {
  font-size: 13px;
  color: var(--aq-text);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 450;
}
.cp-name-sub {
  font-size: 11px;
  color: var(--aq-text-faint);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cp-objective {
  color: var(--aq-text-dim);
}

.cp-type-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--aq-ff-mono);
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 4px;
  background: rgba(255,255,255,0.04);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  flex-shrink: 0;
}

/* Status pill */
.cp-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-family: var(--aq-ff-mono);
  color: var(--aq-text-dim);
}
.cp-status-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--aq-text-faint);
}
.cp-status.is-live { color: var(--aq-success); }
.cp-status.is-live .cp-status-dot { background: var(--aq-success); box-shadow: 0 0 6px var(--aq-success); }
.cp-status.is-scheduled { color: var(--aq-accent); }
.cp-status.is-scheduled .cp-status-dot { background: var(--aq-accent); box-shadow: 0 0 6px var(--aq-accent); }
.cp-status.is-warn { color: var(--aq-warn); }
.cp-status.is-warn .cp-status-dot { background: var(--aq-warn); box-shadow: 0 0 6px var(--aq-warn); }
.cp-status.is-draft { color: var(--aq-text-faint); }
.cp-status.is-paused .cp-status-dot { background: var(--aq-text-faint); }
.cp-status.is-archived { color: var(--aq-text-faint); opacity: 0.7; }

/* Schedule cell */
.cp-cell-schedule {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 11.5px;
  font-family: var(--aq-ff-mono);
}
.cp-sched-main { color: var(--aq-text); }
.cp-sched-sub { color: var(--aq-text-faint); font-size: 10.5px; }
.cp-cell-hours {
  font-size: 11.5px;
  font-family: var(--aq-ff-mono);
  color: var(--aq-text-dim);
}

/* Targeting */
.cp-cell-targeting { min-width: 0; }
.cp-target-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  font-family: var(--aq-ff-mono);
  color: var(--aq-text-dim);
  white-space: nowrap;
}
.cp-target-pill.is-all { color: var(--aq-accent); }
.cp-target-pill.is-all svg { width: 11px; height: 11px; }
.cp-site-chips {
  display: inline-flex;
  gap: 3px;
}
.cp-site-chip {
  display: inline-grid;
  place-items: center;
  min-width: 26px;
  height: 18px;
  padding: 0 5px;
  border-radius: 4px;
  background: rgba(255,255,255,0.06);
  border: 1px solid var(--aq-line);
  font-family: var(--aq-ff-mono);
  font-size: 9.5px;
  color: var(--aq-text-muted);
  letter-spacing: 0.02em;
  font-weight: 500;
}
.cp-site-chip.is-more {
  background: rgba(255,255,255,0.02);
  color: var(--aq-text-faint);
}

/* Performance cell */
.cp-perf {
  display: flex;
  align-items: center;
  gap: 10px;
}
.cp-perf-stats {
  display: flex;
  gap: 14px;
}
.cp-perf-stats > div {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.cp-perf-num {
  font-family: var(--aq-ff-mono);
  font-variant-numeric: tabular-nums;
  font-size: 11.5px;
  color: var(--aq-text);
  line-height: 1.1;
}
.cp-perf-lbl {
  font-size: 9.5px;
  color: var(--aq-text-faint);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.cp-perf-empty {
  color: var(--aq-text-faint);
  font-size: 11.5px;
  font-style: italic;
}

.cp-list-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  font-size: 11.5px;
  color: var(--aq-text-faint);
}

/* Calendar view */
.cp-cal-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--aq-line);
}
.cp-cal-month {
  font-family: var(--aq-ff-display);
  font-size: 13.5px;
  font-weight: 500;
  color: var(--aq-text);
}
.cp-cal-spacer { flex: 1; }

.cp-cal-grid {
  display: flex;
  flex-direction: column;
  padding: 0 14px 14px;
}
.cp-cal-axis {
  display: grid;
  grid-template-columns: repeat(14, 1fr);
  border-bottom: 1px solid var(--aq-line);
  margin-top: 8px;
}
.cp-cal-day {
  padding: 10px 6px 8px;
  border-right: 1px solid var(--aq-line);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
}
.cp-cal-day:first-child { border-left: 1px solid var(--aq-line); }
.cp-cal-day.is-weekend { background: rgba(255,255,255,0.012); }
.cp-cal-day.is-today { background: var(--aq-accent-soft); }
.cp-cal-day.is-today .cp-cal-num { color: var(--aq-accent); }
.cp-cal-dow {
  font-family: var(--aq-ff-mono);
  font-size: 9.5px;
  color: var(--aq-text-faint);
  letter-spacing: 0.04em;
}
.cp-cal-num {
  font-family: var(--aq-ff-display);
  font-size: 16px;
  color: var(--aq-text);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

.cp-cal-lanes {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 0 0;
  position: relative;
}
.cp-cal-lane {
  position: relative;
  height: 28px;
}
.cp-cal-bar {
  position: absolute;
  inset: 0 auto 0 0;
  height: 28px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  font-size: 12px;
  color: var(--aq-text);
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.08);
  overflow: hidden;
  white-space: nowrap;
  transition: filter var(--aq-d-1) var(--aq-ease);
}
.cp-cal-bar:hover { filter: brightness(1.12); }
.cp-cal-bar::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.35);
  z-index: 0;
}
.cp-cal-bar > * { position: relative; z-index: 1; }
.cp-cal-bar.is-paused {
  background: rgba(255,255,255,0.04) !important;
}
.cp-cal-bar-glyph { font-size: 14px; }
.cp-cal-bar-label {
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
}
.cp-cal-bar-meta {
  color: var(--aq-text-muted);
  font-size: 11px;
}

/* ── Status colours — single source (2026-06-13). Previously defined
   three times in campaigns.jsx with three slightly different values.
   live/review ride the semantic tokens; scheduled keeps its blue
   identity regardless of org accent. ── */
:root{
  --cp-live-bg: var(--aq-success-soft); --cp-live-fg: var(--aq-success);
  --cp-sched-bg: rgba(147,197,253,.14); --cp-sched-fg: #93c5fd;
  --cp-review-bg: var(--aq-warn-soft);  --cp-review-fg: var(--aq-warn);
  --cp-draft-bg: rgba(255,255,255,.08); --cp-draft-fg: var(--aq-text-dim);
  --cp-muted-bg: rgba(255,255,255,.04); --cp-muted-fg: var(--aq-text-faint);
}

/* ── Mobile rows (2026-06-13): the desktop 8-column grid collapsed so
   badly on phones that name and status disappeared entirely and the
   page scrolled sideways. ≤760px: thumb | name+status | menu/age. ── */
@media (max-width: 760px){
  .cp-srow{
    grid-template-columns: 96px minmax(0,1fr) 34px !important;
    grid-template-rows: auto auto;
    gap: 2px 10px !important;
    padding: 10px 10px !important;
  }
  .cp-srow > *:not(.cp-c-thumb):not(.cp-c-name):not(.cp-c-status):not(.cp-c-age):not(.cp-c-menu){
    display: none !important;
  }
  .cp-srow .cp-c-thumb{ grid-row: 1 / span 2; width: 96px !important; height: 54px !important; align-self: start; }
  .cp-srow .cp-c-name{ grid-column: 2; grid-row: 1; }
  .cp-srow .cp-c-status{ grid-column: 2; grid-row: 2; justify-self: start; }
  .cp-srow .cp-c-age{ grid-column: 3; grid-row: 2; width: auto !important; font-size: 10.5px !important; }
  .cp-srow .cp-c-menu{ grid-column: 3; grid-row: 1; }
}

/* ════════════════════════════════════════════════════════════════════
   Marketing rebuild (2026-06-13) — Now / Plan / Create surfaces.
   Naming: cpv- view switcher · cpn- NOW view · cpl- PLAN timeline ·
   cpc- create modal. Motion rides the design-system tokens
   (--aq-ease / --aq-d-1/2) + the shared .aq-dash-stagger entrance.
   ════════════════════════════════════════════════════════════════════ */

/* ── View switcher ── */
.cpv-switch{
  display: inline-flex; align-items: center; gap: 2px;
  padding: 3px; border-radius: 8px;
  background: rgba(255,255,255,0.045);
  border: 1px solid var(--aq-line-soft);
}
.cpv-seg{
  padding: 5px 14px; border: 0; border-radius: 6px;
  background: transparent; color: var(--aq-text-dim);
  font-family: inherit; font-size: 12.5px; font-weight: 500;
  cursor: pointer;
  transition: background var(--aq-d-1) var(--aq-ease), color var(--aq-d-1) var(--aq-ease);
}
.cpv-seg:hover{ color: var(--aq-text); }
.cpv-seg.is-active{
  background: rgba(255,255,255,0.09); color: var(--aq-text);
  box-shadow: 0 1px 2px rgba(0,0,0,0.25);
}

/* ── NOW view ── */
.cpn-wrap{ display: flex; flex-direction: column; gap: 18px; padding-top: 4px; }
.cpn-skeleton{
  border-radius: 10px;
  background: linear-gradient(100deg, rgba(255,255,255,0.04) 40%, rgba(255,255,255,0.075) 50%, rgba(255,255,255,0.04) 60%);
  background-size: 200% 100%;
  animation: cpnShimmer 1.3s linear infinite;
}
@keyframes cpnShimmer{ to{ background-position: -200% 0; } }

.cpn-pulse{
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px;
  font-size: 14px; color: var(--aq-text-dim); letter-spacing: -0.01em;
}
.cpn-pulse strong{ color: var(--aq-text); font-weight: 600; }
.cpn-pulse-dot{
  width: 7px; height: 7px; border-radius: 50%; align-self: center;
  background: var(--aq-success);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--aq-success) 45%, transparent);
  animation: cpnPulse 2.4s var(--aq-ease) infinite;
}
.cpn-pulse-dot.is-idle{ background: var(--aq-text-faint); animation: none; box-shadow: none; }
@keyframes cpnPulse{
  0%{ box-shadow: 0 0 0 0 color-mix(in srgb, var(--aq-success) 45%, transparent); }
  70%{ box-shadow: 0 0 0 7px transparent; }
  100%{ box-shadow: 0 0 0 0 transparent; }
}
.cpn-pulse-sep{ color: var(--aq-text-dim); }
.cpn-pulse-warn{ color: var(--aq-warn); }

.cpn-nudge{
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px; border-radius: 10px;
  background: linear-gradient(135deg, rgba(167,139,250,0.07), rgba(167,139,250,0.02));
  border: 1px solid rgba(167,139,250,0.18);
}
.cpn-nudge-icon{ font-size: 16px; color: #a78bfa; }
.cpn-nudge-copy{ flex: 1; font-size: 13px; color: var(--aq-text-dim); line-height: 1.45; }
.cpn-nudge-copy strong{ color: var(--aq-text); font-weight: 600; }
.cpn-nudge-cta{
  flex-shrink: 0; padding: 7px 14px; border-radius: 7px; border: 0;
  background: rgba(167,139,250,0.16); color: #c4b5fd;
  font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer;
  transition: background var(--aq-d-1) var(--aq-ease), transform var(--aq-d-1) var(--aq-ease);
}
.cpn-nudge-cta:hover{ background: rgba(167,139,250,0.26); }
.cpn-nudge-cta:active{ transform: scale(0.97); }

.cpn-grid{
  display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
}
.cpn-card{
  border-radius: 12px; overflow: hidden; cursor: pointer;
  background: var(--aq-surface);
  border: 1px solid var(--aq-line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
  transition: transform var(--aq-d-2) var(--aq-ease), border-color var(--aq-d-2) var(--aq-ease), box-shadow var(--aq-d-2) var(--aq-ease);
}
.cpn-card:hover{ transform: translateY(-2px); box-shadow: 0 10px 28px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.05); }
.cpn-card.is-selected{ border-color: color-mix(in srgb, var(--aq-accent) 38%, transparent); }
.cpn-card-frame{
  position: relative; aspect-ratio: 16 / 9;
  background: #001a3d; overflow: hidden;
}
.cpn-crown{
  position: absolute; top: 10px; left: 10px; z-index: 3;
  padding: 4px 9px; border-radius: 999px;
  background: rgba(8,10,14,0.72); backdrop-filter: blur(6px);
  color: #fbd38d; font-size: 10.5px; font-weight: 600; letter-spacing: 0.02em;
}
.cpn-live-dot{
  position: absolute; top: 12px; right: 12px; z-index: 3;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--aq-success);
  box-shadow: 0 0 6px color-mix(in srgb, var(--aq-success) 60%, transparent);
}
.cpn-live-dot[data-status="scheduled"]{ background: var(--cp-sched-fg); box-shadow: none; }
.cpn-card-body{ padding: 13px 15px 14px; display: flex; flex-direction: column; gap: 11px; }
.cpn-card-top{ display: flex; align-items: baseline; gap: 10px; }
.cpn-card-name{ font-size: 14.5px; font-weight: 600; color: var(--aq-text); letter-spacing: -0.01em; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cpn-card-when{ font-size: 11.5px; color: var(--aq-text-faint); flex-shrink: 0; }
.cpn-stats{ display: flex; gap: 26px; }
.cpn-stat-v{ font-size: 17px; font-weight: 600; color: var(--aq-text); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.cpn-stat-l{ font-size: 10.5px; color: var(--aq-text-faint); margin-top: 1px; }
.cpn-card-actions{ display: flex; align-items: center; gap: 8px; }
.cpn-boost{
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; border-radius: 7px; border: 0;
  background: var(--aq-success-soft); color: var(--aq-success);
  font-family: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
  transition: background var(--aq-d-1) var(--aq-ease), transform var(--aq-d-1) var(--aq-ease);
}
.cpn-boost:hover{ background: color-mix(in srgb, var(--aq-success) 22%, transparent); }
.cpn-boost:active{ transform: scale(0.97); }
.cpn-open{
  margin-left: auto; padding: 6px 10px; border-radius: 7px;
  background: transparent; border: 1px solid var(--aq-line);
  color: var(--aq-text-dim); font-family: inherit; font-size: 12px; cursor: pointer;
  transition: color var(--aq-d-1) var(--aq-ease), border-color var(--aq-d-1) var(--aq-ease);
}
.cpn-open:hover{ color: var(--aq-text); border-color: rgba(255,255,255,0.18); }

.cpn-section-label{
  font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--aq-text-faint);
  margin-bottom: 8px;
}
.cpn-nextup{ margin-top: 2px; }
.cpn-next-row{
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 9px 12px; border-radius: 8px; border: 0; text-align: left;
  background: transparent; font-family: inherit; cursor: pointer;
  transition: background var(--aq-d-1) var(--aq-ease);
}
.cpn-next-row:hover{ background: rgba(255,255,255,0.04); }
.cpn-next-dot{ width: 6px; height: 6px; border-radius: 50%; background: var(--cp-sched-fg); flex-shrink: 0; }
.cpn-next-name{ font-size: 13px; color: var(--aq-text); font-weight: 500; }
.cpn-next-when{ margin-left: auto; font-size: 11.5px; color: var(--aq-text-faint); }

.cpn-empty{
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 48px 20px 42px; text-align: center;
}
.cpn-empty-art{ margin-bottom: 6px; }
.cpn-empty-screen{
  width: 120px; height: 68px; border-radius: 7px;
  background: linear-gradient(135deg, #06283d, #001a3d);
  border: 3px solid #1c1f26; box-shadow: 0 8px 22px rgba(0,0,0,0.4);
}
.cpn-empty-title{ font-size: 15.5px; font-weight: 600; color: var(--aq-text); letter-spacing: -0.01em; }
.cpn-empty-sub{ font-size: 13px; color: var(--aq-text-dim); max-width: 440px; line-height: 1.5; }
.cpn-empty-actions{ display: flex; gap: 10px; margin-top: 8px; }

.cpn-fleet{
  margin-top: 6px; padding: 14px 16px; border-radius: 10px;
  background: rgba(255,255,255,0.02); border: 1px solid var(--aq-line-soft);
}
.cpn-fleet-head{ display: flex; align-items: baseline; gap: 8px; margin-bottom: 12px; }
.cpn-fleet-title{ font-size: 10.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--aq-text-faint); }
.cpn-fleet-sub{ font-size: 11.5px; color: var(--aq-text-faint); }
.cpn-fleet-row{ display: flex; flex-wrap: wrap; gap: 14px; }
.cpn-bezel{ display: flex; flex-direction: column; align-items: center; gap: 6px; }
.cpn-bezel-screen{
  width: 86px; height: 50px; border-radius: 5px;
  background: #0b0e13; border: 2.5px solid #1c1f26;
  box-shadow: 0 4px 10px rgba(0,0,0,0.35);
  transition: background var(--aq-d-2) var(--aq-ease), border-color var(--aq-d-2) var(--aq-ease), box-shadow var(--aq-d-2) var(--aq-ease);
}
.cpn-bezel.is-lit .cpn-bezel-screen{
  background: linear-gradient(135deg, color-mix(in srgb, var(--aq-success) 26%, #06283d), #001a3d);
  border-color: #262a33;
  box-shadow: 0 4px 14px rgba(0,0,0,0.35), 0 0 14px color-mix(in srgb, var(--aq-success) 14%, transparent);
}
.cpn-bezel.is-offline{ opacity: 0.45; }
.cpn-bezel-name{ font-size: 10.5px; color: var(--aq-text-faint); max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── PLAN timeline ── */
.cpl-wrap{ display: flex; flex-direction: column; gap: 18px; padding-top: 4px; }
.cpl-head{ display: flex; align-items: baseline; gap: 14px; }
.cpl-title{ font-size: 14px; font-weight: 600; color: var(--aq-text); letter-spacing: -0.01em; }
.cpl-legend{ margin-left: auto; display: flex; gap: 14px; font-size: 11px; color: var(--aq-text-faint); }
.cpl-legend > span{ display: inline-flex; align-items: center; gap: 6px; }
.cpl-key{ width: 14px; height: 7px; border-radius: 3px; display: inline-block; }
.cpl-key-live{ background: color-mix(in srgb, var(--aq-success) 55%, transparent); }
.cpl-key-sched{ background: color-mix(in srgb, #93c5fd 45%, transparent); }
.cpl-key-gap{ border: 1px dashed color-mix(in srgb, var(--aq-warn) 55%, transparent); background: transparent; }

.cpl-grid{
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--cpl-days, 28), minmax(0, 1fr));
  grid-auto-rows: 40px;
  gap: 6px 0;
  padding: 12px 14px 16px;
  border-radius: 12px;
  background: var(--aq-surface);
  border: 1px solid var(--aq-line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
  overflow: hidden;
}
.cpl-dayhead{
  grid-row: 1; align-self: end; text-align: center;
  display: flex; flex-direction: column; gap: 1px; padding-bottom: 8px;
}
.cpl-dow{ font-size: 9px; letter-spacing: 0.04em; color: var(--aq-text-faint); }
.cpl-dom{ font-size: 11px; color: var(--aq-text-dim); font-variant-numeric: tabular-nums; }
.cpl-dayhead.is-wknd .cpl-dom{ color: var(--aq-text-faint); }
.cpl-dayhead.is-today .cpl-dom{
  color: var(--aq-text); font-weight: 700;
}
.cpl-wknd-col{
  pointer-events: none;
  background: rgba(255,255,255,0.018);
}
.cpl-today-rule{
  pointer-events: none; justify-self: center;
  width: 0; border-left: 1px dashed color-mix(in srgb, var(--aq-accent) 45%, transparent);
}
.cpl-bar{
  position: relative; z-index: 2;
  display: flex; align-items: center; gap: 8px;
  margin: 4px 2px; padding: 0 12px;
  border-radius: 7px; border: 0; text-align: left;
  font-family: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
  overflow: hidden; white-space: nowrap;
  transition: filter var(--aq-d-1) var(--aq-ease), transform var(--aq-d-1) var(--aq-ease);
}
.cpl-bar:hover{ filter: brightness(1.18); }
.cpl-bar:active{ transform: scale(0.99); }
.cpl-bar.is-live{
  background: linear-gradient(180deg, color-mix(in srgb, var(--aq-success) 26%, #10231c), color-mix(in srgb, var(--aq-success) 16%, #0c1a15));
  color: color-mix(in srgb, var(--aq-success) 80%, #fff);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.07);
}
.cpl-bar.is-sched{
  background: linear-gradient(180deg, rgba(147,197,253,0.20), rgba(147,197,253,0.11));
  color: #b6d6fd;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}
.cpl-bar.is-ghost{
  background: rgba(255,255,255,0.05); color: var(--aq-text-dim);
  border: 1px dashed rgba(255,255,255,0.14);
}
.cpl-bar.clip-l{ border-top-left-radius: 0; border-bottom-left-radius: 0; }
.cpl-bar.clip-r{ border-top-right-radius: 0; border-bottom-right-radius: 0; }
.cpl-bar-name{ overflow: hidden; text-overflow: ellipsis; }
.cpl-bar-tag{ font-size: 10px; font-weight: 500; opacity: 0.65; flex-shrink: 0; }
.cpl-gap{
  z-index: 1; margin: 4px 2px;
  display: flex; align-items: center; justify-content: center; gap: 12px;
  border-radius: 7px;
  border: 1px dashed color-mix(in srgb, var(--aq-warn) 40%, transparent);
  background: color-mix(in srgb, var(--aq-warn) 4%, transparent);
}
.cpl-gap-label{ font-size: 11.5px; color: var(--aq-warn); opacity: 0.85; }
.cpl-gap-cta{
  padding: 4px 11px; border-radius: 6px; border: 0;
  background: var(--aq-warn-soft); color: var(--aq-warn);
  font-family: inherit; font-size: 11.5px; font-weight: 600; cursor: pointer;
  transition: background var(--aq-d-1) var(--aq-ease);
}
.cpl-gap-cta:hover{ background: color-mix(in srgb, var(--aq-warn) 24%, transparent); }
.cpl-shelf{ margin-top: 2px; }
.cpl-shelf-row{ display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cpl-chip{
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: 8px;
  background: rgba(255,255,255,0.04); border: 1px solid var(--aq-line);
  color: var(--aq-text-dim); font-family: inherit; font-size: 12px; cursor: pointer;
  transition: background var(--aq-d-1) var(--aq-ease), color var(--aq-d-1) var(--aq-ease);
}
.cpl-chip:hover{ background: rgba(255,255,255,0.07); color: var(--aq-text); }
.cpl-chip-plus{ font-size: 10.5px; color: var(--aq-text-faint); }
.cpl-more{ font-size: 11.5px; color: var(--aq-text-faint); }

/* ── CREATE modal ── */
.cpc-backdrop{
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(4,6,10,0.62); backdrop-filter: blur(8px);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 9vh 20px 40px; overflow-y: auto;
  animation: cpcFade var(--aq-d-2) var(--aq-ease);
}
@keyframes cpcFade{ from{ opacity: 0; } }
.cpc-modal{
  position: relative; width: 640px; max-width: 100%;
  border-radius: 14px; padding: 24px 26px 26px;
  background: var(--aq-raised, #14171d);
  border: 1px solid rgba(255,255,255,0.09);
  box-shadow: 0 24px 80px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.05);
  animation: cpcRise 260ms var(--aq-ease) backwards;
}
@keyframes cpcRise{ from{ opacity: 0; transform: translateY(10px) scale(0.985); } }
.cpc-x{
  position: absolute; top: 12px; right: 14px;
  width: 26px; height: 26px; border-radius: 6px; border: 0;
  background: transparent; color: var(--aq-text-faint);
  font-size: 16px; cursor: pointer; line-height: 1;
  transition: background var(--aq-d-1) var(--aq-ease), color var(--aq-d-1) var(--aq-ease);
}
.cpc-x:hover{ background: rgba(255,255,255,0.06); color: var(--aq-text); }
.cpc-title{ font-size: 17px; font-weight: 650; color: var(--aq-text); letter-spacing: -0.015em; }
.cpc-sub{ font-size: 12.5px; color: var(--aq-text-dim); margin-top: 3px; }
.cpc-ai-row{
  display: flex; align-items: center; gap: 10px;
  margin-top: 18px; padding: 6px 6px 6px 14px;
  border-radius: 10px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
  transition: border-color var(--aq-d-2) var(--aq-ease), box-shadow var(--aq-d-2) var(--aq-ease);
}
.cpc-ai-row:focus-within{
  border-color: rgba(167,139,250,0.45);
  box-shadow: 0 0 0 3px rgba(167,139,250,0.10);
}
.cpc-ai-spark{ color: #a78bfa; font-size: 13px; flex-shrink: 0; }
.cpc-ai-input{
  flex: 1; border: 0; outline: none; background: transparent;
  color: var(--aq-text); font-family: inherit; font-size: 13px; min-width: 0;
}
.cpc-ai-input::placeholder{ color: var(--aq-text-faint); }
.cpc-ai-go{
  flex-shrink: 0; padding: 8px 16px; border-radius: 7px; border: 0;
  background: var(--aq-text); color: var(--aq-page, #0a0d12);
  font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer;
  transition: opacity var(--aq-d-1) var(--aq-ease), transform var(--aq-d-1) var(--aq-ease);
}
.cpc-ai-go:hover{ opacity: 0.88; }
.cpc-ai-go:active{ transform: scale(0.97); }
.cpc-ai-go:disabled{ opacity: 0.55; cursor: default; }
.cpc-ai-hint{ font-size: 11.5px; color: var(--aq-text-faint); line-height: 1.5; margin-top: 9px; }
.cpc-ai-hint strong{ color: var(--aq-text-dim); font-weight: 600; }
.cpc-error{
  margin-top: 12px; padding: 9px 12px; border-radius: 8px;
  background: var(--aq-danger-soft); border: 1px solid var(--aq-danger-line, transparent);
  color: var(--aq-danger); font-size: 12px;
}
.cpc-divider{
  display: flex; align-items: center; gap: 12px;
  margin: 20px 0 14px;
  font-size: 10px; font-weight: 600; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--aq-text-faint);
}
.cpc-divider::before, .cpc-divider::after{
  content: ''; flex: 1; height: 1px; background: var(--aq-line-soft);
}
.cpc-templates{
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px;
}
.cpc-template{
  border: 1px solid var(--aq-line); border-radius: 10px; padding: 0 0 9px;
  background: rgba(255,255,255,0.02); font-family: inherit; text-align: left;
  cursor: pointer; overflow: hidden;
  transition: transform var(--aq-d-2) var(--aq-ease), border-color var(--aq-d-2) var(--aq-ease), box-shadow var(--aq-d-2) var(--aq-ease);
}
.cpc-template:hover{ transform: translateY(-2px); border-color: rgba(255,255,255,0.16); box-shadow: 0 8px 20px rgba(0,0,0,0.3); }
.cpc-template:active{ transform: translateY(0); }
.cpc-template:disabled{ opacity: 0.6; cursor: default; transform: none; }
.cpc-template-art{
  height: 56px; position: relative; margin-bottom: 8px;
  display: flex; align-items: flex-end; padding: 6px;
}
.cpc-template-chip{
  padding: 2px 7px; border-radius: 4px;
  background: rgba(8,10,14,0.6); backdrop-filter: blur(4px);
  color: #fff; font-size: 10px; font-weight: 700;
}
.cpc-template-name{ font-size: 12px; font-weight: 600; color: var(--aq-text); padding: 0 9px; }
.cpc-template-sub{ font-size: 10px; color: var(--aq-text-faint); padding: 1px 9px 0; }
.cpc-winner{
  display: flex; align-items: center; gap: 14px;
  padding: 10px; border-radius: 10px;
  background: rgba(255,255,255,0.025); border: 1px solid var(--aq-line);
}
.cpc-winner-art{
  position: relative; width: 118px; aspect-ratio: 16/9;
  border-radius: 6px; overflow: hidden; flex-shrink: 0;
  background: #001a3d;
}
.cpc-winner-meta{ flex: 1; min-width: 0; }
.cpc-winner-name{ font-size: 13px; font-weight: 600; color: var(--aq-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cpc-winner-stat{ font-size: 11.5px; color: var(--aq-success); margin-top: 3px; }
.cpc-winner-go{
  flex-shrink: 0; padding: 8px 13px; border-radius: 7px;
  border: 1px solid var(--aq-line); background: rgba(255,255,255,0.05);
  color: var(--aq-text); font-family: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
  transition: background var(--aq-d-1) var(--aq-ease);
}
.cpc-winner-go:hover{ background: rgba(255,255,255,0.09); }
.cpc-winner-go:disabled{ opacity: 0.6; cursor: default; }

/* Mobile: stack the create-modal templates 2-up; NOW cards single col. */
@media (max-width: 760px){
  .cpc-templates{ grid-template-columns: repeat(2, 1fr); }
  .cpn-grid{ grid-template-columns: 1fr; }
  .cpv-switch{ order: 3; }
  .cpl-grid{ overflow-x: auto; }
  .cpn-nudge{ flex-wrap: wrap; }
  .cpn-nudge-copy{ flex-basis: calc(100% - 30px); }
  .cpn-nudge-cta{ margin-left: 30px; }
}

/* Slim gap marker — gaps under 3 days are too narrow for the full
   label + CTA; a quiet sparkle that opens the create modal instead. */
.cpl-gap-slim{
  font-family: inherit; font-size: 12px; color: var(--aq-warn);
  cursor: pointer; padding: 0;
  transition: background var(--aq-d-1) var(--aq-ease);
}
.cpl-gap-slim:hover{ background: color-mix(in srgb, var(--aq-warn) 10%, transparent); }

/* ════════════════════════════════════════════════════════════════════
   Library rebuild (2026-06-13) — search-first toolbar, lifecycle
   ribbon, grid mode, past-campaigns fold, maintenance nudge.
   Prefix: cplib-. Motion rides the design-system tokens.
   ════════════════════════════════════════════════════════════════════ */

/* search-first toolbar */
.cplib-toolbar{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.cplib-search{
  flex:1; display:flex; align-items:center; gap:10px; height:38px; padding:0 14px;
  background:var(--aq-surface-2); border:1px solid var(--aq-line); border-radius:9px;
  transition:border-color var(--aq-d-2) var(--aq-ease), box-shadow var(--aq-d-2) var(--aq-ease);
}
.cplib-search:focus-within{ border-color:rgba(255,255,255,.18); box-shadow:0 0 0 3px rgba(255,255,255,.04); }
.cplib-search svg{ opacity:.5; flex-shrink:0; }
.cplib-search input{ flex:1; min-width:0; background:transparent; border:0; outline:0; color:var(--aq-text); font:13px inherit; font-family:inherit; }
.cplib-search input::placeholder{ color:var(--aq-text-faint); }
.cplib-search-x{ border:0; background:transparent; color:var(--aq-text-faint); font-size:16px; line-height:1; cursor:pointer; padding:0 2px; }
.cplib-search-x:hover{ color:var(--aq-text); }
.cplib-modes{
  display:flex; align-items:center; gap:2px; height:38px; padding:2px;
  background:var(--aq-surface-2); border:1px solid var(--aq-line); border-radius:8px;
}
.cplib-modes button{
  width:34px; height:30px; display:grid; place-items:center; border:0; border-radius:6px;
  background:transparent; color:var(--aq-text-dim); cursor:pointer;
  transition:background var(--aq-d-1) var(--aq-ease), color var(--aq-d-1) var(--aq-ease);
}
.cplib-modes button:hover{ color:var(--aq-text); }
.cplib-modes button.on{ background:rgba(255,255,255,.09); color:var(--aq-text); }

/* lifecycle ribbon — borderless, like the dashboard stat strip. No box,
   no vertical dividers; selection reads as a quiet rounded fill. */
.cplib-ribbon{
  display:flex; gap:4px; margin-bottom:22px;
}
.cplib-lc{
  flex:1; padding:10px 14px; border:0; border-radius:9px;
  background:transparent; text-align:left; cursor:pointer; position:relative; font-family:inherit;
  transition:background var(--aq-d-1) var(--aq-ease);
}
.cplib-lc:hover{ background:rgba(255,255,255,.03); }
.cplib-lc.on{ background:rgba(255,255,255,.05); }
.cplib-lc-v{ display:flex; align-items:center; gap:8px; font:600 21px var(--aq-ff-display,inherit); color:var(--aq-text); letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.cplib-lc-dot{ width:7px; height:7px; border-radius:50%; background:var(--lc-c,var(--aq-text-faint)); flex-shrink:0; }
.cplib-lc-k{ display:block; font-size:11px; color:var(--aq-text-faint); margin-top:2px; }

/* tag filter row */
.cplib-tagrow{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:16px; }
.cplib-tag{
  display:inline-flex; align-items:center; gap:6px; height:26px; padding:0 11px; border-radius:99px;
  background:transparent; border:1px solid var(--aq-line); color:var(--aq-text-dim);
  font:500 11.5px inherit; font-family:inherit; cursor:pointer;
}
.cplib-tag:hover{ color:var(--aq-text); }
.cplib-tag.on{ color:var(--aq-text); border-color:transparent; }
.cplib-tag .dot{ width:6px; height:6px; border-radius:50%; }
.cplib-clear{
  margin-left:auto; padding:4px 11px; border-radius:6px; background:transparent;
  border:1px solid var(--aq-line); color:var(--aq-text-faint); font:11px inherit; font-family:inherit; cursor:pointer;
}
.cplib-clear:hover{ color:var(--aq-text); }

/* maintenance nudge */
.cplib-nudge{
  display:flex; align-items:center; gap:12px; margin-bottom:18px; padding:11px 15px; border-radius:10px;
  background:linear-gradient(135deg, rgba(167,139,250,.07), rgba(167,139,250,.02));
  border:1px solid rgba(167,139,250,.20);
}
.cplib-nudge-i{ color:#a78bfa; font-size:14px; flex-shrink:0; }
.cplib-nudge-copy{ flex:1; font-size:12.5px; color:var(--aq-text-dim); line-height:1.45; }
.cplib-nudge-copy strong{ color:var(--aq-text); font-weight:600; }
.cplib-nudge-act{ display:flex; gap:8px; flex-shrink:0; }
.cplib-nudge-btn{
  height:27px; padding:0 12px; border-radius:7px; cursor:pointer; font:600 11.5px inherit; font-family:inherit;
  background:rgba(167,139,250,.16); border:1px solid rgba(167,139,250,.30); color:#c4b5fd;
  transition:background var(--aq-d-1) var(--aq-ease);
}
.cplib-nudge-btn:hover{ background:rgba(167,139,250,.26); }
.cplib-nudge-btn.ghost{ background:transparent; border-color:var(--aq-line); color:var(--aq-text-dim); font-weight:500; }
.cplib-nudge-btn.ghost:hover{ color:var(--aq-text); }

/* grid mode */
.cplib-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(214px,1fr)); gap:14px;
  margin:2px 0 8px;
}
.cplib-card{
  position:relative; background:var(--aq-surface); border:1px solid var(--aq-line);
  border-radius:12px; box-shadow:inset 0 1px 0 rgba(255,255,255,.04); overflow:hidden; cursor:pointer;
  transition:transform var(--aq-d-2) var(--aq-ease), border-color var(--aq-d-2) var(--aq-ease), box-shadow var(--aq-d-2) var(--aq-ease);
}
.cplib-card:hover{ transform:translateY(-2px); border-color:var(--aq-line-strong,rgba(255,255,255,.12)); box-shadow:0 10px 26px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.05); }
.cplib-card.is-sel{ border-color:rgba(255,255,255,.4); }
.cplib-card-frame{ position:relative; aspect-ratio:16/9; background:#001a3d; overflow:hidden; }
.cplib-card-check{
  position:absolute; top:9px; right:9px; width:19px; height:19px; border-radius:5px;
  border:1.5px solid rgba(255,255,255,.5); background:rgba(0,0,0,.32); color:var(--aq-page,#0a0d12);
  font-size:12px; line-height:1; display:grid; place-items:center; cursor:pointer; opacity:0;
  transition:opacity var(--aq-d-1) var(--aq-ease);
}
.cplib-card:hover .cplib-card-check{ opacity:1; }
.cplib-card.is-sel .cplib-card-check{ opacity:1; background:var(--aq-text); border-color:var(--aq-text); }
.cplib-card-body{ padding:10px 12px 12px; }
.cplib-card-name{ font:600 13px var(--aq-ff-display,inherit); color:var(--aq-text); letter-spacing:-.005em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cplib-card-meta{ display:flex; align-items:center; gap:8px; margin-top:7px; }
.cplib-card-when{ margin-left:auto; font-size:10.5px; color:var(--aq-text-faint); white-space:nowrap; }
.cplib-pill{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:600; letter-spacing:.02em; padding:3px 10px; border-radius:99px; }
.cplib-pill::before{ content:''; width:5px; height:5px; border-radius:50%; background:currentColor; }
.cplib-pill.live{ color:var(--cp-live-fg); background:var(--cp-live-bg); }
.cplib-pill.sched{ color:var(--cp-sched-fg); background:var(--cp-sched-bg); }
.cplib-pill.draft{ color:var(--cp-draft-fg); background:var(--cp-draft-bg); }
.cplib-pill.paused{ color:var(--aq-warn); background:var(--aq-warn-soft); }
.cplib-pill.review{ color:var(--cp-review-fg); background:var(--cp-review-bg); }
.cplib-pill.ended{ color:var(--cp-muted-fg); background:var(--cp-muted-bg); }

/* past-campaigns fold */
.cplib-fold{ margin-top:14px; border-top:1px solid var(--aq-line-soft); padding-top:16px; }
.cplib-fold-head{
  display:flex; align-items:center; gap:9px; width:100%; text-align:left;
  background:transparent; border:0; color:var(--aq-text-dim); font:13px inherit; font-family:inherit; cursor:pointer;
}
.cplib-fold-head strong{ color:var(--aq-text-dim); font-weight:600; }
.cplib-fold-head:hover strong{ color:var(--aq-text); }
.cplib-fold-tw{ font-size:10px; color:var(--aq-text-faint); transition:transform var(--aq-d-2) var(--aq-ease); display:inline-flex; }
.cplib-fold-ct{ color:var(--aq-text-faint); font-size:11.5px; }

@media (max-width:760px){
  .cplib-grid{ grid-template-columns:1fr 1fr; }
  .cplib-ribbon{ flex-wrap:wrap; }
  .cplib-lc{ flex:1 1 33%; }
}

/* ── Library List mode — the dense management table (2026-06-13).
   Borderless, flush on the page (dashboard grammar): no container box,
   rows separated by the soft hairline only, header by a single rule. ── */
.cplib-tbl{
  /* Page is capped at 1400 centred (house standard), so the table just
     fills its container — campaign column flexes, data columns sit at
     the right edge. No trailing-spacer hack needed. */
  --cplib-cols: 34px 72px minmax(0,1fr) 116px 176px 132px 86px 32px;
}
.cplib-thead{
  display:grid; grid-template-columns:var(--cplib-cols); gap:16px; align-items:center;
  padding:9px 10px; border-bottom:1px solid var(--aq-line-soft);
  font-size:10.5px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--aq-text-faint);
}
.cplib-thead .r{ text-align:right; }
.cplib-row{
  display:grid; grid-template-columns:var(--cplib-cols); gap:16px; align-items:center;
  padding:11px 10px; border-bottom:1px solid var(--aq-line-soft); cursor:pointer;
  border-radius:8px;
  transition:background 80ms ease;
}
.cplib-row:last-child{ border-bottom:0; }
.cplib-row:hover{ background:rgba(255,255,255,.03); }
.cplib-row.is-sel{ background:color-mix(in srgb, var(--aq-accent) 12%, transparent); }
.cplib-row-check{
  width:17px; height:17px; border-radius:5px; border:1.5px solid var(--aq-line-strong,rgba(255,255,255,.2));
  background:rgba(255,255,255,.02); color:var(--aq-page,#0a0d12); font-size:11px; line-height:1;
  display:grid; place-items:center; cursor:pointer; opacity:0; transition:opacity var(--aq-d-1) var(--aq-ease);
}
.cplib-row-check.show{ opacity:1; }
.cplib-row.is-sel .cplib-row-check{ opacity:1; background:var(--aq-text); border-color:var(--aq-text); }
.cplib-row-thumb{ width:72px; height:41px; border-radius:5px; overflow:hidden; position:relative; background:#001a3d; border:1px solid var(--aq-line-soft); }
.cplib-row-name{ min-width:0; }
.cplib-row-title{ display:flex; align-items:center; gap:7px; min-width:0; }
.cplib-row-star{ color:oklch(.82 .13 90); font-size:11px; flex-shrink:0; }
.cplib-row-t{ font:600 14px var(--aq-ff-display,inherit); color:var(--aq-text); letter-spacing:-.005em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cplib-row-tag{ display:inline-flex; align-items:center; gap:4px; flex-shrink:0; font-size:9.5px; color:var(--aq-text-dim); background:rgba(255,255,255,.05); border-radius:4px; padding:1px 6px; white-space:nowrap; }
.cplib-row-tag .d{ width:5px; height:5px; border-radius:50%; }
.cplib-row-sub{ font-size:12px; color:var(--aq-text-faint); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cplib-win{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.cplib-win-lab{ font-size:11.5px; color:var(--aq-text-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cplib-win-track{ height:4px; border-radius:2px; background:rgba(255,255,255,.06); overflow:hidden; }
.cplib-win-fill{ height:100%; border-radius:2px; }
.cplib-row-perf{ text-align:right; display:flex; align-items:baseline; justify-content:flex-end; gap:5px; font-variant-numeric:tabular-nums; }
.cplib-row-perf .v{ font:600 13.5px var(--aq-ff-display,inherit); color:var(--aq-text); }
.cplib-row-perf .d{ font-size:11px; font-weight:600; }
.cplib-row-perf .muted{ color:var(--aq-text-faint); }
.cplib-row-age{ text-align:right; font-size:12px; color:var(--aq-text-faint); font-variant-numeric:tabular-nums; white-space:nowrap; }
.cplib-row-menu{ position:relative; width:30px; text-align:right; }
.cplib-row-menu-btn{ width:24px; height:22px; border:0; border-radius:4px; background:transparent; color:var(--aq-text-faint); cursor:pointer; opacity:0; display:inline-flex; align-items:center; justify-content:center; transition:opacity var(--aq-d-1) var(--aq-ease), background var(--aq-d-1) var(--aq-ease); }
.cplib-row-menu-btn.show{ opacity:1; }
.cplib-row-menu-btn:hover{ background:rgba(255,255,255,.08); color:var(--aq-text); }
.cplib-menu{ position:absolute; right:0; top:26px; z-index:50; background:var(--aq-surface); border:1px solid var(--aq-line); border-radius:7px; box-shadow:0 10px 28px rgba(0,0,0,.45); min-width:180px; padding:4px; }

/* slim collection divider — both modes. Flush typographic header: no
   box, no fill; a hairline above each (except the first) does the
   separating, like sections on the dashboard. */
.cplib-div{
  display:flex; align-items:center; gap:9px; padding:14px 10px 9px; cursor:pointer; user-select:none;
  border-top:1px solid var(--aq-line-soft); margin-top:6px;
}
.cplib-div:first-child{ border-top:0; margin-top:0; padding-top:4px; }
.cplib-tbl .cplib-thead + .cplib-div{ border-top:0; margin-top:0; }
.cplib-sections .cplib-div{ margin:18px 0 4px; }
.cplib-sections .cplib-div:first-child{ margin-top:0; }
.cplib-div-tw{ font-size:9px; color:var(--aq-text-faint); transition:transform var(--aq-d-2) var(--aq-ease); display:inline-flex; }
.cplib-div-dot{ width:9px; height:9px; border-radius:50%; flex-shrink:0; }
.cplib-div-name{ font:600 13.5px var(--aq-ff-display,inherit); color:var(--aq-text); letter-spacing:-.005em; }
.cplib-div-ct{ font-size:12px; color:var(--aq-text-faint); }
.cplib-div-perf{ font-size:11px; color:var(--aq-text-dim); font-variant-numeric:tabular-nums; }
.cplib-div-open{ margin-left:10px; background:transparent; border:0; color:var(--aq-text-faint); font:11px inherit; font-family:inherit; cursor:pointer; }
.cplib-div-open:hover{ color:var(--aq-text); }

@media (max-width:860px){
  /* Keep the 8-column grid intact but let the table scroll sideways
     rather than squishing Window/Impressions into nothing. */
  .cplib-tbl{ overflow-x:auto; }
  .cplib-thead, .cplib-row{ min-width:720px; }
}

/* Library top stack — collapse the 40px section-gap that aq-content-inner
   puts between every child. Toolbar / ribbon / chips / nudge / table are
   one control cluster, not separate sections, so they sit tight (2026-06-14). */
.cplib-stack{ display:flex; flex-direction:column; gap:14px; }
.cplib-stack > *{ margin-top:0; margin-bottom:0; }