/* refined.css: the site's visual system. Loaded last, after premium-styles
   and cutting-edge, and written to beat Tailwind utilities on specificity
   (every override carries a `body` ancestor) because the Play CDN appends its
   generated sheet to <head> at runtime, after this file.

   Tokens: graphite ground, warm off-white ink, one signal colour used small.
   Structure is hairlines, not cards with glow. Motion only on hover. */

:root {
    --ki-bg: #15171b;
    --ki-surface: #1c1f24;
    --ki-surface-2: #22262c;
    --ki-line: rgba(236, 235, 230, 0.10);
    --ki-line-strong: rgba(236, 235, 230, 0.20);
    --ki-ink: #ecebe6;
    --ki-body: #b9b8b1;
    --ki-muted: #7e7e77;
    --ki-signal: #10b981;
    --ki-signal-deep: #0e8f66;
    --ki-display: 'Bricolage Grotesque', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ki-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
}

html { background: var(--ki-bg); }
body {
    background: var(--ki-bg);
    color: var(--ki-body);
    font-family: var(--ki-display);
    font-feature-settings: "tnum" 1;
    -webkit-font-smoothing: antialiased;
}
body h1, body h2, body h3, body h4 {
    font-family: var(--ki-display);
    font-weight: 500;
    color: var(--ki-ink);
    letter-spacing: -0.01em;
}
body a { color: var(--ki-ink); }
body a:hover { color: #ffffff; }
body :focus-visible { outline: 2px solid var(--ki-signal); outline-offset: 2px; }

/* ------------------------------------------------------------ chrome */
body .page-header { background: var(--ki-bg); border-bottom: 1px solid var(--ki-line); }
body .nav-bar { background: var(--ki-bg); border-bottom: 1px solid var(--ki-line); }
body .tab-button, body .nav-contact-btn {
    font-family: var(--ki-display);
    font-size: 14px;
    font-weight: 500;
    color: var(--ki-muted);
    border-radius: 0;
    padding: 12px 12px;
}
body .tab-button:hover:not(.active), body .nav-contact-btn:hover { color: var(--ki-ink); background: transparent; }
body .tab-button.active {
    color: var(--ki-ink);
    background: transparent;
    font-weight: 500;
    box-shadow: inset 0 -2px 0 var(--ki-signal);
}
body #workflowDropdownMenu, body #businessDropdownMenu, body #toolsDropdownMenu, body #mobileNavMenu {
    background: var(--ki-surface);
    border: 1px solid var(--ki-line-strong);
    border-radius: 4px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}
body #workflowDropdownMenu a, body #businessDropdownMenu a, body #toolsDropdownMenu a { color: var(--ki-body); }
body #workflowDropdownMenu a:hover, body #businessDropdownMenu a:hover, body #toolsDropdownMenu a:hover { color: var(--ki-ink); background: var(--ki-surface-2); }

body #headerSignUp, body #headerSignIn, body #headerSignOut {
    font-family: var(--ki-display);
    font-size: 14px;
    font-weight: 500;
    border-radius: 4px;
    padding: 8px 14px;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}
body #headerSignUp { background: var(--ki-ink) !important; color: var(--ki-bg) !important; border: 1px solid var(--ki-ink); }
body #headerSignUp:hover { background: #ffffff !important; border-color: #ffffff; }
body #headerSignIn { background: transparent; color: var(--ki-body); border: 1px solid var(--ki-line-strong); }
body #headerSignIn:hover { color: var(--ki-ink); border-color: var(--ki-ink); }
body #headerSignOut { color: var(--ki-body); border: 1px solid var(--ki-line-strong); background: transparent; }
body #headerSignOut:hover { color: var(--ki-ink); border-color: var(--ki-ink); }
body #headerUserName { color: var(--ki-muted); }
body .page-header a[href^="mailto:"] { color: var(--ki-muted) !important; font-weight: 500; }
body .page-header a[href^="mailto:"]:hover { color: var(--ki-ink) !important; }

