/* Brand Surge Team 2.0 (docs/notes/v2.md). Everything here applies only under <html data-ui="v2">, except the two
   lines that keep 1.x showing its glyphs. Tokens first (most of the portal reads them), then the shell, then components. */
.ni-i { display: none; }
.ni { display: inline-flex; align-items: center; justify-content: center; }

/* ---------- tokens ---------- */
:root[data-ui="v2"] {
  --brand: #0d9488;            /* Brand Surge teal */
  --accent: #0f766e;           /* teal 700: buttons and links (AA on white) */
  --accent-ink: #0f766e;
  --accent-soft: #e6f5f3;
  --accent-ring: rgba(13, 148, 136, .28);
  --bg: #f6f8f8;
  --bg-2: #eef2f2;
  --surface: #ffffff;
  --surface-2: #f3f6f6;
  --ink: #0f1a1f;
  --ink-2: #48565d;
  --ink-3: #7a878d;
  --line: #e3e8e9;
  --line-2: #edf1f1;
  --danger: #c81e1e;  --danger-soft: #fdecec;
  --warn: #b45309;    --warn-soft: #fdf3e1;
  --ok: #138a4a;      --ok-soft: #e5f6ec;
  --blue: #2563eb;    --blue-soft: #e9f0fe;
  --violet: #7c3aed;  --violet-soft: #f1ebfe;
  --radius: 12px;
  --radius-sm: 8px;
  --shadow-1: 0 1px 2px rgba(15, 26, 31, .05);
  --shadow: 0 1px 2px rgba(15, 26, 31, .05), 0 2px 8px rgba(15, 26, 31, .05);
  --shadow-lg: 0 12px 40px rgba(15, 26, 31, .16), 0 2px 6px rgba(15, 26, 31, .06);
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;
  --side-w: 248px;
  --pad-y: 10px;      /* table rows, list rows */
  --ctl-h: 36px;      /* buttons and inputs */
  color-scheme: light;
}
:root[data-ui="v2"][data-density="compact"] { --pad-y: 6px; --ctl-h: 32px; }
:root[data-ui="v2"][data-theme="dark"] {
  --brand: #14b8a6; --accent: #2dd4bf; --accent-ink: #5eead4; --accent-soft: #0f2e2c; --accent-ring: rgba(45, 212, 191, .3);
  --bg: #0a1114; --bg-2: #0e171b; --surface: #10191d; --surface-2: #162226; --ink: #e5eef0; --ink-2: #a6b4b9; --ink-3: #75858b;
  --line: #213036; --line-2: #1a272c;
  --danger: #f87171; --danger-soft: #3a1717; --warn: #fbbf24; --warn-soft: #3a2c10; --ok: #4ade80; --ok-soft: #12301e;
  --blue: #60a5fa; --blue-soft: #15243d; --violet: #a78bfa; --violet-soft: #241c3c;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .4); --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 4px 14px rgba(0, 0, 0, .25); --shadow-lg: 0 14px 44px rgba(0, 0, 0, .55);
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root[data-ui="v2"]:not([data-theme="light"]) {
    --brand: #14b8a6; --accent: #2dd4bf; --accent-ink: #5eead4; --accent-soft: #0f2e2c; --accent-ring: rgba(45, 212, 191, .3);
    --bg: #0a1114; --bg-2: #0e171b; --surface: #10191d; --surface-2: #162226; --ink: #e5eef0; --ink-2: #a6b4b9; --ink-3: #75858b;
    --line: #213036; --line-2: #1a272c;
    --danger: #f87171; --danger-soft: #3a1717; --warn: #fbbf24; --warn-soft: #3a2c10; --ok: #4ade80; --ok-soft: #12301e;
    --blue: #60a5fa; --blue-soft: #15243d; --violet: #a78bfa; --violet-soft: #241c3c;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .4); --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 4px 14px rgba(0, 0, 0, .25); --shadow-lg: 0 14px 44px rgba(0, 0, 0, .55);
    color-scheme: dark;
  }
}
/* A manual light choice beats a dark device; a manual dark choice beats a light one. */
:root[data-ui="v2"][data-theme="light"] { color-scheme: light; }
:root[data-ui="v2"][data-theme="dark"] .brand-logo.light { display: none; }
:root[data-ui="v2"][data-theme="dark"] .brand-logo.dark { display: block; }
:root[data-ui="v2"][data-theme="light"] .brand-logo.light { display: block; }
:root[data-ui="v2"][data-theme="light"] .brand-logo.dark { display: none; }

/* ---------- base ---------- */
[data-ui="v2"] body { background: var(--bg); color: var(--ink); font-size: 14px; letter-spacing: -.003em; }
[data-ui="v2"] .ni-g { display: none; }
[data-ui="v2"] .ni-i { display: inline-block; flex: none; }
[data-ui="v2"] :focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
[data-ui="v2"] ::selection { background: color-mix(in srgb, var(--brand) 25%, transparent); }
[data-ui="v2"] * { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--ink-3) 40%, transparent) transparent; }
[data-ui="v2"] h1, [data-ui="v2"] h2, [data-ui="v2"] h3 { font-family: var(--font-display); letter-spacing: -.015em; }

