body {
    background-color: #f1f5f9;
    color: #0f172a;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: 0;
    margin: 0;
}

.kh-onboarding-shell {
    display: grid;
    gap: 20px;
    margin: 0 auto;
    max-width: 1120px;
}

.kh-onboarding-hero {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    display: grid;
    gap: 32px;
    grid-template-columns: minmax(0, 1fr) 250px;
    padding: 28px 30px;
}

.kh-onboarding-eyebrow {
    color: #0f9488;
    display: block;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.kh-onboarding-hero h2 {
    color: #0f172a;
    font-size: clamp(22px, 2.4vw, 30px);
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 8px;
}

.kh-onboarding-hero p {
    color: #64748b;
    line-height: 1.55;
    margin: 0;
    max-width: 680px;
}

.kh-onboarding-progress-card {
    background: #f8fafc;
    border: 1px solid #dfe7f0;
    border-radius: 7px;
    padding: 18px;
}

.kh-onboarding-progress-copy {
    align-items: baseline;
    display: flex;
    gap: 6px;
}

.kh-onboarding-progress-copy strong {
    color: #0f172a;
    font-size: 22px;
    font-weight: 800;
}

.kh-onboarding-progress-copy span,
.kh-onboarding-progress-percentage {
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}

.kh-onboarding-progress-track {
    background: #dfe7f0;
    border-radius: 999px;
    height: 8px;
    margin: 12px 0 7px;
    overflow: hidden;
}

.kh-onboarding-progress-track span {
    background: #14b8a6;
    border-radius: inherit;
    display: block;
    height: 100%;
    transition: width 180ms ease;
}

.kh-onboarding-progress-percentage {
    display: block;
    text-align: right;
}

.kh-onboarding-list {
    display: grid;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.kh-onboarding-step {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    display: grid;
    gap: 18px;
    grid-template-columns: 34px 44px minmax(0, 1fr) auto;
    padding: 20px 22px;
}

.kh-onboarding-step.is-complete {
    background: #fbfefd;
    border-color: #b7e8df;
}

.kh-onboarding-step-status {
    align-items: center;
    border: 2px solid #cbd5e1;
    border-radius: 50%;
    color: #64748b;
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    height: 28px;
    justify-content: center;
    width: 28px;
}

.kh-onboarding-step.is-complete .kh-onboarding-step-status {
    background: #14b8a6;
    border-color: #14b8a6;
    color: #ffffff;
}

.kh-onboarding-step-icon {
    align-items: center;
    background: #ecfeff;
    border-radius: 7px;
    color: #0f9488;
    display: inline-flex;
    font-size: 17px;
    height: 42px;
    justify-content: center;
    width: 42px;
}

.kh-onboarding-step-heading {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.kh-onboarding-step-heading h3 {
    color: #0f172a;
    font-size: 16px;
    font-weight: 800;
    margin: 0;
}

.kh-onboarding-step-heading span {
    background: #ccfbf1;
    border-radius: 999px;
    color: #0f766e;
    font-size: 10px;
    font-weight: 800;
    padding: 3px 8px;
    text-transform: uppercase;
}

.kh-onboarding-step-content p {
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
    margin: 5px 0 0;
}

.kh-onboarding-knowledge-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 9px;
}

.kh-onboarding-knowledge-links a {
    color: #0f9488;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.kh-onboarding-knowledge-links a:hover {
    color: #0f766e;
    text-decoration: underline;
}

.kh-onboarding-step-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.kh-onboarding-step-actions .btn {
    white-space: nowrap;
}

.kh-onboarding-step-actions .fa-arrow-right {
    font-size: 11px;
    margin-left: 5px;
}

.kh-onboarding-complete {
    align-items: center;
    background: #ecfdf5;
    border: 1px solid #99e4d7;
    border-radius: 8px;
    display: grid;
    gap: 15px;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    padding: 20px 22px;
}

.kh-onboarding-complete-icon {
    align-items: center;
    background: #14b8a6;
    border-radius: 50%;
    color: #ffffff;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.kh-onboarding-complete strong {
    color: #0f172a;
    display: block;
    font-size: 15px;
    margin-bottom: 3px;
}

.kh-onboarding-complete p {
    color: #47645f;
    font-size: 13px;
    margin: 0;
}

.kh-widget-verification-help {
    align-items: flex-start;
    border: 1px solid;
    border-radius: 6px;
    display: flex;
    gap: 10px;
    line-height: 1.45;
    margin: 8px 0 10px;
    padding: 10px 12px;
}

.kh-widget-verification-help > i {
    flex: 0 0 auto;
    margin-top: 2px;
}

.kh-widget-verification-help strong {
    display: block;
    margin-bottom: 2px;
}

.kh-widget-verification-help code {
    color: inherit;
    font-size: 0.95em;
    font-weight: 700;
}

.kh-widget-verification-help.is-warning {
    background: #fffbeb;
    border-color: #fcd34d;
    color: #854d0e;
}

.kh-widget-verification-help.is-success {
    background: #ecfdf5;
    border-color: #99e4d7;
    color: #0f766e;
}

.kh-widget-snippet-instruction {
    display: block;
}

@media (max-width: 880px) {
    .kh-onboarding-hero {
        grid-template-columns: 1fr;
    }

    .kh-onboarding-step {
        grid-template-columns: 34px 44px minmax(0, 1fr);
    }

    .kh-onboarding-step-actions {
        grid-column: 2 / -1;
        justify-content: flex-start;
    }
}

@media (max-width: 600px) {
    .kh-onboarding-hero {
        padding: 22px;
    }

    .kh-onboarding-step {
        align-items: start;
        grid-template-columns: 30px minmax(0, 1fr);
        padding: 18px;
    }

    .kh-onboarding-step-icon {
        display: none;
    }

    .kh-onboarding-step-actions {
        grid-column: 2;
    }

    .kh-onboarding-complete {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .kh-onboarding-complete .btn {
        grid-column: 2;
        justify-self: start;
    }
}

body.page-password {
    min-height: 100vh;
}

body.page-login {
    background:
        radial-gradient(circle at 12% 18%, rgba(34, 211, 238, 0.18), transparent 28%),
        radial-gradient(circle at 82% 14%, rgba(20, 184, 166, 0.14), transparent 30%),
        #f1f5f9;
}

.password-login-wrapper {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    padding: clamp(90px, 22vh, 220px) 18px 40px;
}

.password-login-wrapper .main-header {
    margin-bottom: 34px;
    padding: 0;
}

.password-login-wrapper .main-header #header-logo {
    border-block-end: 0;
    padding: 0;
}

.password-login-wrapper .content {
    display: flex;
    justify-content: center;
    padding: 0;
    width: 100%;
}

.password-panel {
    background: #ffffff;
    box-sizing: border-box;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
    margin: 0 auto;
    padding: 42px 52px;
    width: 430px;
    max-width: calc(100vw - 36px);
}

.password-panel h1 {
    color: #0f172a;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.2;
    margin: 0 0 14px;
}

.password-panel .password-copy {
    color: #64748b;
    font-size: 15px;
    line-height: 1.55;
    margin: 0 0 24px;
    width: 100%;
}

.password-brand {
    align-items: center;
    color: #0f172a;
    display: inline-flex;
    gap: 10px;
    margin-bottom: 26px;
    text-decoration: none;
}

.password-brand .brand-mark {
    block-size: 38px;
    inline-size: 38px;
}

.password-brand .brand-word {
    font-size: 24px;
}

.password-form {
    display: grid;
    gap: 12px;
}

.password-form label {
    color: #0f172a;
    font-size: 14px;
    font-weight: 700;
}

.password-form input {
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    box-sizing: border-box;
    color: #0f172a;
    font: inherit;
    inline-size: 100%;
    min-height: 44px;
    padding: 10px 12px;
}

.password-form input:focus {
    border-color: #14b8a6;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.16);
    outline: 0;
}

.password-form button {
    background: #14b8a6;
    border: 1px solid #14b8a6;
    border-radius: 6px;
    color: #ffffff;
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    margin-top: 4px;
    min-height: 44px;
    padding: 9px 14px;
}

.password-form button:hover {
    background: #0f9488;
    border-color: #0f9488;
}

.password-strength {
    background: #f8fafc;
    border: 1px solid #dfe7f0;
    border-radius: 6px;
    padding: 12px;
}

.password-strength-title {
    font-weight: 700;
    margin-bottom: 8px;
}

.password-strength ul {
    display: grid;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.password-strength li {
    color: #64748b;
    padding-left: 22px;
    position: relative;
}

.password-strength li::before {
    border: 1px solid #94a3b8;
    border-radius: 50%;
    content: "";
    height: 12px;
    left: 0;
    position: absolute;
    top: 5px;
    width: 12px;
}

.password-strength li.is-valid {
    color: #0f172a;
}

.password-strength li.is-valid::before {
    background: #14b8a6;
    border-color: #14b8a6;
    box-shadow: inset 0 0 0 3px #ffffff;
}

.password-alert {
    border-radius: 6px;
    margin-bottom: 14px;
    padding: 10px 12px;
}

.password-alert-success {
    background: #ccfbf1;
    color: #134e4a;
}

.password-alert-danger {
    background: #fee2e2;
    color: #7f1d1d;
}

.login-wrapper {
    margin-block-start: 0 !important;
}

.login-wrapper .main-header #header-logo {
    border-block-end: 0;
}

.login-wrapper .main-header #header-logo a,
.login-wrapper .main-header #header-logo .logo {
    color: #0f172a;
    font-weight: 700;
    letter-spacing: 0;
}

.brand-lockup {
    align-items: center;
    display: inline-flex;
    gap: 10px;
    max-inline-size: 100%;
    min-inline-size: 0;
}

.brand-mark {
    block-size: 34px;
    flex: 0 0 auto;
    inline-size: 34px;
}

.brand-word {
    align-items: center;
    display: inline-flex;
    font-size: 21px;
    font-weight: 800;
    gap: 0;
    letter-spacing: 0;
    line-height: 1;
    min-inline-size: 0;
}

.brand-word-strong {
    color: #0f172a;
}

.brand-word-accent {
    color: #14b8a6;
}

.brand-ai {
    align-items: center;
    background: linear-gradient(135deg, #14b8a6, #22d3ee);
    border-radius: 7px;
    color: #ffffff;
    display: inline-flex;
    font-size: 11px;
    font-weight: 800;
    height: 20px;
    justify-content: center;
    margin-inline-start: 7px;
    padding: 0 6px;
}

.toast-body,
.btn {
    font-size: var(--font-size-base);
}

#flash-messages {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 10px;
    inset-block-start: 22px;
    inset-inline-end: 22px;
    max-inline-size: min(380px, calc(100vw - 28px));
    pointer-events: none;
    position: fixed;
    z-index: 2040;
}

#flash-messages .alert {
    animation: kennishub-flash-in 0.22s ease-out both;
    border: 1px solid transparent;
    border-radius: 6px;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.16);
    font-size: 15px;
    font-weight: 700;
    inline-size: min(360px, calc(100vw - 28px));
    line-height: 1.45;
    margin: 0;
    overflow: hidden;
    padding: 13px 46px 16px 36px;
    pointer-events: auto;
    position: relative;
}

