.gx-page {
    --gx-bg: #0b0c14;
    --gx-bg-soft: #0f1019;
    --gx-surface: #13141f;
    --gx-surface-2: #181a26;
    --gx-surface-3: #1c1e2b;
    --gx-ink: #f2efe7;
    --gx-muted: #c1bdcf;
    --gx-muted-soft: #8a8798;
    --gx-border: rgba(255, 255, 255, 0.10);
    --gx-border-strong: rgba(255, 255, 255, 0.18);
    --gx-card-bg: rgba(19, 20, 31, 0.96);
    --gx-card-alt: rgba(24, 26, 38, 0.96);
    --gx-card-overlay: rgba(255, 255, 255, 0.015);
    --gx-card-dots: rgba(255, 255, 255, 0.05);
    --gx-accent: #00e5b0;
    --gx-accent-dark: #00e5b0;
    --gx-highlight: #f0a94a;
    --gx-grid: rgba(255, 255, 255, 0.035);
    --gx-grid-size: 56px;
    --gx-glow: rgba(0, 229, 176, 0.10);
    --gx-shadow: 0 1px 0 rgba(255, 255, 255, 0.03), 0 14px 32px rgba(0, 0, 0, 0.32);
    --gx-shadow-hover: 0 1px 0 rgba(255, 255, 255, 0.04), 0 24px 56px rgba(0, 0, 0, 0.46);
    --gx-pill-bg: rgba(0, 229, 176, 0.14);
    --gx-pill-text: #00e5b0;
    --gx-ghost-bg: rgba(240, 169, 74, 0.12);
    --gx-ghost-text: #ffd08a;
    --gx-secondary-bg: rgba(255, 255, 255, 0.04);
    --gx-secondary-border: rgba(255, 255, 255, 0.08);
    --gx-primary-shadow: 0 12px 24px rgba(0, 229, 176, 0.24);
    --gx-primary-text: #06110d;
    --gx-link-underline: rgba(255, 255, 255, 0.20);
    --gx-accent-ring: rgba(0, 229, 176, 0.14);
    position: relative;
    overflow: clip;
    background:
        radial-gradient(1200px 420px at 50% -120px, var(--gx-glow), transparent 70%),
        var(--gx-bg);
    color: var(--gx-ink);
}

[data-theme="light"] .gx-page {
    --gx-bg: #f7f6f1;
    --gx-bg-soft: #f0eee6;
    --gx-surface: #ffffff;
    --gx-surface-2: #f7f6f1;
    --gx-surface-3: #eceada;
    --gx-ink: #14151b;
    --gx-muted: #3e3f49;
    --gx-muted-soft: #6d6d77;
    --gx-border: rgba(15, 16, 20, 0.10);
    --gx-border-strong: rgba(15, 16, 20, 0.20);
    --gx-card-bg: #ffffff;
    --gx-card-alt: #f7f6f1;
    --gx-card-overlay: rgba(11, 12, 20, 0.012);
    --gx-card-dots: rgba(15, 16, 20, 0.06);
    --gx-accent: #009474;
    --gx-accent-dark: #009474;
    --gx-grid: rgba(15, 16, 20, 0.05);
    --gx-glow: rgba(0, 148, 116, 0.08);
    --gx-shadow: 0 1px 0 rgba(15, 16, 20, 0.04), 0 10px 28px rgba(15, 16, 20, 0.06);
    --gx-shadow-hover: 0 1px 0 rgba(15, 16, 20, 0.06), 0 22px 48px rgba(15, 16, 20, 0.12);
    --gx-pill-bg: rgba(0, 148, 116, 0.10);
    --gx-pill-text: #009474;
    --gx-ghost-bg: rgba(211, 90, 31, 0.10);
    --gx-ghost-text: #d35a1f;
    --gx-secondary-bg: rgba(15, 16, 20, 0.05);
    --gx-secondary-border: rgba(15, 16, 20, 0.10);
    --gx-primary-shadow: 0 10px 24px rgba(0, 148, 116, 0.18);
    --gx-primary-text: #ffffff;
    --gx-link-underline: rgba(15, 16, 20, 0.18);
    --gx-accent-ring: rgba(0, 148, 116, 0.14);
}

.gx-page::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(to right, var(--gx-grid) 1px, transparent 1px),
        linear-gradient(to bottom, var(--gx-grid) 1px, transparent 1px);
    background-size: var(--gx-grid-size) var(--gx-grid-size);
    mask-image: linear-gradient(180deg, #000 0%, #000 60%, transparent 100%);
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 60%, transparent 100%);
    pointer-events: none;
}