/* ------------------------------------------------- effects, retired */
body .glass-card, body .card-3d, body .neuro-card {
    background: var(--ki-surface) !important;
    border: 1px solid var(--ki-line) !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transform: none !important;
    transition: border-color 0.15s !important;
}
body .glass-card:hover { border-color: var(--ki-line-strong) !important; transform: none !important; box-shadow: none !important; }
body .holographic-border { background: none !important; padding: 0 !important; border-radius: 0 !important; animation: none !important; }
body .holographic-border::before, body .holographic-border::after { display: none !important; }
body .holographic-border-inner { background: transparent !important; border-radius: 0 !important; padding: 32px !important; }
body .neon-box { box-shadow: none !important; animation: none !important; }
body .hover-scale:hover, body .card-3d-tilt, body .card-3d-tilt:hover { transform: none !important; }
body .reveal, body .reveal-left, body .reveal-right { opacity: 1 !important; transform: none !important; transition: none !important; }
body .icon-circle { display: none !important; }
body [class*="bg-gradient-to"] { background-image: none !important; }
body .btn-accent { background: var(--ki-ink) !important; color: var(--ki-bg) !important; box-shadow: none !important; }
body .shadow-lg, body .shadow-xl, body .shadow-2xl { box-shadow: none !important; }

/* --------------------------------------------- shared type overrides */
body .text-gray-900, body .text-gray-800 { color: var(--ki-ink) !important; }
body .text-gray-700, body .text-gray-600, body .text-gray-300 { color: var(--ki-body) !important; }
body .text-gray-500, body .text-gray-400 { color: var(--ki-muted) !important; }
body .text-emerald-600, body .text-emerald-400, body .text-emerald-300 { color: var(--ki-signal) !important; }
body .bg-gray-900, body .bg-gray-800, body .bg-gray-800\/50, body .bg-gray-800\/60 { background-color: var(--ki-surface) !important; }
body .border-gray-700, body .border-gray-600, body .border-gray-200 { border-color: var(--ki-line) !important; }
body .rounded-xl, body .rounded-2xl, body .rounded-lg { border-radius: 4px !important; }
body .bg-emerald-500 { background-color: var(--ki-signal) !important; }
body .hover\:bg-emerald-600:hover, body .hover\:bg-emerald-400:hover { background-color: var(--ki-signal-deep) !important; }
body .bg-emerald-50, body .bg-blue-50, body .bg-purple-50, body .bg-emerald-600\/20, body .bg-blue-600\/20 {
    background-color: transparent !important;
    border: 1px solid var(--ki-line-strong);
}
body .text-emerald-700, body .text-blue-700, body .text-purple-700, body .text-blue-300 { color: var(--ki-body) !important; }

/* ---------------------------------------------------------- About */
body #tab7 .rounded-full.text-xs {
    border-radius: 2px !important;
    font-weight: 500;
    letter-spacing: 0.01em;
    padding: 5px 10px;
}
body #tab7 .w-48.h-48 {
    border: 1px solid var(--ki-line-strong) !important;
    box-shadow: none !important;
    background: var(--ki-surface) !important;
}
body #tab7 .text-white { color: var(--ki-ink) !important; }
body #tab7 .text-white\/90 { color: var(--ki-body) !important; }
body #tab7 .bg-white { background: var(--ki-ink) !important; color: var(--ki-bg) !important; }
body #tab7 .btn-accent, body #tab7 .btn-accent.text-white { color: var(--ki-bg) !important; }
body #tab7 p, body #tab7 li { font-size: 15.5px; line-height: 1.6; }
body #tab7 .space-y-3 > p { font-family: var(--ki-serif); font-size: 17px; line-height: 1.6; }
body #tab7 .space-y-3 > p strong { font-family: var(--ki-display); font-weight: 500; color: var(--ki-ink); }
body .ki-bullet {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 1px;
    background: var(--ki-signal);
    margin: 10px 12px 0 0;
    flex: none;
}
body .ki-cta-band {
    background: var(--ki-surface);
    border: 1px solid var(--ki-line);
    border-radius: 4px;
    padding: 56px 32px;
}

