/**
 * AICT Account Dashboard Styles
 * @since 1.14.0
 */

/* [contrast-audit 2026-06-04] Theme-flipping tokens for inline muted text / links.
   A single static colour can't satisfy both themes (muted grey must be dark enough on
   the white light card AND light enough on the #1e293b dark card — opposite directions).
   Inline styles in class-aict-account-dashboard.php reference these via var() with a
   light-safe fallback. */
.aict-dashboard, .aict-account-login {
    --aict-dash-muted: #475569; /* [2026-06-15 readability] 6.9:1 on white (was #64748b 4.76:1) */
    --aict-dash-link:  #4f46e5; /* 5.99:1 on white */
    --aict-dash-text:  #1e293b; /* [2026-09-01 cg4 register] strong/body ink, 14.63:1 on white */
}
/* [2026-06-15] Catch inline + literal muted text that bypassed the token, so it adapts to
   theme (was stuck at #64748b -> failed 4.5:1 on dark cards, 3.75-3.97:1). */
.aict-dashboard [style*="color:#64748b"],
.aict-account-login [style*="color:#64748b"] {
    color: var(--aict-dash-muted) !important;
}
[data-theme="dark"] .aict-dashboard, [data-theme="dark"] .aict-account-login {
    --aict-dash-muted: #94a3b8; /* 5.71:1 on #1e293b */
    --aict-dash-link:  #818cf8; /* on #1e293b */
    --aict-dash-text:  #f1f5f9; /* [2026-09-01 cg4 register] 13.35:1 on #1e293b */
}
/* [2026-09-01 cg4 register] The register error box (inline background:#fef2f2,
   class-aict-account-dashboard.php ~:4548) is never retinted in the dark stamp
   (only .aict-secpage has a #fef2f2 shim), and on the email-exists path it
   carries a "Sign in instead" link that consumes --aict-dash-link: #818cf8 on
   #fef2f2 is 2.73:1. Light surface keeps light-surface ink (5.75:1). */
[data-theme="dark"] .aict-login-card [style*="background:#fef2f2"] {
    --aict-dash-link: #4f46e5;
}

/* ---- Login Page ---- */
.aict-account-login {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 40vh;
    padding: 1.5rem 1rem 3rem;
}

/* Password visibility toggle */
.aict-pwd-wrapper {
    position: relative;
    margin-bottom: 0.75rem;
}

.aict-pwd-wrapper input {
    width: 100%;
    padding: 0.75rem 2.75rem 0.75rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.9375rem;
    outline: none;
    transition: border-color var(--aict-transition-fast);
    box-sizing: border-box;
}

.aict-pwd-toggle {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    color: var(--aict-dash-muted);
    padding: 0;
    display: flex;
    align-items: center;
    line-height: 1;
}

.aict-pwd-toggle:hover {
    color: #5c5fe6;
}

/* Spin animation for loading spinner */
@keyframes aict-spin {
    to { transform: rotate(360deg); }
}

.aict-spinner {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255,255,255,0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: aict-spin var(--aict-animation-spin-dur, 0.8s) linear infinite;
    vertical-align: middle;
    margin-right: 8px;
}

.aict-login-card {
    /* [2026-09-13] The register benefits' check marks were inline
       color:#22c55e -> 2.28:1 on this white card (#567). They cannot take a
       fixed colour: the same glyph sits on #1e293b in all three dark states,
       where a light-safe green would fail instead. So it becomes a token,
       defined in the SAME three places this card's surface is decided, and
       flipped with it -- the mechanism the --aict-dash-* tokens below already
       use ("ink follows the surface it sits on"). Measured on live prod:
       light 2.28 -> 5.48:1, the three dark states 6.42 -> 7.61:1. */
    --aict-dash-success: #047857;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    padding: 3rem 2.5rem;
    max-width: 440px;
    width: 100%;
    text-align: center;
}

.aict-login-icon {
    margin-bottom: 1.5rem;
}

.aict-login-card h1 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 0.75rem;
}

.aict-login-subtitle {
    color: var(--aict-dash-muted);
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0 0 2rem;
}

.aict-login-register {
    margin-top: 1.5rem;
    color: var(--aict-dash-muted);
    font-size: 0.9rem;
}

.aict-login-register a {
    color: #5c5fe6;
    text-decoration: none;
    font-weight: 600;
}

.aict-login-register a:hover {
    text-decoration: underline;
}

/* ---- Buttons ---- */
.aict-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: var(--aict-transition-fast);
    line-height: 1.4;
}

.aict-btn-primary {
    background: #0E62FF;
    color: #fff;
}
.aict-btn-primary:hover {
    background: #0d4dcc;
    color: #fff;
    text-decoration: none;
}

.aict-btn-secondary {
    background: #f1f5f9;
    color: #475569;
}
.aict-btn-secondary:hover {
    background: #e2e8f0;
    color: #1e293b;
    text-decoration: none;
}

.aict-btn-ghost {
    background: transparent;
    color: var(--aict-dash-muted);
}
.aict-btn-ghost:hover {
    background: #f8fafc;
    color: #1e293b;
    text-decoration: none;
}

.aict-btn-large {
    padding: 0.875rem 2rem;
    font-size: 1rem;
    width: 100%;
}

.aict-btn-sm {
    padding: 0.4rem 0.875rem;
    font-size: 0.8rem;
}

.aict-btn-manage-sub {
    background: #0E62FF !important;
    color: #fff !important;
    margin-top: 1rem;
    width: 100%;
    justify-content: center;
}

.aict-btn-manage-sub:hover {
    background: #0d4dcc !important;
}

/* ---- Dashboard Layout ---- */
.aict-dashboard {
    max-width: 1100px;
    margin: 0 auto;
    padding: 2rem 1.5rem 4rem;
}

.aict-dashboard-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e2e8f0;
}

.aict-dashboard-greeting h1 {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 0.25rem;
}