/* ---------- shell: sidebar ---------- */
@media (min-width: 901px) { [data-ui="v2"] .shell:not(.mini) { grid-template-columns: var(--side-w) 1fr; } }
[data-ui="v2"] .side { background: color-mix(in srgb, var(--surface) 70%, var(--bg)); border-right: 1px solid var(--line); padding: 12px 10px 10px; gap: 0; }
[data-ui="v2"] .brand { padding: 4px 8px 12px; }
[data-ui="v2"] .nav a, [data-ui="v2"] .pins a { min-height: 34px; padding: 6px 10px; gap: 11px; border-radius: 9px; color: var(--ink-2); font-weight: 500; font-size: 13.5px; }
[data-ui="v2"] .nav a .ni, [data-ui="v2"] .pins a .ni-i { width: 18px; height: 18px; opacity: 1; color: var(--ink-3); }
[data-ui="v2"] .nav a > span:first-child { width: 18px; opacity: 1; }
[data-ui="v2"] .nav a:hover, [data-ui="v2"] .pins a:hover { background: var(--surface-2); color: var(--ink); }
[data-ui="v2"] .nav a:hover .ni { color: var(--ink-2); }
[data-ui="v2"] .nav a.on, [data-ui="v2"] .pins a.on { background: var(--accent-soft); color: var(--accent-ink); font-weight: 600; }
[data-ui="v2"] .nav a.on .ni, [data-ui="v2"] .pins a.on .ni-i { color: var(--brand); }
[data-ui="v2"] .nav a.on::before { left: -10px; top: 8px; bottom: 8px; width: 3px; background: var(--brand); }
[data-ui="v2"] .nav a[data-hid] { display: none; }
[data-ui="v2"] .nav-label { cursor: pointer; user-select: none; display: flex; align-items: center; justify-content: space-between; padding: 16px 10px 6px; font-size: 11px; letter-spacing: .07em; color: var(--ink-3); border-radius: 6px; }
[data-ui="v2"] .nav-label:hover { color: var(--ink-2); }
[data-ui="v2"] .nav-label::after { content: ""; width: 7px; height: 7px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: rotate(45deg) translate(-2px, -2px); transition: transform var(--t-fast, .12s); opacity: .7; }
[data-ui="v2"] .nav-label.folded::after { transform: rotate(-45deg); }
[data-ui="v2"] .pins { display: flex; flex-direction: column; margin-bottom: 4px; }
[data-ui="v2"] .pins-label { cursor: default; }
[data-ui="v2"] .pins-label::after { display: none; }
[data-ui="v2"] .pins a { display: flex; align-items: center; text-decoration: none; }
[data-ui="v2"] .pin-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pins { display: none; }
[data-ui="v2"] .pins { display: flex; }
[data-ui="v2"] .nav .badge { background: var(--brand); color: #fff; font-size: 11px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; }
[data-ui="v2"] .side-toggle { border-radius: 8px; }
/* Clock card: one compact row */
[data-ui="v2"] .clockw { border-radius: 12px; padding: 10px 12px; margin: 0 2px 8px; box-shadow: var(--shadow-1); }
[data-ui="v2"] .clockw .btn { min-height: 32px; }

/* ---------- shell: top bar ---------- */
[data-ui="v2"] .topbar { min-height: 60px; padding: 10px 28px; gap: 10px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 86%, transparent); }
[data-ui="v2"] .topbar h1 { font-size: 19px; font-weight: 700; }
[data-ui="v2"] .topbar .btn { height: 36px; }
[data-ui="v2"] .search-btn { min-width: 220px; justify-content: flex-start; color: var(--ink-3); background: var(--surface-2); border-color: var(--line); }
[data-ui="v2"] .search-btn .kbd { margin-left: auto; }
[data-ui="v2"] .ai-fab { background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 14%, var(--surface)), var(--accent-soft)); border-color: color-mix(in srgb, var(--brand) 30%, var(--line)); color: var(--accent-ink); }
[data-ui="v2"] .nt-plus { display: inline-flex; }
[data-ui="v2"] .btn.pin-btn { width: 32px; height: 32px; padding: 0; justify-content: center; border-color: transparent; background: transparent; color: var(--ink-3); }
[data-ui="v2"] .btn.pin-btn:hover { background: var(--surface-2); color: var(--ink); }
[data-ui="v2"] .btn.pin-btn.on { color: #d99a06; }
[data-ui="v2"] .content { padding: 24px 32px 64px; max-width: 1440px; }

/* ---------- buttons ---------- */
[data-ui="v2"] .btn { min-height: var(--ctl-h); padding: 0 14px; border-radius: 9px; border-color: var(--line); background: var(--surface); color: var(--ink); font-weight: 550; box-shadow: var(--shadow-1); }
[data-ui="v2"] .btn:hover { background: var(--surface-2); border-color: color-mix(in srgb, var(--ink-3) 35%, var(--line)); }
[data-ui="v2"] .btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 1px 2px rgba(15, 118, 110, .3), inset 0 1px 0 rgba(255, 255, 255, .12); }
/* Dark: the light teal needs dark text */
:root[data-ui="v2"][data-theme="dark"] .btn.primary, :root[data-ui="v2"][data-theme="dark"] .seg button.on.primary { color: #04201d; }
@media (prefers-color-scheme: dark) { :root[data-ui="v2"]:not([data-theme="light"]) .btn.primary { color: #04201d; } }
[data-ui="v2"] .btn.primary:hover { filter: none; background: color-mix(in srgb, var(--accent) 88%, #000); }
[data-ui="v2"] .btn.danger { color: var(--danger); }
[data-ui="v2"] .btn.sm { min-height: 30px; padding: 0 11px; font-size: 13px; border-radius: 8px; }
[data-ui="v2"] .btn.xs { min-height: 26px; padding: 0 9px; font-size: 12px; border-radius: 7px; box-shadow: none; }
[data-ui="v2"] .btn:focus-visible { box-shadow: 0 0 0 3px var(--accent-ring); outline: none; }
[data-ui="v2"] .kbd { background: var(--surface); border-color: var(--line); border-bottom-width: 2px; border-radius: 5px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10.5px; padding: 0 5px; }

/* ---------- inputs ---------- */
[data-ui="v2"] .in { min-height: var(--ctl-h); border-radius: 9px; border: 1px solid var(--line); background: var(--surface); padding: 0 11px; transition: border-color .12s, box-shadow .12s; }
[data-ui="v2"] textarea.in { padding: 9px 11px; }
[data-ui="v2"] .in:hover { border-color: color-mix(in srgb, var(--ink-3) 40%, var(--line)); }
[data-ui="v2"] .in:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--accent-ring); outline: none; }
[data-ui="v2"] select.in { appearance: none; -webkit-appearance: none; padding-right: 30px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237a878d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 9px center; }
[data-ui="v2"] .in.sm, [data-ui="v2"] select.in.sm { min-height: 30px; font-size: 13px; }
[data-ui="v2"] label.f { font-size: 12.5px; font-weight: 600; color: var(--ink-2); margin-bottom: 5px; }
[data-ui="v2"] input[type="checkbox"], [data-ui="v2"] input[type="radio"] { accent-color: var(--accent); width: 16px; height: 16px; }

/* ---------- cards ---------- */
[data-ui="v2"] .card { border-radius: 14px; border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-1); padding: 18px 20px; }
[data-ui="v2"] .card h2 { font-size: 15px; font-weight: 700; }
[data-ui="v2"] a.card:hover, [data-ui="v2"] .card.click:hover, [data-ui="v2"] .card.stat:hover { box-shadow: var(--shadow); border-color: color-mix(in srgb, var(--brand) 25%, var(--line)); }
[data-ui="v2"] .stat .n { font-family: var(--font-display); font-size: 30px; font-weight: 800; letter-spacing: -.03em; }
[data-ui="v2"] .stat .l { font-size: 12.5px; color: var(--ink-3); }

/* ---------- tables ---------- */
[data-ui="v2"] .tbl { border-radius: 14px; border: 1px solid var(--line); box-shadow: var(--shadow-1); border-collapse: separate; border-spacing: 0; }
[data-ui="v2"] .tbl th { background: var(--surface-2); color: var(--ink-3); font-size: 11px; letter-spacing: .06em; font-weight: 650; padding: 10px 14px; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 1; }
[data-ui="v2"] .tbl td { padding: var(--pad-y) 14px; border-bottom: 1px solid var(--line-2); }
[data-ui="v2"] .tbl tbody tr:hover td { background: color-mix(in srgb, var(--brand) 4%, var(--surface)); }
[data-ui="v2"] .tbl.flat { border: 0; box-shadow: none; border-radius: 0; }
[data-ui="v2"] .tbl.flat th { background: none; position: static; }
[data-ui="v2"] .tbl td select.in, [data-ui="v2"] .tbl td .in.sm { min-height: 28px; border-radius: 99px; font-size: 12.5px; font-weight: 550; padding-left: 10px; }

/* ---------- pills, chips, badges ---------- */
[data-ui="v2"] .pill { padding: 2px 9px; font-size: 11.5px; font-weight: 600; border-radius: 99px; box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 18%, transparent); }
[data-ui="v2"] .pill.v2-new { background: var(--accent-soft); color: var(--accent-ink); vertical-align: middle; margin-left: 4px; }
[data-ui="v2"] .chip { border-radius: 99px; }

/* ---------- tabs and segmented controls ---------- */
[data-ui="v2"] .tabs { gap: 2px; border-bottom: 1px solid var(--line); }
[data-ui="v2"] .tabs button { padding: 9px 12px; color: var(--ink-3); font-weight: 600; border-bottom-width: 2px; }
[data-ui="v2"] .tabs button:hover { color: var(--ink); }
[data-ui="v2"] .tabs button.on { color: var(--ink); border-bottom-color: var(--brand); }
[data-ui="v2"] .seg-tabs { max-width: 100%; display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 2px; border-bottom: 1px solid var(--line); scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 94%, transparent); mask-image: linear-gradient(90deg, #000 94%, transparent); }
[data-ui="v2"] .seg-tabs button { white-space: nowrap; flex: none; }
[data-ui="v2"] .seg { border-radius: 10px; border: 1px solid var(--line); background: var(--surface-2); padding: 2px; gap: 2px; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
[data-ui="v2"] .seg button { flex: none; white-space: nowrap; }
[data-ui="v2"] .seg button { border: 0; border-radius: 8px; background: transparent; color: var(--ink-2); padding: 5px 11px; font-size: 12.5px; font-weight: 550; }
[data-ui="v2"] .seg button.on { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-1); }

/* ---------- modals, toasts, empty and loading ---------- */
[data-ui="v2"] .overlay { background: rgba(8, 14, 16, .42); backdrop-filter: blur(3px); }
[data-ui="v2"] .modal { border-radius: 16px; box-shadow: var(--shadow-lg); border: 1px solid var(--line); padding: 22px 24px; }
[data-ui="v2"] .modal h2 { font-size: 18px; display: flex; align-items: center; gap: 8px; }
[data-ui="v2"] .toast { border-radius: 12px; background: #0f1a1f; color: #f1f5f6; box-shadow: var(--shadow-lg); padding: 11px 18px; font-weight: 500; }
[data-ui="v2"] .empty { border: 1px dashed color-mix(in srgb, var(--ink-3) 35%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--surface) 60%, var(--bg)); padding: 44px 24px; color: var(--ink-3); }
[data-ui="v2"] .empty::before { content: ""; display: block; width: 36px; height: 36px; margin: 0 auto 10px; border-radius: 12px; background: var(--accent-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%230d9488' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='22 12 16 12 14 15 10 15 8 12 2 12'/%3E%3Cpath d='M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z'/%3E%3C/svg%3E") center / 20px no-repeat; }
[data-ui="v2"] .skel { border-radius: 10px; }
[data-ui="v2"] .err { border-radius: 10px; }

/* ---------- 2.0 pieces ---------- */
.v2-banner { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; border-color: color-mix(in srgb, #0d9488 35%, var(--line)) !important; background: linear-gradient(120deg, color-mix(in srgb, #0d9488 9%, var(--surface)), var(--surface)) !important; }
.v2-opts { display: flex; gap: 22px; flex-wrap: wrap; margin-top: 14px; }
.v2-admin { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); color: var(--ink-2); }
.pin-btn { display: none; }
[data-ui="v2"] .pin-btn { display: inline-flex; }
[data-ui="v2"] .ico { vertical-align: -3px; flex: none; }
[data-ui="v2"] .nt-btn .kbd { background: transparent; }
[data-ui="v2"] .btn.nt-btn { padding: 0 14px; }

/* ---------- phones ---------- */
@media (max-width: 760px) {
  [data-ui="v2"] .topbar { padding: 8px 14px; min-height: 56px; }
  [data-ui="v2"] .content { padding: 16px 14px 60px; }
  [data-ui="v2"] .search-btn { min-width: 0; background: transparent; border-color: transparent; }
  [data-ui="v2"] .topbar { gap: 6px; }
  [data-ui="v2"] .topbar .btn, [data-ui="v2"] .topbar .btn.nt-btn { padding: 0 9px; min-width: 0; box-shadow: none; }
  [data-ui="v2"] .topbar .guide-btn { display: none; }
  [data-ui="v2"] .topbar h1 { font-size: 17px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
  [data-ui="v2"] .card { padding: 15px 16px; }
  [data-ui="v2"] .pin-btn { display: none; }
}
@media (prefers-reduced-motion: reduce) { [data-ui="v2"] * { animation: none !important; transition: none !important; } }
@media (max-width: 760px) { .tl-b .row { flex-wrap: wrap !important; gap: 2px 8px; } .tl-b .row .small { white-space: normal !important; } }

/* ---------- 2.0: tickets and work (release 113) ---------- */
.v2-only { display: none; }
[data-ui="v2"] .v2-only { display: inline-flex; align-items: center; }
[data-ui="v2"] div.v2-only { display: flex; }
[data-ui="v2"] .v1-only { display: none !important; }
/* status chip */
.stc { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); white-space: nowrap; }
.stc svg { flex: none; }
.stc.st-todo svg { color: var(--ink-3); }
.stc.st-in_progress { color: var(--blue); }
.stc.st-in_review { color: var(--violet); }
.stc.st-blocked { color: var(--danger); }
.stc.st-done { color: var(--ok); }
/* priority */
[data-ui="v2"] .prio { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 600; }
[data-ui="v2"] .prio.normal { color: var(--ink-3); font-weight: 500; }
[data-ui="v2"] .prio.urgent { color: var(--danger); }
[data-ui="v2"] .prio.high { color: #c2410c; }
/* pick menu */
.pick { position: relative; display: inline-flex; }
.pick-btn { display: inline-flex; align-items: center; gap: 4px; border: 1px solid transparent; background: transparent; border-radius: 8px; padding: 4px 6px 4px 8px; cursor: pointer; font: inherit; color: inherit; }
.pick-btn:hover, .pick-btn[aria-expanded="true"] { background: var(--surface-2); border-color: var(--line); }
.pick-chev { color: var(--ink-3); opacity: 0; transition: opacity .12s; }
.pick-btn:hover .pick-chev, .pick-btn:focus-visible .pick-chev, .pick-btn[aria-expanded="true"] .pick-chev { opacity: 1; }
.pick-menu { position: fixed; z-index: 1000; min-width: 170px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-lg); padding: 5px; display: flex; flex-direction: column; animation: scaleIn .14s var(--ease, ease); }
.pick-menu button { display: flex; align-items: center; justify-content: space-between; gap: 10px; text-align: left; border: 0; background: transparent; padding: 7px 9px; border-radius: 8px; cursor: pointer; font: inherit; color: var(--ink); }
.pick-menu button:hover, .pick-menu button:focus-visible { background: var(--surface-2); outline: none; }
.pick-menu button.on { background: var(--accent-soft); }
.pick-tick { color: var(--brand); }
[data-ui="v2"] .tbl td .pick { margin-left: -8px; }
/* due words */
[data-ui="v2"] .due { font-size: 13px; font-weight: 500; color: var(--ink-2); white-space: nowrap; }
[data-ui="v2"] .due.over { color: var(--danger); font-weight: 600; }
[data-ui="v2"] .due.today { color: #c2410c; font-weight: 600; }
/* table rows */
[data-ui="v2"] .tbl td.key { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; color: var(--ink-3); white-space: nowrap; }
[data-ui="v2"] .title-cell { font-weight: 600; color: var(--ink); }
[data-ui="v2"] .tbl tr.sel td { background: color-mix(in srgb, var(--brand) 8%, var(--surface)); }
/* bulk bar: floats at the bottom of the screen */
[data-ui="v2"] .bulk { position: sticky; bottom: 16px; z-index: 20; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; background: #0f1a1f; color: #f1f5f6; border-radius: 14px; padding: 10px 14px; box-shadow: var(--shadow-lg); margin: 0 0 12px; }
[data-ui="v2"] .bulk .in { background: #1a282e; border-color: #2a3a41; color: #f1f5f6; }
[data-ui="v2"] .bulk .btn { background: transparent; color: #f1f5f6; border-color: #3a4b52; }
/* board */
[data-ui="v2"] .board { grid-template-columns: repeat(5, minmax(250px, 1fr)); gap: 14px; }
[data-ui="v2"] .board .col { background: color-mix(in srgb, var(--surface-2) 70%, var(--bg)); border: 1px solid var(--line-2); border-radius: 14px; padding: 10px; }
[data-ui="v2"] .board .col.over { border-color: var(--brand); background: var(--accent-soft); }
[data-ui="v2"] .board .col h3 { font-size: 12.5px; font-weight: 700; color: var(--ink); margin: 2px 4px 12px; align-items: center; }
[data-ui="v2"] .board .col h3 > span:first-child { display: inline-flex; align-items: center; gap: 7px; }
[data-ui="v2"] .board .col h3 > span:last-child { font-size: 11.5px; background: var(--surface); border: 1px solid var(--line); border-radius: 99px; padding: 0 8px; color: var(--ink-3); }
[data-ui="v2"] .col-todo .col-ico { color: var(--ink-3); } [data-ui="v2"] .col-in_progress .col-ico { color: var(--blue); } [data-ui="v2"] .col-in_review .col-ico { color: var(--violet); } [data-ui="v2"] .col-blocked .col-ico { color: var(--danger); } [data-ui="v2"] .col-done .col-ico { color: var(--ok); }
[data-ui="v2"] .tcard { border-radius: 12px; padding: 11px 12px; border: 1px solid var(--line); box-shadow: var(--shadow-1); position: relative; transition: box-shadow .12s, transform .12s, border-color .12s; }
[data-ui="v2"] .tcard:hover { border-color: color-mix(in srgb, var(--brand) 40%, var(--line)); box-shadow: var(--shadow); transform: translateY(-1px); }
[data-ui="v2"] .tcard.p-urgent { box-shadow: inset 3px 0 0 var(--danger), var(--shadow-1); }
[data-ui="v2"] .tcard.p-high { box-shadow: inset 3px 0 0 #ea580c, var(--shadow-1); }
[data-ui="v2"] .tcard .t { font-weight: 600; line-height: 1.35; margin: 5px 0 9px; }
[data-ui="v2"] .tcard .key { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11.5px; color: var(--ink-3); }
[data-ui="v2"] .tcard.due-over .meta .due, [data-ui="v2"] .tcard.due-over .meta { color: var(--danger); }
/* ticket page */
[data-ui="v2"] .tk-title { font-family: var(--font-display); font-size: 26px; font-weight: 800; letter-spacing: -.025em; line-height: 1.2; margin: 6px 0 10px; }
.tk-sum { gap: 8px 16px; flex-wrap: wrap; align-items: center; margin: 0 0 16px; padding: 10px 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; font-size: 13px; }
.tk-sum-i { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-2); }
.tk-sum-i .avatar { width: 22px; height: 22px; font-size: 10px; }
[data-ui="v2"] .tk .card { margin-bottom: 12px; }
[data-ui="v2"] .tk .card > .row > b.small { font-size: 13px; font-family: var(--font-display); }
/* scrolling closes an open pick menu's position drift: keep it simple, it re-opens where the pill is */

/* ---------- 2.0: client workspace (release 114) ---------- */
[data-ui="v2"] .ws-head { border-radius: 16px; padding: 20px 22px; gap: 18px; align-items: center; }
[data-ui="v2"] .ws-name { font-family: var(--font-display); font-size: 24px; font-weight: 800; letter-spacing: -.025em; margin: 0; }
[data-ui="v2"] .ws-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; justify-content: flex-end; }
.ws-facts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.wsf { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.wsf b { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wsf-l { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ink-3); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.wsf.warn b { color: #c2410c; }
.wsf.warn .wsf-l svg { color: #c2410c; }
.tab-grp { flex: none; align-self: center; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); padding: 0 6px 0 14px; margin-left: 6px; border-left: 1px solid var(--line); }
.more-menu { min-width: 220px; }
.more-menu button { justify-content: flex-start; }
.more-menu svg { color: var(--ink-3); }
@media (max-width: 900px) { .ws-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { [data-ui="v2"] .ws-head { flex-wrap: wrap; } [data-ui="v2"] .ws-actions { justify-content: flex-start; } }
[data-ui="v2"] .ws-facts.v2-only { display: grid; }
[data-ui="v2"] .cc-facts span { display: inline-flex; align-items: center; gap: 5px; }
[data-ui="v2"] .client-card { border-radius: 16px; }
[data-ui="v2"] .cc-name { font-family: var(--font-display); font-size: 16px; }

/* ---------- 2.0: Home and dashboards (release 115) ---------- */
[data-ui="v2"] .card.stat::after { display: none; }
[data-ui="v2"] .card.stat { position: relative; padding: 18px 20px 16px; }
.stat-ico { position: absolute; top: 16px; right: 16px; width: 34px; height: 34px; border-radius: 10px; background: var(--accent-soft); color: var(--brand); align-items: center; justify-content: center; }
[data-ui="v2"] .stat-ico.v2-only { display: inline-flex; }
[data-ui="v2"] .card.stat.bad .stat-ico { background: var(--danger-soft); color: var(--danger); }
[data-ui="v2"] .cards { gap: 14px; }
.today-date { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--brand); margin-bottom: 4px; }
[data-ui="v2"] .today-card { padding: 22px 24px; background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 7%, var(--surface)) 0%, var(--surface) 55%); border-color: color-mix(in srgb, var(--brand) 18%, var(--line)); }
[data-ui="v2"] .today-card h2 { font-size: 24px; font-weight: 800; letter-spacing: -.025em; }
.today-quick { gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.today-quick .btn { gap: 7px; }
.today-quick .btn svg { color: var(--brand); }
[data-ui="v2"] .today-list { display: grid; gap: 8px; margin-top: 14px; }
[data-ui="v2"] .today-item { border-radius: 12px; padding: 11px 14px; background: var(--surface); box-shadow: var(--shadow-1); }
[data-ui="v2"] .today-item:hover { transform: translateX(2px); }
.td-ico { width: 30px; height: 30px; border-radius: 9px; background: var(--surface-2); color: var(--ink-2); align-items: center; justify-content: center; flex: none; }
[data-ui="v2"] .td-ico.v2-only { display: inline-flex; }
[data-ui="v2"] .today-item.td-1 .td-ico { background: var(--danger-soft); color: var(--danger); }
[data-ui="v2"] .today-item.td-2 .td-ico { background: var(--warn-soft); color: var(--warn); }
[data-ui="v2"] .home-tk { padding: 9px 0; border-bottom: 1px solid var(--line-2); }
[data-ui="v2"] .home-tk .key { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11.5px; color: var(--ink-3); }
[data-ui="v2"] .hm-stats { gap: 10px; }
[data-ui="v2"] .hm-stat { border-radius: 12px; border: 1px solid var(--line); background: var(--surface-2); }
[data-ui="v2"] .hm-stat b { font-family: var(--font-display); }
/* charts (finance, success) */
[data-ui="v2"] .bars i, [data-ui="v2"] .bar > span, [data-ui="v2"] .bar span { border-radius: 4px; }
@media (max-width: 760px) { [data-ui="v2"] .today-card h2 { font-size: 20px; } .stat-ico { width: 28px; height: 28px; top: 12px; right: 12px; } }

/* ---------- 2.0: People & HR (release 116) ---------- */
/* Each person keeps one colour (avTone): teal, blue, violet, rose, amber, emerald, sky, slate */
[data-ui="v2"] .avatar, [data-ui="v2"] .pav { background: var(--avc, #0f766e); color: #fff; box-shadow: 0 0 0 2px var(--surface); }
[data-ui="v2"] .av-0 { --avc: #0f766e; } [data-ui="v2"] .av-1 { --avc: #2563eb; } [data-ui="v2"] .av-2 { --avc: #7c3aed; } [data-ui="v2"] .av-3 { --avc: #db2777; }
[data-ui="v2"] .av-4 { --avc: #b45309; } [data-ui="v2"] .av-5 { --avc: #059669; } [data-ui="v2"] .av-6 { --avc: #0284c7; } [data-ui="v2"] .av-7 { --avc: #475569; }
[data-ui="v2"] .pav img { box-shadow: none; }
/* directory */
[data-ui="v2"] .person-card { border-radius: 16px; padding: 20px 14px 16px; }
[data-ui="v2"] .person-card:hover { border-color: color-mix(in srgb, var(--brand) 30%, var(--line)); }
/* profile */
[data-ui="v2"] .prof-up { display: inline-flex; align-items: center; justify-content: center; }
[data-ui="v2"] .st-chip { font-size: 12px; }
[data-ui="v2"] .tl .tl-i { border-radius: 10px; }
@media (max-width: 760px) { .task-row { flex-wrap: wrap !important; } .task-row label.small { white-space: normal; } }

/* ---------- 2.0: Finance (release 117) ---------- */
[data-ui="v2"] .note { border-radius: 14px; }
[data-ui="v2"] .warn-note { position: relative; padding-left: 48px; background: var(--warn-soft); border: 1px solid color-mix(in srgb, var(--warn) 28%, transparent); color: var(--ink); }
[data-ui="v2"] .warn-note::before { content: ""; position: absolute; left: 16px; top: 16px; width: 20px; height: 20px; background: var(--warn); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E") center / contain no-repeat; }
[data-ui="v2"] .warn-note b { color: var(--warn); }
[data-ui="v2"] .tbl td.num, [data-ui="v2"] .tbl th.num, [data-ui="v2"] .num { font-variant-numeric: tabular-nums; }
[data-ui="v2"] .inv-num, [data-ui="v2"] .tbl td.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; }
/* BD pipeline: the same board language as tickets */
[data-ui="v2"] .kanban { gap: 14px; }
[data-ui="v2"] .kcol { background: color-mix(in srgb, var(--surface-2) 70%, var(--bg)); border: 1px solid var(--line-2); border-radius: 14px; }
[data-ui="v2"] .kcol.over { border-color: var(--brand); background: var(--accent-soft); }
[data-ui="v2"] .kcol-h b { font-family: var(--font-display); }
[data-ui="v2"] .kcard { border-radius: 12px; border: 1px solid var(--line); box-shadow: var(--shadow-1); transition: box-shadow .12s, transform .12s, border-color .12s; }
[data-ui="v2"] .kcard:hover { border-color: color-mix(in srgb, var(--brand) 40%, var(--line)); box-shadow: var(--shadow); transform: translateY(-1px); }
[data-ui="v2"] .stagebar .sb { border-radius: 9px; }

/* ---------- Chat 2.0 (public/chat.js) ---------- */
[data-ui="v2"] .chat { grid-template-columns: 276px 1fr; border-radius: 16px; box-shadow: var(--shadow); background: var(--surface); }
[data-ui="v2"] .cside { background: var(--bg-2); }
[data-ui="v2"] .cside-top { padding: 12px; gap: 8px; border-bottom-color: var(--line-2); }
[data-ui="v2"] .cside-top .btn { width: var(--ctl-h); padding: 0; justify-content: center; }
[data-ui="v2"] .cside-scroll { padding: 4px 8px 16px; }
[data-ui="v2"] .csec { margin-top: 12px; }
[data-ui="v2"] .csec-h { font-size: 10.5px; letter-spacing: .08em; padding: 4px 10px 6px; }
[data-ui="v2"] .cicon { display: inline-flex; align-items: center; justify-content: center; color: var(--ink-3); }
[data-ui="v2"] .crow { padding: 7px 10px; border-radius: 9px; gap: 10px; color: var(--ink-2); font-size: 13.5px; }
[data-ui="v2"] .crow:hover { background: var(--surface); }
[data-ui="v2"] .crow.on { background: var(--accent-soft); color: var(--accent-ink); box-shadow: inset 3px 0 0 var(--brand); }
[data-ui="v2"] .crow.on .cname { color: var(--accent-ink); font-weight: 600; }
[data-ui="v2"] .crow.on .cglyph { background: transparent; color: var(--accent-ink); }
[data-ui="v2"] .crow.unread .cname { color: var(--ink); font-weight: 700; }
[data-ui="v2"] .cglyph { background: transparent; color: var(--ink-3); width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
[data-ui="v2"] .cglyph.lg { width: 34px; height: 34px; border-radius: 10px; background: var(--accent-soft); color: var(--accent-ink); }
[data-ui="v2"] .cbadge { background: var(--ink-3); min-width: 20px; text-align: center; font-variant-numeric: tabular-nums; }
[data-ui="v2"] .cbadge.at { background: var(--danger); }
[data-ui="v2"] .cmute { color: var(--ink-3); display: inline-flex; }
[data-ui="v2"] .clink { border-bottom: 1px solid var(--line-2); padding: 8px 12px; line-height: 1.45; }
/* People keep one colour wherever their initials appear (same tones as the rest of 2.0). */
[data-ui="v2"] .cav { background: var(--avc, #0f766e); color: #fff; border-radius: 10px; letter-spacing: .02em; }
[data-ui="v2"] .cav img { border-radius: 10px; }
[data-ui="v2"] .cdot { border-color: var(--bg-2); }
/* Header */
[data-ui="v2"] .chead { padding: 12px 16px; min-height: 62px; border-bottom-color: var(--line-2); gap: 12px; }
[data-ui="v2"] .chead-t b, [data-ui="v2"] .chead-t > div:first-child { font-family: var(--font-display); font-size: 15.5px; }
[data-ui="v2"] .chead-a { gap: 4px; }
[data-ui="v2"] .chead-a .btn.sm { height: 34px; min-width: 34px; padding: 0 9px; display: inline-flex; align-items: center; gap: 6px; border-color: transparent; background: transparent; color: var(--ink-2); }
[data-ui="v2"] .chead-a .btn.sm:hover, [data-ui="v2"] .chead-a .btn.on { background: var(--surface-2); color: var(--ink); }
[data-ui="v2"] .chead-a select { height: 34px; }
/* Messages */
[data-ui="v2"] .cmsgs { padding: 10px 0 8px; }
[data-ui="v2"] .cmsg { padding: 7px 22px; gap: 12px; }
[data-ui="v2"] .cmsg.grouped { padding-top: 2px; padding-bottom: 2px; }
[data-ui="v2"] .cmsg:hover { background: var(--surface-2); }
[data-ui="v2"] .cmsg.mentioned { background: var(--warn-soft); box-shadow: inset 3px 0 0 var(--warn); }
[data-ui="v2"] .cmsg-h b { font-weight: 650; font-size: 14px; }
[data-ui="v2"] .ctext { line-height: 1.55; font-size: 14px; color: var(--ink); }
[data-ui="v2"] .ctext a { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 2px; }
[data-ui="v2"] .cment { background: var(--accent-soft); color: var(--accent-ink); border-radius: 6px; padding: 0 4px; }
[data-ui="v2"] .cment.me, [data-ui="v2"] .cment.all { background: var(--warn-soft); color: var(--warn); }
[data-ui="v2"] .cday { margin: 16px 22px 8px; }
[data-ui="v2"] .cday { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
[data-ui="v2"] .cnew { margin: 8px 22px; }
[data-ui="v2"] .creact { border-radius: 99px; padding: 2px 9px; background: var(--surface-2); border-color: var(--line); }
[data-ui="v2"] .creact.mine { background: var(--accent-soft); border-color: var(--brand); color: var(--accent-ink); }
[data-ui="v2"] .creplies { color: var(--accent-ink); }
[data-ui="v2"] .cfile { border-radius: 12px; background: var(--surface-2); }
[data-ui="v2"] .cfile-ic { display: inline-flex; color: var(--accent-ink); }
[data-ui="v2"] .cimg { border-radius: 12px; }
/* Hover actions: a compact floating toolbar of line icons */
[data-ui="v2"] .cacts { border-radius: 10px; box-shadow: var(--shadow-lg); padding: 3px; top: -16px; right: 20px; gap: 1px; }
[data-ui="v2"] .cacts > button { width: 30px; height: 30px; padding: 0; display: inline-flex; align-items: center; justify-content: center; color: var(--ink-2); border-radius: 7px; }
[data-ui="v2"] .cacts > button:hover { background: var(--surface-2); color: var(--ink); }
[data-ui="v2"] .cmenu { border-radius: 12px; box-shadow: var(--shadow-lg); }
/* Composer */
[data-ui="v2"] .ccomp { padding: 4px 16px 12px; }
[data-ui="v2"] .ccomp-row { border-radius: 14px; padding: 5px 5px 5px 4px; border-color: var(--line); background: var(--surface); box-shadow: var(--shadow-1); align-items: center; }
[data-ui="v2"] .ccomp-row:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px var(--accent-ring); }
[data-ui="v2"] .ccomp .cicon.big { width: 36px; height: 36px; padding: 0; border-radius: 10px; color: var(--ink-3); }
[data-ui="v2"] .ccomp .cicon.big:hover { background: var(--surface-2); color: var(--ink); }
[data-ui="v2"] .ccomp .cicon.big.on { color: var(--danger); background: var(--danger-soft); }
[data-ui="v2"] .ccomp .btn.primary { height: 36px; border-radius: 10px; padding: 0 14px; flex: none; }
[data-ui="v2"] .cthread .csend span { display: none; }
[data-ui="v2"] .cthread .ccomp .btn.primary { padding: 0 11px; }
[data-ui="v2"] .csend { display: inline-flex; align-items: center; gap: 6px; }
[data-ui="v2"] .chint { color: var(--ink-3); }
[data-ui="v2"] .cthread { background: var(--surface); border-left-color: var(--line-2); }
[data-ui="v2"] .cpanel { border-radius: 14px; box-shadow: var(--shadow-lg); }
[data-ui="v2"] .cempty-ic { width: 64px; height: 64px; margin: 0 auto 10px; border-radius: 18px; background: var(--accent-soft); color: var(--accent-ink); display: grid; place-items: center; }
[data-ui="v2"] .cempty h2 { font-family: var(--font-display); }
@media (max-width: 900px) {
  [data-ui="v2"] .chat { border-radius: 0; box-shadow: none; grid-template-columns: 1fr; }
  [data-ui="v2"] .chead-t .small { display: none; }
  [data-ui="v2"] .chead-t { overflow: hidden; }
  [data-ui="v2"] .chead-t b, [data-ui="v2"] .chead-t > div:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  [data-ui="v2"] .chead-a { flex: none; }
  [data-ui="v2"] .chead-a .btn[aria-label="Schedule a meeting"], [data-ui="v2"] .chead-a .btn[aria-label="Files"], [data-ui="v2"] .chead-a .btn[aria-label="Channel settings"] { display: none; }
  [data-ui="v2"] .cmsg { padding: 7px 14px; }
  [data-ui="v2"] .chead { padding: 10px 12px; }
  [data-ui="v2"] .csend span { display: none; }
}

/* ---------- Admin & Settings 2.0 ---------- */
/* Settings: a section list beside the cards on wide screens, a scrolling chip row on phones. */
[data-ui="v2"] .set-wrap { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 22px; align-items: start; max-width: 1080px; }
[data-ui="v2"] .set-nav { position: sticky; top: 76px; display: grid; gap: 2px; padding: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1); }
[data-ui="v2"] .set-nav button { display: flex; align-items: center; gap: 10px; border: 0; background: none; padding: 8px 10px; border-radius: 8px; font: inherit; font-size: 13.5px; color: var(--ink-2); cursor: pointer; text-align: left; }
[data-ui="v2"] .set-nav button:hover { background: var(--surface-2); color: var(--ink); }
[data-ui="v2"] .set-nav button.on { background: var(--accent-soft); color: var(--accent-ink); font-weight: 600; }
[data-ui="v2"] .set-nav .ico { color: currentColor; opacity: .85; }
[data-ui="v2"] .set-sec { scroll-margin-top: 76px; }
[data-ui="v2"] .set-body .card h2 { font-family: var(--font-display); font-size: 16px; }
@media (max-width: 900px) {
  [data-ui="v2"] .set-wrap { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  [data-ui="v2"] .set-nav { top: 58px; z-index: 5; display: flex; overflow-x: auto; scrollbar-width: none; padding: 4px; }
  [data-ui="v2"] .set-nav button { flex: none; padding: 7px 10px; }
  [data-ui="v2"] .set-nav button .ico { display: none; }
}
/* Access: each person with their colour */
.acc-p { display: block; }
[data-ui="v2"] .acc-p { display: flex; gap: 10px; align-items: flex-start; }
[data-ui="v2"] .acc-p .avatar { width: 30px; height: 30px; font-size: 11.5px; margin-top: 1px; }
/* Background jobs: four tiles that filter the list */
[data-ui="v2"] div.jobs-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
[data-ui="v2"] .jobs-tile { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center; text-align: left; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-1); cursor: pointer; font: inherit; color: var(--ink); }
[data-ui="v2"] .jobs-tile .ico { grid-row: span 2; width: 34px; height: 34px; padding: 8px; border-radius: 10px; background: var(--surface-2); box-sizing: border-box; }
[data-ui="v2"] .jobs-tile b { font-size: 20px; font-family: var(--font-display); font-variant-numeric: tabular-nums; line-height: 1.1; }
[data-ui="v2"] .jobs-tile span { font-size: 12px; color: var(--ink-3); }
[data-ui="v2"] .jobs-tile:hover { border-color: var(--brand); }
[data-ui="v2"] .jobs-tile.k-ok .ico { background: var(--ok-soft); color: var(--ok); }
[data-ui="v2"] .jobs-tile.k-failed:not(.zero) .ico { background: var(--danger-soft); color: var(--danger); }
[data-ui="v2"] .jobs-tile.k-late:not(.zero) .ico { background: var(--warn-soft); color: var(--warn); }
[data-ui="v2"] .jobs-tile.zero { opacity: .7; }
@media (max-width: 700px) { [data-ui="v2"] div.jobs-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Setup checklist: group icons; open items marked with a coloured edge */
[data-ui="v2"] .setup-h { display: flex; align-items: center; gap: 8px; font-family: var(--font-display); }
[data-ui="v2"] .setup-gi { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 8px; background: var(--accent-soft); color: var(--accent-ink); }
[data-ui="v2"] .setup-done .setup-gi { margin-right: 8px; vertical-align: middle; }
[data-ui="v2"] .setup-hn { margin-left: auto; font-size: 12px; font-weight: 500; color: var(--ink-3); font-family: var(--font); }
[data-ui="v2"] .setup-c.todo { box-shadow: inset 3px 0 0 var(--warn), var(--shadow-1); }
[data-ui="v2"] .setup-c:hover { border-color: var(--brand); }
/* Notification icons (bell) */
[data-ui="v2"] .nicon { border-radius: 9px; }
[data-ui="v2"] .nicon .ico { color: currentColor; }
[data-ui="v2"] .pill { white-space: nowrap; }
@media (max-width: 600px) { [data-ui="v2"] .jobs-tbl td > .small.muted { display: none; } }

/* ---------- Calendar, Knowledge Base & reports 2.0 ---------- */
[data-ui="v2"] .cal-nav .btn.icon { display: inline-flex; align-items: center; justify-content: center; }
[data-ui="v2"] .cal-nav h2 { font-family: var(--font-display); }
[data-ui="v2"] .cal-tools .btn { display: inline-flex; align-items: center; gap: 6px; }
[data-ui="v2"] .cal-dmeta { display: flex; align-items: center; gap: 8px; }
[data-ui="v2"] .cal-dmeta .ico { color: var(--ink-3); flex: none; }
[data-ui="v2"] .cal-off .ico { vertical-align: -2px; }
[data-ui="v2"] .coll-ic .ico, [data-ui="v2"] .askx-ic .ico { color: currentColor; }
[data-ui="v2"] .search-in > span { display: inline-flex; align-items: center; }
/* CEO week: section icons and a clear attention callout */
[data-ui="v2"] .cw-card h3, [data-ui="v2"] .cw-att h2 { display: flex; align-items: center; gap: 8px; font-family: var(--font-display); }
[data-ui="v2"] .cw-ic { width: 28px; height: 28px; border-radius: 8px; background: var(--accent-soft); color: var(--accent-ink); justify-content: center; }
[data-ui="v2"] .cw-att:not(.calm) .cw-ic { background: var(--warn-soft); color: var(--warn); }
[data-ui="v2"] .cw-att:not(.calm) { box-shadow: inset 3px 0 0 var(--warn), var(--shadow-1); }
@media (max-width: 600px) { [data-ui="v2"] .hero-chip { display: block; text-align: left; border-radius: 12px; line-height: 1.5; } [data-ui="v2"] .hero-chip .kdot { display: inline-block; vertical-align: middle; margin-right: 6px; } }