.gx-page > * {
    position: relative;
    z-index: 1;
}

.gx-page.gt-page,
.gx-page.bm-page,
.gx-page.cg-page,
.gx-page.gg-page,
.gx-page.wf-page,
.single-ai-tool-en .gx-page.td-page {
    min-height: 100vh;
}

.gx-page :is(.gt-breadcrumb, .bm-breadcrumb, .cg-breadcrumb, .gg-breadcrumb, .wf-breadcrumb) {
    color: var(--gx-muted);
}

.gx-page :is(.gt-breadcrumb a, .bm-breadcrumb a, .cg-breadcrumb a, .gg-breadcrumb a, .wf-breadcrumb a) {
    color: inherit;
}

.gx-page :is(.gt-hero__copy, .gt-hero__stats, .gt-highlights, .gt-toolbar, .gt-categories, .gt-card,
    .bm-hero, .bm-toolbar, .bm-panel, .bm-cta, .bm-podium-card, .bm-card, .bm-story-card, .bm-playbook-item,
    .cg-breadcrumb, .cg-hero, .cg-form-section, .cg-verdict, .cg-scoreboard, .cg-cards, .cg-next, .cg-empty,
    .gg-hero, .gg-highlight-card, .gg-toolbar, .gg-summary, .gg-empty, .gg-featured-card, .gg-card, .gg-section, .gg-side-card,
    .wf-hero, .wf-toolbar, .wf-summary, .wf-cta, .wf-empty, .wf-detail, .wf-side-card, .wf-step-card, .wf-output-card,
    .td-hero, .td-card) {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, var(--gx-card-overlay), transparent), var(--gx-card-bg);
    border-color: var(--gx-border);
    box-shadow: var(--gx-shadow);
    color: var(--gx-ink);
}

.gx-page :is(.gt-hero__copy, .gt-hero__stats, .gt-highlights, .gt-toolbar, .gt-categories, .gt-card,
    .bm-hero, .bm-toolbar, .bm-panel, .bm-cta, .bm-podium-card, .bm-card, .bm-story-card, .bm-playbook-item,
    .cg-breadcrumb, .cg-hero, .cg-form-section, .cg-verdict, .cg-scoreboard, .cg-cards, .cg-next, .cg-empty,
    .gg-hero, .gg-highlight-card, .gg-toolbar, .gg-summary, .gg-empty, .gg-featured-card, .gg-card, .gg-section, .gg-side-card,
    .wf-hero, .wf-toolbar, .wf-summary, .wf-cta, .wf-empty, .wf-detail, .wf-side-card, .wf-step-card, .wf-output-card,
    .td-card)::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(var(--gx-card-dots) 0.8px, transparent 0.8px);
    background-size: 18px 18px;
    opacity: 0.18;
    pointer-events: none;
}

.gx-page :is(.gt-card, .bm-card, .bm-story-card, .bm-podium-card, .cg-card, .gg-card, .gg-featured-card, .wf-card, .wf-step-card, .wf-output-card):hover {
    box-shadow: var(--gx-shadow-hover), 0 0 0 1px var(--gx-accent-ring);
}

.gx-page :is(.cg-stat, .gg-stat, .wf-stat, .bm-stat, .td-hero-icon) {
    background: linear-gradient(180deg, var(--gx-card-bg) 0%, var(--gx-card-alt) 100%);
    border-color: var(--gx-border);
    color: var(--gx-ink);
}

.gx-page :is(.gt-hero__desc, .gt-card__desc, .gt-batch-banner p,
    .bm-hero__desc, .bm-toolbar__meta p, .bm-panel__head p, .bm-cta p, .bm-card__desc, .bm-podium-card p, .bm-story-card p, .bm-playbook-item p,
    .cg-hero__desc, .cg-verdict p, .cg-scoreboard__head p, .cg-card__desc, .cg-next p, .cg-empty p,
    .gg-hero__desc, .gg-card p, .gg-summary p, .gg-highlight-card p, .gg-featured-card p, .gg-empty p,
    .wf-hero__desc, .wf-card p, .wf-summary p, .wf-empty p, .wf-richtext,
    .td-content, .td-content p, .td-card-sub) {
    color: var(--gx-muted);
}