/* --------------------------------------------------------- footer */
body .site-footer { background: var(--ki-bg); border-top: 1px solid var(--ki-line); }
body .site-footer .h-1.w-32 { display: none; }
body .site-footer .hover\:border-emerald-500\/50:hover { border-color: var(--ki-line-strong) !important; }

/* ---------------------------------------------------- chat launcher */
body #chatbot-toggle {
    width: auto !important;
    height: 44px !important;
    padding: 0 16px !important;
    border-radius: 4px !important;
    background: var(--ki-surface) !important;
    border: 1px solid var(--ki-line-strong) !important;
    color: var(--ki-ink) !important;
    font-family: var(--ki-display);
    font-size: 14px;
    font-weight: 500;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4) !important;
    animation: none !important;
    transform: none !important;
}
body #chatbot-toggle:hover { border-color: var(--ki-ink) !important; transform: none !important; }

/* --------------------------------------------------- homepage system */
.ki-wrap { max-width: 1120px; margin: 0 auto; padding: 0 24px; }

.ki-hero {
    padding: 96px 0 72px;
    display: grid;
    grid-template-columns: 7fr 5fr;
    gap: 64px;
    align-items: start;
}
.ki-hero h1 {
    font-size: clamp(40px, 5.4vw, 70px);
    line-height: 1.02;
    letter-spacing: -0.028em;
    font-weight: 500;
    margin: 0 0 24px;
    max-width: 13ch;
}
.ki-dek {
    font-family: var(--ki-serif);
    font-size: 19px;
    line-height: 1.55;
    color: var(--ki-body);
    max-width: 44ch;
    margin: 0 0 32px;
}
.ki-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.ki-btn {
    display: inline-flex;
    align-items: center;
    padding: 12px 20px;
    border-radius: 4px;
    font-family: var(--ki-display);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    border: 1px solid transparent;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.ki-btn-primary { background: var(--ki-ink); color: var(--ki-bg); border-color: var(--ki-ink); }
.ki-btn-primary:hover { background: #ffffff; border-color: #ffffff; color: var(--ki-bg); }
.ki-btn-secondary { background: transparent; color: var(--ki-ink); border-color: var(--ki-line-strong); }
.ki-btn-secondary:hover { border-color: var(--ki-ink); color: var(--ki-ink); }

.ki-spec {
    border: 1px solid var(--ki-line-strong);
    border-radius: 4px;
    background: var(--ki-surface);
    padding: 4px 24px 8px;
    margin-top: 8px;
}
.ki-spec-title {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 14px 0 12px;
    border-bottom: 1px solid var(--ki-line-strong);
    font-size: 13px;
    color: var(--ki-ink);
    font-weight: 500;
}
.ki-spec-title span { color: var(--ki-muted); font-weight: 400; font-variant-numeric: tabular-nums; }
.ki-spec dl { margin: 0; }
.ki-spec-row {
    display: grid;
    grid-template-columns: 128px 1fr;
    gap: 16px;
    padding: 11px 0;
    border-bottom: 1px solid var(--ki-line);
    font-size: 14px;
    line-height: 1.45;
}
.ki-spec-row:last-child { border-bottom: 0; }
.ki-spec-row dt { color: var(--ki-muted); margin: 0; }
.ki-spec-row dd { color: var(--ki-ink); margin: 0; font-variant-numeric: tabular-nums; letter-spacing: 0.01em; }

.ki-section { padding: 80px 0; border-top: 1px solid var(--ki-line); }
.ki-section-head { display: grid; grid-template-columns: 5fr 7fr; gap: 48px; margin-bottom: 40px; align-items: end; }
.ki-h2 { font-size: clamp(28px, 3.2vw, 40px); line-height: 1.1; letter-spacing: -0.02em; font-weight: 500; margin: 0; }
.ki-lede { font-family: var(--ki-serif); font-size: 17px; line-height: 1.6; color: var(--ki-body); margin: 0; max-width: 52ch; }

.ki-list { border-top: 1px solid var(--ki-line-strong); }
.ki-row {
    display: grid;
    grid-template-columns: 5fr 7fr;
    gap: 32px;
    padding: 22px 0;
    border-bottom: 1px solid var(--ki-line);
    text-decoration: none;
    color: inherit;
    transition: background 0.15s;
}
.ki-row:hover { background: rgba(236, 235, 230, 0.03); color: inherit; }
.ki-row h3 { font-size: 17px; font-weight: 500; margin: 0; color: var(--ki-ink); }
.ki-row p { margin: 0; font-size: 15px; color: var(--ki-body); line-height: 1.55; }

.ki-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.ki-step { border-top: 1px solid var(--ki-line-strong); padding-top: 20px; }
.ki-step .n { font-size: 13px; color: var(--ki-muted); font-variant-numeric: tabular-nums; margin-bottom: 28px; }
.ki-step h3 { font-size: 18px; margin: 0 0 8px; font-weight: 500; }
.ki-step p { font-size: 15px; line-height: 1.55; margin: 0; color: var(--ki-body); }

.ki-ways {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--ki-line);
    border: 1px solid var(--ki-line);
    border-radius: 4px;
    overflow: hidden;
}
.ki-way { background: var(--ki-surface); padding: 28px; display: flex; flex-direction: column; }
.ki-way h3 { font-size: 18px; margin: 0 0 10px; font-weight: 500; }
.ki-way p { font-size: 15px; line-height: 1.55; margin: 0 0 20px; color: var(--ki-body); flex: 1; }
.ki-way a { font-size: 14px; color: var(--ki-ink); text-decoration: none; border-bottom: 1px solid var(--ki-line-strong); align-self: flex-start; padding-bottom: 1px; }
.ki-way a:hover { border-bottom-color: var(--ki-ink); }

.ki-closing { padding: 88px 0 120px; border-top: 1px solid var(--ki-line); }
.ki-closing h2 { font-size: clamp(32px, 4.2vw, 54px); letter-spacing: -0.025em; line-height: 1.05; margin: 0 0 20px; max-width: 16ch; }
.ki-closing p { font-family: var(--ki-serif); font-size: 18px; color: var(--ki-body); margin: 0 0 32px; max-width: 46ch; }

@media (max-width: 900px) {
    .ki-hero { grid-template-columns: 1fr; gap: 40px; padding: 56px 0 48px; }
    .ki-section-head, .ki-row { grid-template-columns: 1fr; gap: 8px; }
    .ki-section-head { margin-bottom: 28px; }
    .ki-steps { grid-template-columns: repeat(2, 1fr); }
    .ki-ways { grid-template-columns: 1fr; }
    .ki-section { padding: 56px 0; }
    .ki-closing { padding: 64px 0 96px; }
}
@media (max-width: 560px) {
    .ki-steps { grid-template-columns: 1fr; }
    .ki-spec-row { grid-template-columns: 1fr; gap: 2px; }
}
@media (prefers-reduced-motion: reduce) {
    body *, body *::before, body *::after { transition: none !important; animation: none !important; }
}

/* ------------------------------------------------------- tool landings */
.ki-landing { padding: 40px 0 32px; }
.ki-landing-head {
    display: grid;
    grid-template-columns: 5fr 7fr;
    gap: 40px;
    align-items: end;
    padding-bottom: 28px;
    border-bottom: 1px solid var(--ki-line-strong);
    margin-bottom: 28px;
}
.ki-landing-head h2 { font-size: clamp(26px, 3vw, 36px); line-height: 1.1; letter-spacing: -0.02em; font-weight: 500; margin: 0; }
.ki-sample {
    border: 1px solid var(--ki-line-strong);
    border-radius: 4px;
    background: var(--ki-surface);
    overflow: hidden;
    margin: 0 0 28px;
}
.ki-sample-bar {
    display: flex;
    justify-content: space-between;
    padding: 12px 20px;
    border-bottom: 1px solid var(--ki-line);
    font-size: 13px;
    color: var(--ki-muted);
}
.ki-board { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--ki-line); }
.ki-col { background: var(--ki-surface); padding: 16px; }
.ki-col h4 { font-size: 13px; color: var(--ki-muted); font-weight: 500; margin: 0 0 12px; }
.ki-card { border: 1px solid var(--ki-line); border-radius: 4px; padding: 12px; margin-bottom: 10px; background: var(--ki-bg); }
.ki-card b { display: block; font-weight: 500; color: var(--ki-ink); font-size: 14px; }
.ki-card span { display: block; font-size: 13px; color: var(--ki-body); margin-top: 3px; line-height: 1.45; }
.ki-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.ki-table th { text-align: left; font-weight: 500; color: var(--ki-muted); padding: 12px 20px; border-bottom: 1px solid var(--ki-line); font-size: 13px; }
.ki-table td { padding: 12px 20px; border-bottom: 1px solid var(--ki-line); color: var(--ki-body); font-variant-numeric: tabular-nums; vertical-align: top; line-height: 1.45; }
.ki-table td:first-child { color: var(--ki-ink); }
.ki-table td.num, .ki-table th.num { text-align: right; white-space: nowrap; }
.ki-table tr:last-child td { border-bottom: 0; }
.ki-table tr.total td { color: var(--ki-ink); border-top: 1px solid var(--ki-line-strong); }
.ki-answer { padding: 20px; }
.ki-answer .q { color: var(--ki-muted); font-size: 13px; margin: 0 0 8px; }
.ki-answer .a { font-family: var(--ki-serif); font-size: 16px; line-height: 1.6; color: var(--ki-ink); margin: 0 0 16px; }
.ki-cite { display: flex; flex-wrap: wrap; gap: 8px; }
.ki-cite span { font-size: 12px; color: var(--ki-body); border: 1px solid var(--ki-line-strong); border-radius: 2px; padding: 3px 8px; }
.ki-tree, .ki-tree ul { list-style: none; margin: 0; padding: 0; }
.ki-tree { padding: 16px 20px 8px; font-size: 14px; color: var(--ki-ink); }
.ki-tree ul { margin-left: 18px; border-left: 1px solid var(--ki-line-strong); padding-left: 14px; }
.ki-tree li { padding: 5px 0; color: var(--ki-body); }
.ki-tree > li { color: var(--ki-ink); }
.ki-note { font-size: 13px; color: var(--ki-muted); padding: 12px 20px; border-top: 1px solid var(--ki-line); margin: 0; }
.ki-landing-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.ki-landing-actions small { font-size: 13px; color: var(--ki-muted); flex-basis: 100%; }
@media (max-width: 900px) {
    .ki-landing-head { grid-template-columns: 1fr; gap: 10px; }
    .ki-board { grid-template-columns: 1fr; }
    .ki-table th, .ki-table td { padding: 10px 14px; }
}