.aict-dashboard-email {
    color: var(--aict-dash-muted);
    font-size: 0.9rem;
    margin: 0;
    /* [UX-05 audit fix 2026-04-29] Long emails would break dashboard h1 grid
       on mobile (<480px). Constrain + ellipsis. */
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* [UX-05 audit fix 2026-04-29] Tab transitions — was instant show/hide via
   `hidden` attribute. Now panels fade in on reveal via CSS animation that
   fires on every transition from hidden→visible (the `hidden` attr triggers
   browser to redraw, which restarts the animation). 0.18s feels responsive
   without being draggy. Respects prefers-reduced-motion. */
[data-tab-section]:not([hidden]) {
    animation: aict-tabpanel-fade var(--aict-motion-fast) ease-out;
}
@keyframes aict-tabpanel-fade {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    [data-tab-section]:not([hidden]) { animation: none; }
}

.aict-dashboard-actions {
    display: flex;
    gap: 0.75rem;
}

.aict-dashboard-grid {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 1.5rem;
    align-items: start;
}

.aict-dashboard-col-main {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.aict-dashboard-col-side {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ---- Section dividers ---- */
.aict-dashboard-section-divider {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0.25rem 0 -0.5rem;
}
.aict-dashboard-section-divider::before,
.aict-dashboard-section-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e2e8f0;
}
.aict-dashboard-section-divider span {
    font-size: 11px;
    font-weight: 600;
    color: var(--aict-dash-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    white-space: nowrap;
}

/* ---- Cards ---- */
.aict-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.aict-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #f1f5f9;
}

.aict-card-header h2 {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.aict-card-body {
    padding: 1.25rem;
}

/* ---- Badges ---- */
.aict-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.75rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.aict-badge-pro {
    /* [WCAG-AA 2026-06-18] left stop #5c5fe6 was 4.47:1 with #fff, right stop
       #8b5cf6 was 4.23:1. Deepened to #4f46e5 (6.29:1) and #7c3aed (5.70:1)
       so the badge passes AA along the full gradient. */
    background: linear-gradient(135deg, #4f46e5, #7c3aed);
    color: #fff;
}

.aict-badge-free {
    background: #f1f5f9;
    color: #475569; /* 6.92:1 on #f1f5f9 (was #64748b = 4.34:1) */
}

/* ---- Subscription Card ---- */
.aict-subscription-card {
    border: 1px solid #f1f5f9;
    transition: box-shadow var(--aict-transition-fast);
}

.aict-subscription-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.aict-sub-details {
    margin-bottom: 1.25rem;
}

.aict-sub-row {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f8fafc;
}

.aict-sub-row:last-child {
    border-bottom: none;
}

.aict-sub-label {
    color: var(--aict-dash-muted);
    font-size: 0.875rem;
}

.aict-sub-value {
    color: #1e293b;
    font-size: 0.875rem;
    font-weight: 600;
}

.aict-sub-warning .aict-sub-value {
    color: #b45309; /* amber-700, 4.95:1 on white (was #f59e0b = 2.15:1, fail) */
}
[data-theme="dark"] .aict-sub-warning .aict-sub-value {
    color: #fbbf24; /* amber-400 on dark card #1e293b */
}

.aict-sub-free-text {
    color: var(--aict-dash-muted);
    font-size: 0.9rem;
    margin: 0 0 1rem;
    line-height: 1.6;
}

/* ---- Usage Card ---- */
.aict-usage-meter {
    margin-bottom: 0.5rem;
}

.aict-usage-bar {
    height: 10px;
    background: #f1f5f9;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 0.75rem;
}

.aict-usage-fill {
    height: 100%;
    background: linear-gradient(90deg, #5c5fe6, #818cf8);
    border-radius: 5px;
    transition: width 0.6s ease;
}

.aict-usage-fill.unlimited {
    background: linear-gradient(90deg, #5c5fe6, #a78bfa);
}

.aict-usage-text {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.aict-usage-count {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1e293b;
}

.aict-usage-label {
    color: var(--aict-dash-muted);
    font-size: 0.875rem;
}

.aict-usage-unlimited {
    font-size: 1.25rem;
    font-weight: 700;
    color: #5c5fe6;
}

.aict-usage-reset {
    color: var(--aict-dash-muted);
    font-size: 0.8rem;
    margin: 0;
}

/* ---- Recent Tools List ---- */
.aict-recent-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.aict-recent-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.625rem 0;
    border-bottom: 1px solid #f8fafc;
}

.aict-recent-item:last-child {
    border-bottom: none;
}

.aict-recent-item a {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    flex: 1;
    min-width: 0;
}

.aict-recent-name {
    color: #1e293b;
    font-weight: 500;
    font-size: 0.9rem;
}

.aict-recent-item a:hover .aict-recent-name {
    color: #5c5fe6;
}

.aict-recent-category {
    color: var(--aict-dash-muted);
    font-size: 0.75rem;
    margin-top: 0.125rem;
}

.aict-recent-time {
    color: var(--aict-dash-muted);
    font-size: 0.75rem;
    white-space: nowrap;
    margin-left: 1rem;
}

/* ---- Favorites List ---- */
.aict-favorites-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.aict-favorite-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f8fafc;
}

.aict-favorite-item:last-child {
    border-bottom: none;
}

.aict-favorite-item a {
    color: #1e293b;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
}

.aict-favorite-item a:hover {
    color: #5c5fe6;
}

.aict-favorite-remove {
    background: none;
    border: none;
    color: #cbd5e1;
    font-size: 1.1rem;
    cursor: pointer;
    padding: 0 0.25rem;
    line-height: 1;
}

.aict-favorite-remove:hover {
    color: #ef4444;
}

/* ---- Suggested Posts ---- */
.aict-suggested-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.aict-suggested-item {
    padding: 0.625rem 0;
    border-bottom: 1px solid #f8fafc;
}

.aict-suggested-item:last-child {
    border-bottom: none;
}

.aict-suggested-item a {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    text-decoration: none;
    gap: 1rem;
}

.aict-suggested-title {
    color: #1e293b;
    font-size: 0.875rem;
    font-weight: 500;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.aict-suggested-item a:hover .aict-suggested-title {
    color: #5c5fe6;
}

.aict-suggested-date {
    color: var(--aict-dash-muted);
    font-size: 0.75rem;
    white-space: nowrap;
}

/* ---- Quick Links ---- */
.aict-links-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.aict-links-list li {
    padding: 0.5rem 0;
    border-bottom: 1px solid #f8fafc;
}

.aict-links-list li:last-child {
    border-bottom: none;
}

.aict-links-list a {
    color: #475569;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
}

.aict-links-list a:hover {
    color: #5c5fe6;
}

.aict-link-upgrade {
    color: #5c5fe6 !important;
    font-weight: 600 !important;
}

/* ---- Empty States ---- */
.aict-empty-state {
    color: var(--aict-dash-muted);
    font-size: 0.875rem;
    text-align: center;
    padding: 1rem 0;
    margin: 0;
    line-height: 1.6;
}

.aict-empty-state a {
    color: #5c5fe6;
    text-decoration: none;
    font-weight: 600;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
    .aict-dashboard {
        padding: 1.5rem 1rem 3rem;
    }

    .aict-dashboard-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .aict-dashboard-greeting h1 {
        font-size: 1.35rem;
    }

    .aict-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .aict-dashboard-col-side {
        order: -1;
    }
}

@media (max-width: 480px) {
    .aict-login-card {
        padding: 2rem 1.5rem;
    }

    .aict-dashboard-actions {
        width: 100%;
    }

    .aict-dashboard-actions .aict-btn {
        flex: 1;
        text-align: center;
    }
}

/* ---- Card count badge ---- */
.aict-card-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
    color: #475569; /* 6.92:1 on #f1f5f9 (was #64748b = 4.34:1) */
    font-size: 0.7rem;
    font-weight: 700;
    border-radius: 20px;
    padding: 0.1rem 0.55rem;
    min-width: 22px;
}

/* ---- Usage Stats Grid ---- */
.aict-usage-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    margin-bottom: 1.25rem;
    border: 1px solid #f1f5f9;
    border-radius: 10px;
    overflow: hidden;
}

.aict-usage-stat {
    padding: 0.875rem 0.75rem;
    text-align: center;
    border-right: 1px solid #f1f5f9;
}

.aict-usage-stat:last-child {
    border-right: none;
}

.aict-usage-stat-value {
    font-size: 1.625rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.1;
    margin-bottom: 0.25rem;
}

.aict-usage-inf {
    color: #5c5fe6;
}

.aict-usage-stat-label {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--aict-dash-muted);
}

.aict-usage-quota {
    margin-top: 0.25rem;
}

.aict-usage-quota-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.8125rem;
    color: var(--aict-dash-muted);
    margin-top: 0.5rem;
    margin-bottom: 0.375rem;
}

.aict-usage-remaining {
    font-weight: 600;
    color: #1e293b;
}

.aict-usage-fill.danger {
    background: linear-gradient(90deg, #f59e0b, #ef4444);
}

.aict-usage-pro-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #ede9fe, #e0e7ff);
    color: #4f46e5;
    font-size: 0.8125rem;
    font-weight: 600;
    padding: 0.5rem 0.875rem;
    border-radius: 8px;
    margin-top: 0.25rem;
}

/* ---- Recent activity prompt preview ---- */
.aict-recent-item-link {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    flex: 1;
    min-width: 0;
}

.aict-recent-prompt {
    font-size: 0.75rem;
    color: var(--aict-dash-muted);
    font-style: italic;
    margin-top: 0.125rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.aict-recent-item-link:hover .aict-recent-name {
    color: #5c5fe6;
}

/* ---- Account Settings card ---- */
.aict-settings-card .aict-card-body {
    padding: 0;
}

.aict-settings-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1.25rem;
    border-bottom: 1px solid #f8fafc;
    gap: 1rem;
}

.aict-settings-row:last-of-type {
    border-bottom: none;
}

.aict-settings-label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--aict-dash-muted);
    white-space: nowrap;
    min-width: 90px;
}

.aict-settings-value {
    flex: 1;
    text-align: right;
}

.aict-settings-email,
.aict-settings-text {
    font-size: 0.875rem;
    color: #1e293b;
    font-weight: 500;
    word-break: break-all;
}

.aict-lang-select {
    padding: 0.35rem 0.625rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.8125rem;
    color: #1e293b;
    background: #fff;
    cursor: pointer;
    outline: none;
    transition: border-color var(--aict-transition-fast);
    max-width: 160px;
}

.aict-lang-select:focus {
    border-color: #5c5fe6;
}

.aict-settings-actions {
    padding: 0.75rem 1.25rem;
    border-top: 1px solid #f1f5f9;
}

.aict-settings-signout {
    font-size: 0.8125rem;
    color: var(--aict-dash-muted);
    text-decoration: none;
}

.aict-settings-signout:hover {
    color: #ef4444;
}

/* ---- Saved Prompts card ---- */
.aict-prompts-gate-text {
    color: var(--aict-dash-muted);
    font-size: 0.875rem;
    margin: 0 0 0.875rem;
    line-height: 1.5;
}

.aict-prompts-library-link a {
    font-size: 0.8125rem;
    color: #5c5fe6;
    text-decoration: none;
    font-weight: 500;
}

.aict-prompts-library-link a:hover {
    text-decoration: underline;
}

