/* GTA 6 facelift: loaded after the compiled application stylesheet. */
html {
    --bg: #0c0810;
    --surface: #161019;
    --surface-raised: #211624;
    --line: #3a293d;
    --text: #fff8fc;
    --muted: #bbaabd;
    --focus: #5de1d1;
    color-scheme: dark;
}

html[data-theme="default"],
html[data-theme="gta-6"],
html[data-theme="leonida"] {
    --accent: #ff4f9a;
    --accent2: #ff9364;
    --focus: #55dfd0;
}

* { scrollbar-color: color-mix(in srgb, var(--accent) 62%, #6f5a71) #120d15; }
::selection { background: var(--accent); color: #170811; }

body {
    background-color: var(--bg);
    background-image:
        linear-gradient(180deg, rgba(255, 79, 154, .075), transparent 260px),
        linear-gradient(90deg, rgba(85, 223, 208, .025) 1px, transparent 1px);
    background-size: auto, 96px 96px;
    color: var(--text);
}

body::before {
    content: "";
    position: fixed;
    z-index: 100;
    inset: 0 0 auto;
    height: 3px;
    pointer-events: none;
    background: linear-gradient(90deg, var(--accent), var(--accent2) 62%, var(--focus));
}

h1, h2, h3, h4,
.brand, .portal-brand,
.hero h1, .section-hero h1, .news-article h1, .gallery-detail h1,
.mods-head h1, .mod-detail h1, .kb-head h1, .kb-game-head h1,
.article-header h1, .profile-hero h1, .content-shell h1 {
    letter-spacing: 0 !important;
}

.site-header {
    min-height: 74px;
    height: auto;
    border-bottom-color: color-mix(in srgb, var(--accent) 28%, var(--line));
    background: rgba(12, 8, 16, .92);
    box-shadow: 0 14px 44px rgba(4, 2, 7, .34);
    backdrop-filter: blur(20px) saturate(135%);
}

.portal-brand b { font-size: 21px; }
.portal-brand b span { color: var(--accent); }
.portal-brand small { color: var(--muted); }
.portal-brand::after {
    content: "LEONIDA EDITION";
    align-self: center;
    margin-left: 9px;
    padding: 4px 7px;
    border: 1px solid color-mix(in srgb, var(--accent2) 58%, var(--line));
    border-radius: 4px;
    color: var(--accent2);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
}

.main-nav { gap: 6px; }
.main-nav > a,
.main-nav > details > summary {
    min-height: 38px;
    padding: 0 11px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
}
.main-nav > a:hover,
.main-nav > details > summary:hover,
.main-nav > details[open] > summary {
    background: color-mix(in srgb, var(--accent) 11%, transparent);
    color: var(--text);
}

.header-search {
    border-color: var(--line);
    border-radius: 7px;
    background: rgba(255, 255, 255, .035);
}
.header-search:focus-within {
    border-color: var(--focus);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 14%, transparent);
}

.mega-panel,
.user-dropdown nav {
    border-color: color-mix(in srgb, var(--accent) 34%, var(--line));
    border-radius: 8px;
    background: rgba(17, 11, 21, .98);
    box-shadow: 0 28px 70px rgba(3, 1, 5, .62);
}

.button {
    min-height: 42px;
    border-color: var(--accent);
    border-radius: 6px;
    background: var(--accent);
    color: #190910;
    box-shadow: 0 8px 24px color-mix(in srgb, var(--accent) 18%, transparent);
    letter-spacing: .04em;
    transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.button:hover {
    filter: none;
    transform: translateY(-2px);
    background: var(--accent2);
    border-color: var(--accent2);
    box-shadow: 0 12px 30px color-mix(in srgb, var(--accent2) 22%, transparent);
}
.button.ghost {
    background: color-mix(in srgb, var(--surface-raised) 74%, transparent);
    border-color: var(--line);
    color: var(--text);
    box-shadow: none;
}
.button.ghost:hover { border-color: var(--accent); color: var(--accent); }

input, textarea, select {
    min-height: 44px;
    border-color: var(--line);
    border-radius: 6px;
    background: #100b13;
    color: var(--text);
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
input:focus, textarea:focus, select:focus {
    border-color: var(--focus);
    background: #151018;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 13%, transparent);
    outline: none;
}

.eyebrow,
.article-category,
.album-card span,
.game-index {
    color: var(--accent2);
    letter-spacing: .08em;
}

.hero,
.section-hero,
.mods-head,
.kb-head,
.kb-game-head,
.article-shell,
.news-article,
.gallery-detail {
    position: relative;
}
.hero h1 { max-width: 880px; font-size: clamp(54px, 7vw, 96px); line-height: .94; }
.section-hero h1,
.news-article h1,
.gallery-detail h1 { font-size: clamp(46px, 6vw, 76px); line-height: 1; }
.mods-head h1 { font-size: clamp(34px, 4vw, 54px) !important; }

.panel,
.mod-card,
.album-card,
.game-card,
.home-articles article,
.home-card,
.notification-list > a,
.private-message,
.inline-image-uploader,
.gtamods-grid article,
.gtamods-import-progress {
    border-color: var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface) 94%, #231326);
    box-shadow: 0 14px 34px rgba(4, 2, 7, .2);
}

.mod-card,
.album-card,
.game-card,
.home-card,
.home-articles article {
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.mod-card:hover,
.album-card:hover,
.game-card:hover,
.home-card:hover,
.home-articles article:hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--accent) 62%, var(--line));
    box-shadow: 0 20px 46px rgba(4, 2, 7, .38);
}

.mod-card-image,
.album-card > img,
.home-card-image,
.news-cover img {
    overflow: hidden;
    background: #100b13;
}
.mod-card-image img,
.album-card > img,
.home-card-image img,
.news-cover img {
    transition: transform .35s ease, filter .35s ease;
}
.mod-card:hover img,
.album-card:hover > img,
.home-card:hover img,
.news-grid article:hover .news-cover img {
    transform: scale(1.025);
    filter: saturate(1.08) contrast(1.03);
}

.mod-tags a,
.mod-tags span,
.brand-strip a,
.gallery-game-filter a,
.game-pills button {
    border-radius: 5px;
    background: color-mix(in srgb, var(--surface-raised) 82%, transparent);
}
.brand-strip a.active,
.gallery-game-filter a.active,
.game-pills button:hover {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 13%, var(--surface));
    color: var(--text);
}