/* ---------------------------------------------------- About and Work */
.ki-spec-pdf { font-size: 12px; color: var(--ki-muted); text-decoration: none; border-bottom: 1px solid var(--ki-line-strong); font-weight: 400; }
.ki-spec-pdf:hover { color: var(--ki-ink); border-bottom-color: var(--ki-ink); }
.ki-ways-2 { grid-template-columns: repeat(2, 1fr); }
.ki-points { list-style: none; margin: 4px 0 0; padding: 0; }
.ki-points li { display: flex; gap: 12px; font-size: 14px; line-height: 1.5; color: var(--ki-body); padding: 8px 0; border-top: 1px solid var(--ki-line); }
.ki-points li::before { content: ''; width: 6px; height: 6px; border-radius: 1px; background: var(--ki-signal); margin-top: 7px; flex: none; }
@media (max-width: 900px) { .ki-ways-2 { grid-template-columns: 1fr; } }

/* ------------------------------------------------ the tools themselves */
/* Everything inside a tool tab uses the same surfaces, inputs, buttons and
   tables as the public site. Written against the Tailwind utilities and the
   inline styles the tool markup carries, so no tool needs its own rework. */
body .tab-content input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]),
body .tab-content select,
body .tab-content textarea {
    background: var(--ki-bg) !important;
    color: var(--ki-ink) !important;
    border: 1px solid var(--ki-line-strong) !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    font-family: var(--ki-display);
    font-size: 14px;
    transform: none !important;
}
body .tab-content input:focus, body .tab-content select:focus, body .tab-content textarea:focus {
    border-color: var(--ki-ink) !important;
    outline: none;
    box-shadow: none !important;
    transform: none !important;
}
body .tab-content input::placeholder, body .tab-content textarea::placeholder { color: var(--ki-muted); }
body .tab-content label { color: var(--ki-body) !important; font-weight: 500; }
body .tab-content .border-gray-300, body .tab-content .border-gray-200 { border-color: var(--ki-line-strong) !important; }

