:root {
  --ink: #2c2438;
  --muted: #7d7183;
  --line: #efdee4;
  --panel: #fffdfd;
  --canvas: #fff8f6;
  --soft: #fff0f2;
  --violet: #e45d78;
  --violet-dark: #c94162;
  --violet-soft: #ffe7ed;
  --green: #178b7d;
  --green-soft: #e1f7f1;
  --red: #d94d5f;
  --red-soft: #ffe8eb;
  --amber: #a86f13;
  --amber-soft: #fff1cf;
  --lilac: #8f78d7;
  --jade: #47a99a;
  --peach: #ff967d;
  --shadow: 0 16px 38px rgba(101, 54, 76, 0.08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 88% 5%, rgba(255,185,168,.22), transparent 24%),
    radial-gradient(circle at 65% 38%, rgba(156,128,220,.10), transparent 26%),
    var(--canvas);
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 14px;
}
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 244px 1fr; }
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 10;
  width: 244px;
  display: flex;
  flex-direction: column;
  padding: 22px 16px 16px;
  color: #f8f4ff;
  background:
    radial-gradient(circle at 12% 0%, rgba(247, 108, 134, .18), transparent 28%),
    linear-gradient(180deg, #1d1930 0%, #241b38 56%, #211829 100%);
  border-right: 1px solid rgba(255,255,255,.12);
  box-shadow: inset -1px 0 0 rgba(255,255,255,.035);
}
.brand { display: flex; align-items: center; gap: 11px; padding: 0 8px 22px; }
.brand-mark {
  width: 36px; height: 36px; padding: 8px; border-radius: 11px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 4px;
  background: linear-gradient(145deg, #ff947e, #db5578 52%, #8f78d7);
  box-shadow: 0 8px 18px rgba(218, 78, 113, .24);
}
.brand-mark i { display: block; border-radius: 2px; background: white; opacity: .96; }
.brand strong, .brand small { display: block; }
.brand strong { color: #fffaff; font-family: "Be Vietnam Pro"; font-size: 15px; }
.brand small { margin-top: 2px; color: #b7adc8; font-size:10px; letter-spacing: .12em; text-transform: uppercase; }
.workspace {
  display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 9px;
  padding: 10px; margin-bottom: 20px; border: 1px solid rgba(255,255,255,.14); border-radius: 13px;
  background: linear-gradient(135deg, rgba(255,255,255,.11), rgba(255,255,255,.045));
}
.avatar, .user-avatar {
  display: grid; place-items: center; border-radius: 9px; color: #fff;
  background: linear-gradient(145deg, #5a3a58, #8f5f83); font-weight: 700;
}
.avatar { width: 34px; height: 34px; font-size: 11px; }
.workspace strong, .workspace small { display: block; }
.workspace strong { color: #fffaff; font-size: 12px; }
.workspace small { margin-top: 2px; color: #b7adc8; font-size: 10px; }
.chevron { color: #b7adc8; }
.nav-label { margin: 19px 12px 8px; color: #a89eb8; font-size:10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.nav-item {
  display: flex; align-items: center; gap: 11px; height: 42px; padding: 0 11px;
  margin: 2px 0; color: #cbc3d7; border-radius: 10px; font-weight: 500;
}
.nav-item:hover { color: #fffaff; background: rgba(255,255,255,.09); }
.nav-item.active {
  color: #fffaff;
  background: linear-gradient(135deg, rgba(239,95,121,.92), rgba(139,102,215,.92));
  box-shadow: 0 8px 20px rgba(7, 4, 20, .22);
  font-weight: 700;
}
/* Campaign center keeps a soft highlight while a platform workspace is open. */
.nav-item.active-parent:not(.active) { color: var(--violet-dark); font-weight: 600; }
.nav-item.nav-sub { height: 36px; margin-left: 15px; padding-left: 9px; border-left: 2px solid #ece9f6; font-size: 12px; }
.nav-item.nav-sub.active { border-left-color: var(--violet-dark); }
.platform-nav-icon { width: 19px; border-radius: 6px; color: #fff; font-size:10px; font-weight: 800; line-height: 19px; }
.platform-nav-icon.meta { background: #5e58e3; }
.platform-nav-icon.google { background: #269a6d; }
.platform-nav-icon.tiktok { background: #242333; }
.nav-icon { width: 22px; font-size: 17px; text-align: center; }
.nav-count { margin-left: auto; min-width: 21px; padding: 2px 6px; border-radius: 10px; color: #fff; background: var(--red); font-size: 10px; text-align: center; }
.section-tabs {
  display: inline-flex; align-items: center; gap: 4px; margin: -5px 0 18px; padding: 4px;
  border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.72);
}
.section-tabs button {
  height: 32px; padding: 0 12px; border: 0; border-radius: 8px; color: var(--muted); background: transparent;
  font-size: 10px; font-weight: 700;
}
.section-tabs button:hover { color: var(--ink); background: #fff3f5; }
.section-tabs button.active { color: var(--violet-dark); background: var(--violet-soft); box-shadow: 0 2px 7px rgba(153,66,92,.08); }
.section-tabs b { display: inline-grid; place-items: center; min-width: 16px; height: 16px; margin-left: 3px; border-radius: 8px; color: #fff; background: var(--red); font-size:10px; }
.ads-manager-nav-icon { color: #4b58b9; background: #eaedff; border-radius: 7px; font-size:10px; font-weight: 800; line-height: 22px; }
.optimization-nav-icon { color: #8b4c1f; background: #fff0de; border-radius: 7px; font-size:10px; font-weight: 800; line-height: 22px; }
.sidebar nav { min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.28) transparent; }
.sidebar-footer {
  margin-top: auto; display: grid; grid-template-columns: 10px 1fr; gap: 9px; align-items: start;
  padding: 13px 11px; border: 1px solid rgba(255,255,255,.10); border-radius: 11px;
  background: rgba(255,255,255,.075);
}
.sidebar-footer strong, .sidebar-footer small { display: block; }
.sidebar-footer strong { color: #fffaff; font-size: 11px; }
.sidebar-footer small { margin-top: 3px; color: #b7adc8; font-size:10px; line-height: 1.35; }
.sync-dot { width: 8px; height: 8px; margin-top: 2px; border-radius: 50%; background: #f2b449; box-shadow: 0 0 0 3px rgba(242,180,73,.18); }

main { grid-column: 2; min-width: 0; }
.topbar {
  position: sticky; top: 0; z-index: 8; height: 64px; padding: 0 32px;
  display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line);
  background: rgba(255,251,250,.90); backdrop-filter: blur(16px);
}
.breadcrumb { display: flex; gap: 10px; color: var(--muted); font-size: 12px; }
.breadcrumb strong { color: var(--ink); }
.top-actions { display: flex; align-items: center; gap: 9px; }
.icon-button, .mobile-menu {
  width: 35px; height: 35px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: #5e5c70;
}
.icon-button { position: relative; font-size: 19px; }
.has-dot::after { content: ""; position: absolute; right: 7px; top: 7px; width: 6px; height: 6px; border: 2px solid #fff; border-radius: 50%; background: #ef6f67; }
.user-avatar { width: 35px; height: 35px; margin-left: 4px; border: 0; color: #fff; font-size: 11px; font-weight: 800; background: linear-gradient(145deg,#d84f70,#8f78d7); }
.user-menu-wrap { position: relative; }
.user-menu {
  position: absolute; top: 46px; right: 0; z-index: 30; width: 245px; padding: 10px;
  border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: 0 18px 45px rgba(26,23,64,.14);
  opacity: 0; transform: translateY(-5px); pointer-events: none; transition: .16s;
}
.user-menu.open { opacity: 1; transform: none; pointer-events: auto; }
.user-menu-head { display: grid; grid-template-columns: 35px 1fr; gap: 10px; align-items: center; padding: 8px; }
.user-menu-head > span { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: var(--violet); font-size: 10px; font-weight: 800; }
.user-menu-head strong, .user-menu-head small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-menu-head strong { font-size: 11px; }.user-menu-head small { margin-top: 3px; color: var(--muted); font-size:10px; }
.user-menu > button { width: 100%; padding: 10px; display: flex; justify-content: space-between; border: 0; border-top: 1px solid var(--line); color: #6a6877; background: #fff; font-size: 10px; text-align: left; }
.mobile-menu { display: none; }
.view { display: none; max-width: 1440px; margin: 0 auto; padding: 34px 34px 54px; }
.view.active { display: block; animation: fade .18s ease; }
@keyframes fade { from { opacity: 0; transform: translateY(3px); } }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.page-head.compact { align-items: center; }
.page-head h1 { margin: 6px 0 5px; font-family: "Be Vietnam Pro"; font-size: 27px; line-height: 1.16; letter-spacing: -.035em; }
.page-head p:not(.eyebrow) { margin: 0; color: var(--muted); }
.demo-banner { margin: -12px 0 20px; padding: 10px 13px; display: flex; align-items: center; gap: 10px; border: 1px solid #ddd9ff; border-radius: 11px; color: #5047a0; background: #f0eeff; }
.demo-banner > span { padding: 4px 7px; border-radius: 7px; color: #fff; background: var(--violet); font-size:10px; font-weight: 800; letter-spacing: .08em; }
.demo-banner p { flex: 1; margin: 0; font-size:10px; }.demo-banner a { font-size:10px; font-weight: 700; }
.eyebrow { margin: 0; color: var(--violet); font-size:10px; font-weight: 800; letter-spacing: .15em; }
.eyebrow span { display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: #ff795f; box-shadow: 0 0 0 3px #ffe8e3; }
.head-actions { display: flex; gap: 10px; }
.button {
  min-height: 38px; padding: 0 15px; border: 1px solid var(--line); border-radius: 10px;
  background: #fff; color: var(--ink); font-weight: 700; font-size: 12px;
}
.button.primary { color: #fff; border-color: #d84f70; background: linear-gradient(135deg,#f17180,#d84f70 55%,#9b73d0); box-shadow: 0 8px 18px rgba(216,79,112,.22); }
.button.primary:hover { background: var(--violet-dark); }
.button.secondary:hover, .button.ghost:hover { background: #f7f7fb; }
.button.ghost { min-height: 32px; color: var(--violet); border-color: #dedaff; }
.filterbar {
  position: sticky; top: 64px; z-index: 7; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 15px; margin-bottom: 16px; padding: 8px; border-radius: 13px; background: rgba(255,248,246,.98); box-shadow: 0 10px 24px rgba(101,54,76,.09);
}
.platform-tabs, .date-filter { display: flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.platform-tab, .date-chip {
  height: 30px; padding: 0 12px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; font-size: 11px; font-weight: 600;
}
.platform-tab.active, .date-chip.active { color: var(--ink); background: #f0eff7; }
.platform-tab span { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; }
.meta-color { background: #5d58e8; }.google-color { background: #37a77b; }.tiktok-color { background: #ef5370; }
.command-scope-filter { width: 100%; padding: 11px; display: grid; grid-template-columns: repeat(3,minmax(180px,1fr)); gap: 10px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,253,253,.94); box-shadow: 0 8px 24px rgba(110,65,84,.045); }
.command-scope-filter label,.command-custom-range label { display: grid; gap: 6px; }
.command-scope-filter label span,.command-custom-range label span { color: var(--muted); font-size:10px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.command-scope-filter select,.command-custom-range input { width: 100%; height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font: inherit; font-size: 10px; }
.command-custom-range { width: 100%; padding: 12px; display: grid; grid-template-columns: minmax(180px,240px) minmax(180px,240px) 1fr; gap: 10px; align-items: end; border: 1px dashed #cbc6f5; border-radius: 12px; background: #faf9ff; }
.command-custom-range[hidden] { display: none; }
.command-custom-range small { align-self: center; color: var(--muted); font-size:10px; }
.command-live-status { min-height: 38px; padding: 0 11px; display:flex; align-items:center; gap:9px; border:1px solid #f0d9df; border-radius:9px; background:linear-gradient(135deg,#fff3f1,#fff8fb); }
.command-live-status i { width:8px; height:8px; flex:0 0 auto; border-radius:50%; background:#d99a39; box-shadow:0 0 0 4px #fff0cf; }
.command-live-status span,.command-live-status strong,.command-live-status small { display:block; min-width:0; }
.command-live-status strong { font-size:10px; }.command-live-status small { margin-top:2px; overflow:hidden; color:var(--muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.command-live-status[data-tone="success"] i { background:var(--jade); box-shadow:0 0 0 4px #ddf5ee; }
.command-live-status[data-tone="error"] i { background:var(--red); box-shadow:0 0 0 4px var(--red-soft); }
.command-live-status[data-tone="warning"] i { background:#d99a39; }
.command-brief-strip { min-height: 52px; margin-bottom: 14px; padding: 9px 13px; display: grid; grid-template-columns: 30px 1fr auto; gap: 11px; align-items: center; border: 1px solid #f1d7df; border-radius: 13px; background: linear-gradient(90deg,#fff0f2,#fff9f7 55%,#f8f2ff); }
.command-brief-strip > span { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 9px; color: var(--violet); background: #e9e5ff; font-size:10px; font-weight: 800; }
.command-brief-strip strong,.command-brief-strip small { display: block; }.command-brief-strip strong { font-size: 10px; }.command-brief-strip small { margin-top: 3px; color: var(--muted); font-size:10px; }
.command-brief-strip button { border: 0; color: var(--violet); background: transparent; font-size:10px; font-weight: 700; }
/* auto-fit so the funnel and delivery cards wrap evenly instead of leaving a
   half-empty final column when the card count is not a multiple of six. */
.metric-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); gap: 12px; margin-bottom: 14px; }
/* Tier 0 executive KPI: deliberately larger and visually separate from the
   operational cards so the three budget decisions read first. */
.exec-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 16px; }
.exec-card { padding: 20px 22px; border: 1px solid #e3e0ee; border-radius: 16px; background: linear-gradient(140deg,#fff 55%,#f7f5ff); box-shadow: 0 10px 30px rgba(45,38,95,.05); }
.exec-card[data-state="empty"] { background: #fcfbfe; border-style: dashed; }
.exec-label { margin: 0 0 6px; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.exec-value { display: block; color: var(--ink); font-size: 30px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; }
.exec-note { display: block; margin-top: 8px; color: var(--muted); font-size: 11px; }
.exec-note.warning { color: #9a6414; }
.exec-note.up { color: var(--jade); }
.ads-column-options { grid-column: 1/-1; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px,1fr)); gap: 6px 14px; margin: 4px 0 2px; }
.ads-column-option { display: flex; align-items: center; gap: 7px; color: var(--ink); font-size: 11px; font-weight: 500; }
.ads-column-option input { width: 13px; height: 13px; }
.metric-grid.mini { grid-template-columns: repeat(4, 1fr); }
.metric {
  min-height: 106px; padding: 14px 15px; border: 1px solid var(--line); border-radius: 15px; background: linear-gradient(145deg,#fffdfd,#fffafa); box-shadow: 0 6px 18px rgba(101,54,76,.04);
}
.metric-top { display: flex; justify-content: space-between; align-items: center; }
.metric-label { color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.metric-icon { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; color: var(--violet); background: var(--violet-soft); }
.metric strong { display: block; margin: 9px 0 3px; font-family: "Be Vietnam Pro"; font-size: clamp(16px,1.35vw,20px); line-height:1.2; letter-spacing: -.025em; overflow-wrap:anywhere; }
.metric small { color: var(--muted); font-size: 10px; }
.metric:nth-child(2n) .metric-icon { color:#8b69c9; background:#f0eaff; }.metric:nth-child(3n) .metric-icon { color:#168b7d; background:#e2f7f2; }.metric:nth-child(5n) .metric-icon { color:#b97819; background:#fff0cf; }
.delta { display: inline-flex; align-items: center; margin-right: 5px; font-weight: 700; }
.delta.up { color: var(--green); }.delta.down { color: var(--red); }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px,.8fr); gap: 14px; }
.card { border: 1px solid var(--line); border-radius: 16px; background: rgba(255,253,253,.96); box-shadow: 0 8px 24px rgba(101,54,76,.045); }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px 14px; }
.card-head h2 { margin: 3px 0 0; font-family: "Be Vietnam Pro"; font-size: 16px; letter-spacing: -.02em; }
.card-kicker { margin: 0; color: var(--muted); font-size:10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.card-kicker.light { color: #a4a0bd; }
.legend { display: flex; gap: 14px; color: var(--muted); font-size: 10px; }
.legend-line { display: inline-block; width: 16px; height: 3px; margin: 0 5px 2px 0; border-radius: 4px; }
.legend-line.spend { background: #8ccfc1; }.legend-line.revenue { background: var(--violet); }
.performance-card { min-height: 328px; }
.chart-wrap { height: 250px; padding: 0 12px 10px; }
.chart-wrap svg { width: 100%; height: 100%; overflow: visible; }
.grid-line { stroke: #f1e2e6; stroke-width: 1; stroke-dasharray: 3 5; }
.axis-text { fill: #9695a3; font-size: 10px; }
.revenue-area { fill: url(#revenueFill); }
.revenue-path { fill: none; stroke: var(--violet); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.spend-path { fill: none; stroke: #64b8a8; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.queue-card { min-height: 328px; }
.queue-item { display: grid; grid-template-columns: 1fr auto; gap: 5px; margin: 0 16px 8px; padding: 11px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(135deg,#fffafa,#fff5f4); }
.queue-item strong { font-size: 11px; }
.queue-item p { grid-column: 1; margin: 1px 0 0; color: var(--muted); font-size:10px; }
.queue-item .amount { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-weight: 700; font-size: 11px; }
.pill { display: inline-flex; align-items: center; justify-content: center; padding: 4px 8px; border-radius: 12px; font-size:10px; font-weight: 700; white-space: nowrap; }
.pill.green { color: var(--green); background: var(--green-soft); }.pill.red { color: var(--red); background: var(--red-soft); }.pill.amber { color: var(--amber); background: var(--amber-soft); }.pill.violet { color: var(--violet-dark); background: var(--violet-soft); }
.text-button { margin: 3px 17px; padding: 7px 0; border: 0; color: var(--violet); background: transparent; font-size: 10px; font-weight: 700; }
.channel-card { min-height: 244px; }
.platform-performance-card .card-head .text-button { margin: 0; }
.command-platform-list { padding: 0 18px 16px; }
.command-platform-row { padding: 11px 0; display: grid; grid-template-columns: minmax(135px,.7fr) minmax(0,1.3fr); gap: 16px; align-items: center; border-top: 1px solid #f0eff4; }
.command-platform-row:first-child { border-top: 0; }
.command-platform-row > div span,.command-platform-row > div small { display: block; }.command-platform-row > div span { font-size: 10px; }.command-platform-row > div small { margin-top: 4px; color: var(--muted); font-size:10px; }.command-platform-row .dot { display: inline-block; }
.command-platform-row dl { margin: 0; display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
.command-platform-row dl div { min-width: 0; }.command-platform-row dt { color: var(--muted); font-size:10px; text-transform: uppercase; }.command-platform-row dd { margin: 4px 0 0; overflow: hidden; font-size:10px; font-weight: 700; text-overflow: ellipsis; }
.strategy-overview-card { margin-bottom:14px; }.strategy-overview-card .card-head > div > p:not(.card-kicker),.strategy-drilldown-card .card-head > div > p:not(.card-kicker) { margin:4px 0 0; color:var(--muted); font-size:10px; }.strategy-overview-list { padding:0 18px 18px; }.strategy-chart-controls,.strategy-drilldown-tabs,.strategy-drilldown-metrics { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }.strategy-chart-controls { margin-bottom:12px; }.strategy-chart-controls > span { margin-right:4px; color:var(--muted); font-size:10px; }.strategy-chart-controls button,.strategy-drilldown-tabs button,.strategy-drilldown-metrics button { border:1px solid var(--line); border-radius:8px; padding:5px 8px; color:var(--muted); background:#fff; font:700 10px "Be Vietnam Pro",sans-serif; }.strategy-chart-controls button.active,.strategy-drilldown-tabs button.active,.strategy-drilldown-metrics button.active { color:var(--violet-dark); border-color:#dcd6ff; background:var(--violet-soft); }.strategy-funnel-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }.strategy-funnel-chart { min-width:0; padding:11px; border:1px solid var(--line); border-radius:12px; background:#fff; }.strategy-funnel-chart header { display:flex; justify-content:space-between; gap:8px; }.strategy-funnel-chart header strong,.strategy-funnel-chart header small { display:block; }.strategy-funnel-chart header strong { font-size:10px; }.strategy-funnel-chart header small { min-height:18px; margin-top:3px; color:var(--muted); font-size:10px; line-height:1.3; }.strategy-funnel-chart header > span { width:8px; height:8px; margin-top:3px; flex:0 0 auto; border-radius:99px; background:var(--strategy-color); }.strategy-mini-legend { display:flex; gap:10px; margin-top:8px; color:var(--muted); font-size:10px; }.strategy-mini-legend i,.strategy-drilldown-metrics i { display:inline-block; width:8px; height:2px; margin:0 4px 2px 0; border-radius:2px; background:var(--strategy-color); }.strategy-mini-legend .roas-line,.revenue-line { background:#392b83; }.spend-line { background:#0aae9c; }.ctr-line { background:#6d5dfc; }.cpm-line { background:#ff9d42; }.strategy-time-chart { display:block; width:100%; margin-top:6px; overflow:visible; }.strategy-grid-line { stroke:#eeeaf4; stroke-dasharray:3 4; }.strategy-area { fill:var(--strategy-color); opacity:.1; stroke:none; }.strategy-line { fill:none; stroke:var(--strategy-color); stroke-linecap:round; stroke-linejoin:round; stroke-width:2.6; }.strategy-line.secondary { stroke-width:2; stroke-dasharray:4 4; }.strategy-funnel-chart footer,.strategy-drilldown-axis { display:flex; justify-content:space-between; color:var(--muted); font-size:10px; }.strategy-drilldown-card { margin:14px 0; }.strategy-drilldown-chart { padding:0 18px 17px; }.strategy-drilldown-tabs { border-bottom:1px solid #f0eff4; padding-bottom:10px; }.strategy-drilldown-tabs button { border:0; border-radius:7px; padding:6px 10px; }.strategy-drilldown-metrics { justify-content:flex-end; margin:10px 0 0; }.strategy-drilldown-metrics button { border:0; padding:4px 6px; background:transparent; }.strategy-drilldown-metrics button.active { border:0; background:transparent; }.strategy-drilldown-plot { padding:3px 0 0; }.strategy-drilldown-plot .strategy-time-chart { max-height:245px; }.strategy-drilldown-axis { margin-top:-7px; padding:0 27px; }.strategy-drilldown-summary { display:flex; flex-wrap:wrap; gap:7px 17px; margin-top:13px; padding-top:10px; color:var(--muted); border-top:1px solid #f0eff4; font-size:10px; }.strategy-drilldown-summary b { color:var(--ink); }
.more-button { border: 0; background: transparent; color: var(--muted); }
.channel-content { display: grid; grid-template-columns: 145px 1fr; gap: 22px; align-items: center; padding: 2px 22px 22px; }
.donut {
  width: 132px; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%;
  background: conic-gradient(#6559e8 0 51%, #2b9f76 51% 82%, #ee5870 82% 100%);
  position: relative;
}
.donut::after { content: ""; position: absolute; inset: 19px; border-radius: 50%; background: #fff; }
.donut div { z-index: 1; text-align: center; }
.donut strong, .donut small { display: block; }.donut strong { font-family: "Be Vietnam Pro"; font-size: 16px; }.donut small { margin-top: 2px; color: var(--muted); font-size:10px; }
.channel-legend > div { display: grid; grid-template-columns: 1fr auto; gap: 3px 12px; padding: 8px 0; border-bottom: 1px solid #f0eff4; }
.channel-legend span { font-size: 11px; }.channel-legend b { font-size: 11px; }.channel-legend small { grid-column: 1 / span 2; padding-left: 14px; color: var(--muted); font-size:10px; }
.dot { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; }.meta-bg { background: #6559e8; }.google-bg { background: #2b9f76; }.tiktok-bg { background: #ee5870; }
.risk-card {
  padding: 21px; min-height: 230px; color: #fff; border: 0;
  background: radial-gradient(circle at 88% 8%, #b5759c, transparent 34%), linear-gradient(145deg,#4b2944,#6c3558 52%,#3d355e);
}
.risk-card h2 { margin: 8px 0 3px; font-family: "Be Vietnam Pro"; font-size: 25px; overflow-wrap:anywhere; }.risk-card p { margin: 0; color: #e2ccd9; font-size: 10px; }
.risk-gauge { height: 5px; margin: 45px 0 11px; border-radius: 5px; background: #353247; overflow: hidden; }.risk-gauge span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#796cff,#a58fff); }
.risk-footer { display: flex; justify-content: space-between; color: #aaa6bd; font-size:10px; }.risk-footer button { border: 0; color: #c8c3ff; background: transparent; font-size:10px; }
.campaigns-card { margin-top: 14px; }
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; white-space: nowrap; }
th { padding: 10px 18px; color: #9896a6; background: #fafafe; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: left; font-size:10px; letter-spacing: .06em; text-transform: uppercase; }
td { padding: 14px 18px; border-bottom: 1px solid #efeff4; font-size: 11px; }
tbody tr:last-child td { border-bottom: 0; }
.campaign-name strong, .campaign-name small { display: block; }.campaign-name small { margin-top: 3px; color: var(--muted); font-size:10px; }
.platform-badge { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.sparkline { width: 64px; height: 21px; }
.sparkline path { fill: none; stroke: var(--green); stroke-width: 2; }
.sparkline.down path { stroke: var(--red); }
.toolbar { display: flex; gap: 10px; align-items: center; padding: 12px; margin-bottom: 14px; }
.search { flex: 1; min-width: 210px; display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); }
.search input { width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 11px; }
.toolbar select, form select, form input { height: 38px; padding: 0 11px; border: 1px solid var(--line); border-radius: 9px; outline: none; color: var(--ink); background: #fff; font-size: 11px; }
.toolbar-count { color: var(--muted); font-size: 10px; }
.ads-manager-eyebrow { color: #4555b0; }.ads-manager-eyebrow span { background: #5e6ed0; box-shadow: 0 0 0 3px #e5e9ff; }
.ads-source-strip { min-height: 66px; margin-bottom: 14px; padding: 11px 14px; display: flex; align-items: center; gap: 24px; border: 1px solid #dce2fb; border-radius: 14px; background: linear-gradient(100deg,#fff 55%,#f3f5ff); }
.ads-source-main { min-width: 320px; display: flex; align-items: center; gap: 11px; }.ads-source-main strong,.ads-source-main small,.ads-source-stat strong,.ads-source-stat small { display: block; }.ads-source-main strong { font-size: 11px; }.ads-source-main small { margin-top: 3px; color: var(--muted); font-size:10px; }.ads-source-stat { padding-left: 20px; border-left: 1px solid #e2e5f2; }.ads-source-stat small { color: var(--muted); font-size:10px; text-transform: uppercase; }.ads-source-stat strong { margin-top: 5px; font-size:10px; }.ads-source-stat i { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px var(--green-soft); }
.ads-source-strip .button { margin-left: auto; white-space: nowrap; }
.ads-scope-filter { position:sticky; top:64px; z-index:7; margin-bottom:14px; padding:11px; display:grid; grid-template-columns:repeat(5,minmax(145px,1fr)); gap:10px; border:1px solid #dce2fb; border-radius:13px; background:linear-gradient(100deg,#fff 45%,#f8f7ff); box-shadow:0 10px 24px rgba(72,76,163,.09); }.ads-scope-filter label { display:grid; gap:6px; }.ads-scope-filter label span { color:var(--muted); font-size:10px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; }.ads-scope-filter select,.ads-custom-range input { width:100%; height:38px; padding:0 10px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:#fff; font:inherit; font-size:10px; }.ads-scope-live { min-height:38px; padding:0 11px; display:flex; align-items:center; gap:9px; border:1px solid #dce8f4; border-radius:9px; background:#f6fbff; }.ads-scope-live i { width:8px; height:8px; flex:0 0 auto; border-radius:50%; background:var(--jade); box-shadow:0 0 0 4px #ddf5ee; }.ads-scope-live span,.ads-scope-live strong,.ads-scope-live small { display:block; min-width:0; }.ads-scope-live strong { font-size:10px; }.ads-scope-live small { margin-top:2px; overflow:hidden; color:var(--muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.ads-custom-range { display:grid; grid-template-columns:1fr 1fr; gap:8px; grid-column:1 / span 2; }.ads-custom-range[hidden] { display:none; }
.ads-manager-toolbar { margin-bottom: 14px; padding: 12px; }.ads-toolbar-row { display: grid; grid-template-columns: auto minmax(260px,1fr) 190px auto; gap: 9px; align-items: center; }.ads-toolbar-row select,.ads-filter-panel select { height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font-size:10px; }.filter-trigger b { min-width: 18px; padding: 2px 5px; margin-left: 5px; border-radius: 8px; color: #fff; background: var(--violet); font-size:10px; }
.ads-filter-panel { margin-top:11px; padding-top:11px; display:grid; grid-template-columns:repeat(2,minmax(150px,220px)) auto; gap:10px; align-items:end; border-top:1px solid var(--line); }.ads-filter-panel[hidden] { display: none; }.ads-filter-panel label { display: grid; gap: 5px; }.ads-filter-panel label span { color: var(--muted); font-size:10px; font-weight: 700; text-transform: uppercase; }.ads-filter-panel .text-button { height: 38px; margin: 0; }
.ads-selection-summary { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:9px; margin-bottom:14px; }.ads-selection-summary > div { min-width:0; padding:12px; border:1px solid var(--line); border-radius:11px; background:rgba(255,255,255,.8); box-shadow:0 5px 14px rgba(101,54,76,.035); }.ads-selection-summary span,.ads-selection-summary strong,.ads-selection-summary small { display:block; }.ads-selection-summary span { color:var(--muted); font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }.ads-selection-summary strong { margin-top:6px; overflow:hidden; font-size:16px; letter-spacing:-.025em; text-overflow:ellipsis; white-space:nowrap; }.ads-selection-summary small { margin-top:4px; color:var(--muted); font-size:10px; }
.ads-manager-card { overflow: hidden; }.ads-levelbar { min-height: 63px; padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }.ads-level-tabs { display: flex; gap: 5px; padding: 4px; border-radius: 11px; background: #f3f3f8; }.ads-level-tabs button { min-width: 120px; height: 34px; padding: 0 12px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; font-size: 10px; font-weight: 700; }.ads-level-tabs button.active { color: #4e47b0; background: #fff; box-shadow: 0 3px 10px rgba(43,38,92,.08); }.ads-level-tabs b { margin-left: 5px; color: #aaa8b4; font-size:10px; }.ads-table-actions { display: flex; align-items: center; gap: 10px; }.ads-table-actions > span { color: var(--muted); font-size:10px; }
.ads-column-panel { margin: 0 14px 12px; padding: 10px 12px; display: flex; align-items: center; gap: 7px; border: 1px solid #dfdcfb; border-radius: 10px; color: #5e57a9; background: #f6f4ff; }.ads-column-panel[hidden] { display: none; }.ads-column-panel strong { margin-right: 5px; font-size:10px; }.ads-column-panel span { padding: 4px 7px; border-radius: 7px; background: #fff; font-size:10px; }.ads-column-panel small { margin-left: auto; color: #8c88a6; font-size:10px; }
.ads-manager-table table { min-width: 2380px; }.ads-manager-table th { position: sticky; top: 0; z-index: 1; }.ads-manager-table td { height: 61px; }.ads-manager-table tbody tr:hover { background: #fbfbff; }.ads-manager-table input[type="checkbox"] { accent-color: var(--violet); }.ads-entity strong,.ads-entity small { display: block; }.ads-entity strong { font-size: 10px; }.ads-entity small { max-width: 260px; margin-top: 4px; overflow: hidden; color: var(--muted); font-size:10px; text-overflow: ellipsis; }.ads-switch { position: relative; width: 34px; height: 19px; padding: 0; border: 0; border-radius: 10px; background: #c9c8d2; }.ads-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 13px; height: 13px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.18); }.ads-switch.on { background: #2ca272; }.ads-switch.on::after { left: 18px; }.ads-performance { width: 75px; }.ads-performance svg { width: 75px; height: 23px; }.ads-performance polyline { fill: none; stroke: var(--green); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }.ads-performance.down polyline { stroke: var(--red); }.ads-row-menu { width: 29px; height: 29px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; font-size: 17px; }.ads-row-menu:hover { background: #f0eff7; }.ads-manager-table tfoot td { position: sticky; bottom: 0; background: #fafafe; font-weight: 700; }.ads-optimization { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 9px; color: #5147a8; background: var(--violet-soft); font-size:10px; font-weight: 700; }.ads-optimization::before { content: "✦"; }.ads-optimization.none { color: var(--muted); background: #f1f1f5; }.ads-optimization.none::before { content: "—"; }
.ads-manager-bottom { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(320px,.65fr); gap: 14px; margin-top: 14px; }.ads-guardrail-grid { padding: 0 18px 18px; display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }.ads-guardrail-grid > div { padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: #fbfbfd; }.ads-guardrail-grid span,.ads-guardrail-grid strong,.ads-guardrail-grid small { display: block; }.ads-guardrail-grid span { color: var(--muted); font-size:10px; text-transform: uppercase; }.ads-guardrail-grid strong { margin-top: 7px; font-size: 10px; }.ads-guardrail-grid small { margin-top: 5px; color: var(--muted); font-size:10px; line-height: 1.45; }.ads-signal { margin: 0 17px 9px; padding: 10px 11px; display: grid; grid-template-columns: 8px 1fr auto; gap: 9px; align-items: center; border: 1px solid var(--line); border-radius: 10px; }.ads-signal > i { width: 8px; height: 8px; border-radius: 50%; background: var(--amber); }.ads-signal.risk > i { background: var(--red); }.ads-signal.good > i { background: var(--green); }.ads-signal strong,.ads-signal small { display: block; }.ads-signal strong { font-size:10px; }.ads-signal small { margin-top: 3px; color: var(--muted); font-size:10px; }.ads-signal b { font-size:10px; }
.optimization-eyebrow { color:#a05b25; }.optimization-eyebrow span { background:#da8b44; box-shadow:0 0 0 3px #fff0dc; }.optimization-metric-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:11px; margin-bottom:14px; }.optimization-metric-grid .metric-icon { color:#9b5b28; background:#fff1e2; }.optimization-hero-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:14px; margin-bottom:14px; }.optimization-queue-card { overflow:hidden; }.optimization-queue-card .card-head p,.tactic-library-card .card-head p { margin:4px 0 0; color:var(--muted); font-size:10px; }.optimization-recommendation { margin:0 17px 9px; padding:12px; display:grid; grid-template-columns:36px 1fr auto; gap:10px; align-items:center; border:1px solid var(--line); border-radius:11px; }.optimization-recommendation > span { width:36px; height:36px; display:grid; place-items:center; border-radius:10px; color:#fff; background:#d38a3e; font-size:12px; }.optimization-recommendation.good > span { background:#299972; }.optimization-recommendation.risk > span { background:#cf5259; }.optimization-recommendation strong,.optimization-recommendation small { display:block; }.optimization-recommendation strong { font-size:10px; }.optimization-recommendation small { margin-top:4px; color:var(--muted); font-size:10px; }.optimization-recommendation button { min-height:29px; font-size:10px; }.automation-coverage-card { position:relative; padding:22px; overflow:hidden; color:#fff; border:0; background:radial-gradient(circle at 85% 10%,#4a416d,transparent 36%),#201d35; }.automation-coverage-card h2 { max-width:270px; margin:8px 0 6px; font-family:"Be Vietnam Pro"; font-size:19px; }.automation-coverage-card h2 span { color:#b7a8ff; }.automation-coverage-card > p:not(.card-kicker) { max-width:260px; margin:0; color:#aaa6b8; font-size:10px; line-height:1.6; }.automation-ring { position:relative; width:126px; height:126px; margin:24px auto 16px; display:grid; place-items:center; border-radius:50%; background:conic-gradient(#8a78ff 0 36%,#393548 36% 100%); }.automation-ring::before { content:""; position:absolute; width:88px; height:88px; border-radius:50%; background:#26223d; }.automation-ring div { position:relative; z-index:1; text-align:center; }.automation-ring strong,.automation-ring small { display:block; }.automation-ring strong { font-family:"Be Vietnam Pro"; font-size:22px; }.automation-ring small { margin-top:2px; color:#a8a4b6; font-size:10px; }.coverage-legend { display:flex; justify-content:center; gap:14px; color:#aaa6b8; font-size:10px; }.coverage-legend i { display:inline-block; width:7px; height:7px; margin-right:5px; border-radius:50%; background:#8a78ff; }.coverage-legend span:last-child i { background:#4b4758; }.tactic-library-card { margin-bottom:14px; }.tactic-grid { padding:0 18px 18px; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }.tactic-card { padding:14px; border:1px solid var(--line); border-radius:12px; background:#fbfbfd; }.tactic-card header { display:flex; align-items:center; justify-content:space-between; }.tactic-card header > span { padding:5px 7px; border-radius:8px; color:#9a5b26; background:#fff0df; font-size:10px; font-weight:800; }.tactic-card h3 { margin:13px 0 5px; font-size:11px; }.tactic-card p { min-height:34px; margin:0; color:var(--muted); font-size:10px; line-height:1.5; }.tactic-condition { margin:12px 0; padding:9px; border-radius:9px; color:#5e5a71; background:#f0eff5; font-size:10px; line-height:1.45; }.tactic-card footer { display:flex; justify-content:space-between; align-items:center; }.tactic-card footer small { color:var(--muted); font-size:10px; }.tactic-card footer button { border:0; color:var(--violet); background:transparent; font-size:10px; font-weight:700; }.optimization-bottom-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:14px; }.action-mix { padding:0 18px 18px; }.action-mix-row { display:grid; grid-template-columns:100px 1fr 34px; gap:9px; align-items:center; margin-bottom:10px; }.action-mix-row span,.action-mix-row b { font-size:10px; }.action-mix-track { height:7px; border-radius:7px; background:#eeeef3; overflow:hidden; }.action-mix-track i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#7766e8,#a894ff); }.optimization-activity { padding:0 18px 18px; }.optimization-activity-row { padding:10px 0; display:grid; grid-template-columns:28px 1fr auto; gap:9px; align-items:center; border-top:1px solid #f0eff4; }.optimization-activity-row > span { width:28px; height:28px; display:grid; place-items:center; border-radius:9px; color:#fff; background:var(--violet); font-size:10px; font-weight:800; }.optimization-activity-row strong,.optimization-activity-row small { display:block; }.optimization-activity-row strong { font-size:10px; }.optimization-activity-row small { margin-top:3px; color:var(--muted); font-size:10px; }.optimization-activity-row time { color:var(--muted); font-size:10px; }
.account-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.account-card { padding: 17px; }
.account-head { display: flex; align-items: center; justify-content: space-between; }
.account-logo { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; color: #fff; font-weight: 800; }
.account-logo.meta { background: #635be5; }.account-logo.google { background: #2da174; }.account-logo.tiktok { background: #242333; }
.account-card h3 { margin: 16px 0 4px; font-size: 14px; }.account-card > p { margin: 0; color: var(--muted); font-size: 10px; }
.account-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin: 17px 0 0; padding-top: 14px; border-top: 1px solid var(--line); }
.account-meta small, .account-meta strong { display: block; }.account-meta small { color: var(--muted); font-size:10px; text-transform: uppercase; }.account-meta strong { margin-top: 3px; font-size: 10px; }
.measurement-source-card { margin-top: 14px; padding: 20px; display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.measurement-source-copy { display: flex; align-items: center; gap: 15px; }.measurement-source-copy h2 { margin: 4px 0; font-family: "Be Vietnam Pro"; font-size: 16px; }.measurement-source-copy p:not(.card-kicker) { margin: 0; color: var(--muted); font-size: 10px; }
.measurement-source-meta { display: flex; align-items: center; gap: 26px; }.measurement-source-meta > span small,.measurement-source-meta > span strong { display: block; }.measurement-source-meta > span small { color: var(--muted); font-size:10px; text-transform: uppercase; }.measurement-source-meta > span strong { margin-top: 5px; font-size: 10px; }
.source-pending { color: var(--amber); }.source-pending i { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--amber); }
.creative-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.creative-card { overflow: hidden; }
.creative-preview { height: 180px; padding: 18px; display: flex; align-items: end; color: #fff; background: linear-gradient(145deg, #30294f, #7c68e8); }
.creative-card:nth-child(2) .creative-preview { background: linear-gradient(145deg,#0d5860,#4bc4ad); }.creative-card:nth-child(3) .creative-preview { background: linear-gradient(145deg,#5b263b,#e36570); }
.creative-preview strong { font-family: "Be Vietnam Pro"; font-size: 20px; max-width: 210px; }
.creative-body { padding: 16px; }
.creative-title { display: flex; justify-content: space-between; gap: 10px; }.creative-title h3 { margin: 0; font-size: 12px; }.creative-title p { margin: 4px 0 0; color: var(--muted); font-size:10px; }
.score { font-family: "Be Vietnam Pro"; font-size: 24px; font-weight: 800; }
.progress-row { display: grid; grid-template-columns: 92px 1fr 32px; gap: 8px; align-items: center; margin-top: 13px; color: var(--muted); font-size:10px; }
.progress { height: 4px; border-radius: 4px; background: #ececf2; overflow: hidden; }.progress i { display: block; height: 100%; background: var(--violet); }
.analytics-nav-icon { color: #2d6f91; background: #e3f4fb; }.segment-nav-icon { color: #8a5522; background: #fff0dc; }
.analytics-eyebrow { color: #276d8d; }.analytics-eyebrow span { background: #3594bb; box-shadow: 0 0 0 3px #def3fb; }.segment-eyebrow { color: #945f26; }.segment-eyebrow span { background: #d39445; box-shadow: 0 0 0 3px #fff0d9; }
.analytics-filterbar { position: sticky; top: 64px; z-index: 7; margin-bottom: 14px; padding: 12px; display: grid; grid-template-columns: repeat(5,1fr) 1.25fr; gap: 9px; align-items: end; background: rgba(255,253,253,.98); box-shadow: 0 10px 24px rgba(101,54,76,.09); }.analytics-filterbar label { display: grid; gap: 6px; margin: 0; }.analytics-filterbar label span { color: var(--muted); font-size:10px; font-weight: 700; text-transform: uppercase; }.analytics-filterbar select,.analytics-custom-range input { width: 100%; height: 38px; padding: 0 9px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font:inherit; font-size:10px; }.analytics-custom-range { grid-column:1/-1; display:grid; grid-template-columns:minmax(170px,240px) minmax(170px,240px) 1fr; gap:9px; align-items:end; padding-top:10px; border-top:1px dashed var(--line); }.analytics-custom-range[hidden] { display:none; }.analytics-custom-range small { align-self:center; color:var(--muted); font-size:10px; }
.analytics-sync { height: 38px; padding: 7px 10px; display: grid; grid-template-columns: 9px 1fr; grid-template-rows: 1fr 1fr; column-gap: 8px; align-items: center; border: 1px solid #dbeaf0; border-radius: 9px; background: #f2fafc; }.analytics-sync > i { grid-row: 1/3; width: 8px; height: 8px; border-radius: 50%; background: #9a96a8; box-shadow: 0 0 0 4px #eeedf2; }.analytics-sync[data-tone="success"] > i { background:#31a276; box-shadow:0 0 0 4px #def4eb; }.analytics-sync[data-tone="warning"] > i { background:#d39445; box-shadow:0 0 0 4px #fff0d9; }.analytics-sync[data-tone="error"] > i { background:#d4555d; box-shadow:0 0 0 4px #ffe7e9; }.analytics-sync[data-tone="loading"] > i { background:#4b94b6; box-shadow:0 0 0 4px #def3fb; animation:analytics-pulse 1s infinite alternate; }.analytics-sync small,.analytics-sync strong { display: block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.analytics-sync small { align-self: end; color: #6c8791; font-size:10px; text-transform: uppercase; }.analytics-sync strong { align-self: start; font-size:10px; }@keyframes analytics-pulse { to { opacity:.35; } }
.analytics-metric-grid { display: grid; grid-template-columns: repeat(6,minmax(125px,1fr)); gap: 11px; margin-bottom: 14px; }.analytics-metric { min-width:0; min-height: 120px; }.analytics-metric > strong { font-size:16px; white-space:nowrap; }.analytics-metric .metric-icon { color: #2b7898; background: #e6f5fa; }
.analytics-hero-grid { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(340px,.75fr); gap: 14px; margin-bottom: 14px; }.analytics-chart-card,.funnel-card,.product-growth-card,.channel-economics-card,.demographic-card { overflow: hidden; }
.analytics-google-deep { margin-bottom:14px; padding:16px; border:1px solid #dceee7; border-radius:15px; background:linear-gradient(135deg,#f7fcfa,#fbfaff); }.analytics-google-deep[hidden] { display:none; }.analytics-google-head { margin-bottom:12px; display:flex; align-items:center; justify-content:space-between; gap:16px; }.analytics-google-head h2 { margin:4px 0; font-family:"Be Vietnam Pro"; font-size:16px; }.analytics-google-head p:not(.card-kicker) { margin:0; color:var(--muted); font-size:10px; }.analytics-google-grid { display:grid; grid-template-columns:minmax(300px,.85fr) minmax(0,1.15fr); gap:12px; }.google-network-card,.google-assets-card { min-height:250px; overflow:hidden; }.google-network-list { padding:0 16px 14px; }.google-network-row { margin-bottom:10px; display:grid; grid-template-columns:100px 1fr 86px; gap:9px; align-items:center; }.google-network-row span,.google-network-row strong { font-size:10px; }.google-network-row span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.google-network-row div { height:8px; overflow:hidden; border-radius:8px; background:#edf0ef; }.google-network-row i { height:100%; display:block; border-radius:inherit; background:linear-gradient(90deg,#2da174,#62bf9d); }.google-network-row strong { text-align:right; }.google-asset-grid { max-height:280px; padding:0 16px 16px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; overflow:auto; }.google-asset-item { min-width:0; padding:9px; display:grid; grid-template-columns:58px 1fr; gap:9px; border:1px solid var(--line); border-radius:10px; background:#fbfbfd; }.google-asset-thumb { width:58px; height:58px; display:grid; place-items:center; overflow:hidden; border-radius:8px; color:#8b8797; background:#f0eff4; font-size:9px; font-weight:800; }.google-asset-thumb img { width:100%; height:100%; object-fit:cover; }.google-asset-item strong,.google-asset-item small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.google-asset-item strong { font-size:10px; }.google-asset-item small { margin-top:3px; color:var(--muted); font-size:9px; }.google-asset-item footer { margin-top:7px; display:flex; flex-wrap:wrap; gap:4px; }.google-asset-item footer span { padding:3px 5px; border-radius:6px; color:#5e5970; background:#efedf6; font-size:8px; }.google-asset-label { color:#187a59!important; background:#e4f6ee!important; }
.legend-line.analytics-spend { background: #3e86a8; }.legend-line.analytics-revenue { background: #6f5bea; }.legend-line.analytics-roas { height:2px; background:repeating-linear-gradient(90deg,#df667f 0 5px,transparent 5px 8px); }.analytics-line-chart { position:relative; height: 292px; padding: 12px 20px 10px; border-top: 1px solid #f0eff4; }.analytics-line-chart svg { width: 100%; height: 100%; }.analytics-spend-path,.analytics-revenue-path,.analytics-roas-path { fill: none; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }.analytics-spend-path { stroke: #3e86a8; }.analytics-revenue-path { stroke: #6f5bea; }.analytics-revenue-area { fill:rgba(111,91,234,.08); }.analytics-roas-path { stroke:#df667f; stroke-width:2; stroke-dasharray:6 5; }.axis-text.roas-axis { fill:#b65870; }.analytics-point { pointer-events:none; stroke:#fff; stroke-width:2; }.spend-point { fill:#3e86a8; }.revenue-point { fill:#6f5bea; }.roas-point { fill:#df667f; }.analytics-hover-zone { fill:transparent; cursor:crosshair; outline:none; }.analytics-hover-zone:hover,.analytics-hover-zone:focus { fill:rgba(75,148,182,.055); }
.funnel-card { padding-bottom: 14px; }.funnel-step { margin: 0 17px 9px; display: grid; grid-template-columns: 1fr 95px; gap: 9px; align-items: center; }.funnel-step > span { min-height: 36px; padding: 8px 10px; display: grid; grid-template-columns: 22px 1fr auto; gap: 8px; align-items: center; border-radius: 8px; color: #3e3764; background: linear-gradient(90deg,#ece9ff,#f7f5ff); }.funnel-step:nth-child(2) > span { background: linear-gradient(90deg,#e4f5fb,#f5fbfd); }.funnel-step:nth-child(3) > span { background: linear-gradient(90deg,#e3f6ed,#f4fbf8); }.funnel-step:nth-child(4) > span { background: linear-gradient(90deg,#fff0d8,#fff9ef); }.funnel-step:nth-child(5) > span { background: linear-gradient(90deg,#ffe7e9,#fff6f6); }.funnel-step i { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 6px; color: #fff; background: #6458d9; font-style: normal; font-size:10px; }.funnel-step strong,.funnel-step b { font-size:10px; }.funnel-step small { color: var(--muted); font-size:10px; }
.analytics-product-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }.product-chart { height: 188px; padding: 14px 20px 8px; display: grid; grid-template-columns: repeat(7,1fr); gap: 12px; align-items: end; border-top: 1px solid #f1f0f5; background: linear-gradient(to bottom,transparent 32%,#f0eff4 33%,transparent 33.5%,transparent 65%,#f0eff4 66%,transparent 66.5%); }.product-day { display: grid; justify-items: center; gap: 5px; }.product-day > div { height: 145px; display: flex; align-items: end; gap: 3px; }.product-day span { display: block; width: 13px; min-height: 6px; border-radius: 4px 4px 2px 2px; }.dau-bar { background: linear-gradient(#58b6d6,#3084a7); }.payer-bar { background: linear-gradient(#9b8df2,#6b5be2); }.product-day small { color: var(--muted); font-size:10px; }
.product-kpis { padding: 0 17px 15px; display: grid; grid-template-columns: repeat(5,1fr); gap: 7px; }.product-kpis > span { padding: 9px; border-radius: 9px; background: #f8f8fb; }.product-kpis small,.product-kpis strong,.product-kpis b { display: block; }.product-kpis small { color: var(--muted); font-size:10px; }.product-kpis strong { margin-top: 5px; font-family: "Be Vietnam Pro"; font-size: 10px; }.product-kpis b { margin-top: 4px; color: var(--green); font-size:10px; }
.channel-economics-card table { min-width: 630px; }
.demographic-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-bottom:14px; }.demographic-card { min-height: 310px; }.analytics-card-select { height:32px; padding:0 8px; border:1px solid var(--line); border-radius:8px; color:var(--ink); background:#fff; font:inherit; font-size:10px; }
.horizontal-bars { padding: 0 18px 18px; }.horizontal-bar { display: grid; grid-template-columns: 42px 1fr 32px; gap: 9px; align-items: center; margin-bottom: 17px; }.horizontal-bar span,.horizontal-bar strong { font-size:10px; }.horizontal-bar strong { text-align: right; }.horizontal-bar > div { height: 9px; border-radius: 6px; background: #eeedf3; overflow: hidden; }.horizontal-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#4b94b6,#7c68e8); }
.mix-layout { padding: 2px 20px 20px; display: grid; grid-template-columns: 135px 1fr; gap: 22px; align-items: center; }.mix-donut { width: 132px; height: 132px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(#397f9f 0 58%,#7664e7 58% 100%); }.mix-donut::before { content:""; grid-area:1/1; width: 86px; height: 86px; border-radius: 50%; background: #fff; }.mix-donut > div { z-index:1; grid-area:1/1; text-align:center; }.mix-donut strong,.mix-donut small { display:block; }.mix-donut strong { font-family:"Be Vietnam Pro"; font-size:18px; }.mix-donut small { margin-top:3px; color:var(--muted); font-size:10px; }.mix-stats > span { margin-bottom: 12px; display: grid; grid-template-columns: 8px 1fr auto; gap: 7px; align-items: center; }.mix-stats i { width:7px; height:7px; border-radius:50%; }.mix-stats i.male { background:#397f9f; }.mix-stats i.female { background:#7664e7; }.mix-stats i.unknown { background:#c4c1cf; }.mix-stats small,.mix-stats strong { font-size:10px; }.mix-stats footer { display:flex; gap:5px; flex-wrap:wrap; }.mix-stats footer b { padding:5px 7px; border-radius:7px; color:#566474; background:#eff3f6; font-size:10px; }.mix-note { margin:0 0 14px; color:var(--muted); font-size:10px; line-height:1.5; }
.geo-list { padding: 0 18px 18px; }.geo-row { margin-bottom: 13px; display: grid; grid-template-columns: 28px 80px 1fr 38px; gap: 8px; align-items: center; }.geo-row > span { width:27px; height:27px; display:grid; place-items:center; border-radius:8px; color:#4b4770; background:#efedf8; font-size:10px; font-weight:800; }.geo-row strong,.geo-row small { display:block; }.geo-row strong { font-size:10px; }.geo-row small { margin-top:3px; color:var(--muted); font-size:10px; }.geo-track { height:6px; border-radius:5px; background:#eeedf2; overflow:hidden; }.geo-track i { display:block; height:100%; border-radius:inherit; background:#4a91b0; }.geo-row > b { color:var(--green); font-size:10px; text-align:right; }
.analytics-priority-grid,.analytics-economics-grid { display:grid; gap:14px; margin-bottom:14px; }.analytics-priority-grid { grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr); }.analytics-economics-grid { grid-template-columns:1.05fr .95fr; }.analytics-compact-card,.region-card,.retention-card { overflow:hidden; }
.cost-platform-chart { padding:0 18px 18px; }.cost-platform-row { margin-bottom:13px; display:grid; grid-template-columns:90px 1fr; gap:12px; align-items:center; }.cost-bars { display:grid; gap:7px; }.cost-bars > span { position:relative; height:21px; display:flex; align-items:center; border-radius:6px; background:#f1f0f5; overflow:hidden; }.cost-bars i { position:absolute; inset:0 auto 0 0; min-width:3px; border-radius:inherit; }.cost-bars .cpi-bar { background:#dceff6; }.cost-bars .cpr-bar { background:#e8e4ff; }.cost-bars b { z-index:1; padding-left:8px; color:#4c495a; font-size:10px; }
.spend-share-layout { min-height:180px; padding:0 20px 20px; display:grid; grid-template-columns:150px 1fr; gap:24px; align-items:center; }.spend-share-donut { width:145px; height:145px; display:grid; place-items:center; border-radius:50%; }.spend-share-donut::before { content:""; grid-area:1/1; width:92px; height:92px; border-radius:50%; background:#fff; }.spend-share-donut > div { z-index:1; grid-area:1/1; max-width:86px; text-align:center; }.spend-share-donut strong,.spend-share-donut small { display:block; }.spend-share-donut strong { font-size:11px; }.spend-share-donut small { margin-top:4px; color:var(--muted); font-size:10px; }.spend-share-legend { display:grid; gap:12px; }.spend-share-legend span { display:grid; grid-template-columns:8px 1fr auto; gap:8px; align-items:center; }.spend-share-legend i { width:8px; height:8px; border-radius:50%; }.spend-share-legend small,.spend-share-legend strong { font-size:10px; }
.region-list { padding:0 18px 12px; }.region-row { padding:10px 0; display:grid; grid-template-columns:34px 1fr auto; gap:10px; align-items:center; border-top:1px solid #f0eff4; }.region-row:first-child { border-top:0; }.region-row > span { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; color:#276d8d; background:#e6f5fa; font-size:10px; font-weight:800; }.region-row strong,.region-row small { display:block; }.region-row strong { font-size:10px; }.region-row small { margin-top:3px; color:var(--muted); font-size:10px; }.region-row > div:first-of-type i { height:4px; margin-top:7px; display:block; border-radius:4px; background:#f0eff4; overflow:hidden; }.region-row > div:first-of-type b { height:100%; display:block; border-radius:inherit; background:#4a91b0; }.region-row > div:last-child { text-align:right; }
.retention-source-legend { min-height:20px; padding:0 18px 4px; flex-wrap:wrap; }.retention-source-legend i { width:8px; height:8px; border-radius:50%; }.retention-chart { height:270px; padding:0 17px 14px; }.retention-chart svg { width:100%; height:100%; }.retention-path { fill:none; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }.retention-point { stroke:#fff; stroke-width:2; pointer-events:none; }.retention-hover-zone { fill:transparent; cursor:crosshair; outline:none; }.retention-hover-zone:hover,.retention-hover-zone:focus { fill:rgba(75,148,182,.08); }.retention-card .legend { flex-wrap:wrap; }.meta-line { background:#665de7; }.google-line { background:#25a276; }.tiktok-line { background:#242333; }
.cohort-heatmap { padding:0 18px 18px; overflow-x:auto; }.cohort-row { min-width:540px; display:grid; grid-template-columns:72px repeat(5,1fr); gap:6px; margin-bottom:6px; }.cohort-row > * { min-height:38px; padding:7px 5px; display:grid; place-items:center; border-radius:7px; font-size:10px; }.cohort-head > b { min-height:auto; color:var(--muted); background:transparent; text-transform:uppercase; }.cohort-row > strong { justify-items:start; background:#f7f6fa; }.cohort-row > span { color:#342e62; font-weight:700; }
.user-mix-chart { height:245px; padding:14px 20px 12px; display:grid; grid-template-columns:repeat(7,1fr); gap:10px; align-items:end; border-top:1px solid #f1f0f5; background:linear-gradient(to bottom,transparent 32%,#f0eff4 33%,transparent 33.5%,transparent 65%,#f0eff4 66%,transparent 66.5%); }.user-mix-day { display:grid; justify-items:center; gap:6px; }.user-mix-day > div { width:24px; height:190px; display:flex; flex-direction:column; justify-content:flex-end; }.user-mix-day i { width:100%; min-height:3px; display:block; }.returning-users { background:#4b94b6; }.new-users { background:#8b78ec; }.user-mix-day small { color:var(--muted); font-size:10px; }.new-user-line { background:#8b78ec; }.returning-user-line { background:#4b94b6; }
.analytics-creative-card { margin-bottom:14px; }.analytics-creative-card .card-head p { margin:4px 0 0; color:var(--muted); font-size:10px; }.analytics-creative-card table { min-width:760px; }
.analytics-unavailable { min-height:120px; padding:22px; grid-column:1/-1; display:grid; place-items:center; align-content:center; gap:7px; color:var(--muted); text-align:center; }.analytics-unavailable strong { color:#aaa6b5; font-family:"Be Vietnam Pro"; font-size:24px; }.analytics-unavailable p { max-width:360px; margin:0; font-size:10px; line-height:1.55; }.product-chart .analytics-unavailable { min-height:150px; }.mix-layout .analytics-unavailable { min-height:180px; }.retention-chart .analytics-unavailable { min-height:175px; }
[data-analytics-tooltip] { cursor:help; }.analytics-tooltip { position:fixed; z-index:1000; width:max-content; max-width:260px; padding:10px 12px; border:1px solid rgba(255,255,255,.12); border-radius:10px; color:#fff; background:#211e37; box-shadow:0 12px 30px rgba(33,30,55,.24); pointer-events:none; opacity:0; transform:translateY(4px); transition:opacity .12s,transform .12s; }.analytics-tooltip.visible { opacity:1; transform:none; }.analytics-tooltip strong,.analytics-tooltip span { display:block; }.analytics-tooltip strong { font-size:10px; }.analytics-tooltip span { margin-top:4px; color:#c8c5d3; font-size:10px; line-height:1.35; }
.segment-summary-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:11px; margin-bottom:14px; }.segment-summary .metric-icon { color:#a3661a; background:#fff1dc; }
.segment-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:14px; }.segment-card { position:relative; padding:18px; overflow:hidden; }.segment-card::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:#7b6bea; }.segment-card.blue::before { background:#378eaf; }.segment-card.green::before { background:#2d9c72; }.segment-card.amber::before { background:#d39445; }.segment-card.red::before { background:#d4555d; }.segment-card.dark::before { background:#343242; }.segment-card-top { display:flex; align-items:center; justify-content:space-between; }.segment-card-top > span:first-child { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:#fff; background:#7464e3; font-size:10px; font-weight:800; }.segment-card.blue .segment-card-top > span:first-child { background:#378eaf; }.segment-card.green .segment-card-top > span:first-child { background:#2d9c72; }.segment-card.amber .segment-card-top > span:first-child { background:#d39445; }.segment-card.red .segment-card-top > span:first-child { background:#d4555d; }.segment-card.dark .segment-card-top > span:first-child { background:#343242; }.segment-card h2 { margin:15px 0 5px; font-family:"Be Vietnam Pro"; font-size:14px; }.segment-card > p { min-height:30px; margin:0; color:var(--muted); font-size:10px; line-height:1.5; }.segment-size { margin-top:14px; padding:12px 0; display:flex; align-items:baseline; gap:5px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.segment-size strong { font-family:"Be Vietnam Pro"; font-size:20px; }.segment-size small { color:var(--muted); font-size:10px; }.segment-size b { margin-left:auto; color:var(--green); font-size:10px; }.segment-size b.negative { color:var(--red); }.segment-stats { padding:11px 0; display:grid; grid-template-columns:1fr 1fr; }.segment-stats span:first-child { border-right:1px solid var(--line); }.segment-stats span:last-child { padding-left:14px; }.segment-stats small,.segment-stats strong { display:block; }.segment-stats small { color:var(--muted); font-size:10px; text-transform:uppercase; }.segment-stats strong { margin-top:4px; font-size:10px; }.segment-card footer { display:flex; align-items:center; justify-content:space-between; }.segment-card footer div,.activation-row > div:nth-child(3) { display:flex; }.segment-card footer i,.activation-row i { width:24px; height:24px; margin-left:-4px; display:grid; place-items:center; border:2px solid #fff; border-radius:8px; color:#fff; font-style:normal; font-size:10px; font-weight:800; }.segment-card footer i:first-child,.activation-row i:first-child { margin-left:0; }.segment-card footer i.meta,.activation-row i.meta { background:#635be5; }.segment-card footer i.google,.activation-row i.google { background:#2da174; }.segment-card footer i.tiktok,.activation-row i.tiktok { background:#242333; }.segment-use-button { border:0; color:var(--violet); background:transparent; font-size:10px; font-weight:700; }
.segment-bottom-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.activation-card,.overlap-card { overflow:hidden; }.activation-row { margin:0 17px 9px; padding:10px; display:grid; grid-template-columns:36px 1fr auto auto; gap:10px; align-items:center; border-radius:10px; background:#f8f8fb; }.segment-key { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; color:#fff; background:#7464e3; font-size:10px; font-weight:800; }.segment-key.blue { background:#378eaf; }.segment-key.green { background:#2d9c72; }.segment-key.amber { background:#d39445; }.activation-row strong,.activation-row small { display:block; }.activation-row strong { font-size:10px; }.activation-row small { margin-top:3px; color:var(--muted); font-size:10px; }
.overlap-matrix { padding:0 18px 18px; }.overlap-head,.overlap-matrix > div { display:grid; grid-template-columns:55px repeat(4,1fr); gap:6px; align-items:center; }.overlap-head { margin-bottom:6px; }.overlap-head b,.overlap-matrix > div > b { font-size:10px; text-align:center; }.overlap-matrix > div > span { height:40px; display:grid; place-items:center; border-radius:7px; color:#6b6678; background:#f2f1f5; font-size:10px; }.overlap-matrix > div > span.medium { color:#6b5a19; background:#fff0ce; }.overlap-matrix > div > span.high { color:#4b419f; background:#e9e5ff; }
.audience-mixer-card { margin-top:14px; }.audience-mixer-card .card-head p { margin:4px 0 0; color:var(--muted); font-size:10px; }.audience-mixer-layout { padding:0 18px 18px; display:grid; grid-template-columns:1.15fr .85fr; gap:14px; }.mixer-builder { padding:16px; display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:end; border:1px solid var(--line); border-radius:12px; background:#fbfbfd; }.mixer-builder label { display:grid; gap:7px; }.mixer-builder label span { color:var(--muted); font-size:10px; font-weight:700; text-transform:uppercase; }.mixer-builder select { height:40px; padding:0 10px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:#fff; font-size:10px; }.mixer-builder > b { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#292641; font-size:10px; }.mixer-result { min-height:108px; padding:16px; border-radius:12px; color:#fff; background:radial-gradient(circle at 90% 0,#4d4778,transparent 35%),#211e37; }.mixer-result > span { color:#aaa6bd; font-size:10px; text-transform:uppercase; }.mixer-result strong { display:block; margin:8px 0 4px; font-family:"Be Vietnam Pro"; font-size:24px; }.mixer-result small { color:#aaa6bd; font-size:10px; }.mixer-result-track { height:5px; margin:15px 0 8px; border-radius:5px; background:#3a374d; overflow:hidden; }.mixer-result-track i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#8d80ff,#ba9cff); }.mixer-result footer { display:flex; justify-content:space-between; color:#aaa6bd; font-size:10px; }
#campaigns .table-wrap table { min-width:1360px; }.campaigns-card .table-wrap table { min-width:980px; }
.creative-eyebrow { color: #8150ad; }.creative-eyebrow span { background: #9b62c8; box-shadow: 0 0 0 3px #f0e5f8; }
.creative-source-strip { min-height: 62px; margin-bottom: 14px; padding: 11px 14px; display: flex; align-items: center; gap: 13px; border: 1px solid #eadff2; border-radius: 13px; color: #715b82; background: #fbf7fd; }
.creative-source-strip > div:nth-child(2) { min-width: 240px; }.creative-source-strip strong,.creative-source-strip small { display: block; }.creative-source-strip strong { color: #4a315c; font-size: 10px; }.creative-source-strip small { margin-top: 3px; color: #8d789d; font-size:10px; }.creative-source-strip > p { flex: 1; margin: 0; font-size:10px; }
.creative-code-card { margin-bottom: 14px; padding: 19px 21px; display: grid; grid-template-columns: minmax(280px,1fr) auto auto; gap: 30px; align-items: center; overflow: hidden; background: radial-gradient(circle at 93% 15%,rgba(128,96,190,.13),transparent 30%),#fff; }
.creative-code-card h2 { margin: 5px 0; font-family: "Be Vietnam Pro"; font-size: 16px; }.creative-code-card p:not(.card-kicker) { margin: 0; color: var(--muted); font-size:10px; }.creative-code-card p strong { color: var(--violet-dark); }
.code-anatomy { display: flex; align-items: center; gap: 7px; }.code-anatomy > i { color: #aaa6b5; font-style: normal; }.code-part { min-width: 75px; padding: 10px 12px; border-radius: 11px; text-align: center; }.code-part strong,.code-part small { display: block; }.code-part strong { font-family: "Be Vietnam Pro"; font-size: 16px; }.code-part small { margin-top: 4px; font-size:10px; }.code-part.video { color: #4f46b3; background: #eeecff; }.code-part.month { color: #167a59; background: #e6f7ef; }.code-part.editor { color: #a3661a; background: #fff1dc; }
.code-rule { padding: 9px 11px; border: 1px dashed #c9c4dc; border-radius: 9px; color: #5c5870; background: #faf9fd; font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10px; font-weight: 700; white-space: nowrap; }
.creative-filterbar { position:sticky; top:64px; z-index:7; margin-bottom: 14px; padding: 12px; display: grid; grid-template-columns: 1.5fr repeat(4,1fr) auto; gap: 9px; align-items: end; }.creative-filterbar label { display: grid; gap: 6px; margin: 0; }.creative-filterbar label > span { color: var(--muted); font-size:10px; font-weight: 700; text-transform: uppercase; }.creative-filterbar select,.creative-filterbar input { width: 100%; height: 38px; padding: 0 9px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font-size:10px; }.creative-search > div { position: relative; }.creative-search i { position: absolute; left: 10px; top: 11px; color: var(--muted); font-style: normal; }.creative-search input { padding-left: 28px; }
.creative-custom-range { grid-column: 1/-1; display: grid; grid-template-columns: minmax(170px,240px) minmax(170px,240px) 1fr; gap: 9px; align-items: end; padding-top: 10px; border-top: 1px dashed var(--line); }.creative-custom-range[hidden] { display: none; }.creative-custom-range label { display: grid; gap: 6px; }.creative-custom-range label > span { color: var(--muted); font-size:10px; font-weight: 700; text-transform: uppercase; }.creative-custom-range input { width: 100%; height: 38px; padding: 0 9px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font: inherit; font-size:10px; }.creative-custom-range small { align-self: center; color: var(--muted); font-size:10px; }
.creative-metric-grid { display: grid; grid-template-columns: repeat(6,minmax(125px,1fr)); gap: 11px; margin-bottom: 14px; }.creative-metric { min-height: 120px; }.creative-metric .metric-icon { color: #8255a6; background: #f2e9f8; }
.creative-insight-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 14px; margin-bottom: 14px; }
.creative-analysis-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:14px; margin-bottom:14px; }.creative-analysis-grid .card-head p { margin:4px 0 0; color:var(--muted); font-size:10px; }.creative-format-list,.copy-insight-body { padding:0 18px 18px; }.creative-format-row { margin-bottom:9px; padding:11px; display:grid; grid-template-columns:34px 1fr 85px 62px; gap:10px; align-items:center; border:1px solid var(--line); border-radius:10px; }.creative-format-row > span { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; color:#fff; background:#5e57d9; font-size:10px; font-weight:800; }.creative-format-row:nth-child(2) > span { background:#299a73; }.creative-format-row:nth-child(3) > span { background:#d38c37; }.creative-format-row:nth-child(4) > span { background:#343242; }.creative-format-row strong,.creative-format-row small { display:block; }.creative-format-row div > strong { font-size:10px; }.creative-format-row div > small { margin-top:3px; color:var(--muted); font-size:10px; }.creative-format-row b { font-size:10px; text-align:right; }.format-track { height:5px; border-radius:5px; background:#eeeef3; overflow:hidden; }.format-track i { display:block; height:100%; border-radius:inherit; background:var(--violet); }.copy-length-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }.copy-length-grid > div { padding:11px; border:1px solid var(--line); border-radius:10px; background:#fbfbfd; }.copy-length-grid span,.copy-length-grid strong,.copy-length-grid small { display:block; }.copy-length-grid span { color:var(--muted); font-size:10px; text-transform:uppercase; }.copy-length-grid strong { margin-top:7px; font-family:"Be Vietnam Pro"; font-size:15px; }.copy-length-grid small { margin-top:4px; color:var(--green); font-size:10px; }.copy-tags { margin-top:12px; padding-top:12px; border-top:1px solid var(--line); }.copy-tags > span { color:var(--muted); font-size:10px; text-transform:uppercase; }.copy-tags div { margin-top:8px; display:flex; flex-wrap:wrap; gap:6px; }.copy-tags b { padding:6px 8px; border-radius:8px; color:#4d469a; background:var(--violet-soft); font-size:10px; }.copy-signal-list { margin-top:12px; }.copy-signal { padding:8px 0; display:flex; align-items:center; justify-content:space-between; border-top:1px solid #f0eff4; }.copy-signal span { color:var(--muted); font-size:10px; }.copy-signal strong { font-size:10px; }
.reuse-card,.signal-card { overflow: hidden; }.reuse-item { width: calc(100% - 34px); margin: 0 17px 9px; padding: 11px; display: grid; grid-template-columns: 28px 1fr 52px auto; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: #fff; text-align: left; }.reuse-item:hover { border-color: #c9c2ef; background: #fbfaff; }.reuse-rank { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 8px; color: var(--violet); background: var(--violet-soft); font-size:10px; font-weight: 800; }.reuse-item strong,.reuse-item small { display: block; }.reuse-item strong { font-size: 10px; }.reuse-item small { margin-top: 3px; color: var(--muted); font-size:10px; }.reuse-score { text-align: right; }.reuse-score b { font-family: "Be Vietnam Pro"; font-size: 14px; }.reuse-score small { display: inline; margin-left: 2px; }
.signal-item { margin: 0 17px 10px; padding: 12px; display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: center; border-radius: 11px; background: #f8f7fb; }.signal-item > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; font-size: 10px; font-weight: 800; }.signal-item > span.hook { color: #5c4ec1; background: #eae7ff; }.signal-item > span.cost { color: #18805e; background: #e3f6ee; }.signal-item > span.scale { color: #a6681c; background: #fff0dc; }.signal-item strong,.signal-item small { display: block; }.signal-item strong { font-size:10px; }.signal-item small { margin-top: 3px; color: var(--muted); font-size:10px; line-height: 1.4; }.signal-item > b { font-family: "Be Vietnam Pro"; font-size: 11px; }
.signal-item > span.meta { color:#fff; background:#5e58e3; }.signal-item > span.google { color:#fff; background:#269a6d; }.signal-item > span.tiktok { color:#fff; background:#242333; }.platform-mini { color:var(--muted); font-size:10px; font-weight:700; white-space:nowrap; }
.creative-library-card { margin-bottom: 14px; overflow: hidden; }.creative-library-card .card-head p { margin: 4px 0 0; color: var(--muted); font-size:10px; }.creative-table-wrap { overflow-x: auto; }.creative-table-wrap table { min-width: 1540px; }.creative-table-wrap th,.creative-table-wrap td { white-space: nowrap; }
.creative-thumbnail { width:104px; aspect-ratio:16/9; display:grid; place-items:center; overflow:hidden; border:1px solid var(--line); border-radius:10px; background:#f6f5f9; }.creative-thumbnail.compact { width:58px; border-radius:8px; }.creative-thumbnail img { width:100%; height:100%; object-fit:cover; }.creative-thumbnail.empty { color:#928da0; }.creative-thumbnail.empty b,.creative-thumbnail.empty small { display:block; text-align:center; }.creative-thumbnail.empty b { font-size:18px; }.creative-thumbnail.empty small { margin-top:3px; font-size:10px; }.creative-thumbnail.compact small { display:none; }.platform-stack { display:flex; align-items:center; }.platform-stack .account-logo + .account-logo { margin-left:-6px; box-shadow:0 0 0 2px #fff; }.table-subline { display:block; margin-top:4px; color:var(--muted); font-size:10px; }
.creative-code-cell strong,.creative-code-cell small { display: block; }.creative-code-cell strong { font-family: ui-monospace,SFMono-Regular,Menlo,monospace; color: #3e3860; font-size: 10px; }.creative-code-cell small { width: max-content; margin-top: 4px; padding: 3px 5px; border-radius: 6px; font-size:10px; }.creative-code-cell small.valid { color: var(--green); background: var(--green-soft); }.creative-code-cell small.warning { color: var(--amber); background: var(--amber-soft); }
.creative-score { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; color: #8b681d; background: #fff0ce; font-family: "Be Vietnam Pro"; font-size:10px; font-weight: 800; }.creative-score.high { color: var(--green); background: var(--green-soft); }.creative-score.low { color: var(--red); background: var(--red-soft); }.row-detail-button { padding: 5px 7px; border: 0; color: var(--violet); background: transparent; font-size:10px; font-weight: 700; }
.creative-bottom-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 14px; }.creative-coverage-card,.brief-lab-card { overflow: hidden; }.creative-coverage-card .card-head p,.brief-lab-card .card-head p { margin: 4px 0 0; color: var(--muted); font-size:10px; }
.coverage-summary { margin: 0 17px 13px; display: grid; grid-template-columns: repeat(6,1fr); border: 1px solid var(--line); border-radius: 11px; overflow: hidden; }.coverage-summary > span { padding: 11px; border-right: 1px solid var(--line); }.coverage-summary > span:last-child { border: 0; }.coverage-summary small,.coverage-summary strong { display: block; }.coverage-summary small { color: var(--muted); font-size:10px; text-transform: uppercase; }.coverage-summary strong { margin-top: 5px; font-family: "Be Vietnam Pro"; font-size: 11px; }
.creative-data-note { margin:0 17px 12px; padding:9px 11px; border-radius:9px; color:#68637b; background:#f7f6fa; font-size:10px; line-height:1.5; }
.coverage-list { padding-bottom: 10px; }.coverage-row { margin: 0 17px 8px; padding: 10px; display: grid; grid-template-columns: 32px minmax(260px,1fr) 110px 80px 100px; gap: 10px; align-items: center; border-radius: 10px; background: #f8f8fb; }.coverage-row > div strong,.coverage-row > div small,.coverage-row > span small,.coverage-row > span strong { display: block; }.coverage-row > div strong { font-size:10px; }.coverage-row > div small,.coverage-row > span small { margin-top: 3px; color: var(--muted); font-size:10px; }.coverage-row > span strong { margin-top: 3px; font-size:10px; }
.brief-item { margin: 0 17px 10px; padding: 13px; display: grid; grid-template-columns: 30px 1fr; gap: 11px; border: 1px solid var(--line); border-radius: 11px; }.brief-number { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: #29263f; font-size:10px; font-weight: 800; }.brief-item p,.brief-item h3 { margin: 0; }.brief-item p { color: var(--violet); font-size:10px; font-weight: 700; text-transform: uppercase; }.brief-item h3 { margin-top: 3px; font-size: 10px; }.brief-item > div > strong,.brief-item > div > small { display: block; }.brief-item > div > strong { margin-top: 7px; font-size:10px; }.brief-item > div > small { margin-top: 4px; color: var(--muted); font-size:10px; line-height: 1.5; }.brief-item footer { margin-top: 9px; display: flex; justify-content: space-between; gap: 8px; }.brief-item footer span,.brief-item footer b { padding: 4px 6px; border-radius: 6px; font-size:10px; }.brief-item footer span { color: #5d5870; background: #f1f0f5; }.brief-item footer b { color: var(--green); background: var(--green-soft); }
.empty-state { margin: 18px; color: var(--muted); font-size:10px; text-align: center; }
.alert-list { display: grid; gap: 11px; }
.alert-card { display: grid; grid-template-columns: 45px minmax(220px,1.5fr) repeat(3,minmax(90px,.5fr)) auto; gap: 14px; align-items: center; padding: 16px; }
.alert-severity { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; font-size: 18px; }.alert-severity.critical { color: var(--red); background: var(--red-soft); }.alert-severity.watch { color: var(--amber); background: var(--amber-soft); }.alert-severity.good { color: var(--green); background: var(--green-soft); }
.alert-card h3, .alert-card p { margin: 0; }.alert-card h3 { font-size: 12px; }.alert-card p { margin-top: 4px; color: var(--muted); font-size:10px; }
.alert-stat small, .alert-stat strong { display: block; }.alert-stat small { color: var(--muted); font-size:10px; text-transform: uppercase; }.alert-stat strong { margin-top: 4px; font-size: 11px; }
.integration-note { display: flex; gap: 12px; margin-bottom: 15px; padding: 15px 17px; border: 1px solid #dedaff; border-radius: 12px; color: #4c43a6; background: #f1efff; }
.integration-note p { margin: 3px 0 0; font-size: 10px; }
.integration-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.integration-card { padding: 20px; }
.integration-top { display: flex; align-items: center; justify-content: space-between; }
.integration-logo { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 13px; color: #fff; font-family: "Be Vietnam Pro"; font-weight: 800; }
.integration-logo.meta { background: #5e58e3; }.integration-logo.google { background: #269a6d; }.integration-logo.tiktok { background: #242333; }.integration-logo.appsflyer { background: linear-gradient(145deg,#18a97a,#237ccc); font-size: 12px; box-shadow: 0 8px 20px rgba(29,145,143,.22); }
.integration-logo.small { width: 35px; height: 35px; border-radius: 10px; font-size:10px; }
.integration-card h2 { margin: 19px 0 6px; font-size: 16px; }.integration-card > p { min-height: 40px; margin: 0 0 18px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.integration-card ul { min-height: 90px; margin: 0 0 18px; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); list-style: none; }
.integration-card li { margin: 7px 0; color: #5f5e6e; font-size: 10px; }
.integration-card li::before { content: "✓"; margin-right: 8px; color: var(--green); }
.integration-card .button { width: 100%; }
.meta-connect-modal { width:min(820px,100%); max-height:min(780px,calc(100vh - 40px)); overflow:auto; }
.meta-modal-head { display:grid; grid-template-columns:52px 1fr; gap:14px; padding-right:25px; align-items:start; }
.meta-modal-head .integration-logo { width:50px; height:50px; }
.meta-modal-head h2 { margin-top:3px; }.meta-modal-head > div > p:last-child { margin:5px 0 0; color:var(--muted); font-size:10px; line-height:1.55; }
.meta-steps { margin:20px 0; padding:12px 15px; display:flex; align-items:center; justify-content:center; gap:10px; border:1px solid var(--line); border-radius:11px; background:#faf9fd; }
.meta-steps span { display:flex; align-items:center; gap:6px; color:#9995a8; font-size:10px; font-weight:700; }.meta-steps span b { width:20px; height:20px; display:grid; place-items:center; border-radius:50%; color:#898595; background:#eceaf1; font-size:10px; }.meta-steps span.active { color:var(--violet); }.meta-steps span.active b { color:#fff; background:var(--violet); }.meta-steps i { width:45px; height:1px; background:var(--line); }
.meta-identity { margin-bottom:13px; padding:11px 13px; display:grid; grid-template-columns:34px 1fr auto; gap:10px; align-items:center; border:1px solid #d9e4ff; border-radius:11px; background:#f5f8ff; }.meta-identity > span { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; color:#fff; background:#1877f2; font-size:17px; font-weight:800; }.meta-identity small,.meta-identity strong { display:block; }.meta-identity small { color:#75809b; font-size:10px; }.meta-identity strong { margin-top:3px; font-size:10px; }
.meta-connect-state { padding:30px 22px; border:1px dashed #cfc9ee; border-radius:13px; background:#fbfaff; text-align:center; }.meta-connect-state h3 { margin:10px 0 6px; font-size:15px; }.meta-connect-state p { max-width:510px; margin:0 auto 17px; color:var(--muted); font-size:10px; line-height:1.6; }.meta-shield { width:42px; height:42px; margin:auto; display:grid; place-items:center; border-radius:13px; color:#fff; background:linear-gradient(145deg,#6258ed,#8277ff); box-shadow:0 8px 24px rgba(98,88,237,.25); font-size:18px; font-weight:800; }
.meta-account-toolbar { margin-bottom:10px; display:flex; justify-content:space-between; gap:14px; align-items:end; }.meta-account-toolbar strong,.meta-account-toolbar small { display:block; }.meta-account-toolbar strong { font-size:11px; }.meta-account-toolbar small { margin-top:4px; color:var(--muted); font-size:10px; }.meta-account-search { width:240px; height:36px; padding:0 10px; display:flex; align-items:center; gap:6px; border:1px solid var(--line); border-radius:9px; color:var(--muted); }.meta-account-search input { width:100%; border:0; outline:0; background:transparent; font:inherit; font-size:10px; }
.meta-account-list { max-height:360px; overflow:auto; border:1px solid var(--line); border-radius:12px; }.meta-business-group + .meta-business-group { border-top:1px solid var(--line); }.meta-business-head { padding:9px 12px; display:flex; justify-content:space-between; color:#716d80; background:#f8f7fb; font-size:10px; font-weight:800; text-transform:uppercase; }.meta-account-row { padding:11px 12px; display:grid; grid-template-columns:24px minmax(180px,1fr) 85px 155px; gap:10px; align-items:center; border-top:1px solid #efedf3; }.meta-account-row:first-of-type { border-top:0; }.meta-account-row input[type=checkbox] { width:16px; height:16px; accent-color:var(--violet); }.meta-account-name strong,.meta-account-name small { display:block; }.meta-account-name strong { font-size:10px; }.meta-account-name small { margin-top:3px; color:var(--muted); font-size:10px; }.meta-account-health { width:max-content; padding:4px 6px; border-radius:99px; color:var(--green); background:var(--green-soft); font-size:10px; font-weight:800; }.meta-account-health.blocked { color:var(--red); background:var(--red-soft); }.meta-account-row select { width:100%; height:34px; padding:0 8px; border:1px solid var(--line); border-radius:8px; color:var(--ink); background:#fff; font:inherit; font-size:10px; }.meta-account-row.disabled { opacity:.56; }.meta-modal-actions { padding-top:3px; }.meta-connect-modal .form-status { min-height:18px; margin:11px 0 0; font-size:10px; }
.meta-modal-actions .meta-disconnect { margin-right:auto; color:var(--red); }
.af-nav-icon { color: #168b79; background: #e3f8f3; font-size:10px; font-weight: 800; }
.af-eyebrow { color: #168b79; }.af-eyebrow span { background: #23b68d; box-shadow: 0 0 0 3px #d9f6ed; }
.af-sync-state { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }.af-sync-state > i { width: 8px; height: 8px; border-radius: 50%; background: #20a87e; box-shadow: 0 0 0 4px #e5f8f2; }.af-sync-state small,.af-sync-state strong { display: block; }.af-sync-state small { color: var(--muted); font-size:10px; text-transform: uppercase; }.af-sync-state strong { margin-top: 2px; font-size:10px; }
.af-source-strip { min-height: 60px; margin-bottom: 14px; padding: 11px 14px; display: flex; align-items: center; gap: 12px; border: 1px solid #d7eee8; border-radius: 13px; color: #32695d; background: #f0fbf8; }
.af-source-strip > div { display: flex; align-items: center; gap: 9px; }.af-source-strip p { flex: 1; margin: 0; font-size:10px; }.af-source-strip strong,.af-source-strip small { display: block; }.af-source-strip strong { color: #214e44; font-size: 10px; }.af-source-strip small { margin-top: 2px; color: #649086; font-size:10px; }.af-source-strip .text-button { margin: 0; white-space: nowrap; }
.af-filterbar { position:sticky; top:64px; z-index:7; margin-bottom: 14px; padding: 12px; display: grid; grid-template-columns: 1.25fr repeat(3,1fr) auto; gap: 9px; align-items: end; }
.af-filterbar label { display: grid; gap: 6px; margin: 0; }.af-filterbar label span { color: var(--muted); font-size:10px; font-weight: 700; text-transform: uppercase; }.af-filterbar select { width: 100%; height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font-size: 10px; }
.af-filterbar input { width: 100%; height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font: inherit; }
.af-custom-range { grid-column: 1/-1; display: grid; grid-template-columns: minmax(170px,240px) minmax(170px,240px) 1fr; gap: 9px; align-items: end; padding-top: 10px; border-top: 1px dashed var(--line); }
.af-custom-range[hidden] { display: none; }
.af-custom-range > small { align-self: center; color: var(--muted); font-size:10px; }
.af-metric-grid { display: grid; grid-template-columns: repeat(4,minmax(150px,1fr)); gap: 11px; margin-bottom: 14px; }
.af-estimate-note { margin: 10px 0 0; color: var(--muted); font-size:10px; }
.ua-badge { display: inline-flex; padding: 4px 8px; border-radius: 999px; color: #4f46e5; background: #eeedff; font-size:10px; font-weight: 800; }
.af-metric { min-height: 120px; }.af-metric .metric-icon { color: #178a77; background: #e7f8f3; }.delta.neutral { color: var(--violet); }
.af-dashboard-grid { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(330px,.75fr); gap: 14px; margin-bottom: 14px; }
.legend-line.af-cost { background: #23a985; }.legend-line.af-install { background: #6a5aee; }
.af-chart { height: 285px; padding: 20px 22px 17px; display: grid; grid-template-columns: repeat(9,1fr); gap: 13px; align-items: end; border-top: 1px solid #f1f0f5; background: linear-gradient(to bottom,transparent 24%,#f0eff4 25%,transparent 25.4%,transparent 49%,#f0eff4 50%,transparent 50.4%,transparent 74%,#f0eff4 75%,transparent 75.4%); }
.af-day { min-width: 0; display: grid; justify-items: center; gap: 5px; }.af-day-bars { width: 100%; max-width: 54px; height: 205px; display: flex; align-items: end; justify-content: center; gap: 4px; }.af-day-bars span { display: block; width: 42%; min-height: 8px; border-radius: 5px 5px 2px 2px; transition: height .25s; }.af-cost-bar { background: linear-gradient(#43c29e,#199473); }.af-install-bar { background: linear-gradient(#8b7ff5,#6253df); }.af-day strong { font-size:10px; }.af-day small { color: var(--muted); font-size:10px; }
.af-retention-card { padding-bottom: 17px; }.retention-legend { display: flex; gap: 14px; padding: 0 20px 15px; color: var(--muted); font-size:10px; }.retention-legend i { display: inline-block; width: 8px; height: 8px; margin-right: 5px; border-radius: 50%; }.retention-legend .paid { background: #6656ee; }.retention-legend .organic { background: #28ad87; }
.retention-row { display: grid; grid-template-columns: 30px 1fr 68px; gap: 10px; align-items: center; margin: 0 20px 17px; }.retention-row > strong { font-size: 10px; }.retention-track { position: relative; height: 23px; border-radius: 5px; background: #f0eff4; overflow: hidden; }.retention-track span { position: absolute; left: 0; height: 7px; min-width: 2px; border-radius: 0 4px 4px 0; }.retention-paid { top: 3px; background: #6656ee; }.retention-organic { bottom: 3px; background: #28ad87; }.retention-row > div:last-child { text-align: right; }.retention-row b,.retention-row small { display: block; font-size:10px; }.retention-row small { margin-top: 3px; color: var(--green); }.retention-note { margin: 5px 20px 0; padding: 11px; color: #746f94; border-radius: 9px; background: #f4f2ff; font-size:10px; line-height: 1.55; }
.af-comparison-card { margin-bottom: 14px; }.af-comparison-card .card-head p { margin: 4px 0 0; color: var(--muted); font-size:10px; }.af-comparison-grid { padding: 0 18px 18px; display: grid; grid-template-columns: repeat(7,1fr); gap: 8px; }.comparison-item { padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: #fbfbfd; }.comparison-item span,.comparison-item strong,.comparison-item small,.comparison-item b { display: block; }.comparison-item span { color: var(--muted); font-size:10px; text-transform: uppercase; }.comparison-item strong { margin-top: 9px; font-family: "Be Vietnam Pro"; font-size: 13px; }.comparison-item small { margin-top: 5px; color: #9996a5; font-size:10px; }.comparison-item b { margin-top: 8px; font-size:10px; }.comparison-item b.positive { color: var(--green); }.comparison-item b.negative { color: var(--red); }
.af-breakdown-card { margin-bottom: 14px; }.af-breakdown-card .card-head p { margin: 4px 0 0; color: var(--muted); font-size:10px; }.af-platform { display: inline-flex; align-items: center; font-weight: 700; }.af-platform i { width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; }.af-platform i.facebook { background: #645ae8; }.af-platform i.google { background: #2da174; }.af-platform i.tiktok { background: #242333; }.af-platform i.organic { background:#28ad87; }.af-platform i.other { background:#8a8f9e; }
.os-badge,.quality { display: inline-flex; padding: 4px 7px; border-radius: 8px; font-size:10px; font-weight: 700; }.os-badge.android { color: #167a59; background: #e5f7ef; }.os-badge.ios { color: #544ab1; background: #efedff; }.quality.good { color: var(--green); background: var(--green-soft); }.quality.fair { color: var(--amber); background: var(--amber-soft); }.quality.risk { color: var(--red); background: var(--red-soft); }
.af-live-card { margin-bottom:14px; overflow:hidden; }.af-live-card .card-head p { margin:4px 0 0; color:var(--muted); font-size:10px; }.af-live-grid { padding:0 18px 18px; display:grid; grid-template-columns:repeat(4,1fr); gap:9px; }.af-live-grid > div { padding:13px; border:1px solid var(--line); border-radius:11px; background:#fbfbfd; }.af-live-grid span,.af-live-grid strong,.af-live-grid small { display:block; }.af-live-grid span { color:var(--muted); font-size:10px; font-weight:700; text-transform:uppercase; }.af-live-grid strong { margin-top:7px; font-size:10px; }.af-live-grid strong.ready { color:var(--green); }.af-live-grid small { margin-top:4px; color:#9996a5; font-size:10px; }.af-endpoint-row { padding:14px 18px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-top:1px solid var(--line); background:#f7fbfa; }.af-endpoint-row > div { min-width:0; }.af-endpoint-row small,.af-endpoint-row code { display:block; }.af-endpoint-row small { color:var(--muted); font-size:10px; text-transform:uppercase; }.af-endpoint-row code { margin-top:5px; overflow:hidden; color:#256d5d; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.af-admin-card { padding: 20px; display: flex; align-items: center; justify-content: space-between; gap: 30px; color: #fff; border: 0; background: radial-gradient(circle at 88% 0,#384e67,transparent 36%),#1d2635; }.af-admin-copy { display: flex; align-items: center; gap: 15px; }.af-admin-copy h2 { margin: 5px 0; font-family: "Be Vietnam Pro"; font-size: 17px; }.af-admin-copy p:not(.card-kicker) { max-width: 530px; margin: 0; color: #9fa9b6; font-size:10px; line-height: 1.6; }.af-admin-steps { display: flex; align-items: center; gap: 9px; }.af-admin-steps > span { min-width: 105px; padding: 10px; border: 1px solid #384657; border-radius: 10px; background: rgba(255,255,255,.035); }.af-admin-steps b { float: left; width: 21px; height: 21px; margin-right: 7px; display: grid; place-items: center; border-radius: 6px; color: #bcb4ff; background: #373351; font-size:10px; }.af-admin-steps small,.af-admin-steps strong { display: block; }.af-admin-steps small { color: #8d98a6; font-size:10px; }.af-admin-steps strong { margin-top: 3px; font-size:10px; }.af-admin-steps .button { white-space: nowrap; }
.pf-nav-icon { color: #3458ad; background: #e8efff; font-size:10px; font-weight: 800; }
.pf-eyebrow { color: #3f5fba; }.pf-eyebrow span { background: #5475d5; box-shadow: 0 0 0 3px #e2e9ff; }
.source-logo-stack { min-width: 76px; display: flex; align-items: center; }
.source-logo-stack i { width: 31px; height: 31px; display: grid; place-items: center; margin-left: -7px; border: 3px solid #fff; border-radius: 10px; color: #fff; font-style: normal; font-family: "Be Vietnam Pro"; font-size:10px; font-weight: 800; }
.source-logo-stack i:first-child { margin-left: 0; }.source-logo-stack .meta { background: #5e58e3; }.source-logo-stack .google { background: #269a6d; }.source-logo-stack .tiktok { background: #242333; }
.source-logo-stack.single { min-width: 37px; }
.command-workspace-links { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.command-workspace-links span { color: var(--muted); font-size:10px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.command-workspace-links .button { height: 30px; padding: 0 11px; font-size: 11px; }
.platform-source-card { margin-top: 14px; border-color: #dce4f8; background: linear-gradient(120deg,#fff 65%,#f4f7ff); }
.pf-source-strip { min-height: 62px; margin-bottom: 14px; padding: 11px 14px; display: flex; align-items: center; gap: 13px; border: 1px solid #dce4f7; border-radius: 13px; color: #53668d; background: #f4f7ff; }
.pf-source-strip > div:nth-child(2) { min-width: 230px; }.pf-source-strip strong,.pf-source-strip small { display: block; }.pf-source-strip strong { color: #293a65; font-size: 10px; }.pf-source-strip small { margin-top: 3px; color: #7887a8; font-size:10px; }.pf-source-strip > p { flex: 1; margin: 0; font-size:10px; }.pf-source-strip .text-button { margin: 0; white-space: nowrap; }
.pf-sync-state > i { background: #5372d3; box-shadow: 0 0 0 4px #e8edff; }
.pf-filterbar { position:sticky; top:64px; z-index:7; margin-bottom: 17px; padding: 12px; display: grid; grid-template-columns: 1.2fr repeat(4,1fr) auto; gap: 9px; align-items: end; }
.pf-filterbar label { display: grid; gap: 6px; margin: 0; }.pf-filterbar label span { color: var(--muted); font-size:10px; font-weight: 700; text-transform: uppercase; }.pf-filterbar select { width: 100%; height: 38px; padding: 0 9px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font-size:10px; }
.metric-section-head { margin: 0 2px 10px; display: flex; align-items: end; justify-content: space-between; }.metric-section-head h2 { margin: 3px 0 0; font-family: "Be Vietnam Pro"; font-size: 16px; }.metric-section-head > span { color: var(--muted); font-size:10px; }
.pf-primary-grid { display: grid; grid-template-columns: repeat(6,minmax(130px,1fr)); gap: 11px; margin-bottom: 14px; }
.pf-primary-metric { min-height: 120px; }.pf-primary-metric .metric-icon { color: #4563bc; background: #edf1ff; }
.pf-secondary-card { margin-bottom: 14px; }.pf-secondary-grid { padding: 0 18px 18px; display: grid; grid-template-columns: repeat(8,1fr); gap: 7px; }
.pf-secondary-grid > div { min-width: 0; padding: 12px 10px; border: 1px solid #ececf2; border-radius: 10px; background: #fbfbfd; }.pf-secondary-grid span,.pf-secondary-grid strong,.pf-secondary-grid small { display: block; }.pf-secondary-grid span { color: var(--muted); font-size:10px; font-weight: 700; text-transform: uppercase; }.pf-secondary-grid strong { margin-top: 7px; overflow: hidden; font-family: "Be Vietnam Pro"; font-size: 12px; text-overflow: ellipsis; }.pf-secondary-grid small { margin-top: 5px; color: #9996a5; font-size:10px; }
.pf-dashboard-grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(360px,.7fr); gap: 14px; margin-bottom: 14px; }
.legend-line.pf-cost { background: #5473d1; }.legend-line.pf-click { background: #28a97e; }.legend-line.pf-install { background: #e59a3f; }
.pf-chart { height: 285px; padding: 20px 22px 17px; display: grid; grid-template-columns: repeat(9,1fr); gap: 12px; align-items: end; border-top: 1px solid #f1f0f5; background: linear-gradient(to bottom,transparent 24%,#f0eff4 25%,transparent 25.4%,transparent 49%,#f0eff4 50%,transparent 50.4%,transparent 74%,#f0eff4 75%,transparent 75.4%); }
.pf-day { min-width: 0; display: grid; justify-items: center; gap: 5px; }.pf-day-bars { width: 100%; max-width: 60px; height: 205px; display: flex; align-items: end; justify-content: center; gap: 3px; }.pf-day-bars span { display: block; width: 29%; min-height: 7px; border-radius: 5px 5px 2px 2px; }.pf-cost-bar { background: linear-gradient(#7691df,#4f6cc8); }.pf-click-bar { background: linear-gradient(#50c49e,#239876); }.pf-install-bar { background: linear-gradient(#f0b666,#d98b32); }.pf-day strong { font-size:10px; }.pf-day small { color: var(--muted); font-size:10px; }
.pf-scorecard { overflow: hidden; }.pf-score-row { margin: 0 17px 11px; padding: 12px; display: grid; grid-template-columns: 36px 1fr 70px 58px auto; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 11px; }.pf-score-row > div strong,.pf-score-row > div small,.pf-score-row > div span { display: block; }.pf-score-row > div:first-of-type strong { font-size: 10px; }.pf-score-row small,.pf-score-row span { margin-top: 3px; color: var(--muted); font-size:10px; }.pf-score-row > b { padding: 5px 7px; border-radius: 8px; font-size:10px; white-space: nowrap; }.pf-score-row > b.good { color: var(--green); background: var(--green-soft); }.pf-score-row > b.risk { color: var(--red); background: var(--red-soft); }
.pf-comparison-card,.pf-breakdown-card,.pf-explorer-card { margin-bottom: 14px; }.pf-comparison-card .card-head p,.pf-breakdown-card .card-head p,.pf-explorer-card .card-head p { margin: 4px 0 0; color: var(--muted); font-size:10px; }.pf-comparison-grid { padding: 0 18px 18px; display: grid; grid-template-columns: repeat(9,1fr); gap: 7px; }
.wide-table { overflow-x: auto; }.wide-table table { min-width: 1180px; }.wide-table th,.wide-table td { white-space: nowrap; }
.metric-mode { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: #f7f7fa; }.metric-mode button { padding: 7px 10px; border: 0; border-radius: 7px; color: var(--muted); background: transparent; font-size:10px; font-weight: 700; }.metric-mode button.active { color: #fff; background: var(--violet); box-shadow: 0 4px 10px rgba(101,86,238,.22); }
.audit-layout { display: grid; grid-template-columns: 1.1fr .9fr; gap: 14px; }
.approval-item { margin: 0 17px 11px; padding: 14px; border: 1px solid var(--line); border-radius: 11px; }
.approval-item h3 { margin: 0 0 5px; font-size: 12px; }.approval-item p { margin: 0; color: var(--muted); font-size:10px; }
.approval-actions { display: flex; gap: 7px; margin-top: 12px; }.approval-actions .button { min-height: 30px; font-size:10px; }
.timeline { padding: 0 19px 18px; }
.timeline-item { position: relative; padding: 4px 0 18px 22px; border-left: 1px solid var(--line); }
.timeline-item::before { content: ""; position: absolute; left: -4px; top: 6px; width: 7px; height: 7px; border-radius: 50%; background: var(--violet); }
.timeline-item:last-child { border-left-color: transparent; }
.timeline-item strong, .timeline-item small { display: block; }.timeline-item strong { font-size: 10px; }.timeline-item small { margin-top: 4px; color: var(--muted); font-size:10px; }
.team-summary { display: grid; grid-template-columns: .8fr 1.2fr; gap: 14px; margin-bottom: 14px; }
.seat-card, .assignment-card { min-height: 155px; padding: 22px; }
.seat-card h2, .assignment-card h2 { margin: 8px 0 5px; font-family: "Be Vietnam Pro"; font-size: 19px; letter-spacing: -.025em; }
.seat-card p:not(.card-kicker), .assignment-card p:not(.card-kicker) { margin: 0; color: var(--muted); font-size: 10px; }
.seat-track { height: 7px; margin-top: 27px; border-radius: 8px; background: #ecebf3; overflow: hidden; }.seat-track span { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg,var(--violet),#9a8cff); transition: width .35s ease; }
.assignment-card { color: #fff; border: 0; background: radial-gradient(circle at 90% 10%,#443b6a,transparent 34%),#211e37; }.assignment-card p:not(.card-kicker) { max-width: 530px; color: #aaa6ba; line-height: 1.6; }
.team-table-card { overflow: hidden; }
.member-cell { display: flex; align-items: center; gap: 10px; }.member-cell > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: var(--violet); font-size:10px; font-weight: 800; }.member-cell strong,.member-cell small { display: block; }.member-cell strong { font-size: 11px; }.member-cell small { margin-top: 3px; color: var(--muted); font-size:10px; }
.role-badge { padding: 5px 8px; border-radius: 9px; color: #4f45a6; background: var(--violet-soft); font-size:10px; font-weight: 700; }
.member-role-select { min-width: 142px; padding: 7px 28px 7px 9px; border: 1px solid var(--line); border-radius: 9px; color: #4f45a6; background: #fff; font: inherit; font-size: 10px; font-weight: 700; }
.member-role-select:disabled { cursor: wait; opacity: .65; }
.member-status { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size:10px; }.member-status i { width: 7px; height: 7px; border-radius: 50%; background: #aaa; }.member-status.active i { background: var(--green); }.member-status.invited i { background: var(--amber); }.member-status.disabled i { background: var(--red); }
.permission-card { padding: 28px; display: flex; gap: 18px; align-items: center; }.permission-card > span { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 13px; color: var(--violet); background: var(--violet-soft); font-size: 20px; }.permission-card h2 { margin: 0 0 5px; font-size: 15px; }.permission-card p { margin: 0; color: var(--muted); font-size: 10px; }
.form-status { min-height: 14px; color: var(--muted); font-size:10px; }.form-status[data-tone="success"] { color: var(--green); }.form-status[data-tone="error"] { color: var(--red); }
.modal-backdrop { position: fixed; inset: 0; z-index: 50; display: none; place-items: center; padding: 20px; background: rgba(21,20,41,.52); backdrop-filter: blur(5px); }
.modal-backdrop.open { display: grid; }
.modal { position: relative; width: min(480px,100%); padding: 27px; border-radius: 18px; background: #fff; box-shadow: 0 30px 70px rgba(20,17,49,.2); }
.modal h2 { margin: 8px 0 5px; font-family: "Be Vietnam Pro"; font-size: 22px; }.modal > p:not(.eyebrow) { margin: 0 0 22px; color: var(--muted); font-size: 11px; }
.modal-close { position: absolute; right: 16px; top: 13px; border: 0; color: var(--muted); background: transparent; font-size: 25px; }
form label { display: grid; gap: 6px; margin-bottom: 13px; color: #4f4e5e; font-size: 10px; font-weight: 700; }
form input, form select { width: 100%; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 19px; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 60; max-width: 330px; padding: 12px 16px; border-radius: 10px; color: #fff; background: #222036; box-shadow: var(--shadow); font-size: 11px; opacity: 0; transform: translateY(10px); pointer-events: none; transition: .2s; }
.toast.show { opacity: 1; transform: none; }

/* Planning, intelligence, reporting and data-trust modules */
.budget-nav-icon,.brief-nav-icon,.report-nav-icon,.audit-nav-icon,.health-nav-icon { font-size:10px; font-weight:800; }
.budget-nav-icon { color:#bd7a1c; background:#fff1dc; }.brief-nav-icon { color:#6551ce; background:#eeebff; }.report-nav-icon { color:#287b9d; background:#e4f5fb; }.audit-nav-icon { color:#b54d4d; background:#ffeaea; }.health-nav-icon { color:#25886b; background:#e0f7ef; }
.budget-metric-grid,.health-metric-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:14px; }.brief-metric-grid,.report-metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:14px; }.budget-metric-grid .metric,.brief-metric-grid .metric,.report-metric-grid .metric,.health-metric-grid .metric { min-height:118px; }
.budget-eyebrow span { background:#d39238; }.brief-eyebrow span { background:#6954d7; }.report-eyebrow span { background:#2885a8; }.audit360-eyebrow span { background:#d35a5a; }.health-eyebrow span { background:#2c9c79; }
.budget-control-card { padding-bottom:20px; margin-bottom:14px; }.budget-period,.report-tabs { display:flex; gap:3px; padding:3px; border:1px solid var(--line); border-radius:9px; background:#f7f7fa; }.budget-period button,.report-tabs button { min-height:27px; padding:0 11px; border:0; border-radius:7px; color:var(--muted); background:transparent; font-size:10px; font-weight:700; }.budget-period button.active,.report-tabs button.active { color:#4f45a6; background:#fff; box-shadow:0 2px 7px rgba(25,22,51,.08); }
.budget-control-layout { display:grid; grid-template-columns:270px 1fr; gap:30px; align-items:center; padding:8px 28px 6px; }.budget-orbit { display:grid; place-items:center; text-align:center; }.budget-orbit-ring { --pace:252deg; width:154px; height:154px; display:grid; place-items:center; border-radius:50%; background:conic-gradient(var(--violet) var(--pace),#ecebf3 0); position:relative; }.budget-orbit-ring::before { content:""; position:absolute; inset:14px; border-radius:50%; background:#fff; }.budget-orbit-ring > div { position:relative; z-index:1; }.budget-orbit-ring strong,.budget-orbit-ring span { display:block; }.budget-orbit-ring strong { font-family:"Be Vietnam Pro"; font-size:27px; }.budget-orbit-ring span { margin-top:3px; color:var(--muted); font-size:10px; }.budget-orbit p { margin:12px 0 3px; font-size:10px; }.budget-orbit p strong { font-size:13px; }.budget-orbit > small { color:var(--muted); font-size:10px; }
.budget-trend-head { display:grid; grid-template-columns:1fr auto; align-items:end; }.budget-trend-head span,.budget-trend-head small { color:var(--muted); font-size:10px; }.budget-trend-head strong { font-family:"Be Vietnam Pro"; font-size:17px; }.budget-trend-head small { grid-column:2; }.budget-bars { height:155px; margin-top:17px; display:flex; align-items:end; gap:8px; border-bottom:1px solid var(--line); background:repeating-linear-gradient(to top,transparent 0,transparent 38px,#f1f0f5 39px); }.budget-bars > span { position:relative; flex:1; max-width:26px; min-height:12%; border-radius:5px 5px 0 0; background:linear-gradient(#8175e5,#5f54c7); }.budget-bars > span i { position:absolute; left:50%; bottom:-18px; color:var(--muted); font-size:10px; font-style:normal; transform:translateX(-50%); }.budget-legend { margin-top:26px; display:flex; gap:16px; color:var(--muted); font-size:10px; }.budget-legend span { display:flex; align-items:center; gap:6px; }.budget-legend i { width:8px; height:8px; border-radius:3px; background:var(--violet); }.budget-legend span:last-child i { border:1px dashed var(--muted); background:transparent; }
.budget-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:14px; margin-bottom:14px; }.budget-owner-row { padding:10px 18px; display:grid; grid-template-columns:32px 1fr 90px 65px; gap:9px; align-items:center; border-top:1px solid #f0eff4; }.budget-owner-row > span { width:30px; height:30px; display:grid; place-items:center; border-radius:9px; color:#fff; background:var(--violet); font-size:10px; font-weight:800; }.budget-owner-row strong,.budget-owner-row small { display:block; }.budget-owner-row div > strong { font-size:10px; }.budget-owner-row div > small,.budget-owner-row b small { margin-top:3px; color:var(--muted); font-size:10px; }.budget-owner-row > b { text-align:right; font-size:10px; }.budget-owner-track,.pacing-cell > span { height:5px; border-radius:5px; background:#ecebf2; overflow:hidden; }.budget-owner-track i,.pacing-cell i { display:block; height:100%; border-radius:inherit; background:var(--violet); }
.budget-opportunity { padding:11px 18px; display:grid; grid-template-columns:28px 1fr auto auto; gap:9px; align-items:center; border-top:1px solid #f0eff4; }.budget-opportunity > span { width:27px; height:27px; display:grid; place-items:center; border-radius:8px; color:var(--green); background:#e7f7f1; }.budget-opportunity strong,.budget-opportunity small { display:block; }.budget-opportunity strong { font-size:10px; }.budget-opportunity small { margin-top:3px; color:var(--muted); font-size:10px; }.budget-opportunity > b { color:var(--green); font-size:10px; }.budget-opportunity button { border:0; color:var(--violet); background:transparent; font-size:10px; font-weight:800; }.budget-table-card { overflow:hidden; }.pacing-cell { min-width:115px; display:grid; grid-template-columns:1fr 30px; gap:7px; align-items:center; }.pacing-cell b { font-size:10px; }.variance-over { color:var(--red); font-weight:700; }.variance-under { color:var(--green); font-weight:700; }
.daily-brief-banner { margin-bottom:14px; padding:28px 32px; display:flex; justify-content:space-between; align-items:center; border-radius:16px; color:#fff; background:radial-gradient(circle at 80% 10%,#55458e,transparent 35%),linear-gradient(120deg,#211d39,#35305b); box-shadow:var(--shadow); }.daily-brief-banner span { color:#b7b0d0; font-size:10px; font-weight:800; letter-spacing:.12em; }.daily-brief-banner h2 { margin:8px 0 5px; font-family:"Be Vietnam Pro"; font-size:23px; }.daily-brief-banner p { margin:0; color:#bdb8ce; font-size:10px; }.daily-brief-banner p strong { color:#fff; }.brief-score { width:120px; height:120px; display:grid; place-items:center; align-content:center; flex:0 0 auto; border:1px solid rgba(255,255,255,.15); border-radius:50%; background:rgba(255,255,255,.06); }.brief-score strong { font-family:"Be Vietnam Pro"; font-size:31px; }.brief-score span,.brief-score small { display:block; margin-top:2px; color:#c7c1da; font-size:10px; letter-spacing:0; }.brief-main-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:14px; margin-bottom:14px; }.brief-decision { padding:12px 18px; display:grid; grid-template-columns:72px 1fr auto; gap:10px; align-items:center; border-top:1px solid #f0eff4; }.brief-decision > span { padding:6px 7px; border-radius:7px; text-align:center; color:#b54a4a; background:#ffeaea; font-size:10px; font-weight:800; }.brief-decision.scale > span { color:#287b62; background:#e1f6ee; }.brief-decision.warning > span,.brief-decision.data > span { color:#9f691d; background:#fff1d9; }.brief-decision strong,.brief-decision small,.brief-decision p { display:block; }.brief-decision strong { font-size:10px; }.brief-decision small { margin-top:3px; color:var(--muted); font-size:10px; }.brief-decision p { margin:4px 0 0; color:#6c648e; font-size:10px; font-weight:700; }.brief-decision button { border:0; color:var(--violet); background:transparent; font-size:10px; font-weight:800; }.brief-summary-card { background:linear-gradient(145deg,#fff,#faf9ff); }.brief-narrative { padding:0 20px 16px; }.brief-narrative p { margin:0 0 13px; color:#656372; font-size:10px; line-height:1.65; }.brief-narrative p strong { color:#242231; }.brief-confidence { padding:13px 20px 18px; display:grid; grid-template-columns:auto 1fr auto; gap:9px; align-items:center; border-top:1px solid var(--line); }.brief-confidence span,.brief-confidence strong { font-size:10px; }.brief-confidence div { height:5px; border-radius:5px; background:#ecebf2; overflow:hidden; }.brief-confidence i { display:block; height:100%; background:var(--green); }
.brief-bottom-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.brief-team-row,.brief-signal { padding:10px 18px; display:flex; align-items:center; gap:9px; border-top:1px solid #f0eff4; }.brief-team-row > span { width:29px; height:29px; display:grid; place-items:center; border-radius:9px; color:#fff; background:#6258c8; font-size:10px; font-weight:800; }.brief-team-row div { flex:1; }.brief-team-row strong,.brief-team-row small { display:block; }.brief-team-row div strong { font-size:10px; }.brief-team-row div small { margin-top:3px; color:var(--muted); font-size:10px; }.brief-team-row > b { font-size:10px; }.brief-team-row > b.red { color:var(--red); }.brief-team-row > b.amber { color:#a16a20; }.brief-team-row > b.green { color:var(--green); }.brief-signal i { width:7px; height:7px; border-radius:50%; background:var(--red); }.brief-signal.winner i { background:var(--green); }.brief-signal strong,.brief-signal small { display:block; }.brief-signal strong { font-size:10px; }.brief-signal small { margin-top:3px; color:var(--muted); font-size:10px; }.brief-plan-row { min-height:46px; padding:0 18px; display:grid; grid-template-columns:42px 8px 1fr; gap:8px; align-items:center; }.brief-plan-row time { color:var(--muted); font-size:10px; }.brief-plan-row span { width:7px; height:7px; border-radius:50%; background:var(--violet); box-shadow:0 0 0 4px var(--violet-soft); }.brief-plan-row strong { font-size:10px; }
.report-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:14px; margin-bottom:14px; }.report-library-card,.delivery-card { overflow:hidden; }.report-row { padding:12px 18px; display:grid; grid-template-columns:32px 1fr 110px 70px 22px; gap:9px; align-items:center; border-top:1px solid #f0eff4; }.report-row > span:first-child { width:30px; height:30px; display:grid; place-items:center; border-radius:8px; color:#257b9d; background:#e3f4fa; font-size:10px; font-weight:800; }.report-row strong,.report-row small { display:block; }.report-row div strong { font-size:10px; }.report-row div small,.report-row time { margin-top:3px; color:var(--muted); font-size:10px; }.report-row > button { border:0; color:var(--muted); background:transparent; }.report-template { width:calc(100% - 36px); margin:0 18px 9px; padding:10px; display:grid; grid-template-columns:29px 1fr auto; gap:9px; align-items:center; border:1px solid var(--line); border-radius:10px; text-align:left; background:#fff; }.report-template > span { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; color:var(--violet); background:var(--violet-soft); }.report-template strong,.report-template small { display:block; }.report-template strong { font-size:10px; }.report-template small { margin-top:3px; color:var(--muted); font-size:10px; }.report-template b { color:var(--muted); font-size:10px; }.schedule-row { padding:12px 20px; display:grid; grid-template-columns:46px 55px 1fr 95px 8px 34px; gap:10px; align-items:center; border-top:1px solid #f0eff4; }.schedule-row > span { color:#4f45a6; font-size:10px; font-weight:800; }.schedule-row time { font-size:10px; font-weight:700; }.schedule-row strong,.schedule-row small { display:block; }.schedule-row div strong { font-size:10px; }.schedule-row div small,.schedule-row > b { margin-top:3px; color:var(--muted); font-size:10px; }.schedule-row > i { width:7px; height:7px; border-radius:50%; background:var(--green); }.schedule-row > button { border:0; color:var(--green); background:transparent; font-size:10px; font-weight:800; }
.audit360-hero { display:grid; grid-template-columns:1.1fr 1fr; gap:14px; margin-bottom:14px; }.audit-score-card { min-height:150px; padding:24px 28px; display:flex; align-items:center; gap:24px; border-radius:16px; color:#fff; background:radial-gradient(circle at 100% 0,#774c5d,transparent 35%),#29243d; box-shadow:var(--shadow); }.audit-score-ring { width:104px; height:104px; display:grid; place-items:center; align-content:center; border-radius:50%; background:conic-gradient(#7be0b7 280deg,rgba(255,255,255,.12) 0); position:relative; }.audit-score-ring::before { content:""; position:absolute; inset:10px; border-radius:50%; background:#29243d; }.audit-score-ring strong,.audit-score-ring span { position:relative; z-index:1; }.audit-score-ring strong { font-family:"Be Vietnam Pro"; font-size:28px; }.audit-score-ring span { color:#aaa4bb; font-size:10px; }.audit-score-card p { margin:0; color:#aaa4bb; font-size:10px; letter-spacing:.1em; }.audit-score-card h2 { margin:7px 0 5px; max-width:400px; font-family:"Be Vietnam Pro"; font-size:18px; }.audit-score-card > div:last-child > span { color:#8de1bc; font-size:10px; }.audit360-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }.audit360-metrics article { padding:18px; display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:var(--shadow); }.audit360-metrics article > span { width:9px; height:9px; border-radius:50%; background:var(--amber); }.audit360-metrics article > span.red { background:var(--red); }.audit360-metrics article > span.green { background:var(--green); }.audit360-metrics small,.audit360-metrics strong,.audit360-metrics p { display:block; }.audit360-metrics small { color:var(--muted); font-size:10px; }.audit360-metrics strong { margin-top:5px; font-family:"Be Vietnam Pro"; font-size:22px; }.audit360-metrics p { margin:2px 0 0; color:var(--muted); font-size:10px; }.audit360-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:14px; margin-bottom:14px; }.audit-dimension { padding:10px 18px; display:grid; grid-template-columns:145px 1fr 28px; gap:9px; align-items:center; border-top:1px solid #f0eff4; }.audit-dimension strong,.audit-dimension small { display:block; }.audit-dimension strong { font-size:10px; }.audit-dimension small { margin-top:3px; color:var(--muted); font-size:10px; }.audit-dimension > span,.audit-account-track { height:6px; border-radius:5px; background:#ecebf2; overflow:hidden; }.audit-dimension i,.audit-account-track i { display:block; height:100%; background:var(--green); }.audit-dimension i.amber,.audit-account-track i.amber { background:var(--amber); }.audit-dimension i.red,.audit-account-track i.red { background:var(--red); }.audit-dimension b { font-size:10px; }.audit-fix { padding:11px 18px; display:grid; grid-template-columns:8px 1fr 70px 54px; gap:9px; align-items:center; border-top:1px solid #f0eff4; }.audit-fix > i { width:7px; height:7px; border-radius:50%; background:var(--red); }.audit-fix.warning > i { background:var(--amber); }.audit-fix strong,.audit-fix small { display:block; }.audit-fix strong { font-size:10px; }.audit-fix small { margin-top:3px; color:var(--muted); font-size:10px; }.audit-fix > span { color:var(--muted); font-size:10px; }.audit-fix button { border:0; color:var(--violet); background:transparent; font-size:10px; font-weight:800; }.audit-account-card { overflow:hidden; }.audit-account-row { padding:11px 18px; display:grid; grid-template-columns:30px 1fr 150px 30px 50px 55px; gap:9px; align-items:center; border-top:1px solid #f0eff4; }.audit-account-row > span { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; color:#fff; background:#6258c8; font-size:10px; font-weight:800; }.audit-account-row strong,.audit-account-row small { display:block; }.audit-account-row div strong { font-size:10px; }.audit-account-row div small,.audit-account-row > small { margin-top:3px; color:var(--muted); font-size:10px; }.audit-account-row > b { font-size:10px; }.audit-account-row > button { border:0; color:var(--violet); background:transparent; font-size:10px; font-weight:800; }
.health-status-banner { margin-bottom:14px; padding:18px 24px; display:flex; align-items:center; gap:17px; border:1px solid #cde9df; border-radius:14px; background:linear-gradient(90deg,#f0fbf7,#fbfefd); }.health-pulse { width:48px; height:48px; display:grid; place-items:center; align-content:center; border-radius:12px; color:var(--green); background:#dcf5ec; }.health-pulse i { width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 5px rgba(44,156,121,.12); }.health-pulse span { margin-top:7px; color:var(--green); font-size:10px; font-weight:800; }.health-status-banner h2 { margin:0 0 4px; font-family:"Be Vietnam Pro"; font-size:16px; }.health-status-banner p { margin:0; color:var(--muted); font-size:10px; }.health-status-banner > span { margin-left:auto; color:var(--muted); font-size:10px; }.health-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }.health-connector { padding:11px 18px; display:grid; grid-template-columns:31px 1fr 120px 75px; gap:9px; align-items:center; border-top:1px solid #f0eff4; }.health-connector > span { width:29px; height:29px; display:grid; place-items:center; border-radius:8px; color:#fff; background:#6258c8; font-size:10px; font-weight:800; }.health-connector strong,.health-connector small { display:block; }.health-connector div strong { font-size:10px; }.health-connector div small,.health-connector p { margin:3px 0 0; color:var(--muted); font-size:10px; }.health-connector > b { display:flex; align-items:center; gap:5px; color:var(--green); font-size:10px; }.health-connector > b.amber { color:#a36d20; }.health-connector > b i { width:6px; height:6px; border-radius:50%; background:currentColor; }.health-gap-head,.health-gap-row { padding:9px 18px; display:grid; grid-template-columns:1fr repeat(3,72px); gap:8px; align-items:center; }.health-gap-head { color:var(--muted); background:#fafafd; font-size:10px; }.health-gap-row { border-top:1px solid #f0eff4; font-size:10px; }.health-gap-row b.good { color:var(--green); }.health-gap-row b.risk { color:var(--red); }.health-gap-note { margin:12px 18px 16px; padding:10px; display:flex; gap:9px; border-radius:10px; color:#9d671f; background:#fff4e2; }.health-gap-note > i { width:22px; height:22px; display:grid; place-items:center; border-radius:7px; background:#ffe6ba; font-style:normal; font-weight:800; }.health-gap-note strong,.health-gap-note small { display:block; }.health-gap-note strong { font-size:10px; }.health-gap-note small { margin-top:3px; font-size:10px; }.health-incident-card { overflow:hidden; }.health-incident { padding:12px 20px; display:grid; grid-template-columns:28px 1fr 100px 90px 54px; gap:10px; align-items:center; border-top:1px solid #f0eff4; }.health-incident > span { width:26px; height:26px; display:grid; place-items:center; border-radius:8px; color:#a56d1e; background:#fff0d9; font-size:10px; font-weight:800; }.health-incident.resolved > span { color:var(--green); background:#e2f6ef; }.health-incident strong,.health-incident small { display:block; }.health-incident div strong { font-size:10px; }.health-incident div small,.health-incident time { margin-top:3px; color:var(--muted); font-size:10px; }.health-incident > b { color:#9c671f; font-size:10px; }.health-incident.resolved > b { color:var(--green); }.health-incident button { border:0; color:var(--violet); background:transparent; font-size:10px; font-weight:800; }
.creative-lifecycle-card { margin-bottom:14px; overflow:hidden; }.creative-board { padding:0 16px 17px; display:grid; grid-template-columns:repeat(6,minmax(140px,1fr)); gap:8px; overflow-x:auto; }.creative-board-column { min-width:140px; padding:9px; border:1px solid var(--line); border-radius:11px; background:#f8f8fb; }.creative-board-column > header { padding:2px 2px 9px; display:flex; align-items:center; justify-content:space-between; }.creative-board-column > header strong { font-size:10px; }.creative-board-column > header span { min-width:20px; padding:3px 5px; border-radius:6px; text-align:center; color:var(--muted); background:#ecebf2; font-size:10px; }.creative-board-item { width:100%; margin-bottom:7px; padding:9px; display:grid; grid-template-columns:24px 1fr; gap:5px 7px; border:1px solid var(--line); border-radius:9px; text-align:left; background:#fff; box-shadow:0 3px 8px rgba(24,22,47,.04); }.creative-board-item > span { width:23px; height:23px; grid-row:1/3; display:grid; place-items:center; border-radius:7px; color:#fff; background:#6a5fd1; font-size:10px; font-weight:800; }.creative-board-item strong,.creative-board-item small { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.creative-board-item strong { font-size:10px; }.creative-board-item small { color:var(--muted); font-size:10px; }.creative-board-item b { grid-column:1/-1; padding-top:5px; border-top:1px solid #f0eff4; color:#5e56a7; font-size:10px; }.creative-board-item.winner b { color:var(--green); }.creative-board-item.fatigue b { color:var(--red); }.creative-board-add { width:100%; padding:7px; border:1px dashed #d8d6e2; border-radius:8px; color:var(--muted); background:transparent; font-size:10px; }

/* Be Vietnam Pro readability system */
*, *::before, *::after { font-family:"Be Vietnam Pro",sans-serif !important; }
body { font-size:14px; line-height:1.5; text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; }
.brand strong { font-size:16px; letter-spacing:-.02em; }.brand small { font-size:10px; letter-spacing:.09em; }
.workspace strong { font-size:12px; }.workspace small { font-size:10px; }
.nav-label { font-size:10px; letter-spacing:.1em; }.nav-item { height:44px; font-size:12px; line-height:1.25; }.nav-icon { font-size:16px; }.nav-count { font-size:10px; }
.breadcrumb { font-size:12px; }.user-menu-head strong { font-size:12px; }.user-menu-head small,.user-menu > button { font-size:10px; }
.page-head { margin-bottom:28px; }.page-head h1 { font-size:32px; line-height:1.2; letter-spacing:-.025em; }.page-head p:not(.eyebrow) { max-width:780px; font-size:12px; line-height:1.65; }
.eyebrow,.card-kicker { font-size:10px; letter-spacing:.1em; }.button { min-height:40px; font-size:12px; }
.card-head { padding:20px 20px 16px; }.card-head h2 { font-size:17px; line-height:1.35; letter-spacing:-.015em; }.card-head p { font-size:11px !important; line-height:1.55; }
.metric { min-height:128px; padding:18px; }.metric-label { font-size:10px; letter-spacing:.06em; }.metric strong { font-size:24px; }.metric small { font-size:10px; line-height:1.45; }
#overview .metric { min-height:116px; padding:15px 16px; }#overview .metric strong { margin:7px 0 2px; font-size:20px; }#overview .metric small { font-size:10px; }
.pill { min-height:24px; padding:5px 9px; font-size:10px; }.toolbar-count,.text-button { font-size:11px; }
th { padding:12px 18px; font-size:10px; letter-spacing:.045em; }td { padding:15px 18px; font-size:11px; line-height:1.45; }
.search input,.toolbar select,form select,form input,.ads-toolbar-row select,.ads-filter-panel select,.analytics-filterbar select,.creative-filterbar select,.creative-filterbar input,.af-filterbar select,.pf-filterbar select,.mixer-builder select { font-size:11px; }
.ads-filter-panel label span,.analytics-filterbar label span,.creative-filterbar label > span,.af-filterbar label span,.pf-filterbar label span,.mixer-builder label span { font-size:10px; }
.ads-entity strong { font-size:11px; }.ads-entity small,.ads-optimization { font-size:10px; }
.optimization-recommendation strong,.tactic-card h3,.optimization-activity-row strong,.signal-item strong,.reuse-item strong,.creative-format-row div > strong { font-size:11px; }
.optimization-recommendation small,.tactic-card p,.tactic-condition,.tactic-card footer small,.optimization-activity-row small,.signal-item small,.reuse-item small,.creative-format-row div > small,.copy-signal span,.copy-signal strong { font-size:10px; line-height:1.5; }
.optimization-recommendation button,.tactic-card footer button,.action-mix-row span,.action-mix-row b { font-size:10px; }
.automation-coverage-card h2 { font-size:20px; line-height:1.35; }.automation-coverage-card > p:not(.card-kicker),.coverage-legend { font-size:10px; }
.product-kpis small,.segment-stats small,.coverage-summary small,.comparison-item small,.pf-secondary-grid span,.pf-secondary-grid small { font-size:10px; }.product-kpis strong,.segment-stats strong,.coverage-summary strong,.comparison-item strong,.pf-secondary-grid strong { font-size:11px; }
.segment-card h2 { font-size:15px; }.segment-card > p,.segment-size small,.segment-size b,.segment-use-button { font-size:10px; }
.creative-code-card p:not(.card-kicker),.code-part small,.creative-code-cell small,.row-detail-button { font-size:10px; }.creative-code-cell strong { font-size:11px; }
.brief-decision > span,.brief-decision p,.brief-decision button,.brief-team-row div small,.brief-signal small,.brief-plan-row time,.brief-plan-row strong { font-size:10px; }
.brief-decision strong,.brief-team-row div strong,.brief-signal strong { font-size:11px; }.brief-decision small,.brief-narrative p { font-size:10px; }
.report-row div strong,.report-template strong,.schedule-row div strong,.health-connector div strong,.health-incident div strong,.audit-fix strong,.audit-account-row div strong { font-size:11px; }
.report-row div small,.report-row time,.report-template small,.report-template b,.schedule-row div small,.schedule-row > b,.health-connector div small,.health-connector p,.health-incident div small,.health-incident time,.audit-fix small,.audit-account-row div small,.audit-account-row > small { font-size:10px; line-height:1.45; }
.audit-dimension strong,.health-gap-row,.budget-owner-row div > strong,.budget-opportunity strong,.creative-board-column > header strong,.creative-board-item strong { font-size:10px; }
.audit-dimension small,.audit-fix > span,.audit-fix button,.health-gap-head,.health-gap-note small,.health-connector > b,.health-incident > b,.health-incident button,.budget-owner-row div > small,.budget-owner-row b small,.budget-opportunity small,.budget-opportunity button,.creative-board-column > header span,.creative-board-item small,.creative-board-item b,.creative-board-add { font-size:10px; line-height:1.45; }
.health-status-banner p,.health-status-banner > span,.daily-brief-banner p,.budget-orbit > small,.budget-trend-head span,.budget-trend-head small,.budget-legend { font-size:10px; }
.creative-board-column { min-width:160px; padding:10px; }.creative-board { grid-template-columns:repeat(6,minmax(160px,1fr)); gap:10px; }.creative-board-item { padding:10px; }

/* Dense operational UI: keep labels readable without changing the layout. */
.command-live-status strong,.ads-scope-live strong { font-size:11px; }
.command-live-status small,.ads-scope-live small { font-size:10px; line-height:1.4; }
.command-brief-strip strong { font-size:12px; }.command-brief-strip small,.command-brief-strip button { font-size:10px; line-height:1.45; }
.command-platform-row > div span,.command-platform-row dd { font-size:11px; }.command-platform-row > div small,.command-platform-row dt { font-size:10px; line-height:1.4; }
.strategy-overview-card .card-head > div > p:not(.card-kicker),.strategy-drilldown-card .card-head > div > p:not(.card-kicker),.strategy-chart-controls > span { font-size:10px; }
.strategy-chart-controls button,.strategy-drilldown-tabs button,.strategy-drilldown-metrics button { font-size:10px; }
.strategy-funnel-chart header strong { font-size:11px; }.strategy-funnel-chart header small,.strategy-mini-legend,.strategy-funnel-chart footer,.strategy-drilldown-axis,.strategy-drilldown-summary { font-size:10px; line-height:1.4; }
.ads-source-main strong,.ads-source-stat strong { font-size:11px; }.ads-source-main small,.ads-source-stat small { font-size:10px; line-height:1.4; }
.ads-scope-filter label span,.ads-filter-panel label span { font-size:10px; }.ads-scope-filter select,.ads-custom-range input,.ads-toolbar-row select,.ads-filter-panel select { font-size:11px; }
.ads-selection-summary span,.ads-selection-summary small { font-size:10px; line-height:1.4; }.ads-selection-summary strong { font-size:17px; }
.ads-level-tabs button { font-size:11px; }.ads-level-tabs b,.ads-table-actions > span { font-size:10px; }
.ads-column-panel strong { font-size:11px; }.ads-column-panel span,.ads-column-panel small { font-size:10px; }
.ads-entity small,.ads-optimization { font-size:10px; }
.ads-guardrail-grid span { font-size:10px; }.ads-guardrail-grid strong { font-size:11px; }.ads-guardrail-grid small { font-size:10px; line-height:1.5; }
.ads-signal strong { font-size:11px; }.ads-signal small,.ads-signal b { font-size:10px; line-height:1.45; }

@media (max-width: 1120px) {
  .metric-grid { grid-template-columns: repeat(3,1fr); }
  .account-grid, .creative-grid, .integration-grid { grid-template-columns: repeat(2,1fr); }
  .af-metric-grid { grid-template-columns: repeat(3,1fr); }
  .pf-primary-grid { grid-template-columns: repeat(3,1fr); }
  .pf-secondary-grid { grid-template-columns: repeat(4,1fr); }
  .pf-comparison-grid { grid-template-columns: repeat(5,1fr); }
  .creative-metric-grid { grid-template-columns: repeat(3,1fr); }
  .optimization-metric-grid { grid-template-columns: repeat(3,1fr); }
  .budget-metric-grid,.health-metric-grid { grid-template-columns:repeat(3,1fr); }
  .brief-metric-grid,.report-metric-grid { grid-template-columns:repeat(2,1fr); }
  .tactic-grid { grid-template-columns: repeat(2,1fr); }
  .creative-filterbar { grid-template-columns: repeat(3,1fr); }.creative-custom-range { grid-template-columns: 1fr 1fr; }.creative-custom-range small { grid-column: 1/-1; }
  .creative-code-card { grid-template-columns: 1fr auto; }.creative-code-card .code-rule { display: none; }
  .analytics-metric-grid { grid-template-columns:repeat(3,1fr); }
  .analytics-filterbar { grid-template-columns:repeat(3,1fr); }
  .demographic-grid { grid-template-columns:repeat(2,1fr); }.demographic-card:last-child { grid-column:1/-1; }
  .analytics-priority-grid { grid-template-columns:1fr; }
  .analytics-google-grid { grid-template-columns:1fr; }
  .segment-grid { grid-template-columns:repeat(2,1fr); }
  .af-comparison-grid { grid-template-columns: repeat(4,1fr); }
  .af-filterbar { grid-template-columns: repeat(3,1fr); }
  .pf-filterbar { grid-template-columns: repeat(3,1fr); }
  .ads-scope-filter { grid-template-columns:repeat(3,minmax(160px,1fr)); }.ads-toolbar-row { grid-template-columns: auto minmax(220px,1fr) 180px; }.ads-toolbar-row > *:nth-child(4) { grid-row: 2; }.ads-source-strip { flex-wrap: wrap; }.ads-source-strip .button { margin-left: 0; }
  .strategy-funnel-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ads-manager-bottom { grid-template-columns: 1fr; }.ads-levelbar { align-items: flex-start; flex-direction: column; }.ads-level-tabs { width: 100%; overflow-x: auto; }
  .af-admin-card,.measurement-source-card { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 840px) {
  .section-tabs { max-width: 100%; overflow-x: auto; white-space: nowrap; }
  .app-shell { display: block; }
  .sidebar { transform: translateX(-100%); transition: transform .2s; box-shadow: var(--shadow); }
  .sidebar.open { transform: none; }
  main { min-width: 0; }
  .mobile-menu { display: block; }
  .breadcrumb { display: none; }
  .topbar { padding: 0 18px; }
  .view { padding: 26px 18px 44px; }
  .dashboard-grid, .audit-layout { grid-template-columns: 1fr; }
  .af-dashboard-grid { grid-template-columns: 1fr; }
  .pf-dashboard-grid { grid-template-columns: 1fr; }
  .creative-insight-grid,.creative-bottom-grid,.creative-analysis-grid { grid-template-columns: 1fr; }
  .optimization-hero-grid,.optimization-bottom-grid,.audience-mixer-layout { grid-template-columns: 1fr; }
  .budget-control-layout,.budget-grid,.brief-main-grid,.brief-bottom-grid,.report-grid,.audit360-hero,.audit360-grid,.health-grid { grid-template-columns:1fr; }
  .audit360-metrics { min-height:120px; }
  .analytics-hero-grid,.analytics-priority-grid,.analytics-product-grid,.analytics-economics-grid,.segment-bottom-grid { grid-template-columns:1fr; }
  .google-asset-grid { grid-template-columns:1fr; }
  .demographic-grid { grid-template-columns:1fr; }.demographic-card:last-child { grid-column:auto; }
  .team-summary { grid-template-columns: 1fr; }
  .af-admin-steps,.measurement-source-meta { width: 100%; flex-wrap: wrap; }
  .alert-card { grid-template-columns: 45px 1fr auto; }
  .alert-stat { display: none; }
}
@media (max-width: 620px) {
  .page-head, .filterbar { align-items: stretch; flex-direction: column; }
  .demo-banner { align-items: flex-start; flex-wrap: wrap; }.demo-banner p { min-width: 220px; }
  .head-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .metric-grid, .metric-grid.mini, .account-grid, .creative-grid, .integration-grid { grid-template-columns: 1fr; }
  .metric-grid { grid-template-columns: repeat(2,1fr); }.ads-selection-summary { grid-template-columns:repeat(2,1fr); }.ads-selection-summary strong { font-size:15px; }
  .exec-kpi { grid-template-columns: 1fr; }.exec-value { font-size: 26px; }
  .command-brief-strip { grid-template-columns: 30px 1fr; }.command-brief-strip button { grid-column: 1/-1; text-align: left; padding-left: 0; }
  .command-platform-row { grid-template-columns: 1fr; }.command-platform-row dl { grid-template-columns: repeat(2,1fr); }
  .strategy-funnel-grid { grid-template-columns:1fr; }.strategy-drilldown-metrics { justify-content:flex-start; }.strategy-drilldown-axis { padding:0 18px; }.strategy-drilldown-summary { gap:5px 10px; }
  .command-scope-filter { grid-template-columns:1fr; }
  .command-custom-range { grid-template-columns:1fr 1fr; }
  .command-custom-range small { grid-column:1/-1; }
  .af-metric-grid { grid-template-columns: repeat(2,1fr); }
  .pf-primary-grid { grid-template-columns: repeat(2,1fr); }
  .pf-secondary-grid { grid-template-columns: repeat(2,1fr); }
  .creative-metric-grid { grid-template-columns: repeat(2,1fr); }
  .optimization-metric-grid { grid-template-columns: repeat(2,1fr); }
  .budget-metric-grid,.health-metric-grid,.brief-metric-grid,.report-metric-grid { grid-template-columns:repeat(2,1fr); }
  .tactic-grid { grid-template-columns: 1fr; }
  .analytics-metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.analytics-metric > strong { font-size:14px; }
  .segment-summary-grid { grid-template-columns:repeat(2,1fr); }
  .af-filterbar { grid-template-columns: 1fr 1fr; }
  .af-filterbar .button { grid-column: 1/-1; }
  .af-custom-range { grid-template-columns:1fr 1fr; }
  .af-custom-range > small { grid-column:1/-1; }
  .pf-filterbar { grid-template-columns: 1fr 1fr; }
  .pf-filterbar .button { grid-column: 1/-1; }
  .creative-filterbar { grid-template-columns: 1fr 1fr; }.creative-filterbar .creative-search,.creative-filterbar .button { grid-column: 1/-1; }.creative-custom-range { grid-template-columns: 1fr 1fr; }.creative-custom-range small { grid-column: 1/-1; }
  .meta-steps { justify-content:flex-start; overflow-x:auto; }.meta-steps span { white-space:nowrap; }.meta-steps i { min-width:20px; }.meta-account-toolbar { align-items:stretch; flex-direction:column; }.meta-account-search { width:auto; }.meta-account-row { grid-template-columns:24px 1fr; }.meta-account-health,.meta-account-row select { grid-column:2; }.meta-connect-modal { padding:20px; }
  .analytics-filterbar { grid-template-columns:1fr 1fr; }.analytics-sync { grid-column:1/-1; }
  .analytics-custom-range { grid-template-columns:1fr 1fr; }.analytics-custom-range small { grid-column:1/-1; }
  .spend-share-layout { grid-template-columns:125px 1fr; gap:14px; }.spend-share-donut { width:122px; height:122px; }.spend-share-donut::before { width:76px; height:76px; }
  .region-row { grid-template-columns:32px 1fr; }.region-row > div:last-child { grid-column:2; text-align:left; }
  .retention-card .card-head { align-items:flex-start; flex-direction:column; gap:8px; }
  .af-chart { gap: 5px; padding-inline: 10px; }.af-day-bars { height: 175px; }
  .pf-chart { gap: 4px; padding-inline: 9px; }.pf-day-bars { height: 175px; }
  .af-comparison-grid { grid-template-columns: repeat(2,1fr); }
  .af-live-grid { grid-template-columns:repeat(2,1fr); }
  .pf-comparison-grid { grid-template-columns: repeat(2,1fr); }
  .af-source-strip { align-items: flex-start; flex-wrap: wrap; }.af-source-strip > p { min-width: 230px; }
  .pf-source-strip { align-items: flex-start; flex-wrap: wrap; }.pf-source-strip > p { min-width: 220px; }
  .creative-source-strip { align-items: flex-start; flex-wrap: wrap; }.creative-source-strip > p { min-width: 220px; }
  .creative-code-card { grid-template-columns: 1fr; }.code-anatomy { justify-content: flex-start; overflow-x: auto; }.code-part { min-width: 68px; }
  .reuse-item { grid-template-columns: 28px 1fr auto; }.reuse-item .pill { display: none; }
  .coverage-summary { grid-template-columns: repeat(2,1fr); }.coverage-summary > span:nth-child(2n) { border-right: 0; }.coverage-summary > span:nth-child(-n+4) { border-bottom: 1px solid var(--line); }
  .coverage-row { grid-template-columns: 30px 1fr 82px; }.coverage-row > span:nth-of-type(n+3) { display: none; }
  .segment-grid { grid-template-columns:1fr; }
  .product-kpis { grid-template-columns:repeat(2,1fr); }
  .mix-layout { grid-template-columns:110px 1fr; gap:14px; }.mix-donut { width:108px; height:108px; }.mix-donut::before { width:70px; height:70px; }
  .activation-row { grid-template-columns:34px 1fr auto; }.activation-row > div:nth-child(3) { display:none; }
  .mixer-builder { grid-template-columns:1fr; }.mixer-builder > b { justify-self:center; }
  .budget-control-layout { padding-inline:16px; }.budget-grid { grid-template-columns:1fr; }.budget-owner-row { grid-template-columns:32px 1fr 65px; }.budget-owner-track { display:none; }.budget-opportunity { grid-template-columns:28px 1fr auto; }.budget-opportunity > b { display:none; }
  .daily-brief-banner { padding:22px; align-items:flex-start; }.brief-score { width:90px; height:90px; }.brief-bottom-grid { grid-template-columns:1fr; }
  .report-row { grid-template-columns:32px 1fr auto; }.report-row time,.report-row .pill { display:none; }.schedule-row { grid-template-columns:42px 48px 1fr auto; }.schedule-row > b,.schedule-row > i { display:none; }
  .audit-score-card { padding:20px; }.audit360-metrics { grid-template-columns:repeat(3,1fr); }.audit360-metrics article { padding:11px; }.audit-dimension { grid-template-columns:125px 1fr 26px; }.audit-fix { grid-template-columns:8px 1fr auto; }.audit-fix > span { display:none; }.audit-account-row { grid-template-columns:28px 1fr 70px 28px; }.audit-account-row > small,.audit-account-row > button { display:none; }
  .health-status-banner { align-items:flex-start; }.health-status-banner > span { display:none; }.health-connector { grid-template-columns:31px 1fr auto; }.health-connector > p { display:none; }.health-incident { grid-template-columns:28px 1fr auto; }.health-incident time,.health-incident button { display:none; }
  .af-sync-state { display: none; }
  .af-live-grid { grid-template-columns:1fr; }.af-endpoint-row { align-items:flex-start; flex-direction:column; }
  .pf-score-row { grid-template-columns: 34px 1fr 65px; }.pf-score-row > div:nth-of-type(3),.pf-score-row > b { display: none; }
  .ads-scope-filter { grid-template-columns:1fr 1fr; }.ads-scope-live,.ads-custom-range { grid-column:1/-1; }.ads-toolbar-row { grid-template-columns: 1fr 1fr; }.ads-toolbar-row .ads-search { grid-column: 1/-1; grid-row: 1; }.ads-toolbar-row .filter-trigger { grid-row: 2; }.ads-filter-panel { grid-template-columns: 1fr 1fr; }.ads-level-tabs button { min-width: 105px; }.ads-source-main { min-width: 0; }.ads-source-stat { padding-left: 0; border-left: 0; }.ads-guardrail-grid { grid-template-columns: 1fr; }.ads-selection-summary { grid-template-columns:repeat(4,1fr); }
  .metric-mode { width: 100%; }.metric-mode button { flex: 1; }
  .metric { min-height: 110px; }
  .platform-tabs, .date-filter { overflow-x: auto; }
  .toolbar { flex-wrap: wrap; }.toolbar .search { flex-basis: 100%; }
  .channel-content { grid-template-columns: 120px 1fr; padding-inline: 16px; }.donut { width: 112px; }
  .page-head h1 { font-size: 26px; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
}

.ads-switch:disabled { cursor: not-allowed; opacity: .55; }
.ads-switch.unknown { background: repeating-linear-gradient(135deg,#c9c8d2 0 4px,#ecebf1 4px 8px); opacity: 1; }
.ads-switch.unknown::after { left: 10px; }
.ads-switch.pending { animation: ads-switch-pulse .8s ease-in-out infinite alternate; }
@keyframes ads-switch-pulse { to { opacity: .35; } }