.news-grid article {
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: color-mix(in srgb, var(--surface) 86%, transparent);
    transition: transform .2s ease, border-color .2s ease;
}
.news-grid article:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); }
.news-grid h2 { font-size: 23px; line-height: 1.2; }
.news-byline { border-color: var(--line); }

.wiki-content,
.news-body,
.mod-content > article {
    color: #e6dce6;
}
.wiki-content a,
.news-body a,
.mod-content > article a { color: var(--focus); text-decoration-color: color-mix(in srgb, var(--focus) 45%, transparent); }
.wiki-content blockquote,
.news-body blockquote {
    margin-inline: 0;
    padding: 18px 22px;
    border-left: 3px solid var(--accent2);
    border-radius: 0 7px 7px 0;
    background: color-mix(in srgb, var(--accent2) 8%, var(--surface));
}

.wiki-meta,
.download-box { border-color: var(--accent2); }
.notice,
.flash {
    border-color: color-mix(in srgb, var(--accent) 55%, var(--line));
    border-radius: 7px;
    background: color-mix(in srgb, var(--accent) 11%, #130d16);
}

.site-footer {
    border-top-color: color-mix(in srgb, var(--accent) 25%, var(--line));
    background: #09060c;
}
.site-footer > span:first-child { color: var(--accent2); }

@media (max-width: 1000px) {
    .site-header { gap: 14px; }
    .portal-brand::after { display: none; }
    .news-grid { gap: 16px; }
}

@media (max-width: 700px) {
    body { background-size: auto, 64px 64px; }
    .site-header { min-height: 64px; padding-inline: 16px; }
    .hero h1 { font-size: 48px; }
    .section-hero h1,
    .news-article h1,
    .gallery-detail h1 { font-size: 42px; }
    .section-hero,
    .mods-head,
    .kb-head,
    .kb-game-head,
    .article-shell,
    .news-article,
    .gallery-detail { padding-inline: 20px; }
    .news-grid article { grid-template-columns: 1fr; }
    .button { min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}