.gx-page :is(.gt-hero__badge, .gt-highlight-card__label, .gt-chip, .gt-card__score,
    .bm-hero__badge, .bm-podium-rank, .bm-story-eyebrow, .bm-playbook-step, .bm-track.is-active, .bm-chip.is-active,
    .cg-hero__badge, .cg-label, .cg-verdict__label,
    .gg-hero__badge, .gg-toolbar__label, .gg-highlight-card__label, .gg-featured-card__label,
    .wf-hero__badge, .wf-toolbar__label,
    .td-badge, .td-card-title .td-title-bar) {
    background: var(--gx-pill-bg);
    color: var(--gx-pill-text);
    border-color: transparent;
}

.gx-page :is(.gt-btn, .bm-btn, .cg-btn, .gg-btn, .wf-btn, .td-btn-visit, .td-btn-fav, .td-btn-vote) {
    border-radius: 999px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.gx-page :is(.gt-btn:hover, .bm-btn:hover, .cg-btn:hover, .gg-btn:hover, .wf-btn:hover, .td-btn-visit:hover, .td-btn-fav:hover, .td-btn-vote:hover) {
    transform: translateY(-1px);
}

.gx-page :is(.gt-btn--primary, .bm-btn--primary, .cg-btn--primary, .gg-btn--primary, .wf-btn--primary, .td-btn-visit) {
    background: var(--gx-accent);
    color: var(--gx-primary-text);
    border-color: transparent;
    box-shadow: var(--gx-primary-shadow);
}

.gx-page :is(.gt-btn--secondary, .bm-btn--secondary, .cg-btn--secondary, .gg-btn--secondary, .wf-btn--secondary, .td-btn-fav, .td-btn-vote) {
    background: var(--gx-secondary-bg);
    color: var(--gx-ink);
    border-color: var(--gx-secondary-border);
}

.gx-page :is(.gt-btn--ghost, .bm-btn--ghost, .cg-btn--ghost, .gg-btn--ghost) {
    background: var(--gx-ghost-bg);
    color: var(--gx-ghost-text);
    border-color: transparent;
}

.gx-page :is(.gt-card__meta, .gt-highlight-card__meta, .bm-podium-meta, .bm-card__meta, .bm-story-meta, .cg-card__meta, .gg-card__meta, .wf-card__meta, .td-meta-list) {
    color: var(--gx-muted);
}

.gx-page :is(.gt-card__chips span, .bm-card__chips span, .cg-pill, .gg-pill, .wf-pill, .td-list li, .td-pc-item, .td-faq-item) {
    border-color: var(--gx-border);
}

.gx-page :is(.gt-card h3 a, .bm-podium-card h2 a, .bm-card h3 a, .bm-story-card h3 a,
    .cg-card h3 a, .gg-card h3 a, .gg-featured-card h3 a, .wf-card h3 a, .td-name, .td-list a) {
    color: inherit;
}

.gx-page :is(.gg-link, .wf-link, .gh-link, .td-list a, .bm-story-card h3 a, .bm-card h3 a, .cg-card h3 a) {
    text-decoration-color: var(--gx-link-underline);
}

.single-ai-tool-en .gx-page.td-page {
    padding-top: 28px;
}

.single-ai-tool-en .gx-page .td-hero {
    background: transparent;
    border: 0;
    box-shadow: none;
}

.single-ai-tool-en .gx-page .td-hero-inner {
    background: linear-gradient(180deg, var(--gx-card-overlay), transparent), var(--gx-card-bg);
    border: 1px solid var(--gx-border);
    border-radius: 28px;
    box-shadow: var(--gx-shadow);
}

.gx-page :is(.gt-hero__copy, .gt-hero__stats, .bm-hero, .cg-hero, .gg-hero, .wf-hero) {
    border-radius: 32px;
}

.gx-page :is(.gt-hero__copy, .bm-hero, .cg-hero, .gg-hero, .wf-hero) {
    background:
        radial-gradient(440px circle at 100% 0, rgba(91, 108, 255, 0.12), transparent 70%),
        radial-gradient(520px circle at 0 0, var(--gx-glow), transparent 72%),
        linear-gradient(180deg, var(--gx-card-overlay), transparent),
        var(--gx-card-bg);
}

.gx-page :is(.gt-hero__stats, .bm-hero__stats, .gg-hero__stats, .wf-hero__stats, .cg-hero__stats) {
    gap: 16px;
}

.gx-page :is(.gt-stat, .bm-stat, .gg-stat, .wf-stat, .cg-stat) {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid var(--gx-border);
    background:
        linear-gradient(180deg, rgba(255,255,255,0.02), transparent),
        linear-gradient(180deg, var(--gx-card-bg), var(--gx-card-alt));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}

.gx-page :is(.gt-stat, .bm-stat, .gg-stat, .wf-stat, .cg-stat)::before,
.gx-page :is(.gt-highlight-card, .bm-story-card, .bm-playbook-item, .gg-highlight-card, .gg-featured-card, .gg-card, .wf-card, .cg-dim-card, .cg-card)::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(var(--gx-card-dots) 0.8px, transparent 0.8px);
    background-size: 18px 18px;
    opacity: 0.16;
    pointer-events: none;
}

