.public-bots-page {
    background: linear-gradient(180deg, #0d0719 0%, #080513 44%, #080513 100%);
    color: #f8f7ff;
    min-height: 100vh;
}

.public-bots-hero {
    padding: 7rem 0 3rem;
}

.public-bots-hero-inner {
    max-width: 820px;
    margin: 0 auto;
    text-align: center;
}

.public-bots-eyebrow {
    color: #39d98a;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0;
    margin-bottom: 0.75rem;
    text-transform: uppercase;
}

.public-bots-hero h1,
.public-bot-title-row h1 {
    color: #fff;
    font-weight: 800;
    letter-spacing: 0;
}

.public-bots-hero h1 {
    font-size: clamp(2.35rem, 5vw, 4.65rem);
    line-height: 1;
    margin-bottom: 1rem;
}

.public-bots-hero p,
.public-bot-description {
    color: #b8b1c9;
    font-size: 1.05rem;
}

.public-bots-search {
    align-items: center;
    background: rgba(18, 12, 32, 0.86);
    border: 1px solid rgba(160, 132, 255, 0.28);
    border-radius: 8px;
    display: flex;
    gap: 0.75rem;
    margin: 2rem auto 0;
    max-width: 620px;
    padding: 0.65rem;
}

.public-bots-search i {
    color: #a78bfa;
    padding-left: 0.45rem;
}

.public-bots-search input {
    background: transparent;
    border: 0;
    color: #fff;
    flex: 1;
    min-width: 0;
    outline: none;
}

.public-bots-search button,
.public-bot-copy-btn {
    background: linear-gradient(135deg, #8f37ff, #39d98a);
    border: 0;
    border-radius: 8px;
    color: #fff;
    display: inline-flex;
    font-weight: 800;
    justify-content: center;
    padding: 0.8rem 1.2rem;
    text-decoration: none;
}

.public-bots-section,
.public-bot-detail {
    padding: 2rem 0 5rem;
}

.public-bots-filters {
    align-items: end;
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    margin-bottom: 1.5rem;
}

.public-bots-filters label {
    display: grid;
    gap: 0.35rem;
}

.public-bots-filters span {
    color: #a7a0b8;
    font-size: 0.82rem;
}

.public-bots-filters select {
    background: #120c20;
    border: 1px solid rgba(160, 132, 255, 0.24);
    border-radius: 8px;
    color: #fff;
    min-height: 44px;
    padding: 0 0.9rem;
}

.public-bots-reset {
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    color: #d9d4e7;
    min-height: 44px;
    padding: 0.65rem 1rem;
    text-align: center;
    text-decoration: none;
}

.public-bot-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.public-bot-card,
.public-bot-panel,
.public-bots-empty,
.public-bot-related-card {
    background: rgba(18, 12, 32, 0.78);
    border: 1px solid rgba(160, 132, 255, 0.22);
    border-radius: 8px;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.24);
}

.public-bot-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform 160ms ease, border-color 160ms ease;
}

.public-bot-card:hover {
    border-color: rgba(57, 217, 138, 0.5);
    transform: translateY(-3px);
}

.public-bot-card-media,
.public-bot-cover {
    aspect-ratio: 16 / 9;
    background: #140d24;
    display: block;
    overflow: hidden;
}

.public-bot-card-media img,
.public-bot-cover img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.public-bot-placeholder {
    align-items: center;
    background: linear-gradient(135deg, rgba(143, 55, 255, 0.38), rgba(57, 217, 138, 0.22));
    color: #fff;
    display: flex;
    font-size: 3rem;
    height: 100%;
    justify-content: center;
    min-height: 180px;
}

.public-bot-card-body,
.public-bot-panel {
    padding: 1.15rem;
}