#flash-messages .alert::before {
    content: "\2713";
    font-size: 18px;
    font-weight: 800;
    inset-block-start: 12px;
    inset-inline-start: 14px;
    line-height: 1;
    position: absolute;
}

#flash-messages .alert::after {
    animation: kennishub-flash-progress var(--flash-duration, 5200ms) linear forwards;
    block-size: 3px;
    content: "";
    inset-block-end: 0;
    inset-inline-start: 0;
    position: absolute;
    transform-origin: left center;
    inline-size: 100%;
}

#flash-messages .alert.is-paused::after {
    animation-play-state: paused;
}

#flash-messages .alert.is-hiding {
    opacity: 0;
    transform: translateY(-6px);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

#flash-messages .alert-success {
    background: #d1f2df;
    border-color: #b8e8cc;
    color: #148453;
}

#flash-messages .alert-success::after {
    background: #198754;
}

#flash-messages .alert-danger {
    background: #fee2e2;
    border-color: #fecaca;
    color: #991b1b;
}

#flash-messages .alert-danger::before {
    content: "!";
}

#flash-messages .alert-danger::after {
    background: #ef4444;
}

#flash-messages .alert-warning {
    background: #fef3c7;
    border-color: #fde68a;
    color: #92400e;
}

#flash-messages .alert-warning::before {
    content: "!";
}

#flash-messages .alert-warning::after {
    background: #f59e0b;
}

#flash-messages .alert-info {
    background: #cffafe;
    border-color: #a5f3fc;
    color: #155e75;
}

#flash-messages .alert-info::before {
    content: "i";
}

#flash-messages .alert-info::after {
    background: #22d3ee;
}

#flash-messages .btn-close {
    color: currentColor;
    inset-block-start: 9px;
    inset-inline-end: 9px;
    opacity: 0.72;
    position: absolute;
}

#flash-messages .btn-close:hover {
    opacity: 1;
}

@keyframes kennishub-flash-in {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes kennishub-flash-progress {
    from {
        transform: scaleX(1);
    }

    to {
        transform: scaleX(0);
    }
}

.main-header #header-logo img,
.main-header #header-logo svg {
    max-inline-size: 100%;
}

.main-header #header-logo .logo-compact {
    align-items: center;
    justify-content: center;
}

body.ea-sidebar-width-compact .main-header #header-logo .logo-compact {
    display: flex;
}

body.ea-sidebar-width-compact .sidebar .main-header .navbar {
    padding-inline-start: 0;
}

body.ea-sidebar-width-compact .sidebar .main-header #header-logo .logo {
    align-items: center;
    display: flex;
    inline-size: 44px;
    justify-content: center;
}

.main-header #header-logo .logo-compact .logo-compact-mark {
    block-size: 32px;
    inline-size: 32px;
}

.sidebar {
    display: flex;
    flex-direction: column;
}

#main-menu {
    flex: 1 0 auto;
}

.kennishub-app-version {
    color: rgba(203, 213, 225, 0.58);
    font-size: 10px;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
    padding: 10px 5px 14px;
    text-align: center;
}

body.ea-sidebar-width-compact .kennishub-app-version {
    display: none;
}

.main-header #header-logo a,
.main-header #header-logo .logo {
    color: #f8fafc;
    font-weight: 700;
    letter-spacing: 0;
}

.main-header #header-logo .brand-word-strong {
    color: #ffffff;
}

.main-header #header-logo .brand-word-accent {
    color: #14b8a6;
}

.main-header #header-logo .brand-ai {
    box-shadow: 0 6px 14px rgba(20, 184, 166, 0.22);
}

.responsive-header .brand-word-strong {
    color: #ffffff;
}

.login-wrapper .main-header #header-logo .brand-lockup {
    justify-content: center;
    width: 100%;
}

.login-wrapper .main-header #header-logo .brand-word-strong {
    color: #0f172a;
}

.login-wrapper .main-header #header-logo .brand-word-accent {
    color: #14b8a6;
}

.login-wrapper .brand-mark {
    block-size: 44px;
    inline-size: 44px;
}

.login-wrapper .brand-word {
    font-size: 30px;
}

#main-menu .menu .menu-item {
    padding-block: 6px;
}

#main-menu .menu .menu-item .menu-item-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.content-header {
    background-color: #f1f5f9;
}

.content-header-title h1,
.content-header-title .title {
    letter-spacing: 0;
}

#content-resizer-handler {
    display: none;
}

.content-wrapper {
    max-inline-size: none;
}

.kennishub-widget-credit-warning {
    align-items: center;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-left: 3px solid #f59e0b;
    border-radius: 8px;
    color: #78350f;
    display: flex;
    gap: 14px;
    margin: 20px 0 0;
    padding: 13px 14px;
}

.kennishub-widget-credit-warning__icon {
    align-items: center;
    background: #fef3c7;
    border-radius: 6px;
    color: #b45309;
    display: inline-flex;
    flex: 0 0 36px;
    height: 36px;
    justify-content: center;
}

.kennishub-widget-credit-warning__content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 2px;
    line-height: 1.45;
    min-inline-size: 0;
}

.kennishub-widget-credit-warning__content strong {
    color: #78350f;
    font-size: 14px;
}

.kennishub-widget-credit-warning__content span {
    color: #92400e;
    font-size: 13px;
}

.kennishub-widget-credit-warning__action {
    flex: 0 0 auto;
    white-space: nowrap;
}