.gx-page :is(.gt-highlight-card, .bm-story-card, .bm-playbook-item, .gg-highlight-card, .gg-featured-card, .gg-card, .wf-card, .cg-dim-card, .cg-card) {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    border: 1px solid var(--gx-border);
    background:
        linear-gradient(180deg, var(--gx-card-overlay), transparent),
        var(--gx-card-bg);
    box-shadow: var(--gx-shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.gx-page :is(.gt-highlight-card, .bm-story-card, .bm-playbook-item, .gg-highlight-card, .gg-featured-card, .gg-card, .wf-card, .cg-dim-card, .cg-card)::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    border: 1px solid transparent;
    pointer-events: none;
    transition: border-color 0.2s ease;
}

.gx-page :is(.gt-highlight-card:hover, .bm-story-card:hover, .bm-playbook-item:hover, .gg-highlight-card:hover, .gg-featured-card:hover, .gg-card:hover, .wf-card:hover, .cg-dim-card:hover, .cg-card:hover) {
    transform: translateY(-2px);
    box-shadow: var(--gx-shadow-hover), 0 0 0 1px var(--gx-accent-ring);
    border-color: var(--gx-border-strong);
}

.gx-page :is(.gt-highlight-card:hover, .bm-story-card:hover, .bm-playbook-item:hover, .gg-highlight-card:hover, .gg-featured-card:hover, .gg-card:hover, .wf-card:hover, .cg-dim-card:hover, .cg-card:hover)::after {
    border-color: rgba(91, 108, 255, 0.18);
}

.gx-page :is(.gt-toolbar, .gt-categories, .bm-toolbar, .bm-panel, .cg-form-section, .cg-verdict, .cg-scoreboard, .cg-next, .gg-toolbar, .gg-summary, .wf-toolbar, .wf-summary, .wf-cta) {
    border-radius: 24px;
}

.gx-page :is(.gt-toolbar, .bm-toolbar, .gg-toolbar, .wf-toolbar) {
    background:
        linear-gradient(180deg, rgba(255,255,255,0.02), transparent),
        var(--gx-card-alt);
}

.gx-page :is(.gt-search input, .bm-search input, .gg-search input, .wf-search input, .cg-select-group select) {
    background: var(--gx-secondary-bg);
    color: var(--gx-ink);
    border-color: var(--gx-secondary-border);
    border-radius: 14px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}

.gx-page :is(.gt-search input::placeholder, .bm-search input::placeholder, .gg-search input::placeholder, .wf-search input::placeholder) {
    color: var(--gx-muted-soft);
}

.gx-page :is(.gt-search button, .bm-search button, .gg-search button, .wf-search button) {
    border-radius: 14px;
    background: var(--gx-accent);
    color: var(--gx-primary-text);
    box-shadow: var(--gx-primary-shadow);
    font-weight: 700;
}

.gx-page :is(.gt-chip, .bm-chip, .bm-track, .gg-chip, .wf-chip, .cg-label, .cg-card__category, .cg-card__score, .wf-card__category, .wf-card__team, .wf-card__tools span, .gg-highlight-card__meta span, .gg-featured-card__meta span, .gg-card__eyebrow span, .gg-card__meta span, .gt-card__chips span, .bm-card__score, .bm-podium-rank) {
    border-radius: 999px;
    border: 1px solid var(--gx-secondary-border);
    background: var(--gx-secondary-bg);
    color: var(--gx-muted);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}

.gx-page :is(.gt-chip.is-active, .bm-track.is-active, .bm-chip.is-active, .gg-chip.is-active, .wf-chip.is-active) {
    background: var(--gx-pill-bg);
    color: var(--gx-pill-text);
    border-color: rgba(0, 229, 176, 0.22);
    box-shadow: 0 0 14px rgba(0, 229, 176, 0.12);
}

.gx-page :is(.gt-highlight-card__label, .gg-highlight-card__label, .gg-featured-card__label, .wf-card__label, .bm-story-eyebrow, .bm-playbook-step) {
    padding: 8px 12px;
    border-radius: 999px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.gx-page :is(.gt-highlight-card h2, .gt-card h2, .bm-podium-card h2, .bm-card h3, .bm-story-card h3, .gg-highlight-card h2, .gg-featured-card h2, .gg-card h2, .wf-card__title, .cg-card h2) {
    letter-spacing: -0.03em;
    line-height: 1.18;
}

.gx-page :is(.gt-highlight-card p, .gt-card__desc, .bm-card__desc, .bm-story-card p, .bm-playbook-item p, .gg-highlight-card p, .gg-featured-card p, .gg-card p, .wf-card__desc, .wf-card__block p, .cg-card__desc, .cg-verdict p, .cg-next p) {
    color: var(--gx-muted);
    line-height: 1.76;
}

.gx-page :is(.gt-card, .gg-card, .wf-card, .cg-card) {
    gap: 18px;
}

.gx-page :is(.gt-card__footer, .bm-card__footer, .gg-card__actions, .wf-card__actions, .cg-card__actions) {
    padding-top: 2px;
}

.gx-page :is(.gg-summary__item, .wf-summary__item) {
    padding: 16px 18px;
    border-radius: 18px;
    border: 1px solid var(--gx-border);
    background: linear-gradient(180deg, var(--gx-card-bg), var(--gx-card-alt));
}

.gx-page :is(.cg-meta-grid div, .cg-note-grid div) {
    border-radius: 18px;
    border-color: var(--gx-border);
    background: linear-gradient(180deg, var(--gx-card-bg), var(--gx-card-alt));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}

.gx-page .bm-track {
    justify-content: flex-start;
    min-height: 118px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.02), transparent),
        var(--gx-card-bg);
}