.public-bot-card-head {
    align-items: start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.public-bot-card-head h2 {
    color: #fff;
    font-size: 1.08rem;
    margin-bottom: 0.25rem;
}

.public-bot-card-head p,
.public-bot-card-copy,
.public-bot-related-card span {
    color: #a7a0b8;
}

.public-bot-card-head > span,
.public-bot-badges span,
.public-bot-tags span {
    background: rgba(143, 55, 255, 0.16);
    border: 1px solid rgba(160, 132, 255, 0.24);
    border-radius: 999px;
    color: #e9ddff;
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.35rem 0.6rem;
    white-space: nowrap;
}

.public-bot-card-copy {
    display: -webkit-box;
    line-height: 1.55;
    margin: 1rem 0;
    min-height: 3.1rem;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.public-bot-metrics,
.public-bot-performance-grid {
    display: grid;
    gap: 0.65rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.public-bot-metrics div,
.public-bot-performance-grid div,
.public-bot-feature-grid div,
.public-bot-config div {
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    padding: 0.75rem;
}

.public-bot-metrics span,
.public-bot-performance-grid span,
.public-bot-config dt {
    color: #9f98b2;
    display: block;
    font-size: 0.76rem;
    margin-bottom: 0.2rem;
}

.public-bot-metrics strong,
.public-bot-performance-grid strong,
.public-bot-config dd {
    color: #fff;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    margin: 0;
}

.is-profit {
    color: #39d98a !important;
}

.is-loss {
    color: #ff5c7a !important;
}

.public-bot-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 1rem;
}

.public-bot-card-cta {
    align-items: center;
    color: #38d5ff;
    display: inline-flex;
    font-weight: 800;
    gap: 0.4rem;
    margin-top: 1rem;
    text-decoration: none;
}

.public-bot-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.public-bot-breadcrumb,
.public-bot-breadcrumb a {
    color: #a7a0b8;
    text-decoration: none;
}

.public-bot-detail-grid {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: minmax(0, 8fr) minmax(300px, 4fr);
}

.public-bot-main {
    display: grid;
    gap: 1.25rem;
}

.public-bot-cover,
.public-bot-cover .public-bot-placeholder {
    border-radius: 8px;
    min-height: 330px;
}

.public-bot-title-row {
    align-items: end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.public-bot-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
}

.public-bot-panel h2,
.public-bot-related h2 {
    color: #fff;
    font-size: 1.1rem;
    font-weight: 800;
    margin-bottom: 1rem;
}

.public-bot-feature-grid,
.public-bot-performance-grid,
.public-bot-screenshots,
.public-bot-related-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.public-bot-feature-grid i {
    color: #39d98a;
    margin-right: 0.55rem;
}

.public-bot-screenshots img {
    border-radius: 8px;
    height: 150px;
    object-fit: cover;
    width: 100%;
}

.public-bot-aside {
    min-width: 0;
}

.public-bot-sticky {
    display: grid;
    gap: 1rem;
    position: sticky;
    top: 6rem;
}

.public-bot-config {
    display: grid;
    gap: 0.65rem;
    margin: 0;
}

.public-bot-config div {
    display: flex;
    justify-content: space-between;
}

.public-bot-copy-btn {
    width: 100%;
}

.public-bot-related {
    margin-top: 2rem;
}

.public-bot-related-card {
    display: grid;
    gap: 0.3rem;
    padding: 1rem;
    text-decoration: none;
}

.public-bot-related-card strong {
    color: #fff;
}

.public-bots-empty {
    grid-column: 1 / -1;
    padding: 4rem 1rem;
    text-align: center;
}

.public-bots-empty i {
    color: #8f37ff;
    font-size: 2.4rem;
    margin-bottom: 1rem;
}

.public-bots-pagination {
    margin-top: 2rem;
}

@media (max-width: 1199.98px) {
    .public-bot-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .public-bots-filters,
    .public-bot-detail-grid {
        grid-template-columns: 1fr;
    }

    .public-bot-sticky {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .public-bots-hero {
        padding-top: 5.5rem;
    }

    .public-bots-search {
        align-items: stretch;
        flex-direction: column;
    }

    .public-bot-grid,
    .public-bot-feature-grid,
    .public-bot-performance-grid,
    .public-bot-screenshots,
    .public-bot-related-grid {
        grid-template-columns: 1fr;
    }

    .public-bot-title-row {
        align-items: start;
        flex-direction: column;
    }

    .public-bot-metrics {
        grid-template-columns: 1fr;
    }
}

.public-bots-page {
    --pb-bg: var(--darkModeBgColor, #0F0B1D);
    --pb-surface: var(--darkModePrimaryColor, #151026);
    --pb-surface-2: var(--darkModeSecondaryColor, #211633);
    --pb-border: var(--darkModeThirdColor, #35254f);
    --pb-primary: var(--primaryColor, #8b5cf6);
    --pb-text: #ffffff;
    --pb-muted: #b7a8e2;
    background: var(--pb-bg);
}

.public-bots-hero,
.public-bots-section,
.public-bot-detail {
    background: var(--pb-bg);
}

.public-bots-search,
.public-bot-card,
.public-bot-panel,
.public-bots-empty,
.public-bot-related-card {
    background: var(--pb-surface);
    border-color: var(--pb-border);
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.28);
}

.public-bot-card {
    min-height: 100%;
}

.public-bot-card:hover,
.public-bot-related-card:hover {
    border-color: var(--pb-primary);
    transform: translateY(-2px);
}

.public-bot-card-media,
.public-bot-cover {
    background: var(--pb-surface-2);
    border-bottom: 1px solid var(--pb-border);
}

.public-bot-placeholder {
    background: linear-gradient(135deg, var(--pb-surface-2), color-mix(in srgb, var(--pb-primary) 35%, var(--pb-surface)));
    color: var(--pb-text);
}

.public-bot-card-body {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.public-bot-card-head h2,
.public-bot-title-row h1,
.public-bot-panel h2,
.public-bot-related h2 {
    color: var(--pb-text);
}

.public-bots-hero p,
.public-bot-description,
.public-bot-card-head p,
.public-bot-card-copy,
.public-bot-related-card span,
.public-bot-breadcrumb,
.public-bot-breadcrumb a,
.public-bots-filters span {
    color: var(--pb-muted);
}

.public-bot-card-head > span,
.public-bot-badges span,
.public-bot-tags span {
    background: color-mix(in srgb, var(--pb-primary) 18%, transparent);
    border-color: color-mix(in srgb, var(--pb-primary) 45%, var(--pb-border));
    color: #f3edff;
}

.public-bot-metrics div,
.public-bot-performance-grid div,
.public-bot-feature-grid div,
.public-bot-config div {
    background: var(--pb-surface-2);
    border-color: var(--pb-border);
}

.public-bots-search input,
.public-bots-filters select {
    background: var(--pb-surface-2);
    border-color: var(--pb-border);
    color: var(--pb-text);
}

.public-bots-search input::placeholder {
    color: #8c7cad;
}

.public-bot-btn {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-weight: 800;
    gap: 0.5rem;
    justify-content: center;
    min-height: 44px;
    padding: 0.72rem 1rem;
    text-decoration: none;
    transition: border-color 160ms ease, opacity 160ms ease, transform 160ms ease;
    white-space: nowrap;
}

.public-bot-btn:hover {
    opacity: 0.92;
    transform: translateY(-1px);
}

.public-bot-btn-primary,
.public-bots-search button.public-bot-btn-primary,
.public-bot-copy-btn {
    background: var(--pb-primary);
    border: 1px solid var(--pb-primary);
    color: #fff;
}

.public-bot-btn-ghost {
    background: var(--pb-surface-2);
    border: 1px solid var(--pb-border);
    color: var(--pb-text);
}

.public-bot-btn-card {
    background: color-mix(in srgb, var(--pb-primary) 18%, var(--pb-surface-2));
    border: 1px solid color-mix(in srgb, var(--pb-primary) 42%, var(--pb-border));
    color: #fff;
    margin-top: auto;
    width: 100%;
}

.public-bot-btn-card:hover,
.public-bot-btn-ghost:hover {
    color: #fff;
}

.public-bot-card-cta {
    align-self: stretch;
}

.public-bots-reset {
    min-height: 44px;
    padding: 0.72rem 1rem;
}

@supports not (background: color-mix(in srgb, #000 50%, #fff)) {
    .public-bot-placeholder {
        background: linear-gradient(135deg, #211633, #4c2c7c);
    }

    .public-bot-card-head > span,
    .public-bot-badges span,
    .public-bot-tags span,
    .public-bot-btn-card {
        background: #211633;
        border-color: #6f42c1;
    }
}

.public-bot-grid {
    gap: 1rem;
}

.public-bot-card {
    background: var(--pb-surface);
    border: 1px solid rgba(139, 92, 246, 0.2);
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    margin-bottom: 2rem;
    overflow: hidden;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.2s ease;
}

.public-bot-card:hover {
    border-color: rgba(139, 92, 246, 0.45);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
    transform: translateY(-8px);
}

.public-bot-card-media {
    aspect-ratio: auto;
    background: var(--pb-surface-2);
    height: 200px;
}

.public-bot-card-media img {
    transition: transform 0.4s ease;
}

.public-bot-card:hover .public-bot-card-media img {
    transform: scale(1.05);
}

.public-bot-card .public-bot-placeholder {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    flex-direction: column;
    min-height: 200px;
}

.public-bot-card-body {
    padding: 2rem;
}

.public-bot-card-head {
    margin-bottom: 1rem;
}

.public-bot-card-head h2 {
    font-size: 1.5rem;
    line-height: 1.3;
    margin-bottom: 0.5rem;
}

.public-bot-card-head p {
    font-size: 0.95rem;
    margin: 0;
}

.public-bot-card-head > span {
    background: rgba(139, 92, 246, 0.16);
    border-color: rgba(139, 92, 246, 0.38);
    border-radius: 999px;
    font-size: 0.75rem;
    padding: 0.45rem 0.75rem;
}

.public-bot-card-copy {
    font-size: 0.9rem;
    line-height: 1.5;
    margin: 0 0 1.25rem;
    min-height: 2.8rem;
}

.public-bot-card .public-bot-metrics {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.public-bot-card .public-bot-metrics div {
    background: rgba(139, 92, 246, 0.1);
    border: 1px solid rgba(139, 92, 246, 0.2);
    border-radius: 8px;
    padding: 1rem;
    text-align: center;
}

.public-bot-card .public-bot-metrics span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: uppercase;
}

.public-bot-card .public-bot-metrics strong {
    display: block;
    font-family: inherit;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.2;
    margin-top: 0.5rem;
}

.public-bot-card .public-bot-tags {
    margin: 0 0 1.25rem;
}

.public-bot-card .public-bot-btn-card {
    background: linear-gradient(135deg, #8F37FF, #3b8cff);
    border: 0;
    box-shadow: 0 14px 40px rgba(143, 55, 255, 0.3);
    font-size: 0.95rem;
    min-height: 46px;
}

.public-bot-card .public-bot-btn-card:hover {
    box-shadow: 0 16px 48px rgba(143, 55, 255, 0.4);
}

.public-bot-script-card {
    border-radius: 12px !important;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-bottom: 0;
}

.public-bot-script-card .strategy-chart-preview {
    display: block;
    flex: 0 0 140px;
    text-decoration: none;
}

.public-bot-script-card .strategy-info {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 1.25rem;
}

.public-bot-script-card .strategy-title {
    font-size: 1.05rem;
    margin-bottom: 0.5rem;
    min-height: 0;
}

.public-bot-script-card .strategy-title-link {
    color: inherit;
    text-decoration: none;
}

.public-bot-script-card .strategy-title-link:hover {
    color: #c4b5fd;
}

.public-bot-script-card .bot-card-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.65rem !important;
}

.public-bot-script-card .bot-card-badges .badge {
    font-size: 0.68rem;
    padding: 0.3rem 0.5rem;
}

.public-bot-script-card .strategy-disclaimer {
    font-size: 0.75rem;
    line-height: 1.4;
    margin-bottom: 0.75rem;
    min-height: 3.2rem;
    padding: 0.6rem;
}

.public-bot-script-card .performance-metrics {
    margin-bottom: 0.75rem;
}

.public-bot-script-card .metrics-row {
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.public-bot-script-card .performance-metrics .metric-card {
    border-radius: 10px;
    box-shadow: none !important;
    padding: 0.65rem;
}

.public-bot-script-card .performance-metrics .metric-card-content {
    gap: 2px;
    min-height: 44px;
}

.public-bot-script-card .performance-metrics .metric-label {
    font-size: 0.68rem;
    margin-bottom: 0;
}

.public-bot-script-card .performance-metrics .metric-value {
    font-size: 1rem;
}

.public-bot-script-card .public-bot-tags {
    margin: 0 0 0.75rem;
}

.public-bot-script-card .public-bot-tags span {
    border-radius: 6px;
    font-size: 0.68rem;
    padding: 0.25rem 0.45rem;
}

.public-bot-script-card .strategy-actions .btn {
    font-size: 0.85rem;
    min-height: 40px;
    padding: 0.6rem 0.8rem;
}

html[data-theme="light"] .public-bot-script-card .performance-metrics .metric-card {
    border-radius: 10px !important;
    box-shadow: none !important;
}

.public-bots-filter-card {
    background: var(--pb-surface);
    border: 1px solid var(--pb-border);
    border-radius: 8px;
    margin-bottom: 2rem;
    padding: 1.7rem;
}

.public-bots-filter-grid {
    align-items: end;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(220px, 1.45fr) minmax(180px, 1fr) minmax(180px, 1fr) minmax(160px, 0.85fr) minmax(180px, 0.9fr);
}

.public-bots-filter-grid label {
    display: grid;
    gap: 0.6rem;
    margin: 0;
}

.public-bots-filter-grid label > span {
    color: var(--pb-text);
    font-weight: 600;
}

.public-bots-filter-grid input,
.public-bots-filter-grid select {
    background: #0d0719;
    border: 1px solid var(--pb-border);
    border-radius: 4px;
    color: var(--pb-text);
    min-height: 42px;
    padding: 0 0.9rem;
    width: 100%;
}

.public-bots-filter-grid input::placeholder {
    color: #8c7cad;
}

.public-bots-filter-submit {
    align-items: center;
    display: inline-flex;
    gap: 0.45rem;
    justify-content: center;
    min-height: 53px;
    width: 100%;
}

.public-bots-quick-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 1.15rem;
}

.public-bots-quick-filters .btn {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-weight: 800;
    min-height: 50px;
    padding: 0.65rem 1.15rem;
}

.public-bots-quick-filters .is-active {
    box-shadow: 0 0 0 3px rgba(143, 55, 255, 0.25), 0 14px 40px rgba(143, 55, 255, 0.3) !important;
}

.public-bots-clear-filter {
    background: var(--pb-surface-2);
    border: 1px solid var(--pb-border);
    color: var(--pb-text);
}

.public-bots-clear-filter:hover {
    color: var(--pb-text);
    opacity: 0.9;
}

@media (max-width: 1199.98px) {
    .public-bots-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .public-bots-filter-card {
        padding: 1rem;
    }

    .public-bots-filter-grid {
        grid-template-columns: 1fr;
    }

    .public-bots-quick-filters .btn {
        justify-content: center;
        width: 100%;
    }
}

html[data-theme="light"] .public-bots-page {
    --pb-bg: var(--ui-canvas, #f3f2ef);
    --pb-surface: #ffffff;
    --pb-surface-2: #f1f5f9;
    --pb-border: #e2e8f0;
    --pb-primary: #7c3aed;
    --pb-text: #0f172a;
    --pb-muted: #64748b;
    --pb-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
    --pb-shadow-md: 0 8px 24px rgba(15, 23, 42, 0.08);
    --pb-shadow-lg: 0 18px 45px rgba(15, 23, 42, 0.10);
    background: var(--pb-bg);
    color: var(--pb-text);
}

html[data-theme="light"] .public-bots-hero,
html[data-theme="light"] .public-bots-section,
html[data-theme="light"] .public-bot-detail {
    background: transparent;
}

html[data-theme="light"] .public-bots-hero h1,
html[data-theme="light"] .public-bot-title-row h1,
html[data-theme="light"] .public-bot-panel h2,
html[data-theme="light"] .public-bot-related h2,
html[data-theme="light"] .public-bot-card-head h2,
html[data-theme="light"] .public-bots-empty h2,
html[data-theme="light"] .strategy-title,
html[data-theme="light"] .strategy-title-link,
html[data-theme="light"] .public-bot-related-card strong {
    color: var(--pb-text) !important;
}

html[data-theme="light"] .public-bots-hero p,
html[data-theme="light"] .public-bot-description,
html[data-theme="light"] .public-bot-card-head p,
html[data-theme="light"] .public-bot-card-copy,
html[data-theme="light"] .public-bot-related-card span,
html[data-theme="light"] .public-bot-breadcrumb,
html[data-theme="light"] .public-bot-breadcrumb a,
html[data-theme="light"] .public-bots-filters span,
html[data-theme="light"] .strategy-disclaimer,
html[data-theme="light"] .metric-label,
html[data-theme="light"] .metric-unit,
html[data-theme="light"] .public-bot-metrics span,
html[data-theme="light"] .public-bot-performance-grid span,
html[data-theme="light"] .public-bot-config dt {
    color: var(--pb-muted) !important;
}

html[data-theme="light"] .public-bots-eyebrow {
    color: #059669;
}

html[data-theme="light"] .public-bots-filter-card,
html[data-theme="light"] .public-bots-search,
html[data-theme="light"] .public-bot-card,
html[data-theme="light"] .public-bot-panel,
html[data-theme="light"] .public-bots-empty,
html[data-theme="light"] .public-bot-related-card,
html[data-theme="light"] .public-bot-script-card,
html[data-theme="light"] .trading-strategy-card {
    background: var(--pb-surface) !important;
    border: 1px solid var(--pb-border) !important;
    border-radius: 8px;
    box-shadow: var(--pb-shadow-sm) !important;
    color: var(--pb-text) !important;
}

html[data-theme="light"] .public-bot-card:hover,
html[data-theme="light"] .public-bot-related-card:hover,
html[data-theme="light"] .public-bot-script-card:hover,
html[data-theme="light"] .trading-strategy-card:hover {
    border-color: color-mix(in srgb, var(--pb-primary) 45%, var(--pb-border)) !important;
    box-shadow: var(--pb-shadow-lg) !important;
}

html[data-theme="light"] .public-bot-card-media,
html[data-theme="light"] .public-bot-cover,
html[data-theme="light"] .strategy-chart-preview,
html[data-theme="light"] .chart-placeholder {
    background: var(--pb-surface-2) !important;
    border-color: var(--pb-border) !important;
}

html[data-theme="light"] .public-bot-placeholder,
html[data-theme="light"] .public-bot-card .public-bot-placeholder,
html[data-theme="light"] .chart-placeholder {
    background:
        radial-gradient(circle at 30% 20%, rgba(124, 58, 237, 0.18), transparent 18rem),
        linear-gradient(135deg, #f1f5f9, #ede9fe) !important;
    color: var(--pb-primary) !important;
}

html[data-theme="light"] .strategy-info,
html[data-theme="light"] .public-bot-card-body {
    background: var(--pb-surface) !important;
    color: var(--pb-text) !important;
}

html[data-theme="light"] .public-bots-filter-grid label > span {
    color: var(--pb-text) !important;
}

html[data-theme="light"] .public-bots-filter-grid input,
html[data-theme="light"] .public-bots-filter-grid select,
html[data-theme="light"] .public-bots-search input,
html[data-theme="light"] .public-bots-filters select {
    background: #ffffff !important;
    border: 1px solid var(--pb-border) !important;
    color: var(--pb-text) !important;
    box-shadow: var(--pb-shadow-sm);
}

html[data-theme="light"] .public-bots-filter-grid input:focus,
html[data-theme="light"] .public-bots-filter-grid select:focus,
html[data-theme="light"] .public-bots-search input:focus,
html[data-theme="light"] .public-bots-filters select:focus {
    border-color: var(--pb-primary) !important;
    box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.12);
    outline: none;
}

html[data-theme="light"] .public-bots-filter-grid input::placeholder,
html[data-theme="light"] .public-bots-search input::placeholder {
    color: #94a3b8;
}

html[data-theme="light"] .public-bot-card-head > span,
html[data-theme="light"] .public-bot-badges span,
html[data-theme="light"] .public-bot-tags span,
html[data-theme="light"] .bot-card-badges .badge {
    background: #ede9fe !important;
    border: 1px solid rgba(124, 58, 237, 0.18) !important;
    color: var(--pb-primary) !important;
}

html[data-theme="light"] .public-bot-metrics div,
html[data-theme="light"] .public-bot-performance-grid div,
html[data-theme="light"] .public-bot-feature-grid div,
html[data-theme="light"] .public-bot-config div,
html[data-theme="light"] .metric-card,
html[data-theme="light"] .public-bot-card .public-bot-metrics div {
    background: var(--pb-surface-2) !important;
    border: 1px solid var(--pb-border) !important;
    border-radius: 8px;
    box-shadow: none;
    color: var(--pb-text) !important;
}

html[data-theme="light"] .public-bot-metrics strong,
html[data-theme="light"] .public-bot-performance-grid strong,
html[data-theme="light"] .public-bot-config dd,
html[data-theme="light"] .metric-value {
    color: var(--pb-text) !important;
}

html[data-theme="light"] .color-violet,
html[data-theme="light"] .metric-card[data-tone="violet"] .metric-value {
    color: var(--pb-primary) !important;
}

html[data-theme="light"] .color-good,
html[data-theme="light"] .is-profit,
html[data-theme="light"] .metric-card[data-tone="good"] .metric-value {
    color: #059669 !important;
}

html[data-theme="light"] .color-bad,
html[data-theme="light"] .is-loss,
html[data-theme="light"] .metric-card[data-tone="bad"] .metric-value {
    color: #dc2626 !important;
}

html[data-theme="light"] .color-info,
html[data-theme="light"] .metric-card[data-tone="info"] .metric-value {
    color: #0284c7 !important;
}

html[data-theme="light"] .public-bots-clear-filter,
html[data-theme="light"] .public-bot-btn-ghost,
html[data-theme="light"] .public-bots-reset {
    background: #ffffff !important;
    border: 1px solid var(--pb-border) !important;
    color: var(--pb-text) !important;
    box-shadow: var(--pb-shadow-sm);
}

html[data-theme="light"] .public-bots-clear-filter:hover,
html[data-theme="light"] .public-bot-btn-ghost:hover,
html[data-theme="light"] .public-bots-reset:hover {
    border-color: color-mix(in srgb, var(--pb-primary) 35%, var(--pb-border)) !important;
    color: var(--pb-primary) !important;
}

html[data-theme="light"] .public-bot-screenshots img {
    border: 1px solid var(--pb-border);
    box-shadow: var(--pb-shadow-sm);
}

html[data-theme="light"] .pagination .page-link {
    background: #ffffff;
    border-color: var(--pb-border);
    color: var(--pb-text);
}

html[data-theme="light"] .pagination .page-item.active .page-link,
html[data-theme="light"] .pagination .page-link:hover {
    background: var(--pb-primary);
    border-color: var(--pb-primary);
    color: #ffffff;
}

/* Compact public bot detail layout */
.public-bot-detail {
    padding: 1.25rem 0 3rem;
}

.public-bot-detail .public-bot-breadcrumb {
    margin-bottom: 0.85rem;
}

.public-bot-detail-grid {
    align-items: start;
    gap: 1rem;
    grid-template-columns: minmax(0, 9fr) minmax(280px, 3fr);
}

.public-bot-main {
    gap: 0.85rem;
}

.public-bot-cover {
    aspect-ratio: auto;
    height: 300px;
    min-height: 0;
}

.public-bot-cover .public-bot-placeholder {
    min-height: 300px;
}

.public-bot-title-row {
    align-items: center;
    gap: 0.75rem;
}

.public-bot-title-row h1 {
    font-size: clamp(1.6rem, 2.8vw, 2.25rem);
    margin-bottom: 0;
}

.public-bot-title-row .public-bots-eyebrow {
    margin-bottom: 0.35rem;
}

.public-bot-badges {
    gap: 0.35rem;
}

.public-bot-badges span {
    font-size: 0.7rem;
    padding: 0.3rem 0.5rem;
}

.public-bot-description {
    font-size: 0.92rem;
    margin-bottom: 0;
}

.public-bot-detail .public-bot-panel {
    padding: 1rem;
}

.public-bot-detail .public-bot-panel h2,
.public-bot-related h2 {
    font-size: 1rem;
    margin-bottom: 0.75rem;
}

.public-bot-detail :is(.public-bot-feature-grid, .public-bot-performance-grid, .public-bot-screenshots) {
    gap: 0.6rem;
}

.public-bot-detail :is(.public-bot-feature-grid, .public-bot-performance-grid, .public-bot-config) > div {
    padding: 0.65rem;
}

.public-bot-screenshots img {
    height: 120px;
}

.public-bot-sticky {
    gap: 0.75rem;
    top: 5.5rem;
}

.public-bot-config {
    gap: 0.45rem;
}

.public-bot-config dt,
.public-bot-config dd {
    font-size: 0.82rem;
}

.public-bot-related {
    margin-top: 1.25rem;
}

@media (min-width: 768px) {
    .public-bot-detail .public-bot-performance-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .public-bot-detail-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .public-bot-cover {
        height: 220px;
    }

    .public-bot-cover .public-bot-placeholder {
        min-height: 220px;
    }

    .public-bot-detail .public-bot-panel {
        padding: 0.85rem;
    }
}