@media (min-width: 992px) {
    .content-wrapper {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 767px) {
    .kennishub-widget-credit-warning {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .kennishub-widget-credit-warning__action {
        margin-inline-start: 50px;
    }
}

.ea-index .content-body {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
    padding: 20px;
}

.kennishub-index-notice {
    align-items: flex-start;
    background: #f8fafc;
    border: 1px solid #ccfbf1;
    border-left: 3px solid #14b8a6;
    border-radius: 6px;
    color: #0f172a;
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
    padding: 12px 14px;
}

.kennishub-index-notice i {
    color: #14b8a6;
    flex: 0 0 auto;
    margin-top: 2px;
}

.kennishub-index-notice p {
    color: #475569;
    font-size: 14px;
    line-height: 1.45;
    margin: 0;
}

.datagrid td.actions {
    white-space: nowrap;
}

.kennishub-profile-list {
    color: #475569;
    white-space: nowrap;
}

@media (min-width: 768px) {
    .ea-index .datagrid td.kennishub-content-index-title {
        max-width: 1px;
        width: 100%;
    }
}

.ea-index .datagrid td.kennishub-content-index-title > span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kennishub-muted-value {
    color: #94a3b8;
}

.datagrid td.actions a:not(.dropdown-item) {
    font-size: var(--font-size-base);
    font-weight: 400;
}

.kh-domain-modal {
    --bs-modal-width: 560px;
}

.kh-domain-modal .modal-dialog {
    inline-size: calc(100% - 32px);
    margin-inline: auto;
    max-inline-size: var(--bs-modal-width);
}

.kh-domain-modal .modal-content {
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
    overflow: hidden;
}

.kh-domain-modal .modal-header {
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    padding: 22px 24px;
}

.kh-domain-modal .modal-title {
    color: #0f172a;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.2;
}

.kh-domain-modal .btn-close {
    background: transparent;
    border-radius: 6px;
    block-size: 34px;
    flex: 0 0 auto;
    inline-size: 34px;
    margin: 0 0 0 auto;
    opacity: 1;
    position: relative;
}

.kh-domain-modal .btn-close::before,
.kh-domain-modal .btn-close::after,
.kh-credit-modal .btn-close::before,
.kh-credit-modal .btn-close::after,
.kh-feedback-modal .btn-close::before,
.kh-feedback-modal .btn-close::after {
    background: #64748b;
    block-size: 2px;
    border-radius: 999px;
    content: "";
    inline-size: 15px;
    left: 50%;
    position: absolute;
    top: 50%;
    transition: background-color 0.15s ease;
}

.kh-domain-modal .btn-close::before,
.kh-credit-modal .btn-close::before,
.kh-feedback-modal .btn-close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.kh-domain-modal .btn-close::after,
.kh-credit-modal .btn-close::after,
.kh-feedback-modal .btn-close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.kh-domain-modal .btn-close:not(:disabled):not(.disabled):is(:hover, :focus, :focus-visible) {
    background: #f1f5f9;
    opacity: 1;
}

.kh-domain-modal .btn-close:is(:hover, :focus, :focus-visible)::before,
.kh-domain-modal .btn-close:is(:hover, :focus, :focus-visible)::after,
.kh-credit-modal .btn-close:is(:hover, :focus, :focus-visible)::before,
.kh-credit-modal .btn-close:is(:hover, :focus, :focus-visible)::after,
.kh-feedback-modal .btn-close:is(:hover, :focus, :focus-visible)::before,
.kh-feedback-modal .btn-close:is(:hover, :focus, :focus-visible)::after {
    background: #334155;
}

.kh-domain-modal .modal-body {
    padding: 22px 24px 24px;
    text-align: left;
}

.kh-domain-modal-copy {
    color: #64748b;
    font-size: 15px;
    line-height: 1.55;
    margin: 0 0 18px;
}

.kh-domain-email-field {
    display: grid;
    gap: 8px;
}

.kh-domain-email-field .form-label {
    color: #0f172a;
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    text-align: left;
}

.kh-domain-email-field .input-group {
    align-items: stretch;
    display: flex;
    inline-size: 100%;
}

.kh-domain-email-field .form-control,
.kh-domain-email-field .input-group-text {
    block-size: 44px;
    border-color: #cbd5e1;
    font-size: 15px;
    line-height: 1.35;
}

.kh-domain-email-field .form-control {
    min-inline-size: 0;
}

.kh-domain-email-field .form-control:focus {
    border-color: #14b8a6;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.16);
}

.kh-domain-email-field .input-group-text {
    background: #f8fafc;
    color: #334155;
    flex: 0 1 auto;
    font-weight: 700;
    max-inline-size: 55%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kh-domain-modal .modal-footer {
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
    gap: 10px;
    justify-content: flex-end;
    padding: 16px 24px;
}

.kh-domain-modal .modal-footer .btn {
    border-radius: 7px;
    font-weight: 700;
    min-block-size: 42px;
    padding-inline: 16px;
}

.kh-domain-modal .modal-footer .btn-primary {
    background: #14b8a6;
    border-color: #0f9488;
    color: #ffffff;
}

.kh-domain-modal .modal-footer .btn-primary:hover {
    background: #0f9488;
    border-color: #0f766e;
}

.kh-credit-modal {
    --bs-modal-width: 720px;
}

.kh-credit-modal .modal-dialog {
    inline-size: calc(100% - 32px);
    margin-inline: auto;
    max-inline-size: var(--bs-modal-width);
}

.kh-credit-modal .modal-content {
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
    overflow: hidden;
}

.kh-credit-modal .modal-header {
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    padding: 20px 24px;
}

.kh-credit-modal-kicker {
    color: #0f9488;
    display: block;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.kh-credit-modal .modal-title {
    color: #0f172a;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.2;
}

.kh-credit-modal .btn-close {
    background: transparent;
    border-radius: 6px;
    block-size: 34px;
    flex: 0 0 auto;
    inline-size: 34px;
    margin: 0 0 0 auto;
    opacity: 1;
    position: relative;
}

.kh-credit-modal .btn-close:not(:disabled):not(.disabled):is(:hover, :focus, :focus-visible) {
    background: #f1f5f9;
    opacity: 1;
}

.kh-credit-modal .modal-body {
    padding: 22px 24px 24px;
}

.kh-credit-modal-copy {
    color: #64748b;
    font-size: 14px;
    line-height: 1.55;
    margin: 0 0 18px;
}

.kh-credit-modal-copy strong {
    color: #334155;
}

.kh-credit-modal-notice {
    align-items: flex-start;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 7px;
    color: #92400e;
    display: flex;
    font-size: 13px;
    gap: 9px;
    line-height: 1.45;
    margin-bottom: 16px;
    padding: 10px 12px;
}

.kh-credit-modal-notice i {
    flex: 0 0 auto;
    margin-top: 3px;
}

.kh-credit-packages {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.kh-credit-package {
    background: #ffffff;
    border: 1px solid #d6dee9;
    border-radius: 8px;
    cursor: pointer;
    display: block;
    min-block-size: 154px;
    padding: 18px 16px 16px;
    position: relative;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.kh-credit-package:hover {
    border-color: rgba(20, 184, 166, 0.55);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.07);
    transform: translateY(-1px);
}

.kh-credit-package.is-selected,
.kh-credit-package:has(input:checked) {
    background: #f0fdfa;
    border-color: #14b8a6;
    box-shadow: 0 0 0 2px rgba(20, 184, 166, 0.12);
}

.kh-credit-package:has(input:focus-visible) {
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.kh-credit-package:has(input:disabled) {
    cursor: not-allowed;
    opacity: 0.58;
    transform: none;
}

.kh-credit-package input {
    block-size: 1px;
    inline-size: 1px;
    opacity: 0;
    position: absolute;
}

.kh-credit-package__check {
    align-items: center;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    color: transparent;
    display: flex;
    font-size: 9px;
    block-size: 20px;
    inline-size: 20px;
    justify-content: center;
    position: absolute;
    right: 12px;
    top: 12px;
}

.kh-credit-package.is-selected .kh-credit-package__check,
.kh-credit-package:has(input:checked) .kh-credit-package__check {
    background: #14b8a6;
    border-color: #14b8a6;
    color: #ffffff;
}

.kh-credit-package__content,
.kh-credit-package__heading,
.kh-credit-package__price,
.kh-credit-package__unit-price {
    display: block;
}

.kh-credit-package__heading {
    min-block-size: 45px;
    padding-right: 24px;
}

.kh-credit-package__heading strong {
    color: #0f172a;
    display: block;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25;
}

.kh-credit-package__tag {
    background: #ccfbf1;
    border-radius: 999px;
    color: #0f766e;
    display: inline-block;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    margin-top: 6px;
    padding: 4px 7px;
    text-transform: uppercase;
}

.kh-credit-package__price {
    color: #0f172a;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.25;
    margin-top: 10px;
}

.kh-credit-package__price small {
    color: #64748b;
    display: block;
    font-size: 11px;
    font-weight: 500;
    margin-top: 2px;
}

.kh-credit-package__unit-price {
    color: #64748b;
    font-size: 11px;
    line-height: 1.35;
    margin-top: 8px;
}

.kh-credit-modal .modal-footer {
    align-items: center;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
    display: flex;
    gap: 10px;
    padding: 15px 24px;
}

.kh-credit-modal-secure {
    color: #64748b;
    font-size: 12px;
    margin-right: auto;
}

.kh-credit-modal-secure i {
    color: #14b8a6;
    margin-right: 4px;
}

.kh-credit-modal .modal-footer .btn {
    align-items: center;
    border-radius: 7px;
    display: inline-flex;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    min-block-size: 40px;
    padding-inline: 16px;
}

.kh-credit-modal .modal-footer .btn-primary {
    background: #14b8a6;
    border-color: #0f9488;
    color: #ffffff;
}

.kh-credit-modal .modal-footer .btn-primary:hover:not(:disabled) {
    background: #0f9488;
    border-color: #0f766e;
}

@media (max-width: 767px) {
    .kh-credit-packages {
        grid-template-columns: 1fr;
    }

    .kh-credit-package {
        min-block-size: auto;
    }

    .kh-credit-modal .modal-footer {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .kh-credit-modal-secure {
        flex: 0 0 100%;
        margin-bottom: 2px;
    }
}

.kh-feedback-tab {
    align-items: center;
    background: #0f172a;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 7px 0 0 7px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.2);
    color: #ffffff;
    display: inline-flex;
    flex-direction: row;
    font-size: 13px;
    font-weight: 750;
    gap: 8px;
    padding: 14px 10px;
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: background-color 0.15s ease, padding-right 0.15s ease, box-shadow 0.15s ease;
    writing-mode: vertical-rl;
    z-index: 1020;
}

.kh-feedback-tab:hover,
.kh-feedback-tab:focus-visible {
    background: #16233b;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.28);
    color: #ffffff;
    padding-right: 13px;
}

.kh-feedback-tab:focus-visible {
    outline: 3px solid rgba(34, 211, 238, 0.42);
    outline-offset: 2px;
}

.kh-feedback-tab i {
    color: #22d3ee;
    font-size: 15px;
    transform: rotate(90deg);
}

.kh-feedback-modal {
    --bs-modal-width: 540px;
}

.kh-feedback-modal .modal-dialog {
    inline-size: calc(100% - 32px);
    margin-inline: auto;
    max-inline-size: var(--bs-modal-width);
}

.kh-feedback-modal .modal-content {
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
    overflow: hidden;
}

.kh-feedback-modal .modal-header {
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    padding: 20px 24px;
}

.kh-feedback-modal-kicker {
    color: #0f9488;
    display: block;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.kh-feedback-modal .modal-title {
    color: #0f172a;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.2;
}

.kh-feedback-modal .btn-close {
    background: transparent;
    border-radius: 6px;
    block-size: 34px;
    flex: 0 0 auto;
    inline-size: 34px;
    margin: 0 0 0 auto;
    opacity: 1;
    position: relative;
}

.kh-feedback-modal .btn-close:not(:disabled):not(.disabled):is(:hover, :focus, :focus-visible) {
    background: #f1f5f9;
    opacity: 1;
}

.kh-feedback-modal .modal-body {
    padding: 22px 24px 24px;
}

.kh-feedback-form-fields {
    display: grid;
    gap: 8px;
}

.kh-feedback-form-fields .form-label {
    color: #0f172a;
    font-size: 14px;
    font-weight: 750;
    margin: 0;
}

.kh-feedback-form-fields textarea.form-control {
    border-color: #cbd5e1;
    font-size: 14px;
    line-height: 1.55;
    min-block-size: 164px;
    padding: 12px 13px;
    resize: vertical;
}

.kh-feedback-form-fields textarea.form-control::placeholder {
    color: #94a3b8;
    opacity: 1;
}

.kh-feedback-form-fields textarea.form-control:focus {
    border-color: #14b8a6;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.16);
}

.kh-feedback-help {
    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}

.kh-feedback-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 6px;
    color: #991b1b;
    font-size: 13px;
    line-height: 1.45;
    margin-top: 4px;
    padding: 9px 11px;
}

.kh-feedback-success {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding: 14px 12px 10px;
    text-align: center;
}

.kh-feedback-success__icon {
    align-items: center;
    background: #ccfbf1;
    border-radius: 999px;
    color: #0f9488;
    display: inline-flex;
    height: 52px;
    justify-content: center;
    margin-bottom: 14px;
    width: 52px;
}

.kh-feedback-success h6 {
    color: #0f172a;
    font-size: 18px;
    font-weight: 800;
    margin: 0 0 6px;
}

.kh-feedback-success p {
    color: #64748b;
    font-size: 14px;
    margin: 0;
}

.kh-feedback-modal .modal-footer {
    align-items: center;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding: 15px 24px;
}

.kh-feedback-modal .modal-footer .btn {
    align-items: center;
    border-radius: 7px;
    display: inline-flex;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    min-block-size: 40px;
    padding-inline: 16px;
}

.kh-feedback-modal .modal-footer .btn-primary {
    background: #14b8a6;
    border-color: #0f9488;
    color: #ffffff;
}

.kh-feedback-modal .modal-footer .btn-primary:hover:not(:disabled) {
    background: #0f9488;
    border-color: #0f766e;
}

.kh-feedback-form [hidden] {
    display: none !important;
}

@media (max-width: 767px) {
    .kh-feedback-modal .modal-header,
    .kh-feedback-modal .modal-body,
    .kh-feedback-modal .modal-footer {
        padding-inline: 18px;
    }
}

.datagrid th.searchable a,
.datagrid td.searchable {
    overflow: hidden;
    text-overflow: ellipsis;
}

.ts-wrapper .ts-control,
.form-widget .form-select,
.form-widget input.form-control,
.form-widget textarea.form-control {
    block-size: 40px;
    font-size: var(--font-size-base);
}

.form-widget textarea.form-control {
    block-size: auto;
    min-block-size: 40px;
}

.form-widget .kennishub-masked-secret::placeholder {
    color: #0f172a;
    letter-spacing: 0.12em;
    opacity: 1;
}

.kennishub-color-field {
    text-align: center;
}

.kennishub-color-field .form-widget {
    display: flex;
    justify-content: center;
}

.ea-edit .form-column.kennishub-widget-preview-notice {
    margin-bottom: 12px;
}

.ea-edit .form-column.kennishub-widget-preview-notice .form-column-panel {
    background: #f0fdfa;
    border-color: rgba(20, 184, 166, 0.3);
    box-shadow: none;
    padding: 9px 14px;
}

.ea-edit .form-column.kennishub-widget-preview-notice .form-column-title {
    align-items: center;
    color: #0f766e;
    flex-direction: row;
    gap: 8px;
    margin-bottom: 0;
    min-height: 0;
}

.ea-edit .form-column.kennishub-widget-preview-notice .form-column-title .form-column-title-content {
    flex: 0 0 auto;
    width: auto;
}

.ea-edit .form-column.kennishub-widget-preview-notice .form-column-help {
    color: #475569;
    margin-top: 0;
    width: auto;
}

.ea-edit .form-column .kennishub-compact-fieldset.form-fieldset + .form-fieldset,
.ea-edit .form-column .form-fieldset + .kennishub-compact-fieldset.form-fieldset {
    margin-top: 14px !important;
    padding-top: 14px;
}

.ea-edit .form-column,
.ea-new .form-column,
.ea-detail .form-column {
    margin-bottom: 18px;
}

.ea-edit .form-column-panel,
.ea-new .form-column-panel,
.ea-detail .form-column-panel {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.035);
    padding: 18px;
    min-height: 100%;
}

.ea-edit .form-column .form-column-title,
.ea-new .form-column .form-column-title,
.ea-detail .form-column .form-column-title {
    align-items: center;
    border-bottom: 0;
    color: #0f172a;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin-bottom: 18px;
    min-height: 24px;
    padding: 0;
    text-align: left;
}

.ea-edit .form-column .form-column-title .form-column-title-content,
.ea-new .form-column .form-column-title .form-column-title-content,
.ea-detail .form-column .form-column-title .form-column-title-content {
    align-items: center;
    display: flex;
    font-weight: 700;
    gap: 8px;
    justify-content: flex-start;
    padding: 0;
    text-align: left;
    width: 100%;
}

.ea-edit .form-column .form-column-help,
.ea-new .form-column .form-column-help,
.ea-detail .form-column .form-column-help {
    margin-top: 8px;
    width: 100%;
}

.ea-edit .form-column-icon,
.ea-new .form-column-icon,
.ea-detail .form-column-icon,
.ea-edit .form-fieldset-icon,
.ea-new .form-fieldset-icon,
.ea-detail .form-fieldset-icon {
    color: #14b8a6;
}

.ea-edit .form-column .form-fieldset,
.ea-new .form-column .form-fieldset,
.ea-detail .form-column .form-fieldset {
    background: transparent;
    border: 0;
    box-shadow: none;
    margin: 0 !important;
    padding: 0;
}

.ea-edit .form-column .form-fieldset + .form-fieldset,
.ea-new .form-column .form-fieldset + .form-fieldset,
.ea-detail .form-column .form-fieldset + .form-fieldset {
    border-top: 1px solid #edf2f7;
    margin-top: 18px !important;
    padding-top: 18px;
}

.ea-edit .form-column .form-fieldset-body.without-header,
.ea-new .form-column .form-fieldset-body.without-header,
.ea-detail .form-column .form-fieldset-body.without-header,
.ea-edit .form-column .form-fieldset-body,
.ea-new .form-column .form-fieldset-body,
.ea-detail .form-column .form-fieldset-body {
    padding: 0;
}

.ea-edit .form-column .form-fieldset-header,
.ea-new .form-column .form-fieldset-header,
.ea-detail .form-column .form-fieldset-header {
    color: #0f172a;
    padding: 0 0 16px;
}

.form-widget .form-control:disabled,
.form-widget .form-select:disabled,
.form-widget .form-control[readonly] {
    background-color: #e8eef7;
    border-color: #d4deea;
    color: #475569;
    opacity: 1;
}

.form-switch .form-check-input:checked,
.form-check-input:checked {
    background-color: #14b8a6;
    border-color: #14b8a6;
}

.form-switch .form-check-input:focus,
.form-check-input:focus {
    border-color: #14b8a6;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.16);
}

.kennishub-language-model-explanation[hidden],
.kennishub-custom-language-model-fields[hidden] {
    display: none !important;
}

.ea-edit .form-column .kennishub-language-model-explanation.form-fieldset,
.ea-new .form-column .kennishub-language-model-explanation.form-fieldset {
    background: #f0fdfa;
    border: 1px solid rgba(20, 184, 166, 0.22);
    border-radius: 6px;
    color: #475569;
    margin-top: 16px !important;
    padding: 14px 16px;
}

.ea-edit .form-column .kennishub-language-model-explanation .form-fieldset-header,
.ea-new .form-column .kennishub-language-model-explanation .form-fieldset-header {
    padding: 0;
}

.kennishub-language-model-explanation .form-fieldset-help {
    color: #475569;
    line-height: 1.55;
    margin: 0;
}

.kennishub-language-model-explanation .form-fieldset-help strong {
    color: #0f172a;
}

.form-widget-compound .form-control-label,
.col-form-label,
.form-control-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.field-date input[type="date"].form-control,
.field-datetime input[type="datetime-local"].form-control,
.field-time input[type="time"].form-control {
    width: 100%;
}

.dropdown-menu .user-name {
    white-space: nowrap;
}

.kh-submit-loading {
    align-items: center;
    display: inline-flex !important;
    gap: 8px;
    justify-content: center;
}

.kh-submit-spinner {
    animation: khSubmitSpin 0.75s linear infinite;
    border: 2px solid rgba(255, 255, 255, 0.45);
    border-radius: 999px;
    border-top-color: #ffffff;
    display: inline-flex;
    height: 16px;
    width: 16px;
}

@keyframes khSubmitSpin {
    to {
        transform: rotate(360deg);
    }
}

.admin-account-switcher,
.admin-credit-badge {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
    display: flex;
    gap: 10px;
    margin-inline: 12px;
    min-inline-size: 260px;
    padding: 6px 8px 6px 12px;
}

.admin-account-switcher {
    gap: 6px;
    margin-inline: 12px 0;
    min-inline-size: 240px;
    padding: 4px 6px 4px 9px;
}

.admin-credit-badge {
    appearance: none;
    cursor: pointer;
    font: inherit;
    gap: 6px;
    margin-inline: 12px 0;
    min-inline-size: auto;
    padding: 4px 6px 4px 9px;
    text-align: left;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.admin-credit-badge:hover {
    border-color: rgba(20, 184, 166, 0.55);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
}

.admin-credit-badge:focus-visible {
    border-color: #14b8a6;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.16);
    outline: 0;
}

.admin-account-switcher label,
.admin-credit-badge__label {
    color: #64748b;
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0;
    text-transform: uppercase;
}

.admin-credit-badge__label {
    font-size: 11px;
}

.admin-account-switcher label {
    font-size: 11px;
}

.admin-credit-badge__value {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #d6dee9;
    border-radius: 6px;
    color: #0f172a;
    display: inline-flex;
    font-size: 13px;
    gap: 6px;
    min-block-size: 30px;
    padding: 3px 8px;
}

.admin-credit-badge__value i {
    color: #14b8a6;
    font-size: 13px;
}

.admin-credit-badge__value strong {
    font-weight: 800;
    white-space: nowrap;
}

.admin-account-switcher select {
    appearance: none;
    background:
        linear-gradient(45deg, transparent 50%, #14b8a6 50%) calc(100% - 16px) 50% / 6px 6px no-repeat,
        linear-gradient(135deg, #14b8a6 50%, transparent 50%) calc(100% - 11px) 50% / 6px 6px no-repeat,
        #f8fafc;
    border: 1px solid #d6dee9;
    border-radius: 6px;
    color: #0f172a;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    inline-size: 100%;
    min-block-size: 30px;
    min-inline-size: 0;
    padding: 3px 28px 3px 8px;
}

.admin-account-switcher select:focus {
    border-color: #14b8a6;
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.16);
    outline: 0;
}

.kennishub-create-label-mobile {
    display: none;
}

body.ea-sidebar-width-compact #main-menu .menu .menu-item.active {
    background: none;
}

body.ea-sidebar-width-compact #main-menu .menu .menu-item:hover i {
    color: var(--sidebar-bg) !important;
}

@media (min-width: 992px) {
    body.ea-sidebar-width-compact #main-menu .menu .menu-item .menu-item-label,
    body.ea-sidebar-width-compact #main-menu .menu .menu-item .submenu-toggle-icon,
    body.ea-sidebar-width-compact #main-menu .menu .menu-item .menu-item-badge {
        line-height: 21px;
    }

    body.ea-sidebar-width-compact #main-menu .menu .menu-item .menu-item-contents {
        min-block-size: 21px;
    }

    body.ea-sidebar-width-compact #main-menu .menu > .menu-item:hover {
        padding-inline-end: 15px;
    }

    body.ea-sidebar-width-compact #main-menu .menu > .menu-item:hover .submenu a {
        border-radius: 2px;
        padding: 3px 15px 3px 13px;
        transition: background-color 0.15s ease;
    }

    body.ea-sidebar-width-compact #main-menu .menu > .menu-item:hover .submenu a:hover {
        background-color: rgba(0, 0, 0, 0.04);
    }

    body.ea-sidebar-width-compact #main-menu .menu > .menu-item.has-submenu:hover .submenu-toggle-icon {
        display: none;
    }
}