.gx-page .bm-podium-card {
    position: relative;
    overflow: hidden;
    border-radius: 26px;
    background:
        radial-gradient(320px circle at 100% 0, rgba(91, 108, 255, 0.10), transparent 72%),
        linear-gradient(180deg, var(--gx-card-overlay), transparent),
        var(--gx-card-bg);
}

.gx-page .bm-podium-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(var(--gx-card-dots) 0.8px, transparent 0.8px);
    background-size: 18px 18px;
    opacity: 0.18;
    pointer-events: none;
}

.gx-page .bm-podium-card > * {
    position: relative;
    z-index: 1;
}

.gx-page .gg-highlight-card,
.gx-page .gt-highlight-card {
    background:
        radial-gradient(320px circle at 100% 0, rgba(91, 108, 255, 0.08), transparent 72%),
        linear-gradient(180deg, var(--gx-card-overlay), transparent),
        var(--gx-card-bg);
}

.gx-page .wf-card__block {
    gap: 10px;
    padding: 14px 16px;
    border-radius: 18px;
    background: var(--gx-secondary-bg);
    border: 1px solid var(--gx-secondary-border);
}

.gx-page .wf-card__steps {
    margin-bottom: 0;
}

.gx-page .cg-verdict,
.gx-page .cg-next {
    background:
        radial-gradient(360px circle at 100% 0, rgba(91, 108, 255, 0.10), transparent 72%),
        linear-gradient(180deg, var(--gx-card-overlay), transparent),
        var(--gx-card-bg);
}

[data-theme="light"] .gx-page :is(.gt-stat, .bm-stat, .gg-stat, .wf-stat, .cg-stat, .gg-summary__item, .wf-summary__item, .cg-meta-grid div, .cg-note-grid div) {
    box-shadow: 0 1px 0 rgba(15, 16, 20, 0.04), 0 10px 26px rgba(15, 16, 20, 0.05);
}

[data-theme="light"] .gx-page :is(.gt-highlight-card, .bm-story-card, .bm-playbook-item, .gg-highlight-card, .gg-featured-card, .gg-card, .wf-card, .cg-dim-card, .cg-card, .bm-podium-card) {
    box-shadow: 0 1px 0 rgba(15, 16, 20, 0.04), 0 14px 32px rgba(15, 16, 20, 0.06);
}

[data-theme="light"] .gx-page :is(.gt-search input, .bm-search input, .gg-search input, .wf-search input, .cg-select-group select, .wf-card__block, .gt-chip, .bm-chip, .bm-track, .gg-chip, .wf-chip, .wf-card__tools span, .gg-highlight-card__meta span, .gg-featured-card__meta span, .gg-card__eyebrow span, .gg-card__meta span) {
    background: rgba(255, 255, 255, 0.76);
}

@media (max-width: 860px) {
    .gx-page :is(.bm-story-grid, .bm-playbook-grid) {
        grid-template-columns: 1fr;
    }
}