/* KD Client Hub – new look (Oct 2026): the dashboard style of the Society Suite demo (themes.css + dash.css).
   Loaded only when the new look is on (inc/look.php), after hub.css. Everything is scoped to html.kdh-next
   (front pages) or body.kdh-next-admin (wp-admin), so the old look is untouched.
   Rule for the review screenshots: never change the size, position or transform of .kdh-pin or .kdh-canvas. */

@font-face { font-family: 'Inter Tight'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(fonts/inter-tight.woff2) format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 100 800; font-display: swap; src: url(fonts/jetbrains-mono.woff2) format('woff2'); }

/* ---------- tokens ---------- */
html.kdh-next, html.kdh-next body.kdh-body, body.kdh-next-admin {
	--nx-page: #dcdcd9; --nx-shell: #f2f2f0; --nx-card: #f8f8f7; --nx-card2: #ffffff; --nx-line: #e5e5e2; --nx-line2: #ececea;
	--nx-ink: #141414; --nx-ink2: #55585e; --nx-mut: #8b8e94; --nx-faint: #b9bbbf;
	--nx-blue: #2f5fe8; --nx-blue-soft: #e7eeff; --nx-blue-ink: #2147b8;
	--nx-pink: #e2347c; --nx-pink-soft: #fde7f0; --nx-orange: #ee8a2e; --nx-orange-soft: #fdeedd; --nx-orange-ink: #b5600f;
	--nx-green: #22a050; --nx-green-soft: #e2f5e8; --nx-grey: #8b8e94; --nx-grey-soft: #ececea; --nx-yellow-soft: #fbf3d9; --nx-yellow-ink: #7a5a00;
	--nx-dark: #1d1d1f; --nx-dark-ink: #ffffff;
	--nx-primary: var(--nx-dark); --nx-on-primary: var(--nx-dark-ink);
	--nx-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .6) inset;
	--nx-r-shell: 28px; --nx-r-card: 22px; --nx-r: 12px;
	--nx-ease: cubic-bezier(.2, .7, .2, 1);
	--nx-font: 'Inter Tight', 'Inter Tight Fallback', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--nx-mono: 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;
	--nx-sw: 248px;
	/* the old tokens point at the new ones, so every old component follows */
	--ink: var(--nx-ink); --muted: #6c6f75; --line: var(--nx-line); --line2: var(--nx-line2); --paper: var(--nx-card2); --soft: var(--nx-shell); --bg: var(--nx-shell);
	--ok: var(--nx-green); --warn: var(--nx-orange-ink); --bad: var(--nx-pink); --info: var(--nx-mut);
	--accent-soft: var(--nx-blue-soft); --accent-ink: var(--nx-blue-ink);
	--font: var(--nx-font);
	color-scheme: light;
}
html.kdh-next.kdh-branded, html.kdh-next.kdh-branded body.kdh-body { --nx-primary: var(--kd-accent); --nx-on-primary: #fff; --accent-soft: color-mix(in srgb, var(--kd-accent) 10%, var(--nx-card2)); --accent-ink: color-mix(in srgb, var(--kd-accent) 80%, var(--nx-ink)); }
html.kdh-next[data-theme="dark"], html.kdh-next[data-theme="dark"] body.kdh-body {
	--nx-page: #2b2d31; --nx-shell: #121314; --nx-card: #1a1b1e; --nx-card2: #202125; --nx-line: #2a2c30; --nx-line2: #25272b;
	--nx-ink: #f2f2f2; --nx-ink2: #b3b5ba; --nx-mut: #80838a; --nx-faint: #4a4d53;
	--nx-blue: #5b84f5; --nx-blue-soft: #1d2741; --nx-blue-ink: #9db6ff;
	--nx-pink: #f0578f; --nx-pink-soft: #3a1d2a; --nx-orange: #f29a45; --nx-orange-soft: #3a2a1a; --nx-orange-ink: #f29a45;
	--nx-green: #3fbf6b; --nx-green-soft: #183323; --nx-grey: #80838a; --nx-grey-soft: #2a2c30; --nx-yellow-soft: #2b2614; --nx-yellow-ink: #f0c76a;
	--nx-dark: #f2f2f2; --nx-dark-ink: #141414; --nx-shadow: none;
	--muted: #9a9da3; --accent-soft: var(--nx-blue-soft); --accent-ink: var(--nx-blue-ink);
	color-scheme: dark;
}
html.kdh-next[data-theme="dark"].kdh-branded, html.kdh-next[data-theme="dark"].kdh-branded body.kdh-body { --accent-soft: color-mix(in srgb, var(--kd-accent) 22%, var(--nx-card2)); --accent-ink: color-mix(in srgb, var(--kd-accent) 45%, #fff); }

/* ---------- base ---------- */
html.kdh-next { background: var(--nx-page); }
html.kdh-next body.kdh-body { margin: 0; background: var(--nx-page); color: var(--nx-ink); font: 14px/1.45 var(--nx-font); font-feature-settings: "cv11", "ss01", "tnum"; -webkit-font-smoothing: antialiased; }
html.kdh-next .kdh-body h1, html.kdh-next .kdh-body h2, html.kdh-next .kdh-body h3 { color: var(--nx-ink); font-weight: 500; letter-spacing: -.015em; }
html.kdh-next .kdh-body a { color: var(--nx-blue); }
html.kdh-next .kdh-muted { color: var(--muted); }
html.kdh-next .kdh-body :focus-visible { outline: 2px solid var(--nx-blue); outline-offset: 2px; }
html.kdh-next .kdh-kicker { font-family: var(--nx-mono); font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--nx-mut); }
html.kdh-next .kdh-nx-mono { font-family: var(--nx-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
html.kdh-next .kdh-sp { flex: 1; }
html.kdh-next.kdh-theming *, html.kdh-next.kdh-theming *::before { transition: background-color .3s, border-color .3s, color .3s !important; }

/* inputs */
html.kdh-next .kdh-body input[type="text"], html.kdh-next .kdh-body input[type="password"], html.kdh-next .kdh-body input:not([type]), html.kdh-next .kdh-body input[type="email"],
html.kdh-next .kdh-body input[type="url"], html.kdh-next .kdh-body input[type="search"], html.kdh-next .kdh-body input[type="number"], html.kdh-next .kdh-body input[type="date"],
html.kdh-next .kdh-body textarea, html.kdh-next .kdh-body select {
	background: var(--nx-card2); color: var(--nx-ink); border: 1px solid var(--nx-line); border-radius: var(--nx-r); min-height: 38px; padding: 8px 12px; font: inherit; box-shadow: none;
}
html.kdh-next .kdh-body select { padding-right: 30px; }
html.kdh-next .kdh-body input:focus, html.kdh-next .kdh-body textarea:focus, html.kdh-next .kdh-body select:focus { border-color: color-mix(in srgb, var(--nx-blue) 60%, var(--nx-line)); outline: 3px solid color-mix(in srgb, var(--nx-blue) 18%, transparent); outline-offset: 0; }
html.kdh-next .kdh-body ::placeholder { color: var(--nx-mut); }
html.kdh-next .kdh-body label { color: var(--nx-ink2); }

/* buttons */
html.kdh-next .kdh-btn { min-height: 40px; padding: 0 15px; border-radius: var(--nx-r); background: var(--nx-card2); border: 1px solid var(--nx-line); color: var(--nx-ink) !important; font-weight: 500; gap: 8px; transition: transform .12s, box-shadow .15s, background .15s, border-color .15s; }
html.kdh-next .kdh-btn:hover { border-color: color-mix(in srgb, var(--nx-ink) 25%, var(--nx-line)); background: var(--nx-card2); }
html.kdh-next .kdh-btn:active { transform: scale(.97); }
html.kdh-next .kdh-btn .kdh-ic { color: currentColor; }
html.kdh-next .kdh-btn-main, html.kdh-next .kdh-nx-dark { background: var(--nx-primary); border-color: transparent; color: var(--nx-on-primary) !important; box-shadow: 0 8px 18px -10px rgba(0, 0, 0, .7); }
html.kdh-next .kdh-btn-main:hover, html.kdh-next .kdh-nx-dark:hover { background: var(--nx-primary); border-color: transparent; filter: brightness(1.12); }
html.kdh-next .kdh-btn-main .kdh-ic, html.kdh-next .kdh-nx-dark .kdh-ic { color: inherit; }
html.kdh-next .kdh-nx-soft { background: var(--nx-blue-soft); color: var(--nx-blue-ink) !important; border-color: color-mix(in srgb, var(--nx-blue) 25%, transparent); }
html.kdh-next .kdh-btn-sm { min-height: 32px; padding: 0 11px; border-radius: 10px; font-size: 13px; }
html.kdh-next .kdh-btn-ghost { background: transparent; border-color: transparent; }
html.kdh-next .kdh-btn-ghost:hover { background: var(--nx-line2); border-color: transparent; }
html.kdh-next .kdh-btn[disabled] { opacity: .45; transform: none; }
html.kdh-next .kdh-nx-ico { width: 32px; padding: 0; justify-content: center; }
html.kdh-next .kdh-linkbtn { color: var(--nx-mut); }
html.kdh-next .kdh-linkbtn:hover { color: var(--nx-pink); }
html.kdh-next .kdh-icbtn { border-radius: 10px; color: var(--nx-ink2); width: 34px; height: 34px; }
html.kdh-next .kdh-icbtn:hover { background: var(--nx-line2); border-color: transparent; color: var(--nx-ink); }
html.kdh-next .kdh-icbtn[aria-pressed="true"] { color: var(--nx-ink); }

/* segmented controls and filters: grey track, white thumb */
html.kdh-next .kdh-seg, html.kdh-next .kdh-filter { background: var(--nx-line2); border: 0; border-radius: var(--nx-r); padding: 3px; gap: 2px; overflow: visible; display: inline-flex; }
html.kdh-next .kdh-seg button, html.kdh-next .kdh-filter button { background: transparent; border: 0 !important; border-radius: 9px; color: var(--nx-ink2); font-weight: 500; font-size: 13px; padding: 5px 12px; min-height: 30px; display: inline-flex; align-items: center; gap: 6px; }
html.kdh-next .kdh-seg button[aria-pressed="true"], html.kdh-next .kdh-filter button[aria-pressed="true"] { background: var(--nx-card2); color: var(--nx-ink); font-weight: 500; box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
html.kdh-next .kdh-seg button[aria-pressed="true"] .kdh-ic { color: currentColor; }
html.kdh-next .kdh-count { background: var(--nx-blue); border-radius: 9px; font-weight: 600; }
html.kdh-next .kdh-count-soft { background: transparent; color: var(--nx-mut); font-weight: 500; }

/* chips */
html.kdh-next .kdh-chip, html.kdh-next .kdh-tst { border-radius: 13px; padding: 1px 9px; font-weight: 500; background: var(--nx-line2); color: var(--nx-ink2); }
html.kdh-next .kdh-chip-live, html.kdh-next .kdh-chip-open, html.kdh-next .kdh-chip-r-done, html.kdh-next .kdh-chip-st-done, html.kdh-next .kdh-chip-free, html.kdh-next .kdh-chip-approved, html.kdh-next .kdh-tst-resolved, html.kdh-next .kdh-freepill { background: var(--nx-green-soft); color: var(--nx-green); }
html.kdh-next .kdh-chip-staging, html.kdh-next .kdh-chip-ro, html.kdh-next .kdh-chip-r-queued, html.kdh-next .kdh-tst-waiting { background: var(--nx-orange-soft); color: var(--nx-orange-ink); }
html.kdh-next .kdh-chip-st-progress, html.kdh-next .kdh-tst-progress, html.kdh-next .kdh-tst-ack { background: var(--nx-blue-soft); color: var(--nx-blue-ink); }
html.kdh-next .kdh-chip-r-failed, html.kdh-next .kdh-chip-arch, html.kdh-next .kdh-tst-new { background: var(--nx-pink-soft); color: var(--nx-pink); }
html.kdh-next .kdh-chip-pending { background: var(--nx-pink-soft); color: var(--nx-pink); }
html.kdh-next .kdh-chip-note { background: var(--nx-yellow-soft); color: var(--nx-yellow-ink); }
html.kdh-next .kdh-tst-closed { background: var(--nx-line2); color: var(--nx-mut); }
html.kdh-next .kdh-nx-chip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 13px; font-size: 12.5px; font-weight: 500; background: var(--nx-card2); border: 1px solid var(--nx-line); color: var(--nx-ink2); white-space: nowrap; }
html.kdh-next .kdh-nx-chip .kdh-ic { color: var(--nx-mut); }
html.kdh-next .kdh-nx-d { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; display: inline-block; }
html.kdh-next .kdh-nx-chip.kdh-nx-orange { background: var(--nx-orange-soft); color: var(--nx-orange-ink); border-color: transparent; }
html.kdh-next .kdh-nx-chip.kdh-nx-blue { background: var(--nx-blue-soft); color: var(--nx-blue-ink); border-color: transparent; }
html.kdh-next .kdh-nx-chip.kdh-nx-green { background: var(--nx-green-soft); color: var(--nx-green); border-color: transparent; }
html.kdh-next .kdh-nx-chip.kdh-nx-pink { background: var(--nx-pink-soft); color: var(--nx-pink); border-color: transparent; }
html.kdh-next .kdh-nx-chip.kdh-nx-grey { background: var(--nx-line2); color: var(--nx-mut); border-color: transparent; }
html.kdh-next i.kdh-nx-orange, html.kdh-next .kdh-nx-d.kdh-nx-orange { background: var(--nx-orange); }
html.kdh-next i.kdh-nx-blue, html.kdh-next .kdh-nx-d.kdh-nx-blue { background: var(--nx-blue); }
html.kdh-next i.kdh-nx-green, html.kdh-next .kdh-nx-d.kdh-nx-green { background: var(--nx-green); }
html.kdh-next i.kdh-nx-pink, html.kdh-next .kdh-nx-d.kdh-nx-pink { background: var(--nx-pink); }
html.kdh-next i.kdh-nx-faint { background: var(--nx-faint); }
html.kdh-next .kdh-nx-legend { display: inline-flex; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: var(--nx-ink2); text-transform: none; letter-spacing: 0; font-family: var(--nx-font); }
html.kdh-next .kdh-nx-legend span { display: inline-flex; align-items: center; gap: 6px; }
html.kdh-next .kdh-nx-legend i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
/* SLA, priority, website */
html.kdh-next .kdh-sla { border-radius: 13px; padding: 1px 9px 1px 7px; font-weight: 500; font-size: 12px; gap: 5px; }
html.kdh-next .kdh-sla-ok { background: var(--nx-line2); color: var(--nx-ink2); }
html.kdh-next .kdh-sla-soon { background: var(--nx-orange-soft); color: var(--nx-orange-ink); }
html.kdh-next .kdh-sla-late { background: var(--nx-pink-soft); color: var(--nx-pink); border: 1px dashed color-mix(in srgb, var(--nx-pink) 55%, transparent); }
html.kdh-next .kdh-prio { border-radius: 7px; font-weight: 600; }
html.kdh-next .kdh-site { border-radius: 13px; font-weight: 500; }
html.kdh-next[data-theme="dark"] .kdh-site { background: color-mix(in srgb, var(--s) 22%, var(--nx-card2)); color: color-mix(in srgb, var(--s) 45%, #fff); }
html.kdh-next[data-theme="dark"] .kdh-sitecard-calm .kdh-sitecard-tile { background: color-mix(in srgb, var(--s) 22%, var(--nx-card2)); color: color-mix(in srgb, var(--s) 45%, #fff); }
html.kdh-next .kdh-ava { font-weight: 600; }
html.kdh-next .kdh-ava-agency { background: var(--nx-blue); color: #fff; }
html.kdh-next[data-theme="dark"] .kdh-ava-agency { color: #fff; }
html.kdh-next .kdh-ava-empty { background: var(--nx-line2); color: var(--nx-mut); }

/* cards */
html.kdh-next .kdh-panel, html.kdh-next .kdh-panel-d, html.kdh-next .kdh-card2, html.kdh-next .kdh-hbig, html.kdh-next .kdh-nx-card, html.kdh-next .kdh-person, html.kdh-next .kdh-stats {
	background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: var(--nx-r-card); box-shadow: var(--nx-shadow);
}
html.kdh-next .kdh-nx-card { padding: 22px 24px; min-width: 0; }
html.kdh-next .kdh-card2 { padding: 20px 22px; gap: 10px; }
html.kdh-next .kdh-card2 > header h2, html.kdh-next .kdh-panel-d h2, html.kdh-next .kdh-nx-card h2, html.kdh-next .kdh-nx-card h3 { font-size: 17px; font-weight: 500; letter-spacing: -.01em; }
html.kdh-next .kdh-card2 > header h2 .kdh-ic { color: var(--nx-mut); }
html.kdh-next .kdh-card2 > header a { color: var(--nx-mut); font-size: 13px; text-decoration: none; }
html.kdh-next .kdh-card2 > header a:hover { color: var(--nx-ink); }
html.kdh-next .kdh-panel-d { padding: 20px 22px; }
html.kdh-next .kdh-nx-icbox { width: 36px; height: 36px; border-radius: 11px; display: inline-grid; place-items: center; background: var(--nx-card2); border: 1px solid var(--nx-line); flex: none; color: var(--nx-ink2); }
html.kdh-next .kdh-nx-icbox.kdh-nx-pink { color: var(--nx-pink); } html.kdh-next .kdh-nx-icbox.kdh-nx-orange { color: var(--nx-orange); } html.kdh-next .kdh-nx-icbox.kdh-nx-blue { color: var(--nx-blue); }
html.kdh-next .kdh-nx-k { color: var(--nx-mut); font-size: 13px; margin-bottom: 4px; }

/* tables */
html.kdh-next .kdh-dtable, html.kdh-next .kdh-table, html.kdh-next .kdh-acttable { font-size: 13.5px; }
html.kdh-next .kdh-dtable th, html.kdh-next .kdh-table th, html.kdh-next .kdh-acttable th { color: var(--nx-mut); font-weight: 450; font-size: 12.5px; border-bottom: 0; padding: 0 10px 10px; }
html.kdh-next .kdh-dtable td, html.kdh-next .kdh-table td, html.kdh-next .kdh-acttable td { border-bottom: 0; border-top: 1px solid var(--nx-line2); padding: 11px 10px; }
html.kdh-next .kdh-dtable tbody tr:hover td, html.kdh-next .kdh-acttable tbody tr:hover td { background: var(--nx-card2); }
html.kdh-next .kdh-dtable tr.kdh-cur td { background: var(--nx-blue-soft); font-weight: 500; }
html.kdh-next tr.kdh-act-note td { background: var(--nx-yellow-soft); }

/* menus */
html.kdh-next .kdh-menu { background: var(--nx-card2); border: 1px solid var(--nx-line); border-radius: 16px; box-shadow: 0 24px 50px -20px rgba(0, 0, 0, .45); padding: 6px; animation: kdh-nx-fu .18s var(--nx-ease) both; }
html.kdh-next .kdh-menu button, html.kdh-next .kdh-menu a { border-radius: 10px; color: var(--nx-ink); }
html.kdh-next .kdh-menu button:hover { background: var(--nx-line2); }
html.kdh-next .kdh-menu button .kdh-ic { color: var(--nx-ink2); }
html.kdh-next .kdh-menu-title, html.kdh-next .kdh-menu-h { font-family: var(--nx-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--nx-mut); padding: 8px 10px 4px; }
html.kdh-next .kdh-bellmenu button.kdh-unread { background: var(--nx-blue-soft); }
html.kdh-next .kdh-mlist { background: var(--nx-card2); border-color: var(--nx-line); border-radius: 12px; }
html.kdh-next .kdh-loading { color: var(--nx-mut); }
html.kdh-next .kdh-empty { color: var(--nx-mut); }
html.kdh-next .kdh-lightbox { background: rgba(10, 10, 12, .85); }
html.kdh-next .kdh-files a, html.kdh-next .kdh-files span.kdh-fdoc, html.kdh-next .kdh-fdoc { border-radius: 10px; background: var(--nx-line2); border-color: transparent; color: var(--nx-ink); }
html.kdh-next .kdh-fx { background: var(--nx-card2); }
html.kdh-next .kdh-drop { border-radius: 12px; border-color: var(--nx-line); color: var(--nx-mut); }
html.kdh-next .kdh-dragover { outline-color: var(--nx-blue); }
html.kdh-next .kdh-mention { background: var(--nx-blue-soft); color: var(--nx-blue-ink); border-radius: 6px; }
html.kdh-next .kdh-flash, html.kdh-next .kdh-banner { background: var(--nx-blue-soft); border: 0; color: var(--nx-ink); }
html.kdh-next .kdh-flash-warn, html.kdh-next .kdh-banner-ro { background: var(--nx-orange-soft); }

/* ---------- shell: sidebar (open or icon rail) + content ---------- */
html.kdh-next .kdh-nx-shell { display: grid; grid-template-columns: var(--nx-sw) minmax(0, 1fr); grid-template-rows: none; height: auto; min-height: 100dvh; background: var(--nx-shell); transition: grid-template-columns .28s var(--nx-ease); }
html.kdh-next.kdh-nx-railed, html.kdh-next.kdh-nx-railed body.kdh-body { --nx-sw: 76px; }
@media (min-width: 1240px) {
	html.kdh-next .kdh-nx-shell { margin: 16px; min-height: calc(100dvh - 32px); border-radius: var(--nx-r-shell); box-shadow: 0 30px 80px -40px rgba(0, 0, 0, .35); overflow: clip; }
}
html.kdh-next .kdh-nx-side { position: sticky; top: 0; align-self: start; height: 100dvh; display: flex; flex-direction: column; gap: 4px; padding: 18px 14px 14px; border-right: 1px solid var(--nx-line); min-width: 0; z-index: 30; background: var(--nx-shell); }
@media (min-width: 1240px) { html.kdh-next .kdh-nx-side { top: 16px; height: calc(100dvh - 32px); } }
html.kdh-next .kdh-nx-body { min-width: 0; display: flex; flex-direction: column; }
html.kdh-next .kdh-nx-ws { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 16px; background: var(--nx-card2); border: 1px solid var(--nx-line); margin-bottom: 12px; text-decoration: none; color: var(--nx-ink) !important; min-width: 0; }
html.kdh-next .kdh-nx-mark { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; background: var(--nx-dark); color: var(--nx-dark-ink); font-weight: 700; font-size: 13px; flex: none; letter-spacing: -.01em; }
html.kdh-next .kdh-nx-mark-cl { background: var(--kd-accent); color: #fff; }
html.kdh-next .kdh-nx-ws-t { display: grid; min-width: 0; line-height: 1.2; }
html.kdh-next .kdh-nx-ws-t strong { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.kdh-next .kdh-nx-ws-t small { color: var(--nx-mut); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.kdh-next .kdh-nx-ws-t img.kdh-cl { max-height: 26px; max-width: 150px; width: auto; display: block; margin-bottom: 2px; }
html.kdh-next[data-theme="dark"] .kdh-nx-ws-t img.kdh-cl, html.kdh-next[data-theme="dark"] .kdh-nx-pchip img.kdh-cl { background: #fff; border-radius: 6px; padding: 2px 5px; }
html.kdh-next .kdh-nx-navs { display: flex; flex-direction: column; gap: 2px; min-height: 0; overflow-y: auto; overflow-x: hidden; margin: 0 -4px; padding: 0 4px; }
html.kdh-next .kdh-nx-navh { font-size: 12px; color: var(--nx-mut); padding: 14px 10px 6px; white-space: nowrap; }
html.kdh-next .kdh-nx-sep { height: 1px; background: var(--nx-line); margin: 10px 6px; }
html.kdh-next .kdh-nx-nav { display: flex; align-items: center; gap: 11px; padding: 9px 10px; border-radius: 12px; color: var(--nx-ink2) !important; font-weight: 450; text-decoration: none; background: none; border: 0; width: 100%; cursor: pointer; font: inherit; text-align: left; position: relative; white-space: nowrap; transition: background .15s, color .15s; }
html.kdh-next .kdh-nx-nav:hover { background: var(--nx-line2); color: var(--nx-ink) !important; }
html.kdh-next .kdh-nx-nav[aria-current="page"] { background: var(--nx-dark); color: var(--nx-dark-ink) !important; box-shadow: 0 6px 14px -8px rgba(0, 0, 0, .6); }
html.kdh-next .kdh-nx-nav .kdh-icw { flex: none; }
html.kdh-next .kdh-nx-lbl { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
html.kdh-next .kdh-nx-ct { margin-left: auto; background: transparent; color: var(--nx-mut); font-size: 12px; font-weight: 500; padding: 0; }
html.kdh-next .kdh-nx-nav[aria-current="page"] .kdh-nx-ct { color: inherit; opacity: .7; }
html.kdh-next .kdh-nx-ct.kdh-nx-hot, html.kdh-next .kdh-bell .kdh-count { margin-left: auto; min-width: 20px; height: 20px; border-radius: 10px; background: var(--nx-pink); color: #fff; font-size: 11px; font-weight: 600; display: inline-grid; place-items: center; padding: 0 6px; opacity: 1; }
html.kdh-next .kdh-nx-ext { margin-left: auto; color: var(--nx-mut); display: inline-flex; }
html.kdh-next .kdh-nx-new { margin: 12px 0 0; width: 100%; justify-content: center; white-space: nowrap; overflow: hidden; }
html.kdh-next .kdh-nx-theme { display: flex; gap: 2px; background: var(--nx-line2); border-radius: var(--nx-r); padding: 3px; margin: 8px 0; }
html.kdh-next .kdh-nx-theme button { flex: 1; border: 0; background: transparent; border-radius: 9px; padding: 6px 4px; color: var(--nx-ink2); font: inherit; font-size: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; cursor: pointer; min-width: 0; }
html.kdh-next .kdh-nx-theme button[aria-pressed="true"] { background: var(--nx-card2); color: var(--nx-ink); box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
html.kdh-next .kdh-nx-me { display: flex; align-items: center; gap: 10px; padding: 10px 6px 2px; border: 0; border-top: 1px solid var(--nx-line); background: none; cursor: pointer; font: inherit; color: var(--nx-ink); text-align: left; min-width: 0; }
html.kdh-next .kdh-nx-me .kdh-ava { width: 34px; height: 34px; font-size: 12px; }
html.kdh-next .kdh-nx-me .kdh-nx-lbl { display: grid; line-height: 1.25; }
html.kdh-next .kdh-nx-me strong { font-weight: 550; font-size: 13.5px; }
html.kdh-next .kdh-nx-me small { color: var(--nx-mut); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.kdh-next .kdh-nx-railbtn { position: absolute; top: 30px; right: -13px; width: 26px; height: 26px; border-radius: 50%; background: var(--nx-card2); border: 1px solid var(--nx-line); display: grid; place-items: center; z-index: 6; color: var(--nx-ink2); cursor: pointer; box-shadow: 0 4px 10px -6px rgba(0, 0, 0, .4); opacity: 0; transition: opacity .15s; padding: 0; }
html.kdh-next .kdh-nx-side:hover .kdh-nx-railbtn, html.kdh-next .kdh-nx-railbtn:focus-visible, html.kdh-next.kdh-nx-railed .kdh-nx-railbtn { opacity: 1; }
html.kdh-next .kdh-nx-railbtn .kdh-icw { transition: transform .25s; }
html.kdh-next.kdh-nx-railed .kdh-nx-railbtn .kdh-icw { transform: rotate(180deg); }
/* the icon rail */
html.kdh-next.kdh-nx-railed .kdh-nx-side { padding-left: 12px; padding-right: 12px; }
html.kdh-next.kdh-nx-railed .kdh-nx-lbl, html.kdh-next.kdh-nx-railed .kdh-nx-navh, html.kdh-next.kdh-nx-railed .kdh-nx-ws-t, html.kdh-next.kdh-nx-railed .kdh-nx-ext { display: none; }
html.kdh-next.kdh-nx-railed .kdh-nx-ws { justify-content: center; border-color: transparent; background: transparent; padding: 6px 0; }
html.kdh-next.kdh-nx-railed .kdh-nx-nav { justify-content: center; padding: 10px 0; gap: 0; }
html.kdh-next.kdh-nx-railed .kdh-nx-ct { position: absolute; top: 3px; right: 6px; min-width: 8px; width: 8px; height: 8px; padding: 0; font-size: 0; background: var(--nx-orange); border-radius: 50%; margin: 0; opacity: 1; }
html.kdh-next.kdh-nx-railed .kdh-nx-ct.kdh-nx-hot, html.kdh-next.kdh-nx-railed .kdh-bell .kdh-count { background: var(--nx-pink); min-width: 8px; height: 8px; padding: 0; font-size: 0; }
html.kdh-next.kdh-nx-railed .kdh-nx-nav[data-tip]:hover::after { content: attr(data-tip); position: absolute; left: calc(100% + 12px); top: 50%; transform: translateY(-50%); background: var(--nx-dark); color: var(--nx-dark-ink); font-size: 12.5px; padding: 5px 9px; border-radius: 8px; white-space: nowrap; z-index: 40; pointer-events: none; }
html.kdh-next.kdh-nx-railed .kdh-nx-theme { flex-direction: column; }
html.kdh-next.kdh-nx-railed .kdh-nx-me { justify-content: center; padding-left: 0; padding-right: 0; }
html.kdh-next.kdh-nx-railed .kdh-nx-new { width: 44px; padding: 0; margin-left: auto; margin-right: auto; }
html.kdh-next.kdh-nx-railed .kdh-nx-sep { margin: 8px 4px; }

/* ---------- Review: second column, stage, comments ---------- */
html.kdh-next.kdh-screen-review, html.kdh-next .kdh-screen-review { overflow: visible; }
html.kdh-next .kdh-nx-main { display: grid; grid-template-columns: var(--rail, 272px) minmax(0, 1fr); min-height: 0; flex: 1; }
html.kdh-next .kdh-nx-main.kdh-no-rail { --rail: 0px; }
html.kdh-next .kdh-nx-main.kdh-nx-boardmain { grid-template-columns: minmax(0, 1fr); }
html.kdh-next .kdh-nx-main .kdh-rail { position: sticky; top: 0; align-self: start; height: 100dvh; overflow-y: auto; background: transparent; border-right: 1px solid var(--nx-line); padding: 22px 14px 0; gap: 2px; }
@media (min-width: 1240px) { html.kdh-next .kdh-nx-main .kdh-rail { top: 16px; height: calc(100dvh - 32px); } }
html.kdh-next .kdh-nx-railh { font-size: 22px !important; font-weight: 500; letter-spacing: -.02em; margin: 4px 8px 12px; }
html.kdh-next .kdh-nx-railh2 { font-size: 15px !important; margin-top: 18px; color: var(--nx-ink2) !important; }
html.kdh-next .kdh-nx-projects { display: grid; gap: 2px; }
html.kdh-next .kdh-nx-prj { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 11px; color: var(--nx-ink2) !important; text-decoration: none; }
html.kdh-next .kdh-nx-prj:hover { background: var(--nx-line2); }
html.kdh-next .kdh-nx-prj[aria-current="page"] { background: var(--nx-card2); color: var(--nx-ink) !important; box-shadow: var(--nx-shadow); }
html.kdh-next .kdh-nx-hash { color: var(--nx-mut); }
html.kdh-next .kdh-nx-prj-t { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.kdh-next .kdh-nx-n { font-size: 11.5px; min-width: 20px; height: 20px; border-radius: 7px; display: grid; place-items: center; padding: 0 5px; background: var(--nx-line2); color: var(--nx-ink2); }
html.kdh-next .kdh-nx-n-open { background: var(--nx-orange); color: #fff; }
html.kdh-next .kdh-rail-search { padding: 0 0 8px; }
html.kdh-next .kdh-grp { font-family: var(--nx-font); text-transform: none; letter-spacing: 0; font-size: 13px; font-weight: 500; color: var(--nx-ink2); padding: 10px 8px 4px; }
html.kdh-next .kdh-pg { border-left: 0; border-radius: 11px; padding: 8px 10px 8px 14px; color: var(--nx-ink2); position: relative; }
html.kdh-next .kdh-pg::before { content: ""; position: absolute; left: 4px; top: -2px; bottom: -2px; border-left: 1px solid var(--nx-line); }
html.kdh-next .kdh-pg:hover { background: var(--nx-line2); }
html.kdh-next .kdh-pg[aria-current="true"] { background: var(--nx-card2); color: var(--nx-ink); box-shadow: var(--nx-shadow); }
html.kdh-next .kdh-pg-n { border-radius: 7px; min-width: 20px; height: 20px; display: grid; place-items: center; background: var(--nx-orange); }
html.kdh-next .kdh-pg-n.kdh-zero { background: transparent; }
html.kdh-next .kdh-nr { background: var(--nx-orange-soft); color: var(--nx-orange-ink); }
html.kdh-next .kdh-nx-main .kdh-rail > .kdh-foot { border-top: 1px solid var(--nx-line); margin: 18px -14px 0; padding: 16px 18px; background: transparent; }
html.kdh-next .kdh-foot { color: var(--nx-mut); border-color: var(--nx-line); }
html.kdh-next .kdh-foot-brand, html.kdh-next .kdh-foot-who { color: var(--nx-ink) !important; }

html.kdh-next .kdh-nx-stage { display: block; min-width: 0; padding: 22px 30px 34px; }
html.kdh-next .kdh-nx-head { display: grid; gap: 6px; padding: 0; background: none; border: 0; margin-bottom: 16px; }
html.kdh-next .kdh-nx-crumb { display: flex; align-items: center; gap: 8px; color: var(--nx-mut); font-size: 13.5px; flex-wrap: wrap; min-width: 0; }
html.kdh-next .kdh-nx-crumb a { color: var(--nx-mut) !important; text-decoration: none; }
html.kdh-next .kdh-nx-crumb a:hover { color: var(--nx-ink) !important; }
html.kdh-next .kdh-nx-crumb-sep { width: 1px; height: 16px; background: var(--nx-line); }
html.kdh-next .kdh-nx-crumb .kdh-round select { min-height: 30px !important; padding: 2px 28px 2px 10px !important; border-radius: 10px; font-weight: 500; color: var(--nx-ink); background: var(--nx-card2); }
html.kdh-next .kdh-nx-upd { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; font-size: 13px; }
html.kdh-next .kdh-nx-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--nx-green); display: inline-block; }
html.kdh-next .kdh-nx-dot-run { background: var(--nx-orange); animation: kdh-nx-blink 1.2s ease-in-out infinite; }
html.kdh-next .kdh-nx-titlerow { display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap; margin: 2px 0 10px; }
html.kdh-next .kdh-nx-h1 { font-size: 40px !important; font-weight: 450 !important; letter-spacing: -.025em; line-height: 1.05 !important; margin: 0; min-width: 0; overflow-wrap: anywhere; }
html.kdh-next .kdh-nx-titlerow .kdh-nx-chip { margin-bottom: 6px; }
html.kdh-next .kdh-nx-tb { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
html.kdh-next .kdh-nx-pchip { display: inline-flex; align-items: center; gap: 9px; height: 44px; padding: 0 12px 0 6px; border-radius: 13px; background: var(--nx-card); border: 1px solid var(--nx-line); min-width: 0; }
html.kdh-next .kdh-nx-pchip .kdh-nx-mark { width: 30px; height: 30px; border-radius: 9px; font-size: 11.5px; }
html.kdh-next .kdh-nx-pchip img.kdh-cl { max-height: 24px; max-width: 140px; width: auto; display: block; }
html.kdh-next .kdh-nx-pchip strong { font-weight: 500; }
html.kdh-next .kdh-nx-env { font-size: 12.5px; color: var(--nx-orange-ink); white-space: nowrap; }
html.kdh-next .kdh-nx-env-live { color: var(--nx-green); }
html.kdh-next .kdh-nx-tb .kdh-seg button { min-height: 32px; }
html.kdh-next .kdh-nx-tb .kdh-pagesel { display: none; }

html.kdh-next .kdh-nx-work { display: grid; grid-template-columns: minmax(0, 7fr) minmax(300px, 5fr); gap: 16px; align-items: start; }
html.kdh-next .kdh-no-pane .kdh-nx-work { grid-template-columns: minmax(0, 1fr); }
html.kdh-next .kdh-nx-work .kdh-viewer { height: calc(100dvh - 230px); min-height: 460px; border-radius: 18px; border: 1px solid var(--nx-line); background: var(--nx-card); position: relative; }
html.kdh-next .kdh-nx-work .kdh-pane { position: sticky; top: 16px; max-height: calc(100dvh - 32px); min-height: 0; overflow-y: auto; background: transparent; border: 0; }
/* the screenshot in a browser frame. The frame is drawn ABOVE the canvas, never inside it: pins stay exactly where they were. */
html.kdh-next .kdh-canvas { margin-top: 64px; border-radius: 0 0 10px 10px; box-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 18px 40px -18px rgba(0, 0, 0, .35); }
html.kdh-next .kdh-canvas::before { content: attr(data-url); pointer-events: none; position: absolute; left: 0; right: 0; bottom: 100%; height: 40px; display: flex; align-items: center; justify-content: center; padding: 0 80px; font-size: 12.5px; color: var(--nx-mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
	background: radial-gradient(circle at 18px 50%, var(--nx-faint) 5px, transparent 5.5px), radial-gradient(circle at 36px 50%, var(--nx-faint) 5px, transparent 5.5px), radial-gradient(circle at 54px 50%, var(--nx-faint) 5px, transparent 5.5px), var(--nx-card2);
	border: 1px solid var(--nx-line); border-bottom: 0; border-radius: 12px 12px 0 0; }
html.kdh-next .kdh-canvas[data-url=""]::before, html.kdh-next .kdh-canvas:not([data-url])::before { content: ""; }
html.kdh-next .kdh-older { background: var(--nx-dark); color: var(--nx-dark-ink); }
/* pins coloured by status (only colour; size and position stay) */
html.kdh-next .kdh-pin { background: var(--nx-orange); border-color: #fff; box-shadow: 0 6px 14px -4px rgba(0, 0, 0, .5); transition: box-shadow .15s, filter .15s; }
html.kdh-next .kdh-pin:hover, html.kdh-next .kdh-pin.kdh-on { box-shadow: 0 0 0 4px color-mix(in srgb, var(--nx-blue) 45%, transparent), 0 6px 14px -4px rgba(0, 0, 0, .5); filter: brightness(1.05); }
html.kdh-next .kdh-pin.kdh-st-progress, html.kdh-next .kdh-pin.kdh-st-ai { background: var(--nx-blue); }
html.kdh-next .kdh-pin.kdh-st-done { background: var(--nx-green); }
html.kdh-next .kdh-pin.kdh-st-wontfix, html.kdh-next .kdh-pin.kdh-pin-declined { background: var(--nx-grey); }
html.kdh-next .kdh-pin.kdh-pin-pending { background: var(--nx-pink); color: #fff; border: 2px dashed #fff; }
html.kdh-next .kdh-pin.kdh-draft { background: var(--nx-dark); color: var(--nx-dark-ink); }
html.kdh-next .kdh-pop { background: var(--nx-card2); border-color: var(--nx-line); border-radius: 18px; box-shadow: 0 30px 60px -24px rgba(0, 0, 0, .55); animation: kdh-nx-fu .18s var(--nx-ease) both; }

/* comments panel */
html.kdh-next .kdh-nx-work .kdh-pane-head { position: sticky; top: 0; z-index: 3; background: var(--nx-shell); border: 0; padding: 0 0 12px; gap: 10px; }
html.kdh-next .kdh-pane-head h2 { font-size: 17px; font-weight: 500; }
html.kdh-next .kdh-pane-head h2 .kdh-muted { font-weight: 400; font-size: 14px; }
html.kdh-next .kdh-nx-pills { display: flex; gap: 6px; flex-wrap: wrap; }
html.kdh-next .kdh-nx-pills button { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 11px; border-radius: 14px; font: inherit; font-size: 12.5px; font-weight: 500; background: var(--nx-card2); border: 1px solid var(--nx-line); color: var(--nx-ink2); cursor: pointer; }
html.kdh-next .kdh-nx-pills button b { font-weight: 500; color: var(--nx-mut); }
html.kdh-next .kdh-nx-pills button[aria-pressed="true"] { background: var(--nx-dark); color: var(--nx-dark-ink); border-color: transparent; }
html.kdh-next .kdh-nx-pills button[aria-pressed="true"] b { color: inherit; opacity: .7; }
html.kdh-next .kdh-hint { color: var(--nx-mut); }
html.kdh-next .kdh-hint .kdh-ic { color: var(--nx-blue); }
html.kdh-next .kdh-nx-work .kdh-list { display: grid; gap: 8px; }
html.kdh-next .kdh-nx-work .kdh-c { border: 1px solid var(--nx-line); border-radius: 16px; padding: 13px 14px; background: var(--nx-card); transition: background .15s, border-color .15s, box-shadow .15s; }
html.kdh-next .kdh-nx-work .kdh-c:hover { background: var(--nx-card2); }
html.kdh-next .kdh-nx-work .kdh-c.kdh-on { background: var(--nx-card2); border-color: color-mix(in srgb, var(--nx-blue) 45%, var(--nx-line)); cursor: default; }
html.kdh-next .kdh-c-head { gap: 9px; font-size: 12.5px; color: var(--nx-mut); }
html.kdh-next .kdh-c-who { color: var(--nx-ink); font-weight: 500; font-size: 13px; }
html.kdh-next .kdh-c-num { border-radius: 50% 50% 50% 3px; background: var(--nx-orange); }
html.kdh-next .kdh-st-progress .kdh-c-num, html.kdh-next .kdh-st-ai .kdh-c-num { background: var(--nx-blue); }
html.kdh-next .kdh-st-done .kdh-c-num { background: var(--nx-green); }
html.kdh-next .kdh-st-wontfix .kdh-c-num, html.kdh-next .kdh-c-declined .kdh-c-num { background: var(--nx-grey); }
html.kdh-next .kdh-c-pending .kdh-c-num { background: var(--nx-pink); }
html.kdh-next .kdh-c-text { font-size: 14px; line-height: 1.5; margin-top: 8px !important; color: var(--nx-ink); }
html.kdh-next .kdh-st-done .kdh-c-text, html.kdh-next .kdh-st-wontfix .kdh-c-text { color: var(--nx-ink2); }
html.kdh-next .kdh-nx-cmeta { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-top: 10px; font-size: 12.5px; color: var(--nx-mut); }
html.kdh-next .kdh-nx-cmeta > span { display: inline-flex; align-items: center; gap: 5px; }
html.kdh-next .kdh-nx-cmeta .kdh-nx-chip { height: 22px; font-size: 12px; }
html.kdh-next .kdh-nx-note .kdh-ic { color: var(--nx-blue); }
html.kdh-next .kdh-st-done .kdh-nx-note .kdh-ic { color: var(--nx-green); }
html.kdh-next .kdh-replies { margin: 12px 0 0; padding: 12px 0 0; border-left: 0; border-top: 1px solid var(--nx-line2); gap: 12px; }
html.kdh-next .kdh-reply .kdh-c-head .kdh-ava { width: 28px; height: 28px; font-size: 11px; }
html.kdh-next .kdh-replyform { margin-top: 12px; }
html.kdh-next .kdh-nx-cacts { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; align-items: center; }
html.kdh-next .kdh-nx-cacts .kdh-linkbtn { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 11px; border-radius: 10px; background: var(--nx-card2); border: 1px solid var(--nx-line); color: var(--nx-ink); text-decoration: none; font-size: 13px; font-weight: 500; }
html.kdh-next .kdh-nx-cacts .kdh-linkbtn:hover { color: var(--nx-ink); border-color: color-mix(in srgb, var(--nx-ink) 25%, var(--nx-line)); }
html.kdh-next .kdh-nx-stsel { position: relative; display: inline-flex; align-items: center; height: 28px; border-radius: 14px; padding: 0 0 0 10px; gap: 6px; font-size: 12.5px; font-weight: 500; }
html.kdh-next .kdh-nx-stsel select { border: 0 !important; background: transparent !important; color: inherit !important; min-height: 26px !important; padding: 0 26px 0 0 !important; font-weight: 500; font-size: 12.5px; outline-offset: 2px; cursor: pointer; }
html.kdh-next .kdh-nx-stsel.kdh-nx-orange { background: var(--nx-orange-soft); color: var(--nx-orange-ink); }
html.kdh-next .kdh-nx-stsel.kdh-nx-blue { background: var(--nx-blue-soft); color: var(--nx-blue-ink); }
html.kdh-next .kdh-nx-stsel.kdh-nx-green { background: var(--nx-green-soft); color: var(--nx-green); }
html.kdh-next .kdh-nx-stsel.kdh-nx-grey, html.kdh-next .kdh-nx-stsel.kdh-nx-pink { background: var(--nx-line2); color: var(--nx-ink2); }
html.kdh-next .kdh-nx-own { margin-top: 10px; display: flex; gap: 12px; }
html.kdh-next .kdh-badge-round { border-color: var(--nx-line); color: var(--nx-mut); }
html.kdh-next .kdh-pane-empty { background: var(--nx-card); border: 1px dashed var(--nx-line); border-radius: 16px; }
html.kdh-next .kdh-nx-work .kdh-pane-foot { border-top: 0; padding: 12px 2px; color: var(--nx-mut); }
html.kdh-next .kdh-chip-ticket { background: var(--nx-blue-soft); color: var(--nx-blue-ink); text-decoration: none; }

html.kdh-next .kdh-c.kdh-new, html.kdh-next .kdh-pin.kdh-new { animation: kdh-nx-glow 1.4s var(--nx-ease) 2; }

/* below the screenshot */
html.kdh-next .kdh-nx-extra { display: grid; grid-template-columns: minmax(0, 7fr) minmax(300px, 5fr); gap: 16px; margin-top: 16px; }
html.kdh-next .kdh-nx-sum { display: flex; gap: 16px; align-items: flex-start; }
html.kdh-next .kdh-nx-sum .kdh-nx-icbox { width: 44px; height: 44px; color: var(--nx-blue); }
html.kdh-next .kdh-nx-sumt { font-size: 15.5px; line-height: 1.55; margin-bottom: 14px !important; }
html.kdh-next .kdh-nx-pages header { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
html.kdh-next .kdh-nx-pages header .kdh-nx-legend { margin-left: auto; }
html.kdh-next .kdh-nx-pgrow { display: grid; grid-template-columns: minmax(80px, 140px) 1fr 64px; gap: 12px; align-items: center; width: 100%; padding: 8px 6px; margin: 0 -6px; border: 0; background: none; border-radius: 10px; font: inherit; font-size: 13.5px; color: var(--nx-ink); text-align: left; cursor: pointer; }
html.kdh-next .kdh-nx-pgrow:hover, html.kdh-next .kdh-nx-pgrow[aria-current="true"] { background: var(--nx-card2); }
html.kdh-next .kdh-nx-pgt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.kdh-next .kdh-nx-pgtrack { display: block; }
html.kdh-next .kdh-nx-pgbar { display: flex; gap: 2px; height: 9px; transform-origin: left; }
html.kdh-next .kdh-nx-pgrow > .kdh-muted { text-align: right; font-size: 13px; }
/* i.kdh-nx-hatch: must outrank the legend dots (i.kdh-nx-blue etc.), which paint a solid background */
html.kdh-next i.kdh-nx-hatch { --c: var(--nx-blue); display: block; height: 100%; min-width: 3px; border-radius: 3px; background: repeating-linear-gradient(135deg, var(--c) 0 1.6px, transparent 1.6px 5px); }
html.kdh-next i.kdh-nx-hatch.kdh-nx-green { --c: var(--nx-green); }
html.kdh-next i.kdh-nx-hatch.kdh-nx-orange { --c: var(--nx-orange); }
html.kdh-next i.kdh-nx-hatch.kdh-nx-blue { --c: var(--nx-blue); }
html.kdh-next i.kdh-nx-hatch.kdh-nx-faint { --c: var(--nx-faint); }
html.kdh-next .kdh-cas-in .kdh-nx-pgbar, html.kdh-next .kdh-cas-in .kdh-nx-mline > i, html.kdh-next .kdh-cas-in .kdh-nx-bar > i { animation: kdh-nx-gx .7s var(--nx-ease) .25s both; transform-origin: left; }

/* board */
html.kdh-next .kdh-board { padding: 22px 30px 34px; overflow: visible; }
html.kdh-next .kdh-board-in { max-width: 1240px; }
html.kdh-next .kdh-board-head h1 { font-size: 44px; font-weight: 450; letter-spacing: -.025em; line-height: 1.05; }
html.kdh-next .kdh-board-head .kdh-kicker { margin-bottom: 6px; }
html.kdh-next .kdh-board-filters select, html.kdh-next .kdh-board-filters input { border-radius: 10px; min-height: 36px !important; }
html.kdh-next .kdh-stats { padding: 18px 24px; gap: 8px 40px; }
html.kdh-next .kdh-stats dt { color: var(--nx-mut); font-size: 12.5px; }
html.kdh-next .kdh-stats dd { font-size: 32px; font-weight: 350; letter-spacing: -.035em; line-height: 1.1; }
html.kdh-next .kdh-cards { gap: 8px; }
html.kdh-next .kdh-card { background: var(--nx-card); border-color: var(--nx-line); border-radius: 18px; padding: 12px; transition: background .15s, border-color .15s, transform .15s; }
html.kdh-next .kdh-card:hover { background: var(--nx-card2); border-color: color-mix(in srgb, var(--nx-blue) 40%, var(--nx-line)); }
html.kdh-next .kdh-card-shot { border-radius: 10px; border-color: var(--nx-line); }
html.kdh-next .kdh-card-shot::after { background: var(--nx-orange); }
html.kdh-next .kdh-card.kdh-st-done .kdh-card-shot::after { background: var(--nx-green); }
html.kdh-next .kdh-card.kdh-st-progress .kdh-card-shot::after, html.kdh-next .kdh-card.kdh-st-ai .kdh-card-shot::after { background: var(--nx-blue); }
html.kdh-next .kdh-board .kdh-foot { border-color: var(--nx-line); }

/* gates: passcode, who is commenting, desk sign-in */
html.kdh-next .kdh-gate { background: var(--nx-page); }
html.kdh-next .kdh-gate-card { background: var(--nx-shell); border: 1px solid var(--nx-line); border-radius: var(--nx-r-shell); padding: 34px 34px 28px; box-shadow: 0 30px 80px -40px rgba(0, 0, 0, .35); }
html.kdh-next .kdh-gate-card::before { height: 0; }
html.kdh-next .kdh-gate h1 { font-size: 32px; font-weight: 450; letter-spacing: -.025em; }
html.kdh-next .kdh-gate label { font-weight: 500; color: var(--nx-ink2); }
html.kdh-next .kdh-names button { background: var(--nx-card2); border-color: var(--nx-line); border-radius: 14px; padding: 8px 14px 8px 8px; color: var(--nx-ink); }
html.kdh-next .kdh-names button:hover { border-color: color-mix(in srgb, var(--nx-ink) 25%, var(--nx-line)); }
html.kdh-next .kdh-gate-foot { border-color: var(--nx-line); }
html.kdh-next .kdh-home-item { background: var(--nx-card); border-color: var(--nx-line); border-radius: 18px; }
html.kdh-next .kdh-home-item:hover { background: var(--nx-card2); }

/* ---------- Service Desk ---------- */
html.kdh-next .kdh-screen-desk, html.kdh-next.kdh-screen-desk { background: var(--nx-page); }
html.kdh-next .kdh-desk.kdh-nx-shell { display: grid; flex-direction: initial; }
html.kdh-next .kdh-nx-shell .kdh-dmain { flex: 1; padding: 22px 30px 34px; background: transparent; }
html.kdh-next .kdh-nx-shell > .kdh-nx-body > .kdh-foot { border-top: 1px solid var(--nx-line); padding: 16px 30px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin: 0; }
html.kdh-next .kdh-nx-shell > .kdh-nx-body > .kdh-foot .kdh-foot-links { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0; }
html.kdh-next .kdh-nx-shell > .kdh-nx-body > .kdh-foot .kdh-foot-host { margin-left: auto; }
html.kdh-next .kdh-dwrap { max-width: 1240px; margin: 0; gap: 16px; }
html.kdh-next .kdh-dnarrow { max-width: 760px; }
html.kdh-next .kdh-dhead { align-items: flex-end; margin: 6px 0 8px; }
html.kdh-next .kdh-dhead h1 { font-size: 44px; font-weight: 450; letter-spacing: -.025em; line-height: 1.05; }
html.kdh-next .kdh-dhead .kdh-kicker { margin-bottom: 6px; }
html.kdh-next .kdh-nx-sub { color: var(--nx-ink2); margin-top: 6px !important; }
html.kdh-next .kdh-dfilters { display: flex; gap: 8px; flex-wrap: wrap; }
html.kdh-next .kdh-dfilters input[type="search"] { max-width: 320px; }
html.kdh-next .kdh-dfilters select { width: auto; }
/* KPI tiles: big numbers */
html.kdh-next .kdh-kpis { gap: 16px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
html.kdh-next .kdh-kpi { background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: var(--nx-r-card); padding: 18px 20px; border-left-width: 1px; box-shadow: var(--nx-shadow); }
html.kdh-next .kdh-kpi strong { font-size: 46px; font-weight: 350; letter-spacing: -.045em; line-height: 1.05; }
html.kdh-next .kdh-kpi-l { font-weight: 500; color: var(--nx-ink); font-size: 14px; }
html.kdh-next .kdh-kpi-bad strong { color: var(--nx-pink); } html.kdh-next .kdh-kpi-warn strong { color: var(--nx-orange-ink); }
html.kdh-next .kdh-nx-kpi { display: grid; align-content: start; background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: var(--nx-r-card); text-decoration: none; color: var(--nx-ink) !important; box-shadow: var(--nx-shadow); overflow: hidden; transition: border-color .15s, background .15s; }
html.kdh-next .kdh-nx-kpi:hover { background: var(--nx-card2); }
html.kdh-next .kdh-nx-kpi-h { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--nx-line); font-weight: 500; }
html.kdh-next .kdh-nx-kpi-h .kdh-nx-icbox { width: 30px; height: 30px; border-radius: 9px; }
html.kdh-next .kdh-nx-kpi-b { display: flex; align-items: baseline; gap: 6px; padding: 16px 18px 6px; }
html.kdh-next .kdh-nx-big { font-size: 46px; font-weight: 350; letter-spacing: -.045em; line-height: 1; }
html.kdh-next .kdh-nx-unit { font-size: 28px; font-weight: 350; letter-spacing: -.03em; }
html.kdh-next .kdh-nx-bar { display: block; height: 6px; margin: 8px 18px 0; border-radius: 3px; background: var(--nx-line2); overflow: hidden; }
html.kdh-next .kdh-nx-bar i { display: block; height: 100%; border-radius: 3px; background: var(--nx-blue); }
html.kdh-next .kdh-nx-kpi-s { padding: 10px 18px 16px; color: var(--nx-mut); font-size: 13px; }
html.kdh-next .kdh-nx-kpi-bad .kdh-nx-big { color: var(--nx-pink); } html.kdh-next .kdh-nx-kpi-bad .kdh-nx-icbox { color: var(--nx-pink); }
html.kdh-next .kdh-nx-kpi-warn .kdh-nx-big { color: var(--nx-orange-ink); } html.kdh-next .kdh-nx-kpi-warn .kdh-nx-icbox { color: var(--nx-orange); } html.kdh-next .kdh-nx-kpi-warn .kdh-nx-bar i { background: var(--nx-orange); }
/* overview grid */
html.kdh-next .kdh-nx-grid { display: grid; gap: 16px; align-items: start; }
html.kdh-next .kdh-nx-g2 { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
html.kdh-next .kdh-nx-g3 { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); }
html.kdh-next .kdh-nx-grid .kdh-col { display: grid; gap: 16px; }
html.kdh-next .kdh-nx-noticed header { display: flex; align-items: center; gap: 12px; padding-bottom: 16px; margin: 0 -24px 18px; padding-left: 24px; padding-right: 24px; border-bottom: 1px solid var(--nx-line); }
html.kdh-next .kdh-nx-noticed header .kdh-nx-chip { margin-left: auto; }
html.kdh-next .kdh-nx-ai { width: 40px; height: 40px; border-radius: 12px; background: var(--nx-blue); color: #fff; display: grid; place-items: center; box-shadow: 0 8px 16px -8px var(--nx-blue); flex: none; }
html.kdh-next .kdh-nx-say { font-size: 16px; line-height: 1.5; margin-bottom: 16px !important; }
html.kdh-next .kdh-nx-minis { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; margin-bottom: 16px; }
html.kdh-next .kdh-nx-mini { background: var(--nx-card2); border: 1px solid var(--nx-line); border-radius: 16px; padding: 14px; display: grid; gap: 2px; }
html.kdh-next .kdh-nx-mini .kdh-nx-icbox { width: 32px; height: 32px; border-radius: 10px; margin-bottom: 12px; }
html.kdh-next .kdh-nx-mini b { font-size: 20px; font-weight: 500; letter-spacing: -.02em; }
html.kdh-next .kdh-nx-mini small { color: var(--nx-mut); font-size: 12.5px; line-height: 1.35; }
html.kdh-next .kdh-mini { border-radius: 12px; padding: 10px 8px; margin: 0 -8px; }
html.kdh-next .kdh-mini:hover { background: var(--nx-card2); }
html.kdh-next .kdh-calm { color: var(--nx-green); }
html.kdh-next .kdh-hbar { background: var(--nx-line2); height: 7px; }
html.kdh-next .kdh-hbar span { background: var(--nx-blue); border-radius: 4px; }
html.kdh-next .kdh-sitecard { border-radius: 14px; }
html.kdh-next .kdh-sitecard:hover { background: var(--nx-card2); }
/* requests: card rows */
html.kdh-next .kdh-tlist { background: transparent; border: 0; border-radius: 0; overflow: visible; display: grid; gap: 8px; }
html.kdh-next .kdh-trow { background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: 16px; padding: 14px 16px; border-top: 1px solid var(--nx-line); transition: background .15s, border-color .15s, transform .15s; }
html.kdh-next .kdh-trow:first-child { border-top: 1px solid var(--nx-line); }
html.kdh-next .kdh-trow:hover { background: var(--nx-card2); border-color: color-mix(in srgb, var(--nx-ink) 18%, var(--nx-line)); }
html.kdh-next .kdh-trow strong { font-weight: 500; font-size: 14.5px; }
html.kdh-next .kdh-tid { font-family: var(--nx-mono); font-size: 12px; color: var(--nx-mut); }
html.kdh-next .kdh-dhead .kdh-filter button { padding: 6px 12px; }
/* a request: list on the left, the request on the right */
html.kdh-next .kdh-nx-split { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; align-items: start; max-width: 1400px; }
html.kdh-next .kdh-nx-tcol { position: sticky; top: 16px; max-height: calc(100dvh - 40px); overflow-y: auto; display: grid; gap: 6px; align-content: start; padding-right: 4px; }
html.kdh-next .kdh-nx-tcol-h { display: flex; align-items: center; justify-content: space-between; padding: 4px 4px 8px; font-size: 13.5px; }
html.kdh-next .kdh-nx-tcol-h a { display: inline-flex; align-items: center; gap: 6px; color: var(--nx-ink2) !important; text-decoration: none; font-weight: 500; }
html.kdh-next .kdh-nx-trow { display: grid; gap: 6px; padding: 12px 13px; border-radius: 14px; border: 1px solid var(--nx-line); background: var(--nx-card); text-decoration: none; color: var(--nx-ink) !important; }
html.kdh-next .kdh-nx-trow:hover { background: var(--nx-card2); }
html.kdh-next .kdh-nx-trow.kdh-on { background: var(--nx-card2); border-color: color-mix(in srgb, var(--nx-blue) 45%, var(--nx-line)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--nx-blue) 25%, transparent); }
html.kdh-next .kdh-nx-trow-top { display: flex; align-items: center; gap: 8px; }
html.kdh-next .kdh-nx-trow strong { font-weight: 500; font-size: 13.5px; line-height: 1.35; }
html.kdh-next .kdh-nx-split .kdh-dticket { max-width: none; }
html.kdh-next .kdh-back { color: var(--nx-mut) !important; text-decoration: none; }
html.kdh-next .kdh-nx-split .kdh-back { display: none; }
html.kdh-next .kdh-thead h1 { font-size: 34px; font-weight: 450; letter-spacing: -.025em; line-height: 1.1; }
html.kdh-next .kdh-tgrid { grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; }
html.kdh-next .kdh-msg { background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: 18px; }
html.kdh-next .kdh-msg-team { background: var(--nx-card2); }
html.kdh-next .kdh-msg-note, html.kdh-next .kdh-replybox-note { background: var(--nx-yellow-soft) !important; border-color: color-mix(in srgb, var(--nx-yellow-ink) 30%, transparent) !important; }
html.kdh-next .kdh-evt { color: var(--nx-mut); }
html.kdh-next .kdh-replybox { background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: 18px; }
html.kdh-next .kdh-tside-card { background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: var(--nx-r-card); }
html.kdh-next .kdh-kv dt { color: var(--nx-mut); }
html.kdh-next .kdh-timebox { border-color: var(--nx-line); }
html.kdh-next .kdh-tlog .kdh-fx { position: static; flex: none; margin-top: 2px; }
html.kdh-next .kdh-choice { background: var(--nx-card2); border-color: var(--nx-line); border-radius: 14px; }
html.kdh-next .kdh-choice[aria-checked="true"] { border-color: var(--nx-ink); box-shadow: 0 0 0 1px var(--nx-ink); background: var(--nx-card2); }
html.kdh-next .kdh-dform { background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: var(--nx-r-card); padding: 24px; }
/* Now: today's line + people + lanes */
html.kdh-next .kdh-nx-tl { padding: 0; overflow: hidden; }
html.kdh-next .kdh-nx-tl-head, html.kdh-next .kdh-nx-tl-row { display: grid; grid-template-columns: 220px minmax(0, 1fr); }
html.kdh-next .kdh-nx-tl-head { border-bottom: 1px solid var(--nx-line); color: var(--nx-mut); }
html.kdh-next .kdh-nx-tl-head > .kdh-nx-mono { padding: 14px 16px; border-right: 1px solid var(--nx-line); }
html.kdh-next .kdh-nx-tl-axis { position: relative; margin: 0 90px 0 16px; font-family: var(--nx-mono); font-size: 11px; }
html.kdh-next .kdh-nx-tl-axis > span { position: absolute; top: 14px; transform: translateX(-50%); white-space: nowrap; }
html.kdh-next .kdh-nx-now-t { position: absolute; top: 9px; transform: translateX(-50%); background: var(--nx-dark); color: var(--nx-dark-ink); border-radius: 6px; padding: 2px 6px; font-weight: 500; z-index: 2; }
html.kdh-next .kdh-nx-tl-row { min-height: 70px; border-bottom: 1px solid var(--nx-line); }
html.kdh-next .kdh-nx-tl-who { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-right: 1px solid var(--nx-line); min-width: 0; }
html.kdh-next .kdh-nx-tl-who strong { display: block; font-weight: 500; }
html.kdh-next .kdh-nx-tl-who small { color: var(--nx-mut); }
html.kdh-next .kdh-nx-tl-lane { position: relative; margin: 0 90px 0 16px; background: repeating-linear-gradient(90deg, transparent 0 calc(10% - 1px), var(--nx-line2) calc(10% - 1px) 10%); }
html.kdh-next .kdh-nx-now { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--nx-dark); z-index: 2; }
html.kdh-next .kdh-nx-blk { position: absolute; display: grid; max-width: 220px; min-width: 120px; padding: 5px 10px; border-radius: 10px; font-size: 12.5px; line-height: 1.25; text-decoration: none; color: var(--nx-ink) !important; background: var(--nx-line2); border: 1px solid var(--nx-line); z-index: 1; }
html.kdh-next .kdh-nx-blk span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.kdh-next .kdh-nx-blk small { color: var(--nx-mut); font-size: 10.5px; }
html.kdh-next .kdh-nx-blk:hover { z-index: 3; background: var(--nx-card2); }
html.kdh-next .kdh-nx-blk-due { background: var(--nx-card2); border-color: var(--nx-ink); }
html.kdh-next .kdh-nx-blk-late { background: var(--nx-pink-soft); border: 1px dashed var(--nx-pink); }
html.kdh-next .kdh-nx-blk-late small { color: var(--nx-pink); }
html.kdh-next .kdh-nx-blk-done { background: var(--nx-green-soft); border-color: transparent; }
html.kdh-next .kdh-nx-tl-empty .kdh-nx-tl-who .kdh-ic { color: var(--nx-green); }
html.kdh-next .kdh-nx-tl-note { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); background: var(--nx-card); padding: 0 6px; }
html.kdh-next .kdh-nx-tl-foot { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 16px; color: var(--nx-mut); }
html.kdh-next .kdh-person { padding: 20px; }
html.kdh-next .kdh-lane { background: var(--nx-card); border-color: var(--nx-line); border-radius: 20px; padding: 12px; }
html.kdh-next .kdh-lane h2 { font-weight: 500; }
html.kdh-next .kdh-lane-ic { border-radius: 9px; }
html.kdh-next .kdh-nc { background: var(--nx-card2); border-color: var(--nx-line); border-radius: 16px; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
html.kdh-next .kdh-nc:hover { border-color: color-mix(in srgb, var(--nx-ink) 20%, var(--nx-line)); }
html.kdh-next .kdh-nc-now { border-left: 1px solid var(--nx-line); box-shadow: inset 3px 0 0 var(--nx-blue); }
html.kdh-next .kdh-nempty2 { color: var(--nx-mut); border-color: var(--nx-line); border-radius: 14px; }
html.kdh-next .kdh-livedot { background: var(--nx-green); }
/* Hours and reports */
html.kdh-next .kdh-hbigs { gap: 16px; }
html.kdh-next .kdh-hbig { padding: 18px 20px; }
html.kdh-next .kdh-hbig dt { color: var(--nx-ink); font-weight: 500; font-size: 14px; }
html.kdh-next .kdh-hbig dd { font-size: 46px; font-weight: 350; letter-spacing: -.045em; line-height: 1.1; }
html.kdh-next .kdh-hbig-warn dd { color: var(--nx-orange-ink); } html.kdh-next .kdh-hbig-bad dd { color: var(--nx-pink); } html.kdh-next .kdh-hbig-free dd { color: var(--nx-green); }
html.kdh-next .kdh-month { font-weight: 500; }
html.kdh-next .kdh-nx-months header { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
html.kdh-next .kdh-nx-months header .kdh-nx-legend { margin-left: auto; }
html.kdh-next .kdh-nx-mrow { display: grid; grid-template-columns: 150px minmax(0, 1fr) 120px 80px; gap: 14px; align-items: center; padding: 10px 8px; margin: 0 -8px; border-radius: 12px; border-top: 1px solid var(--nx-line2); text-decoration: none; color: var(--nx-ink) !important; font-size: 13.5px; }
html.kdh-next .kdh-nx-mrow:hover { background: var(--nx-card2); }
html.kdh-next .kdh-nx-mrow.kdh-on { background: var(--nx-blue-soft); }
html.kdh-next .kdh-nx-mbars { display: grid; gap: 4px; }
html.kdh-next .kdh-nx-mline { display: flex; gap: 2px; height: 9px; }
html.kdh-next .kdh-nx-mline:empty { background: transparent; }
html.kdh-next .kdh-nx-mnum { text-align: right; display: grid; }
html.kdh-next .kdh-nx-mnum small { color: var(--nx-green); font-size: 12px; }
html.kdh-next .kdh-nx-mbal { text-align: right; color: var(--nx-green); font-weight: 500; }
html.kdh-next .kdh-nx-mbal.kdh-nx-neg { color: var(--nx-pink); }
html.kdh-next .kdh-rpage { background: var(--nx-card2); border: 1px solid var(--nx-line); border-radius: var(--nx-r-card); }
@media print { html.kdh-next .kdh-nx-side, html.kdh-next .kdh-nx-shell > .kdh-nx-body > .kdh-foot { display: none !important; } html.kdh-next .kdh-nx-shell { display: block; margin: 0; box-shadow: none; } html.kdh-next body.kdh-body { background: #fff; } }
/* start page (client home) */
html.kdh-next .kst-hello, html.kdh-next .kst-wx, html.kdh-next .kst-site, html.kdh-next .kst-tip, html.kdh-next .kst-strip { border-radius: var(--nx-r-card); border-color: var(--nx-line); }
html.kdh-next .kst-hello { background: var(--nx-card); }
html.kdh-next .kst-hello h1 { font-size: 44px; font-weight: 450; letter-spacing: -.025em; }
html.kdh-next .kst-site { background: var(--nx-card); }
html.kdh-next .kst-search input { border-radius: 14px !important; }

/* ---------- Outreach ---------- */
html.kdh-next .kor-sub { display: flex; gap: 22px; border-bottom: 1px solid var(--nx-line); margin-bottom: 16px; overflow-x: auto; }
html.kdh-next .kor-sub a { padding: 0 0 12px; color: var(--nx-ink2) !important; font-weight: 500; text-decoration: none; display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; border: 0; background: none; border-radius: 0; }
html.kdh-next .kor-sub a[aria-current="page"] { color: var(--nx-ink) !important; box-shadow: inset 0 -2px 0 var(--nx-ink); background: none; }
html.kdh-next .kor-frame { border-radius: 18px; border: 1px solid var(--nx-line); }
html.kdh-next .kor-board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 14px; overflow-x: auto; padding-bottom: 8px; align-items: start; }
html.kdh-next .kor-col { background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: 20px; padding: 10px; min-height: 420px; transition: background .15s, border-color .15s; }
html.kdh-next .kor-col.kor-over { background: var(--nx-blue-soft); border-color: color-mix(in srgb, var(--nx-blue) 40%, var(--nx-line)); }
html.kdh-next .kor-col header { display: flex; align-items: center; gap: 8px; padding: 6px 6px 10px; font-weight: 500; }
html.kdh-next .kor-d { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex: none; }
html.kdh-next .kor-d.kor-faint { background: var(--nx-faint); } html.kdh-next .kor-d.kor-blue { background: var(--nx-blue); } html.kdh-next .kor-d.kor-orange { background: var(--nx-orange); }
html.kdh-next .kor-d.kor-green { background: var(--nx-green); } html.kdh-next .kor-d.kor-pink { background: var(--nx-pink); } html.kdh-next .kor-d.kor-grey { background: var(--nx-grey); } html.kdh-next .kor-d.kor-ink { background: var(--nx-ink2); }
html.kdh-next .kor-n { color: var(--nx-mut); font-weight: 400; }
html.kdh-next .kor-col-b { display: grid; gap: 8px; }
html.kdh-next .kor-empty { display: grid; place-items: center; height: 60px; border: 1px dashed var(--nx-line); border-radius: 12px; color: var(--nx-mut); font-size: 12.5px; }
html.kdh-next .kor-kc { background: var(--nx-card2); border: 1px solid var(--nx-line); border-radius: 16px; padding: 12px 13px; cursor: grab; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); transition: background .15s, border-color .15s, box-shadow .15s, transform .15s, opacity .15s; }
html.kdh-next .kor-kc:hover { border-color: color-mix(in srgb, var(--nx-ink) 20%, var(--nx-line)); }
html.kdh-next .kor-kc:active { cursor: grabbing; }
html.kdh-next .kor-kc.kor-drag { opacity: .4; }
html.kdh-next .kor-kc-tg { display: flex; gap: 5px; align-items: center; margin-bottom: 8px; }
html.kdh-next .kor-kc-tg span { font-size: 11px; font-weight: 600; padding: 2px 7px; border-radius: 6px; }
html.kdh-next .kor-tg-pl, html.kdh-next .kor-tg-jb { background: var(--nx-blue-soft); color: var(--nx-blue-ink); }
html.kdh-next .kor-tg-gm, html.kdh-next .kor-tg-tn { background: var(--nx-orange-soft); color: var(--nx-orange-ink); }
html.kdh-next .kor-tg-as, html.kdh-next .kor-tg-po { background: var(--nx-green-soft); color: var(--nx-green); }
html.kdh-next .kor-tg-k { background: var(--nx-line2); color: var(--nx-ink2); }
html.kdh-next .kor-kc-mv { margin-left: auto; border: 0; background: none; color: var(--nx-mut); border-radius: 8px; width: 26px; height: 26px; display: grid; place-items: center; cursor: pointer; padding: 0; }
html.kdh-next .kor-kc-mv:hover { background: var(--nx-line2); color: var(--nx-ink); }
html.kdh-next .kor-kc b { display: block; font-weight: 500; line-height: 1.3; }
html.kdh-next .kor-kc small { display: block; color: var(--nx-mut); font-size: 12px; margin-top: 2px; }
html.kdh-next .kor-kc p { margin: 6px 0 8px !important; font-size: 12.5px; color: var(--nx-ink2); line-height: 1.45; }
html.kdh-next .kor-kc-ft { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 12px; color: var(--nx-mut); }
html.kdh-next .kor-kc-ft a, html.kdh-next .kor-kc-ft span { display: inline-flex; align-items: center; gap: 4px; color: var(--nx-mut) !important; text-decoration: none; min-width: 0; }
html.kdh-next .kor-kc-ft a:hover { color: var(--nx-ink) !important; }
html.kdh-next .kor-kc-ft .kor-kc-r { margin-left: auto; }
html.kdh-next .kor-kc-ft .kor-late { color: var(--nx-pink) !important; }
html.kdh-next .kor-more { padding: 6px; font-size: 12.5px; }
html.kdh-next .kor-qi, html.kdh-next .kor-cv { border-radius: 16px; border-color: var(--nx-line); background: var(--nx-card2); }

/* ---------- toast, modal, success (motion.js) ---------- */
.kdh-nx-toast { position: fixed; left: 50%; bottom: 26px; transform: translate(-50%, 20px); opacity: 0; z-index: 200; display: flex; align-items: center; gap: 10px; background: #18181a; color: #fff; border-radius: 16px; padding: 8px 8px 8px 14px; font: 450 13.5px/1.35 var(--nx-font, system-ui); box-shadow: 0 18px 40px -16px rgba(0, 0, 0, .6); transition: opacity .28s cubic-bezier(.2, .7, .2, 1), transform .28s cubic-bezier(.2, .7, .2, 1); max-width: calc(100% - 32px); }
.kdh-nx-toast.kdh-on { opacity: 1; transform: translate(-50%, 0); }
.kdh-nx-toast-ok { width: 20px; height: 20px; border-radius: 50%; background: #2fbf63; display: grid; place-items: center; flex: none; color: #fff; font-weight: 700; font-size: 12px; }
.kdh-nx-toast-err .kdh-nx-toast-ok { background: #f0578f; }
.kdh-nx-toast-msg { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.kdh-nx-toast-act { border: 0; background: #fff; color: #18181a; border-radius: 10px; padding: 6px 11px; font: 500 13px var(--nx-font, system-ui); cursor: pointer; flex: none; }
.kdh-nx-toast-act[disabled] { opacity: .5; }
.kdh-nx-toast-x { border: 0; background: transparent; color: #aaa; padding: 6px; cursor: pointer; display: grid; place-items: center; flex: none; }
html[data-theme="dark"] .kdh-nx-toast { background: #2a2b2f; border: 1px solid #3a3c41; }
.kdh-nx-modal-bg { position: fixed; inset: 0; z-index: 150; background: rgba(10, 10, 12, .5); backdrop-filter: blur(2px); display: grid; place-items: center; padding: 16px; animation: kdh-nx-dim .2s ease both; }
.kdh-nx-modal { position: relative; width: min(620px, 100%); max-height: calc(100vh - 32px); overflow-y: auto; background: var(--nx-card2, #fff); color: var(--nx-ink, #141414); border: 1px solid var(--nx-line, #e5e5e2); border-radius: 22px; padding: 24px; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .6); animation: kdh-nx-mbox .3s cubic-bezier(.2, .7, .2, 1) both; font-family: var(--nx-font, system-ui); }
.kdh-nx-modal > * { animation: kdh-nx-fu .3s cubic-bezier(.2, .7, .2, 1) both; }
.kdh-nx-modal > :nth-child(1) { animation-delay: .08s; } .kdh-nx-modal > :nth-child(2) { animation-delay: .12s; } .kdh-nx-modal > :nth-child(3) { animation-delay: .16s; }
.kdh-nx-modal > :nth-child(4) { animation-delay: .2s; } .kdh-nx-modal > :nth-child(5) { animation-delay: .24s; } .kdh-nx-modal > :nth-child(n+6) { animation-delay: .28s; }
.kdh-nx-modal-bg.kdh-closing { animation: kdh-nx-undim .15s ease both; }
.kdh-nx-modal-bg.kdh-closing .kdh-nx-modal { animation: kdh-nx-mout .15s ease both; }
.kdh-nx-modal-h { display: flex; gap: 14px; align-items: flex-start; }
.kdh-nx-modal-h h2 { font-size: 21px; font-weight: 500; letter-spacing: -.015em; margin: 0; }
.kdh-nx-modal-h p { margin: 2px 0 0; color: var(--nx-mut, #8b8e94); }
.kdh-nx-modal-h .kdh-nx-icbox { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: var(--nx-card, #f8f8f7); border: 1px solid var(--nx-line, #e5e5e2); flex: none; }
.kdh-nx-modal-x { margin-left: auto; border: 0; background: none; color: var(--nx-mut, #8b8e94); cursor: pointer; padding: 4px; border-radius: 8px; }
.kdh-nx-modal-x:hover { background: var(--nx-line2, #ececea); color: var(--nx-ink, #141414); }
.kdh-nx-mlabel { font-size: 13.5px; color: var(--nx-ink2, #55585e); margin: 18px 0 8px !important; }
.kdh-nx-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.kdh-nx-quote { margin: 0; background: var(--nx-shell, #f2f2f0); border: 1px solid var(--nx-line, #e5e5e2); border-radius: 14px; padding: 14px 16px; font-size: 14.5px; line-height: 1.55; white-space: pre-wrap; }
.kdh-nx-quote small { display: block; margin-top: 8px; color: var(--nx-mut, #8b8e94); font-size: 12.5px; }
.kdh-nx-mlist { list-style: none; margin: 18px 0 0; padding: 14px 0; border-top: 1px solid var(--nx-line2, #ececea); border-bottom: 1px solid var(--nx-line2, #ececea); display: grid; gap: 10px; }
.kdh-nx-mlist li { display: flex; gap: 12px; align-items: flex-start; font-size: 13.5px; color: var(--nx-ink2, #55585e); }
.kdh-nx-mlist li .kdh-icw { color: var(--nx-blue, #2f5fe8); margin-top: 1px; }
.kdh-nx-mlist strong { color: var(--nx-ink, #141414); font-weight: 500; }
.kdh-nx-mfoot { display: flex; align-items: center; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
.kdh-nx-mfoot .kdh-muted { font-size: 12.5px; }
.kdh-nx-mfoot .kdh-sp { flex: 1; }
.kdh-nx-succ-ic { margin: 4px auto 10px; width: 52px; height: 52px; border-radius: 16px; background: var(--nx-blue, #2f5fe8); color: #fff; display: grid; place-items: center; }
.kdh-nx-succ-t { font-size: 22px; font-weight: 500; letter-spacing: -.015em; text-align: center; }
.kdh-nx-succ-s { margin-top: 4px; text-align: center; }
.kdh-nx-succ { list-style: none; margin: 16px 0; padding: 10px 16px; background: var(--nx-shell, #f2f2f0); border-radius: 14px; }
.kdh-nx-succ li { display: flex; gap: 10px; align-items: center; padding: 7px 0; font-size: 14px; opacity: .35; transition: opacity .2s; }
.kdh-nx-succ li.kdh-ok { opacity: 1; }
.kdh-nx-succ li .kdh-c { width: 20px; height: 20px; border-radius: 50%; background: var(--nx-line2, #ececea); display: grid; place-items: center; flex: none; color: transparent; padding: 0; border: 0; }
.kdh-nx-succ li.kdh-ok .kdh-c { background: var(--nx-blue, #2f5fe8); color: #fff; animation: kdh-nx-pop .3s cubic-bezier(.2, .7, .2, 1) both; }
.kdh-nx-succ-acts { display: flex; gap: 8px; }
.kdh-nx-succ-acts .kdh-btn-main { flex: 1; }

/* ---------- motion ---------- */
html.kdh-next .kdh-cas { opacity: 0; transform: translateY(7px); }
html.kdh-next .kdh-cas.kdh-cas-in { opacity: 1; transform: none; transition: opacity .4s var(--nx-ease), transform .4s var(--nx-ease); }
html.kdh-next .kdh-leaving { opacity: 0 !important; transition: opacity .15s ease !important; }
@keyframes kdh-nx-fu { from { opacity: 0; transform: translateY(6px); } }
@keyframes kdh-nx-gx { from { transform: scaleX(0); } }
@keyframes kdh-nx-pop { from { opacity: 0; transform: scale(.6); } }
@keyframes kdh-nx-dim { from { background: rgba(10, 10, 12, 0); backdrop-filter: blur(0); } }
@keyframes kdh-nx-undim { to { background: rgba(10, 10, 12, 0); backdrop-filter: blur(0); } }
@keyframes kdh-nx-mbox { from { opacity: .4; transform: scale(.96); } }
@keyframes kdh-nx-mout { to { opacity: 0; transform: scale(.98); } }
@keyframes kdh-nx-blink { 50% { opacity: .35; } }
@keyframes kdh-nx-glow { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--nx-blue) 55%, transparent); } 100% { box-shadow: 0 0 0 14px transparent; } }
html.kdh-next .kdh-nx-nav, html.kdh-next .kdh-trow, html.kdh-next .kdh-nc, html.kdh-next .kdh-c, html.kdh-next .kor-kc { will-change: auto; }

/* ---------- wp-admin (Home, Review, Desk back-end pages) ---------- */
body.kdh-next-admin #wpcontent, body.kdh-next-admin #wpbody-content { background: var(--nx-shell); }
body.kdh-next-admin .kdh { font-family: var(--nx-font); font-feature-settings: "cv11", "ss01", "tnum"; color: var(--nx-ink); }
body.kdh-next-admin .kdh-admin { max-width: 1320px; }
body.kdh-next-admin .kdh h1, body.kdh-next-admin .kdh-ahome-h { font-size: 44px !important; font-weight: 450 !important; letter-spacing: -.025em; line-height: 1.05 !important; }
body.kdh-next-admin .kdh-h1 { font-size: 40px !important; font-weight: 450 !important; }
body.kdh-next-admin .kdh h3, body.kdh-next-admin .kdh h4 { font-weight: 500; letter-spacing: -.01em; }
body.kdh-next-admin .kdh-panel, body.kdh-next-admin .kdh-hero-panel { background: var(--nx-card); border: 1px solid var(--nx-line); border-radius: var(--nx-r-card); box-shadow: var(--nx-shadow); padding: 22px 24px; }
body.kdh-next-admin .kdh-tabs { border-bottom-color: var(--nx-line); gap: 22px; }
body.kdh-next-admin .kdh-tabs a { padding: 0 0 12px; color: var(--nx-ink2) !important; border-bottom-width: 2px; }
body.kdh-next-admin .kdh-tabs a[aria-current="page"] { color: var(--nx-ink) !important; border-bottom-color: var(--nx-ink); }
body.kdh-next-admin .kdh-btn { min-height: 38px; border-radius: var(--nx-r); background: var(--nx-card2); border: 1px solid var(--nx-line); color: var(--nx-ink) !important; font-weight: 500; }
body.kdh-next-admin .kdh-btn .kdh-ic { color: currentColor; }
body.kdh-next-admin .kdh-btn-main { background: var(--nx-dark); color: #fff !important; border-color: transparent; box-shadow: 0 8px 18px -10px rgba(0, 0, 0, .7); }
body.kdh-next-admin .kdh-btn-sm { min-height: 32px; border-radius: 10px; }
body.kdh-next-admin .kdh-kpis { gap: 16px; }
body.kdh-next-admin .kdh-kpi { background: var(--nx-card2); border: 1px solid var(--nx-line); border-radius: 18px; padding: 16px 18px; border-left-width: 1px; }
body.kdh-next-admin .kdh-kpi strong { font-size: 44px; font-weight: 350; letter-spacing: -.045em; line-height: 1.05; }
body.kdh-next-admin .kdh-kpi-l { color: var(--nx-ink); font-weight: 500; font-size: 14px; }
body.kdh-next-admin .kdh-kpi-bad strong { color: var(--nx-pink); } body.kdh-next-admin .kdh-kpi-warn strong { color: var(--nx-orange-ink); }
body.kdh-next-admin .kdh-table th { color: var(--nx-mut); font-weight: 450; }
body.kdh-next-admin .kdh-table td { border-top-color: var(--nx-line2); }
body.kdh-next-admin .kdh-chip { border-radius: 13px; font-weight: 500; }
body.kdh-next-admin .kdh-sla-late { background: var(--nx-pink-soft); color: var(--nx-pink); }
body.kdh-next-admin .kdh-sla-soon { background: var(--nx-orange-soft); color: var(--nx-orange-ink); }
body.kdh-next-admin .kdh-hbar span { background: var(--nx-blue); }
body.kdh-next-admin .kdh-timeline li::before { background: var(--nx-card2); }
body.kdh-next-admin .kdh-field input, body.kdh-next-admin .kdh-field textarea, body.kdh-next-admin .kdh-field select { border-radius: 10px; border-color: var(--nx-line); }
body.kdh-next-admin .kdh-flash { background: var(--nx-blue-soft); border-left: 0; border-radius: 12px; }
body.kdh-next-admin .kdh-top { padding-bottom: 22px; }
body.kdh-next-admin .kdh-ahome-sec + .kdh-ahome-sec, body.kdh-next-admin .kdh-panel + .kdh-panel { margin-top: 16px; }

/* the old desk dark theme (hub.css) paints buttons and segments with --paper: keep the new look's colours */
html.kdh-next[data-theme="dark"] .kdh-screen-desk .kdh-btn.kdh-nx-dark { background: var(--nx-primary); color: var(--nx-on-primary) !important; border-color: transparent; }
html.kdh-next[data-theme="dark"] .kdh-screen-desk .kdh-btn.kdh-nx-soft { background: var(--nx-blue-soft); color: var(--nx-blue-ink) !important; border-color: color-mix(in srgb, var(--nx-blue) 25%, transparent); }
html.kdh-next[data-theme="dark"] .kdh-screen-desk .kdh-seg button, html.kdh-next[data-theme="dark"] .kdh-screen-desk .kdh-filter button { background: transparent; color: var(--nx-ink2); }
html.kdh-next[data-theme="dark"] .kdh-screen-desk .kdh-seg button[aria-pressed="true"], html.kdh-next[data-theme="dark"] .kdh-screen-desk .kdh-filter button[aria-pressed="true"] { background: var(--nx-card2); color: var(--nx-ink); }
html.kdh-next[data-theme="dark"] .kdh-screen-desk .kdh-card2 > header a { color: var(--nx-mut); }

/* ---------- smaller screens ---------- */
@media (max-width: 1240px) {
	html.kdh-next .kdh-nx-work, html.kdh-next .kdh-nx-extra { grid-template-columns: minmax(0, 3fr) minmax(280px, 2fr); }
	html.kdh-next .kdh-nx-g2, html.kdh-next .kdh-nx-g3 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1100px) {
	html.kdh-next .kdh-nx-split { grid-template-columns: minmax(0, 1fr); }
	html.kdh-next .kdh-nx-tcol { display: none; }
	html.kdh-next .kdh-nx-split .kdh-back { display: inline-flex; }
	html.kdh-next .kdh-nx-main { --rail: 230px; }
}
@media (max-width: 900px) {
	/* the sidebar becomes a top bar with icons */
	html.kdh-next .kdh-nx-shell, html.kdh-next .kdh-desk.kdh-nx-shell { display: block; margin: 0; border-radius: 0; }
	html.kdh-next .kdh-nx-side { position: sticky; top: 0; height: auto; flex-direction: row; align-items: center; gap: 6px; padding: 8px 10px; border-right: 0; border-bottom: 1px solid var(--nx-line); overflow-x: auto; }
	html.kdh-next .kdh-nx-side .kdh-sp, html.kdh-next .kdh-nx-railbtn, html.kdh-next .kdh-nx-navh, html.kdh-next .kdh-nx-sep { display: none; }
	html.kdh-next .kdh-nx-ws { margin: 0; padding: 2px; border: 0; background: none; }
	html.kdh-next .kdh-nx-ws-t, html.kdh-next .kdh-nx-lbl, html.kdh-next .kdh-nx-ext { display: none; }
	html.kdh-next .kdh-nx-navs { flex-direction: row; overflow: visible; margin: 0; padding: 0; gap: 2px; }
	html.kdh-next .kdh-nx-nav { width: auto; padding: 9px; gap: 0; }
	html.kdh-next .kdh-nx-ct { position: absolute; top: 2px; right: 2px; min-width: 8px; width: 8px; height: 8px; padding: 0; font-size: 0; background: var(--nx-orange); border-radius: 50%; }
	html.kdh-next .kdh-nx-ct.kdh-nx-hot, html.kdh-next .kdh-bell .kdh-count { min-width: 8px; height: 8px; padding: 0; font-size: 0; }
	html.kdh-next .kdh-nx-new { width: 38px; min-height: 38px; padding: 0; margin: 0 0 0 auto; flex: none; }
	html.kdh-next .kdh-nx-theme { margin: 0; flex: none; }
	html.kdh-next .kdh-nx-theme button { padding: 6px; }
	html.kdh-next .kdh-nx-me { border-top: 0; padding: 0; flex: none; }
	html.kdh-next .kdh-nx-main { display: block; }
	html.kdh-next .kdh-nx-main .kdh-rail { display: none; }
	html.kdh-next .kdh-nx-stage, html.kdh-next .kdh-board, html.kdh-next .kdh-nx-shell .kdh-dmain { padding: 16px; }
	html.kdh-next .kdh-nx-tb .kdh-pagesel { display: block; flex: 1 1 100%; }
	html.kdh-next .kdh-nx-tb .kdh-nx-pchip { display: none; }
	html.kdh-next .kdh-nx-upd { margin-left: 0; flex-basis: 100%; }
	html.kdh-next .kdh-nx-h1, html.kdh-next .kdh-dhead h1, html.kdh-next .kdh-board-head h1 { font-size: 32px !important; }
	html.kdh-next .kdh-nx-work, html.kdh-next .kdh-nx-extra { grid-template-columns: minmax(0, 1fr); }
	html.kdh-next .kdh-nx-work .kdh-viewer { height: 72dvh; min-height: 360px; }
	html.kdh-next .kdh-nx-work .kdh-pane { position: static; max-height: none; }
	html.kdh-next .kdh-no-pane .kdh-pane { display: flex; }
	html.kdh-next .kdh-tgrid { grid-template-columns: minmax(0, 1fr); }
	html.kdh-next .kdh-nx-tl-head, html.kdh-next .kdh-nx-tl-row { grid-template-columns: 120px minmax(0, 1fr); }
	html.kdh-next .kdh-nx-tl-who small { display: none; }
	html.kdh-next .kdh-nx-tl-lane, html.kdh-next .kdh-nx-tl-axis { margin-right: 16px; }
	html.kdh-next .kdh-nx-tl-axis > span:nth-child(even) { display: none; }
	html.kdh-next .kdh-nx-mrow { grid-template-columns: 90px minmax(0, 1fr) 70px; }
	html.kdh-next .kdh-nx-mbal { display: none; }
	html.kdh-next .kdh-nx-shell > .kdh-nx-body > .kdh-foot { padding: 16px; }
	html.kdh-next .kdh-trow { grid-template-columns: 44px 30px minmax(0, 1fr); }
	html.kdh-next .kdh-trow .kdh-tside { grid-column: 1 / -1; justify-content: flex-start; }
}
@media (max-width: 560px) {
	html.kdh-next .kdh-nx-theme { display: none; }
	html.kdh-next .kdh-nx-big, html.kdh-next .kdh-kpi strong, html.kdh-next .kdh-hbig dd { font-size: 36px; }
	html.kdh-next .kdh-nx-card { padding: 18px; }
	html.kdh-next .kdh-nx-noticed header { margin: 0 -18px 16px; padding-left: 18px; padding-right: 18px; }
	html.kdh-next .kdh-nx-pgrow { grid-template-columns: 90px 1fr 56px; }
	html.kdh-next .kor-board { grid-auto-columns: 82%; }
	.kdh-nx-toast { bottom: 16px; }
}

/* ---------- reduced motion: everything visible at once, no movement ---------- */
@media (prefers-reduced-motion: reduce) {
	html.kdh-next .kdh-cas { opacity: 1; transform: none; }
	html.kdh-next *, html.kdh-next *::before, html.kdh-next *::after, .kdh-nx-toast, .kdh-nx-modal, .kdh-nx-modal-bg, .kdh-nx-modal > * { animation: none !important; transition: none !important; }
}