@media (max-width: 768px) {
    .content-top {
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
    }

    .content-top.ea-search-enabled .content-search {
        flex: 1 1 0;
        min-inline-size: 0;
    }

    .content-top .content-search .form-action-search,
    .content-top .content-search .form-group,
    .content-top .content-search .form-widget,
    .content-top .content-search .content-search-label {
        inline-size: 100%;
        min-inline-size: 0;
    }

    .content-top .content-search .content-search-label input,
    .content-top .content-search .content-search-label input.is-blank {
        inline-size: 100%;
        min-inline-size: 0;
    }

    .admin-account-switcher {
        margin-inline: 0;
        order: 3;
        width: 100%;
    }

    .admin-credit-badge {
        flex: 0 0 auto;
        margin-inline-start: auto;
        order: 2;
    }

    .form-tabs-tablist {
        -webkit-overflow-scrolling: touch;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .form-tabs-tablist::-webkit-scrollbar {
        display: none;
    }

    .form-tabs-tablist .nav-tabs {
        flex-wrap: nowrap;
        min-inline-size: max-content;
    }

    .form-tabs-tablist .nav-tabs .nav-item {
        flex: 0 0 auto;
    }

    .form-tabs-tablist .nav-tabs .nav-link {
        white-space: nowrap;
    }

    .content-header .page-actions {
        display: block;
        margin-bottom: 0;
        overflow: auto;
        padding: 10px 1px;
        scrollbar-width: none;
        white-space: nowrap;
    }

    .content-header .page-actions::-webkit-scrollbar {
        display: none;
    }

    .content-header .datagrid-filters {
        float: left;
    }

    body.ea-index .content-header {
        align-items: center;
        display: flex;
        gap: 12px;
        justify-content: space-between;
    }

    body.ea-index .content-header-title {
        min-inline-size: 0;
    }

    body.ea-index .content-header-title .title {
        overflow: hidden;
        padding-inline-end: 0;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.ea-index .content-header .page-actions {
        display: flex;
        flex: 0 0 auto;
        margin: 0;
        overflow: visible;
        padding: 0;
    }

    body.ea-index .content-header .global-actions {
        flex-wrap: nowrap;
    }

    body.ea-index .action-new .kennishub-create-label-full {
        display: none;
    }

    body.ea-index .action-new .kennishub-create-label-mobile {
        display: inline;
    }
}

@media (min-width: 1500px) {
    .datagrid td {
        padding: 14px 8px;
        white-space: nowrap;
    }
}

.kh-docs-shell,
.kh-docs-article {
    display: grid;
    gap: 18px;
}

.kh-docs-intro,
.kh-docs-article-header {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
    padding: 24px;
}

.kh-docs-eyebrow {
    color: #0f766e;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.kh-docs-intro h2,
.kh-docs-article-header h2 {
    color: #0f172a;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.15;
    margin: 4px 0 10px;
}

.kh-docs-intro p,
.kh-docs-article-header p {
    color: #64748b;
    font-size: 15px;
    line-height: 1.55;
    margin: 0;
    max-inline-size: 780px;
}

.kh-docs-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}

.kh-docs-topic-group,
.kh-docs-section,
.kh-docs-toc {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
}

.kh-docs-topic-group {
    display: grid;
    gap: 16px;
    padding: 18px;
}

.kh-docs-topic-group-header {
    align-items: flex-start;
    display: flex;
    gap: 12px;
}

.kh-docs-topic-icon {
    align-items: center;
    background: rgba(20, 184, 166, 0.12);
    border: 1px solid rgba(20, 184, 166, 0.24);
    border-radius: 8px;
    color: #0f766e;
    display: inline-flex;
    flex: 0 0 40px;
    height: 40px;
    justify-content: center;
    width: 40px;
}

.kh-docs-topic-group h3,
.kh-docs-section h3 {
    color: #0f172a;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.25;
    margin: 0;
}

.kh-docs-topic-group p {
    color: #64748b;
    line-height: 1.5;
    margin: 4px 0 0;
}

.kh-docs-topic-link {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #0f172a;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    padding: 14px;
    text-decoration: none;
}

.kh-docs-topic-link:hover {
    border-color: rgba(20, 184, 166, 0.44);
    color: #0f766e;
}

.kh-docs-topic-link span {
    display: grid;
    gap: 4px;
    min-inline-size: 0;
}

.kh-docs-topic-link strong {
    color: inherit;
}

.kh-docs-topic-link small {
    color: #64748b;
    line-height: 1.4;
}

.kh-docs-toc {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
}

.kh-docs-toc a {
    background: #f8fafc;
    border: 1px solid #dfe7f0;
    border-radius: 999px;
    color: #0f766e;
    font-size: 13px;
    font-weight: 800;
    padding: 7px 11px;
    text-decoration: none;
}

.kh-docs-toc a:hover {
    background: rgba(20, 184, 166, 0.1);
    border-color: rgba(20, 184, 166, 0.34);
    color: #0f172a;
}

.kh-docs-section {
    display: grid;
    gap: 14px;
    padding: 22px;
}

.kh-docs-section p,
.kh-docs-section li {
    color: #475569;
    font-size: 15px;
    line-height: 1.6;
}

.kh-docs-section a {
    color: #0f766e;
    font-weight: 700;
    text-decoration: none;
}

.kh-docs-section a:hover {
    color: #0f172a;
    text-decoration: underline;
}

.kh-docs-steps,
.kh-docs-provider ol,
.kh-docs-checklist {
    display: grid;
    gap: 10px;
    margin: 0;
    padding-left: 20px;
}

.kh-docs-steps strong,
.kh-docs-checklist strong {
    color: #0f172a;
}

.kh-docs-provider-list {
    display: grid;
    gap: 12px;
}

.kh-docs-provider {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    display: grid;
    gap: 12px;
    padding: 16px;
}

.kh-docs-provider-heading {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
}

.kh-docs-provider-heading span {
    color: #0f172a;
    font-size: 17px;
    font-weight: 800;
}

.kh-docs-provider-heading a {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    display: inline-flex;
    gap: 7px;
    padding: 7px 10px;
}

.kh-docs-provider p {
    margin: 0;
}

.kh-docs-source-link {
    justify-self: start;
}

.kh-docs-checklist li::marker {
    color: #14b8a6;
}

.kh-docs-comparison {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kh-docs-comparison--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.kh-docs-option {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    display: grid;
    gap: 14px;
    padding: 18px;
}

.kh-docs-option--recommended {
    background: rgba(20, 184, 166, 0.06);
    border-color: rgba(20, 184, 166, 0.3);
}

.kh-docs-option-heading {
    align-items: flex-start;
    display: flex;
    gap: 11px;
}

.kh-docs-option-icon {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    color: #0f766e;
    display: inline-flex;
    flex: 0 0 36px;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.kh-docs-option-label {
    color: #0f766e;
    display: block;
    font-size: 11px;
    font-weight: 800;
    margin-block-end: 3px;
    text-transform: uppercase;
}

.kh-docs-option h4 {
    color: #0f172a;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.35;
    margin: 0;
}

.kh-docs-note {
    align-items: flex-start;
    background: rgba(34, 211, 238, 0.08);
    border: 1px solid rgba(34, 211, 238, 0.28);
    border-radius: 8px;
    color: #0f766e;
    display: flex;
    gap: 10px;
    padding: 14px;
}

.kh-docs-note i {
    margin-block-start: 4px;
}

.kh-docs-note p {
    margin: 0;
}

@media (max-width: 640px) {
    .kh-docs-intro,
    .kh-docs-article-header,
    .kh-docs-section {
        padding: 18px;
    }

    .kh-docs-intro h2,
    .kh-docs-article-header h2 {
        font-size: 24px;
    }

    .kh-docs-provider-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .kh-docs-comparison {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 641px) and (max-width: 980px) {
    .kh-docs-comparison--three {
        grid-template-columns: 1fr;
    }
}

.admin-chat-shell {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
    block-size: calc(100vh - 220px);
    display: grid;
    grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
    min-block-size: 480px;
    overflow: hidden;
}

.admin-chat-sidebar {
    background: #f8fafc;
    border-right: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-block-size: 0;
    overflow: auto;
    padding: 22px;
}

.admin-chat-sidebar-header h2 {
    color: #0f172a;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.15;
    margin: 3px 0 0;
}

.admin-chat-eyebrow,
.admin-chat-label {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.admin-chat-profile {
    border-color: #d6dee9;
}

.admin-chat-profile-card {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px;
}

.admin-chat-profile-card strong {
    color: #0f172a;
    font-size: 15px;
}

.admin-chat-profile-card span:last-child {
    color: #64748b;
    overflow-wrap: anywhere;
}

.admin-chat-provider {
    align-self: flex-start;
    background: rgba(20, 184, 166, 0.12);
    border: 1px solid rgba(20, 184, 166, 0.25);
    border-radius: 999px;
    color: #0f766e;
    font-size: 12px;
    font-weight: 800;
    padding: 4px 9px;
}

.admin-chat-usage-warning {
    background: #ffffff;
    border: 1px solid rgba(20, 184, 166, 0.28);
    border-radius: 8px;
    color: #0f766e;
    display: grid;
    gap: 4px;
    padding: 12px 14px;
}

.admin-chat-usage-warning[hidden] {
    display: none;
}

.admin-chat-usage-warning strong {
    color: #0f172a;
}

.admin-chat-usage-warning span,
.admin-chat-usage-warning small {
    color: #475569;
}

.admin-chat-usage-warning.is-over-limit {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #9a3412;
}

.admin-chat-usage-warning.is-over-limit span,
.admin-chat-usage-warning.is-over-limit small {
    color: #9a3412;
}

.admin-chat-history {
    display: grid;
    gap: 8px;
}

.admin-chat-history-header {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: space-between;
}

.admin-chat-history-header button {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    color: #0f766e;
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    gap: 6px;
    min-height: 32px;
    padding: 6px 9px;
}

.admin-chat-history-header button:hover {
    border-color: rgba(20, 184, 166, 0.45);
    color: #0f172a;
}

.admin-chat-history-list {
    display: grid;
    gap: 8px;
}

.admin-chat-history-row {
    align-items: stretch;
    display: grid;
    gap: 6px;
    grid-template-columns: minmax(0, 1fr) 36px;
}

.admin-chat-history-item {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    color: #0f172a;
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    text-align: left;
}

.admin-chat-history-delete {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    color: #64748b;
    display: inline-flex;
    justify-content: center;
    min-height: 36px;
    padding: 0;
}

.admin-chat-history-delete:hover,
.admin-chat-history-delete:focus-visible {
    background: #fff7f7;
    border-color: #fecaca;
    color: #b91c1c;
}

.admin-chat-history-item:hover,
.admin-chat-history-item.is-active {
    border-color: rgba(20, 184, 166, 0.48);
}

.admin-chat-history-item.is-active {
    background: rgba(20, 184, 166, 0.08);
    box-shadow: inset 3px 0 0 #14b8a6;
}

.admin-chat-history-item strong {
    font-size: 13px;
    line-height: 1.3;
}

.admin-chat-history-item span,
.admin-chat-history-item small,
.admin-chat-history-empty {
    color: #64748b;
    font-size: 12px;
    line-height: 1.35;
}

.admin-chat-history-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-chat-history-empty {
    background: #ffffff;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    padding: 10px 12px;
}

.admin-chat-history-empty[hidden] {
    display: none;
}

.admin-chat-prompts {
    display: grid;
    gap: 8px;
}

.admin-chat-prompts button {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    color: #0f172a;
    font-weight: 700;
    padding: 10px 12px;
    text-align: left;
}

.admin-chat-prompts button:hover {
    border-color: rgba(20, 184, 166, 0.45);
    color: #0f766e;
}

.admin-chat-empty {
    background: #ffffff;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    color: #64748b;
    padding: 14px;
}

.admin-chat-panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto auto;
    min-height: 0;
    min-width: 0;
}

.admin-chat-topbar {
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    justify-content: space-between;
    min-height: 62px;
    padding: 14px 18px;
}

.admin-chat-topbar > div {
    align-items: center;
    color: #475569;
    display: flex;
    font-weight: 700;
    gap: 9px;
}

.admin-chat-status-dot {
    background: #14b8a6;
    border-radius: 999px;
    box-shadow: 0 0 0 5px rgba(20, 184, 166, 0.12);
    display: inline-flex;
    height: 9px;
    width: 9px;
}

.admin-chat-reset {
    align-items: center;
    display: inline-flex;
    gap: 7px;
}

.admin-chat-messages {
    background:
        linear-gradient(180deg, rgba(241, 245, 249, 0.76), rgba(255, 255, 255, 0.88));
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-block-size: 0;
    overflow: auto;
    padding: 20px;
}

.admin-chat-message {
    align-items: flex-start;
    display: flex;
    gap: 10px;
    max-width: min(760px, 100%);
}

.admin-chat-message.user {
    align-self: flex-end;
    flex-direction: row-reverse;
}

.admin-chat-avatar {
    align-items: center;
    background: #0f172a;
    border-radius: 999px;
    color: #ffffff;
    display: inline-flex;
    flex: 0 0 34px;
    font-size: 12px;
    font-weight: 800;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.admin-chat-message.user .admin-chat-avatar {
    background: #14b8a6;
}

.admin-chat-bubble {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
    color: #0f172a;
    line-height: 1.55;
    padding: 12px 14px;
}

.admin-chat-images {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.admin-chat-image {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    margin: 0;
    overflow: hidden;
}

.admin-chat-image a {
    background: #ffffff;
    display: block;
}

.admin-chat-image img {
    display: block;
    height: auto;
    max-height: 420px;
    object-fit: contain;
    width: 100%;
}

.admin-chat-image figcaption {
    display: grid;
    gap: 2px;
    padding: 9px 11px 10px;
}

.admin-chat-image figcaption strong {
    color: #0f172a;
    font-size: 13px;
    line-height: 1.35;
}

.admin-chat-image figcaption span {
    color: #64748b;
    font-size: 12px;
    line-height: 1.35;
}

.admin-chat-message.user .admin-chat-bubble {
    background: #0f172a;
    border-color: #0f172a;
    color: #ffffff;
}

.admin-chat-typing .admin-chat-bubble {
    align-items: center;
    display: flex;
    gap: 5px;
    line-height: 1;
    padding: 11px 12px;
}

.admin-chat-typing-dot {
    animation: adminChatTypingPulse 1.2s infinite ease-in-out;
    background: #64748b;
    border-radius: 999px;
    display: inline-flex;
    height: 6px;
    width: 6px;
}

.admin-chat-typing-dot:nth-child(2) {
    animation-delay: 0.15s;
}

.admin-chat-typing-dot:nth-child(3) {
    animation-delay: 0.3s;
}

@keyframes adminChatTypingPulse {
    0%,
    80%,
    100% {
        opacity: 0.35;
        transform: translateY(0);
    }

    40% {
        opacity: 1;
        transform: translateY(-3px);
    }
}

.admin-chat-sources {
    border-top: 1px solid #e2e8f0;
    display: grid;
    gap: 8px;
    max-height: 190px;
    overflow: auto;
    padding: 12px 18px;
}

.admin-chat-source {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 9px 11px;
}

.admin-chat-source summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 8px;
}

.admin-chat-source summary span {
    background: rgba(34, 211, 238, 0.16);
    border-radius: 999px;
    color: #0e7490;
    font-size: 12px;
    font-weight: 800;
    padding: 3px 8px;
}

.admin-chat-source summary strong {
    color: #0f172a;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-chat-source summary small {
    color: #64748b;
    margin-left: auto;
    white-space: nowrap;
}

.admin-chat-source p {
    color: #475569;
    margin: 9px 0 0;
}

.admin-chat-source-images {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.admin-chat-source-images a {
    background: #ffffff;
    border: 1px solid #dbe6ef;
    border-radius: 6px;
    display: block;
    overflow: hidden;
}

.admin-chat-source-images img {
    display: block;
    height: 74px;
    object-fit: cover;
    width: 96px;
}

.kh-pdf-image-preview {
    inline-size: 100%;
}

.kh-pdf-image-empty {
    background: #f8fafc;
    border: 1px solid #dbe6ef;
    border-radius: 8px;
    color: #64748b;
    display: grid;
    gap: 4px;
    padding: 16px;
}

.kh-pdf-image-empty strong {
    color: #0f172a;
}

.kh-pdf-image-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
}

.kh-pdf-image-card {
    background: #ffffff;
    border: 1px solid #dbe6ef;
    border-radius: 8px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.045);
    margin: 0;
    overflow: hidden;
}

.kh-pdf-image-card a {
    background: #f8fafc;
    display: block;
}

.kh-pdf-image-card img {
    aspect-ratio: 4 / 3;
    display: block;
    object-fit: contain;
    width: 100%;
}

.kh-pdf-image-card figcaption {
    display: grid;
    gap: 5px;
    padding: 11px 12px 13px;
}

.kh-pdf-image-card figcaption strong {
    color: #0f172a;
    font-size: 14px;
    line-height: 1.35;
}

.kh-pdf-image-card figcaption span,
.kh-pdf-image-card figcaption p {
    color: #64748b;
    font-size: 12px;
    line-height: 1.4;
    margin: 0;
}

.kh-pdf-image-card figcaption .kh-pdf-vision-status {
    align-items: center;
    display: inline-flex;
    font-weight: 750;
    gap: 5px;
    min-block-size: 18px;
    width: fit-content;
}

.kh-pdf-vision-status-loading {
    color: #14b8a6 !important;
}

.kh-pdf-vision-status-loading i {
    animation: kh-pdf-vision-spin 0.85s linear infinite;
    font-size: 14px;
}

.kh-pdf-vision-status-done {
    color: #0f766e !important;
}

.kh-pdf-vision-status-failed {
    color: #b45309 !important;
}

@keyframes kh-pdf-vision-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .kh-pdf-vision-status-loading i {
        animation-duration: 1.8s;
    }
}

.admin-chat-form {
    align-items: flex-end;
    border-top: 1px solid #e2e8f0;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 16px 18px;
}

.admin-chat-form textarea {
    line-height: 1.45;
    max-block-size: 144px;
    min-height: 48px;
    overflow-y: hidden;
    resize: none;
}

.admin-chat-form .btn {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    min-height: 48px;
}

@media (max-width: 992px) {
    .admin-chat-shell {
        background: transparent;
        border: 0;
        block-size: auto;
        box-shadow: none;
        gap: 18px;
        grid-template-columns: 1fr;
        grid-template-rows: minmax(560px, calc(100vh - 140px)) auto;
        grid-template-rows: minmax(560px, calc(100dvh - 140px)) auto;
        min-block-size: 0;
        overflow: visible;
    }

    .admin-chat-sidebar {
        border: 1px solid #dfe7f0;
        border-radius: 8px;
        box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
        grid-row: 2;
        max-block-size: none;
    }

    .admin-chat-panel {
        background: #ffffff;
        border: 1px solid #dfe7f0;
        border-radius: 8px;
        box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
        grid-row: 1;
        min-block-size: 560px;
        overflow: hidden;
    }
}

@media (max-width: 640px) {
    .admin-chat-shell {
        gap: 16px;
        grid-template-rows: clamp(360px, calc(100vh - 112px), 680px) auto;
        grid-template-rows: clamp(360px, calc(100dvh - 112px), 680px) auto;
    }

    .admin-chat-sidebar {
        gap: 14px;
        padding: 18px;
    }

    .admin-chat-panel {
        min-block-size: 360px;
    }

    .admin-chat-sidebar-header h2 {
        font-size: 21px;
    }

    .admin-chat-topbar {
        min-height: 54px;
        padding: 12px 14px;
    }

    .admin-chat-messages {
        padding: 16px 14px;
    }

    .admin-chat-avatar {
        flex-basis: 30px;
        height: 30px;
        width: 30px;
    }

    .admin-chat-form {
        background: #ffffff;
        gap: 8px;
        grid-template-columns: minmax(0, 1fr) auto;
        padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    }

    .admin-chat-form textarea {
        font-size: 16px;
        min-height: 46px;
        padding: 11px 13px;
    }

    .admin-chat-form .btn {
        border-radius: 999px;
        height: 46px;
        justify-content: center;
        min-width: 46px;
        padding: 0;
        width: 46px;
    }

    .admin-chat-form .btn span {
        block-size: 1px;
        clip-path: inset(50%);
        inline-size: 1px;
        overflow: hidden;
        position: absolute;
        white-space: nowrap;
    }

    .admin-chat-source summary {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-chat-source summary small {
        margin-left: 0;
    }
}

.kennishub-snippet-shell {
    background: #ffffff;
    border-radius: 8px;
    display: grid;
    gap: 12px;
    margin-bottom: 8px;
}

.kennishub-snippet-shell textarea.form-control {
    background: #0f172a;
    border-color: #0f172a;
    color: #d7fbf4;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 13px;
    line-height: 1.55;
    min-block-size: 0;
    overflow-y: hidden;
    resize: none;
}

.kennishub-copy-button {
    justify-self: start;
}

.kennishub-empty-action {
    color: #0f9488;
    font-weight: 700;
    text-decoration: none;
}

.kennishub-empty-action:hover {
    color: #0f766e;
    text-decoration: underline;
}

.conversation-transcript {
    display: grid;
    gap: 12px;
}

.conversation-transcript-summary {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    color: #64748b;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    padding: 10px 12px;
}

.conversation-transcript-summary strong {
    color: #0f172a;
}

.conversation-transcript-message {
    background: #ffffff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.035);
    padding: 12px 14px;
}

.conversation-transcript-message.user {
    border-left: 3px solid #14b8a6;
}

.conversation-transcript-message.assistant {
    border-left: 3px solid #22d3ee;
}

.conversation-transcript-message.system {
    background: #f8fafc;
    border-left: 3px solid #64748b;
}

.conversation-transcript-meta {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    margin-bottom: 8px;
}

.conversation-transcript-meta strong {
    color: #0f172a;
}

.conversation-transcript-meta span {
    color: #64748b;
    font-size: 12px;
}

.conversation-transcript-usage {
    color: #64748b;
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
    gap: 6px 10px;
    margin: -2px 0 8px;
}

.conversation-transcript-usage span {
    background: #ecfeff;
    border: 1px solid #cffafe;
    border-radius: 999px;
    color: #155e75;
    padding: 3px 8px;
}

.conversation-transcript-message p {
    color: #0f172a;
    line-height: 1.55;
    margin: 0;
}

.kh-status-badge {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 999px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    gap: 6px;
    line-height: 1;
    padding: 5px 9px;
    white-space: nowrap;
}

.kh-status-badge i {
    font-size: 11px;
}

.kh-status-badge.is-open {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #9a3412;
}

.kh-status-badge.is-escalated {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}

.kh-status-badge.is-closed {
    background: #ecfdf5;
    border-color: #bbf7d0;
    color: #166534;
}
.kh-subscription-shell {
    margin: 0 auto;
    max-width: 1040px;
}

.kh-subscription-header {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    margin-bottom: 24px;
}

.kh-subscription-eyebrow {
    color: #0f9488;
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .07em;
    margin-bottom: 7px;
    text-transform: uppercase;
}

.kh-subscription-header h2,
.kh-subscription-panel > h2 {
    color: #0f172a;
    font-size: 29px;
    font-weight: 800;
    margin: 0 0 6px;
}

.kh-subscription-header p,
.kh-subscription-panel > p {
    color: #64748b;
    margin: 0;
}

.kh-subscription-status {
    background: #f1f5f9;
    border-radius: 999px;
    color: #475569;
    font-size: 11px;
    font-weight: 800;
    padding: 7px 12px;
}

.kh-subscription-status.is-trialing,
.kh-subscription-status.is-active {
    background: #ccfbf1;
    color: #0f766e;
}

.kh-subscription-status.is-past_due,
.kh-subscription-status.is-setup_failed {
    background: #fef3c7;
    color: #92400e;
}

.kh-subscription-welcome {
    align-items: center;
    background: #ecfdf5;
    border: 1px solid #99e4d7;
    border-radius: 8px;
    display: grid;
    gap: 15px;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    margin-bottom: 18px;
    padding: 18px 20px;
}

.kh-subscription-welcome > span {
    align-items: center;
    background: #14b8a6;
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.kh-subscription-welcome strong {
    color: #0f172a;
    display: block;
    font-size: 14px;
}

.kh-subscription-welcome p {
    color: #47645f;
    font-size: 12px;
    margin: 3px 0 0;
}

.kh-subscription-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
}

.kh-subscription-panel {
    background: #fff;
    border: 1px solid #dfe7f0;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .045);
    padding: 27px;
}

.kh-subscription-plan-title {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.kh-subscription-plan-title > div > span {
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
}

.kh-subscription-plan-title h3 {
    color: #0f172a;
    font-size: 27px;
    font-weight: 800;
    margin: 3px 0 0;
}

.kh-subscription-plan-title h3 small {
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}

.kh-subscription-plan-icon {
    align-items: center;
    background: #ecfeff;
    border-radius: 7px;
    color: #0f9488;
    display: inline-flex;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.kh-subscription-highlight {
    background: #f0fdfa;
    border: 1px solid #b7e8df;
    border-radius: 7px;
    display: grid;
    margin: 22px 0;
    padding: 17px 18px;
}

.kh-subscription-highlight > span {
    color: #52706c;
    font-size: 11px;
}

.kh-subscription-highlight strong {
    color: #0f172a;
    font-size: 17px;
    margin: 2px 0;
}

.kh-subscription-highlight p {
    color: #64748b;
    font-size: 11px;
    margin: 3px 0 0;
}

.kh-subscription-highlight.is-warning {
    background: #fffbeb;
    border-color: #fde68a;
}

.kh-subscription-highlight.is-muted {
    background: #f8fafc;
    border-color: #e2e8f0;
}

.kh-subscription-features {
    display: grid;
    gap: 9px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.kh-subscription-features li {
    color: #475569;
    font-size: 12px;
}

.kh-subscription-features i {
    color: #0f9488;
    margin-right: 8px;
}

.kh-subscription-grid aside > h3 {
    color: #0f172a;
    font-size: 16px;
    font-weight: 800;
    margin: 0 0 18px;
}

.kh-subscription-payment {
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    gap: 11px;
    margin-bottom: 18px;
    padding-bottom: 18px;
}

.kh-subscription-mollie {
    align-items: center;
    background: #fff;
    border: 1px solid #d9e2eb;
    border-radius: 6px;
    color: #000;
    display: inline-flex;
    font-size: 18px;
    font-weight: 900;
    height: 40px;
    justify-content: center;
    width: 40px;
}

.kh-subscription-payment div {
    display: grid;
}

.kh-subscription-payment strong {
    color: #334155;
    font-size: 11px;
}

.kh-subscription-payment small {
    color: #8491a3;
    font-size: 9px;
}

.kh-subscription-cancel-copy,
.kh-subscription-help {
    color: #64748b;
    font-size: 11px;
    line-height: 1.55;
}

.kh-subscription-help {
    border-top: 1px solid #e2e8f0;
    margin: 18px 0 0;
    padding-top: 15px;
}

.kh-subscription-help a {
    color: #0f9488;
    font-weight: 700;
}

@media (max-width: 820px) {
    .kh-subscription-grid {
        grid-template-columns: 1fr;
    }

    .kh-subscription-welcome {
        grid-template-columns: 42px 1fr;
    }

    .kh-subscription-welcome .btn {
        grid-column: span 2;
    }
}

@media (max-width: 560px) {
    .kh-subscription-header {
        gap: 12px;
    }

    .kh-subscription-panel {
        padding: 20px;
    }

    .kh-subscription-plan-title h3 {
        font-size: 22px;
    }
}