.aict-presets-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.aict-preset-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.575rem 0;
    border-bottom: 1px solid #f8fafc;
    gap: 0.75rem;
}

.aict-preset-item:last-child {
    border-bottom: none;
}

.aict-preset-link {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    flex: 1;
    min-width: 0;
}

.aict-preset-link:hover .aict-preset-name {
    color: #5c5fe6;
}

.aict-preset-name {
    font-size: 0.875rem;
    font-weight: 500;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.aict-preset-tool {
    font-size: 0.75rem;
    color: var(--aict-dash-muted);
    margin-top: 0.1rem;
}

.aict-preset-date {
    font-size: 0.75rem;
    color: var(--aict-dash-muted);
    white-space: nowrap;
}

.aict-presets-more {
    padding-top: 0.5rem;
}

.aict-presets-more a {
    font-size: 0.8rem;
    color: var(--aict-dash-muted);
    text-decoration: none;
}

.aict-presets-more a:hover {
    color: #5c5fe6;
}

/* ---- Settings row responsive ---- */
@media (max-width: 480px) {
    .aict-settings-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.375rem;
    }

    .aict-settings-value {
        text-align: left;
    }

    .aict-usage-stats-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .aict-usage-stat-value {
        font-size: 1.35rem;
    }
}

/* ─────────────────────────────────────────────────────────────
   Box-sizing — prevent card overflow on all screen sizes
───────────────────────────────────────────────────────────────── */
.aict-dashboard,
.aict-dashboard * {
    box-sizing: border-box;
}

/* ─────────────────────────────────────────────────────────────
   Dashboard Tab Navigation — horizontal-scrollable on mobile
───────────────────────────────────────────────────────────────── */
.aict-dashboard-tabs {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    border-bottom: 2px solid #e2e8f0;
    margin-bottom: 1.5rem;
    flex-wrap: nowrap;
    gap: 0;
}

.aict-dashboard-tabs::-webkit-scrollbar {
    display: none;
}

.aict-dashboard-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--aict-dash-muted);
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 2.5px solid transparent;
    margin-bottom: -2px;
    transition: color var(--aict-transition-fast), border-color var(--aict-transition-fast);
    flex-shrink: 0;
    background: none;
    border-left: none;
    border-right: none;
    border-top: none;
    cursor: pointer;
}

.aict-dashboard-tab:hover {
    color: #5c5fe6;
    text-decoration: none;
}

.aict-dashboard-tab.is-active {
    color: #5c5fe6;
    border-bottom-color: #5c5fe6;
    font-weight: 600;
}

/* ─────────────────────────────────────────────────────────────
   Mobile overflow / padding improvements
───────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .aict-dashboard {
        overflow-x: hidden;
    }

    /* Extend tabs edge-to-edge on mobile + scroll-snap so users can swipe
       between tabs and feel each one click into place (UX-05 audit fix) */
    .aict-dashboard-tabs {
        margin-left: -1rem;
        margin-right: -1rem;
        padding-left: 1rem;
        padding-right: 1rem;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }
    .aict-dashboard-tab {
        scroll-snap-align: start;
    }

    /* Ensure cards never overflow viewport */
    .aict-card {
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    .aict-dashboard {
        padding-left: 1rem;
        padding-right: 1rem;
        padding-top: 0.75rem;
    }

    .aict-card-header {
        padding: 0.75rem 1rem;
    }

    .aict-card-body {
        padding: 1rem;
    }

    .aict-settings-actions {
        padding: 0.625rem 1rem;
    }

    .aict-lang-select {
        max-width: 100%;
        width: 100%;
    }

    .aict-usage-stat {
        padding: 0.75rem 0.5rem;
    }

    /* Reduce oversized numbers on very small screens */
    .aict-usage-stat-value {
        font-size: 1.25rem;
    }
}

/* ─────────────────────────────────────────────────────────────
   Quick Actions Banner — above dashboard grid
───────────────────────────────────────────────────────────────── */
.aict-quick-actions-banner {
    margin: 0 0 1.5rem 0;
    padding: 0.875rem 1rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.aict-quick-actions-container {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    gap: 0.875rem;
    flex-wrap: wrap;
    align-items: center;
}

.aict-quick-action-button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.875rem;
    background: #ffffff;
    color: #334155;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.8125rem;
    cursor: pointer;
    transition: var(--aict-transition-fast);
    line-height: 1.4;
}

.aict-quick-action-button:hover {
    background: #eff6ff;
    border-color: #0E62FF;
    color: #0E62FF;
    text-decoration: none;
}

.aict-quick-action-button.aict-qa-primary {
    background: #0E62FF;
    border-color: #0E62FF;
    color: #ffffff;
    font-weight: 600;
    padding: 0.5rem 1rem;
}

.aict-quick-action-button.aict-qa-primary:hover {
    background: #0d4dcc;
    border-color: #0d4dcc;
    color: #ffffff;
}

.aict-quick-action-button.aict-qa-upgrade {
    background: #00C2A8;
    border-color: #00C2A8;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
}

.aict-quick-action-button.aict-qa-upgrade:hover {
    background: #00a894;
    border-color: #00a894;
}

.aict-quick-action-button svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* Mobile: stack buttons vertically */
@media (max-width: 640px) {
    .aict-quick-actions-banner {
        margin: 0 0 1rem 0;
        padding: 0.75rem;
    }

    .aict-quick-actions-container {
        gap: 0.5rem;
    }

    .aict-quick-action-button {
        flex: 1;
        min-width: 140px;
        justify-content: center;
        padding: 0.625rem 1rem;
        font-size: 0.8125rem;
    }

    .aict-quick-action-button span {
        display: none;
    }

    .aict-quick-action-button.aict-qa-primary span,
    .aict-quick-action-button.aict-qa-upgrade span {
        display: inline;
    }
}

/* ─────────────────────────────────────────────────────────────
   Dark mode — Quick Actions
───────────────────────────────────────────────────────────────── */
[data-theme="dark"] .aict-quick-actions-banner {
    background: #0f172a;
    border: 1px solid #1e293b;
}

[data-theme="dark"] .aict-quick-action-button {
    background: #1e293b;
    border-color: #334155;
    color: #e2e8f0;
}

[data-theme="dark"] .aict-quick-action-button:hover {
    background: #0E62FF;
    border-color: #0E62FF;
    color: #ffffff;
}

[data-theme="dark"] .aict-quick-action-button.aict-qa-primary {
    background: #0E62FF;
    border-color: #0E62FF;
    color: #ffffff;
}

/* ─────────────────────────────────────────────────────────────
   Dark mode — [data-theme="dark"] overrides
───────────────────────────────────────────────────────────────── */

