/* ============================================================================
   MarketingM8 — design system
   A bespoke dark-first agency OS. Layered surfaces, hairline borders, a single
   electric-violet accent, restrained motion. Not a bootstrap dashboard.
   ============================================================================ */

:root {
  color-scheme: dark;
  /* surfaces (dark default) */
  --bg:        #07070b;
  --bg-grad:   radial-gradient(1200px 720px at 82% -10%, rgba(124,108,255,.14), transparent 60%),
               radial-gradient(900px 620px at 2% 2%, rgba(34,211,238,.06), transparent 55%);
  --bg-soft:   #0c0c13;
  --bg-2:      #0a0a10;
  --surface:   #101018;
  --surface-2: #16161f;
  --elevated:  #1c1c28;
  --card:      #101018;
  --card-2:    rgba(255,255,255,.038);
  --panel-2:   rgba(255,255,255,.05);
  --hover:     rgba(255,255,255,.045);
  --line:      rgba(255,255,255,.08);
  --line-2:    rgba(255,255,255,.13);

  /* text */
  --text:      #f4f4f8;
  --text-1:    #ffffff;
  --text-2:    #aeaebf;
  --text-3:    #74748a;

  /* brand + semantic */
  --accent:    #7c6cff;
  --accent-2:  #a394ff;
  --accent-muted: #8f80ff;
  --accent-soft: rgba(124,108,255,.16);
  --accent-line: rgba(124,108,255,.42);
  --grad:      linear-gradient(135deg, #7c6cff, #b06cff 60%, #ff6cab);
  --grad-soft: linear-gradient(135deg, rgba(124,108,255,.18), rgba(255,108,171,.10));
  --pos:       #34d399; --good: #34d399;
  --pos-soft:  rgba(52,211,153,.14);
  --warn:      #fbbf24;
  --warn-soft: rgba(251,191,36,.14);
  --neg:       #fb7185;
  --neg-soft:  rgba(251,113,133,.14);
  --info:      #38bdf8;
  --info-soft: rgba(56,189,248,.14);

  /* radii + shadow */
  --radius:    16px;
  --radius-lg: 22px;
  --radius-sm: 11px;
  --radius-xs: 8px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.45);
  --shadow:    0 1px 2px rgba(0,0,0,.4), 0 12px 32px -12px rgba(0,0,0,.7);
  --shadow-lg: 0 24px 60px -20px rgba(0,0,0,.8);
  --ring:      0 0 0 3px var(--accent-soft);

  /* type scale */
  --fs-xs:   11.5px;
  --fs-sm:   12.5px;
  --fs-base: 13.5px;
  --fs-md:   15px;
  --fs-lg:   17px;
  --fs-xl:   21px;
  --fs-2xl:  27px;
  --fs-3xl:  34px;

  /* spacing scale */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;

  --sidebar:   250px;
  --ease:      cubic-bezier(.22,.61,.36,1);
  --dur:       .18s;
  --font:      "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif;
  --mono:      "SF Mono", "JetBrains Mono", ui-monospace, "Cascadia Code", Menlo, monospace;
}

[data-theme="light"] {
  color-scheme: light;
  --bg:        #eceef5;
  --bg-grad:   radial-gradient(1100px 640px at 84% -12%, rgba(124,108,255,.16), transparent 60%),
               radial-gradient(820px 560px at -2% 0%, rgba(34,211,238,.09), transparent 55%);
  --bg-soft:   #f3f4f9;
  --bg-2:      #e6e8f1;
  --surface:   #ffffff;
  --surface-2: #f4f5fb;
  --elevated:  #ffffff;
  --card:      #ffffff;
  --card-2:    rgba(21,21,54,.035);
  --panel-2:   rgba(21,21,54,.05);
  --hover:     rgba(21,21,54,.05);
  --line:      rgba(19,19,52,.10);
  --line-2:    rgba(19,19,52,.16);

  --text:      #14141f;
  --text-1:    #05050c;
  --text-2:    #494a5c;
  --text-3:    #78788c;

  --accent:    #6a4dff;
  --accent-2:  #5b3ef0;
  --accent-muted: #7c6cff;
  --accent-soft: rgba(124,108,255,.13);
  --accent-line: rgba(124,108,255,.44);
  --grad-soft: linear-gradient(135deg, rgba(124,108,255,.14), rgba(255,108,171,.09));
  --pos:       #0f9d63; --good: #0f9d63;
  --pos-soft:  rgba(15,157,99,.12);
  --warn:      #b26a00;
  --warn-soft: rgba(214,142,0,.14);
  --neg:       #e11d48;
  --neg-soft:  rgba(225,29,72,.10);
  --info:      #0284c7;
  --info-soft: rgba(2,132,199,.10);
  --shadow-sm: 0 1px 2px rgba(24,24,55,.07);
  --shadow:    0 1px 2px rgba(24,24,55,.05), 0 14px 34px -16px rgba(34,34,74,.20);
  --shadow-lg: 0 26px 62px -22px rgba(34,34,74,.26);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font);
  background: var(--bg);
  background-image: var(--bg-grad);
  background-attachment: fixed;
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: -.01em;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--accent-soft); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 99px; border: 3px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: var(--text-3); background-clip: content-box; }

/* Accessible focus — keyboard only, never on mouse click (focus-visible). */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
.btn:focus-visible, .nav-item:focus-visible, .icon-btn:focus-visible,
.seg button:focus-visible, .tick:focus-visible, a.app-tile-link:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 2px;
}
.input:focus-visible, .inp:focus-visible, textarea:focus-visible, select:focus-visible { outline: none; }

/* Theme toggle — swap sun / moon by active theme (no JS needed for the icon). */
.icon-btn .i-sun, .icon-btn .i-moon { transition: opacity .2s var(--ease), transform .2s var(--ease); }
[data-theme="dark"] .icon-btn .i-sun,
[data-theme="light"] .icon-btn .i-moon { display: none; }

/* ── Layout shell ─────────────────────────────────────────────────────────── */
.app { display: flex; min-height: 100vh; }

.sidebar {
  width: var(--sidebar); flex: 0 0 var(--sidebar);
  position: fixed; inset: 0 auto 0 0; z-index: 40;
  background: linear-gradient(180deg, var(--surface), var(--bg));
  border-right: 1px solid var(--line);
  display: flex; flex-direction: column;
  padding: 18px 14px;
  transition: transform .32s var(--ease);
}
.brand { display: flex; align-items: center; gap: 11px; padding: 6px 8px 18px; }
.brand .mark {
  width: 34px; height: 34px; border-radius: 10px; flex: none;
  background: var(--grad); display: grid; place-items: center;
  font-weight: 800; color: #fff; font-size: 15px;
  box-shadow: 0 4px 16px -4px rgba(124,108,255,.7), inset 0 1px 0 rgba(255,255,255,.25);
}
.brand b { font-weight: 700; font-size: 15.5px; letter-spacing: -.02em; }
.brand .m8 { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brand small { display: block; color: var(--text-3); font-size: 10.5px; font-weight: 500; letter-spacing: .02em; }

.nav { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 3px; }
.nav-section { padding: 16px 10px 6px; font-size: 10.5px; font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--text-3); }
.nav-item {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 11px; border-radius: var(--radius-sm);
  color: var(--text-2); font-weight: 500; font-size: 13.5px;
  position: relative; transition: background .16s, color .16s;
}
.nav-item svg { width: 18px; height: 18px; flex: none; opacity: .85; }
.nav-item:hover { background: var(--hover); color: var(--text); }
.nav-item.active { color: var(--text); background: var(--accent-soft); }
.nav-item.active::before {
  content: ""; position: absolute; left: -14px; top: 9px; bottom: 9px; width: 3px;
  background: var(--grad); border-radius: 0 3px 3px 0;
}
.nav-item .badge-mini { margin-left: auto; font-size: 10.5px; background: var(--elevated);
  color: var(--text-2); padding: 1px 7px; border-radius: 99px; border: 1px solid var(--line); }

.side-foot { border-top: 1px solid var(--line); padding-top: 12px; margin-top: 8px; }
.user-chip { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--radius-sm);
  transition: background .16s; cursor: pointer; }
