/*
 * Memur Kahvesi public hero contract
 * One shell, one spacing rhythm, one left-copy/right-actions layout.
 * Back-office pages stay on their own visual contract.
 */

body:not(.mk-shell-backoffice) .site-main {
    padding-top: 1.25rem !important;
}

body:not(.mk-shell-backoffice) .site-main > :is(
    .classic-forum-wrapper,
    .documents-page-container,
    .tools-page,
    .signals-page-container,
    .cetele-page-container,
    .favorites-page,
    .notifications-page,
    .active-sessions-page,
    .two-factor-page,
    .legal-static-page,
    .chat-page-modern,
    .becayis-page,
    .blog-page
) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Shared shell: the forum hero is the visual reference. */
body:not(.mk-shell-backoffice) .site-main :is(
    .page-hero,
    .forum-topbar,
    .forum-watch-hero,
    .leaderboard-hero
) {
    position: relative !important;
    z-index: 0;
    box-sizing: border-box !important;
    width: min(calc(100% - 2rem), var(--mk-container, 1220px)) !important;
    max-width: var(--mk-container, 1220px) !important;
    min-height: 220px !important;
    margin: 0 auto 1.25rem !important;
    padding: 1.35rem 1.5rem !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 8px !important;
    background: linear-gradient(112deg, #111827 0%, #24242d 52%, #8f2428 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16) !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .page-hero,
    .forum-topbar,
    .forum-watch-hero,
    .leaderboard-hero
)::after {
    position: absolute;
    right: -102px;
    bottom: -170px;
    width: 360px;
    height: 360px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 50%;
    box-shadow:
        0 0 0 46px rgba(255, 255, 255, 0.035),
        0 0 0 92px rgba(255, 255, 255, 0.025);
    content: "";
    pointer-events: none;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .page-hero,
    .forum-topbar,
    .forum-watch-hero,
    .leaderboard-hero
) > * {
    position: relative;
    z-index: 1;
}

/* Shared two-zone layout. */
body:not(.mk-shell-backoffice) .site-main :is(
    .page-hero > .hero-content,
    .page-hero > .mk-hero-content,
    .page-hero > .blog-hero-inner,
    .page-hero > .becayis-hero-inner,
    .forum-topbar,
    .forum-watch-hero,
    .leaderboard-hero > .hero-content
) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 1.25rem !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
}

/* Heroes with direct left and right regions. */
body:not(.mk-shell-backoffice) .site-main :is(
    .hero-left,
    .topbar-left,
    .mk-hero-left,
    .blog-hero-copy,
    .signals-hero-main,
    .becayis-hero-copy
) {
    min-width: 0;
    align-self: center;
    text-align: left !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .hero-right,
    .forum-topbar-actions,
    .hero-actions,
    .notifications-hero-actions,
    .signals-hero-stats,
    .forum-watch-stats,
    .favorites-hero-stats
) {
    min-width: 0;
    justify-self: end;
}

/* Stats come first, actions sit immediately to their right. */
body:not(.mk-shell-backoffice) .site-main :is(
    .hero-right,
    .becayis-hero-right
) {
    display: grid !important;
    grid-template-columns: auto auto !important;
    align-items: center !important;
    justify-content: end !important;
    gap: 0.65rem !important;
}

body:not(.mk-shell-backoffice) .site-main .signals-hero-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    margin-left: auto;
    gap: 12px !important;
    width: auto;
    max-width: 100%;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .hero-right > .hero-stats-grid,
    .hero-right > .hero-stats,
    .signals-hero-stats,
    .becayis-hero-stats
) {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 0.65rem !important;
    min-width: 0 !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .hero-right > .hero-actions,
    .hero-right > .documents-hero-actions,
    .hero-right > .becayis-hero-actions
) {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.55rem !important;
    min-width: max-content;
}

body:not(.mk-shell-backoffice) .site-main .signals-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    text-align: right;
    gap: 0.55rem;
    width: 100%;
    margin: 0;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .hero-stats-grid,
    .hero-stats,
    .forum-watch-stats
) {
    align-items: stretch;
    gap: 0.65rem;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .hero-stat-card,
    .hero-stats-grid > *,
    .hero-stats > *,
    .forum-watch-stats > *
) {
    box-sizing: border-box;
    min-width: 96px;
    min-height: 64px;
}

/* Cetele places stats before actions in the same right rail. */
body:not(.mk-shell-backoffice) .site-main .cetele-hero > .hero-content {
    grid-template-columns: minmax(0, 1fr) auto auto !important;
}

body:not(.mk-shell-backoffice) .site-main .cetele-hero .hero-left {
    grid-column: 1;
}

body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-hero-controls-row {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.85rem !important;
}

body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-hero-stats {
    grid-column: 2;
    justify-self: end;
    margin-right: 0.35rem !important;
}

body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-hero-actions {
    grid-column: 3;
    justify-self: end;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.55rem !important;
}

/* Signal detail hero: Balanced Left Content / Right Horizontal Bento Layout */
body:not(.mk-shell-backoffice) .site-main .signal-detail-hero {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;
    padding: 22px 28px !important;
}

body:not(.mk-shell-backoffice) .site-main .signal-detail-hero::before,
body:not(.mk-shell-backoffice) .site-main .signal-detail-hero::after {
    display: none;
    content: none;
    border: none;
    box-shadow: none;
}

body:not(.mk-shell-backoffice) .site-main .signal-detail-hero .signals-hero-main {
    flex: 1 1 auto;
    min-width: 0;
}

body:not(.mk-shell-backoffice) .site-main .signal-detail-hero .signals-hero-stats {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
    margin-left: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
}

body:not(.mk-shell-backoffice) .site-main .signal-detail-hero .signals-hero-stats > div,
body:not(.mk-shell-backoffice) .site-main .signal-detail-hero .signal-detail-stats-bento {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    width: auto;
    max-width: 100%;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
}

/* Legal pages and simple profile/security heroes use the same shell,
   but their copy remains a single left column. */
body:not(.mk-shell-backoffice) .site-main .legal-static-hero {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    text-align: left !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .hero-title,
    .forum-title,
    .mk-hero-title,
    .blog-hero h1,
    .page-hero h1,
    .forum-watch-hero h1,
    .leaderboard-hero h1
) {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: clamp(1.8rem, 2.5vw, 2.3rem) !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.022em !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .hero-subtitle,
    .forum-subtitle,
    .hero-description,
    .blog-hero p,
    .page-hero p
) {
    max-width: 62ch;
    color: #cbd5e1 !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    letter-spacing: -0.005em !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .hero-actions > a,
    .hero-actions > button,
    .forum-topbar-actions > a,
    .forum-topbar-actions > button,
    .notifications-hero-actions > form > button,
    .cetele-hero-actions > a,
    .cetele-hero-actions > button
) {
    min-height: 40px !important;
    white-space: nowrap !important;
}

body:not(.mk-shell-backoffice) .site-main .notifications-hero-actions :is(button, .notifications-mark-btn, .notifications-delete-all-btn) {
    color: #ffffff !important;
}

body:not(.mk-shell-backoffice) .site-main .notifications-hero-actions :is(button, .notifications-mark-btn, .notifications-delete-all-btn) :is(*, svg) {
    color: #ffffff;
    stroke: currentColor;
}

body:not(.mk-shell-backoffice) .site-main .notifications-hero-actions :is(button, .notifications-mark-btn, .notifications-delete-all-btn):disabled {
    color: #f8fafc !important;
    opacity: .85 !important;
}

body:not(.mk-shell-backoffice) .site-main .notifications-hero-actions :is(button, .notifications-mark-btn, .notifications-delete-all-btn):disabled :is(*, svg) {
    color: #f8fafc;
    stroke: currentColor;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .hero-bg-pattern,
    .hero-decoration,
    .page-hero-background
) {
    pointer-events: none;
}

/* Keep the framework's desktop details, but remove accidental extra top gaps. */
body:not(.mk-shell-backoffice) .site-main :is(
    .documents-page-container,
    .tools-page,
    .signals-page-container,
    .cetele-page-container,
    .favorites-page,
    .chat-page-modern,
    .becayis-page,
    .blog-page
) > :is(.page-hero, .documents-hero, .tools-hero, .signals-hero, .cetele-hero, .favorites-hero, .chat-hero, .becayis-hero, .blog-hero) {
    margin-top: 0 !important;
}