/* Login */
[data-theme="dark"] .aict-login-card {
    --aict-dash-success: #34d399;   /* flips with the surface -- see .aict-login-card */
    background: #1e293b;
    box-shadow: 0 4px 24px rgba(0,0,0,0.4);
}
[data-theme="dark"] .aict-login-card h1     { color: #f1f5f9; }
[data-theme="dark"] .aict-login-subtitle    { color: #94a3b8; }
[data-theme="dark"] .aict-login-register    { color: #94a3b8; }
[data-theme="dark"] .aict-pwd-wrapper input {
    background: #0f172a;
    border-color: #334155;
    color: #f1f5f9;
}
[data-theme="dark"] .aict-pwd-toggle        { color: #94a3b8; } /* [2026-06-07] #64748b was 3:1 on dark */

/* Dashboard shell */
[data-theme="dark"] .aict-dashboard-header  { border-bottom-color: #334155; }
[data-theme="dark"] .aict-dashboard-greeting h1 { color: #f1f5f9; }
[data-theme="dark"] .aict-dashboard-email   { color: #94a3b8; }

/* Tab nav */
[data-theme="dark"] .aict-dashboard-tabs    { border-bottom-color: #334155; }
[data-theme="dark"] .aict-dashboard-tab     { color: #94a3b8; }
[data-theme="dark"] .aict-dashboard-tab:hover { color: #a5b4fc; }
[data-theme="dark"] .aict-dashboard-tab.is-active {
    color: #818cf8;
    border-bottom-color: #818cf8;
}

/* Cards */
[data-theme="dark"] .aict-card {
    background: #1e293b;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4), 0 1px 2px rgba(0,0,0,0.3);
}
[data-theme="dark"] .aict-card-header       { border-bottom-color: #334155; }
[data-theme="dark"] .aict-card-header h2    { color: #f1f5f9; }
[data-theme="dark"] .aict-card-count        { background: #334155; color: #cbd5e1; }

/* Badges */
[data-theme="dark"] .aict-badge-free        { background: #334155; color: #cbd5e1; }

/* Buttons */
[data-theme="dark"] .aict-btn-primary       { background: #0E62FF; }
[data-theme="dark"] .aict-btn-primary:hover { background: #0d4dcc; }
[data-theme="dark"] .aict-btn-secondary     { background: #334155; color: #cbd5e1; }
[data-theme="dark"] .aict-btn-secondary:hover { background: #475569; color: #f1f5f9; }
[data-theme="dark"] .aict-btn-ghost         { color: #94a3b8; }
[data-theme="dark"] .aict-btn-ghost:hover   { background: #334155; color: #f1f5f9; }
[data-theme="dark"] .aict-btn-manage-sub    { background: #0E62FF !important; }
[data-theme="dark"] .aict-btn-manage-sub:hover { background: #0d4dcc !important; }

/* Subscription */
[data-theme="dark"] .aict-subscription-card { border-color: #334155; }
[data-theme="dark"] .aict-sub-row           { border-bottom-color: #334155; }
[data-theme="dark"] .aict-sub-label         { color: #94a3b8; }
[data-theme="dark"] .aict-sub-value         { color: #f1f5f9; }
[data-theme="dark"] .aict-sub-free-text     { color: #94a3b8; }

/* Usage */
[data-theme="dark"] .aict-usage-stats-grid  { border-color: #334155; }
[data-theme="dark"] .aict-usage-stat        { border-right-color: #334155; }
[data-theme="dark"] .aict-usage-stat-value  { color: #f1f5f9; }
[data-theme="dark"] .aict-usage-bar         { background: #334155; }
[data-theme="dark"] .aict-usage-quota-row   { color: #94a3b8; }
[data-theme="dark"] .aict-usage-remaining   { color: #f1f5f9; }
[data-theme="dark"] .aict-usage-pro-badge {
    background: linear-gradient(135deg, #1e1b4b, #1e293b);
    color: #a5b4fc;
}

/* Recent activity */
[data-theme="dark"] .aict-recent-item       { border-bottom-color: #334155; }
[data-theme="dark"] .aict-recent-name       { color: #f1f5f9; }
[data-theme="dark"] .aict-recent-category,
[data-theme="dark"] .aict-recent-time,
[data-theme="dark"] .aict-recent-prompt     { color: #94a3b8; }
[data-theme="dark"] .aict-recent-item-link:hover .aict-recent-name { color: #818cf8; }

/* Favorites */
[data-theme="dark"] .aict-favorite-item     { border-bottom-color: #334155; }
[data-theme="dark"] .aict-favorite-item a   { color: #f1f5f9; }
[data-theme="dark"] .aict-favorite-item a:hover { color: #818cf8; }
[data-theme="dark"] .aict-favorite-remove   { color: #94a3b8; }

/* Suggested posts */
[data-theme="dark"] .aict-suggested-item    { border-bottom-color: #334155; }
[data-theme="dark"] .aict-suggested-title   { color: #f1f5f9; }

/* Quick links */
[data-theme="dark"] .aict-links-list li     { border-bottom-color: #334155; }
[data-theme="dark"] .aict-links-list a      { color: #cbd5e1; }
[data-theme="dark"] .aict-links-list a:hover { color: #818cf8; }
[data-theme="dark"] .aict-link-upgrade      { color: #818cf8 !important; }

/* Empty states */
[data-theme="dark"] .aict-empty-state       { color: #94a3b8; }
[data-theme="dark"] .aict-empty-state a     { color: #818cf8; }

/* Account settings */
[data-theme="dark"] .aict-settings-row      { border-bottom-color: #334155; }
[data-theme="dark"] .aict-settings-label    { color: #94a3b8; }
[data-theme="dark"] .aict-settings-email,
[data-theme="dark"] .aict-settings-text     { color: #f1f5f9; }
[data-theme="dark"] .aict-lang-select {
    background: #334155;
    border-color: #475569;
    color: #f1f5f9;
}
[data-theme="dark"] .aict-settings-actions  { border-top-color: #334155; }
[data-theme="dark"] .aict-settings-signout  { color: #94a3b8; }

/* Saved prompts */
[data-theme="dark"] .aict-preset-item       { border-bottom-color: #334155; }
[data-theme="dark"] .aict-preset-name       { color: #f1f5f9; }
[data-theme="dark"] .aict-preset-tool,
[data-theme="dark"] .aict-preset-date       { color: #94a3b8; }
[data-theme="dark"] .aict-prompts-gate-text { color: #94a3b8; }
[data-theme="dark"] .aict-prompts-library-link a { color: #818cf8; }

/* ---------------------------------------------------------------
   v1.98.1: Dashboard tab pill styling + welcome block
   --------------------------------------------------------------- */
.aict-dashboard-tabs {
    display: flex !important;
    flex-wrap: wrap;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 4px;
    gap: 2px;
    margin-bottom: 1.25rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.aict-dashboard-tab {
    flex: 1 1 auto;
    min-width: max-content;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
    background: transparent;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    text-decoration: none;
    transition: var(--aict-transition-fast);
    white-space: nowrap;
}

.aict-dashboard-tab:hover {
    color: #0e62ff;
    background: rgba(14,98,255,0.06);
}

.aict-dashboard-tab.is-active,
.aict-dashboard-tab.active,
.aict-dashboard-tab[aria-current="page"] {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0e62ff 0%, #5c5fe6 100%);
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(14,98,255,0.25);
}

.aict-dashboard-tab:focus-visible {
    outline: 2px solid #0e62ff;
    outline-offset: 2px;
}

/* Welcome / empty-state helper */
.aict-dashboard-welcome {
    background: linear-gradient(135deg, #eff6ff 0%, #ede9fe 100%);
    border: 1px solid #c7d2fe;
    border-radius: 14px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 1rem;
    align-items: center;
}

.aict-dashboard-welcome-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0e62ff, #5c5fe6);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0;
}

.aict-dashboard-welcome-text h3 {
    margin: 0 0 0.25rem;
    font-size: 1.0625rem;
    font-weight: 700;
    color: #0b1b35;
}

.aict-dashboard-welcome-text p {
    margin: 0;
    color: #475569;
    font-size: 0.875rem;
    line-height: 1.5;
}

.aict-dashboard-welcome-cta {
    background: #0e62ff;
    color: #fff !important;
    padding: 0.625rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none;
    white-space: nowrap;
    transition: background var(--aict-transition-fast);
}

.aict-dashboard-welcome-cta:hover {
    background: #0a4fd6;
}

@media (max-width: 640px) {
    .aict-dashboard-welcome {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .aict-dashboard-welcome-icon {
        margin: 0 auto;
    }
}

/* Strengthen card shadows + borders for better hierarchy */
.aict-dashboard .aict-card-header h2 {
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #0b1b35;
}


/* ---------------------------------------------------------------
   v1.98.2: Dashboard header — side-by-side avatar + greeting, tight layout
   --------------------------------------------------------------- */
.aict-dashboard-greeting {
    display: flex !important;
    align-items: center;
    gap: 1rem;
    flex: 1;
    min-width: 0;
}

.aict-dashboard-greeting > div {
    min-width: 0;
    flex: 1;
}

.aict-dashboard-avatar-wrap {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    background: linear-gradient(135deg, #eff6ff 0%, #ede9fe 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.aict-dashboard-avatar-wrap img,
.aict-dashboard-avatar-wrap .aict-dashboard-avatar,
.aict-dashboard-avatar-wrap .avatar {
    width: 48px !important;
    height: 48px !important;
    max-width: 48px !important;
    max-height: 48px !important;
    border-radius: 50% !important;
    object-fit: cover;
    display: block;
}

/* Tighten H1 so header doesn't dominate */
.aict-dashboard-header h1 {
    font-size: 1.375rem !important;
    line-height: 1.3;
    margin: 0 0 0.125rem !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.aict-dashboard-email {
    font-size: 0.8125rem !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.aict-dashboard-header {
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
}

.aict-dashboard-actions {
    flex-shrink: 0;
}

@media (max-width: 640px) {
    .aict-dashboard-header h1 { font-size: 1.125rem !important; }
    .aict-dashboard-avatar-wrap,
    .aict-dashboard-avatar-wrap img { width: 40px !important; height: 40px !important; }
}

/* Dark-mode: tone down pill tabs */
[data-theme="dark"] .aict-dashboard-tabs {
    background: #1e293b;
    border-color: #334155;
}
[data-theme="dark"] .aict-dashboard-tab { color: #94a3b8; }
[data-theme="dark"] .aict-dashboard-tab:hover {
    color: #a5b4fc;
    background: rgba(99, 102, 241, 0.12);
}
[data-theme="dark"] .aict-dashboard-tab.is-active,
[data-theme="dark"] .aict-dashboard-tab.active,
[data-theme="dark"] .aict-dashboard-tab[aria-current="page"] {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0e62ff 0%, #5c5fe6 100%);
}

/* ============================================================
   F-DARK-CONTRAST phase 2: OS-level dark mode (WCAG AA)
   Tokens: #f1f5f9 on #0f172a = 15.8:1 (AAA) for headings
           #cbd5e1 on #0f172a = 12.3:1 (AAA) for body
           #94a3b8 on #1e293b = 5.1:1  (AA)  for subdued labels
           #a5b4fc on #0f172a = 8.1:1  (AAA) for accent links
   Scoped to .aict-dashboard / .aict-account-login / .aict-card namespaces.
   ============================================================ */
@media (prefers-color-scheme: dark) {
    /* [2026-08-28 audit w6] .aict-login-card was MISSING from this block:
       the page + headings went dark/light but the white card kept its base
       background, so "Sign In to Your Account" rendered light-on-white for
       every system-dark visitor (stamped light; this unguarded block still
       fires). Surface follows its text — UX_INVARIANTS #1. */
    .aict-login-card {
        background: #1e293b;
        border-color: #334155;
    }
    /* [2026-10-03 FU2-A11Y] The consent notice under the social buttons
       (social_notice_html(): "Privacy Policy", "Terms of Service") was left
       out of this block the same way. Its two links carry an inline
       color:#4338ca, ink for the WHITE card, and in this state nothing
       re-inks them: their dark twin is html[data-theme="dark"]
       [style*="color:#4338ca"] in mu-plugins/aict-dark-contrast-2026.php,
       which a document stamped light never matches. Contrast guard, /account/,
       osdark-noprefs, 390 and 1366: #4338ca on this card's #1e293b = 1.85:1,
       the four failures that kept the gate red from 2026-10-02.
       The ink goes here, under the same signal as the surface rule above and
       next to it, so the two cannot drift apart; !important only because the
       colour it replaces is an inline style. #a5b4fc on #1e293b = 7.34:1, the
       value the stamped-dark rule already paints. If this block is ever
       guarded with html:not([data-theme="light"]) (follow-up 3 of #568), move
       this rule with the surface: on the white card the inline #4338ca is
       right (7.9:1). Guarding the surface rule ALONE is not that fix:
       measured 2026-10-03, it whitens the card under ink that the rest of
       this block and aict-contrast-fixes-2026.css keep light, and trades
       these 4 failures for 20 (h1 1.10:1, labels 1.48:1, links 1.99:1). */
    .aict-login-card .aict-social-notice a {
        color: #a5b4fc !important;
        -webkit-text-fill-color: #a5b4fc !important;
    }
    /* [2026-09-01 cg4 register] The card above goes dark here, but the
       --aict-dash-* tokens were only re-pointed under [data-theme="dark"], so
       in this no-stamp + OS-dark state every inline var(--aict-dash-*) inside
       the card — and the [style*="color:#64748b"] rescue at the top of this
       file, which routes through --aict-dash-muted — resolved to the LIGHT
       values: "Already have an account?" 1.93:1, "Sign in" 2.33:1 on #1e293b.
       Ink follows the surface it sits on, so the tokens flip on the card
       itself. Values mirror the [data-theme="dark"] block (5.71 / 4.9 / 13.35:1). */
    .aict-login-card {
        --aict-dash-text:    #f1f5f9;
        --aict-dash-muted:   #94a3b8;
        --aict-dash-link:    #818cf8;
        --aict-dash-success: #34d399;
    }
    /* …except the paid-flow order summary (?plan=), which keeps its light
       #f5f3ff surface ONLY while the page is not stamped dark: the dark stamp
       retints it to #1e293b via the mu-plugin [style*="background:#f5f3ff"]
       shim, and this unguarded block also fires for stamp-dark + OS-dark, so
       an unguarded reset would push its "/mo" (rescued to --aict-dash-muted)
       to #475569 on #1e293b = 1.93:1 there. Guard on the stamp: light surface
       keeps light-surface ink (#94a3b8 on #f5f3ff would be 2.34:1), dark
       surface inherits #94a3b8 from the card. */
    html:not([data-theme="dark"]) .aict-login-card .aict-reg-plan-summary {
        --aict-dash-muted: #475569;
    }
    /* The register error box (inline background:#fef2f2, ~:4548) is never
       retinted in any dark state either, and on the email-exists path it holds
       a "Sign in instead" link that consumes --aict-dash-link: #818cf8 on
       #fef2f2 would be 2.73:1, so it keeps light-surface ink (5.75:1). */
    .aict-login-card [style*="background:#fef2f2"] {
        --aict-dash-link: #4f46e5;
    }

    /* [2026-09-01] …and the divider INSIDE that card was missing in exactly the
       same way, one level down. Once .aict-login-card went dark here, the "or"
       between the password form and the social buttons kept its light-surface
       #64748b and measured 3.07:1 on #1e293b — a system-dark visitor, stamped
       light, which is the state this whole block exists for. Its two rules are
       the surface (the ::before/::after lines) and its ink; both move together.
       #cbd5e1 on #1e293b = 9.85:1. */
    .aict-social-divider {
        color: #cbd5e1;
    }
    .aict-social-divider::before,
    .aict-social-divider::after {
        background: #334155;
    }
    /* Page + card surfaces */
    .aict-dashboard,
    .aict-account-login,
    .aict-dashboard-col-main,
    .aict-dashboard-col-side {
        background: #0f172a;
        color: #cbd5e1;
    }
    .aict-card,
    .aict-card-body,
    .aict-card-header,
    .aict-dashboard-avatar-wrap {
        background: #1e293b !important;
        border-color: #334155 !important;
        color: #cbd5e1 !important;
    }

    /* Headings + primary text */
    .aict-dashboard h1,
    .aict-dashboard h2,
    .aict-dashboard h3,
    .aict-dashboard h4,
    .aict-account-login h1,
    .aict-account-login h2,
    .aict-card-header,
    .aict-card-count {
        color: #f1f5f9 !important;
    }

    /* Subdued / secondary text */
    .aict-dashboard p,
    .aict-dashboard li,
    .aict-dashboard label,
    .aict-dashboard .aict-muted,
    .aict-account-login p,
    .aict-account-login label {
        color: #cbd5e1 !important;
    }

    /* Badges */
    .aict-badge-free {
        background: #334155 !important;
        color: #f1f5f9 !important;
    }
    .aict-badge-pro {
        background: #4f46e5 !important;
        color: #fff !important;
    }

    /* Buttons */
    .aict-btn-secondary,
    .aict-btn-ghost {
        background: transparent !important;
        color: #cbd5e1 !important;
        border-color: #334155 !important;
    }
    .aict-btn-secondary:hover,
    .aict-btn-ghost:hover {
        background: #1e293b !important;
        border-color: #475569 !important;
        color: #f1f5f9 !important;
    }
    .aict-btn-primary,
    .aict-btn-manage-sub {
        background: #4f46e5 !important;
        color: #fff !important;
    }
    .aict-btn-primary:hover,
    .aict-btn-manage-sub:hover {
        background: #4f46e5 !important;
    }

    /* Input fields */
    .aict-dashboard input[type="text"],
    .aict-dashboard input[type="email"],
    .aict-dashboard input[type="password"],
    .aict-account-login input[type="text"],
    .aict-account-login input[type="email"],
    .aict-account-login input[type="password"] {
        background: #0f172a !important;
        color: #f1f5f9 !important;
        border-color: #334155 !important;
    }
    .aict-dashboard input::placeholder,
    .aict-account-login input::placeholder {
        color: #94a3b8 !important; /* 6.96:1 on dark input #0f172a (was #64748b = 3.75:1) */
    }

    /* Links */
    .aict-dashboard a,
    .aict-account-login a {
        color: #a5b4fc;
    }
    .aict-dashboard a:hover,
    .aict-account-login a:hover {
        color: #c7d2fe;
    }

    /* Muted / footer / reset-password body */
    .aict-favorite-remove {
        color: #94a3b8 !important;
    }

    /* NOTE: prefixed `html ` on purpose. These rules sit at the same specificity
       as the component's own inline <style>, which the page emits LATER, so source
       order was handing the win back to the light surface -- measured: dark-stamp
       fell to 4 failures (the [data-theme] half outranks a bare class) while
       osdark-noprefs stayed at 58. `html` costs one element and settles it. */
    /* [2026-09-08 ux-wave-3] These were missing from this block for exactly the
       reason .aict-login-card was in August: their surfaces are set
       unconditionally — white, or var(--aict-bg-elevated) which resolves LIGHT
       while the page is stamped light — while the text rules go light for an
       OS-dark visitor. Surface follows its text, UX_INVARIANTS #1.

       Found by giving the contrast guard a session for the first time. Nothing
       had ever measured a logged-in page: 108 failures on this dashboard, 64 of
       them in this exact state, and what fails is the ONBOARDING — the checklist
       title, all eight step labels, the progress bar, all four CTAs.

       Ratios after, on #1e293b: #cbd5e1 9.85:1, #f1f5f9 13.35:1, #a5b4fc 7.34:1.
       On #334155 (the CTA/bar surface): #cbd5e1 6.97:1, #a5b4fc 5.19:1. */
    html .aict-onboarding-checklist       { background: #1e293b; border-color: #334155; }
    html .aict-onboarding-checklist__cta  { background: #334155; border-color: #475569; }
    html .aict-onboarding-checklist__bar  { background: #334155; }
    /* [2026-09-09] Its own label went with it. The percentage reads
       var(--aict-text-muted,#64748b) from the component's inline block and
       measured 2.17:1 once this rule darkened the track underneath it.
       Surface and ink, in the same place, so they cannot drift apart again. */
    html .aict-onboarding-checklist__bar-pct { color: #cbd5e1; }
    html .aict-gam-card                   { background: #1e293b; border-color: #334155; }
    html .aict-pref-card                  { background: #1e293b; border-color: #334155; }
    html .aict-fsc-modal                  { background: #1e293b; }
    html .aict-fsc-card                   { background: #172033; }
    html .aict-quick-action-button        { background: #1e293b; border-color: #334155; }

    /* "Skip for now" is the opposite failure — dark ink sitting on the dark page
       ground rather than on a card: #64748b on #0f172a is 3.75:1. #94a3b8 is
       6.96:1 and matches --aict-dash-muted elsewhere in this block. */
    html .aict-fsc-secondary              { color: #94a3b8; }

    /* [2026-09-09 dashboard sweep] The surface and ink TOKENS have to follow
       the same signal this block does.
       ---------------------------------------------------------------------
       This block darkens the dashboard for every OS-dark visitor, deliberately
       unguarded, even though the document is stamped light. But the site-wide
       tokens are keyed the other way — aict-theme-tokens.css re-points them
       under `:root:not([data-theme="light"])`, which the stamp defeats — so in
       the OS-dark + stamped-light state the containers went dark while every
       nested component that reads var(--aict-bg-elevated), var(--aict-bg-subtle),
       var(--aict-color-bg-elev), var(--aict-color-bg) or var(--aict-dash-*)
       kept its LIGHT value. Half the dashboard followed this block, half
       followed the tokens, and the seam between them is where the failures were.

       This is not a new idea in this file: the .aict-login-card rule ~60 lines
       up already re-points --aict-dash-* for exactly this reason. That fix was
       only ever applied to the login card. This applies it to the rest of the
       dashboard, and adds the surface tokens the card did not need.

       Measured on production, logged in, all four theme states, injected into
       the live page and read back (contrast guard, /account/, 3,232 elements).
       Re-measured against a fresh baseline after #513/#514/#515 deployed,
       because comparing against the older number would have been comparing
       against a site that no longer exists:

           dark-stamp           24 ->  14
           lightos-darkchoice   42 ->  20
           osdark-noprefs      154 -> 102
           light-stamp           0 ->   0
           total               220 -> 136

       Values mirror aict-theme-tokens.css's own dark block, so a component
       cannot end up on a shade the token system does not otherwise produce. */
    .aict-dashboard,
    .aict-account-login,
    .aict-dashboard-col-main,
    .aict-dashboard-col-side {
        --aict-bg:            #0f172a;
        --aict-bg-elevated:   #1e293b;
        --aict-bg-subtle:     #172033;
        --aict-color-bg-elev: #1e293b;
        --aict-color-bg:      #0f172a;
        --aict-dash-text:     #f1f5f9;
        --aict-dash-muted:    #94a3b8;
        --aict-dash-link:     #818cf8;
        --aict-link:          #818cf8;
    }

    /* [2026-09-09] Three more the same re-point exposed, found by measuring
       /account/ again after it shipped rather than by assuming it was done.
       The rival for the settings label is
       `html:not([data-theme="dark"]) … .aict-settings-label` at (0,2,1) — and
       that :not() MATCHES here, because the stamp is light in this state. So
       `html ` is required to draw level and win on order within this file. */
    html .aict-dashboard .aict-settings-label,
    html .aict-dashboard .aict-settings-text  { color: #94a3b8; }
    html .aict-dashboard .aict-settings-email { color: #f1f5f9; }

    /* Two components hard-code a light-mode ink and so never moved with the
       tokens. Both measured 1:1 — the same colour as the surface behind them,
       i.e. invisible, not merely low-contrast. */
    .aict-dashboard .aict-suggested-title { color: #f1f5f9; }
    .aict-dashboard .aict-settings-email,
    .aict-dashboard .aict-settings-text   { color: #f1f5f9; }

    /* [2026-09-09] The inline half of this dashboard, paired.
       ---------------------------------------------------------------------
       The token re-point above gave the dashboard subtree dark INK in the
       OS-dark state. A pre-existing rescue shim,
       `.aict-dashboard [style*="color:#64748b"] -> var(--aict-dash-muted)`,
       then routed a lot of hard-coded inline greys through it. But the
       BACKGROUNDS those greys sit on are also inline, and nothing darkened
       them, so the re-point left #94a3b8 on #f8fafc, #cbd5e1 on #ffffff and
       #f1f5f9 on #fef2f2 across the account panels: dark ink on light card,
       the same seam the re-point was written to close, one level down.

       So: both halves, keyed on both signals, and only inside .aict-dashboard.
       Every hex here was read off a failing measurement, not guessed.

       Measured on /account/, logged in, all four theme states:

           dark-stamp           10 ->  0
           lightos-darkchoice   16 ->  2
           osdark-noprefs       56 -> 12
           light-stamp           0 ->  0
           total                86 -> 14

       light-stamp stays 0 because both halves are dark-scoped: a visitor in
       the default state matches none of these rules. */
    /* surfaces: the light tints this dashboard's PHP hard-codes inline */
    .aict-dashboard [style*="background:#f8fafc"], .aict-dashboard [style*="background: #f8fafc"],
    .aict-dashboard [style*="background:#ffffff"], .aict-dashboard [style*="background: #ffffff"],
    .aict-dashboard [style*="background:#fff;"],   .aict-dashboard [style*="background: #fff;"] { background: #1e293b !important; }
    .aict-dashboard [style*="background:#fef2f2"], .aict-dashboard [style*="background: #fef2f2"] { background: #3a1c1f !important; }
    .aict-dashboard [style*="background:#faf5ff"], .aict-dashboard [style*="background: #faf5ff"] { background: #2e1065 !important; }
    .aict-dashboard [style*="background:#e2e8f0"], .aict-dashboard [style*="background: #e2e8f0"] { background: #334155 !important; color: #e2e8f0 !important; }
    /* ink: the light-mode colours those same blocks hard-code */
    .aict-dashboard [style*="color:#0f172a"], .aict-dashboard [style*="color: #0f172a"],
    .aict-dashboard [style*="color:#1a1a2e"], .aict-dashboard [style*="color: #1a1a2e"] { color: #e2e8f0 !important; }
    .aict-dashboard [style*="color:#475569"], .aict-dashboard [style*="color: #475569"],
    .aict-dashboard [style*="color:#64748b"], .aict-dashboard [style*="color: #64748b"] { color: #94a3b8 !important; }
    .aict-dashboard [style*="color:#4f46e5"], .aict-dashboard [style*="color: #4f46e5"] { color: #a5b4fc !important; }
    .aict-dashboard [style*="color:#991b1b"], .aict-dashboard [style*="color: #991b1b"] { color: #fca5a5 !important; }
    .aict-dashboard [style*="background:#00c2a8"], .aict-dashboard [style*="background: #00c2a8"] { color: #0f172a !important; }

    /* Status-badge colours are inline style attributes, so an attribute shim
       is the only thing that reaches them — the same mechanism this file
       already uses for [style*="color:#64748b"] at the top.

       Both halves or neither. A first version of this retinted only the INK,
       which turned #1e40af-on-#dbeafe into #93c5fd-on-#dbeafe: 1.48:1, light
       on light. The badges pair a light tint SURFACE with a dark tint ink, so
       a dark context has to darken the tint as well. That is this file's own
       first rule, broken by the fix written for it, and caught only because
       the run after it was read line by line. */
    /* Ink only, for text whose surface is already dark. */
    .aict-dashboard [style*="color:#2563eb"], .aict-dashboard [style*="color: #2563eb"],
    .aict-dashboard [style*="color:#1e40af"], .aict-dashboard [style*="color: #1e40af"] { color: #93c5fd !important; }
    .aict-dashboard [style*="color:#15803d"], .aict-dashboard [style*="color: #15803d"] { color: #86efac !important; }

    /* …except an element that carries a light TINT surface of its own. Those
       flip BOTH halves, and must come after the ink rules to win on order.
       `color:#7c3aed` gets no ink rule at all: 61 occurrences in PHP, most of
       them bare spans whose surface I have not measured. Only the tint pair
       below is safe there. */
    .aict-dashboard [style*="background:#dbeafe"] { background: #1e3a8a !important; color: #93c5fd !important; }
    .aict-dashboard [style*="background:#f3e8ff"] { background: #4c1d95 !important; color: #c4b5fd !important; }
    .aict-dashboard [style*="background:#f0fdf4"] { background: #14532d !important; color: #86efac !important; }
}

/* ============================================================
   [v4.16.80av] Wave OOO — dashboard UX audit fixes (2026-04-29)
   Findings: container only ~520px on prod, mobile tabs cramped,
   no avatar fallback for users without Gravatar, Usage shows
   blank zeros instead of empty-state CTA. Tab nav was anchor-
   scroll; rewritten as proper SPA with role="tab" + visibility
   toggle (template change in class-aict-account-dashboard.php).
   ============================================================ */

/* P1 — Container width: theme/parent wrappers constrain to entry-content
   width (~520px on aict-2026 + Elementor pre-roll). Force 1200px max
   with high specificity that beats .entry-content / .single-content. */
.aict-dashboard,
html body .aict-dashboard,
.entry-content .aict-dashboard,
.single-content .aict-dashboard {
    max-width: 1200px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box;
}

/* P2 — Welcome heading clamp + email overflow on mobile */
.aict-dashboard-greeting h1 {
    font-size: clamp(1.25rem, 5vw, 2rem);
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;
}
.aict-dashboard-email {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* P2 — Mobile tab strip: horizontal scroll with snap points + larger tap target */
@media (max-width: 768px) {
    .aict-dashboard-tabs {
        overflow-x: auto;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        flex-wrap: nowrap !important;
        gap: 0;
    }
    .aict-dashboard-tabs::-webkit-scrollbar { display: none; }
    .aict-dashboard-tab {
        scroll-snap-align: start;
        flex-shrink: 0;
        min-height: 44px;
        white-space: nowrap;
    }
}

/* Tab as <button> styling parity with old <a> links */
.aict-dashboard-tab {
    background: transparent;
    border: 0;
    cursor: pointer;
    font: inherit;
    padding: 0.625rem 1rem;
    color: var(--aict-dash-muted);
    font-weight: 600;
    border-bottom: 2px solid transparent;
    transition: color var(--aict-transition-fast), border-color var(--aict-transition-fast);
}
.aict-dashboard-tab:hover { color: #1e293b; }
.aict-dashboard-tab:focus-visible {
    outline: 2px solid #5c5fe6;
    outline-offset: 2px;
    border-radius: 4px;
}
.aict-dashboard-tab.is-active,
.aict-dashboard-tab[aria-selected="true"] {
    color: #4338ca;
    border-bottom-color: #4338ca;
}

/* P3 — Avatar fallback: when img is missing or default Gravatar mystery,
   wrap in .aict-avatar-fallback span with initials on purple gradient. */
.aict-avatar-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    /* [WCAG-AA 2026-06-18] left stop #5c5fe6 was 4.47:1 with #fff initials.
       Deepened to #4f46e5 (6.29:1). Right stop #7c3aed already passes at 5.70:1. */
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
    color: #fff;
    font-weight: 700;
    font-size: 1.125rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    flex-shrink: 0;
}

/* P4 — Usage card empty state. Triggered when .aict-usage-empty is rendered. */
.aict-usage-empty {
    text-align: center;
    padding: 2rem 1rem 1.5rem;
    color: #475569;
}
.aict-usage-empty-icon {
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
    opacity: 0.7;
}
.aict-usage-empty-title {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 0.25rem;
}
.aict-usage-empty-desc {
    font-size: 0.875rem;
    color: var(--aict-dash-muted);
    margin: 0 0 1rem;
}
.aict-usage-empty-cta {
    display: inline-block;
    padding: 0.5rem 1.125rem;
    /* [WCAG-AA 2026-06-18] left stop #5c5fe6 was 4.47:1 with #fff. Deepened
       to #4f46e5 (6.29:1). Right stop #7c3aed already passes at 5.70:1. */
    background: linear-gradient(135deg, #4f46e5, #7c3aed);
    color: #fff !important;
    text-decoration: none;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    transition: transform var(--aict-transition-fast), box-shadow var(--aict-transition-fast);
}
.aict-usage-empty-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(99,102,241,.25);
}

/* [a11y 2026-06-25] Dashboard dark-mode readability fix. These elements had
   hardcoded dark text (#1e293b / #0b1b35 / #475569) with NO [data-theme="dark"]
   override, so they rendered near-black on the dark cards (~1.3:1, unreadable).
   Reported as a recurring "poor readability on the user dashboard" issue.
   Found via scripts/_dash_contrast_scan.py (gap = dark text, no dark override). */
[data-theme="dark"] .aict-usage-count               { color: #f1f5f9; }
[data-theme="dark"] .aict-usage-empty-title         { color: #f1f5f9; }
[data-theme="dark"] .aict-dashboard-welcome-text h3 { color: #f1f5f9; }
[data-theme="dark"] .aict-dashboard-welcome-text p  { color: #cbd5e1; }

/* [a11y 2026-06-25] Text links on the auth/login + dashboard surfaces used
   hardcoded brand indigo (#4f46e5/#5c5fe6) with no dark override → only ~1.6–2.3:1
   on the dark card (e.g. "Forgot password?", "Sign up free", "Try tools first").
   Flip plain text links to light indigo in dark mode; exclude buttons/CTAs which
   carry their own background. Verified via live dark-mode probe on /account/. */
[data-theme="dark"] .aict-account-login a:not([class*="btn"]):not([class*="cta"]):not([class*="button"]),
[data-theme="dark"] .aict-login-card a:not([class*="btn"]):not([class*="cta"]):not([class*="button"]),
[data-theme="dark"] .aict-dashboard a:not([class*="btn"]):not([class*="cta"]):not([class*="button"]):not([class*="tab"]) {
    color: #a5b4fc;
}

/* [2026-09-08 ux-wave-3] The stamp half of the same fix. The block above is
   inside @media (prefers-color-scheme: dark) and is deliberately UNGUARDED, so
   it covers every OS-dark visitor. It does NOT cover the visitor who chose dark
   explicitly on a light-mode OS — and covering only one of the two is the most
   repeated mistake in this codebase. Same surfaces, same measured ratios. */
[data-theme="dark"] .aict-onboarding-checklist       { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .aict-onboarding-checklist__cta  { background: #334155; border-color: #475569; }
[data-theme="dark"] .aict-onboarding-checklist__bar  { background: #334155; }
[data-theme="dark"] .aict-onboarding-checklist__bar-pct { color: #cbd5e1; }
[data-theme="dark"] .aict-gam-card                   { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .aict-pref-card                  { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .aict-fsc-modal                  { background: #1e293b; }
[data-theme="dark"] .aict-fsc-card                   { background: #172033; }
[data-theme="dark"] .aict-quick-action-button        { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .aict-fsc-secondary              { color: #94a3b8; }

/* ==========================================================================
   [2026-09-09 dashboard sweep] The stamp half of the block above, plus the
   signup-celebration card.

   The card's own ink lives in a different extracted stylesheet than this one,
   at the same one-class weight, so file order would decide it. `html ` costs
   one element selector and settles that without !important — the same move
   #513 made for the onboarding checklist, and for the same reason.
   ========================================================================== */
@media (prefers-color-scheme: dark) {
    html .aict-fsc-card-title { color: #f1f5f9; }
    html .aict-fsc-card-desc  { color: #94a3b8; }
    html .aict-fsc-card-cta   { color: #a5b4fc; }
}
[data-theme="dark"] .aict-fsc-card-title { color: #f1f5f9; }
[data-theme="dark"] .aict-fsc-card-desc  { color: #94a3b8; }
[data-theme="dark"] .aict-fsc-card-cta   { color: #a5b4fc; }

[data-theme="dark"] .aict-dashboard .aict-suggested-title { color: #f1f5f9; }
[data-theme="dark"] .aict-dashboard .aict-settings-email,
[data-theme="dark"] .aict-dashboard .aict-settings-text   { color: #f1f5f9; }

[data-theme="dark"] .aict-dashboard [style*="color:#2563eb"], [data-theme="dark"] .aict-dashboard [style*="color: #2563eb"],
[data-theme="dark"] .aict-dashboard [style*="color:#1e40af"], [data-theme="dark"] .aict-dashboard [style*="color: #1e40af"] { color: #93c5fd !important; }
[data-theme="dark"] .aict-dashboard [style*="color:#15803d"], [data-theme="dark"] .aict-dashboard [style*="color: #15803d"] { color: #86efac !important; }
/* surfaces: the light tints this dashboard's PHP hard-codes inline */
[data-theme="dark"] .aict-dashboard [style*="background:#f8fafc"], [data-theme="dark"] .aict-dashboard [style*="background: #f8fafc"],
[data-theme="dark"] .aict-dashboard [style*="background:#ffffff"], [data-theme="dark"] .aict-dashboard [style*="background: #ffffff"],
[data-theme="dark"] .aict-dashboard [style*="background:#fff;"],   [data-theme="dark"] .aict-dashboard [style*="background: #fff;"] { background: #1e293b !important; }
[data-theme="dark"] .aict-dashboard [style*="background:#fef2f2"], [data-theme="dark"] .aict-dashboard [style*="background: #fef2f2"] { background: #3a1c1f !important; }
[data-theme="dark"] .aict-dashboard [style*="background:#faf5ff"], [data-theme="dark"] .aict-dashboard [style*="background: #faf5ff"] { background: #2e1065 !important; }
[data-theme="dark"] .aict-dashboard [style*="background:#e2e8f0"], [data-theme="dark"] .aict-dashboard [style*="background: #e2e8f0"] { background: #334155 !important; color: #e2e8f0 !important; }
/* ink: the light-mode colours those same blocks hard-code */
[data-theme="dark"] .aict-dashboard [style*="color:#0f172a"], [data-theme="dark"] .aict-dashboard [style*="color: #0f172a"],
[data-theme="dark"] .aict-dashboard [style*="color:#1a1a2e"], [data-theme="dark"] .aict-dashboard [style*="color: #1a1a2e"] { color: #e2e8f0 !important; }
[data-theme="dark"] .aict-dashboard [style*="color:#475569"], [data-theme="dark"] .aict-dashboard [style*="color: #475569"],
[data-theme="dark"] .aict-dashboard [style*="color:#64748b"], [data-theme="dark"] .aict-dashboard [style*="color: #64748b"] { color: #94a3b8 !important; }
[data-theme="dark"] .aict-dashboard [style*="color:#4f46e5"], [data-theme="dark"] .aict-dashboard [style*="color: #4f46e5"] { color: #a5b4fc !important; }
[data-theme="dark"] .aict-dashboard [style*="color:#991b1b"], [data-theme="dark"] .aict-dashboard [style*="color: #991b1b"] { color: #fca5a5 !important; }
[data-theme="dark"] .aict-dashboard [style*="background:#00c2a8"], [data-theme="dark"] .aict-dashboard [style*="background: #00c2a8"] { color: #0f172a !important; }
[data-theme="dark"] .aict-dashboard [style*="background:#dbeafe"] { background: #1e3a8a !important; color: #93c5fd !important; }
[data-theme="dark"] .aict-dashboard [style*="background:#f3e8ff"] { background: #4c1d95 !important; color: #c4b5fd !important; }
[data-theme="dark"] .aict-dashboard [style*="background:#f0fdf4"] { background: #14532d !important; color: #86efac !important; }

/* [2026-09-09] The last four causes on /account/, each one a pair whose halves
   were keyed on different signals. Every guard here was arrived at by measuring
   the state it belongs to, and two of them are narrower than the obvious
   version because the obvious version measured WORSE.

   1. The light-mode rescue `html:not([data-theme="dark"]) [style*="color:#94a3b8"]
      { color:#475569 !important }` fires in osdark-noprefs -- its :not() matches,
      because the stamp is light there -- while the card underneath is dark. It
      darkens ink for a light surface that is no longer light. Restoring the
      author's own inline #94a3b8 gives 5.74:1 on #1e293b.

   2/3. Two surfaces set by CLASS, not inline, so no attribute shim reaches
      them: the Pro-gate card and the Upgrade quick action.

   4. The Upgrade button is teal ONLY while the stamp is light. Under the dark
      stamp `[data-theme="dark"] .aict-quick-action-button` makes it #1e293b, so
      the dark ink that is correct on teal became 1.22:1 there. Measured: the
      unguarded version of this rule scored 4 failures, the guarded one zero.
      That is why it carries :not([data-theme="dark"]) and no stamp twin. */
@media (prefers-color-scheme: dark) {
  html body .aict-dashboard [style*="color:#94a3b8"],
  html body .aict-dashboard [style*="color: #94a3b8"] { color: #94a3b8 !important; }
  html body .aict-dashboard [style*="background:#faf5ff"],
  html body .aict-dashboard [style*="background: #faf5ff"] { background: #2e1065 !important; }
  html body .aict-dashboard [style*="background:#00c2a8"],
  html body .aict-dashboard [style*="background: #00c2a8"] { color: #0f172a !important; }
  html body .aict-dashboard .aict-connectors-pro-gate { background: #2e1065 !important; }
  html:not([data-theme="dark"]) body .aict-dashboard .aict-qa-upgrade,
  html:not([data-theme="dark"]) body .aict-dashboard a.aict-qa-upgrade { color: #0f172a !important; }
}
[data-theme="dark"] body .aict-dashboard [style*="color:#334155"],
[data-theme="dark"] body .aict-dashboard [style*="color: #334155"] { color: #cbd5e1 !important; }
[data-theme="dark"] body .aict-dashboard .aict-connectors-pro-gate { background: #2e1065 !important; }

/* ==========================================================================
   [2026-09-10] HOVER. Measured by scripts/audit_hover_contrast.js, which moves
   a real pointer — the state neither the contrast guard nor the UX sweep has
   ever read. Every ratio below is from production, signed in.
   ========================================================================== */

/* Dashboard tabs. The hover rule at :1394 tints the surface to
   rgba(14,98,255,.06) over #f8fafc = #eaf1fc, but its `color` has never
   applied: `html:not([data-theme="dark"]) .aict-dashboard-tab` in aict-site.css
   is (0,2,1) and outranks every `.aict-dashboard-tab:hover` at (0,2,0). So the
   tab kept its resting #64748b on a tinted ground and hover made contrast
   WORSE, not better — 4.55:1 at rest, 4.19:1 hovered, on all eleven tabs.
   (0,3,1) wins on specificity alone, with no !important and no dependence on
   load order. #0e62ff measured 4.39:1, still short; blue-700 gives 5.90:1. */
html:not([data-theme="dark"]) .aict-dashboard-tab:hover { color: #1d4ed8; }

/* Onboarding checklist CTA. Its resting surface went dark with the rest of the
   dashboard; its :hover did not, because the component's own inline rule reads
   background:var(--aict-bg-hover,#eef2ff) and --aict-bg-hover is declared in no
   stylesheet in this repo — the fourth dead token found this week. Hover
   flipped the button back to near-white under dark ink: 1.33:1. */
@media (prefers-color-scheme: dark) {
  html .aict-onboarding-checklist__cta:hover { background: #3f4d62; }
}
[data-theme="dark"] .aict-onboarding-checklist__cta:hover { background: #3f4d62; }

/* Quick actions. The Upgrade pill's hover paints itself teal and never said
   what colour its label should be, so it kept #0E62FF: 1.67:1 in light-stamp.
   #0f172a is already this codebase's ink-on-teal. */
.aict-quick-action-button.aict-qa-upgrade:hover { color: #0f172a; }
@media (prefers-color-scheme: dark) {
  html .aict-quick-action-button:hover { color: #0f172a; }
}

/* The Upgrade pill's hover is NOT teal once dark is CHOSEN.     [2026-09-10]

   The fix above gave it #0f172a because its hover paints itself #00a894, and
   dark ink on teal is right. In the two stamped-dark states the pill's hover
   background is #0E62FF instead, and #0f172a on that blue is 3.58:1 — measured
   on prod, under a real pointer, needing 4.5:1 at 13px. White on #0E62FF is
   5.03:1.

   Stamp only, no @media twin: the failing states are exactly dark-stamp and
   lightos-darkchoice, and in osdark-noprefs the pill is still teal, where this
   ink would be the bug. Fifth time this week the two dark signals turned out
   not to share a surface. */
[data-theme="dark"] .aict-quick-action-button.aict-qa-upgrade:hover { color: #ffffff; }