.user-chip:hover, .user-chip.active { background: var(--hover); }
.user-chip.active .meta b { color: var(--text); }
.user-chip .who { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1; color: inherit; text-decoration: none; }
.user-chip .av { width: 30px; height: 30px; }
.user-chip .meta { line-height: 1.25; min-width: 0; }
.user-chip .meta b { font-size: 12.5px; font-weight: 600; display: block; }
.user-chip .meta span { font-size: 11px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.user-chip a.out { margin-left: auto; color: var(--text-3); display: grid; place-items: center; }
.user-chip a.out:hover { color: var(--neg); }

/* main */
.main { flex: 1; margin-left: var(--sidebar); min-width: 0; display: flex; flex-direction: column; }
.topbar {
  position: sticky; top: 0; z-index: 30;
  display: flex; align-items: center; gap: 14px;
  padding: 13px 28px;
  background: color-mix(in srgb, var(--bg) 72%, transparent);
  backdrop-filter: blur(16px) saturate(140%);
  border-bottom: 1px solid var(--line);
}
.topbar h1 { font-size: 17px; font-weight: 650; letter-spacing: -.02em; }
.topbar .sub { color: var(--text-3); font-size: 12.5px; font-weight: 500; }
.hamburger { display: none; }

.cmd-trigger {
  margin-left: auto; display: flex; align-items: center; gap: 9px;
  padding: 7px 12px; min-width: 230px;
  background: var(--surface-2); border: 1px solid var(--line);
  border-radius: 10px; color: var(--text-3); font-size: 13px; cursor: text;
  transition: border-color .16s, background .16s;
}
.cmd-trigger:hover { border-color: var(--line-2); }
.cmd-trigger kbd { margin-left: auto; font-family: var(--font); font-size: 11px; font-weight: 600;
  background: var(--elevated); border: 1px solid var(--line); border-radius: 6px; padding: 1px 6px; }
.icon-btn { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px;
  background: var(--surface-2); border: 1px solid var(--line); color: var(--text-2); cursor: pointer;
  transition: all .16s; position: relative; }
.icon-btn:hover { color: var(--text); border-color: var(--line-2); transform: translateY(-1px); }
.icon-btn .dot { position: absolute; top: 8px; right: 9px; width: 7px; height: 7px; border-radius: 99px;
  background: var(--accent); box-shadow: 0 0 0 2px var(--bg); }
.bell-badge { position: absolute; top: -3px; right: -3px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 99px; background: var(--grad); color: #fff; font-size: 10px; font-weight: 700;
  line-height: 16px; text-align: center; box-shadow: 0 0 0 2px var(--bg); }

.content { padding: 26px 28px 60px; width: 100%; }

/* ── Reusable bits ────────────────────────────────────────────────────────── */
.av { border-radius: 9px; display: grid; place-items: center; font-weight: 700; font-size: 12px;
  color: #fff; flex: none; letter-spacing: .01em; }
.av.v { background: linear-gradient(135deg,#7c6cff,#b06cff); }
.av.c { background: linear-gradient(135deg,#22d3ee,#3b82f6); }
.av.e { background: linear-gradient(135deg,#34d399,#10b981); }
.av.a { background: linear-gradient(135deg,#fbbf24,#f97316); }
.av.r { background: linear-gradient(135deg,#fb7185,#ec4899); }
.av.b { background: linear-gradient(135deg,#818cf8,#6366f1); }
.av.pink { background: linear-gradient(135deg,#fbcfe8,#f9a8d4); color: #9d2e63; } /* pastel pink — Leah */

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 9px 15px; border-radius: 10px; font-weight: 600; font-size: 13px; cursor: pointer;
  border: 1px solid var(--line-2); background: var(--surface-2); color: var(--text);
  box-shadow: var(--shadow-sm);
  transition: background .16s var(--ease), border-color .16s var(--ease),
              transform .16s var(--ease), box-shadow .16s var(--ease), filter .16s var(--ease);
  white-space: nowrap; }
.btn:hover { background: var(--elevated); border-color: var(--text-3); transform: translateY(-1px); box-shadow: var(--shadow); }
.btn:active { transform: translateY(0); box-shadow: var(--shadow-sm); }
.btn svg { width: 16px; height: 16px; }
.btn.primary { background: var(--grad); border: none; color: #fff;
  box-shadow: 0 6px 18px -6px rgba(124,108,255,.7), inset 0 1px 0 rgba(255,255,255,.22); }
.btn.primary:hover { filter: brightness(1.07); transform: translateY(-1px); box-shadow: 0 10px 26px -8px rgba(124,108,255,.8), inset 0 1px 0 rgba(255,255,255,.22); }
.btn.ghost { background: transparent; border-color: var(--line); box-shadow: none; }
.btn.ghost:hover { background: var(--hover); box-shadow: none; }
.btn.sm { padding: 6px 11px; font-size: 12px; border-radius: 9px; }
.btn.block { width: 100%; }
.btn:disabled { opacity: .55; cursor: not-allowed; transform: none; box-shadow: var(--shadow-sm); }

.badge { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 99px;
  font-size: 11.5px; font-weight: 600; border: 1px solid transparent; white-space: nowrap;
  border-color: color-mix(in srgb, currentColor 20%, transparent); }
.badge .d { width: 6px; height: 6px; border-radius: 99px; background: currentColor; box-shadow: 0 0 6px currentColor; }
.badge.pos { color: var(--pos); background: var(--pos-soft); }
.badge.warn { color: var(--warn); background: var(--warn-soft); }
.badge.neg { color: var(--neg); background: var(--neg-soft); }
.badge.info { color: var(--info); background: var(--info-soft); }
.badge.muted { color: var(--text-2); background: var(--hover); border-color: var(--line); }
.badge.accent { color: var(--accent-2); background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 26%, transparent); }

.chip { font-size: 11px; padding: 2px 8px; border-radius: 7px; background: var(--hover);
  border: 1px solid var(--line); color: var(--text-2); font-weight: 500; }
.chip--saas { background: rgba(34,211,238,.12); border-color: rgba(34,211,238,.35);
  color: #22d3ee; font-weight: 650; letter-spacing: .03em; }
.chip--site { background: rgba(124,108,255,.10); border-color: rgba(124,108,255,.30);
  color: #a99dff; font-weight: 650; letter-spacing: .03em; }
[data-theme="light"] .chip--saas { background: rgba(2,132,199,.10); border-color: rgba(2,132,199,.30); color: #0369a1; }
[data-theme="light"] .chip--site { background: rgba(106,77,255,.10); border-color: rgba(106,77,255,.32); color: #5b3ef0; }

.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); }
.card.pad { padding: 20px; }
.card-h { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.card-h h3 { font-size: 14.5px; font-weight: 650; letter-spacing: -.01em; }
.card-h .sub { font-size: 12px; color: var(--text-3); }
.card-h .right { margin-left: auto; display: flex; align-items: center; gap: 8px; }

.section-title { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--text-3); margin: 0 0 12px; }

/* grid helpers */
.grid { display: grid; gap: 16px; }
.kpis { grid-template-columns: repeat(5, 1fr); }
.cols-2 { grid-template-columns: 1fr 1fr; }
.cols-3 { grid-template-columns: repeat(3,1fr); }
.dash-main { grid-template-columns: 1.6fr 1fr; align-items: start; }

/* KPI card */
.kpi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 17px 46px; position: relative; overflow: hidden; box-shadow: var(--shadow);
  transition: border-color .2s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease); }
.kpi::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent-line), transparent);
  opacity: 0; transition: opacity .2s var(--ease); }
.kpi:hover { border-color: var(--line-2); transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.kpi:hover::before { opacity: .7; }
.kpi .top { display: flex; align-items: center; gap: 9px; color: var(--text-3); font-size: 12.5px; font-weight: 550; }
.kpi .top .ic { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center;
  background: var(--accent-soft); color: var(--accent-2); }
.kpi .top .ic svg { width: 16px; height: 16px; }
.kpi .val { font-size: 27px; font-weight: 720; letter-spacing: -.03em; margin: 11px 0 3px; line-height: 1; }
.kpi .meta { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-3); }
.delta { display: inline-flex; align-items: center; gap: 3px; font-weight: 650; font-size: 11.5px; }
.delta.up { color: var(--pos); } .delta.down { color: var(--neg); }
.delta svg { width: 13px; height: 13px; }
.kpi .spark { position: absolute; right: 0; bottom: 0; left: 0; height: 38px; width: 100%; opacity: .85; display: block; }

/* app launcher tiles */
.launch-group-label { font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
  color: var(--text-3); margin: 4px 2px 10px; }
.launch-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.launch-grid:last-child { margin-bottom: 0; }
.app-tile { display: flex; align-items: center; gap: 12px; padding: 13px 14px; border-radius: 13px;
  border: 1px solid var(--line); background: var(--surface); text-decoration: none; color: var(--text);
  position: relative; transition: border-color .16s, transform .16s, background .16s; }
.app-tile:hover { border-color: var(--line-2); transform: translateY(-2px); background: var(--elevated); }
/* Stretched main link — covers the whole tile. The Demo pill (below) sits above it
   via z-index so it stays independently clickable. This replaces a nested <a>, which
   was invalid HTML (browser split each tile into 3 grid items → scattered layout). */
.app-tile-link { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.app-tile-ic { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; flex: none; }
.app-tile-ic svg { width: 19px; height: 19px; }
.app-tile-body { display: flex; flex-direction: column; min-width: 0; }
.app-tile-body b { font-size: 14px; font-weight: 600; line-height: 1.2; }
.app-tile-body .sub { font-size: 12px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; }
.app-tile-arrow { margin-left: auto; color: var(--text-3); opacity: 0; transition: opacity .16s; flex: none; }
.app-tile-arrow svg { width: 15px; height: 15px; }
.app-tile:hover .app-tile-arrow { opacity: .7; }
.app-tile-demo { position: relative; z-index: 2; margin-left: auto; font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 999px;
  border: 1px solid var(--line-2); color: var(--text-2, var(--text-3)); text-decoration: none; flex: none;
  transition: background .14s, color .14s; }
.app-tile-demo:hover { background: var(--grad); color: #fff; border-color: transparent; }
.app-tile:has(.app-tile-demo) .app-tile-arrow { display: none; }

/* lists / rows */
.row-list { display: flex; flex-direction: column; }
.row { display: flex; align-items: center; gap: 12px; padding: 11px 4px; border-top: 1px solid var(--line); }
.row:first-child { border-top: none; }
.row .grow { flex: 1; min-width: 0; }
.row .t { font-weight: 550; font-size: 13.5px; }
.row .s { font-size: 12px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.row.click { border-radius: 10px; cursor: pointer; padding-left: 8px; padding-right: 8px; transition: background .14s; }
.row.click:hover { background: var(--hover); }

/* activity feed */
.feed-item { display: flex; gap: 12px; padding: 12px 2px; position: relative; }
.feed-item .ic { width: 30px; height: 30px; border-radius: 9px; flex: none; display: grid; place-items: center;
  background: var(--surface-2); border: 1px solid var(--line); color: var(--text-2); }
.feed-item .ic svg { width: 15px; height: 15px; }
.feed-item .ic.deploy { color: var(--accent-2); } .feed-item .ic.invoice { color: var(--pos); }
.feed-item .ic.email { color: var(--info); } .feed-item .ic.meeting { color: var(--warn); }
.feed-item:not(:last-child)::before { content:""; position:absolute; left:14px; top:42px; bottom:-12px; width:1px; background: var(--line); }
.feed-item .ft { font-size: 13px; font-weight: 550; }
.feed-item .fd { font-size: 12px; color: var(--text-3); }
.feed-item time { font-size: 11px; color: var(--text-3); margin-left: auto; white-space: nowrap; }

/* checkbox tasks */
.task { display: flex; align-items: center; gap: 11px; padding: 9px 2px; border-top: 1px solid var(--line); }
.task:first-child { border-top: none; }
.tick { width: 19px; height: 19px; border-radius: 7px; border: 1.6px solid var(--line-2); flex: none;
  cursor: pointer; display: grid; place-items: center; transition: all .15s; }
.tick:hover { border-color: var(--accent); }
.tick.done { background: var(--grad); border-color: transparent; }
.tick svg { width: 12px; height: 12px; color: #fff; opacity: 0; transition: opacity .15s; }
.tick.done svg { opacity: 1; }
.task.is-done .tt { text-decoration: line-through; color: var(--text-3); }
.task .tt { flex: 1; font-size: 13px; font-weight: 500; min-width: 0; overflow-wrap: anywhere; }

/* per-person to-do board: narrow columns, so let rows wrap —
   tick + title on the first line, controls drop underneath */
.task-board .task { flex-wrap: wrap; row-gap: 6px; }
.task-board .task .tt { flex: 1 1 calc(100% - 32px); }
.task-board .task .t-client, .task-board .task .t-assign { max-width: 42%; }
.task-board .task .sub { white-space: normal !important; }

/* tables */
.tbl { width: 100%; border-collapse: collapse; }
.tbl th { text-align: left; font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
  color: var(--text-3); padding: 0 14px 11px; border-bottom: 1px solid var(--line); }
.tbl td { padding: 13px 14px; border-bottom: 1px solid var(--line); font-size: 13.5px; vertical-align: middle; }
.tbl tr:last-child td { border-bottom: none; }
.tbl tbody tr { transition: background .14s; }
.tbl tbody tr:hover { background: var(--hover); }
.tbl .name-cell { display: flex; align-items: center; gap: 11px; }

/* meter */
.meter { height: 6px; border-radius: 99px; background: var(--hover); overflow: hidden; min-width: 54px; }
.meter > i { display: block; height: 100%; border-radius: 99px; background: var(--grad); }
.meter.pos > i { background: var(--pos); } .meter.warn > i { background: var(--warn); } .meter.neg > i { background: var(--neg); }
.score-cell { display: flex; align-items: center; gap: 9px; }
.score-cell b { font-size: 12.5px; min-width: 26px; }

/* ── Charts (hand-rolled SVG) ─────────────────────────────────────────────── */
.chart { width: 100%; display: block; overflow: visible; }
.chart .area { fill: url(#areaGrad); }
.chart .line { fill: none; stroke: var(--accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.chart .gridline { stroke: var(--line); stroke-width: 1; }
.chart .bar { fill: var(--accent-soft); rx: 4; transition: fill .15s; }
.chart .bar:hover { fill: var(--accent); }
.chart .dot { fill: var(--accent); stroke: var(--bg); stroke-width: 2.5; opacity: 0; transition: opacity .15s; }
.chart-tip { position: absolute; pointer-events: none; background: var(--elevated); border: 1px solid var(--line-2);
  border-radius: 9px; padding: 7px 10px; font-size: 12px; box-shadow: var(--shadow-lg); opacity: 0;
  transform: translate(-50%,-8px); transition: opacity .12s; z-index: 5; white-space: nowrap; }
.chart-tip b { font-weight: 700; }

/* donut legend */
.legend { display: flex; flex-direction: column; gap: 9px; }
.legend .li { display: flex; align-items: center; gap: 9px; font-size: 12.5px; }
.legend .sw { width: 9px; height: 9px; border-radius: 3px; flex: none; }
.legend .li b { margin-left: auto; font-weight: 650; }
.legend .li span { color: var(--text-3); }

/* ── CRM kanban ───────────────────────────────────────────────────────────── */
.board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(258px, 1fr);
  gap: 14px; overflow-x: auto; padding-bottom: 12px; align-items: stretch; }
/* stretch (not start) so short columns are full-height drop targets — with start,
   cards dragged from the bottom of a tall column had nowhere to drop. */
.col { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius);
  display: flex; flex-direction: column; min-height: 120px; }
.col-h { display: flex; align-items: center; gap: 8px; padding: 13px 14px 10px; }
.col-h .dot { width: 8px; height: 8px; border-radius: 99px; }
.col-h b { font-size: 13px; font-weight: 600; }
.col-h .ct { color: var(--text-3); font-size: 12px; }
.col-h .tot { margin-left: auto; font-size: 11.5px; color: var(--text-3); font-weight: 600; }
.col-body { display: flex; flex-direction: column; gap: 9px; padding: 4px 10px 12px; flex: 1; min-height: 40px; }
.col-body.drag-over { background: var(--accent-soft); border-radius: 12px; }
.lead-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 12px; cursor: grab; position: relative; transition: border-color .15s, transform .15s, box-shadow .15s; }
/* tap-to-move handle — drag is desktop-only (HTML5 DnD), so show this on touch devices */
.card-move { position: absolute; top: 7px; right: 7px; width: 26px; height: 26px; border: none;
  background: var(--hover); color: var(--text-2); border-radius: 7px; cursor: pointer;
  display: none; place-items: center; z-index: 2; }
.card-move svg { width: 16px; height: 16px; }
.card-move:hover { background: var(--elevated); color: var(--text); }
@media (hover: none), (max-width: 760px) { .board .card-move { display: grid; } }
.move-menu { position: absolute; z-index: 95; background: var(--elevated); border: 1px solid var(--line-2);
  border-radius: 11px; box-shadow: var(--shadow-lg); padding: 5px; min-width: 168px; }
.move-menu .mm-h { font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em;
  color: var(--text-3); padding: 7px 10px 4px; }
.mm-item { display: block; width: 100%; text-align: left; padding: 10px; border: none; background: none;
  color: var(--text); font-size: 13.5px; border-radius: 8px; cursor: pointer; }
.mm-item:hover, .mm-item:active { background: var(--accent-soft); color: var(--accent-2); }
.lead-card:hover { border-color: var(--line-2); transform: translateY(-2px); box-shadow: var(--shadow); }
.lead-card.dragging { opacity: .5; cursor: grabbing; }
.lead-card .lc-top { display: flex; align-items: center; gap: 9px; margin-bottom: 9px; }
.lead-card .lc-top .av { width: 30px; height: 30px; }
.lead-card .lc-top b { font-size: 13px; font-weight: 600; line-height: 1.2; }
.lead-card .lc-top span { font-size: 11.5px; color: var(--text-3); display: block; }
.lead-card .lc-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 9px; }
.lead-card .lc-foot { display: flex; align-items: center; justify-content: space-between; }
.lead-card .lc-foot .val { font-weight: 700; font-size: 13px; }
.lead-card .lc-foot .val small { color: var(--text-3); font-weight: 500; }

/* ── Forms ────────────────────────────────────────────────────────────────── */
.field { margin-bottom: 14px; }
.field label { display: block; font-size: 12px; font-weight: 600; color: var(--text-2); margin-bottom: 6px; }
.input, textarea.input, select.input,
.inp, textarea.inp, select.inp {
  width: 100%; padding: 10px 13px; background: var(--surface-2);
  border: 1px solid var(--line-2); border-radius: 10px; color: var(--text);
  font-size: 13.5px; transition: border-color .15s, box-shadow .15s; outline: none; }
.input:focus, textarea.input:focus, select.input:focus,
.inp:focus, textarea.inp:focus, select.inp:focus {
  border-color: var(--accent-line); box-shadow: 0 0 0 3px var(--accent-soft); background: var(--surface); }
.input::placeholder, .inp::placeholder { color: var(--text-3); }
textarea.input, textarea.inp { resize: vertical; min-height: 90px; line-height: 1.55; }
/* Review-email dialog textarea — force readable colours by id, so it stays legible
   even if an older cached app.js emits it without the .inp class (it was rendering
   near-invisible: theme-text colour on the UA-default white textarea background). */
#revBody { background: var(--surface-2); color: var(--text);
  border: 1px solid var(--line-2); border-radius: 10px; padding: 10px 13px; }
.seg { display: inline-flex; background: var(--surface-2); border: 1px solid var(--line); border-radius: 11px; padding: 3px; gap: 2px; flex-wrap: wrap; }
.seg button { padding: 7px 13px; border-radius: 8px; border: none; background: transparent; color: var(--text-2);
  font-size: 12.5px; font-weight: 600; cursor: pointer; transition: all .14s; }
.seg button:hover { color: var(--text); }
.seg button svg { width: 16px; height: 16px; vertical-align: -3px; flex: none; }
.seg button.on { background: var(--elevated); color: var(--text); box-shadow: var(--shadow); }
.seg button.on.grad { background: var(--grad); color: #fff; box-shadow: 0 4px 14px -5px rgba(124,108,255,.7); }

/* ── Command palette + modal ──────────────────────────────────────────────── */
.overlay { position: fixed; inset: 0; z-index: 90; background: rgba(4,4,9,.62);
  backdrop-filter: blur(5px); display: none; opacity: 0; transition: opacity .18s; }
.overlay.show { display: block; opacity: 1; }
.palette { position: fixed; z-index: 91; left: 50%; top: 86px; transform: translateX(-50%) translateY(-8px) scale(.98);
  width: min(620px, 92vw); background: var(--elevated); border: 1px solid var(--line-2);
  border-radius: 16px; box-shadow: var(--shadow-lg); overflow: hidden; display: none; opacity: 0;
  transition: opacity .18s var(--ease), transform .18s var(--ease); }
.palette.show { display: block; opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
.palette .pin { display: flex; align-items: center; gap: 11px; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.palette .pin svg { width: 19px; height: 19px; color: var(--text-3); }
.palette .pin input { flex: 1; background: none; border: none; outline: none; font-size: 16px; }
.palette .results { max-height: 380px; overflow-y: auto; padding: 8px; }
.palette .pgroup { font-size: 10.5px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase;
  color: var(--text-3); padding: 10px 12px 5px; }
.presult { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; cursor: pointer; }
.presult .ic { width: 30px; height: 30px; border-radius: 8px; background: var(--surface-2); border: 1px solid var(--line);
  display: grid; place-items: center; color: var(--text-2); flex: none; }
.presult .ic svg { width: 15px; height: 15px; }
.presult b { font-size: 13.5px; font-weight: 550; }
.presult span { font-size: 11.5px; color: var(--text-3); display: block; }
.presult kbd { margin-left: auto; font-size: 11px; color: var(--text-3); }
.presult.sel, .presult:hover { background: var(--accent-soft); }
.palette .empty { padding: 30px; text-align: center; color: var(--text-3); font-size: 13px; }

.modal { position: fixed; z-index: 91; left: 50%; top: 50%; transform: translate(-50%,-46%) scale(.97);
  width: min(560px, 94vw); max-height: 88vh; overflow-y: auto; background: var(--elevated);
  border: 1px solid var(--line-2); border-radius: 18px; box-shadow: var(--shadow-lg);
  display: none; opacity: 0; transition: opacity .18s, transform .2s var(--ease); }
.modal.show { display: block; opacity: 1; transform: translate(-50%,-50%) scale(1); }
.modal .mh { display: flex; align-items: center; padding: 18px 20px; border-bottom: 1px solid var(--line); }
.modal .mh h3 { font-size: 15.5px; font-weight: 650; }
.modal .mh .x { margin-left: auto; cursor: pointer; color: var(--text-3); width: 30px; height: 30px;
  display: grid; place-items: center; border-radius: 8px; }
.modal .mh .x:hover { background: var(--hover); color: var(--text); }
.modal .mb { padding: 20px; }
.modal .mf { padding: 14px 20px; border-top: 1px solid var(--line); display: flex; gap: 10px; justify-content: flex-end; }

/* ── Toast ────────────────────────────────────────────────────────────────── */
.toasts { position: fixed; bottom: 22px; right: 22px; z-index: 95; display: flex; flex-direction: column; gap: 10px; }
.toast { display: flex; align-items: center; gap: 11px; padding: 12px 16px; background: var(--elevated);
  border: 1px solid var(--line-2); border-radius: 12px; box-shadow: var(--shadow-lg); font-size: 13px; font-weight: 500;
  animation: toastIn .3s var(--ease); max-width: 360px; }
.toast .ic { width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; flex: none; }
.toast.ok .ic { background: var(--pos-soft); color: var(--pos); }
.toast.err .ic { background: var(--neg-soft); color: var(--neg); }
.toast .ic svg { width: 14px; height: 14px; }
@keyframes toastIn { from { opacity: 0; transform: translateX(20px); } }

/* ── Skeleton / loading ───────────────────────────────────────────────────── */
.skel { background: linear-gradient(100deg, var(--surface-2) 30%, var(--hover) 50%, var(--surface-2) 70%);
  background-size: 200% 100%; animation: shimmer 1.3s infinite; border-radius: 8px; }
@keyframes shimmer { to { background-position: -200% 0; } }
.spinner { width: 16px; height: 16px; border: 2px solid var(--line-2); border-top-color: var(--accent);
  border-radius: 99px; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Page transition / entrance ───────────────────────────────────────────── */
.reveal { opacity: 0; transform: translateY(10px); animation: revealUp .5s var(--ease) forwards; }
@keyframes revealUp { to { opacity: 1; transform: none; } }
.content > * { animation: revealUp .45s var(--ease) both; }
.stagger > * { animation: revealUp .45s var(--ease) both; }
.stagger > *:nth-child(2) { animation-delay: .04s; }
.stagger > *:nth-child(3) { animation-delay: .08s; }
.stagger > *:nth-child(4) { animation-delay: .12s; }

/* ── AI Studio ────────────────────────────────────────────────────────────── */
.studio { display: grid; grid-template-columns: 360px 1fr; gap: 18px; align-items: start; }
.gen-out { min-height: 420px; }
.out-block { border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 15px 16px; margin-bottom: 12px;
  background: var(--surface-2); position: relative; }
.out-block h4 { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--text-3);
  margin-bottom: 9px; font-weight: 600; }
.out-block p { font-size: 13.5px; line-height: 1.6; white-space: pre-wrap; }
.out-block .copy { position: absolute; top: 12px; right: 12px; cursor: pointer; color: var(--text-3); opacity: 0; transition: opacity .15s; }
.out-block:hover .copy { opacity: 1; }
.out-block .copy:hover { color: var(--text); }
.hook-pill { display: block; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px;
  margin-bottom: 8px; font-size: 13.5px; background: var(--surface); transition: border-color .15s; }
.hook-pill:hover { border-color: var(--accent-line); }
.tag-cloud { display: flex; flex-wrap: wrap; gap: 6px; }
.tag-cloud .chip { background: var(--accent-soft); color: var(--accent-2); border-color: transparent; }
.storyboard-scene { display: grid; grid-template-columns: 64px 1fr; gap: 13px; padding: 12px 0; border-top: 1px solid var(--line); }
.storyboard-scene .tt { font-family: var(--mono); font-size: 11.5px; color: var(--accent-2); font-weight: 600; }
.empty-state { text-align: center; padding: 60px 20px; color: var(--text-3); }
.empty-state .big { width: 56px; height: 56px; margin: 0 auto 16px; border-radius: 16px; background: var(--accent-soft);
  display: grid; place-items: center; color: var(--accent-2); }
.empty-state .big svg { width: 26px; height: 26px; }
.empty-state h3 { color: var(--text); font-size: 16px; margin-bottom: 6px; }

/* ── Module placeholder / hero ────────────────────────────────────────────── */
.mod-hero { text-align: center; padding: 56px 24px 40px; position: relative; overflow: hidden; }
.mod-hero .glow { position: absolute; inset: 0; background: radial-gradient(420px 220px at 50% 0%, var(--accent-soft), transparent 70%); }
.mod-hero .ic { width: 70px; height: 70px; margin: 0 auto 20px; border-radius: 20px; background: var(--grad);
  display: grid; place-items: center; box-shadow: 0 14px 40px -10px rgba(124,108,255,.6); position: relative; }
.mod-hero .ic svg { width: 33px; height: 33px; color: #fff; }
.mod-hero h2 { font-size: 26px; font-weight: 720; letter-spacing: -.03em; margin-bottom: 8px; position: relative; }
.mod-hero p { color: var(--text-2); font-size: 15px; max-width: 520px; margin: 0 auto 8px; position: relative; }
.feat-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.feat { display: flex; align-items: flex-start; gap: 11px; padding: 15px; border: 1px solid var(--line);
  border-radius: var(--radius-sm); background: var(--surface-2); }
.feat .tick-ic { width: 22px; height: 22px; border-radius: 7px; background: var(--pos-soft); color: var(--pos);
  display: grid; place-items: center; flex: none; }
.feat .tick-ic svg { width: 13px; height: 13px; }
.feat span { font-size: 13px; font-weight: 500; line-height: 1.45; }
.soon-tag { display: inline-flex; align-items: center; gap: 6px; padding: 5px 13px; border-radius: 99px;
  background: var(--accent-soft); color: var(--accent-2); font-size: 12px; font-weight: 650; margin-bottom: 22px; }

/* ── Login ────────────────────────────────────────────────────────────────── */
.login-wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px; position: relative; overflow: hidden; }
.login-wrap .orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .5; }
.login-wrap .orb.a { width: 460px; height: 460px; background: #7c6cff; top: -160px; right: -120px; }
.login-wrap .orb.b { width: 380px; height: 380px; background: #ff6cab; bottom: -160px; left: -100px; opacity: .35; }
.login-card { width: min(400px, 100%); background: var(--surface); border: 1px solid var(--line-2);
  border-radius: 22px; padding: 36px 32px; box-shadow: var(--shadow-lg); position: relative; z-index: 2; }
.login-card .brand { justify-content: center; padding-bottom: 6px; }
.login-card h2 { text-align: center; font-size: 21px; font-weight: 700; letter-spacing: -.02em; margin: 14px 0 4px; }
.login-card .lead { text-align: center; color: var(--text-3); font-size: 13.5px; margin-bottom: 26px; }
.login-card .hint { text-align: center; font-size: 11.5px; color: var(--text-3); margin-top: 18px; }
.err-banner { background: var(--neg-soft); color: var(--neg); border: 1px solid rgba(251,113,133,.3);
  border-radius: 10px; padding: 10px 13px; font-size: 12.5px; font-weight: 500; margin-bottom: 16px; }

.note-banner { display: flex; align-items: center; gap: 10px; padding: 11px 15px; border-radius: 12px;
  background: var(--warn-soft); border: 1px solid rgba(251,191,36,.28); color: var(--warn); font-size: 12.5px;
  font-weight: 500; margin-bottom: 18px; }
.note-banner svg { width: 17px; height: 17px; flex: none; }

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 1080px) {
  .kpis { grid-template-columns: repeat(2,1fr); }
  .dash-main, .cols-2, .cols-3 { grid-template-columns: 1fr; }
  .studio { grid-template-columns: 1fr; }
  .feat-grid { grid-template-columns: repeat(2,1fr); }
  .launch-grid { grid-template-columns: repeat(2,1fr); }
  /* inline grids (beat media queries) — collapse 2-col detail layouts + dense KPI rows */
  [style*="grid-template-columns:1.5fr 1fr"],
  [style*="grid-template-columns:1.5fr"] { grid-template-columns: 1fr !important; }
  [style*="repeat(4,1fr)"] { grid-template-columns: repeat(2,1fr) !important; }
}
@media (max-width: 760px) {
  :root { --sidebar: 0px; }
  body { overflow-x: hidden; }
  /* let grid/flex children shrink so wide content (tables) doesn't push the page sideways */
  .grid > *, .dash-main > *, .cols-2 > *, .cols-3 > *, .main { min-width: 0; }
  .launch-grid { grid-template-columns: 1fr; }
  .sidebar { transform: translateX(-100%); width: 250px; flex-basis: 250px; box-shadow: var(--shadow-lg); }
  .sidebar.open { transform: translateX(0); }
  .main { margin-left: 0; min-width: 0; }
  .hamburger { display: grid; }
  .topbar { padding: 11px 14px; gap: 10px; }
  .topbar h1 { font-size: 15.5px; }
  .topbar .sub { font-size: 11.5px; }
  .cmd-trigger { min-width: 0; width: 38px; padding: 7px; justify-content: center; margin-left: auto; }
  .cmd-trigger span, .cmd-trigger kbd { display: none; }
  .content { padding: 16px 14px 56px; }
  .kpis { grid-template-columns: 1fr 1fr; gap: 12px; }
  .feat-grid { grid-template-columns: 1fr; }
  /* inline KPI rows (3- or 4-col) → 2 across on phones */
  [style*="repeat(4,1fr)"], [style*="repeat(3,1fr)"] { grid-template-columns: 1fr 1fr !important; }
  .kpi { padding: 14px 14px 40px; } .kpi .val { font-size: 22px; }
  /* kanban: one column ~full width, swipe sideways */
  .board { grid-auto-columns: minmax(82vw, 1fr); gap: 10px; }
  /* tables: tighter + scroll inside their card */
  .card { overflow-x: auto; }
  .tbl th, .tbl td { padding: 9px 8px; font-size: 12.5px; }
  /* overlays full-width */
  .modal { width: 96vw; } .palette { width: 94vw; top: 60px; }
  .seg { width: 100%; }
  .scrim { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 39; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after,
  .content > *, .stagger > *, .reveal { animation: none !important; transition: none !important;
    scroll-behavior: auto !important; }
  /* animations are how .reveal fades in from opacity:0 — with motion disabled we must
     force the end-state visible, or the content stays invisible forever. */
  .reveal, .content > *, .stagger > * { opacity: 1 !important; transform: none !important; }
  /* no hover-lift snap: colour/background still change, but nothing translates. */
  .btn:hover, .kpi:hover, .icon-btn:hover, .app-tile:hover, .lead-card:hover,
  .card:hover { transform: none !important; }
}
/* ICONFIX-START */
/* Admin icons are <svg viewBox="0 0 24 24"> with no width/height/stroke and
   app.css had no svg rules, so they hit the 300x150 SVG default and rendered
   as giant blobs. Size them as line-icons inheriting colour. :not([width])
   leaves the explicit brand logo (width="28") alone. */
svg[viewBox="0 0 24 24"]:not([width]){width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor}
.kpi-icon svg,.quick-ic svg,.action-ic svg,.setting-ic svg{width:22px;height:22px}
.topbar-btn svg,.cal-ic svg,.step-ic svg{width:18px;height:18px}
.btn svg,.pill svg,.tag svg,.stat-chip svg,.seg svg,.toggle svg,.sidebar-link svg,.composer-tool svg{width:18px;height:18px}
.fab svg{width:24px;height:24px}
.empty-ic svg{width:32px;height:32px}
.empty-ic2 svg{width:28px;height:28px}
/* ICONFIX-END */

/* ==========================================================================
   AGIT — integrated CRM shell
   Calm, premium and information-led. Existing workflow components remain
   below the surface so the redesign does not disturb their behaviour.
   ========================================================================== */
:root {
  --bg: #f5f6fa;
  --bg-grad: none;
  --bg-soft: #eef0f4;
  --bg-2: #e8ebf1;
  --surface: #ffffff;
  --surface-2: #f8f9fb;
  --elevated: #ffffff;
  --card: #ffffff;
  --card-2: #f8f9fb;
  --panel-2: #f0f2f6;
  --hover: #f1f3f8;
  --line: #e7e9ef;
  --line-2: #dce0e8;
  --text: #2b303b;
  --text-1: #151922;
  --text-2: #5f6878;
  --text-3: #8b94a5;
  --accent: #315cff;
  --accent-2: #244ae0;
  --accent-muted: #6d76d9;
  --accent-soft: #eef0ff;
  --accent-line: #cfd3fb;
  --grad: #5965d8;
  --grad-soft: #f0f1ff;
  --pos: #248565;
  --pos-soft: #eaf7f2;
  --warn: #b67420;
  --warn-soft: #fff5e7;
  --neg: #cf4c60;
  --neg-soft: #fff0f2;
  --info: #3476a7;
  --info-soft: #eaf4fb;
  --radius: 12px;
  --radius-lg: 16px;
  --radius-sm: 9px;
  --radius-xs: 7px;
  --shadow-sm: 0 1px 2px rgba(20,25,38,.04), 0 4px 12px rgba(20,25,38,.035);
  --shadow: 0 1px 2px rgba(20,25,38,.04), 0 10px 28px rgba(20,25,38,.055);
  --shadow-lg: 0 24px 64px rgba(20,25,38,.13);
  --ring: 0 0 0 3px rgba(89,101,216,.16);
  --sidebar: 238px;
  --font: "Aptos", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
  --mono: "Aptos", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
}

[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0c111b;
  --bg-soft: #090e17;
  --bg-2: #070b13;
  --surface: #151c29;
  --surface-2: #101722;
  --elevated: #1b2433;
  --card: #151c29;
  --card-2: #101722;
  --panel-2: #1c2636;
  --hover: #1b2637;
  --line: rgba(188,202,232,.11);
  --line-2: rgba(188,202,232,.18);
  --text: #dce5f6;
  --text-1: #f7f9ff;
  --text-2: #aebbd1;
  --text-3: #718097;
  --accent: #7188ff;
  --accent-2: #9dacff;
  --accent-soft: rgba(78,100,255,.16);
  --accent-line: rgba(113,136,255,.34);
  --pos: #5dd6ae;
  --pos-soft: rgba(46,174,132,.14);
  --warn: #efb661;
  --warn-soft: rgba(206,139,42,.15);
  --neg: #ff8295;
  --neg-soft: rgba(220,69,92,.15);
  --info: #6fc4ff;
  --info-soft: rgba(73,161,220,.15);
  --shadow: 0 16px 42px rgba(0,0,0,.28);
  --shadow-lg: 0 32px 84px rgba(0,0,0,.5);
}

html { background: var(--bg); }
body { font-size: 13.5px; letter-spacing: 0; background-image: none; background-size: auto; }
.app { min-height: 100dvh; }

.sidebar {
  background: #080d1c;
  color: #fff;
  border-right: 0;
  padding: 18px 12px 12px;
  backdrop-filter: none;
}
.brand { display: block; padding: 3px 8px 18px; border-bottom: 1px solid rgba(255,255,255,.1); margin-bottom: 8px; }
.brand-logo { display: block; width: 192px; max-width: 100%; height: auto; }
.brand-mark,.brand-symbol,.brand-copy { display: none; }
.brand .mark, .brand .m8 { display: none; }
.login-brand { width: min(100%, 280px); margin: 0 auto 20px; padding: 0 0 18px; border-bottom-color: var(--line); }
.login-brand .brand-logo { width: 250px; margin: auto; }
.theme-brand-dark{display:none}[data-theme="dark"] .theme-brand-light{display:none}[data-theme="dark"] .theme-brand-dark{display:block}
.studio-mode-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; margin: 0 0 22px; background:#e9ebf2; padding:4px; border-radius:14px; }
.studio-mode-tabs a { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 12px 14px; color: var(--text-2); background: transparent; border: 0; border-radius: 10px; }
.studio-mode-tabs a:hover { background: var(--hover); color: var(--text); }
.studio-mode-tabs a.active { color: #080d1c; background: #fff; box-shadow:0 6px 18px rgba(8,13,28,.08); }
.studio-mode-tabs svg { width: 18px; height: 18px; flex: none; }
.studio-mode-tabs span { display: flex; flex-direction: column; min-width: 0; }
.studio-mode-tabs b { color: inherit; font-size: 12.5px; }
.studio-mode-tabs small { margin-top: 3px; color: var(--text-3); font-size: 10.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media(max-width:620px){.studio-mode-tabs{grid-template-columns:1fr}.studio-mode-tabs a{padding:9px 11px}}

.nav { gap: 3px; padding-right: 2px; }
.nav-section { padding: 12px 9px 5px; color: rgba(255,255,255,.38); font-size: 8.5px; letter-spacing: .11em; }
.nav-cluster { border: 1px solid transparent; border-radius: 11px; }
.nav-cluster[open] { background: var(--surface-2); border-color: var(--line); }
.nav-cluster summary { list-style: none; }
.nav-cluster summary::-webkit-details-marker { display: none; }
.nav-primary { width: 100%; padding: 9px; cursor: pointer; border-radius: 9px; }
.nav-primary { color:rgba(255,255,255,.76); }
.nav-primary:hover { background: rgba(255,255,255,.07); color:#fff; }
.nav-cluster.active > .nav-primary { color: var(--text); }
.nav-cluster.active > .nav-primary > svg { color: var(--accent); }
.nav-primary.active { color: #fff; background: linear-gradient(110deg,rgba(8,101,255,.26),rgba(117,67,245,.18)); border-color: rgba(93,118,255,.35); }
.nav-primary.active > svg { color: #718dff; }
.nav-copy { display: flex; flex-direction: column; min-width: 0; flex: 1; line-height: 1.2; }
.nav-copy b { font-size: 13px; font-weight: 670; }
.nav-copy small { font-size: 10.5px; color: rgba(255,255,255,.4); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-chevron { display: grid; color: var(--text-3); transition: transform .16s ease; }
.nav-chevron svg { width: 14px; height: 14px; }
.nav-cluster[open] .nav-chevron { transform: rotate(180deg); }
.nav-children { padding: 2px 8px 9px 40px; display: grid; gap: 2px; }
.nav-child { display: flex; align-items: center; gap: 8px; min-height: 28px; padding: 5px 8px;
  border-left: 0; border-radius: 7px; color: var(--text-3); font-size: 11.5px; font-weight: 560; }
.nav-child svg { width: 13px; height: 13px; }
.nav-child:hover { color: var(--text); background: var(--hover); }
.nav-child.active { color: var(--accent-2); background: var(--accent-soft); }
.nav-item.active::before { display: none; }

.side-foot { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px; border-top-color:rgba(255,255,255,.1); }
.user-chip { padding: 7px; min-width: 0; }
.user-chip .meta b{color:#fff}.user-chip .meta span{color:rgba(255,255,255,.42)}
.sign-out { width: 34px; height: 34px; display: grid; place-items: center; color: var(--text-3); border-radius: 9px; }
.sign-out:hover { color: var(--neg); background: var(--neg-soft); }
.sign-out span { display: none; }
.sign-out svg { width: 17px; height: 17px; }

.topbar { min-height: 64px; padding: 8px 24px; background: rgba(255,255,255,.9); border-bottom-color: var(--line); backdrop-filter: blur(16px); }
[data-theme="dark"] .topbar { background: rgba(32,35,43,.9); }
.page-context { display: flex; align-items: center; gap: 9px; min-width: 0; }
.context-mark { color: var(--accent); font: 720 11px/1 var(--font); letter-spacing: .01em; white-space: nowrap; }
.topbar h1 { font-size: 17px; font-weight: 700; letter-spacing: -.018em; }
.topbar .sub { display: block; margin-top: 2px; font-size: 11.5px; }
.cmd-trigger { min-width: 276px; background: var(--surface-2); border-color: var(--line); border-radius: 10px; }
.cmd-trigger:hover { background: var(--surface); border-color: var(--accent-line); box-shadow: var(--shadow-sm); }
.cmd-trigger kbd { background: var(--surface); border-radius: 5px; font-family: var(--font); }
.icon-btn { border-radius: 10px; background: var(--surface); border-color: var(--line); }
.content { padding: 24px 28px 56px; }

.card, .kpi { border:0; border-radius:18px; box-shadow:0 14px 38px rgba(8,13,28,.055); }
.card.pad { padding: 20px; }
.btn { border-radius: 9px; box-shadow: none; }
.btn.primary { background: var(--accent); color: #fff; border-color: var(--accent); box-shadow: 0 5px 14px rgba(78,89,199,.16); }
.btn.primary:hover { background: var(--accent-2); border-color: var(--accent-2); box-shadow: 0 7px 18px rgba(78,89,199,.2); }
.btn.danger { background: var(--neg); border-color: var(--neg); color: #190709; }
.btn.danger:hover { filter: brightness(1.08); }
.badge { border-radius: 7px; }
.chip { border-radius: 7px; }
.input, textarea.input, select.input, .inp, textarea.inp, select.inp { border-radius: 9px; }

/* Command centre */
.pulse-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 0; background: var(--surface); border-radius:18px; overflow:hidden; box-shadow:0 18px 42px rgba(8,13,28,.06); }
.pulse-primary, .pulse-stat { min-height: 132px; padding: 18px; position: relative; overflow: hidden;
  background: var(--surface); border: 0; border-right: 1px solid var(--line); border-radius: 0; box-shadow:none; }
.pulse-primary { background: linear-gradient(145deg,#0865ff,#6547f4); border-color: transparent; color: #fff; }
.pulse-kicker { color: var(--text-3); font: 670 9.5px/1.2 var(--font); letter-spacing: .07em; text-transform: uppercase; }
.pulse-primary .pulse-kicker, .pulse-primary .pulse-meta { color: rgba(255,255,255,.7); }
.pulse-primary .pos { color: #a6efd4; }
.pulse-value { margin-top: 20px; font-size: clamp(25px,2.5vw,34px); line-height: .95; font-weight: 735; letter-spacing: -.04em; }
.pulse-primary .pulse-value { font-size: clamp(30px,3vw,42px); }
.pulse-meta { margin-top: 9px; color: var(--text-3); font-size: 11.5px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pulse-stat .spark { position: absolute; inset: auto 0 0; width: 100%; height: 38px; opacity: .8; }
.pulse-index { display: none; }

.command-layout { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(310px,.75fr); gap: 18px; margin-top: 18px; align-items: start; }
.priority-card { border-top: 0; }
.priority-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 10px; }
.priority-head h2 { font-size: 17px; letter-spacing: -.02em; }
.priority-head p { color: var(--text-3); font-size: 12px; }
.priority-count { margin-left: auto; min-width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px;
  font: 720 16px/1 var(--font); color: var(--warn); background: var(--warn-soft); }
.attention-list { display: grid; }
.attention-row { display: grid; grid-template-columns: 104px minmax(0,1fr) auto; align-items: center; gap: 12px;
  min-height: 46px; border-top: 1px solid var(--line); padding: 8px 0; }
.attention-type { font: 650 10px/1.2 var(--font); text-transform: uppercase; letter-spacing: .05em; color: var(--text-3); }
.attention-main { min-width: 0; }
.attention-main b { display: block; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attention-main span { display: block; color: var(--text-3); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attention-action { display: flex; gap: 6px; }
.all-clear { min-height: 150px; display: grid; place-items: center; color: var(--text-3); text-align: center; }

.workspace-grid { display: grid; gap: 0; background: var(--surface); border: 0; border-radius:18px; overflow:hidden; box-shadow:0 14px 38px rgba(8,13,28,.05); }
.workspace-row { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; align-items: center; gap: 11px;
  padding: 13px 15px; background: transparent; min-height: 66px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; }
.workspace-row:last-child{border-bottom:0}
.workspace-row:hover { background: var(--surface-2); transform:none; }
.workspace-row .wi { width: 32px; height: 32px; display: grid; place-items: center; color: var(--accent); background: var(--accent-soft); border-radius: 9px; }
.workspace-row .wi svg { width: 16px; height: 16px; }
.workspace-row b { display: block; font-size: 12.5px; }
.workspace-row small { display: block; color: var(--text-3); font-size: 10.5px; margin-top: 2px; }
.workspace-signal { color: var(--text-2); font: 650 11px/1 var(--font); }
.section-rule { display: flex; align-items: center; gap: 10px; margin: 24px 0 12px; }
.section-rule h2 { font: 650 10.5px/1 var(--font); text-transform: uppercase; letter-spacing: .1em; color: var(--text-3); }
.section-rule::after { content: ""; height: 1px; background: var(--line); flex: 1; }
.app-drawer summary { cursor: pointer; display: flex; align-items: center; gap: 9px; font-weight: 650; }
.app-drawer summary::marker { color: var(--accent); }

/* CRM workspace */
.workspace-tabs { display: flex; align-items: center; gap: 4px; border-bottom: 1px solid var(--line); margin: -4px 0 20px; overflow-x: auto; }
.workspace-tab { padding: 10px 12px 11px; color: var(--text-3); font-size: 11.5px; font-weight: 650; border-bottom: 2px solid transparent; white-space: nowrap; }
.workspace-tab:hover { color: var(--text); }
.workspace-tab.active { color: var(--accent-2); border-bottom-color: var(--accent); }
.global-workspace-tabs { margin: -4px 0 16px; }

/* Dense workspace primitives used across operational pages. */
.compact-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.compact-metric { min-height:82px; padding:13px 15px; background:var(--surface); border:1px solid var(--line); border-radius:11px; box-shadow:var(--shadow-sm); }
.compact-metric span { display:block; color:var(--text-3); font-size:9.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; }
.compact-metric b { display:inline-block; margin-top:8px; font-size:24px; line-height:1; letter-spacing:-.035em; }
.compact-metric small { margin-left:7px; color:var(--text-3); }
.dense-layout { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:start; }
.dense-list { display:grid; margin-top:8px; }
.dense-row { display:flex; align-items:center; gap:10px; min-height:48px; padding:8px 2px; border-top:1px solid var(--line); color:var(--text); }
.dense-row:first-child { border-top:0; }
.dense-row .grow { min-width:0; }
.dense-row b,.dense-row small { display:block; }
.dense-row small { color:var(--text-3); margin-top:2px; font-size:11px; }
.status-dot { width:8px; height:8px; border-radius:50%; flex:none; background:var(--text-3); box-shadow:0 0 0 4px var(--panel-2); }
.status-dot.ok { background:var(--pos); box-shadow:0 0 0 4px var(--pos-soft); }
.status-dot.off { background:var(--warn); box-shadow:0 0 0 4px var(--warn-soft); }
.integration-head { display:flex; align-items:center; gap:18px; margin-bottom:12px; }
.integration-brand { display:flex; align-items:center; gap:13px; flex:1; min-width:0; }
.integration-brand h2 { font-size:19px; letter-spacing:-.025em; }
.integration-brand p,.integration-card p,.compact-note p { margin-top:3px; color:var(--text-3); font-size:11.5px; }
.integration-mark { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:#111827; color:#fff; font-size:20px; font-weight:780; }
.integration-state { display:grid; grid-template-columns:auto auto; align-items:center; gap:7px; min-width:120px; }
.integration-state small { grid-column:1/-1; color:var(--text-3); }
.integration-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.integration-card { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:82px; color:var(--text); }
.integration-card:hover { border-color:var(--accent-line); transform:translateY(-1px); }
.integration-card svg { width:16px; color:var(--accent); }
.compact-note { margin-top:12px; }
.crm-command { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.crm-command .input { max-width: 320px; }
.crm-command .command-actions { margin-left: auto; display: flex; gap: 8px; }
.crm-command .seg { width: auto; }
.crm-command .seg-btn { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 8px; color: var(--text-3); font-size: 11.5px; font-weight: 650; }
.crm-command .seg-btn svg { width: 14px; height: 14px; }
.crm-command .seg-btn:hover { color: var(--text); }
.crm-command .seg-btn.on { color: var(--text); background: var(--elevated); }
.crm-metrics { display: grid; grid-template-columns: repeat(4,minmax(140px,1fr)); gap: 0; margin-bottom: 22px; background:var(--surface); border-radius:16px; overflow:hidden; box-shadow:0 14px 38px rgba(8,13,28,.05); }
.crm-metric { padding: 17px 18px; background: transparent; border: 0; border-right:1px solid var(--line); border-radius: 0; box-shadow: none; }
.crm-metric:last-child{border-right:0}
.crm-metric span { color: var(--text-3); font: 650 9.5px/1.2 var(--font); text-transform: uppercase; letter-spacing: .07em; }
.crm-metric b { display: block; margin-top: 6px; font-size: 19px; line-height: 1; }
.board { display: grid; grid-template-columns: repeat(auto-fit,minmax(270px,1fr)); grid-auto-flow: row; grid-auto-columns: unset; overflow: visible; align-items: start; gap: 14px; }
.col { min-height: 220px; max-height: 760px; overflow: hidden; border-radius: 16px; background: rgba(255,255,255,.52); border-color: transparent; }
.col-body { overflow-y: auto; }
.lead-card { border-radius: 10px; background: var(--surface); box-shadow: var(--shadow-sm); }

/* System is an operational ledger, not a grid of interchangeable cards. */
.system-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;padding:30px 34px;margin-bottom:30px;color:#fff;background:#080d1c;border-radius:20px;overflow:hidden;position:relative}
.system-hero::after{content:"";position:absolute;right:-90px;top:-170px;width:360px;height:360px;border-radius:50%;background:linear-gradient(145deg,rgba(8,101,255,.36),rgba(117,67,245,.24));filter:blur(2px)}
.system-hero>div,.system-hero dl{position:relative;z-index:1}
.system-kicker{display:block;margin-bottom:14px;color:rgba(255,255,255,.58);font-size:10px;font-weight:750;letter-spacing:.13em;text-transform:uppercase}
.system-hero strong{font-size:52px;line-height:.86;letter-spacing:-.06em}.system-hero strong i{font-size:22px;color:rgba(255,255,255,.42);font-style:normal;font-weight:500}.system-hero p{margin-top:10px;color:rgba(255,255,255,.55);font-size:12px}
.system-hero dl{display:grid;grid-template-columns:repeat(3,minmax(105px,1fr));min-width:min(48%,520px);margin:0}
.system-hero dl div{padding:3px 22px;border-left:1px solid rgba(255,255,255,.14)}.system-hero dt{color:rgba(255,255,255,.5);font-size:10px}.system-hero dd{margin:10px 0 0;font-size:27px;font-weight:720;letter-spacing:-.035em}.system-hero .warn-text{color:#f2bd72}
.system-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px}
.system-section{min-width:0}.system-section>header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:0 0 16px;border-bottom:2px solid #080d1c}.system-section>header h2{font-size:20px;letter-spacing:-.025em}.system-section>header p{margin-top:4px;color:var(--text-3);font-size:11px}.system-section>header a{display:flex;align-items:center;gap:6px;color:var(--accent-2);font-size:11px;font-weight:700;white-space:nowrap}.system-section>header svg{width:14px;height:14px}
.system-list{display:grid}.system-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:13px;min-height:72px;padding:13px 4px;color:var(--text);border-bottom:1px solid var(--line)}a.system-row:hover{padding-left:10px;background:linear-gradient(90deg,var(--accent-soft),transparent)}.system-row-copy{min-width:0}.system-row-copy b,.system-row-copy small{display:block}.system-row-copy b{font-size:13px}.system-row-copy small{margin-top:4px;color:var(--text-3);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.system-state{display:flex;align-items:center;gap:7px;color:var(--text-3);font-size:10.5px;font-weight:650}.system-state i{width:7px;height:7px;border-radius:50%;background:var(--warn)}.system-state.is-on{color:var(--pos)}.system-state.is-on i{background:var(--pos)}.system-empty{padding:30px 4px;color:var(--text-3)}

/* Branded sign-in surface */
.login-wrap { background: linear-gradient(145deg,#f8f8fb 0%,#eef0f7 100%); }
.login-card { width: min(430px,100%); padding: 34px; border-color: rgba(89,101,216,.14);
  border-radius: 20px; box-shadow: 0 28px 80px rgba(42,48,82,.14); }
.login-card .brand { border-bottom: 0; margin-bottom: 4px; }
.login-card h2 { margin-top: 20px; font-size: 24px; letter-spacing: -.035em; }
.login-card .btn.primary { min-height: 44px; }
[data-theme="dark"] .login-wrap { background: #17191f; }

@media (max-width: 1100px) {
  .pulse-grid { grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 980px) {
  .command-layout { grid-template-columns: 1fr; }
  .dense-layout { grid-template-columns:1fr; }
  .integration-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .crm-metrics { grid-template-columns: repeat(2,1fr); }
  .crm-metric:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .crm-metric:nth-child(4) { border-top: 1px solid var(--line); }
  .system-columns{grid-template-columns:1fr;gap:30px}.system-hero{align-items:flex-start;flex-direction:column}.system-hero dl{width:100%;min-width:0}
}
@media (max-width: 760px) {
  :root { --sidebar: 0px; }
  .sidebar { width: min(88vw,292px); flex-basis: min(88vw,292px); }
  .topbar { min-height: 62px; padding: 8px 12px; }
  .context-mark { display: none; }
  .content { padding: 14px 12px 54px; }
  .pulse-grid { grid-template-columns: 1fr 1fr; }
  .pulse-primary { grid-column: 1 / -1; min-height: 124px; }
  .pulse-stat { min-height: 118px; border-top: 1px solid var(--line); }
  .pulse-stat:nth-child(even) { border-left: 0; }
  .pulse-value { font-size: 27px; }
  .attention-row { grid-template-columns: 78px minmax(0,1fr); }
  .attention-action { grid-column: 2; }
  .crm-command .input { max-width: none; width: 100%; }
  .crm-command .command-actions { margin-left: 0; width: 100%; }
  .board { grid-template-columns: 1fr; }
  .col { max-height: none; }
  .compact-metrics { grid-template-columns:1fr; }
  .integration-head { align-items:flex-start; flex-wrap:wrap; }
  .integration-grid { grid-template-columns:1fr; }
  .system-hero{padding:24px 20px}.system-hero dl{grid-template-columns:1fr 1fr}.system-hero dl div{padding:10px 14px}.system-hero dl div:first-child{border-left:0}.system-section>header{align-items:flex-start}.system-row{grid-template-columns:minmax(0,1fr)}.system-state{grid-column:1}
}

@media (prefers-reduced-motion: reduce) {
  .nav-chevron, .sidebar, .toast, .modal, .palette, .workspace-row, .integration-card { transition: none !important; }
  .content > *, .stagger > *, .reveal { opacity: 1 !important; transform: none !important; animation: none !important; }
}

/* Command centre — glossy executive surface, grounded in the AG identity. */
.executive-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;min-height:320px;padding:42px 44px 64px;overflow:hidden;color:#fff;background:linear-gradient(125deg,#060a14 0%,#0b1635 56%,#162a70 100%);border-radius:26px;box-shadow:0 28px 70px rgba(8,13,28,.2)}
.executive-hero::before{content:"";position:absolute;z-index:-1;inset:-55% -20% auto 36%;height:170%;background:radial-gradient(circle at 50% 50%,rgba(49,92,255,.68),rgba(117,67,245,.24) 34%,transparent 68%);transform:rotate(-10deg)}
.executive-hero::after{content:"";position:absolute;inset:1px 1px auto;height:44%;border-radius:25px 25px 50% 50%;background:linear-gradient(180deg,rgba(255,255,255,.09),transparent);pointer-events:none}
.executive-mark{position:absolute;z-index:-1;right:440px;top:-36px;width:560px;opacity:.2;filter:saturate(1.45)}
.executive-copy{align-self:center;position:relative;z-index:1;max-width:620px}.executive-date{display:block;margin-bottom:15px;color:rgba(255,255,255,.55);font-size:10px;font-weight:750;letter-spacing:.15em;text-transform:uppercase}.executive-copy h2{font-size:clamp(38px,4.1vw,58px);font-weight:730;line-height:.98;letter-spacing:-.055em}.executive-copy h2 span{background:linear-gradient(90deg,#fff,#aabaff);-webkit-background-clip:text;background-clip:text;color:transparent}.executive-copy>p{max-width:500px;margin-top:16px;color:rgba(255,255,255,.65);font-size:13px;line-height:1.55}
.executive-actions{display:flex;gap:9px;margin-top:24px;flex-wrap:wrap}.hero-btn{display:inline-flex;align-items:center;gap:8px;min-height:39px;padding:0 14px;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:10px;font-size:11.5px;font-weight:680;backdrop-filter:blur(12px)}.hero-btn:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.28)}.hero-btn-light{color:#080d1c;background:#fff;border-color:#fff;box-shadow:0 10px 28px rgba(0,0,0,.18)}.hero-btn-light:hover{background:#f4f6ff}.hero-btn svg{width:15px;height:15px}
.executive-finance{align-self:center;position:relative;z-index:1;padding:25px;background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.07));border:1px solid rgba(255,255,255,.22);border-radius:20px;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 20px 50px rgba(0,0,0,.18);backdrop-filter:blur(18px)}.executive-finance>span{color:rgba(255,255,255,.62);font-size:10px;font-weight:720;letter-spacing:.08em;text-transform:uppercase}.executive-finance>strong{display:block;margin:17px 0 9px;font-size:47px;line-height:.9;letter-spacing:-.055em}.executive-finance .delta{color:rgba(255,255,255,.58)}.executive-finance .delta svg{display:none}.executive-finance dl{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:24px 0 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.14)}.executive-finance dl div+div{padding-left:20px;border-left:1px solid rgba(255,255,255,.14)}.executive-finance dt{color:rgba(255,255,255,.48);font-size:9.5px}.executive-finance dd{margin:7px 0 0;font-size:18px;font-weight:700}
.signal-rail{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:-34px 26px 24px;background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.8);border-radius:18px;box-shadow:0 22px 50px rgba(8,13,28,.12);backdrop-filter:blur(18px)}.signal-item{min-width:0;padding:18px 20px;border-right:1px solid var(--line)}.signal-item:last-child{border-right:0}.signal-item>span{display:block;color:var(--text-3);font-size:9.5px;font-weight:720;letter-spacing:.07em;text-transform:uppercase}.signal-item>strong{display:block;margin-top:9px;font-size:25px;line-height:1;letter-spacing:-.04em}.signal-item>small{display:block;min-height:15px;margin-top:7px;color:var(--text-3);font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.signal-item .delta{font-size:10.5px}.signal-item .delta svg{width:10px;height:10px}
.dashboard-focus{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:18px;align-items:stretch}.attention-panel,.work-panel,.insight-panel,.stream-panel{background:var(--surface);border-radius:20px;box-shadow:0 16px 44px rgba(8,13,28,.055)}.attention-panel,.work-panel,.insight-panel,.stream-panel{padding:24px}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.panel-kicker{display:block;margin-bottom:7px;color:var(--accent);font-size:9px;font-weight:760;letter-spacing:.13em;text-transform:uppercase}.panel-heading h2{font-size:19px;letter-spacing:-.028em}.panel-heading p{margin-top:5px;color:var(--text-3);font-size:11.5px}.attention-total{display:grid;place-items:center;width:44px;height:44px;flex:none;color:#8f5d14;background:linear-gradient(145deg,#fff7e9,#ffefd2);border:1px solid #f6dfb7;border-radius:14px;font-size:17px;font-weight:750;box-shadow:inset 0 1px 0 #fff}.clear-state{display:flex;align-items:center;gap:14px;min-height:132px;margin-top:14px;padding:20px;background:linear-gradient(110deg,#f8fafc,#f2f5ff);border-radius:15px}.clear-state>span{display:grid;place-items:center;width:42px;height:42px;color:var(--pos);background:#fff;border-radius:50%;box-shadow:0 10px 25px rgba(8,13,28,.08)}.clear-state svg{width:19px}.clear-state b{font-size:13px}.clear-state p{margin-top:4px;color:var(--text-3);font-size:11.5px}.attention-type.urgent{color:var(--neg)}.attention-type.waiting{color:var(--warn)}.attention-type.lead{color:var(--info)}
.command-deck{display:grid;grid-template-columns:1fr;gap:1px;overflow:hidden;background:var(--line);border-radius:20px;box-shadow:0 16px 44px rgba(8,13,28,.055)}.command-deck>a{display:grid;grid-template-columns:39px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:82px;padding:15px 18px;color:var(--text);background:var(--surface)}.command-deck>a:hover{position:relative;z-index:1;background:linear-gradient(145deg,#fff,#f2f4ff);box-shadow:inset 0 0 0 1px var(--accent-line)}.command-icon{display:grid;place-items:center;width:38px;height:38px;color:var(--accent);background:linear-gradient(145deg,#edf1ff,#f7f2ff);border-radius:12px;box-shadow:inset 0 1px 0 #fff}.command-icon svg{width:17px;height:17px}.command-deck b,.command-deck small{display:block}.command-deck b{font-size:13px}.command-deck small{margin-top:4px;color:var(--text-3);font-size:10.5px;line-height:1.35}.command-deck em{color:var(--text-2);font-size:12px;font-style:normal;font-weight:730;white-space:nowrap}
.dashboard-depth{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:18px;margin-top:18px}.work-panel,.insight-panel{min-height:305px}.text-link{display:flex;align-items:center;gap:5px;color:var(--accent-2);font-size:11px;font-weight:680}.text-link svg{width:13px;height:13px}.work-list{margin-top:15px}.work-list .task{min-height:46px}.work-list .tt span{color:var(--text-3);font-weight:400}.work-type{display:grid;place-items:center;width:27px;height:27px;color:var(--accent);background:var(--accent-soft);border-radius:8px}.work-type.urgent{color:var(--neg);background:var(--neg-soft)}.work-type svg{width:13px;height:13px}.work-clear{display:flex;align-items:center;justify-content:center;gap:11px;min-height:100px;color:var(--text-3)}.work-clear>svg{width:20px;color:var(--pos)}.work-clear b,.work-clear small{display:block}.work-clear b{color:var(--text);font-size:12.5px}.work-clear small{margin-top:3px;font-size:10.5px}.task-composer{display:grid;grid-template-columns:minmax(0,1fr) 112px auto auto;gap:7px;align-items:center;margin-top:14px;padding:8px;background:var(--surface-2);border-radius:13px}.task-composer .input{background:#fff}.task-composer label{display:flex;align-items:center;gap:5px;color:var(--text-3);font-size:10.5px;white-space:nowrap}.task-composer .btn{height:36px}
.insight-panel{background:linear-gradient(145deg,#fff 0%,#f7f8ff 100%)}.insight-value{font-size:22px;font-weight:740;letter-spacing:-.04em}.insight-panel>.chart{height:160px;margin-top:18px}.verified-empty{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:13px;min-height:104px;margin-top:16px;padding:16px;color:var(--text-2);background:rgba(255,255,255,.72);border:1px solid var(--line);border-radius:14px}.verified-empty>svg{width:23px;color:var(--accent)}.verified-empty b,.verified-empty p{display:block}.verified-empty b{font-size:12px}.verified-empty p{margin-top:4px;color:var(--text-3);font-size:10.5px}.verified-empty a{color:var(--accent-2);font-size:10.5px;font-weight:680}.pipeline-mini{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin-top:18px;overflow:hidden;background:var(--line);border-radius:12px}.pipeline-mini a{padding:11px;background:rgba(255,255,255,.82);color:var(--text)}.pipeline-mini span,.pipeline-mini b{display:block}.pipeline-mini span{color:var(--text-3);font-size:8.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pipeline-mini b{margin-top:5px;font-size:15px}
.operating-streams{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.site-stream{display:grid;margin-top:13px}.site-stream a{display:grid;grid-template-columns:minmax(0,1fr) auto 48px;align-items:center;gap:12px;min-height:50px;color:var(--text);border-top:1px solid var(--line)}.site-stream b,.site-stream small{display:block}.site-stream small{margin-top:3px;color:var(--text-3);font-size:10px}.site-stream em{color:var(--warn);font-size:9.5px;font-style:normal;font-weight:700}.site-stream em.is-live{color:var(--pos)}.site-stream strong{text-align:right;font-size:11px}.stream-panel .feed-item{padding-inline:0}
.estate-drawer{margin-top:18px;background:var(--surface);border-radius:18px;box-shadow:0 16px 44px rgba(8,13,28,.05)}.estate-drawer>summary{display:grid;grid-template-columns:minmax(0,1fr) auto 18px;align-items:center;gap:12px;min-height:62px;padding:0 21px;cursor:pointer;list-style:none}.estate-drawer>summary::-webkit-details-marker{display:none}.estate-drawer>summary span{display:flex;align-items:center;gap:9px;font-weight:680}.estate-drawer>summary svg{width:16px;height:16px;color:var(--accent)}.estate-drawer>summary b{color:var(--text-3);font-size:10.5px}.estate-drawer-body{padding:0 21px 21px;border-top:1px solid var(--line)}
@media(max-width:1120px){.executive-hero{grid-template-columns:minmax(0,1fr) 300px}.dashboard-focus,.dashboard-depth{grid-template-columns:1fr}.command-deck{grid-template-columns:1fr}.command-deck>a{min-height:82px}}
@media(max-width:760px){.executive-hero{display:block;min-height:0;padding:30px 24px 54px;border-radius:20px}.executive-mark{right:-40px;top:10px;width:210px}.executive-copy h2{font-size:39px}.executive-finance{margin-top:28px}.signal-rail{grid-template-columns:1fr 1fr;margin:-28px 12px 18px}.signal-item{padding:14px;border-bottom:1px solid var(--line)}.signal-item:nth-child(2){border-right:0}.signal-item:nth-child(3),.signal-item:nth-child(4){border-bottom:0}.dashboard-focus,.dashboard-depth,.operating-streams{grid-template-columns:1fr}.command-deck{grid-template-columns:1fr}.command-deck>a{min-height:76px}.task-composer{grid-template-columns:1fr auto}.task-composer select{grid-column:1}.pipeline-mini{grid-template-columns:repeat(3,1fr)}.panel-heading{gap:10px}}
@media(prefers-reduced-motion:reduce){.hero-btn,.command-deck>a,.estate-drawer>summary{transition:none!important}}

/* 2026 workspace redesign — richer pages, fewer repeated cards. */
.workspace-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:28px;overflow:hidden;margin-bottom:18px;padding:30px 32px;color:#f8faff;background:linear-gradient(128deg,#0b1430 0%,#17275b 56%,#4330a9 120%);border:1px solid rgba(255,255,255,.1);border-radius:26px;box-shadow:0 22px 62px rgba(27,39,86,.2)}
.workspace-hero:after{content:"";position:absolute;right:-90px;top:-135px;width:350px;height:350px;background:radial-gradient(circle,rgba(111,137,255,.34),transparent 67%);pointer-events:none}
.workspace-hero-copy{position:relative;z-index:1;align-self:center}.workspace-hero-copy h2{max-width:670px;font-size:30px;line-height:1.02;letter-spacing:-.045em}.workspace-hero-copy p{max-width:640px;margin-top:12px;color:rgba(231,237,255,.72);font-size:12.5px;line-height:1.6}.workspace-hero-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:19px}
.workspace-hero .btn{border-color:rgba(255,255,255,.16);color:#fff;background:rgba(255,255,255,.08)}.workspace-hero .btn:hover{background:rgba(255,255,255,.15)}.workspace-hero .btn.primary{color:#12204b;background:#fff;border-color:#fff}
.metric-ribbon{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-self:stretch;overflow:hidden;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);border-radius:21px;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 18px 48px rgba(3,8,24,.18);backdrop-filter:blur(22px)}
.metric-cell{padding:16px 18px;border-right:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}.metric-cell:nth-child(2n){border-right:0}.metric-cell:nth-last-child(-n+2){border-bottom:0}.metric-cell span,.metric-cell strong,.metric-cell small{display:block}.metric-cell span{color:rgba(224,232,255,.62);font-size:9px;letter-spacing:.08em;text-transform:uppercase}.metric-cell strong{margin-top:7px;color:#fff;font-size:21px;letter-spacing:-.035em}.metric-cell small{margin-top:3px;color:rgba(224,232,255,.55);font-size:9.5px}
.workspace-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 16px;padding:11px;background:rgba(255,255,255,.74);border:1px solid rgba(255,255,255,.86);border-radius:18px;box-shadow:var(--shadow);backdrop-filter:blur(18px)}.workspace-tools .input{min-width:220px}.workspace-tools .tool-spacer{margin-left:auto}
.section-shell{overflow:hidden;margin-bottom:18px;background:rgba(255,255,255,.76);border:1px solid rgba(255,255,255,.88);border-radius:24px;box-shadow:0 18px 52px rgba(8,13,28,.07);backdrop-filter:blur(20px)}.section-shell-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:21px 24px;border-bottom:1px solid var(--line)}.section-shell-header h3{font-size:16px;letter-spacing:-.025em}.section-shell-header p{margin-top:4px;color:var(--text-3);font-size:11.5px}.section-shell-body{padding:22px 24px}.section-shell.flush .section-shell-body{padding:0}
.section-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(310px,.8fr);gap:18px}.quiet-empty{display:flex;align-items:center;justify-content:center;gap:14px;min-height:185px;padding:28px;text-align:left;color:var(--text-3)}.quiet-empty>span{display:grid;place-items:center;width:48px;height:48px;flex:none;color:var(--accent);background:var(--accent-soft);border-radius:15px}.quiet-empty svg{width:21px}.quiet-empty b{display:block;color:var(--text);font-size:13px}.quiet-empty p{max-width:410px;margin-top:4px;font-size:11.5px;line-height:1.5}

/* Dashboard spacing. */
.dashboard-depth{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:20px}.attention-panel,.work-panel,.insight-panel,.stream-panel{padding:27px}.work-list{min-height:112px}.task-composer{grid-template-columns:minmax(0,1fr) 132px;margin-top:18px;padding:10px;gap:9px}.task-composer label{grid-column:1;padding-left:4px}.task-composer .btn{grid-column:2;width:100%}.pipeline-mini{margin-top:20px}.verified-empty{min-height:108px}

/* Relationship directory. */
.relationship-hero{background:linear-gradient(128deg,#091936,#123866 62%,#18569b 120%)}.relationship-directory-head,.relationship-row{display:grid;grid-template-columns:minmax(260px,1.4fr) minmax(145px,.55fr) 120px minmax(150px,.65fr) 22px;gap:18px;align-items:center}.relationship-directory-head{padding:12px 24px;color:var(--text-3);font-size:9px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;background:var(--surface-2)}.relationship-row{min-height:78px;padding:13px 24px;border-top:1px solid var(--line);transition:background .16s ease}.relationship-row:first-child{border-top:0}.relationship-row:hover{background:var(--hover)}.relationship-person{display:flex;align-items:center;gap:13px;min-width:0}.relationship-person .av{width:41px;height:41px;flex:none}.relationship-person b,.relationship-person span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.relationship-person b{font-size:13px}.relationship-person span{margin-top:3px;color:var(--text-3);font-size:10.5px}.relationship-stage{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:650}.relationship-stage:before{content:"";width:7px;height:7px;background:var(--stage,#76829a);border-radius:50%;box-shadow:0 0 0 4px color-mix(in srgb,var(--stage,#76829a) 14%,transparent)}.relationship-value{text-align:right;font-size:13px;font-weight:700}.relationship-domain{overflow:hidden;color:var(--text-2);font-size:10.5px;text-overflow:ellipsis;white-space:nowrap}.relationship-arrow{color:var(--text-3)}

/* Microsoft 365 inbox. */
.mail-hero{background:linear-gradient(128deg,#071b38,#073e78 58%,#176dc2 120%)}.ms-mark{display:grid;grid-template-columns:repeat(2,12px);gap:2px;width:26px;margin-bottom:16px}.ms-mark i{height:12px;background:#f25022}.ms-mark i:nth-child(2){background:#7fba00}.ms-mark i:nth-child(3){background:#00a4ef}.ms-mark i:nth-child(4){background:#ffb900}.mail-status{display:flex;align-items:center;gap:10px;margin-top:18px;color:rgba(235,243,255,.76);font-size:11px}.mail-status:before{content:"";width:8px;height:8px;background:var(--pos);border-radius:50%;box-shadow:0 0 0 5px rgba(93,214,174,.13)}.mail-status.offline:before{background:var(--warn);box-shadow:0 0 0 5px rgba(239,182,97,.13)}.mail-list-shell{min-height:300px}.mail-empty{display:flex;align-items:center;justify-content:center;gap:16px;min-height:245px;padding:32px;text-align:left}.mail-empty>span{display:grid;place-items:center;width:54px;height:54px;color:#1976d2;background:#eaf4ff;border-radius:16px}.mail-empty b{display:block;font-size:14px}.mail-empty p{max-width:480px;margin-top:5px;color:var(--text-3);font-size:11.5px;line-height:1.55}

/* Deal Finder. */
.deal-hero{background:linear-gradient(128deg,#11152e,#25275c 58%,#57339b 120%)}.deal-scan{display:grid;grid-template-columns:210px minmax(210px,1fr) repeat(2,minmax(110px,.35fr)) auto;gap:11px;align-items:end}.deal-scan label{display:grid;gap:6px;color:var(--text-3);font-size:10.5px}.deal-scan input,.deal-scan select{width:100%;height:40px}.deal-readiness{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center}.readiness-ring{display:grid;place-items:center;width:66px;height:66px;background:conic-gradient(var(--accent) calc(var(--ready)*1%),var(--surface-2) 0);border-radius:50%}.readiness-ring:after{content:attr(data-value);display:grid;place-items:center;width:50px;height:50px;color:var(--text);background:var(--surface);border-radius:50%;font-size:12px;font-weight:750}

/* SEO command view. */
.seo-hero{background:linear-gradient(128deg,#061d2a,#073f50 58%,#176b7c 120%)}.score-pair{display:flex;gap:22px;align-items:flex-end}.score-pair div{min-width:92px}.score-pair span,.score-pair strong,.score-pair small{display:block}.score-pair span{color:var(--text-3);font-size:9px;text-transform:uppercase;letter-spacing:.07em}.score-pair strong{margin-top:6px;font-size:29px;letter-spacing:-.05em}.score-pair small{margin-top:2px;color:var(--text-3);font-size:10px}.site-roster .row{padding:15px 0}.seo-connection{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center}.seo-connection-mark{display:grid;place-items:center;width:48px;height:48px;color:var(--accent);background:var(--accent-soft);border-radius:14px}

/* Growth plan. */
.plan-hero{background:linear-gradient(128deg,#15132e,#353068 58%,#6544a8 120%)}.target-ledger{display:grid;gap:1px;overflow:hidden;background:var(--line);border:1px solid var(--line);border-radius:18px}.target-row{display:grid;grid-template-columns:minmax(210px,1fr) minmax(180px,.8fr) 140px auto;gap:20px;align-items:center;padding:20px 22px;background:var(--surface)}.target-row:hover{background:var(--hover)}.target-name b{display:block;font-size:13.5px}.target-name span{display:block;margin-top:5px;color:var(--text-3);font-size:10.5px}.target-progress .meter{margin-top:7px}.target-progress small{color:var(--text-3);font-size:10px}.target-value{text-align:right}.target-value b,.target-value span{display:block}.target-value b{font-size:15px}.target-value span{margin-top:3px;color:var(--text-3);font-size:10px}.milestone-ladder{position:relative;display:grid;gap:10px}.milestone-item{display:grid;grid-template-columns:110px 1fr auto;gap:18px;align-items:center;padding:19px 21px;background:var(--surface);border:1px solid var(--line);border-radius:15px}.milestone-item.is-next{border-color:var(--accent-line);box-shadow:inset 3px 0 0 var(--accent)}.milestone-trigger b,.milestone-trigger span{display:block}.milestone-trigger b{font-size:16px}.milestone-trigger span{color:var(--text-3);font-size:9px;text-transform:uppercase;letter-spacing:.08em}

/* Finance cockpit. */
.finance-hero{background:linear-gradient(128deg,#07192a,#0a3c58 58%,#096f75 120%)}.finance-hero .metric-ribbon{grid-template-columns:repeat(2,minmax(0,1fr))}.finance-summary{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:18px}.finance-main-value{padding:26px;background:linear-gradient(145deg,var(--surface),var(--surface-2));border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)}.finance-main-value>span{color:var(--text-3);font-size:10px;text-transform:uppercase;letter-spacing:.08em}.finance-main-value>strong{display:block;margin-top:10px;font-size:34px;letter-spacing:-.05em}.finance-main-value>p{max-width:620px;margin-top:8px;color:var(--text-3);font-size:11.5px;line-height:1.55}.finance-breakdown{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;overflow:hidden;margin-top:20px;background:var(--line);border-radius:13px}.finance-breakdown>div{padding:14px;background:var(--surface)}.finance-breakdown span,.finance-breakdown b,.finance-breakdown small{display:block}.finance-breakdown span{color:var(--text-3);font-size:9px}.finance-breakdown b{margin-top:6px;font-size:15px}.finance-breakdown small{margin-top:3px;color:var(--text-3);font-size:9px}.cash-waterfall{display:flex;align-items:stretch;gap:1px;overflow:hidden;background:var(--line);border-radius:16px}.cash-step{flex:1;min-width:95px;padding:18px 15px;background:var(--surface)}.cash-step span,.cash-step b,.cash-step small{display:block}.cash-step span{color:var(--text-3);font-size:9px;text-transform:uppercase;letter-spacing:.06em}.cash-step b{margin-top:8px;font-size:18px}.cash-step small{margin-top:4px;color:var(--text-3);font-size:9.5px}.cash-step.positive b{color:var(--pos)}.cash-step.negative b{color:var(--neg)}.cash-step.total{background:var(--accent-soft)}

/* Automation control room. */
.automation-hero{background:linear-gradient(128deg,#11152b,#272f61 58%,#384fa1 120%)}.automation-groups{display:grid;gap:18px}.automation-group{overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)}.automation-group-head{display:flex;align-items:center;gap:12px;padding:20px 22px;background:var(--surface-2);border-bottom:1px solid var(--line)}.automation-group-head>span{display:grid;place-items:center;width:38px;height:38px;color:var(--accent);background:var(--accent-soft);border-radius:11px}.automation-group-head h3{font-size:14px}.automation-group-head p{margin-top:3px;color:var(--text-3);font-size:10.5px}.automation-job{display:grid;grid-template-columns:minmax(260px,1.3fr) minmax(210px,.7fr) auto;gap:22px;align-items:start;padding:21px 22px;border-top:1px solid var(--line)}.automation-job:first-child{border-top:0}.automation-job-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.automation-job-title b{font-size:13px}.automation-job-copy{margin-top:6px;color:var(--text-3);font-size:11px;line-height:1.45}.automation-schedule{display:grid;gap:7px;color:var(--text-2);font-size:10.5px}.automation-schedule span{display:flex;gap:7px;align-items:center}.automation-schedule svg{width:13px;color:var(--accent)}.automation-actions{display:flex;justify-content:flex-end;gap:7px;flex-wrap:wrap;max-width:290px}.automation-settings{grid-column:1/3;margin-top:-7px;padding:11px 13px;background:var(--surface-2);border-radius:12px}

/* Premium dark mode: clean navy, crisp hierarchy, restrained glow. */
[data-theme="dark"] body{color:var(--text);background:#0c111b}
[data-theme="dark"] .topbar{background:rgba(12,17,27,.9);border-bottom-color:var(--line)}
[data-theme="dark"] .global-workspace-tabs{background:rgba(12,17,27,.72)}
[data-theme="dark"] .executive-hero{border:1px solid rgba(125,145,255,.22);box-shadow:0 30px 90px rgba(0,0,0,.48),0 0 60px rgba(49,92,255,.1)}
[data-theme="dark"] .signal-rail{background:rgba(21,28,41,.94);border-color:rgba(153,170,212,.14);box-shadow:0 24px 60px rgba(0,0,0,.38)}
[data-theme="dark"] .attention-panel,[data-theme="dark"] .work-panel,[data-theme="dark"] .insight-panel,[data-theme="dark"] .stream-panel,[data-theme="dark"] .estate-drawer{background:linear-gradient(145deg,#171f2e,#131a26);box-shadow:0 18px 54px rgba(0,0,0,.32)}
[data-theme="dark"] .clear-state{background:linear-gradient(110deg,#111924,#172139)}[data-theme="dark"] .clear-state>span{background:#202a3b;box-shadow:none}
[data-theme="dark"] .command-deck{background:rgba(188,202,232,.09);box-shadow:0 18px 54px rgba(0,0,0,.32)}[data-theme="dark"] .command-deck>a{background:#151c29}[data-theme="dark"] .command-deck>a:hover{background:linear-gradient(145deg,#1b2434,#1c2440)}[data-theme="dark"] .command-icon{background:linear-gradient(145deg,rgba(70,96,255,.22),rgba(117,67,245,.16));box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
[data-theme="dark"] .insight-panel{background:linear-gradient(145deg,#171f2e,#151a30)}[data-theme="dark"] .verified-empty{background:rgba(7,11,19,.42)}[data-theme="dark"] .pipeline-mini{background:rgba(188,202,232,.1)}[data-theme="dark"] .pipeline-mini a{background:rgba(16,23,34,.88)}[data-theme="dark"] .task-composer{background:#101722}[data-theme="dark"] .task-composer .input{background:#0e1420}
[data-theme="dark"] .section-shell,[data-theme="dark"] .automation-group,[data-theme="dark"] .finance-main-value{box-shadow:0 18px 54px rgba(0,0,0,.26)}[data-theme="dark"] .mail-empty>span{background:rgba(25,118,210,.17)}

@media(max-width:1050px){.workspace-hero{grid-template-columns:1fr}.metric-ribbon{min-height:150px}.section-grid,.finance-summary{grid-template-columns:1fr}.deal-scan{grid-template-columns:repeat(2,minmax(0,1fr))}.deal-scan .btn{width:100%}.target-row{grid-template-columns:minmax(200px,1fr) minmax(180px,1fr) auto}.target-row>details{grid-column:1/-1}.automation-job{grid-template-columns:1fr auto}.automation-schedule{grid-column:1}.automation-actions{grid-column:2;grid-row:1/3}.automation-settings{grid-column:1/-1}}
@media(max-width:760px){.workspace-hero{padding:25px 22px;border-radius:18px}.workspace-hero-copy h2{font-size:26px}.metric-ribbon{grid-template-columns:1fr 1fr}.workspace-tools{align-items:stretch}.workspace-tools .input{width:100%;max-width:none}.workspace-tools .tool-spacer{margin-left:0}.section-shell-header{padding:18px}.section-shell-body{padding:18px}.relationship-directory-head{display:none}.relationship-row{grid-template-columns:1fr auto;padding:15px 18px}.relationship-stage,.relationship-domain{display:none}.relationship-value{text-align:right}.relationship-arrow{display:none}.task-composer{grid-template-columns:1fr}.task-composer select,.task-composer label,.task-composer .btn{grid-column:1}.deal-scan{grid-template-columns:1fr}.deal-readiness,.seo-connection{grid-template-columns:auto 1fr}.deal-readiness>:last-child,.seo-connection>:last-child{grid-column:1/-1}.target-row{grid-template-columns:1fr}.target-value{text-align:left}.milestone-item{grid-template-columns:1fr}.finance-breakdown{grid-template-columns:1fr}.cash-waterfall{display:grid;grid-template-columns:1fr 1fr}.automation-job{grid-template-columns:1fr}.automation-actions,.automation-schedule,.automation-settings{grid-column:1;grid-row:auto;justify-content:flex-start;max-width:none}}
@media(prefers-reduced-motion:reduce){.relationship-row,.workspace-hero .btn{transition:none!important}.reveal,.stagger>*{opacity:1!important;transform:none!important;animation:none!important}}

.automation-group{background:rgba(255,255,255,.76);border-color:rgba(255,255,255,.88);border-radius:24px;backdrop-filter:blur(20px)}
[data-theme="dark"] .workspace-tools,[data-theme="dark"] .section-shell,[data-theme="dark"] .automation-group,[data-theme="dark"] .finance-main-value{background:rgba(21,28,41,.78);border-color:rgba(188,202,232,.13);box-shadow:0 18px 54px rgba(0,0,0,.26);backdrop-filter:blur(22px)}
.panel-heading h2{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.panel-heading h2 small{color:var(--text-3);font-size:10.5px;font-weight:500;letter-spacing:0}
.automation-group>summary{cursor:pointer;list-style:none}.automation-group>summary::-webkit-details-marker{display:none}.automation-group>summary>svg:last-child{width:15px;color:var(--text-3);transition:transform .16s ease}.automation-group[open]>summary>svg:last-child{transform:rotate(180deg)}
@media(prefers-reduced-motion:reduce){.automation-group>summary>svg:last-child{transition:none}}

.delivery-hero{background:linear-gradient(128deg,#08162c,#12345a 58%,#1d6f9d 120%)}

/* Frosted treatment across legacy workspaces while their layouts are consolidated. */
.card,.kpi{background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.86);border-radius:22px;box-shadow:0 18px 50px rgba(8,13,28,.07);backdrop-filter:blur(20px)}
.kpi{padding:20px}.kpi .ic{border-radius:12px}.empty-state{border-radius:18px}.modal,.palette{background:rgba(255,255,255,.88);backdrop-filter:blur(24px)}
[data-theme="dark"] .card,[data-theme="dark"] .kpi{background:rgba(21,28,41,.76);border-color:rgba(188,202,232,.13);box-shadow:0 18px 50px rgba(0,0,0,.25)}
[data-theme="dark"] .modal,[data-theme="dark"] .palette{background:rgba(21,28,41,.9)}

/* Analytics: full-width commercial view with distinct glass and data surfaces. */
.analytics-page{display:grid;gap:18px;width:100%}
.analytics-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(330px,.75fr) minmax(590px,1.25fr);gap:28px;overflow:hidden;min-height:275px;padding:34px;border:1px solid rgba(255,255,255,.14);border-radius:28px;color:#fff;background:linear-gradient(125deg,#07152b 0%,#16295f 48%,#433a9c 100%);box-shadow:0 28px 70px rgba(20,28,69,.2)}
.analytics-hero:before{content:"";position:absolute;z-index:-1;left:17%;top:-110px;width:520px;height:420px;background:url('/static/img/ag-monogram-colour.svg') center/contain no-repeat;opacity:.13;transform:rotate(-5deg)}
.analytics-hero:after{content:"";position:absolute;z-index:-2;inset:auto -120px -210px auto;width:520px;height:520px;border-radius:50%;background:rgba(100,81,255,.34);filter:blur(12px)}
.analytics-hero-copy{align-self:center;max-width:560px}.analytics-hero-copy h2{font-size:clamp(38px,3.3vw,56px);font-weight:740;line-height:.96;letter-spacing:-.055em}.analytics-hero-copy p{max-width:510px;margin-top:17px;color:rgba(235,240,255,.7);font-size:13px;line-height:1.6}.analytics-hero-note{display:flex;align-items:center;gap:9px;margin-top:26px;color:rgba(235,240,255,.66);font-size:11px}.analytics-hero-note .status-dot{width:8px;height:8px;border-radius:50%;background:#5bdeb3;box-shadow:0 0 0 5px rgba(91,222,179,.13)}.analytics-hero-note .status-dot.off{background:#edb65f;box-shadow:0 0 0 5px rgba(237,182,95,.13)}
.analytics-hero-metrics{align-self:stretch;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:hidden;border:1px solid rgba(255,255,255,.2);border-radius:22px;background:rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.analytics-hero-metrics>div{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:25px 22px;border-left:1px solid rgba(255,255,255,.15)}.analytics-hero-metrics>div:first-child{border-left:0}.analytics-hero-metrics span{color:rgba(232,237,255,.62);font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.analytics-hero-metrics strong{margin-top:15px;font-size:clamp(27px,2.5vw,40px);letter-spacing:-.05em}.analytics-hero-metrics small{margin-top:9px;color:rgba(233,238,255,.68);font-size:10.5px;line-height:1.4}
.analytics-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.analytics-kpi{display:grid;grid-template-columns:auto minmax(0,1fr);gap:13px;align-items:start;min-height:128px;padding:19px;border:1px solid rgba(255,255,255,.88);border-radius:20px;background:rgba(255,255,255,.7);box-shadow:0 15px 42px rgba(8,13,28,.06);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.analytics-kpi-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;color:var(--accent);background:var(--accent-soft)}.analytics-kpi-icon svg{width:17px}.analytics-kpi div>span,.analytics-kpi strong,.analytics-kpi small{display:block}.analytics-kpi div>span{color:var(--text-3);font-size:10.5px}.analytics-kpi strong{margin-top:9px;font-size:25px;letter-spacing:-.045em}.analytics-kpi small{margin-top:5px;color:var(--text-3);font-size:9.5px;line-height:1.35}
.analytics-primary-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(330px,.65fr);gap:16px}.analytics-chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.analytics-card,.analytics-insight{min-width:0;padding:22px;border:1px solid rgba(255,255,255,.88);border-radius:22px;background:rgba(255,255,255,.72);box-shadow:0 18px 50px rgba(8,13,28,.07);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.analytics-card>header,.analytics-insight>header{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:16px}.analytics-card header h3,.analytics-insight header h3{font-size:14px;letter-spacing:-.015em}.analytics-card header p,.analytics-insight header p{margin-top:4px;color:var(--text-3);font-size:10.5px;line-height:1.45}.analytics-card>header>span,.analytics-insight>header>span{flex:none;color:var(--text-3);font-size:10px}.analytics-trajectory .chart{width:100%;height:270px}.analytics-chart{width:100%;height:220px}.analytics-trajectory footer{display:flex;align-items:center;gap:16px;padding-top:13px;border-top:1px solid var(--line);color:var(--text-3);font-size:9.5px}.analytics-trajectory footer span{display:flex;align-items:center;gap:6px}.analytics-trajectory footer i{width:8px;height:8px;border-radius:50%;background:#375dff}.analytics-trajectory footer i.projected{background:#9388f8}.analytics-trajectory footer b{margin-left:auto;color:var(--pos);font-size:10px}
.analytics-revenue-list{display:grid;gap:15px}.analytics-revenue-row>div:first-child{display:flex;justify-content:space-between;gap:10px;margin-bottom:7px;font-size:10.5px}.analytics-revenue-row b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.analytics-revenue-row span{flex:none;color:var(--text-3)}.analytics-meter{height:6px;overflow:hidden;border-radius:99px;background:var(--accent-soft)}.analytics-meter i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3165ff,#7a5df2)}.analytics-empty{display:grid;place-items:center;min-height:140px;color:var(--text-3);font-size:11px}
.analytics-insight-grid{display:grid;grid-template-columns:minmax(350px,1.15fr) minmax(270px,.85fr) minmax(270px,.85fr);gap:16px}.analytics-stage-list{display:grid;grid-template-columns:1fr 1fr;gap:13px 18px}.analytics-stage-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}.analytics-stage-row>div:first-child{display:flex;justify-content:space-between;gap:10px;grid-column:1/-1;color:var(--text-2);font-size:10px}.analytics-stage-row>small{color:var(--text-3);font-size:9px}.analytics-stage-row .analytics-meter{align-self:center}
.analytics-facts{display:grid;grid-template-columns:1fr 1fr;gap:1px;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:var(--line)}.analytics-facts>div{padding:16px;background:rgba(255,255,255,.62)}.analytics-facts dt{color:var(--text-3);font-size:9.5px;line-height:1.35}.analytics-facts dd{margin-top:9px;font-size:18px;font-weight:720;letter-spacing:-.03em}.analytics-output{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:var(--line)}.analytics-output>div{min-width:0;padding:15px 11px;background:rgba(255,255,255,.62)}.analytics-output span{display:grid;place-items:center;width:28px;height:28px;color:var(--accent);background:var(--accent-soft);border-radius:9px}.analytics-output svg{width:14px}.analytics-output strong,.analytics-output small{display:block}.analytics-output strong{margin-top:15px;font-size:22px;letter-spacing:-.04em}.analytics-output small{margin-top:5px;color:var(--text-3);font-size:9px;line-height:1.35}
.analytics-assumptions{overflow:hidden;border:1px solid rgba(255,255,255,.88);border-radius:18px;background:rgba(255,255,255,.58);box-shadow:0 13px 35px rgba(8,13,28,.045);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.analytics-assumptions summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 20px;cursor:pointer;font-size:11.5px;font-weight:680;list-style:none}.analytics-assumptions summary::-webkit-details-marker{display:none}.analytics-assumptions summary span{color:var(--text-3);font-size:9.5px;font-weight:500}.analytics-assumptions>div{display:grid;gap:7px;padding:0 20px 18px;color:var(--text-3);font-size:10px;line-height:1.5}
[data-theme="dark"] .analytics-kpi,[data-theme="dark"] .analytics-card,[data-theme="dark"] .analytics-insight,[data-theme="dark"] .analytics-assumptions{background:rgba(21,28,41,.78);border-color:rgba(188,202,232,.13);box-shadow:0 18px 50px rgba(0,0,0,.27)}[data-theme="dark"] .analytics-facts>div,[data-theme="dark"] .analytics-output>div{background:rgba(16,23,35,.82)}
@media(max-width:1350px){.analytics-hero{grid-template-columns:minmax(300px,.7fr) minmax(470px,1.3fr)}.analytics-hero-metrics>div{padding:22px 17px}.analytics-kpis{grid-template-columns:repeat(3,1fr)}.analytics-insight-grid{grid-template-columns:1fr 1fr}.analytics-pipeline-card{grid-column:1/-1}}
@media(max-width:1050px){.analytics-hero{grid-template-columns:1fr;padding:28px}.analytics-primary-grid,.analytics-chart-grid{grid-template-columns:1fr}.analytics-hero-metrics{min-height:170px}.analytics-kpis{grid-template-columns:repeat(2,1fr)}.analytics-insight-grid{grid-template-columns:1fr}.analytics-pipeline-card{grid-column:auto}}
@media(max-width:650px){.topbar .cmd-trigger{display:none}.topbar .page-context{flex:1}.topbar .sub{display:none}.topbar h1{white-space:nowrap}.executive-hero{padding:25px 19px 28px;border-radius:20px}.executive-mark{right:-58px;top:4px;width:245px;opacity:.13}.executive-copy h2{font-size:36px}.executive-date{margin-bottom:12px}.executive-copy>p{margin-top:13px;font-size:12px}.executive-actions{display:grid;grid-template-columns:1fr;margin-top:20px}.hero-btn{justify-content:center;width:100%;min-height:44px}.executive-finance{margin-top:22px;padding:20px;border-radius:17px}.executive-finance>strong{margin:13px 0 8px;font-size:39px}.executive-finance dl{margin-top:18px;padding-top:15px}.executive-finance dd{font-size:16px}.signal-rail{margin:12px 0 18px;border-radius:16px}.signal-item{padding:14px 13px}.signal-item>strong{font-size:22px}.dashboard-depth,.operating-streams{grid-template-columns:minmax(0,1fr)}.work-panel,.insight-panel{padding:20px;min-width:0}.analytics-hero{padding:25px 21px;border-radius:21px}.analytics-hero-copy h2{font-size:38px}.analytics-hero-metrics{grid-template-columns:1fr}.analytics-hero-metrics>div{padding:18px;border-top:1px solid rgba(255,255,255,.15);border-left:0}.analytics-hero-metrics>div:first-child{border-top:0}.analytics-kpis{grid-template-columns:1fr}.analytics-card,.analytics-insight{padding:18px;border-radius:18px}.analytics-stage-list{grid-template-columns:1fr}.analytics-facts{grid-template-columns:1fr}.analytics-output{grid-template-columns:1fr 1fr}.analytics-output>div:last-child{grid-column:1/-1}.analytics-trajectory .chart,.analytics-chart{height:210px}.analytics-card>header,.analytics-insight>header{display:block}.analytics-card>header>span,.analytics-insight>header>span{display:block;margin-top:7px}.analytics-assumptions summary{align-items:flex-start}.analytics-assumptions summary span{text-align:right}}
@media(prefers-reduced-motion:reduce){.analytics-page *{scroll-behavior:auto!important}.analytics-hero:before{transform:none}}

/* Growth Studio publishing desk: native SocialM8 operations inside Core. */
.publish-page{display:grid;gap:18px;width:100%;padding-bottom:34px}.publish-page [hidden]{display:none!important}
.publish-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(320px,.76fr) minmax(560px,1.24fr);gap:28px;overflow:hidden;min-height:300px;padding:36px;border:1px solid rgba(255,255,255,.17);border-radius:28px;color:#fff;background:linear-gradient(122deg,#07162c 0%,#17285f 48%,#4b3ca4 100%);box-shadow:0 28px 72px rgba(21,28,69,.2)}
.publish-hero:before{content:"";position:absolute;z-index:-1;left:18%;bottom:-150px;width:550px;height:500px;background:url('/static/img/ag-monogram-colour.svg') center/contain no-repeat;opacity:.14;transform:rotate(-7deg)}.publish-hero:after{content:"";position:absolute;z-index:-2;right:-160px;top:-270px;width:560px;height:560px;border-radius:50%;background:rgba(103,91,255,.4);filter:blur(24px)}
.publish-hero-copy{align-self:center;max-width:560px}.publish-state{display:flex;align-items:center;gap:8px;color:rgba(239,242,255,.7);font-size:10px;font-weight:680;letter-spacing:.04em}.publish-state i{width:8px;height:8px;border-radius:50%;background:#e5ae5f;box-shadow:0 0 0 5px rgba(229,174,95,.13)}.publish-state i.live{background:#55d5aa;box-shadow:0 0 0 5px rgba(85,213,170,.13)}.publish-hero h2{margin-top:24px;font-size:clamp(42px,4vw,65px);font-weight:760;line-height:.92;letter-spacing:-.065em}.publish-hero-copy>p{max-width:500px;margin-top:17px;color:rgba(236,240,255,.72);font-size:13px;line-height:1.55}.publish-hero-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:27px}.publish-hero .btn{min-height:41px}.publish-hero .btn.light{color:#10182a;background:#fff;border-color:#fff}.publish-hero .btn.glass{color:#fff;background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.23)}.publish-service-error{font-size:10px!important;color:#ffd6a4!important}
.publish-metrics{align-self:stretch;display:grid;grid-template-columns:1fr 1fr;gap:1px;overflow:hidden;margin:0;border:1px solid rgba(255,255,255,.2);border-radius:22px;background:rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px)}.publish-metrics>div{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:25px 24px;background:rgba(9,18,49,.11)}.publish-metrics dt{color:rgba(233,237,255,.63);font-size:9.5px;font-weight:680;letter-spacing:.055em;text-transform:uppercase}.publish-metrics dd{margin:14px 0 0;font-size:35px;font-weight:750;letter-spacing:-.05em}.publish-metrics small{margin-top:6px;color:rgba(233,238,255,.67);font-size:10px}.publish-metrics .needs-attention{background:rgba(179,81,78,.2)}
.publish-workbench{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(315px,.5fr);gap:18px;align-items:start}.publish-sidebar{display:grid;gap:18px}.publish-panel{min-width:0;overflow:hidden;border:1px solid rgba(255,255,255,.88);border-radius:24px;background:rgba(255,255,255,.72);box-shadow:0 18px 52px rgba(8,13,28,.07);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}.publish-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 23px;border-bottom:1px solid var(--line)}.publish-panel-head h2{font-size:15px;letter-spacing:-.02em}.publish-panel-head p{margin-top:5px;color:var(--text-3);font-size:10.5px;line-height:1.45}.publish-panel-head>a{flex:none;color:var(--accent);font-size:10.5px;font-weight:680}.publish-panel-head>a svg{width:13px;vertical-align:-3px}.publish-count{flex:none;padding:6px 9px;border-radius:8px;color:var(--text-2);background:var(--accent-soft);font-size:9.5px;font-weight:680}
.publish-form{display:grid;gap:18px;padding:23px}.publish-composer-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.publish-field{display:grid;gap:7px}.publish-field>span,.publish-destinations legend{color:var(--text-2);font-size:9.5px;font-weight:680}.publish-field .input{width:100%;max-width:none;min-height:43px;background:rgba(255,255,255,.64)}.publish-caption textarea.input{min-height:144px;resize:vertical;line-height:1.55}.publish-destinations{min-width:0;margin:0;padding:0;border:0}.publish-destinations legend{margin-bottom:9px}.publish-account-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}.publish-account-option{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 13px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.48);cursor:pointer}.publish-account-option>input{accent-color:var(--accent)}.publish-platform-mark{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;color:var(--accent);background:var(--accent-soft);font-size:11px;font-style:normal;font-weight:760}.publish-account-option span b,.publish-account-option span small{display:block}.publish-account-option span b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px}.publish-account-option span small{margin-top:3px;color:var(--text-3);font-size:8.5px}.publish-account-option>i{color:var(--pos);font-size:8.5px;font-style:normal}.publish-account-option>i.off{color:var(--neg)}.publish-destination-empty{grid-column:1/-1;padding:18px;border:1px dashed var(--line);border-radius:13px;color:var(--text-3);font-size:10.5px;text-align:center}.publish-assets-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.publish-upload{position:relative;display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;min-height:66px;padding:12px 14px;border:1px dashed var(--line);border-radius:13px;background:rgba(255,255,255,.42);cursor:pointer}.publish-upload>span{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;color:var(--accent);background:var(--accent-soft)}.publish-upload svg{width:16px}.publish-upload b{font-size:10.5px}.publish-upload small{overflow:hidden;color:var(--text-3);font-size:8.5px;text-overflow:ellipsis;white-space:nowrap}.publish-upload input{position:absolute;width:1px;height:1px;opacity:0}.publish-schedule{align-self:end}.publish-form-actions{display:flex;justify-content:flex-end;gap:8px;padding-top:3px}
.publish-channel-list{display:grid;padding:4px 20px 14px}.publish-channel-list>div{display:grid;grid-template-columns:auto 1fr auto;gap:11px;align-items:center;padding:11px 2px;border-top:1px solid var(--line)}.publish-channel-list>div:first-child{border-top:0}.publish-channel-list b{font-size:10.5px}.publish-channel-list small{font-size:8.5px;font-weight:680}.publish-channel-list small.ready{color:var(--pos)}.publish-channel-list small.missing{color:var(--neg)}.publish-mini-list{display:grid;padding:4px 20px 14px}.publish-mini-list>a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:13px;align-items:center;padding:13px 2px;border-top:1px solid var(--line);color:inherit}.publish-mini-list>a:first-child{border-top:0}.publish-mini-list>a>span b,.publish-mini-list>a>span small{display:block}.publish-mini-list>a>span b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px}.publish-mini-list>a>span small{margin-top:4px;color:var(--text-3);font-size:9px}.publish-mini-list>a>svg{width:14px;color:var(--text-3)}.publish-mini-list>a>strong{color:var(--text-2);font-size:9px}.publish-clear{display:flex;gap:11px;align-items:center;padding:16px 2px}.publish-clear>span{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:10px;color:var(--pos);background:rgba(20,167,119,.1);font-size:13px}.publish-clear p b,.publish-clear p small{display:block}.publish-clear p b{font-size:10.5px}.publish-clear p small{margin-top:4px;color:var(--text-3);font-size:9px;line-height:1.4}
.publish-queue{display:grid}.publish-row{display:grid;grid-template-columns:120px minmax(260px,1.6fr) minmax(130px,.55fr) 70px minmax(130px,.58fr);gap:20px;align-items:center;padding:17px 23px;border-top:1px solid var(--line)}.publish-row:first-child{border-top:0}.publish-row-status{display:flex;align-items:center;gap:7px;color:var(--text-2);font-size:9.5px;font-weight:680}.publish-row-status i{width:7px;height:7px;border-radius:50%;background:#8190aa}.publish-row-status.status-scheduled i{background:#4b64ff}.publish-row-status.status-complete i{background:var(--pos)}.publish-row-status.status-failed i,.publish-row-status.status-partial i,.publish-row-status.status-changes-requested i{background:var(--neg)}.publish-row-status.status-pending-approval i{background:#d99635}.publish-row-copy{min-width:0}.publish-row-copy b,.publish-row-copy p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.publish-row-copy b{display:block;font-size:11px}.publish-row-copy p{margin-top:4px;color:var(--text-3);font-size:9.5px}.publish-row-client span,.publish-row-client b,.publish-row-targets span,.publish-row-targets b,.publish-row-date span,.publish-row-date b{display:block}.publish-row-client span,.publish-row-targets span,.publish-row-date span{color:var(--text-3);font-size:8.5px}.publish-row-client b,.publish-row-targets b,.publish-row-date b{overflow:hidden;margin-top:4px;font-size:9.5px;text-overflow:ellipsis;white-space:nowrap}.publish-empty{padding:38px 23px;text-align:center}.publish-empty b{font-size:12px}.publish-empty p{margin-top:6px;color:var(--text-3);font-size:10px}
.publish-operations{display:grid;grid-template-columns:1fr 1fr;gap:18px}.publish-clients-panel{grid-column:1/-1}.publish-progress{width:90px;height:5px;overflow:hidden;border-radius:99px;background:var(--accent-soft)}.publish-progress em{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3165ff,#785bf0)}.publish-client-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}.publish-client-grid>a{display:flex;gap:11px;align-items:center;min-width:0;padding:18px;background:rgba(255,255,255,.66);color:inherit}.publish-client-grid>a>span{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:10px;color:#fff;background:linear-gradient(145deg,#315fff,#7b5de9);font-size:11px;font-weight:750}.publish-client-grid a div{min-width:0}.publish-client-grid b,.publish-client-grid small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.publish-client-grid b{font-size:10.5px}.publish-client-grid small{margin-top:4px;color:var(--text-3);font-size:8.5px}
[data-theme="dark"] .publish-panel{background:rgba(20,27,41,.8);border-color:rgba(188,202,232,.13);box-shadow:0 20px 55px rgba(0,0,0,.28)}[data-theme="dark"] .publish-field .input{background:rgba(9,14,23,.66)}[data-theme="dark"] .publish-account-option,[data-theme="dark"] .publish-upload{background:rgba(11,17,28,.54)}[data-theme="dark"] .publish-client-grid>a{background:rgba(16,23,35,.84)}
@media(max-width:1200px){.publish-hero{grid-template-columns:minmax(280px,.65fr) minmax(470px,1.35fr)}.publish-workbench{grid-template-columns:minmax(0,1fr) 310px}.publish-account-list{grid-template-columns:1fr}.publish-client-grid{grid-template-columns:1fr 1fr}.publish-row{grid-template-columns:110px minmax(210px,1fr) minmax(120px,.5fr) 60px}.publish-row-date{display:none}}
@media(max-width:960px){.publish-hero{grid-template-columns:1fr}.publish-metrics{min-height:210px}.publish-workbench{grid-template-columns:1fr}.publish-sidebar{grid-template-columns:1fr 1fr}.publish-operations{grid-template-columns:1fr}.publish-clients-panel{grid-column:auto}.publish-row{grid-template-columns:110px minmax(210px,1fr) minmax(120px,.55fr)}.publish-row-targets{display:none}}
@media(max-width:650px){.publish-page{gap:13px}.publish-hero{padding:25px 20px;border-radius:21px}.publish-hero:before{left:-32%;bottom:-90px;width:440px}.publish-hero h2{font-size:43px}.publish-hero-actions{display:grid;grid-template-columns:1fr}.publish-hero-actions .btn{justify-content:center;width:100%}.publish-metrics{grid-template-columns:1fr 1fr;min-height:0;border-radius:17px}.publish-metrics>div{padding:18px 15px}.publish-metrics dd{font-size:27px}.publish-metrics small{line-height:1.35}.publish-panel{border-radius:19px}.publish-panel-head{padding:18px}.publish-form{padding:18px}.publish-composer-grid,.publish-assets-row,.publish-sidebar,.publish-client-grid{grid-template-columns:1fr}.publish-form-actions{display:grid;grid-template-columns:1fr 1fr}.publish-form-actions .btn{justify-content:center;width:100%}.publish-form-actions .btn.primary{grid-column:1/-1}.publish-row{grid-template-columns:1fr auto;gap:8px 16px;padding:16px 18px}.publish-row-status{grid-column:1}.publish-row-copy{grid-column:1/-1;grid-row:2}.publish-row-client{grid-column:1;grid-row:3}.publish-row-targets{display:block;grid-column:2;grid-row:3;text-align:right}.publish-row-date{display:none}.publish-operations{gap:13px}.publish-account-option{grid-template-columns:auto auto minmax(0,1fr)}.publish-account-option>i{grid-column:3}.publish-channel-panel .publish-panel-head,.publish-attention-panel .publish-panel-head{align-items:center}}
@media(prefers-reduced-motion:reduce){.publish-page *{scroll-behavior:auto!important;transition:none!important;animation:none!important}.publish-hero:before{transform:none}}