/* Mobile: preserve the same order while allowing controls to wrap cleanly. */
@media (max-width: 900px) {
    body:not(.mk-shell-backoffice) .site-main {
        padding-top: 0.75rem !important;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .page-hero,
        .forum-topbar,
        .forum-watch-hero,
        .leaderboard-hero
    ) {
        width: min(calc(100% - 1rem), var(--mk-container, 1220px)) !important;
        min-height: 0 !important;
        margin-bottom: 1rem !important;
        padding: 1.1rem !important;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .page-hero > .hero-content,
        .page-hero > .mk-hero-content,
        .page-hero > .blog-hero-inner,
        .page-hero > .becayis-hero-inner,
        .forum-topbar,
        .forum-watch-hero,
        .leaderboard-hero > .hero-content,
        .signal-detail-hero
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: start !important;
        gap: 0.9rem !important;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .hero-right,
        .forum-topbar-actions,
        .hero-actions,
        .notifications-hero-actions,
        .signals-hero-stats,
        .forum-watch-stats,
        .favorites-hero-stats
    ) {
        width: 100%;
        justify-self: stretch;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .hero-right,
        .becayis-hero-right,
        .signals-hero-right
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
        justify-content: stretch !important;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .hero-right > .hero-stats-grid,
        .hero-right > .hero-stats,
        .signals-hero-stats,
        .becayis-hero-stats,
        .hero-right > .hero-actions,
        .hero-right > .documents-hero-actions,
        .hero-right > .becayis-hero-actions,
        .signals-hero-actions
    ) {
        width: 100%;
        justify-content: flex-start !important;
    }

    body:not(.mk-shell-backoffice) .site-main .cetele-hero > .hero-content {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    body:not(.mk-shell-backoffice) .site-main .cetele-hero :is(
        .cetele-hero-stats,
        .cetele-hero-actions
    ) {
        grid-column: 1 !important;
        justify-self: stretch !important;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .hero-stats-grid,
        .hero-stats,
        .forum-watch-stats
    ) {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100%;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .hero-stat-card,
        .hero-stats-grid > *,
        .hero-stats > *,
        .forum-watch-stats > *
    ) {
        min-width: 0;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .hero-actions,
        .forum-topbar-actions,
        .notifications-hero-actions,
        .cetele-hero-actions
    ) {
        justify-content: flex-start !important;
    }
}

@media (max-width: 560px) {
    body:not(.mk-shell-backoffice) .site-main :is(
        .hero-title,
        .forum-title,
        .mk-hero-title,
        .blog-hero h1,
        .page-hero h1,
        .forum-watch-hero h1,
        .leaderboard-hero h1
    ) {
        font-size: 1.6rem !important;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .hero-stats-grid,
        .hero-stats,
        .forum-watch-stats
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .hero-actions > a,
        .hero-actions > button,
        .forum-topbar-actions > a,
        .forum-topbar-actions > button,
        .notifications-hero-actions > form > button,
        .cetele-hero-actions > a,
        .cetele-hero-actions > button
    ) {
        flex: 1 1 auto;
    }
}


/* Detail and workflow heroes that predate the shared page-hero class. */
body:not(.mk-shell-backoffice) .site-main :is(
    .law-detail-hero,
    .topic-hero,
    .article-hero,
    .prepare-hero,
    .studio-hero,
    .view-hero,
    .docs-hero
) {
    position: relative !important;
    z-index: 0;
    box-sizing: border-box !important;
    width: min(calc(100% - 2rem), var(--mk-container, 1220px)) !important;
    max-width: var(--mk-container, 1220px) !important;
    min-height: 220px !important;
    margin: 0 auto 1.25rem !important;
    padding: 1.35rem 1.5rem !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 8px !important;
    background: linear-gradient(112deg, #111827 0%, #24242d 52%, #8f2428 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16) !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .law-detail-hero,
    .topic-hero,
    .article-hero,
    .prepare-hero,
    .studio-hero,
    .view-hero,
    .docs-hero
)::after {
    position: absolute;
    right: -102px;
    bottom: -170px;
    width: 360px;
    height: 360px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 50%;
    box-shadow:
        0 0 0 46px rgba(255, 255, 255, 0.035),
        0 0 0 92px rgba(255, 255, 255, 0.025);
    content: "";
    pointer-events: none;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .law-detail-hero,
    .topic-hero,
    .article-hero,
    .prepare-hero,
    .studio-hero,
    .view-hero,
    .docs-hero
) > * {
    position: relative;
    z-index: 1;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .law-detail-hero,
    .topic-hero,
    .article-hero,
    .prepare-hero,
    .studio-hero,
    .view-hero,
    .docs-hero
) > :first-child {
    align-self: flex-start;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .law-detail-layout,
    .topic-hero-grid,
    .article-hero-layout,
    .prepare-hero-layout,
    .studio-hero-layout,
    .view-hero-layout,
    .docs-hero-layout
) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 1.25rem !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .law-detail-layout > div,
    .topic-hero-grid > div,
    .article-hero-layout > div,
    .prepare-hero-layout > div,
    .studio-hero-layout > div,
    .view-hero-layout > div,
    .docs-hero-layout > div
) {
    min-width: 0;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .law-detail-hero h1,
    .topic-hero h1,
    .article-hero h1,
    .prepare-hero h1,
    .studio-hero h1,
    .view-hero h1,
    .docs-hero h1
) {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: clamp(1.8rem, 2.5vw, 2.3rem) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .law-detail-hero p,
    .topic-hero p,
    .article-hero p,
    .prepare-hero p,
    .studio-hero p,
    .view-hero p,
    .docs-hero p
) {
    max-width: 62ch;
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .law-detail-hero > a,
    .topic-hero > a,
    .article-hero > a,
    .prepare-hero > a,
    .studio-hero > a,
    .view-hero > a,
    .docs-hero > a,
    .law-detail-layout > a,
    .article-hero-layout > a
) {
    color: #ffffff !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .tools-hero,
    .docs-hero,
    .studio-hero,
    .prepare-hero,
    .view-hero,
    .verify-hero
) :is(.hero-primary, .studio-hero-btn, .docs-hero-btn) {
    background: var(--mk-brand, #8f1d1d) !important;
    color: #ffffff !important;
    border: 1px solid var(--mk-brand, #8f1d1d) !important;
    box-shadow: 0 4px 14px rgba(143, 29, 29, 0.4) !important;
}

body:not(.mk-shell-backoffice) .site-main :is(
    .tools-hero,
    .docs-hero,
    .studio-hero,
    .prepare-hero,
    .view-hero,
    .verify-hero
) :is(.hero-primary, .studio-hero-btn, .docs-hero-btn):hover {
    background: var(--mk-brand-strong, #6f1717) !important;
    border-color: var(--mk-brand-strong, #6f1717) !important;
    color: #ffffff !important;
}

body:not(.mk-shell-backoffice) .site-main .mk-form-hero {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 1.25rem !important;
}

body:not(.mk-shell-backoffice) .site-main .mk-form-hero__content {
    display: flex !important;
    align-items: center !important;
    gap: 0.85rem !important;
    min-width: 0;
    margin: 0 !important;
}

body:not(.mk-shell-backoffice) .site-main .mk-form-hero__copy {
    min-width: 0;
    text-align: left !important;
}

body:not(.mk-shell-backoffice) .site-main .mk-form-hero__content h1,
body:not(.mk-shell-backoffice) .site-main .mk-form-hero__content p {
    color: #ffffff !important;
}

@media (max-width: 900px) {
    body:not(.mk-shell-backoffice) .site-main :is(
        .law-detail-hero,
        .topic-hero,
        .article-hero,
        .prepare-hero,
        .studio-hero,
        .view-hero,
        .docs-hero
    ) {
        width: min(calc(100% - 1rem), var(--mk-container, 1220px)) !important;
        min-height: 0 !important;
        margin-bottom: 1rem !important;
        padding: 1.1rem !important;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .law-detail-hero,
        .topic-hero,
        .article-hero,
        .prepare-hero,
        .studio-hero,
        .view-hero,
        .docs-hero,
        .law-detail-layout,
        .topic-hero-grid,
        .article-hero-layout,
        .prepare-hero-layout,
        .studio-hero-layout,
        .view-hero-layout,
        .docs-hero-layout,
        .mk-form-hero
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: start !important;
        gap: 0.9rem !important;
    }

    body:not(.mk-shell-backoffice) .site-main :is(
        .law-detail-layout > a,
        .article-hero-layout > a,
        .mk-form-hero__back
    ) {
        justify-self: start !important;
    }

    body:not(.mk-shell-backoffice) .site-main .mk-form-hero__content {
        align-items: flex-start !important;
    }
}

@media (max-width: 560px) {
    body:not(.mk-shell-backoffice) .site-main :is(
        .law-detail-hero h1,
        .topic-hero h1,
        .article-hero h1,
        .prepare-hero h1,
        .studio-hero h1,
        .view-hero h1,
        .docs-hero h1,
        .mk-form-hero__content h1
    ) {
        font-size: 1.6rem !important;
    }
}


/* The work center keeps its summary inside the hero: stats, then actions. */
body:not(.mk-shell-backoffice) .site-main .tools-hero > .hero-content {
    grid-template-columns: minmax(0, 1fr) auto auto !important;
}

body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-left {
    grid-column: 1;
}

body:not(.mk-shell-backoffice) .site-main .tools-hero .tools-summary-bar {
    grid-column: 2;
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-self: end;
    gap: 0.65rem !important;
}

body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-actions {
    grid-column: 3;
    justify-self: end;
}

@media (max-width: 900px) {
    body:not(.mk-shell-backoffice) .site-main .tools-hero > .hero-content {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    body:not(.mk-shell-backoffice) .site-main .tools-hero :is(
        .tools-summary-bar,
        .hero-actions
    ) {
        grid-column: 1 !important;
        justify-self: stretch !important;
    }

    body:not(.mk-shell-backoffice) .site-main .tools-hero .tools-summary-bar {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px !important;
    }
}

@media (max-width: 560px) {
    body:not(.mk-shell-backoffice) .site-main .tools-hero .tools-summary-bar {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px !important;
    }
}


/*
 * Final lock: the shell itself must never be reset by its inner-grid rule.
 * Desktop cards share the exact forum reference dimensions.
 */
@media (min-width: 901px) {
    html body:not(.mk-shell-backoffice) .site-main :is(
        .page-hero,
        .forum-topbar,
        .forum-watch-hero,
        .leaderboard-hero,
        .law-detail-hero,
        .article-hero,
        .prepare-hero,
        .studio-hero,
        .view-hero,
        .docs-hero
    ) {
        width: min(calc(100% - 2rem), var(--mk-container, 1220px)) !important;
        max-width: var(--mk-container, 1220px) !important;
        height: 220px !important;
        min-height: 220px !important;
        max-height: 220px !important;
        margin-top: 0 !important;
        margin-bottom: 1.25rem !important;
        padding: 1.35rem 1.5rem !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        background: linear-gradient(112deg, #111827 0%, #24242d 52%, #8f2428 100%) !important;
        border-radius: 8px !important;
    }

    /* Remove page-specific top offsets; site-main owns the single gap. */
    html body:not(.mk-shell-backoffice) .site-main > .page-shell.page-shell,
    html body:not(.mk-shell-backoffice) .site-main > .classic-forum-wrapper.classic-forum-wrapper,
    html body:not(.mk-shell-backoffice) .site-main > .tools-page.tools-page,
    html body:not(.mk-shell-backoffice) .site-main > .blog-page.blog-page,
    html body:not(.mk-shell-backoffice) .site-main > .documents-page-container.documents-page-container,
    html body:not(.mk-shell-backoffice) .site-main > .signals-page-container.signals-page-container,
    html body:not(.mk-shell-backoffice) .site-main > .cetele-page-container.cetele-page-container {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    /* Forum and watch heroes are their own grid containers. */
    html body:not(.mk-shell-backoffice) .site-main :is(
        .forum-topbar,
        .forum-watch-hero,
        .leaderboard-hero
    ) {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 1.25rem !important;
    }

    /* Re-assert the tools composition after moving its stats into the hero. */
    html body:not(.mk-shell-backoffice) .site-main .tools-hero > .hero-content {
        grid-template-columns: minmax(0, 1fr) auto auto !important;
        min-height: 100% !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .tools-summary-bar {
        grid-column: 2 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-actions {
        grid-column: 3 !important;
    }
}

@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main :is(
        .page-hero,
        .forum-topbar,
        .forum-watch-hero,
        .leaderboard-hero,
        .law-detail-hero,
        .topic-hero,
        .article-hero,
        .prepare-hero,
        .studio-hero,
        .view-hero,
        .docs-hero
    ) {
        width: min(calc(100% - 1rem), var(--mk-container, 1220px)) !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin-top: 0 !important;
        margin-bottom: 1rem !important;
        padding: 1.1rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main > .page-shell.page-shell,
    html body:not(.mk-shell-backoffice) .site-main > .classic-forum-wrapper.classic-forum-wrapper,
    html body:not(.mk-shell-backoffice) .site-main > .tools-page.tools-page,
    html body:not(.mk-shell-backoffice) .site-main > .blog-page.blog-page {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
}


/* Inner page shells must not introduce a second header-to-hero gap. */
@media (min-width: 901px) {
    html body:not(.mk-shell-backoffice) .site-main > .tools-page.tools-page.classic-forum-wrapper.forum-reference-wrapper,
    html body:not(.mk-shell-backoffice) .site-main > .mk-legal-search.mk-legal-search,
    html body:not(.mk-shell-backoffice) .site-main > .mk-aym-search.mk-aym-search,
    html body:not(.mk-shell-backoffice) .site-main > .mk-announcements.mk-announcements,
    html body:not(.mk-shell-backoffice) .site-main > .mk-cities-main.mk-cities-main,
    html body:not(.mk-shell-backoffice) .site-main > .mk-compare-main.mk-compare-main {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main > :is(
        .mk-legal-search,
        .mk-aym-search,
        .mk-announcements,
        .mk-cities-main,
        .mk-compare-main
    ) > :is(
        .emsal-page-container,
        .aym-page-container,
        .announcements-page-container,
        .city-page,
        .compare-page
    ) {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
}

@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main > :is(
        .mk-legal-search,
        .mk-aym-search,
        .mk-announcements,
        .mk-cities-main,
        .mk-compare-main
    ) > :is(
        .emsal-page-container,
        .aym-page-container,
        .announcements-page-container,
        .city-page,
        .compare-page
    ) {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
}


/* A hero inside a page shell must fill that shell exactly.
   Applying calc(100% - gap) here creates the document-page inset. */
html body:not(.mk-shell-backoffice) .site-main :is(
    .page-hero,
    .forum-topbar,
    .forum-watch-hero,
    .leaderboard-hero,
    .law-detail-hero,
    .topic-hero,
    .article-hero,
    .prepare-hero,
    .studio-hero,
    .view-hero,
    .docs-hero
) {
    width: 100% !important;
    max-width: none !important;
}

/* Final cross-page alignment pass.
   Some older page styles still assign their own grid areas after the shared
   hero contract. Keep the common shell, then correct only those inner rails. */
@media (min-width: 901px) {
    /* A top-level hero uses the same centered rail as the forum page. */
    html body:not(.mk-shell-backoffice) .site-main > :is(
        .page-hero,
        .forum-topbar,
        .forum-watch-hero,
        .leaderboard-hero,
        .law-detail-hero,
        .topic-hero,
        .article-hero,
        .prepare-hero,
        .studio-hero,
        .view-hero,
        .docs-hero
    ) {
        width: min(calc(100% - 2rem), var(--mk-container, 1220px)) !important;
        max-width: var(--mk-container, 1220px) !important;
    }

    /* Three announcement/search counters stay on one horizontal rail. */
    html body:not(.mk-shell-backoffice) .site-main :is(
        .page-hero > .hero-content > .hero-stats-grid,
        .page-hero > .mk-hero-content > .hero-stats-grid
    ) {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        grid-template-columns: none !important;
        gap: .65rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main :is(
        .page-hero > .hero-content > .hero-stats-grid > *,
        .page-hero > .mk-hero-content > .hero-stats-grid > *
    ) {
        flex: 0 0 auto !important;
        min-width: 96px !important;
    }

    /* Documents: counters first, upload action at the far right. */
    html body:not(.mk-shell-backoffice) .site-main .documents-hero .documents-hero-right {
        display: grid !important;
        grid-template-columns: auto auto !important;
        grid-template-areas: none !important;
        align-items: center !important;
        justify-content: end !important;
        gap: .65rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .documents-hero .documents-hero-right > .hero-stats-grid {
        grid-area: auto !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .documents-hero .documents-hero-right > .documents-hero-actions {
        grid-area: auto;
        grid-column: 2;
        grid-row: 1;
        align-self: center;
        justify-self: end;
        margin: 0;
    }

    /* Process center: reserve a real column for counters and actions so the
       greeting can wrap instead of running underneath them. */
    html body:not(.mk-shell-backoffice) .site-main .tools-hero > .hero-content {
        grid-template-columns: minmax(0, 1fr) auto auto !important;
        grid-template-areas: "copy stats actions" !important;
        align-items: center !important;
        gap: .75rem !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-left {
        grid-area: copy !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-title,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero h1 {
        max-width: 100% !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        font-size: clamp(1.45rem, 2vw, 1.9rem) !important;
        line-height: 1.12 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .tools-summary-bar {
        grid-area: stats !important;
        grid-column: auto !important;
        grid-row: auto !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        width: auto !important;
        min-width: 0 !important;
        gap: .55rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-actions {
        grid-area: actions !important;
        grid-column: auto !important;
        grid-row: auto !important;
        justify-self: end !important;
        width: auto !important;
        min-width: max-content !important;
    }

    /* Becayis: keep the copy left, counters before the action rail, and both
       action buttons together at the far right. */
    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-inner {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-areas: "copy rail" !important;
        align-items: center !important;
        gap: 1.25rem !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-inner > .hero-left {
        grid-area: copy !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-inner > .hero-right {
        grid-area: rail !important;
        display: grid !important;
        grid-template-columns: auto auto !important;
        grid-template-areas: "stats actions" !important;
        align-items: center !important;
        justify-self: end !important;
        gap: .65rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-right > .hero-stats {
        grid-area: stats;
        grid-column: auto;
        grid-row: auto;
        display: flex;
        flex-wrap: nowrap;
        width: auto;
    }

    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-right > .becayis-hero-actions {
        grid-area: actions;
        grid-column: auto;
        grid-row: auto;
        justify-self: end;
        width: auto;
        min-width: max-content !important;
        margin: 0;
    }
}

@media (max-width: 900px) {
    /* Keep top-level heroes centered while nested heroes fill their shell. */
    html body:not(.mk-shell-backoffice) .site-main > :is(
        .page-hero,
        .forum-topbar,
        .forum-watch-hero,
        .leaderboard-hero,
        .law-detail-hero,
        .topic-hero,
        .article-hero,
        .prepare-hero,
        .studio-hero,
        .view-hero,
        .docs-hero
    ) {
        width: min(calc(100% - 1rem), var(--mk-container, 1220px)) !important;
        max-width: var(--mk-container, 1220px) !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .documents-hero .documents-hero-right {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas: "stats" "actions" !important;
        justify-content: stretch !important;
        width: 100% !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .documents-hero .documents-hero-right > .hero-stats-grid {
        grid-area: stats !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 100% !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .documents-hero .documents-hero-right > .documents-hero-actions {
        grid-area: actions;
        grid-column: 1;
        grid-row: 2;
        justify-self: start;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero > .hero-content {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas: "copy" "stats" "actions" !important;
        overflow: visible !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .tools-summary-bar,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-actions {
        grid-column: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .tools-summary-bar {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-actions {
        justify-self: stretch !important;
        justify-content: flex-start !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-inner {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas: "copy" "rail" !important;
        align-items: start !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-inner > .hero-right {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas: "stats" "actions" !important;
        justify-self: stretch !important;
        width: 100% !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-right > .hero-stats,
    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-right > .becayis-hero-actions {
        grid-column: 1 !important;
        width: 100% !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .becayis-hero-right > .becayis-hero-actions {
        justify-self: start !important;
    }
}


/* Signal hero: keep counters and actions on one centered right rail. */
@media (min-width: 901px) {
    html body:not(.mk-shell-backoffice) .site-main .signals-hero > .hero-content {
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: minmax(0, 1fr) !important;
        grid-template-areas: "copy rail" !important;
        align-items: center !important;
        gap: 1.25rem !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .signals-hero > .hero-content > .signals-hero-main {
        grid-area: copy !important;
        grid-column: auto !important;
        grid-row: auto !important;
        align-self: center !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .signals-hero > .hero-content > .signals-hero-right {
        grid-area: rail !important;
        grid-column: auto !important;
        grid-row: auto !important;
        display: grid !important;
        grid-template-columns: auto auto !important;
        grid-template-areas: "stats actions" !important;
        align-items: center !important;
        align-self: center !important;
        justify-self: end !important;
        gap: .65rem !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .signals-hero .signals-hero-stats {
        grid-area: stats;
        grid-column: auto;
        grid-row: auto;
        display: flex;
        flex-wrap: nowrap !important;
        align-items: center;
        align-self: center;
        justify-self: end;
        width: auto;
        min-width: 0;
        gap: .55rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .signals-hero .signals-hero-actions {
        grid-area: actions;
        grid-column: auto;
        grid-row: auto;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        align-self: center;
        justify-content: center;
        justify-self: center;
        text-align: center;
        width: 100%;
        margin: 14px auto 0 auto;
        gap: .55rem;
    }
}

@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main .signals-hero > .hero-content {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: auto !important;
        grid-template-areas: "copy" "rail" !important;
        align-items: start !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .signals-hero > .hero-content > .signals-hero-main {
        grid-area: copy !important;
        grid-column: 1 !important;
        grid-row: auto !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .signals-hero > .hero-content > .signals-hero-right {
        grid-area: rail !important;
        grid-column: 1 !important;
        grid-row: auto !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas: "stats" "actions" !important;
        justify-self: stretch !important;
        align-self: start !important;
        width: 100% !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .signals-hero .signals-hero-stats {
        grid-area: stats;
        grid-column: 1;
        grid-row: auto;
        width: 100%;
    }

    html body:not(.mk-shell-backoffice) .site-main .signals-hero .signals-hero-actions {
        grid-area: actions;
        grid-column: 1;
        grid-row: auto;
        justify-self: start;
        width: 100%;
        margin: 0;
    }
}


/* Blog hero search: use the same right-side action rail as the forum hero. */
@media (min-width: 901px) {
    html body:not(.mk-shell-backoffice) .site-main > .blog-hero > .blog-hero-inner {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 650px) !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        gap: 1.25rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main > .blog-hero > .blog-hero-inner > .hero-right {
        display: block !important;
        width: min(100%, 650px) !important;
        max-width: 650px !important;
        justify-self: end !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main > .blog-hero .blog-search {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        gap: .55rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main > .blog-hero .blog-search input {
        width: 100% !important;
        min-width: 0;
    }

    html body:not(.mk-shell-backoffice) .site-main > .blog-hero .blog-search button {
        width: auto !important;
        min-width: 82px !important;
        white-space: nowrap;
    }
}

@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main > .blog-hero > .blog-hero-inner {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main > .blog-hero > .blog-hero-inner > .hero-right,
    html body:not(.mk-shell-backoffice) .site-main > .blog-hero .blog-search {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main > .blog-hero .blog-search {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: .5rem !important;
    }
}


/* Shared hero rail control height.
   Stat cards are the reference; buttons match their two-line information rhythm. */
@media (min-width: 901px) {
    html body:not(.mk-shell-backoffice) .site-main :is(
        .page-hero,
        .tools-hero,
        .signals-hero,
        .cetele-hero,
        .chat-hero,
        .favorites-hero,
        .notifications-hero,
        .active-sessions-hero,
        .two-factor-hero,
        .messages-hero
    ) :is(
        .hero-stat-card,
        .hero-stats-grid > *,
        .hero-stats > *,
        .signals-hero-stats > *,
        .hstat
    ) {
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
        box-sizing: border-box !important;
        align-self: center !important;
    }

    html body:not(.mk-shell-backoffice) .site-main :is(
        .page-hero,
        .tools-hero,
        .signals-hero,
        .cetele-hero,
        .chat-hero,
        .favorites-hero,
        .notifications-hero,
        .active-sessions-hero,
        .two-factor-hero,
        .messages-hero
    ) :is(
        .hero-actions > a,
        .hero-actions > button,
        .documents-hero-actions > a,
        .becayis-hero-actions > a,
        .cetele-hero-actions > a,
        .btn-upload,
        .btn-hero,
        .hero-primary,
        .hero-secondary,
        .blog-search button
    ) {
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
        box-sizing: border-box;
        align-self: center !important;
        white-space: nowrap;
    }

    html body:not(.mk-shell-backoffice) .site-main :is(.signals-hero, .page-hero) .signals-hero-actions :is(> a, button, .btn-primary-signal, .btn-secondary-signal) {
        height: 38px;
        min-height: 38px;
        max-height: 38px;
        padding: 0 16px;
        font-size: 0.84rem;
        line-height: 38px;
        border-radius: 8px;
        box-sizing: border-box;
        align-self: center;
        white-space: nowrap;
    }
}

@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main :is(
        .page-hero,
        .tools-hero,
        .signals-hero,
        .cetele-hero,
        .chat-hero,
        .favorites-hero,
        .notifications-hero,
        .active-sessions-hero,
        .two-factor-hero,
        .messages-hero
    ) :is(
        .hero-stat-card,
        .hero-stats-grid > *,
        .hero-stats > *,
        .signals-hero-stats > *,
        .hstat,
        .hero-actions > a,
        .hero-actions > button,
        .documents-hero-actions > a,
        .becayis-hero-actions > a,
        .signals-hero-actions > a,
        .cetele-hero-actions > a,
        .btn-upload,
        .btn-hero,
        .hero-primary,
        .hero-secondary,
        .blog-search button
    ) {
        min-height: 48px !important;
        box-sizing: border-box !important;
    }
}


/* Controlled module accents: one hero system, distinct product identities. */
body.mk-page-forum {
    --mk-hero-accent: #60a5fa;
    --mk-hero-accent-strong: #2563eb;
}
body.mk-page-blog {
    --mk-hero-accent: #fb7185;
    --mk-hero-accent-strong: #e11d48;
}
body.mk-page-documents {
    --mk-hero-accent: #f5b94c;
    --mk-hero-accent-strong: #ea580c;
}
body.mk-page-tools {
    --mk-hero-accent: #22d3ee;
    --mk-hero-accent-strong: #0891b2;
}
body.mk-page-archive {
    --mk-hero-accent: #34d399;
    --mk-hero-accent-strong: #0f9d8e;
}
body.mk-page-becayis {
    --mk-hero-accent: #2dd4bf;
    --mk-hero-accent-strong: #0f9d8e;
}
body.mk-page-signals {
    --mk-hero-accent: #fb7185;
    --mk-hero-accent-strong: #e11d48;
}
body.mk-page-legal,
body.mk-page-legal-search {
    --mk-hero-accent: #38bdf8;
    --mk-hero-accent-strong: #0284c7;
}
body.mk-page-announcements {
    --mk-hero-accent: #fb923c;
    --mk-hero-accent-strong: #ea580c;
}
body.mk-page-cities {
    --mk-hero-accent: #34d399;
    --mk-hero-accent-strong: #059669;
}
body.mk-page-search {
    --mk-hero-accent: #fda4af;
    --mk-hero-accent-strong: #e11d48;
}
body.mk-page-notifications,
body.mk-page-messages {
    --mk-hero-accent: #60a5fa;
    --mk-hero-accent-strong: #2563eb;
}
body.mk-page-active-sessions,
body.mk-page-two-factor {
    --mk-hero-accent: #34d399;
    --mk-hero-accent-strong: #059669;
}

html body:not(.mk-shell-backoffice) .site-main :is(
    .page-hero,
    .tools-hero,
    .signals-hero,
    .cetele-hero,
    .chat-hero,
    .favorites-hero,
    .notifications-hero,
    .active-sessions-hero,
    .two-factor-hero,
    .messages-hero
) {
    border-left-color: var(--mk-hero-accent, #60a5fa) !important;
}

html body:not(.mk-shell-backoffice) .site-main :is(
    .page-hero h1 > svg,
    .tools-hero h1 > svg,
    .hero-title > svg,
    .mk-hero-title > svg,
    .hero-eyebrow > svg,
    .tools-kicker > svg,
    .signals-kicker > svg
) {
    color: var(--mk-hero-accent, #60a5fa) !important;
}

html body:not(.mk-shell-backoffice) .site-main :is(
    .page-hero .hero-stat-card,
    .page-hero .hero-stats-grid > *,
    .page-hero .hero-stats > *,
    .tools-hero .hero-stat-card,
    .signals-hero .hero-stat-card,
    .cetele-hero .hero-stat-card,
    .hstat
) {
    border-color: color-mix(in srgb, var(--mk-hero-accent, #60a5fa) 42%, rgba(255, 255, 255, .18)) !important;
}

html body:not(.mk-shell-backoffice) .site-main :is(
    .page-hero .stat-icon,
    .page-hero .hero-stat-card > svg,
    .tools-hero .stat-icon,
    .cetele-hero .stat-icon,
    .signals-hero .hero-stat-card > svg
) {
    color: var(--mk-hero-accent, #60a5fa) !important;
}

html body:not(.mk-shell-backoffice) .site-main :is(
    .hero-primary,
    .hero-actions .btn-new-topic,
    .btn-primary-signal,
    .btn-upload,
    .btn-hero:not(.btn-outline),
    .btn-hero-primary,
    .blog-button-primary,
    .mk-hero-official-btn
) {
    background: var(--mk-hero-accent-strong, #2563eb) !important;
    border-color: var(--mk-hero-accent-strong, #2563eb) !important;
    color: #fff !important;
}

html body:not(.mk-shell-backoffice) .site-main :is(
    .hero-secondary,
    .btn-secondary-signal,
    .btn-hero-secondary,
    .btn-outline
) {
    border-color: color-mix(in srgb, var(--mk-hero-accent, #60a5fa) 48%, rgba(255, 255, 255, .32)) !important;
}


/* Keep legacy premium selectors on the same module accent token. */
body.mk-page-forum { --premium-accent: #2563eb; }
body.mk-page-blog { --premium-accent: #e11d48; }
body.mk-page-documents { --premium-accent: #ea580c; }
body.mk-page-tools { --premium-accent: #0891b2; }
body.mk-page-archive { --premium-accent: #0f9d8e; }
body.mk-page-becayis { --premium-accent: #0f9d8e; }
body.mk-page-signals { --premium-accent: #e11d48; }
body.mk-page-legal,
body.mk-page-legal-search { --premium-accent: #0284c7; }
body.mk-page-announcements { --premium-accent: #ea580c; }
body.mk-page-cities { --premium-accent: #059669; }
body.mk-page-search { --premium-accent: #e11d48; }
body.mk-page-notifications,
body.mk-page-messages { --premium-accent: #2563eb; }
body.mk-page-active-sessions,
body.mk-page-two-factor { --premium-accent: #059669; }
/* Current detail/list fixes: becayis, people directory, document uploader and topic actions. */

/* People directory: forum-like single-column rows with aligned controls. */
body.mk-page-users .filter-bar {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: .65rem !important;
}
body.mk-page-users .filter-bar .search-box {
    display: flex;
    align-items: center;
    gap: .5rem;
    min-width: 0;
}
body.mk-page-users .filter-bar .search-box svg {
    flex: 0 0 auto;
    color: #64748b;
}
body.mk-page-users .filter-bar :where(input, select, button, a) {
    min-height: 44px !important;
    box-sizing: border-box !important;
}
body.mk-page-users .filter-bar .search-box input {
    width: 100%;
    min-width: 0;
}
body.mk-page-users .users-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .55rem !important;
    padding: .7rem !important;
}
body.mk-page-users .user-card {
    display: grid !important;
    grid-template-columns: minmax(240px, 1fr) auto auto !important;
    align-items: center !important;
    gap: 1rem !important;
    min-width: 0 !important;
    padding: .8rem 1rem !important;
}
body.mk-page-users .user-card-header {
    min-width: 0 !important;
}
body.mk-page-users .user-stats {
    display: flex !important;
    align-items: center !important;
    gap: .9rem !important;
    margin: 0 !important;
    padding: 0 1rem !important;
    border-left: 1px solid var(--mk-color-line, #e2e8f0) !important;
    border-top: 0 !important;
}
body.mk-page-users .user-stats .stat-item {
    min-width: 48px;
}
body.mk-page-users .user-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .75rem !important;
    min-width: 175px !important;
    margin: 0 !important;
    padding: 0 0 0 1rem !important;
    border-left: 1px solid var(--mk-color-line, #e2e8f0) !important;
}
body.mk-page-users .user-date {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.55rem;
    background: rgba(0, 0, 0, 0.03);
    border: 1px solid var(--mk-color-line, #e2e8f0) !important;
    border-radius: 6px;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--mk-muted, #64748b);
    white-space: nowrap;
    box-sizing: border-box;
    line-height: 1;
    flex-shrink: 0;
}
body.mk-page-users .user-date svg,
body.mk-page-users .user-date .icon-svg {
    width: 13px !important;
    height: 13px !important;
    min-width: 13px !important;
    max-width: 13px !important;
    max-height: 13px !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
    stroke-width: 2.2 !important;
}
body.mk-page-users .user-action {
    white-space: nowrap !important;
    color: var(--pm-strong, #1d4ed8) !important;
    font-weight: 800 !important;
}

/* Leaderboard: keep the table as a compact, one-column forum-style stream. */
body.mk-page-leaderboard .leaderboard-list {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .55rem !important;
}
body.mk-page-leaderboard .leaderboard-item {
    grid-template-columns: 52px minmax(220px, 1fr) auto !important;
    align-items: center !important;
    gap: 1rem !important;
    min-height: 68px !important;
    padding: .75rem 1rem !important;
}
body.mk-page-leaderboard .stats-col {
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .85rem !important;
    min-width: 0 !important;
}
body.mk-page-leaderboard .stat-item {
    min-width: 50px;
}

/* Document details: separate download states and make the uploader an actual profile rail. */
body.mk-page-document-detail .download-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: .65rem !important;
    margin-top: 1rem !important;
}
body.mk-page-document-detail .document-download-quota {
    display: block !important;
    margin: 0 !important;
    padding: .35rem .6rem !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 999px !important;
    background: #f8fafc !important;
    color: #64748b !important;
    line-height: 1.35 !important;
}
body.mk-page-document-detail .document-save-form {
    margin: .1rem 0 0 !important;
}
body.mk-page-document-detail .uploader-info {
    display: flex;
    flex-direction: column;
    align-items: center !important;
    text-align: center;
    gap: .75rem;
}
body.mk-page-document-detail .uploader-avatar-link {
    position: relative;
    display: inline-block !important;
    width: 88px;
    height: 88px;
    margin: 0 auto;
}
body.mk-page-document-detail .uploader-avatar-ring {
    position: relative !important;
    width: 88px !important;
    height: 88px !important;
    flex: 0 0 88px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    border: 3px solid #f1f5f9 !important;
    background: #f8fafc !important;
    box-shadow: 0 4px 14px rgba(15, 23, 42, .08) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}
body.mk-page-document-detail .uploader-avatar,
body.mk-page-document-detail .uploader-avatar-placeholder {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
    border-radius: 50%;
    margin: 0;
    padding: 0;
}
body.mk-page-document-detail .uploader-avatar-placeholder {
    display: grid !important;
    place-items: center !important;
    color: #475569 !important;
    background: #f1f5f9 !important;
    font-size: 1.85rem !important;
    font-weight: 900 !important;
}
body.mk-page-document-detail .uploader-details {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
}
body.mk-page-document-detail .uploader-name {
    display: block !important;
    font-size: 1.45rem !important;
    font-weight: 900 !important;
    color: var(--rank-color, #dc2626) !important;
    text-decoration: none !important;
    letter-spacing: -.02em !important;
    line-height: 1.2 !important;
    margin-bottom: .25rem !important;
}
body.mk-page-document-detail .uploader-name:hover {
    opacity: .88 !important;
}
body.mk-page-document-detail .uploader-badges {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .35rem;
}
body.mk-page-document-detail .uploader-stats {
    margin-top: 1rem !important;
    padding-top: .8rem !important;
    border-top: 1px solid var(--mk-color-line, #e2e8f0) !important;
}

/* Topic Header Card & Layout */
body.mk-page-forum-topic .topic-header-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    box-sizing: border-box !important;
    gap: 0.75rem !important;
}

body.mk-page-legal .topic-header-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 220px !important;
    min-height: 220px !important;
    max-height: 220px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    padding: 0.95rem 1.45rem !important;
}

body.mk-page-legal .topic-header-main {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100% !important;
    gap: 0;
    width: 100% !important;
}

body.mk-page-legal .topic-title-section {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.15rem !important;
}

body.mk-page-legal .topic-action-toolbar {
    margin: 0 !important;
}

/* Topic header top row: Badges and Topic Meta on the same top line */
body.mk-page-forum-topic .topic-header-main {
    display: flex !important;
    flex-direction: column !important;
    gap: .55rem !important;
    width: 100% !important;
}
body.mk-page-forum-topic .topic-title-section {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: .45rem !important;
}
body.mk-page-forum-topic .topic-header-top-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: .5rem 1rem !important;
    width: 100% !important;
}
body.mk-page-forum-topic .topic-badges {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: .4rem !important;
}
body.mk-page-forum-topic .topic-meta {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: .4rem !important;
    margin: 0 !important;
}
body.mk-page-forum-topic .topic-meta .meta-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: .3rem !important;
    padding: .22rem .55rem !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .09) !important;
    border: 1px solid rgba(255, 255, 255, .15) !important;
    color: rgba(255, 255, 255, .9) !important;
    font-size: .75rem !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}
body.mk-page-forum-topic .topic-meta .meta-icon svg {
    width: 13px !important;
    height: 13px !important;
    opacity: .85 !important;
}

/* Topic action toolbar: Share bar & User Action Buttons */
body.mk-page-forum-topic .topic-action-toolbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: .75rem 1.25rem !important;
    width: 100% !important;
    margin: .15rem 0 .25rem !important;
}
body.mk-page-forum-topic .topic-share-area {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
}
body.mk-page-forum-topic .mk-share-bar--topic {
    display: inline-flex !important;
    align-items: center !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: .2rem .45rem !important;
    border: 1px solid rgba(15, 23, 42, .14) !important;
    border-radius: 9px !important;
    background: rgba(248, 250, 252, .96) !important;
    box-sizing: border-box !important;
    gap: .4rem !important;
}
body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__label {
    font-size: .72rem !important;
    font-weight: 800 !important;
    color: #475569 !important;
    text-transform: uppercase !important;
    letter-spacing: .03em !important;
    padding-left: .25rem !important;
    margin: 0 !important;
    line-height: 1 !important;
}
body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__actions {
    display: inline-flex !important;
    align-items: center !important;
    gap: .3rem !important;
    flex-wrap: nowrap !important;
    margin: 0 !important;
    padding: 0 !important;
}
body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .3rem !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 .65rem !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    border-radius: 7px !important;
    border: 1px solid #cbd5e1 !important;
    background: #ffffff !important;
    color: #0f172a !important;
    line-height: 1.2 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05) !important;
    white-space: nowrap !important;
}
body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__btn svg {
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 auto !important;
}
body.mk-page-forum-topic .topic-user-actions {
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .45rem !important;
    margin: 0 !important;
    min-width: 0 !important;
    width: auto !important;
    flex: 1 1 auto !important;
}
body.mk-page-forum-topic .topic-user-actions > *,
body.mk-page-forum-topic .topic-user-actions :where(.inline-form) {
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
}
body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .38rem !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 .85rem !important;
    font-size: .82rem !important;
    font-weight: 700 !important;
    border-radius: 9px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    width: auto !important;
    white-space: nowrap !important;
    line-height: 1.2 !important;
}
body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) .btn-icon svg {
    width: 15px !important;
    height: 15px !important;
    flex: 0 0 auto !important;
}
body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) .btn-text-short {
    display: none;
}
body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) .btn-text-full {
    display: inline;
}
body.mk-page-forum-topic .mk-share-bar--topic .mk-share-text-short {
    display: none;
}
body.mk-page-forum-topic .mk-share-bar--topic .mk-share-text-full {
    display: inline;
}

/* Moderation Tools Panel - Full Width Premium Strip */
body.mk-page-forum-topic .topic-moderation-panel {
    display: block !important;
    width: 100% !important;
    margin-top: .85rem !important;
    border: 1px solid rgba(255, 255, 255, .18) !important;
    border-radius: 10px !important;
    background: rgba(15, 23, 42, .45) !important;
    backdrop-filter: blur(8px) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    clear: both !important;
}
body.mk-page-forum-topic .topic-moderation-panel > summary {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: .6rem 1rem !important;
    font-size: .85rem !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: background .15s ease !important;
}
body.mk-page-forum-topic .topic-moderation-panel > summary:hover {
    background: rgba(255, 255, 255, .06) !important;
}
body.mk-page-forum-topic .topic-moderation-summary-title {
    display: inline-flex !important;
    align-items: center !important;
    gap: .45rem !important;
    color: #ffffff !important;
    font-weight: 800 !important;
}
body.mk-page-forum-topic .topic-moderation-summary-title svg {
    width: 16px !important;
    height: 16px !important;
    color: #38bdf8 !important;
}
body.mk-page-forum-topic .topic-moderation-summary-help {
    display: inline-block !important;
    color: rgba(255, 255, 255, .65) !important;
    font-size: .78rem !important;
    font-weight: 600 !important;
    margin-left: .5rem !important;
}
body.mk-page-forum-topic .topic-moderation-body {
    padding: 1rem 1.15rem !important;
    display: flex !important;
    flex-direction: column !important;
    gap: .85rem !important;
    background: rgba(0, 0, 0, .25) !important;
    border-top: 1px solid rgba(255, 255, 255, .1) !important;
}
body.mk-page-forum-topic .topic-actions,
body.mk-page-forum-topic .topic-actions .inline-form {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: .65rem !important;
    width: 100% !important;
    margin: 0 !important;
}
body.mk-page-forum-topic .topic-actions .action-btn {
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 1rem !important;
    font-size: .83rem !important;
    font-weight: 700 !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .4rem !important;
    cursor: pointer !important;
    transition: all .15s ease !important;
    border: 1px solid rgba(255, 255, 255, .22) !important;
    background: rgba(255, 255, 255, .12) !important;
    color: #ffffff !important;
    box-sizing: border-box !important;
}
body.mk-page-forum-topic .topic-actions .action-btn:hover {
    background: rgba(255, 255, 255, .22) !important;
    border-color: rgba(255, 255, 255, .35) !important;
    transform: translateY(-1px) !important;
}
body.mk-page-forum-topic .topic-actions .action-btn svg {
    width: 15px !important;
    height: 15px !important;
}
body.mk-page-forum-topic .topic-actions .btn-delete {
    margin-left: auto !important;
    background: rgba(220, 38, 38, .85) !important;
    border-color: rgba(248, 113, 113, .4) !important;
    color: #ffffff !important;
}
body.mk-page-forum-topic .topic-actions .btn-delete:hover {
    background: #dc2626 !important;
    border-color: #f87171 !important;
    box-shadow: 0 4px 14px rgba(220, 38, 38, .35) !important;
}
body.mk-page-forum-topic .forum-topic-move-form {
    margin: 0 !important;
    padding: .85rem 1rem !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, .05) !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
body.mk-page-forum-topic .forum-topic-move-fields {
    display: grid !important;
    grid-template-columns: minmax(280px, 1.4fr) minmax(220px, 1.6fr) auto !important;
    gap: .85rem !important;
    align-items: flex-end !important;
    width: 100% !important;
}
body.mk-page-forum-topic .forum-topic-move-fields label {
    display: flex !important;
    flex-direction: column !important;
    gap: .35rem !important;
    font-size: .75rem !important;
    font-weight: 700 !important;
    color: rgba(255, 255, 255, .88) !important;
    margin: 0 !important;
    min-width: 0 !important;
    line-height: 1.2 !important;
}
body.mk-page-forum-topic .forum-topic-move-fields select,
body.mk-page-forum-topic .forum-topic-move-fields input {
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 8px !important;
    padding: 0 .85rem !important;
    background: #ffffff !important;
    color: #0f172a !important;
    border: 1px solid #cbd5e1 !important;
    font-size: .8125rem !important;
    font-weight: 600 !important;
    line-height: normal !important;
    box-sizing: border-box !important;
    width: 100% !important;
}
body.mk-page-forum-topic .forum-topic-move-fields select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right .75rem center !important;
    background-size: 16px 16px !important;
    padding-right: 2.25rem !important;
    cursor: pointer !important;
    text-overflow: ellipsis !important;
}
body.mk-page-forum-topic .forum-topic-move-fields select:focus,
body.mk-page-forum-topic .forum-topic-move-fields input:focus {
    border-color: #38bdf8 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(56, 189, 248, .2) !important;
}
body.mk-page-forum-topic .forum-topic-move-fields .btn-move-topic {
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 1.25rem !important;
    border-radius: 8px !important;
    font-size: .8125rem !important;
    font-weight: 700 !important;
    background: #0284c7 !important;
    color: #ffffff !important;
    border: 1px solid rgba(56, 189, 248, .35) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .4rem !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: all .15s ease !important;
}
body.mk-page-forum-topic .forum-topic-move-fields .btn-move-topic:hover {
    background: #0369a1 !important;
    box-shadow: 0 4px 14px rgba(2, 132, 199, .35) !important;
    transform: translateY(-1px) !important;
}
@media (max-width: 820px) {
    body.mk-page-forum-topic .topic-action-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: .65rem !important;
        width: 100% !important;
    }
    body.mk-page-forum-topic .topic-share-area,
    body.mk-page-forum-topic .topic-user-actions {
        width: 100% !important;
        justify-content: flex-start !important;
        display: block !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 34px !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        border: none !important;
        box-sizing: border-box !important;
        display: block !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__label {
        display: none !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__actions {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        width: 100% !important;
        gap: 5px !important;
        box-sizing: border-box !important;
        flex-wrap: nowrap !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 4px !important;
        font-size: 0.74rem !important;
        font-weight: 700 !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        gap: 4px !important;
        border-radius: 8px !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__btn svg {
        width: 13px !important;
        height: 13px !important;
        flex-shrink: 0 !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-text-full {
        display: none !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-text-short {
        display: inline !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-text {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        min-width: 0 !important;
    }
    body.mk-page-forum-topic .topic-user-actions {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 5px !important;
        width: 100% !important;
        align-items: stretch !important;
    }
    body.mk-page-forum-topic .topic-user-actions > *,
    body.mk-page-forum-topic .topic-user-actions :where(.inline-form) {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
    }
    body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 4px !important;
        font-size: .74rem !important;
        font-weight: 700 !important;
        justify-content: center !important;
        border-radius: 8px !important;
    }
    body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) .btn-text-full {
        display: none !important;
    }
    body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) .btn-text-short {
        display: inline !important;
    }
    body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) .btn-text {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        min-width: 0 !important;
    }
    body.mk-page-forum-topic .topic-moderation-panel {
        width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }
    body.mk-page-forum-topic .topic-moderation-body {
        padding: .85rem !important;
        gap: .75rem !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    body.mk-page-forum-topic .topic-actions .inline-form {
        display: flex !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        gap: .5rem !important;
    }
    body.mk-page-forum-topic .topic-actions .action-btn {
        flex: 1 1 calc(50% - .25rem) !important;
        min-width: 0 !important;
        height: 38px !important;
        font-size: .8rem !important;
    }
    body.mk-page-forum-topic .topic-actions .btn-delete {
        flex: 1 1 100% !important;
        width: 100% !important;
        margin-left: 0 !important;
    }
    body.mk-page-forum-topic .forum-topic-move-form {
        display: block !important;
        width: 100% !important;
        padding: .75rem !important;
        box-sizing: border-box !important;
    }
    body.mk-page-forum-topic .forum-topic-move-fields {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        gap: .65rem !important;
    }
    body.mk-page-forum-topic .forum-topic-move-fields label {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        min-width: 0 !important;
        gap: .35rem !important;
        margin: 0 !important;
    }
    body.mk-page-forum-topic .forum-topic-move-fields select,
    body.mk-page-forum-topic .forum-topic-move-fields input {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 40px !important;
        min-height: 40px !important;
        box-sizing: border-box !important;
    }
    body.mk-page-forum-topic .forum-topic-move-fields .btn-move-topic {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 40px !important;
        min-height: 40px !important;
        box-sizing: border-box !important;
        margin-top: .15rem !important;
    }
}
@media (max-width: 900px) {
    body.mk-page-users .filter-bar {
        grid-template-columns: minmax(0, 1fr) repeat(2, minmax(150px, 1fr)) auto !important;
    }
    body.mk-page-users .user-card {
        grid-template-columns: minmax(0, 1fr) auto !important;
    }
    body.mk-page-users .user-stats {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-content: flex-start;
        padding: .6rem 0 0 !important;
        border-left: 0 !important;
        border-top: 1px solid var(--mk-color-line, #e2e8f0) !important;
    }
    body.mk-page-users .user-footer {
        grid-column: 2;
        grid-row: 1;
        min-width: 0 !important;
        padding-left: .75rem !important;
        border-left: 1px solid var(--mk-color-line, #e2e8f0) !important;
    }
    body.mk-page-leaderboard .leaderboard-item {
        grid-template-columns: 44px minmax(0, 1fr) !important;
    }
    body.mk-page-leaderboard .stats-col {
        grid-column: 2;
        justify-content: flex-start !important;
        overflow-x: auto;
        padding-top: .45rem;
    }
}
@media (max-width: 680px) {
    body.mk-page-users .filter-bar {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    body.mk-page-users .user-card {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: .7rem !important;
    }
    body.mk-page-users .user-footer,
    body.mk-page-users .user-stats {
        grid-column: 1;
        grid-row: auto;
        width: 100%;
        border-left: 0 !important;
        padding-left: 0 !important;
    }
    body.mk-page-users .user-footer {
        justify-content: space-between !important;
        padding-top: .65rem !important;
        border-top: 1px solid var(--mk-color-line, #e2e8f0) !important;
    }
    body.mk-page-forum-topic .topic-action-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: .65rem !important;
    }
    body.mk-page-forum-topic .topic-share-area,
    body.mk-page-forum-topic .topic-user-actions {
        width: 100% !important;
        justify-content: flex-start !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 34px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        background: transparent !important;
        border: none !important;
        display: block !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__label {
        display: none !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__actions {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        width: 100% !important;
        gap: 5px !important;
        box-sizing: border-box !important;
        flex-wrap: nowrap !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 4px !important;
        font-size: 0.74rem !important;
        font-weight: 700 !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        gap: 4px !important;
        border-radius: 8px !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-bar__btn svg {
        width: 13px !important;
        height: 13px !important;
        flex-shrink: 0 !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-text-full {
        display: none !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-text-short {
        display: inline !important;
    }
    body.mk-page-forum-topic .mk-share-bar--topic .mk-share-text {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        min-width: 0 !important;
    }
    body.mk-page-forum-topic .topic-user-actions {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: .35rem !important;
        width: 100% !important;
        align-items: stretch !important;
    }
    body.mk-page-forum-topic .topic-user-actions > *,
    body.mk-page-forum-topic .topic-user-actions :where(.inline-form) {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
    }
    body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) {
        width: 100% !important;
        min-width: 0 !important;
        height: 35px !important;
        min-height: 35px !important;
        padding: 0 .25rem !important;
        font-size: .74rem !important;
        font-weight: 700 !important;
        justify-content: center !important;
        text-align: center !important;
        border-radius: 8px !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        gap: .28rem !important;
    }
    body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) .btn-text-full {
        display: none !important;
    }
    body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) .btn-text-short {
        display: inline !important;
    }
    body.mk-page-forum-topic .topic-user-actions :where(.btn-modern) .btn-icon svg {
        width: 13px !important;
        height: 13px !important;
        flex-shrink: 0 !important;
    }
}
/* Document info cards: Forum category style with icon badges, refined borders, and action zone */
body.mk-page-document-detail .info-grid.document-meta-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .75rem !important;
    margin-top: 1rem !important;
}
body.mk-page-document-detail .document-meta-grid .info-item {
    display: flex !important;
    align-items: center !important;
    gap: .85rem !important;
    min-width: 0 !important;
    padding: .85rem 1rem !important;
    border: 1px solid rgba(15, 23, 42, .09) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, .03) !important;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease !important;
}
body.mk-page-document-detail .document-meta-grid .info-item:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(37, 99, 235, .28) !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .06) !important;
}
body.mk-page-document-detail .document-meta-grid .info-icon-badge {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}
body.mk-page-document-detail .document-meta-grid .info-icon-badge svg {
    width: 20px;
    height: 20px;
}
body.mk-page-document-detail .document-meta-grid .info-icon-badge.icon-size {
    background: rgba(37, 99, 235, .09);
    color: #2563eb;
}
body.mk-page-document-detail .document-meta-grid .info-icon-badge.icon-type {
    background: rgba(139, 92, 246, .09);
    color: #8b5cf6;
}
body.mk-page-document-detail .document-meta-grid .info-icon-badge.icon-download {
    background: rgba(16, 185, 129, .09);
    color: #059669;
}
body.mk-page-document-detail .document-meta-grid .info-icon-badge.icon-views {
    background: rgba(245, 158, 11, .09);
    color: #d97706;
}
body.mk-page-document-detail .document-meta-grid .info-icon-badge.icon-date {
    background: rgba(6, 182, 212, .09);
    color: #0891b2;
}
body.mk-page-document-detail .document-meta-grid .info-content {
    display: flex !important;
    flex-direction: column !important;
    gap: .15rem !important;
    min-width: 0 !important;
}
body.mk-page-document-detail .document-meta-grid .info-label {
    font-size: .74rem !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: .02em !important;
    line-height: 1 !important;
}
body.mk-page-document-detail .document-meta-grid .info-value {
    color: #0f172a !important;
    font-size: .95rem !important;
    font-weight: 800 !important;
    overflow-wrap: anywhere !important;
    line-height: 1.25 !important;
}

/* Action item in the right of upload date */
body.mk-page-document-detail .document-meta-grid .info-action-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: .5rem !important;
    padding: .7rem .85rem !important;
    background: linear-gradient(135deg, #f8fbff, #f1f5f9) !important;
    border: 1px solid #cbd5e1 !important;
}
body.mk-page-document-detail .document-meta-grid .info-action-buttons {
    display: flex;
    align-items: center;
    gap: .45rem !important;
    width: 100% !important;
}
body.mk-page-document-detail .document-meta-grid .btn-doc-download {
    flex: 1 1 auto !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .4rem !important;
    padding: 0 .9rem !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
    border-radius: 8px !important;
    background: linear-gradient(135deg, #dc2626, #b91c1c) !important;
    color: #ffffff !important;
    text-decoration: none !important;
    border: 1px solid rgba(0, 0, 0, .08) !important;
    box-shadow: 0 2px 6px rgba(220, 38, 38, .22) !important;
    white-space: nowrap !important;
    transition: all .15s ease !important;
}
body.mk-page-document-detail .document-meta-grid .btn-doc-download:hover {
    background: linear-gradient(135deg, #b91c1c, #991b1b) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(220, 38, 38, .3) !important;
}
body.mk-page-document-detail .document-meta-grid .btn-doc-download.is-disabled {
    background: #94a3b8 !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
}
body.mk-page-document-detail .document-meta-grid .doc-inline-save-form {
    display: inline-flex;
    margin: 0;
    flex: 0 0 auto;
}
body.mk-page-document-detail .document-meta-grid .btn-doc-save {
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .35rem !important;
    padding: 0 .75rem !important;
    font-size: .8rem !important;
    font-weight: 700 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: #334155 !important;
    border: 1px solid #cbd5e1 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: all .15s ease !important;
}
body.mk-page-document-detail .document-meta-grid .btn-doc-save:hover {
    background: #f1f5f9 !important;
    border-color: #94a3b8 !important;
}
body.mk-page-document-detail .document-meta-grid .btn-doc-save.is-saved {
    background: #fef2f2 !important;
    color: #dc2626 !important;
    border-color: #fca5a5 !important;
}
body.mk-page-document-detail .document-meta-grid .doc-quota-indicator {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
body.mk-page-document-detail .document-meta-grid .quota-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: .3rem !important;
    font-size: .72rem !important;
    font-weight: 700 !important;
    color: #475569 !important;
    padding: .15rem .5rem !important;
    border-radius: 999px !important;
    background: rgba(15, 23, 42, .06) !important;
}
body.mk-page-document-detail .document-meta-grid .quota-pill.is-unlimited {
    background: rgba(22, 163, 74, .1) !important;
    color: #15803d !important;
}
@media (max-width: 680px) {
    body.mk-page-document-detail .info-grid.document-meta-grid {
        grid-template-columns: 1fr !important;
    }
}/* Uploader identity: avatar and rank are one clickable profile presentation. */
body.mk-page-document-detail .uploader-avatar-link {
    display: inline-flex !important;
    flex: 0 0 auto;
    color: inherit;
    text-decoration: none;
    border-radius: 50%;
}
body.mk-page-document-detail .uploader-avatar-link:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--premium-accent, #2563eb) 35%, transparent) !important;
    outline-offset: 3px !important;
}
body.mk-page-document-detail .uploader-details {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    gap: .35rem;
}
body.mk-page-document-detail .uploader-name-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    flex-wrap: wrap;
    width: 100%;
    text-align: center;
    margin: 0 auto;
}
body.mk-page-document-detail .uploader-badges .badge-rutbe {
    display: inline-flex !important;
    align-items: center !important;
    gap: .3rem !important;
    width: fit-content !important;
    padding: .3rem .55rem !important;
    border: 1px solid color-mix(in srgb, var(--rank-color, #64748b) 35%, #fff) !important;
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--rank-color, #64748b) 10%, #fff) !important;
    color: var(--rank-color, #64748b) !important;
    font-size: .75rem !important;
    font-weight: 800 !important;
}
body.mk-page-document-detail .uploader-badges .badge-rutbe svg {
    width: .9rem !important;
    height: .9rem !important;
}
@media (max-width: 640px) {
    body.mk-page-document-detail .uploader-info {
        align-items: flex-start !important;
    }
}/* Final alignment pass for becayis hero and people stats. */
body.mk-page-becayis .becayis-hero-right {
    display: grid !important;
    grid-template-columns: auto auto !important;
    align-items: center !important;
    gap: .65rem !important;
}
body.mk-page-becayis .becayis-hero-right .hero-stats {
    align-items: stretch !important;
    height: 48px !important;
    margin: 0 !important;
}
body.mk-page-becayis .becayis-hero-right .hstat,
body.mk-page-becayis .becayis-hero-right .becayis-hero-actions > .btn-hero {
    height: 48px !important;
    min-height: 48px !important;
    box-sizing: border-box;
}
body.mk-page-becayis .becayis-hero-right .hstat {
    align-items: center;
}
body.mk-page-becayis .becayis-hero-right .becayis-hero-actions {
    align-items: stretch !important;
    height: 48px !important;
}
body.mk-page-users .user-stats {
    display: grid !important;
    grid-template-columns: repeat(3, 64px) !important;
    align-items: center !important;
    justify-content: start !important;
    gap: .55rem !important;
}
body.mk-page-users .user-stats .stat-item {
    display: grid;
    grid-template-rows: 1.25rem 1rem;
    justify-items: center;
    width: 64px;
    min-width: 64px;
    text-align: center;
}
body.mk-page-users .user-stats .stat-value,
body.mk-page-users .user-stats .stat-label {
    white-space: nowrap;
}
body.mk-page-document-detail .uploader-badges .badge-role {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 26px !important;
    padding: .3rem .55rem !important;
    border: 1.5px solid #dc2626 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #dc2626 !important;
    font-size: .75rem !important;
    font-weight: 800 !important;
}
body.mk-page-document-detail .uploader-badges .badge-mod {
    border: 1.5px solid #10b981 !important;
    background: #ffffff !important;
    color: #10b981 !important;
}

body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    min-height: 22px;
    height: 22px;
    padding: 0 0.5rem;
    border-radius: 999px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16) !important;
    vertical-align: middle;
    line-height: 1;
    text-decoration: none;
}

body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini:not(.rank-special-package) {
    background: #ffffff;
}

body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini .user-rank-badge-label {
    color: inherit;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini .user-rank-badge-icon,
body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini svg {
    color: inherit;
    stroke: currentColor;
    width: 13px;
    height: 13px;
    display: inline-block;
    vertical-align: middle !important;
}

body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini.role-admin {
    --rank-color: #dc2626;
    border: 1.5px solid #dc2626;
    color: #dc2626;
    background: #ffffff;
}
body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini.role-admin .user-rank-badge-label,
body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini.role-admin svg {
    color: #dc2626;
    stroke: #dc2626;
}

body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini:is(.role-mod, .role-moderator) {
    --rank-color: #10b981 !important;
    border: 1.5px solid #10b981 !important;
    color: #10b981 !important;
    background: #ffffff !important;
}
body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini:is(.role-mod, .role-moderator) .user-rank-badge-label,
body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini:is(.role-mod, .role-moderator) svg {
    color: #10b981 !important;
    stroke: #10b981 !important;
}

body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini.rank-special-package {
    border: 1.5px solid var(--special-badge-border, var(--rank-color, #dc2626)) !important;
    color: var(--special-badge-color, #ffffff) !important;
    background: var(--special-badge-bg, #7f1d1d) !important;
    background-color: var(--special-badge-bg, #7f1d1d) !important;
}
body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini.rank-special-package .user-rank-badge-label,
body:not(.mk-shell-backoffice) .site-main :is(.page-hero, .post-hero, .blog-hero) .user-rank-badge-mini.rank-special-package svg {
    color: var(--special-badge-color, #ffffff) !important;
    stroke: var(--special-badge-color, #ffffff) !important;
}

@media (max-width: 900px) {
    body.mk-page-becayis .becayis-hero-right {
        grid-template-columns: minmax(0, 1fr);
        width: 100% !important;
    }
    body.mk-page-becayis .becayis-hero-right .hero-stats,
    body.mk-page-becayis .becayis-hero-right .becayis-hero-actions {
        width: 100% !important;
    }
}
@media (max-width: 680px) {
    body.mk-page-users .user-stats {
        grid-template-columns: repeat(3, minmax(58px, 64px)) !important;
        overflow-x: auto;
    }
}/* User rows: stable statistics columns across the entire vertical list. */
html body.mk-page-users .site-main .users-rank-group .users-grid .user-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    align-items: center !important;
    gap: 1.15rem !important;
    min-width: 0 !important;
    padding: 0.95rem 1.25rem !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.03) !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

html body.mk-page-users .site-main .users-rank-group .users-grid .user-card:hover {
    border-color: #cbd5e1 !important;
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.07) !important;
    transform: translateY(-1px) !important;
}

/* Avatar ve Çevrimiçi Çerçeve Durumları */
html body.mk-page-users .user-avatar {
    position: relative;
    flex-shrink: 0;
}

html body.mk-page-users .user-avatar-circle {
    border-radius: 50%;
    border: 2px solid #e2e8f0;
    transition: border-color 0.2s ease !important;
}

html body.mk-page-users .user-avatar:has(.user-status:not(.offline)) .user-avatar-circle,
html body.mk-page-users .user-avatar-circle.is-online {
    border-color: #10b981;
}

html body.mk-page-users .user-avatar:has(.user-status.offline) .user-avatar-circle,
html body.mk-page-users .user-avatar-circle.is-offline {
    border-color: #e2e8f0;
}

html body.mk-page-users .user-status {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #10b981;
    border: 2.5px solid #ffffff;
    box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.35);
    z-index: 2;
}

html body.mk-page-users .user-status.offline {
    background: #94a3b8;
    box-shadow: none;
}

/* İstatistik Kutucukları (Gönderi, Seviye, Gün) */
html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-stats {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.55rem !important;
    margin: 0 !important;
    padding: 0 1rem !important;
    border-left: 1px solid #e2e8f0 !important;
    border-top: 0 !important;
    width: auto !important;
    min-width: auto !important;
    box-sizing: border-box !important;
}

html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-stats .stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 60px;
    min-width: 60px;
    max-width: 60px;
    height: 54px;
    min-height: 54px;
    padding: 2px 0;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    text-align: center;
    box-sizing: border-box;
}

html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-stats .stat-value {
    font-size: 1.12rem;
    font-weight: 800;
    color: #991f24;
    line-height: 1.1;
    display: block;
}

html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-stats .stat-label {
    font-size: 0.72rem;
    font-weight: 700;
    color: #64748b;
    margin-top: 2px;
    display: block;
}

/* Footer: Tarih Kutusu ve Profil Butonu */
html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-footer {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.65rem !important;
    margin: 0 !important;
    padding: 0 0 0 1rem !important;
    border-left: 1px solid #e2e8f0 !important;
    min-width: max-content !important;
    box-sizing: border-box !important;
}

html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-footer .user-date {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    height: 40px;
    padding: 0 0.85rem;
    border-radius: 8px;
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc;
    color: #64748b;
    font-size: 0.82rem;
    font-weight: 700;
    white-space: nowrap;
    box-sizing: border-box;
}

html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-footer .user-date svg {
    width: 15px !important;
    height: 15px !important;
    color: #64748b !important;
    flex-shrink: 0 !important;
}

html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-footer .user-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.35rem !important;
    height: 40px !important;
    padding: 0 1.15rem !important;
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    background: #ffffff !important;
    color: #7c3aed !important;
    font-size: 0.86rem !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04) !important;
    box-sizing: border-box !important;
}

html body.mk-page-users .site-main .users-rank-group .users-grid .user-card:hover .user-footer .user-action {
    background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%) !important;
    color: #ffffff !important;
    border-color: #7c3aed !important;
    transform: translateX(2px) !important;
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.28) !important;
}

@media (max-width: 900px) {
    html body.mk-page-users .site-main .users-rank-group .users-grid .user-card {
        grid-template-columns: minmax(0, 1fr) auto !important;
    }
}
@media (max-width: 680px) {
    html body.mk-page-users .site-main .users-rank-group .users-grid .user-card {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0.85rem !important;
    }
    html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-stats,
    html body.mk-page-users .site-main .users-rank-group .users-grid .user-card .user-footer {
        border-left: none !important;
        border-top: 1px solid #e2e8f0 !important;
        padding: 0.75rem 0 0 0 !important;
        justify-content: flex-start !important;
    }
    }
/* Exact hero rail and profile-like uploader presentation. */
html body.mk-page-becayis .site-main .becayis-hero-right {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .65rem !important;
    height: 48px !important;
    min-height: 48px !important;
}
html body.mk-page-becayis .site-main .becayis-hero-right > .hero-stats,
html body.mk-page-becayis .site-main .becayis-hero-right > .becayis-hero-actions {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: .55rem !important;
    height: 48px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
}
html body.mk-page-becayis .site-main .becayis-hero-right > .hero-stats > .hstat,
html body.mk-page-becayis .site-main .becayis-hero-right > .becayis-hero-actions > .btn-hero {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    box-sizing: border-box;
    margin: 0;
    line-height: 1;
}
html body.mk-page-becayis .site-main .becayis-hero-right > .hero-stats > .hstat {
    gap: .55rem !important;
    padding: 0 1.15rem !important;
}
html body.mk-page-becayis .site-main .becayis-hero-right > .hero-stats > .hstat strong,
html body.mk-page-becayis .site-main .becayis-hero-right > .hero-stats > .hstat span {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}
html body.mk-page-becayis .site-main .becayis-hero-right > .becayis-hero-actions > .btn-hero {
    gap: .5rem;
    padding: 0 1.25rem;
}
@media (max-width: 900px) {
    html body.mk-page-becayis .site-main .becayis-hero-right {
        height: auto !important;
        min-height: 0 !important;
        flex-wrap: wrap !important;
    }
    html body.mk-page-becayis .site-main .becayis-hero-right > .hero-stats,
    html body.mk-page-becayis .site-main .becayis-hero-right > .becayis-hero-actions {
        height: 48px !important;
        min-height: 48px !important;
    }
}

/* Topic Hero Layout Protection */
html body:not(.mk-shell-backoffice) .site-main .topic-hero {
    height: auto !important;
    min-height: 180px !important;
    max-height: none !important;
    padding: 1.5rem 1.75rem !important;
    overflow: hidden !important;
}

/* Liderlik Şampiyonlar Podyumu Avatar Daire & Nick Ayrımı (Genel) */
.podium-card .podium-user-link {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    color: inherit !important;
    width: 100% !important;
    margin: 0.5rem 0 0.5rem !important;
    gap: 0 !important;
    box-sizing: border-box !important;
}

.podium-card .podium-avatar-wrap {
    position: relative;
    display: block;
    width: 68px;
    height: 68px;
    min-width: 68px;
    min-height: 68px;
    max-width: 68px;
    max-height: 68px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    margin: 0 auto 12px;
    padding: 0;
    flex-shrink: 0;
    box-sizing: border-box;
}

.podium-card.podium-gold .podium-avatar-wrap,
.podium-card .podium-avatar-wrap.gold-ring {
    width: 76px;
    height: 76px;
    min-width: 76px;
    min-height: 76px;
    max-width: 76px;
    max-height: 76px;
}

.podium-card.podium-silver .podium-avatar-wrap,
.podium-card .podium-avatar-wrap.silver-ring,
.podium-card.podium-bronze .podium-avatar-wrap,
.podium-card .podium-avatar-wrap.bronze-ring {
    width: 68px;
    height: 68px;
    min-width: 68px;
    min-height: 68px;
    max-width: 68px;
    max-height: 68px;
}

.podium-card .podium-avatar,
.podium-card .podium-avatar-placeholder {
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
    max-width: 100%;
    max-height: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    object-fit: cover;
    object-position: center;
    display: block;
    box-sizing: border-box;
}

.podium-card .podium-avatar-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* Kusursuz Dairesel Çerçeveler ve Eşit Halka Gölgeleri */
.podium-card.podium-gold .podium-avatar,
.podium-card.podium-gold .podium-avatar-placeholder,
.podium-card .podium-avatar-wrap.gold-ring .podium-avatar,
.podium-card .podium-avatar-wrap.gold-ring .podium-avatar-placeholder {
    border: 3.5px solid #fbbf24;
    box-shadow: 0 0 0 3.5px rgba(251, 191, 36, 0.3);
}

.podium-card.podium-silver .podium-avatar,
.podium-card.podium-silver .podium-avatar-placeholder,
.podium-card .podium-avatar-wrap.silver-ring .podium-avatar,
.podium-card .podium-avatar-wrap.silver-ring .podium-avatar-placeholder {
    border: 3px solid #94a3b8;
    box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.3);
}

.podium-card.podium-bronze .podium-avatar,
.podium-card.podium-bronze .podium-avatar-placeholder,
.podium-card .podium-avatar-wrap.bronze-ring .podium-avatar,
.podium-card .podium-avatar-wrap.bronze-ring .podium-avatar-placeholder {
    border: 3px solid #ea580c;
    box-shadow: 0 0 0 3px rgba(234, 88, 12, 0.3);
}

.podium-card .podium-rank-pill {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 22px;
    height: 22px;
    min-width: 22px;
    min-height: 22px;
    border-radius: 50%;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    border: 2px solid #ffffff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
    z-index: 2;
}

.podium-card .user-name-line {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    clear: both !important;
    box-sizing: border-box !important;
}

.podium-card .user-name {
    display: inline-block !important;
    font-size: 0.98rem !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 220px !important;
    text-align: center !important;
}


/* ==========================================================================
   MOBİL CHROME HERO KART VE İSTATİSTİK HİZALAMALARI (RESPONSIVE ALIGNMENT)
   ========================================================================== */
@media (max-width: 768px) {
    /* 1. Resmi Duyurular Hero Kart & 3 İstatistik Yan Yana ve Ortalı */
    body.mk-announcements .announcements-hero .hero-content,
    .mk-announcements .announcements-hero .hero-content,
    .announcements-hero .hero-content,
    .announcements-page-container .announcements-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }
    body.mk-announcements .announcements-hero .hero-left,
    .announcements-hero .hero-left {
        width: 100% !important;
        text-align: center !important;
        align-items: center !important;
    }
    .announcements-hero .announcements-kicker {
        margin: 0 auto 0.5rem !important;
    }
    .announcements-hero .hero-title {
        font-size: clamp(1.3rem, 5vw, 1.75rem) !important;
        text-align: center !important;
        justify-content: center !important;
    }
    .announcements-hero .hero-subtitle {
        text-align: center !important;
        margin: 0 auto !important;
    }
    body.mk-announcements .announcements-hero .hero-stats-grid,
    .announcements-hero .hero-stats-grid,
    .announcements-page-container .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 0.35rem !important;
        width: 100% !important;
        margin: 0.75rem auto 0 !important;
        justify-content: center !important;
    }
    body.mk-announcements .announcements-hero .hero-stat-card,
    .announcements-hero .hero-stat-card {
        flex: none;
        min-width: 0;
        max-width: none;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        text-align: center;
        padding: 0.45rem 0.2rem !important;
        box-sizing: border-box;
        margin: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center !important;
    }
    .announcements-hero .hero-stat-card .stat-icon {
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        margin: 0 auto 0.2rem !important;
    }
    .announcements-hero .hero-stat-card .stat-icon svg {
        width: 13px !important;
        height: 13px !important;
    }
    .announcements-hero .hero-stat-card .stat-value {
        font-size: 0.95rem !important;
        line-height: 1.1 !important;
        font-weight: 700 !important;
    }
    .announcements-hero .hero-stat-card .stat-label {
        font-size: 0.65rem !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        line-height: 1.1 !important;
    }

    /* 2. İşlem Merkezi Hero Kart Düzeni & İstatistikler */
    .site-main > .tools-page .tools-hero {
        padding: 1.15rem 0.85rem !important;
        min-height: 0 !important;
    }
    .site-main > .tools-page .tools-hero .hero-content {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        gap: 0.85rem;
        width: 100% !important;
    }
    .site-main > .tools-page .tools-hero .hero-left {
        width: 100% !important;
        text-align: center;
        align-items: center;
    }
    .site-main > .tools-page .tools-hero .tools-kicker {
        margin: 0 auto 0.6rem !important;
    }
    .site-main > .tools-page .tools-hero .hero-title {
        font-size: clamp(1.3rem, 5vw, 1.65rem) !important;
        text-align: center !important;
        line-height: 1.3 !important;
        display: block !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
    }
    .site-main > .tools-page .tools-hero .hero-subtitle {
        text-align: center !important;
        margin: 0 auto !important;
        font-size: 0.92rem !important;
    }
    .site-main > .tools-page .hero-stats-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 0.35rem;
        width: 100% !important;
        margin: 0.75rem auto 0;
    }
    .site-main > .tools-page .hero-stat-card {
        min-width: 0;
        max-width: none;
        flex: none;
        width: 100% !important;
        min-height: 0 !important;
        height: auto;
        padding: 0.45rem 0.2rem;
        flex-direction: column;
        text-align: center;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }
    .site-main > .tools-page .hero-stat-card .stat-icon {
        width: 22px;
        height: 22px;
        min-width: 22px;
        min-height: 22px;
        margin: 0 auto 0.2rem !important;
        border-radius: 6px;
    }
    .site-main > .tools-page .hero-stat-card .stat-icon svg {
        width: 13px;
        height: 13px;
    }
    .site-main > .tools-page .hero-stat-card .stat-data {
        text-align: center;
        width: 100% !important;
        min-width: 0;
    }
    .site-main > .tools-page .hero-stat-card .stat-value {
        font-size: 0.95rem;
        line-height: 1.1;
        font-weight: 700;
    }
    .site-main > .tools-page .hero-stat-card .stat-label {
        font-size: 0.65rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.1;
    }

    /* 2.1 Belge Stüdyosu Hero Kart & MENTOR Rozet Hizalaması */
    .studio-hero {
        padding: 1.15rem 0.85rem !important;
        min-height: 0 !important;
    }
    .studio-quota-bar .rank-badge {
        white-space: nowrap;
        word-break: keep-all;
        flex-shrink: 0;
        display: inline-flex;
        align-items: center;
        line-height: 1;
    }
    .studio-quota-bar .quota-rank-pill {
        flex-wrap: nowrap;
    }

    /* 3. Ortak Arama Hero "Tüm Sistem Taranıyor" Çerçevesini Ortala */
    .search-hero .hero-content,
    .search-page-container .search-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }
    .search-hero .hero-left,
    .search-page-container .search-hero .hero-left {
        width: 100% !important;
        text-align: center !important;
        align-items: center !important;
    }
    .search-hero .hero-title {
        text-align: center !important;
        justify-content: center !important;
    }
    .search-hero .hero-subtitle {
        text-align: center !important;
        margin: 0 auto !important;
    }
    .search-hero .search-hero-stats,
    .search-page-container .search-hero-stats,
    .search-hero-stats {
        margin: 0.75rem auto 0 !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        width: 100% !important;
        max-width: 220px !important;
    }
    .search-hero-stats .hero-stat-card {
        margin: 0 auto !important;
        display: inline-flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        width: 100% !important;
        min-width: 0 !important;
        padding: 0.65rem 0.85rem !important;
    }

    /* 4. Mevzuat Merkezi Hero İstatistik Çerçevelerini Yan Yana Göster */
    body.mk-page-legal .law-hero .hero-content,
    .law-hero .hero-content,
    .law-page-container .law-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }
    .law-hero .hero-left {
        width: 100% !important;
        text-align: center !important;
        align-items: center !important;
    }
    .law-hero .law-back {
        margin: 0 auto 0.5rem !important;
    }
    .law-hero .hero-title {
        text-align: center !important;
        justify-content: center !important;
    }
    .law-hero .hero-subtitle {
        text-align: center !important;
        margin: 0 auto !important;
    }
    body.mk-page-legal .law-hero .hero-stats-grid,
    .law-hero .hero-stats-grid,
    .law-page-container .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 0.35rem !important;
        width: 100% !important;
        margin: 0.75rem auto 0 !important;
        justify-content: center !important;
    }
    body.mk-page-legal .law-hero .hero-stat-card,
    .law-hero .hero-stat-card {
        flex: none;
        min-width: 0 !important;
        max-width: none;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        text-align: center;
        padding: 0.45rem 0.2rem !important;
        box-sizing: border-box;
        margin: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center !important;
    }
    .law-hero .hero-stat-card .stat-icon {
        width: 22px;
        height: 22px;
        min-width: 22px;
        margin: 0 auto 0.2rem !important;
    }
    .law-hero .hero-stat-card .stat-icon svg {
        width: 13px !important;
        height: 13px !important;
    }
    .law-hero .hero-stat-card .stat-value {
        font-size: 0.95rem !important;
        line-height: 1.1 !important;
        font-weight: 700 !important;
    }
    .law-hero .hero-stat-card .stat-label {
        font-size: 0.65rem !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        line-height: 1.1 !important;
    }

    /* 5 & 6. Emsal Kararlar ve AYM Karar Arama Hero Butonlarını Ortala */
    body.mk-legal-search .mk-hero-header .mk-hero-content,
    body.mk-aym-search .mk-hero-header .mk-hero-content,
    .emsal-page-container .mk-hero-header .mk-hero-content,
    .aym-page-container .mk-hero-header .mk-hero-content,
    .emsal-page-container .mk-hero-content,
    .aym-page-container .mk-hero-content,
    .mk-legal-search .mk-hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }
    .mk-legal-search .mk-hero-left,
    .emsal-page-container .mk-hero-left,
    .aym-page-container .mk-hero-left {
        width: 100% !important;
        text-align: center !important;
        align-items: center !important;
    }
    .mk-legal-search .mk-hero-title,
    .emsal-page-container .mk-hero-title,
    .aym-page-container .mk-hero-title {
        text-align: center !important;
        justify-content: center !important;
    }
    .mk-legal-search .mk-hero-subtitle,
    .emsal-page-container .mk-hero-subtitle,
    .aym-page-container .mk-hero-subtitle {
        text-align: center !important;
        margin: 0 auto !important;
    }
    body.mk-legal-search .mk-hero-header .mk-hero-right,
    body.mk-aym-search .mk-hero-header .mk-hero-right,
    .emsal-page-container .mk-hero-right,
    .aym-page-container .mk-hero-right,
    .emsal-page-container .hero-actions,
    .aym-page-container .hero-actions,
    .mk-hero-header .mk-hero-right {
        display: flex;
        justify-content: center !important;
        align-items: center;
        justify-self: center !important;
        align-self: center;
        width: 100% !important;
        margin: 0.75rem auto 0 !important;
        text-align: center;
    }
    body.mk-legal-search .mk-hero-official-btn,
    body.mk-aym-search .mk-hero-official-btn,
    .emsal-page-container .mk-hero-official-btn,
    .aym-page-container .mk-hero-official-btn,
    .mk-hero-official-btn {
        margin: 0 auto !important;
        justify-self: center !important;
        align-self: center !important;
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        width: auto !important;
        min-width: 200px !important;
        max-width: 100% !important;
    }

    /* 7. İl Rehberi Hero: 2 İstatistik + 1 Karşılaştır Butonu = Yan Yana 3'lü Tek Satır */
    .city-hero .hero-content,
    .mk-cities-main .city-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }
    .city-hero .hero-left {
        width: 100% !important;
        text-align: center !important;
        align-items: center !important;
    }
    .city-hero .hero-title {
        text-align: center !important;
        justify-content: center !important;
    }
    .city-hero .hero-subtitle {
        text-align: center !important;
        margin: 0 auto !important;
    }
    .city-hero .hero-stats-grid,
    .mk-cities-main .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 0.35rem !important;
        width: 100% !important;
        margin: 0.75rem auto 0 !important;
        justify-content: center !important;
        align-items: stretch !important;
    }
    .city-hero .hero-stat-card {
        flex: none;
        min-width: 0;
        max-width: none;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        text-align: center;
        padding: 0.45rem 0.2rem !important;
        box-sizing: border-box;
        margin: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .city-hero .hero-stat-card .stat-icon {
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        margin: 0 auto 0.2rem !important;
    }
    .city-hero .hero-stat-card .stat-icon svg {
        width: 13px !important;
        height: 13px !important;
    }
    .city-hero .hero-stat-card .stat-value {
        font-size: 0.95rem !important;
        line-height: 1.1 !important;
        font-weight: 700 !important;
    }
    .city-hero .hero-stat-card .stat-label {
        font-size: 0.65rem !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        line-height: 1.1 !important;
    }
    .city-hero .city-hero-compare-action {
        grid-column: auto !important;
        width: 100% !important;
        margin: 0 !important;
        display: flex !important;
        align-items: stretch !important;
        justify-content: stretch !important;
    }
    .city-hero .city-compare-btn {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 0.45rem 0.2rem !important;
        font-size: 0.72rem !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        box-sizing: border-box !important;
        gap: 0.2rem !important;
        border-radius: 8px !important;
    }

    /* 8. İl Karşılaştır Hero: 2 İstatistik Çerçevesi Mobilde Yan Yana */
    .compare-hero .hero-content,
    .mk-compare-main .compare-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }
    .compare-hero .hero-left {
        width: 100% !important;
        text-align: center !important;
        align-items: center !important;
    }
    .compare-hero .hero-title {
        text-align: center !important;
        justify-content: center !important;
    }
    .compare-hero .hero-subtitle {
        text-align: center !important;
        margin: 0 auto !important;
    }
    .compare-hero .compare-kicker-bar {
        justify-content: center !important;
        flex-wrap: wrap !important;
    }
    .compare-hero .hero-stats-grid,
    .mk-compare-main .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.45rem !important;
        width: 100% !important;
        max-width: 320px !important;
        margin: 0.75rem auto 0 !important;
        justify-content: center !important;
    }
    .compare-hero .hero-stat-card {
        flex: none;
        min-width: 0;
        max-width: none;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        text-align: center;
        padding: 0.55rem 0.35rem !important;
        box-sizing: border-box;
        margin: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .compare-hero .hero-stat-card .stat-icon {
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        margin: 0 auto 0.2rem !important;
    }
    .compare-hero .hero-stat-card .stat-icon svg {
        width: 13px !important;
        height: 13px !important;
    }
    .compare-hero .hero-stat-card .stat-value {
        font-size: 0.95rem !important;
        line-height: 1.1 !important;
        font-weight: 700 !important;
    }
    .compare-hero .hero-stat-card .stat-label {
        font-size: 0.65rem !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        line-height: 1.1 !important;
    }

    /* 9. Tüm Üyeler Hero Kart: Toplam Üye Çerçevesini Mobilde Tam Merkezde Ortala */
    .users-hero .hero-content,
    .users-page .users-hero .hero-content,
    body.mk-page-users .users-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }
    .users-hero .hero-left,
    .users-page .users-hero .hero-left {
        width: 100% !important;
        text-align: center !important;
        align-items: center !important;
    }
    .users-hero .hero-title {
        text-align: center !important;
        justify-content: center !important;
    }
    .users-hero .hero-subtitle {
        text-align: center !important;
        margin: 0 auto !important;
    }
    .users-hero .users-hero-stats,
    .users-page .users-hero-stats,
    body.mk-page-users .users-hero-stats {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        justify-self: center !important;
        align-self: center !important;
        width: auto !important;
        min-width: 170px !important;
        max-width: 220px !important;
        margin: 0.75rem auto 0 !important;
        text-align: center !important;
    }
    .users-hero-stats .hero-stat-card {
        margin: 0 auto;
        display: inline-flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        text-align: center;
        width: 100% !important;
        min-width: 0;
        padding: 0.65rem 0.85rem !important;
    }

    /* 10. Çetele Arşiv Hero: Tamamlanma Çerçevesi, Kategoriler ve Yeni Ekle Yan Yana Tek Satır */
    html body:not(.mk-shell-backoffice) .site-main .cetele-page-container .cetele-hero,
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero,
    body.mk-product-personal .cetele-hero,
    .cetele-hero {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 1.15rem 0.85rem !important;
        min-height: auto !important;
        overflow: hidden !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-page-container .cetele-hero > .hero-content,
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero > .hero-content,
    .cetele-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        width: 100% !important;
        max-width: 100% !important;
        gap: 0.85rem !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .hero-left,
    .cetele-hero .hero-left {
        width: 100% !important;
        text-align: center !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .hero-title,
    .cetele-hero .hero-title {
        text-align: center !important;
        justify-content: center !important;
        font-size: clamp(1.25rem, 5vw, 1.6rem) !important;
        line-height: 1.2 !important;
        margin: 0 auto 0.35rem !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .hero-subtitle,
    .cetele-hero .hero-subtitle {
        text-align: center !important;
        font-size: 0.82rem !important;
        line-height: 1.4 !important;
        margin: 0 auto 0.5rem !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-quota-summary,
    .cetele-hero .cetele-quota-summary {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto !important;
        font-size: 0.75rem;
        text-align: center;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-hero-controls-row,
    .cetele-hero .cetele-hero-controls-row {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 0.5rem !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0.5rem 0 0 !important;
        padding: 0 !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        justify-self: stretch !important;
        box-sizing: border-box !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-hero-stats,
    .cetele-hero .cetele-hero-stats {
        grid-column: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        justify-self: stretch !important;
        align-self: stretch !important;
        box-sizing: border-box !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-progress-card,
    .cetele-hero .cetele-progress-card {
        width: 100% !important;
        min-width: 0;
        max-width: 100%;
        height: 44px;
        min-height: 44px !important;
        max-height: 44px !important;
        margin: 0;
        padding: 0 0.25rem !important;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        text-align: center;
        box-sizing: border-box;
        background: rgba(255, 255, 255, 0.08) !important;
        border: 1px solid rgba(255, 255, 255, 0.15) !important;
        border-radius: 8px;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-progress-ring,
    .cetele-hero .cetele-progress-ring {
        display: none !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-progress-card .stat-data,
    .cetele-hero .cetele-progress-card .stat-data {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        width: 100% !important;
        min-width: 0 !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-progress-card .stat-value,
    .cetele-hero .cetele-progress-card .stat-value {
        font-size: 0.95rem !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        color: #ffffff !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-progress-card .stat-label,
    .cetele-hero .cetele-progress-card .stat-label {
        font-size: 0.6rem !important;
        font-weight: 600 !important;
        line-height: 1.1 !important;
        color: rgba(255, 255, 255, 0.75) !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        margin-top: 2px !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-hero-actions,
    .cetele-hero .cetele-hero-actions {
        grid-column: 2 / span 2 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.5rem !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: stretch !important;
        justify-self: stretch !important;
        box-sizing: border-box !important;
    }
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-hero-actions .btn-hero-secondary,
    html body:not(.mk-shell-backoffice) .site-main .cetele-hero .cetele-hero-actions .btn-hero-primary,
    .cetele-hero-actions .btn-hero-secondary,
    .cetele-hero-actions .btn-hero-primary {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
        padding: 0 0.25rem !important;
        font-size: 0.75rem !important;
        font-weight: 600 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        border-radius: 8px !important;
        margin: 0 !important;
    }

    /* 11. Becayiş Hero: İlan Ver ve İlanlarım Butonlarını Yan Yana Tek Satıra Sığdır */
    html body.mk-page-becayis .site-main .becayis-hero-inner,
    .becayis-hero-inner {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.85rem !important;
        width: 100% !important;
    }
    html body.mk-page-becayis .site-main .becayis-hero-right,
    .becayis-hero .hero-right,
    .becayis-hero-right {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        gap: 0.55rem !important;
        margin: 0 !important;
    }
    html body.mk-page-becayis .site-main .becayis-hero-right > .hero-stats,
    .becayis-hero .hero-stats,
    .hero-stats {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.45rem !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
    }
    .becayis-hero .hstat,
    .hstat {
        width: 100% !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        padding: 0 0.45rem !important;
        justify-content: center;
        box-sizing: border-box;
    }
    html body.mk-page-becayis .site-main .becayis-hero-right > .becayis-hero-actions,
    .becayis-hero .becayis-hero-actions,
    .becayis-hero-actions,
    main.becayis-wrap .becayis-hero-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.45rem !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }
    html body.mk-page-becayis .site-main .becayis-hero-right > .becayis-hero-actions > .btn-hero,
    .becayis-hero-actions > .btn-hero,
    main.becayis-wrap .becayis-hero-actions .btn-hero {
        flex: 1 1 0;
        width: 100% !important;
        min-width: 0;
        max-width: 100%;
        height: 42px;
        min-height: 42px;
        max-height: 42px;
        padding: 0 0.35rem;
        font-size: 0.8rem;
        white-space: nowrap;
        text-align: center;
        justify-content: center;
        box-sizing: border-box;
        display: inline-flex;
        align-items: center;
    }

    /* 12. Liderlik Podyum Kartları: Avatar Tam Yuvarlak & Nicklerin Ayrılması */
    .leaderboard-podium {
        grid-template-columns: 1fr !important;
        gap: 1.25rem !important;
    }
    .podium-card {
        padding: 1.85rem 1rem 1.25rem !important;
        box-sizing: border-box !important;
    }
    .podium-card .podium-user-link {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-decoration: none !important;
        color: inherit !important;
        width: 100% !important;
        margin: 0.5rem 0 0.5rem !important;
        gap: 0 !important;
        box-sizing: border-box !important;
    }
    .podium-card .podium-avatar-wrap {
        position: relative;
        display: block;
        width: 68px;
        height: 68px;
        min-width: 68px;
        min-height: 68px;
        max-width: 68px;
        max-height: 68px;
        aspect-ratio: 1 / 1;
        border-radius: 50%;
        margin: 0 auto 12px;
        padding: 0;
        flex-shrink: 0;
        box-sizing: border-box;
    }
    .podium-card.podium-gold .podium-avatar-wrap,
    .podium-card .podium-avatar-wrap.gold-ring {
        width: 76px;
        height: 76px;
        min-width: 76px;
        min-height: 76px;
        max-width: 76px;
        max-height: 76px;
    }
    .podium-card.podium-silver .podium-avatar-wrap,
    .podium-card .podium-avatar-wrap.silver-ring,
    .podium-card.podium-bronze .podium-avatar-wrap,
    .podium-card .podium-avatar-wrap.bronze-ring {
        width: 68px;
        height: 68px;
        min-width: 68px;
        min-height: 68px;
        max-width: 68px;
        max-height: 68px;
    }
    .podium-card .podium-avatar,
    .podium-card .podium-avatar-placeholder {
        width: 100%;
        height: 100%;
        min-width: 100%;
        min-height: 100%;
        max-width: 100%;
        max-height: 100%;
        aspect-ratio: 1 / 1;
        border-radius: 50%;
        object-fit: cover;
        object-position: center;
        display: block;
        box-sizing: border-box;
    }
    .podium-card .podium-avatar-placeholder {
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    .podium-card.podium-gold .podium-avatar,
    .podium-card.podium-gold .podium-avatar-placeholder,
    .podium-card .podium-avatar-wrap.gold-ring .podium-avatar,
    .podium-card .podium-avatar-wrap.gold-ring .podium-avatar-placeholder {
        border: 3.5px solid #fbbf24;
        box-shadow: 0 0 0 3.5px rgba(251, 191, 36, 0.3);
    }
    .podium-card.podium-silver .podium-avatar,
    .podium-card.podium-silver .podium-avatar-placeholder,
    .podium-card .podium-avatar-wrap.silver-ring .podium-avatar,
    .podium-card .podium-avatar-wrap.silver-ring .podium-avatar-placeholder {
        border: 3px solid #94a3b8;
        box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.3);
    }
    .podium-card.podium-bronze .podium-avatar,
    .podium-card.podium-bronze .podium-avatar-placeholder,
    .podium-card .podium-avatar-wrap.bronze-ring .podium-avatar,
    .podium-card .podium-avatar-wrap.bronze-ring .podium-avatar-placeholder {
        border: 3px solid #ea580c;
        box-shadow: 0 0 0 3px rgba(234, 88, 12, 0.3);
    }
    .podium-card .podium-rank-pill {
        position: absolute;
        bottom: -2px;
        right: -2px;
        width: 22px;
        height: 22px;
        min-width: 22px;
        min-height: 22px;
        border-radius: 50%;
        aspect-ratio: 1 / 1;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 11px;
        font-weight: 800;
        line-height: 1;
        border: 2px solid #ffffff;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
        z-index: 2;
    }
    .podium-card .user-name-line {
        position: static !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        clear: both !important;
        box-sizing: border-box !important;
    }
    .podium-card .user-name {
        display: inline-block !important;
        font-size: 0.98rem !important;
        font-weight: 800 !important;
        line-height: 1.3 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 220px !important;
        text-align: center !important;
    }


    /* 13. Favorilerim Hero: 4 İstatistik Çerçevesi Mobilde 2x2 Grid (Yan Yana) */
    body.mk-page-favorites .favorites-hero .favorites-hero-stats,
    .favorites-hero .favorites-hero-stats,
    .favorites-hero-stats {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.45rem !important;
        width: 100% !important;
        margin: 0.75rem auto 0 !important;
        justify-content: center !important;
    }
    .favorites-hero .hero-stat-card {
        padding: 0.55rem 0.45rem !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 0.45rem !important;
        box-sizing: border-box !important;
    }
    .favorites-hero .stat-icon {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        flex-shrink: 0 !important;
    }
    .favorites-hero .stat-value {
        font-size: 1.05rem !important;
        line-height: 1.1 !important;
        font-weight: 700 !important;
    }
    .favorites-hero .stat-label {
        font-size: 0.7rem !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* 14. Bildirimler Hero Özet Kartları: 3 Sütun Dikey Kart & Harf Bölünmesini Önle */
    body.mk-page-notifications .notifications-summary {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 0.4rem !important;
        width: 100% !important;
    }
    body.mk-page-notifications .notifications-summary-item {
        min-height: 0 !important;
        padding: 0.55rem 0.3rem !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }
    body.mk-page-notifications .notifications-summary-item:last-child {
        grid-column: auto !important;
    }
    body.mk-page-notifications .notifications-summary-icon {
        width: 28px;
        height: 28px !important;
        margin: 0 auto 0.25rem !important;
        flex-shrink: 0;
    }
    body.mk-page-notifications .notifications-summary-icon svg {
        width: 15px !important;
        height: 15px !important;
    }
    body.mk-page-notifications .notifications-summary-content {
        align-items: center !important;
        text-align: center !important;
        width: 100% !important;
        min-width: 0 !important;
    }
    body.mk-page-notifications .notifications-summary strong {
        font-size: 1.15rem !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        word-break: keep-all !important;
    }
    body.mk-page-notifications .notifications-summary small {
        font-size: 0.68rem !important;
        white-space: nowrap !important;
        word-break: keep-all !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        width: 100% !important;
        text-align: center !important;
    }

    /* 14. Mevzuat Merkezi Arama Girişi & Placeholder Çarpıklığını Gider */
    body.mk-page-legal .mk-search-input-wrap.law-search-input,
    body.mk-page-legal .law-search-input {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        width: 100%;
        min-height: 48px;
        height: 48px;
        padding: 0 12px;
        box-sizing: border-box;
    }
    body.mk-page-legal .law-search-input :is(.mk-search-icon, svg, .icon-svg) {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 20px;
        height: 20px;
        margin: 0 10px 0 0;
    }
    body.mk-page-legal .law-search-input :is(input, input[type="search"]) {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
        height: 38px;
        min-height: 38px;
        padding: 0;
        margin: 0;
        border: none;
        background: transparent;
        font-size: 0.92rem;
        line-height: normal;
    }

    /* ==========================================================================
       FORUM KONU MESAJ YAZAN KULLANICI PROFİLİ MOBİL DÜZENİ (COMPACT HEADER)
       ========================================================================== */
    .forum-topic-detail-page .post-sidebar {
        padding: 0.65rem 0.85rem !important;
        border-right: none !important;
        border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
        background: #f8fafc !important;
        box-sizing: border-box !important;
    }

    .forum-topic-detail-page .user-profile-card {
        display: grid !important;
        grid-template-columns: 46px 1fr !important;
        grid-template-rows: auto auto !important;
        column-gap: 0.75rem !important;
        row-gap: 0.25rem !important;
        align-items: center !important;
        text-align: left !important;
        width: 100% !important;
    }

    .forum-topic-detail-page .user-avatar-link {
        grid-column: 1 !important;
        grid-row: 1 / span 2 !important;
        width: 46px !important;
        height: 46px !important;
        align-self: center !important;
        margin: 0 !important;
    }

    .forum-topic-detail-page .user-avatar {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        min-height: 46px !important;
        border-width: 2px !important;
        font-size: 1rem !important;
    }

    .forum-topic-detail-page .username-link {
        grid-column: 2 !important;
        grid-row: 1 !important;
        font-size: 0.95rem !important;
        font-weight: 800 !important;
        text-align: left !important;
        line-height: 1.25 !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 0.35rem !important;
        margin: 0 !important;
        word-break: break-word !important;
    }

    .forum-topic-detail-page .user-badge {
        grid-column: 2 !important;
        grid-row: 2 !important;
        font-size: 0.72rem !important;
        padding: 0.18rem 0.5rem !important;
        justify-self: start !important;
        margin: 0 !important;
        width: fit-content !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    .forum-topic-detail-page .user-stats-grid {
        grid-column: 1 / -1 !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 0.35rem !important;
        width: 100% !important;
        margin-top: 0.35rem !important;
        padding-top: 0.35rem !important;
        border-top: 1px dashed rgba(203, 213, 225, 0.6) !important;
    }

    .forum-topic-detail-page .user-stats-grid .stat-item {
        flex: 1 1 auto !important;
        min-height: 26px !important;
        height: 26px !important;
        padding: 0 0.45rem !important;
        border-radius: 6px !important;
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0.25rem !important;
        background: #ffffff !important;
        border: 1px solid rgba(203, 213, 225, 0.5) !important;
    }

    .forum-topic-detail-page .user-stats-grid .stat-icon {
        display: none !important;
    }

    .forum-topic-detail-page .user-stats-grid .stat-value {
        font-weight: 800 !important;
        font-size: 0.75rem !important;
        line-height: 1 !important;
    }

    .forum-topic-detail-page .user-stats-grid .stat-label {
        font-size: 0.68rem !important;
        color: #64748b !important;
        line-height: 1 !important;
    }

    .forum-topic-detail-page .user-info-section,
    .forum-topic-detail-page .member-since {
        grid-column: 1 / -1 !important;
        display: inline-flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 0.45rem !important;
        font-size: 0.72rem !important;
        margin: 0 !important;
        color: #64748b !important;
    }

    /* ==========================================================================
       FORUM & BLOG YAZI YAZMA EKRANI WYSIWYG BUTONLARI TEK SATIR KESİN KURAL
       ========================================================================== */
    html body:not(.mk-shell-backoffice) :is(.mk-wysiwyg-toolbar, .editor-toolbar, .forum-editor-toolbar) {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior-inline: contain;
        gap: 3px;
        padding: 6px 8px;
        width: 100%;
        box-sizing: border-box;
        white-space: nowrap;
        scrollbar-width: thin;
    }

    html body:not(.mk-shell-backoffice) :is(.mk-wysiwyg-btn-group) {
        display: inline-flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        width: max-content;
        min-width: max-content;
        white-space: nowrap;
        gap: 3px;
    }

    html body:not(.mk-shell-backoffice) :is(.mk-wysiwyg-btn, .forum-editor-btn, .mk-editor-tool-button) {
        display: inline-flex;
        flex: 0 0 32px;
        flex-shrink: 0;
        width: 32px;
        min-width: 32px;
        max-width: 32px;
        height: 32px;
        min-height: 32px;
        max-height: 32px;
        padding: 0;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        margin: 0;
        vertical-align: middle;
    }

    html body:not(.mk-shell-backoffice) :is(.mk-wysiwyg-divider, .forum-editor-divider) {
        display: inline-block;
        flex: 0 0 1px;
        flex-shrink: 0;
        width: 1px;
        min-width: 1px;
        max-width: 1px;
        height: 18px;
        margin: 0 3px;
        box-sizing: border-box;
    }
}

/* Genel (Tüm Ekranlar) Kesin WYSIWYG Güvencesi */
html body:not(.mk-shell-backoffice) :is(.mk-wysiwyg-toolbar, .editor-toolbar, .forum-editor-toolbar) {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap;
}

html body:not(.mk-shell-backoffice) :is(.mk-wysiwyg-btn-group) {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: max-content;
    min-width: max-content;
    white-space: nowrap;
}

html body:not(.mk-shell-backoffice) :is(.mk-wysiwyg-btn, .forum-editor-btn, .mk-editor-tool-button) {
    display: inline-flex;
    flex: 0 0 32px;
    flex-shrink: 0;
    width: 32px;
    min-width: 32px;
    max-width: 32px;
    height: 32px;
    box-sizing: border-box;
    vertical-align: middle;
}

/* ── Belge Stüdyosu & Belgelerim Arama Çubuğu İkon-Metin Hizalama Kilidi ───── */
html body:not(.mk-shell-backoffice) :is(.docs-page, .studio-page, .site-main) :is(.studio-search-panel, .documents-search-panel) .documents-search-input {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 0 14px !important;
    min-height: 44px !important;
    box-sizing: border-box !important;
}

html body:not(.mk-shell-backoffice) :is(.docs-page, .studio-page, .site-main) :is(.studio-search-panel, .documents-search-panel) .documents-search-input:focus-within {
    background: #ffffff !important;
    border-color: var(--mk-brand, #8f1d1d) !important;
    box-shadow: 0 0 0 3px rgba(143, 29, 29, 0.12) !important;
}

html body:not(.mk-shell-backoffice) :is(.docs-page, .studio-page, .site-main) :is(.studio-search-panel, .documents-search-panel) .documents-search-input svg {
    position: static;
    top: auto;
    left: auto;
    transform: none;
    flex-shrink: 0;
    width: 20px !important;
    height: 20px !important;
    color: #64748b;
    margin: 0 12px 0 0;
    padding: 0;
    pointer-events: none;
    display: block;
}

html body:not(.mk-shell-backoffice) :is(.docs-page, .studio-page, .site-main) :is(.studio-search-panel, .documents-search-panel) .documents-search-input input {
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 10px 0 !important;
    margin: 0 !important;
    font-size: 0.95rem !important;
    font-weight: 500 !important;
    color: #0f172a !important;
    line-height: normal !important;
    height: auto !important;
    min-height: auto !important;
}

html body:not(.mk-shell-backoffice) :is(.docs-page, .studio-page, .site-main) :is(.studio-search-panel, .documents-search-panel) .documents-search-input input:focus {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

html body:not(.mk-shell-backoffice) :is(.docs-page, .studio-page, .site-main) :is(.studio-search-panel, .documents-search-panel) .documents-search-input input::placeholder {
    color: #94a3b8 !important;
    opacity: 1 !important;
}

/* ══════════════════════════════════════════════════════════════════
   FORUM POPÜLER ETİKETLER & TÜM ETİKETLER MODAL ARAMA KUTUSU DÜZENLEMESİ
   ══════════════════════════════════════════════════════════════════ */

/* 1. Tüm Forum & Tüm Blog Etiketleri Modalı: Arama Kutusu İkon & Metin Ayrımı */
html body .mk-tags-modal-search input[type="text"],
html body .mk-tags-modal-search input,
html body #mkTagsSearchInput,
html body #mkBlogTagsSearchInput {
    width: 100%;
    height: 42px;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 44px;
    padding-right: 14px;
    border-radius: 12px;
    border: 1px solid #cbd5e1;
    font-size: 13.5px;
    outline: none;
    box-sizing: border-box;
    background: #f8fafc;
    transition: all 0.2s !important;
}

html body .mk-tags-modal-search input[type="text"]:focus,
html body .mk-tags-modal-search input:focus,
html body #mkTagsSearchInput:focus,
html body #mkBlogTagsSearchInput:focus {
    border-color: #2563eb !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
}

html body .mk-tags-modal-search .mk-search-icon {
    position: absolute;
    left: 34px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    color: #94a3b8;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

/* 2. Mobilde Forum Popüler Etiketler Başlığı & Arama Kutusu İkon Ayarı */
@media (max-width: 680px) {
    /* Forum Popüler Etiketler Başlığı: Tek Satırda Yan Yana (Sol: Başlık, Sağ: Tümü Butonu) */
    html body.mk-page-forum .classic-forum-wrapper .forum-tag-cloud-head,
    html body.mk-page-forum .forum-tag-cloud-head,
    html body .classic-forum-wrapper .forum-tag-cloud-head {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        flex-wrap: nowrap !important;
        gap: 10px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    html body.mk-page-forum .classic-forum-wrapper .mk-collapse-trigger,
    html body.mk-page-forum .mk-collapse-trigger {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
        min-width: 0 !important;
    }

    html body.mk-page-forum .mk-tag-head-actions,
    html body .classic-forum-wrapper .mk-tag-head-actions {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;
        margin-left: auto !important;
        flex-shrink: 0 !important;
    }

    html body.mk-page-forum .mk-btn-all-tags,
    html body .classic-forum-wrapper .mk-btn-all-tags {
        display: inline-flex !important;
        align-items: center !important;
        gap: 5px !important;
        padding: 5px 12px !important;
        border-radius: 20px !important;
        border: 1px solid rgba(37, 99, 235, 0.25) !important;
        background: rgba(37, 99, 235, 0.08) !important;
        color: #2563eb !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        white-space: nowrap !important;
    }

    html body.mk-page-forum .mk-btn-all-tags span,
    html body .classic-forum-wrapper .mk-btn-all-tags span {
        display: none !important;
    }

    html body.mk-page-forum .mk-btn-all-tags::after,
    html body .classic-forum-wrapper .mk-btn-all-tags::after {
        content: 'Tümü' !important;
    }

    html body .mk-tags-modal-search {
        padding: 10px 16px;
    }

    html body .mk-tags-modal-search .mk-search-icon {
        left: 28px;
    }
}

/* ═══════════════════════════════════════════════════════════
   Blog Popüler Etiketler: Başlık ve Ok (>) Yan Yana Hizalama & Tümü Butonu
   ═══════════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════════
   Blog Popüler Etiketler: Forum Tag Cloud ile Birebir Aynı Tasarım & Hizalama
   ═══════════════════════════════════════════════════════════ */
html body.mk-page-blog #blogTagsCard,
html body #blogTagsCard,
.blog-sidebar .sidebar-tags-card {
    margin: 1rem 0 1.15rem !important;
    padding: 1rem !important;
    border: 1px solid var(--mk-line, #e2e8f0) !important;
    border-radius: var(--mk-radius-lg, 12px) !important;
    background: #ffffff !important;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05) !important;
    box-sizing: border-box !important;
}

html body.mk-page-blog #blogTagsCard .sidebar-tags-head,
html body #blogTagsCard .sidebar-tags-head,
.blog-sidebar .sidebar-tags-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 5px !important;
    margin-bottom: 0.85rem !important;
    padding: 0 !important;
    border: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

html body.mk-page-blog #blogTagsCard .sidebar-tags-kicker,
html body #blogTagsCard .sidebar-tags-kicker,
.blog-sidebar .sidebar-tags-kicker {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    color: var(--mk-muted, #64748b) !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    line-height: 1 !important;
}

html body.mk-page-blog #blogTagsCard .sidebar-tags-kicker svg,
html body #blogTagsCard .sidebar-tags-kicker svg,
.blog-sidebar .sidebar-tags-kicker svg {
    width: 12px;
    height: 12px;
    color: #e11d48;
}

html body.mk-page-blog #blogTagsCard .sidebar-tags-head-row,
html body #blogTagsCard .sidebar-tags-head-row,
.blog-sidebar .sidebar-tags-head-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

html body.mk-page-blog #blogTagsCard .mk-collapse-trigger,
html body #blogTagsCard .mk-collapse-trigger,
.blog-sidebar .sidebar-tags-card .mk-collapse-trigger {
    cursor: pointer !important;
    user-select: none !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
}

html body.mk-page-blog #blogTagsCard .mk-collapse-trigger h3,
html body #blogTagsCard .mk-collapse-trigger h3,
.blog-sidebar .sidebar-tags-card .mk-collapse-trigger h3,
.sidebar-tags-head-row .sidebar-tags-title {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    color: var(--mk-ink, #0f172a) !important;
    font-size: 0.96rem !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.015em !important;
    white-space: nowrap !important;
}

html body.mk-page-blog #blogTagsCard .mk-collapse-arrow,
html body #blogTagsCard .mk-collapse-arrow,
.blog-sidebar .sidebar-tags-card .mk-collapse-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    min-width: 20px;
    max-width: 20px;
    min-height: 20px;
    max-height: 20px;
    border-radius: 5px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    color: #64748b;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
    margin: 0;
    padding: 0;
    flex-shrink: 0;
}

html body.mk-page-blog #blogTagsCard .mk-collapse-arrow svg,
html body #blogTagsCard .mk-collapse-arrow svg,
.blog-sidebar .sidebar-tags-card .mk-collapse-arrow svg {
    width: 12px;
    height: 12px;
}

html body.mk-page-blog #blogTagsCard .mk-collapse-trigger:hover .mk-collapse-arrow,
html body #blogTagsCard .mk-collapse-trigger:hover .mk-collapse-arrow,
.blog-sidebar .sidebar-tags-card .mk-collapse-trigger:hover .mk-collapse-arrow {
    background: #e2e8f0 !important;
    color: #0f172a !important;
    border-color: #cbd5e1 !important;
}

html body.mk-page-blog #blogTagsCard.is-collapsed .mk-collapse-arrow,
html body #blogTagsCard.is-collapsed .mk-collapse-arrow,
.blog-sidebar .sidebar-tags-card.is-collapsed .mk-collapse-arrow {
    transform: rotate(-90deg);
}

html body.mk-page-blog #blogTagsCard.is-collapsed .forum-tag-cloud-list,
html body.mk-page-blog #blogTagsCard.is-collapsed .sidebar-tag-list,
html body #blogTagsCard.is-collapsed .sidebar-tag-list {
    display: none !important;
}

/* Sağdaki Tümü / Tüm Etiketler Butonu */
html body.mk-page-blog #blogTagsCard .mk-tag-head-actions,
html body #blogTagsCard .mk-tag-head-actions,
.blog-sidebar .sidebar-tags-head .mk-tag-head-actions,
.sidebar-tags-head-row .mk-tag-head-actions {
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
    margin-left: auto !important;
}

html body.mk-page-blog #blogTagsCard .mk-btn-all-tags,
html body #blogTagsCard .mk-btn-all-tags,
.blog-sidebar .sidebar-tags-head .mk-btn-all-tags {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 0 9px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(225, 29, 72, 0.22) !important;
    background: rgba(225, 29, 72, 0.06) !important;
    color: #e11d48 !important;
    font-size: 0.72rem !important;
    font-weight: 650 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    height: 25px !important;
    line-height: 1 !important;
    box-shadow: none !important;
    transform: none !important;
    box-sizing: border-box !important;
}

html body.mk-page-blog #blogTagsCard .mk-btn-all-tags:hover,
html body #blogTagsCard .mk-btn-all-tags:hover,
.blog-sidebar .sidebar-tags-head .mk-btn-all-tags:hover {
    background: #e11d48 !important;
    border-color: #e11d48 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(225, 29, 72, 0.28) !important;
    transform: translateY(-1px) !important;
}

html body.mk-page-blog #blogTagsCard .mk-btn-all-tags svg,
html body #blogTagsCard .mk-btn-all-tags svg,
.blog-sidebar .sidebar-tags-head .mk-btn-all-tags svg {
    width: 11px !important;
    height: 11px !important;
    transition: color 0.2s ease !important;
}

@media (max-width: 680px) {
    html body.mk-page-blog #blogTagsCard .mk-btn-all-tags span,
    html body #blogTagsCard .mk-btn-all-tags span,
    .blog-sidebar .sidebar-tags-head .mk-btn-all-tags span {
        display: inline !important;
    }
}

/* Çipler: Forumdaki forum-tag-chip yapısı */
html body.mk-page-blog #blogTagsCard .forum-tag-cloud-list,
html body #blogTagsCard .sidebar-tag-list,
.blog-sidebar .sidebar-tags-card .sidebar-tag-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.45rem !important;
    padding-top: 0.25rem !important;
}

html body.mk-page-blog #blogTagsCard .forum-tag-chip,
html body #blogTagsCard .forum-tag-chip,
.blog-sidebar .sidebar-tags-card .forum-tag-chip {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.45rem !important;
    min-height: 32px !important;
    padding: 0.38rem 0.65rem !important;
    border: 1px solid rgba(225, 29, 72, 0.18) !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #e11d48 !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
    box-sizing: border-box !important;
}

html body.mk-page-blog #blogTagsCard .forum-tag-chip:hover,
html body #blogTagsCard .forum-tag-chip:hover {
    border-color: rgba(225, 29, 72, 0.38) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 14px rgba(225, 29, 72, 0.12) !important;
}

html body.mk-page-blog #blogTagsCard .forum-tag-chip strong,
html body #blogTagsCard .forum-tag-chip strong,
.blog-sidebar .sidebar-tags-card .forum-tag-chip strong {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 20px !important;
    height: 20px !important;
    padding: 0 0.35rem !important;
    border-radius: 999px !important;
    background: #ffe4e6 !important;
    color: #e11d48 !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
}

/* ═══════════════════════════════════════════════════════════
   Etiket Modalları: Modern, Renkli ve Ergonomik Kapatma (X) Butonu
   ═══════════════════════════════════════════════════════════ */
.mk-tags-modal-close,
html body .mk-tags-modal-close,
#mkBlogAllTagsModal .mk-tags-modal-close,
#mkAllTagsModal .mk-tags-modal-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px !important;
    min-width: 34px;
    max-width: 34px !important;
    height: 34px;
    min-height: 34px;
    max-height: 34px;
    padding: 0;
    margin: 0;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #64748b;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-sizing: border-box;
    line-height: 1;
    outline: none;
}

.mk-tags-modal-close:hover,
html body .mk-tags-modal-close:hover,
#mkBlogAllTagsModal .mk-tags-modal-close:hover,
#mkAllTagsModal .mk-tags-modal-close:hover {
    border-color: #fecdd3 !important;
    background: #fff1f2 !important;
    color: #e11d48 !important;
    box-shadow: 0 4px 10px rgba(225, 29, 72, 0.15) !important;
    transform: rotate(90deg) scale(1.05) !important;
}

.mk-tags-modal-close:active,
html body .mk-tags-modal-close:active {
    transform: scale(0.95) !important;
}

.mk-tags-modal-close svg,
html body .mk-tags-modal-close svg {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    display: block;
    margin: 0;
}


/* 3. Mobilde İşlem Merkezi Hero İstatistik Kartları (3'ü Yan Yana, Kompakt & Hizalı) */
@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero .tools-summary-bar {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
        margin-top: 12px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-stat-card,
    html body:not(.mk-shell-backoffice) .site-main .tools-page .hero-stat-card,
    .site-main > .tools-page .hero-stat-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 8px 4px 6px !important;
        height: auto !important;
        min-height: 66px !important;
        max-height: none !important;
        min-width: 0;
        background: rgba(255, 255, 255, 0.05);
        border: 1px solid rgba(255, 255, 255, 0.08) !important;
        border-radius: 10px !important;
        box-sizing: border-box;
        backdrop-filter: blur(8px);
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-stat-card .stat-icon {
        width: 24px !important;
        height: 24px !important;
        border-radius: 6px !important;
        background: rgba(239, 68, 68, 0.15) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        color: #f87171 !important;
        margin: 0 auto 3px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-stat-card .stat-icon svg {
        width: 13px !important;
        height: 13px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-stat-card .stat-data {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-stat-card .stat-value {
        font-size: 1.05rem !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        color: #ffffff !important;
        margin-bottom: 2px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .tools-hero .hero-stat-card .stat-label {
        font-size: 0.65rem !important;
        font-weight: 600 !important;
        color: #94a3b8 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        letter-spacing: 0.02em !important;
    }
}

/* 4. Mobilde Belge Stüdyosu Hero Kart Düzeni & Gereksiz Boşlukların Temizlenmesi */
@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main .studio-hero,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero {
        padding: 14px !important;
        min-height: 0 !important;
        height: auto !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .hero-content,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        height: auto !important;
        min-height: 0 !important;
        justify-content: flex-start !important;
        align-items: stretch !important;
        text-align: left !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .hero-left,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .hero-left {
        flex: 0 0 auto;
        height: auto !important;
        min-height: 0;
        justify-content: flex-start !important;
        align-items: flex-start;
        text-align: left;
        width: 100% !important;
        margin: 0;
        padding: 0;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .tools-back-link,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .tools-back-link {
        margin-top: 0 !important;
        margin-bottom: 8px !important;
        font-size: 0.75rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .tools-kicker,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .tools-kicker {
        margin-bottom: 8px !important;
        font-size: 0.72rem !important;
        padding: 3px 8px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .hero-title,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .hero-title {
        margin: 0 0 6px !important;
        font-size: 1.45rem !important;
        line-height: 1.15 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .hero-subtitle,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .hero-subtitle {
        margin: 0 !important;
        font-size: 0.82rem !important;
        line-height: 1.4 !important;
        color: #94a3b8 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .hero-actions,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .hero-actions {
        width: 100% !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .studio-hero .tools-summary-bar,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .tools-summary-bar {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .hero-stat-card,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .hero-stat-card {
        height: auto !important;
        min-height: 64px;
        max-height: none !important;
        padding: 8px 6px 6px;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        width: 100% !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .hero-stat-card .stat-icon,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .hero-stat-card .stat-icon {
        width: 24px !important;
        height: 24px !important;
        border-radius: 6px !important;
        margin: 0 auto 3px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .studio-hero .hero-primary,
    html body:not(.mk-shell-backoffice) .site-main .tools-hero.studio-hero .hero-primary {
        width: 100% !important;
        justify-content: center;
        padding: 10px 16px;
        min-height: 44px;
        height: 44px;
        border-radius: 8px;
        box-sizing: border-box;
    }
}

/* 5. Mobilde Mevzuat Merkezi Hero İstatistik Kartları (3'ü Yan Yana, Kompakt & Eşit Hizalı) */
@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main .law-hero,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .law-hero,
    html body.mk-page-legal .site-main .law-hero {
        padding: 16px 14px !important;
        min-height: 0 !important;
        height: auto !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-content,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .law-hero .hero-content,
    html body.mk-page-legal .site-main .law-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        gap: 12px !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-left,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .law-hero .hero-left,
    html body.mk-page-legal .site-main .law-hero .hero-left {
        width: 100% !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .law-back,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .law-hero .law-back,
    html body.mk-page-legal .site-main .law-hero .law-back {
        margin: 0 auto 8px !important;
        font-size: 0.78rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-title,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .law-hero .hero-title,
    html body.mk-page-legal .site-main .law-hero .hero-title {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        font-size: 1.45rem !important;
        line-height: 1.25 !important;
        margin: 0 0 6px !important;
        text-align: center !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-title svg,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .law-hero .hero-title svg,
    html body.mk-page-legal .site-main .law-hero .hero-title svg {
        width: 22px !important;
        height: 22px !important;
        flex-shrink: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-subtitle,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .law-hero .hero-subtitle,
    html body.mk-page-legal .site-main .law-hero .hero-subtitle {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
        color: #94a3b8 !important;
        margin: 0 auto !important;
        max-width: 340px !important;
        text-align: center !important;
    }

    /* 3 İstatistik Çerçevesi Yan Yana (Repeat 3 Kolon) */
    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .hero-stats-grid,
    html body.mk-page-legal .site-main .law-hero .hero-stats-grid,
    html body.mk-product-knowledge .site-main .law-hero .hero-stats-grid,
    body:is(.mk-product-knowledge,.mk-page-legal) .site-main :where(.law-hero) .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 8px auto 0 !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-stat-card,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .hero-stat-card,
    html body.mk-page-legal .site-main .law-hero .hero-stat-card,
    html body.mk-product-knowledge .site-main .law-hero .hero-stat-card,
    body:is(.mk-product-knowledge,.mk-page-legal) .site-main :where(.law-hero) .hero-stat-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center !important;
        text-align: center;
        padding: 8px 4px 6px !important;
        height: auto !important;
        min-height: 64px !important;
        max-height: none !important;
        min-width: 0 !important;
        max-width: none;
        width: 100% !important;
        box-sizing: border-box;
        margin: 0;
        flex: none;
        background: rgba(255, 255, 255, 0.05) !important;
        border: 1px solid rgba(255, 255, 255, 0.08) !important;
        border-radius: 10px;
        backdrop-filter: blur(8px);
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-stat-card .stat-icon,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .hero-stat-card .stat-icon,
    html body.mk-page-legal .site-main .law-hero .hero-stat-card .stat-icon {
        width: 24px;
        height: 24px;
        min-width: 24px;
        min-height: 24px;
        border-radius: 6px !important;
        background: rgba(56, 189, 248, 0.15) !important;
        color: #38bdf8;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 3px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-stat-card .stat-icon svg,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .hero-stat-card .stat-icon svg,
    html body.mk-page-legal .site-main .law-hero .hero-stat-card .stat-icon svg {
        width: 14px !important;
        height: 14px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-stat-card .stat-data,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .hero-stat-card .stat-data,
    html body.mk-page-legal .site-main .law-hero .hero-stat-card .stat-data {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-stat-card .stat-value,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .hero-stat-card .stat-value,
    html body.mk-page-legal .site-main .law-hero .hero-stat-card .stat-value {
        font-size: 1.05rem !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        color: #ffffff !important;
        margin-bottom: 2px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .law-hero .hero-stat-card .stat-label,
    html body:not(.mk-shell-backoffice) .site-main .law-page-container .hero-stat-card .stat-label,
    html body.mk-page-legal .site-main .law-hero .hero-stat-card .stat-label {
        font-size: 0.65rem !important;
        font-weight: 600 !important;
        color: #94a3b8 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        letter-spacing: 0.02em !important;
    }
}

/* 6. Mobilde Resmi Duyurular Hero İstatistik Kartları (3'ü Yan Yana, Kompakt & Eşit Hizalı) */
@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main .announcements-hero,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .announcements-hero,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .announcements-hero,
    html body .site-main .announcements-hero {
        padding: 16px 14px 18px !important;
        min-height: 0 !important;
        height: auto !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-content,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .announcements-hero .hero-content,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .announcements-hero .hero-content,
    html body .site-main .announcements-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        gap: 12px !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-left,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-left,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-left {
        width: 100% !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .announcements-kicker,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .announcements-kicker,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .announcements-kicker {
        margin: 0 auto 8px !important;
        font-size: 0.72rem !important;
        padding: 3px 8px !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        line-height: 1.2 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-title,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-title,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-title {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        font-size: 1.45rem !important;
        line-height: 1.25 !important;
        margin: 0 0 6px !important;
        text-align: center !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-title svg,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-title svg,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-title svg {
        width: 22px !important;
        height: 22px !important;
        flex-shrink: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-subtitle,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-subtitle,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-subtitle {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
        color: #94a3b8 !important;
        margin: 0 auto !important;
        max-width: 340px !important;
        text-align: center !important;
    }

    /* 3 İstatistik Çerçevesi Yan Yana (Repeat 3 Kolon) */
    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-stats-grid,
    html body .site-main .announcements-hero .hero-stats-grid,
    body:is(.mk-announcements,.mk-product-updates) .site-main :where(.announcements-hero) .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 10px auto 0 !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-stat-card,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-stat-card,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-stat-card,
    html body .site-main .announcements-hero .hero-stat-card,
    body:is(.mk-announcements,.mk-product-updates) .site-main :where(.announcements-hero) .hero-stat-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center !important;
        text-align: center;
        padding: 8px 4px 6px !important;
        height: auto !important;
        min-height: 64px !important;
        max-height: none !important;
        min-width: 0;
        max-width: none;
        width: 100% !important;
        box-sizing: border-box;
        margin: 0;
        flex: none;
        background: rgba(255, 255, 255, 0.05) !important;
        border: 1px solid rgba(255, 255, 255, 0.08) !important;
        border-radius: 10px !important;
        backdrop-filter: blur(8px);
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-stat-card .stat-icon,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-stat-card .stat-icon,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-stat-card .stat-icon,
    html body .site-main .announcements-hero .hero-stat-card .stat-icon {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        border-radius: 6px !important;
        background: rgba(59, 130, 246, 0.15) !important;
        color: #60a5fa !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 auto 3px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-stat-card .stat-icon svg,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-stat-card .stat-icon svg,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-stat-card .stat-icon svg {
        width: 14px !important;
        height: 14px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-stat-card .stat-data,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-stat-card .stat-data,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-stat-card .stat-data {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-stat-card .stat-value,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-stat-card .stat-value,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-stat-card .stat-value {
        font-size: 1.05rem !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        color: #ffffff !important;
        margin-bottom: 2px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .announcements-hero .hero-stat-card .stat-label,
    html body:not(.mk-shell-backoffice) .site-main .announcements-page-container .hero-stat-card .stat-label,
    html body:not(.mk-shell-backoffice) .site-main .mk-announcements .hero-stat-card .stat-label {
        font-size: 0.62rem !important;
        font-weight: 600 !important;
        color: #94a3b8 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        letter-spacing: 0.01em !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* 7. Mobilde İl Rehberi Hero: 2 İstatistik + 1 Karşılaştır Butonu Yan Yana (3 Kolon) */
@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main .city-hero,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .city-hero,
    html body .site-main .city-hero {
        padding: 16px 14px 18px !important;
        min-height: 0 !important;
        height: auto !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-content,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .city-hero .hero-content,
    html body .site-main .city-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        gap: 12px !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-left,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .hero-left {
        width: 100% !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .city-kicker {
        margin: 0 auto 8px !important;
        font-size: 0.72rem !important;
        padding: 3px 8px !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        line-height: 1.2 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-title {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        font-size: 1.45rem !important;
        line-height: 1.25 !important;
        margin: 0 0 6px !important;
        text-align: center !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-title svg {
        width: 22px !important;
        height: 22px !important;
        flex-shrink: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-subtitle {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
        color: #94a3b8 !important;
        margin: 0 auto !important;
        max-width: 340px !important;
        text-align: center !important;
    }

    /* 2 İstatistik + 1 Buton: 3 Eşit Kolon */
    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .city-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .hero-stats-grid,
    html body .site-main .city-hero .hero-stats-grid,
    body:is(.mk-cities-main,.mk-product-places) .site-main :where(.city-hero) .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 10px auto 0 !important;
        justify-content: center !important;
        align-items: stretch !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-stat-card,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .hero-stat-card,
    html body .site-main .city-hero .hero-stat-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 8px 4px 6px !important;
        height: auto !important;
        min-height: 64px !important;
        max-height: none !important;
        min-width: 0;
        max-width: none;
        width: 100% !important;
        box-sizing: border-box;
        margin: 0;
        flex: none;
        background: rgba(255, 255, 255, 0.05) !important;
        border: 1px solid rgba(255, 255, 255, 0.08) !important;
        border-radius: 10px !important;
        backdrop-filter: blur(8px);
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-stat-card .stat-icon {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        border-radius: 6px !important;
        background: rgba(56, 189, 248, 0.15) !important;
        color: #38bdf8 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 auto 3px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-stat-card .stat-icon svg {
        width: 14px !important;
        height: 14px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-stat-card .stat-data {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-stat-card .stat-value {
        font-size: 1.05rem !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        color: #ffffff !important;
        margin-bottom: 2px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .hero-stat-card .stat-label {
        font-size: 0.62rem !important;
        font-weight: 600 !important;
        color: #94a3b8 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        letter-spacing: 0.01em !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* 3. Kolondaki Karşılaştır Butonu Çerçevesi */
    html body:not(.mk-shell-backoffice) .site-main .city-hero .city-hero-compare-action,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .city-hero-compare-action,
    html body .site-main .city-hero .city-hero-compare-action {
        grid-column: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        display: flex !important;
        align-items: stretch !important;
        justify-content: stretch !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .city-compare-btn,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .city-compare-btn,
    html body .site-main .city-hero .city-compare-btn {
        width: 100% !important;
        height: 100% !important;
        min-height: 64px !important;
        max-height: none !important;
        padding: 8px 4px 6px !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        background: rgba(255, 255, 255, 0.08) !important;
        border: 1px solid rgba(255, 255, 255, 0.18) !important;
        border-radius: 10px !important;
        color: #ffffff !important;
        text-decoration: none !important;
        backdrop-filter: blur(8px) !important;
        gap: 0 !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .city-compare-btn svg,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .city-compare-btn svg {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 5px !important;
        border-radius: 6px !important;
        background: rgba(56, 189, 248, 0.2) !important;
        color: #38bdf8 !important;
        margin: 0 auto 3px !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .city-hero .city-compare-btn span,
    html body:not(.mk-shell-backoffice) .site-main .mk-cities-main .city-compare-btn span {
        font-size: 0.65rem !important;
        font-weight: 700 !important;
        line-height: 1.1 !important;
        color: #ffffff !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        letter-spacing: 0.01em !important;
        margin-top: 4px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* 8. Mobilde İl Karşılaştır Hero: 2 İstatistik Çerçevesi Yan Yana (2 Kolon) */
@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main .compare-hero,
    html body:not(.mk-shell-backoffice) .site-main .mk-compare-main .compare-hero,
    html body .site-main .compare-hero {
        padding: 16px 14px 18px !important;
        min-height: 0 !important;
        height: auto !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-content,
    html body:not(.mk-shell-backoffice) .site-main .mk-compare-main .compare-hero .hero-content,
    html body .site-main .compare-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
        gap: 12px !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-left,
    html body:not(.mk-shell-backoffice) .site-main .mk-compare-main .hero-left {
        width: 100% !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .compare-kicker-bar {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        flex-wrap: wrap !important;
        margin: 0 auto 8px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .compare-kicker {
        font-size: 0.72rem !important;
        padding: 3px 8px !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        line-height: 1.2 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .compare-back-link {
        font-size: 0.75rem;
        white-space: nowrap;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-title {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        font-size: 1.45rem !important;
        line-height: 1.25 !important;
        margin: 0 0 6px !important;
        text-align: center !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-title svg {
        width: 22px !important;
        height: 22px !important;
        flex-shrink: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-subtitle {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
        color: #94a3b8 !important;
        margin: 0 auto !important;
        max-width: 340px !important;
        text-align: center !important;
    }

    /* 2 İstatistik Çerçevesi: 2 Eşit Kolon */
    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .mk-compare-main .compare-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .mk-compare-main .hero-stats-grid,
    html body .site-main .compare-hero .hero-stats-grid,
    body:is(.mk-compare-main,.mk-product-places) .site-main :where(.compare-hero) .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 10px auto 0 !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-stat-card,
    html body:not(.mk-shell-backoffice) .site-main .mk-compare-main .hero-stat-card,
    html body .site-main .compare-hero .hero-stat-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 8px 6px 6px !important;
        height: auto !important;
        min-height: 64px !important;
        max-height: none !important;
        min-width: 0;
        max-width: none;
        width: 100% !important;
        box-sizing: border-box;
        margin: 0;
        flex: none;
        background: rgba(255, 255, 255, 0.05) !important;
        border: 1px solid rgba(255, 255, 255, 0.08) !important;
        border-radius: 10px !important;
        backdrop-filter: blur(8px);
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-stat-card .stat-icon {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        border-radius: 6px !important;
        background: rgba(56, 189, 248, 0.15) !important;
        color: #38bdf8 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 auto 3px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-stat-card .stat-icon svg {
        width: 14px !important;
        height: 14px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-stat-card .stat-data {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-stat-card .stat-value {
        font-size: 1.05rem !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        color: #ffffff !important;
        margin-bottom: 2px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .compare-hero .hero-stat-card .stat-label {
        font-size: 0.65rem !important;
        font-weight: 600 !important;
        color: #94a3b8 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        letter-spacing: 0.02em !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* 10. Mobilde Kullanıcılar Hero: Toplam Üye Çerçevesini Merkezde Ortala */
@media (max-width: 900px) {
    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero,
    html body .site-main .users-hero {
        display: block !important;
        grid-template-columns: 1fr !important;
        padding: 16px 14px 18px !important;
        min-height: 0 !important;
        height: auto !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero .hero-content,
    html body .site-main .users-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        gap: 12px !important;
        width: 100% !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero .hero-left,
    html body .site-main .users-hero .hero-left {
        width: 100% !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero .hero-title,
    html body .site-main .users-hero .hero-title {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        font-size: 1.45rem !important;
        margin: 0 0 6px !important;
        text-align: center !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero .hero-subtitle,
    html body .site-main .users-hero .hero-subtitle {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
        color: #94a3b8 !important;
        margin: 0 auto !important;
        text-align: center !important;
    }

    /* Toplam Üye İstatistik Çerçevesi: Ortalanmış, Genişliği Dengeli ve Şık */
    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero-stats,
    html body:not(.mk-shell-backoffice) .site-main .users-hero .hero-stats-grid,
    html body .site-main .users-hero .users-hero-stats,
    body :where(.users-page) :where(.users-hero-stats, .hero-stats-grid) {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 10px auto 0 !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
        max-width: 190px !important;
        grid-template-columns: none !important;
        float: none !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero-stats .hero-stat-card,
    html body .site-main .users-hero .users-hero-stats .hero-stat-card,
    body :where(.users-page) :where(.users-hero-stats) .hero-stat-card {
        width: 100% !important;
        min-width: 0;
        max-width: 190px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 8px 12px 6px !important;
        height: auto !important;
        min-height: 64px !important;
        max-height: none !important;
        background: rgba(255, 255, 255, 0.05) !important;
        border: 1px solid rgba(255, 255, 255, 0.08) !important;
        border-radius: 10px !important;
        backdrop-filter: blur(8px);
        box-sizing: border-box;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero-stats .hero-stat-card .stat-icon,
    html body .site-main .users-hero .users-hero-stats .hero-stat-card .stat-icon {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        border-radius: 6px !important;
        background: rgba(56, 189, 248, 0.15) !important;
        color: #38bdf8 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 auto 3px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero-stats .hero-stat-card .stat-icon svg,
    html body .site-main .users-hero .users-hero-stats .hero-stat-card .stat-icon svg {
        width: 14px !important;
        height: 14px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero-stats .hero-stat-card .stat-data,
    html body .site-main .users-hero .users-hero-stats .hero-stat-card .stat-data {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero-stats .hero-stat-card .stat-value,
    html body .site-main .users-hero .users-hero-stats .hero-stat-card .stat-value {
        font-size: 1.15rem !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        color: #ffffff !important;
        margin-bottom: 2px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .users-page .users-hero-stats .hero-stat-card .stat-label,
    html body .site-main .users-hero .users-hero-stats .hero-stat-card .stat-label {
        font-size: 0.65rem !important;
        font-weight: 600 !important;
        color: #94a3b8 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        text-transform: uppercase !important;
        letter-spacing: 0.02em !important;
    }

    /* 11. Mobilde Liderlik Podyum Kartları: Avatar Tam Yuvarlak & Nicklerin Ayrılması Koruması */
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium,
    html body .site-main .leaderboard-podium {
        grid-template-columns: 1fr !important;
        gap: 1.25rem !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card,
    html body .site-main .leaderboard-podium .podium-card {
        padding: 1.85rem 1rem 1.25rem !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-user-link,
    html body .site-main .leaderboard-podium .podium-user-link {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        margin: 0.5rem 0 0.5rem !important;
        gap: 0 !important;
        box-sizing: border-box !important;
        text-decoration: none !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-avatar-wrap,
    html body .site-main .leaderboard-podium .podium-avatar-wrap {
        position: relative;
        display: block;
        width: 68px;
        height: 68px;
        min-width: 68px;
        min-height: 68px;
        max-width: 68px;
        max-height: 68px;
        aspect-ratio: 1 / 1;
        border-radius: 50%;
        margin: 0 auto 12px;
        padding: 0;
        flex-shrink: 0;
        box-sizing: border-box;
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card.podium-gold .podium-avatar-wrap,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-avatar-wrap.gold-ring,
    html body .site-main .leaderboard-podium .podium-avatar-wrap.gold-ring {
        width: 76px;
        height: 76px;
        min-width: 76px;
        min-height: 76px;
        max-width: 76px;
        max-height: 76px;
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card.podium-silver .podium-avatar-wrap,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-avatar-wrap.silver-ring,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card.podium-bronze .podium-avatar-wrap,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-avatar-wrap.bronze-ring {
        width: 68px;
        height: 68px;
        min-width: 68px;
        min-height: 68px;
        max-width: 68px;
        max-height: 68px;
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-avatar,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-avatar-placeholder,
    html body .site-main .leaderboard-podium .podium-avatar,
    html body .site-main .leaderboard-podium .podium-avatar-placeholder {
        width: 100%;
        height: 100%;
        min-width: 100%;
        min-height: 100%;
        max-width: 100%;
        max-height: 100%;
        aspect-ratio: 1 / 1;
        border-radius: 50%;
        object-fit: cover;
        object-position: center;
        display: block;
        box-sizing: border-box;
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-avatar-placeholder {
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    /* Kusursuz Dairesel Çerçeve & Eşit Ring Efekti */
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card.podium-gold .podium-avatar,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card.podium-gold .podium-avatar-placeholder,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .gold-ring .podium-avatar,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .gold-ring .podium-avatar-placeholder {
        border: 3.5px solid #fbbf24;
        box-shadow: 0 0 0 3.5px rgba(251, 191, 36, 0.3);
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card.podium-silver .podium-avatar,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card.podium-silver .podium-avatar-placeholder,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .silver-ring .podium-avatar,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .silver-ring .podium-avatar-placeholder {
        border: 3px solid #94a3b8;
        box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.3);
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card.podium-bronze .podium-avatar,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-card.podium-bronze .podium-avatar-placeholder,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .bronze-ring .podium-avatar,
    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .bronze-ring .podium-avatar-placeholder {
        border: 3px solid #ea580c;
        box-shadow: 0 0 0 3px rgba(234, 88, 12, 0.3);
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .podium-rank-pill,
    html body .site-main .leaderboard-podium .podium-rank-pill {
        position: absolute;
        bottom: -2px;
        right: -2px;
        width: 22px;
        height: 22px;
        min-width: 22px;
        min-height: 22px;
        border-radius: 50%;
        aspect-ratio: 1 / 1;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 11px;
        font-weight: 800;
        line-height: 1;
        border: 2px solid #ffffff;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
        z-index: 2;
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .user-name-line,
    html body .site-main .leaderboard-podium .user-name-line {
        position: static !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        clear: both !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .leaderboard-podium .user-name,
    html body .site-main .leaderboard-podium .user-name {
        display: inline-block !important;
        font-size: 0.98rem !important;
        font-weight: 800 !important;
        line-height: 1.3 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 220px !important;
        text-align: center !important;
    }

    /* 12. Mobilde Favorilerim Hero: 4 İstatistik Çerçevesi 2x2 Yan Yana Grid */
    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero,
    html body .site-main .favorites-hero {
        padding: 16px 14px 18px !important;
        min-height: 0 !important;
        height: auto !important;
        display: block !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero .hero-content,
    html body:not(.mk-shell-backoffice) .site-main .favorites-hero .favorites-hero-content,
    html body .site-main .favorites-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        gap: 12px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero .hero-left,
    html body:not(.mk-shell-backoffice) .site-main .favorites-hero .favorites-hero-copy,
    html body .site-main .favorites-hero .hero-left {
        width: 100% !important;
        max-width: 100% !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero .hero-title,
    html body .site-main .favorites-hero .hero-title {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        font-size: 1.45rem !important;
        margin: 0 0 6px !important;
        text-align: center !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero .hero-subtitle,
    html body .site-main .favorites-hero .hero-subtitle {
        font-size: 0.85rem !important;
        line-height: 1.45 !important;
        color: #94a3b8 !important;
        margin: 0 auto !important;
        max-width: 360px !important;
        text-align: center !important;
    }

    /* 4 İstatistik Çerçevesi: 2x2 Yan Yana Eşit Grid */
    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero-stats,
    html body:not(.mk-shell-backoffice) .site-main .favorites-hero .hero-stats-grid,
    html body:not(.mk-shell-backoffice) .site-main .favorites-hero .favorites-hero-stats,
    html body .site-main .favorites-hero .favorites-hero-stats,
    body:is(.mk-page-favorites) :where(.favorites-hero-stats, .hero-stats-grid) {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-rows: auto auto !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 10px auto 0 !important;
        justify-content: center !important;
        align-items: stretch !important;
        box-sizing: border-box !important;
        float: none !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero-stats .hero-stat-card,
    html body:not(.mk-shell-backoffice) .site-main .favorites-hero .hero-stat-card,
    html body .site-main .favorites-hero .favorites-hero-stats .hero-stat-card,
    body:is(.mk-page-favorites) .favorites-hero .hero-stat-card {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 52px !important;
        max-height: none !important;
        padding: 8px 10px !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        box-sizing: border-box !important;
        background: rgba(255, 255, 255, 0.06) !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-radius: 10px !important;
        backdrop-filter: blur(8px) !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero-stats .stat-icon,
    html body .site-main .favorites-hero .favorites-hero-stats .stat-icon {
        width: 26px !important;
        height: 26px !important;
        min-width: 26px !important;
        min-height: 26px !important;
        flex: 0 0 26px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero-stats .stat-icon svg,
    html body .site-main .favorites-hero .favorites-hero-stats .stat-icon svg {
        width: 18px !important;
        height: 18px !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero-stats .stat-data,
    html body .site-main .favorites-hero .favorites-hero-stats .stat-data {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: center !important;
        text-align: left !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero-stats .stat-value,
    html body .site-main .favorites-hero .favorites-hero-stats .stat-value {
        font-size: 1.15rem !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        color: #ffffff !important;
        margin: 0 !important;
    }

    html body:not(.mk-shell-backoffice) .site-main .favorites-page .favorites-hero-stats .stat-label,
    html body .site-main .favorites-hero .favorites-hero-stats .stat-label {
        font-size: 0.68rem !important;
        font-weight: 600 !important;
        color: #94a3b8 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 100% !important;
        margin-top: 2px !important;
        text-transform: uppercase !important;
        letter-spacing: 0.02em !important;
    }

    /* ═══════════════════════════════════════════════════════════
       Özel Mesajlar (DM) - Mobil Sohbet Mesaj Giriş Barı (Yan Yana)
       ═══════════════════════════════════════════════════════════ */
    html body .messages-container .chat-input-area,
    html body.mk-page-messages .chat-input-area {
        padding: 10px 12px 14px !important;
        background: #ffffff !important;
        border-top: 1px solid #e2e8f0 !important;
        box-sizing: border-box !important;
    }

    html body .messages-container .chat-input-area form,
    html body.mk-page-messages .chat-input-area form,
    html body #messageForm {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: flex-end !important;
        gap: 8px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    html body .messages-container #messageInput,
    html body.mk-page-messages #messageInput,
    html body #messageForm textarea#messageInput {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        min-height: 44px !important;
        max-height: 120px !important;
        padding: 10px 14px !important;
        border: 1.5px solid #cbd5e1 !important;
        border-radius: 12px !important;
        background: #f8fafc !important;
        color: #0f172a !important;
        font-size: 0.92rem !important;
        line-height: 1.4 !important;
        box-sizing: border-box !important;
        resize: none !important;
        box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04) !important;
        transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
    }

    html body .messages-container #messageInput:focus,
    html body.mk-page-messages #messageInput:focus,
    html body #messageForm textarea#messageInput:focus {
        border-color: #b91c1c !important;
        background: #ffffff !important;
        box-shadow: 0 0 0 3px rgba(185, 28, 28, 0.12) !important;
        outline: none !important;
    }

    html body .messages-container .btn-send,
    html body.mk-page-messages .btn-send,
    html body #messageForm button.btn-send {
        flex: 0 0 44px !important;
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
        padding: 0 !important;
        margin: 0 !important;
        border-radius: 12px !important;
        background: linear-gradient(135deg, #b91c1c 0%, #991b1b 100%) !important;
        border: none !important;
        color: #ffffff !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0 !important;
        cursor: pointer !important;
        box-shadow: 0 4px 12px rgba(185, 28, 28, 0.25) !important;
        transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
    }

    html body .messages-container .btn-send:hover,
    html body.mk-page-messages .btn-send:hover,
    html body #messageForm button.btn-send:hover {
        background: linear-gradient(135deg, #991b1b 0%, #7f1d1d 100%) !important;
        box-shadow: 0 6px 16px rgba(185, 28, 28, 0.35) !important;
        transform: translateY(-1px) !important;
    }

    html body .messages-container .btn-send:active,
    html body.mk-page-messages .btn-send:active,
    html body #messageForm button.btn-send:active {
        transform: scale(0.96) !important;
        box-shadow: 0 2px 6px rgba(185, 28, 28, 0.2) !important;
    }

    html body .messages-container .btn-send svg,
    html body.mk-page-messages .btn-send svg,
    html body #messageForm button.btn-send svg {
        width: 20px !important;
        height: 20px !important;
        stroke: #ffffff !important;
        margin: 0 !important;
        display: block !important;
    }
}

/* ==========================================================================
   DOKÜMANLAR & BECAYİŞ HERO MOBİL İSTATİSTİK DÜZENLEMELERİ
   ========================================================================== */

/* Masaüstünde becayiş kısa metni gizle */
html body .becayis-hero .hstat .stat-mobile-text {
    display: none;
}

@media (max-width: 900px) {
    /* ── Dokümanlar Hero İstatistik Çerçevelerini Eşitleme (50% - 50%) ── */
    html body.mk-page-documents .documents-hero .hero-content,
    html body .documents-page-container .documents-hero .hero-content {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.85rem !important;
    }

    html body.mk-page-documents .documents-hero-right,
    html body .documents-page-container .documents-hero-right {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 0.65rem !important;
        margin-left: 0 !important;
    }

    html body.mk-page-documents .documents-hero .hero-stats-grid,
    html body .documents-page-container .documents-hero .hero-stats-grid,
    html body.mk-page-documents .site-main .documents-hero .hero-stats-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.5rem !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    html body.mk-page-documents .documents-hero .hero-stat-card,
    html body .documents-page-container .documents-hero .hero-stat-card,
    html body.mk-page-documents .site-main .documents-hero .hero-stat-card {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100%;
        flex: 1 1 0;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 0.45rem !important;
        padding: 0.5rem 0.5rem !important;
        min-height: 48px !important;
        height: auto;
        box-sizing: border-box;
    }

    html body.mk-page-documents .documents-hero .stat-icon,
    html body .documents-page-container .documents-hero .stat-icon {
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    html body.mk-page-documents .documents-hero .stat-icon svg,
    html body .documents-page-container .documents-hero .stat-icon svg {
        width: 18px !important;
        height: 18px !important;
    }

    html body.mk-page-documents .documents-hero .stat-data,
    html body .documents-page-container .documents-hero .stat-data {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    html body.mk-page-documents .documents-hero .stat-value,
    html body .documents-page-container .documents-hero .stat-value {
        font-size: 1rem !important;
        line-height: 1.2 !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
    }

    html body.mk-page-documents .documents-hero .stat-label,
    html body .documents-page-container .documents-hero .stat-label {
        font-size: 0.58rem !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        text-transform: uppercase !important;
        letter-spacing: -0.01em !important;
    }

    html body.mk-page-documents .documents-hero :where(.documents-hero-actions, .hero-actions),
    html body .documents-page-container .documents-hero :where(.documents-hero-actions, .hero-actions) {
        width: 100% !important;
        margin-left: 0;
    }

    html body.mk-page-documents .documents-hero .btn-upload,
    html body .documents-page-container .documents-hero .btn-upload {
        width: 100% !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    /* ── Becayiş Hero: "Gerçekleşen" Kısaltma ve Çerçeveleri Eşitleme ── */
    html body.mk-page-becayis .becayis-hero .hstat .stat-desktop-text,
    html body .becayis-wrap .becayis-hero .hstat .stat-desktop-text {
        display: none;
    }

    html body.mk-page-becayis .becayis-hero .hstat .stat-mobile-text,
    html body .becayis-wrap .becayis-hero .hstat .stat-mobile-text {
        display: inline !important;
    }

    html body.mk-page-becayis .site-main .becayis-hero-right > .hero-stats,
    html body.mk-page-becayis .becayis-hero .hero-stats,
    html body .becayis-wrap .becayis-hero .hero-stats,
    html body.mk-page-becayis .hero-right .hero-stats {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.5rem !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 !important;
    }

    html body.mk-page-becayis .site-main .becayis-hero-right > .hero-stats > .hstat,
    html body.mk-page-becayis .becayis-hero .hstat,
    html body .becayis-wrap .becayis-hero .hstat,
    html body.mk-page-becayis .hero-right .hstat {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100%;
        flex: 1 1 0;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 0.45rem !important;
        padding: 0.55rem 0.5rem !important;
        min-height: 44px !important;
        height: auto !important;
        max-height: none !important;
    }

    html body.mk-page-becayis .becayis-hero .hstat strong,
    html body .becayis-wrap .becayis-hero .hstat strong {
        font-size: 1.05rem !important;
        line-height: 1 !important;
        flex: 0 0 auto !important;
    }

    html body.mk-page-becayis .becayis-hero .hstat span,
    html body .becayis-wrap .becayis-hero .hstat span {
        font-size: 0.72rem !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        text-transform: uppercase !important;
        letter-spacing: 0.02em !important;
    }

    html body.mk-page-becayis .site-main .becayis-hero-right > .becayis-hero-actions,
    html body.mk-page-becayis .becayis-hero-actions,
    html body .becayis-wrap .becayis-hero-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.5rem !important;
        width: 100% !important;
        margin-top: 0.5rem !important;
        box-sizing: border-box !important;
    }

    html body.mk-page-becayis .becayis-hero-actions .btn-hero,
    html body .becayis-wrap .becayis-hero-actions .btn-hero {
        width: 100% !important;
        justify-content: center;
        box-sizing: border-box;
    }

    /* ── Anasayfa: Son Dokümanlar İndirme İkonu Tarihin Yanında ── */
    html body.mk-page-home .homepage-container .document-card,
    html body .homepage-container .document-card {
        display: grid !important;
        grid-template-columns: 2.2rem minmax(0, 1fr) !important;
        grid-template-areas: "icon info" !important;
        align-items: center !important;
        gap: 0.55rem !important;
        padding: 0.75rem 0.65rem !important;
    }

    html body.mk-page-home .homepage-container .document-card .doc-icon-badge,
    html body .homepage-container .document-card .doc-icon-badge {
        grid-area: icon;
        width: 2.2rem;
        height: 2.2rem !important;
    }

    html body.mk-page-home .homepage-container .document-card .doc-info,
    html body .homepage-container .document-card .doc-info {
        grid-area: info !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 0.25rem !important;
        min-width: 0 !important;
    }

    html body.mk-page-home .homepage-container .document-card .doc-meta,
    html body .homepage-container .document-card .doc-meta {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 0.2rem 0.3rem !important;
        font-size: 0.70rem !important;
        color: var(--text-secondary, #64748b) !important;
        line-height: 1.25 !important;
    }

    html body.mk-page-home .homepage-container .document-card .doc-meta > * {
        white-space: nowrap !important;
    }

    html body.mk-page-home .homepage-container .document-card .doc-downloads,
    html body .homepage-container .document-card .doc-downloads {
        grid-area: auto !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 0.2rem !important;
        padding: 0.1rem 0.4rem !important;
        min-height: 18px !important;
        height: auto !important;
        border-radius: 4px !important;
        background: rgba(245, 158, 11, 0.12) !important;
        border: 1px solid rgba(245, 158, 11, 0.22) !important;
        color: #b45309 !important;
        font-size: 0.72rem !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        box-shadow: none !important;
        vertical-align: middle !important;
    }

    html body.mk-page-home .homepage-container .document-card .download-icon,
    html body .homepage-container .document-card .download-icon {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 0.75rem !important;
        color: #b45309 !important;
    }

    html body.mk-page-home .homepage-container .document-card .download-icon svg,
    html body .homepage-container .document-card .download-icon svg {
        width: 12px !important;
        height: 12px !important;
        stroke: currentColor;
    }

    /* ── Anasayfa: Platform İstatistikleri 2x2 Grid (2 yan yana, 2 alt satırda) ── */
    html body.mk-page-home .platform-stats .platform-grid,
    html body .homepage-container .platform-stats .platform-grid,
    .homepage-container .platform-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.6rem;
        width: 100%;
        box-sizing: border-box;
    }

    html body.mk-page-home .platform-stats .platform-item,
    html body .homepage-container .platform-stats .platform-item,
    .homepage-container .platform-item {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
        padding: 0.65rem 0.6rem;
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-areas:
            "icon value"
            "label label";
        gap: 0.35rem 0.45rem;
        background: #ffffff;
        border-radius: 12px;
        border: 1px solid var(--border-light, #e2e8f0) !important;
    }

    html body.mk-page-home .platform-stats .platform-item .platform-value,
    html body .homepage-container .platform-stats .platform-item .platform-value,
    .homepage-container .platform-item .platform-value {
        font-size: 1.05rem;
        font-weight: 800;
        line-height: 1.2;
        white-space: nowrap;
        color: var(--text-primary, #0f172a);
    }

    html body.mk-page-home .platform-stats .platform-item .platform-label,
    html body .homepage-container .platform-stats .platform-item .platform-label,
    .homepage-container .platform-item .platform-label {
        font-size: 0.72rem;
        line-height: 1.2;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        color: var(--text-secondary, #64748b);
    }

    html body.mk-page-home .platform-stats .platform-item .platform-icon,
    html body .homepage-container .platform-stats .platform-item .platform-icon,
    .homepage-container .platform-item .platform-icon {
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
    }
}