/* Primary actions: one colour, not a rainbow. */
body .tab-content button[class*="bg-green-"], body .tab-content a[class*="bg-green-"],
body .tab-content button[class*="bg-blue-"], body .tab-content a[class*="bg-blue-"],
body .tab-content button[class*="bg-indigo-"], body .tab-content a[class*="bg-indigo-"],
body .tab-content button[class*="bg-purple-"], body .tab-content a[class*="bg-purple-"],
body .tab-content button[class*="bg-cyan-"], body .tab-content a[class*="bg-cyan-"],
body .tab-content button[class*="bg-emerald-"], body .tab-content a[class*="bg-emerald-"],
body .tab-content button[class*="bg-teal-"], body .tab-content button.btn-accent,
body .tab-content button[class*="bg-gradient-to"], body .tab-content a[class*="bg-gradient-to"] {
    background: var(--ki-ink) !important;
    background-image: none !important;
    color: var(--ki-bg) !important;
    border: 1px solid var(--ki-ink) !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    font-family: var(--ki-display);
    font-weight: 500 !important;
    transform: none !important;
    white-space: nowrap;
}
body .tab-content button[class*="bg-green-"]:hover, body .tab-content button[class*="bg-blue-"]:hover,
body .tab-content button[class*="bg-indigo-"]:hover, body .tab-content button[class*="bg-purple-"]:hover,
body .tab-content button[class*="bg-cyan-"]:hover, body .tab-content button[class*="bg-emerald-"]:hover,
body .tab-content button[class*="bg-teal-"]:hover, body .tab-content a[class*="bg-emerald-"]:hover {
    background: #ffffff !important;
    border-color: #ffffff !important;
}
/* Secondary and toggle actions. */
body .tab-content button[class*="bg-gray-"], body .tab-content button.bg-white, body .tab-content button[class*="bg-slate-"] {
    background: transparent !important;
    color: var(--ki-body) !important;
    border: 1px solid var(--ki-line-strong) !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    font-weight: 500 !important;
}
body .tab-content button[class*="bg-gray-"]:hover { color: var(--ki-ink) !important; border-color: var(--ki-ink) !important; }
body .tab-content button[class*="bg-red-"] { background: transparent !important; color: #e5786d !important; border: 1px solid rgba(229, 120, 109, 0.4) !important; border-radius: 4px !important; box-shadow: none !important; }
body .tab-content button[class*="bg-amber-"], body .tab-content button[class*="bg-orange-"], body .tab-content button[class*="bg-yellow-"] { background: transparent !important; color: var(--ki-ink) !important; border: 1px solid var(--ki-line-strong) !important; border-radius: 4px !important; box-shadow: none !important; }

/* Light chips and panels that survived from a white theme. */
body .tab-content .bg-white, body .tab-content .bg-gray-50, body .tab-content .bg-gray-100, body .tab-content .bg-gray-200 {
    background-color: var(--ki-surface-2) !important;
    color: var(--ki-body);
}
body .tab-content [class*="bg-"][class*="-100"]:not(button):not(a), body .tab-content [class*="bg-"][class*="-50"]:not(button):not(a) {
    background-color: var(--ki-surface-2) !important;
}
body .tab-content [class*="text-"][class*="-800"], body .tab-content [class*="text-"][class*="-900"] { color: var(--ki-ink) !important; }
body .tab-content .rounded-full[class*="bg-"] { background: transparent !important; border: 1px solid var(--ki-line-strong); border-radius: 2px !important; }

/* Status colour is information; keep it, calm it. */
body .tab-content .text-green-600, body .tab-content .text-green-500, body .tab-content .text-green-400, body .tab-content .text-emerald-500 { color: var(--ki-signal) !important; }
body .tab-content .text-orange-600, body .tab-content .text-orange-500, body .tab-content .text-yellow-600, body .tab-content .text-amber-400, body .tab-content .text-amber-100, body .tab-content .text-amber-300 { color: #d9a441 !important; }
body .tab-content .text-red-600, body .tab-content .text-red-500, body .tab-content .text-red-400 { color: #e5786d !important; }
body .tab-content .text-blue-600, body .tab-content .text-blue-500, body .tab-content .text-blue-400, body .tab-content .text-cyan-400, body .tab-content .text-purple-600, body .tab-content .text-indigo-600 { color: #8fb4ff !important; }

/* Demo notices: a quiet note, not an amber warning. */
body .tab-content .bg-amber-500\/10, body .tab-content .bg-amber-50 { background: var(--ki-surface-2) !important; }
body .tab-content .border-amber-500\/30, body .tab-content .border-amber-200 { border-color: var(--ki-line-strong) !important; }

/* Cards, KPIs, sub-tabs. */
body .kpi-card { background: var(--ki-surface) !important; border: 1px solid var(--ki-line) !important; box-shadow: none !important; transform: none !important; cursor: default; }
body .kpi-card:hover { transform: none !important; box-shadow: none !important; border-color: var(--ki-line-strong) !important; }
body .boe-tab-btn { background: transparent !important; color: var(--ki-muted) !important; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; box-shadow: none !important; padding: 10px 14px !important; font-weight: 500 !important; }
body .boe-tab-btn::before { display: none !important; }
body .boe-tab-btn:hover { color: var(--ki-ink) !important; }
body .boe-tab-btn.active { color: var(--ki-ink) !important; border-bottom-color: var(--ki-signal) !important; }
body .boe-input:focus { transform: none !important; }
body .tab-content .bg-gray-800\/50, body .tab-content .bg-gray-800\/60, body .tab-content .bg-gray-900\/50 { background-color: var(--ki-surface) !important; }
body .tab-content .divide-gray-700 > * + * { border-color: var(--ki-line) !important; }

/* Tables. */
body .tab-content table { border-collapse: collapse; font-size: 14px; width: 100%; }
body .tab-content thead, body .tab-content thead tr, body .tab-content th { background: transparent !important; }
body .tab-content th { text-align: left; font-weight: 500; color: var(--ki-muted) !important; font-size: 13px; padding: 10px 12px; border-bottom: 1px solid var(--ki-line-strong) !important; text-transform: none !important; letter-spacing: 0 !important; }
body .tab-content td { padding: 10px 12px; border-bottom: 1px solid var(--ki-line) !important; color: var(--ki-body); vertical-align: top; }
body .tab-content tbody tr:hover { background: rgba(236, 235, 230, 0.03) !important; }
body .tab-content tbody tr:nth-child(even) { background: transparent !important; }

/* Tool headers set inline in the old palette. */
body .tab-content [style*="color: #f0f0f0"], body .tab-content [style*="color:#f0f0f0"] { color: var(--ki-ink) !important; }
body .tab-content [style*="color: #a1a1aa"], body .tab-content [style*="color:#a1a1aa"] { color: var(--ki-body) !important; }
body .tab-content [style*="background-color:#111"], body .tab-content [style*="background-color: #111"] { background-color: var(--ki-bg) !important; }
body .tab-content h2, body .tab-content h3 { font-weight: 500; }
body .tab-content .font-bold { font-weight: 500 !important; }