/* Extracted from index.php without visual changes. */
.desc-more {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin-left: .35rem;
            padding: .14rem .52rem;
            border: 1px solid rgba(255,255,255,.16);
            border-radius: 999px;
            color: #f8fafc;
            background: rgba(255,255,255,.09);
            font: inherit;
            font-size: .86em;
            font-weight: 800;
            cursor: pointer;
            transition: transform .15s ease, background .15s ease, border-color .15s ease;
        }

        .desc-more:hover,
        .desc-more:focus-visible {
            transform: translateY(-1px);
            border-color: rgba(255,255,255,.28);
            background: rgba(255,255,255,.15);
            outline: none;
        }

        .game-detail-link {
            color: inherit;
            text-decoration: none;
        }

        .game-detail-link:hover,
        .game-detail-link:focus-visible {
            color: #9bdcff;
            text-decoration: underline;
            text-underline-offset: .18em;
        }

        .translation-note {
            margin: -4px 0 12px;
            color: rgba(255,255,255,.48);
            font-size: .72rem;
            font-weight: 700;
        }

        .desc-missing {
            color: rgba(255,255,255,.58) !important;
            font-style: italic;
        }

        .card-verification {
            margin: -2px 0 12px;
            color: rgba(255,255,255,.48);
            font-size: .72rem;
            line-height: 1.45;
        }

        .desc-modal[hidden] {
            display: none;
        }

        .desc-modal {
            position: fixed;
            inset: 0;
            z-index: 100000;
            display: grid;
            place-items: center;
            padding: 20px;
        }

        .desc-modal-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(0,0,0,.68);
            backdrop-filter: blur(10px);
        }

        .desc-modal-card {
            position: relative;
            width: min(880px, 100%);
            max-height: min(86vh, 900px);
            overflow: auto;
            overscroll-behavior: contain;
            touch-action: pan-y;
            padding: 24px;
            border-radius: 26px;
            border: 1px solid rgba(255,255,255,.16);
            background: radial-gradient(circle at 20% 0%, rgba(255,255,255,.10), transparent 35%), rgba(10,12,20,.96);
            box-shadow: 0 30px 90px rgba(0,0,0,.55);
        }

        .desc-modal-card h2 {
            margin: 0 44px 12px 0;
            font-size: clamp(1.35rem, 3vw, 2rem);
        }

        .desc-modal-title-link {
            color: inherit;
            text-decoration: none;
            text-underline-offset: .18em;
        }

        .desc-modal-title-link:hover,
        .desc-modal-title-link:focus-visible {
            color: #8bdcff;
            text-decoration: underline;
        }

        .desc-modal-card p {
            margin: 0;
            line-height: 1.7;
            color: rgba(255,255,255,.86);
        }

        .desc-modal-claim-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin: 18px 0 0;
        }

        .desc-modal-claim {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 46px;
            padding: 12px 18px;
            border: 1px solid rgba(255,255,255,.12);
            border-radius: 14px;
            color: #07110c;
            background: linear-gradient(135deg, var(--accent), var(--accent-2));
            box-shadow: 0 14px 34px rgba(120,255,176,.14);
            font-weight: 950;
            text-decoration: none;
            transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
        }

        .desc-modal-claim:hover,
        .desc-modal-claim:focus-visible {
            transform: translateY(-1px);
            filter: brightness(1.04);
            box-shadow: 0 18px 42px rgba(120,255,176,.2);
            outline: none;
        }

        .desc-modal-facts {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin: 0 0 18px;
        }

        .desc-modal-fact {
            display: inline-flex;
            align-items: center;
            min-height: 34px;
            padding: 6px 11px;
            border: 1px solid rgba(255,255,255,.13);
            border-radius: 999px;
            color: rgba(255,255,255,.9);
            background: rgba(255,255,255,.08);
            font-size: .9rem;
            font-weight: 750;
        }

        .desc-modal-fact.is-score {
            color: #07120e;
            border-color: rgba(105,240,174,.7);
            background: #69f0ae;
        }


        .desc-modal-fact-icon {
            display: inline-block;
            margin-right: 7px;
            line-height: 1;
        }

        .desc-modal-fact.is-genre,
        .desc-modal-genre-chip {
            gap: 7px;
            color: rgba(255,255,255,.94);
            border-color: rgba(125,211,252,.24);
            background: linear-gradient(135deg, rgba(125,211,252,.16), rgba(120,255,176,.08));
        }

        .desc-modal-genres {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .desc-modal-genre-chip {
            display: inline-flex;
            align-items: center;
            min-height: 32px;
            padding: 5px 10px 5px 7px;
            border: 1px solid rgba(255,255,255,.13);
            border-radius: 999px;
            font-size: .86rem;
            font-weight: 800;
        }

        .genre-sprite {
            position: relative;
            display: inline-grid;
            place-items: center;
            width: 18px;
            height: 18px;
            flex: 0 0 18px;
            border-radius: 6px;
            box-shadow: inset 0 0 0 1px rgba(255,255,255,.2), 0 3px 8px rgba(0,0,0,.24);
            overflow: hidden;
        }

        .genre-sprite::before {
            content: "";
            width: 9px;
            height: 9px;
            background: rgba(255,255,255,.94);
        }

        .genre-action { background: linear-gradient(135deg,#ff4d6d,#ff9f1c); }
        .genre-action::before { clip-path: polygon(48% 0,60% 36%,100% 36%,66% 56%,78% 100%,48% 72%,18% 100%,30% 56%,0 36%,38% 36%); }
        .genre-adventure { background: linear-gradient(135deg,#38bdf8,#22c55e); }
        .genre-adventure::before { clip-path: polygon(50% 0,100% 100%,50% 72%,0 100%); }
        .genre-indie { background: linear-gradient(135deg,#a78bfa,#f472b6); }
        .genre-indie::before { border-radius: 3px; transform: rotate(45deg); }
        .genre-strategy { background: linear-gradient(135deg,#facc15,#fb923c); }
        .genre-strategy::before { clip-path: polygon(50% 0,100% 30%,82% 100%,18% 100%,0 30%); }
        .genre-sim { background: linear-gradient(135deg,#60a5fa,#14b8a6); }
        .genre-sim::before { width: 5px; height: 5px; border-radius: 2px; box-shadow: 6px 0 0 rgba(255,255,255,.9), 0 6px 0 rgba(255,255,255,.9), 6px 6px 0 rgba(255,255,255,.9); }
        .genre-rpg { background: linear-gradient(135deg,#c084fc,#818cf8); }
        .genre-rpg::before { clip-path: polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%); }
        .genre-racing { background: linear-gradient(135deg,#f97316,#ef4444); }
        .genre-racing::before { width: 12px; height: 7px; border-radius: 6px 6px 3px 3px; }
        .genre-sport { background: linear-gradient(135deg,#4ade80,#16a34a); }
        .genre-sport::before { border-radius: 50%; }
        .genre-puzzle { background: linear-gradient(135deg,#f0abfc,#38bdf8); }
        .genre-puzzle::before { clip-path: polygon(0 0,44% 0,44% 28%,72% 28%,72% 56%,100% 56%,100% 100%,0 100%); }
        .genre-generic { background: linear-gradient(135deg,#94a3b8,#64748b); }
        .genre-generic::before { border-radius: 50%; }
        .desc-modal-extra {
            margin-top: 24px;
        }

        .desc-modal-section {
            margin-top: 24px;
            padding-top: 20px;
            border-top: 1px solid rgba(255,255,255,.11);
        }

        .desc-modal-section h3 {
            margin: 0 0 12px;
            color: #fff;
            font-size: 1.05rem;
        }

        .desc-modal-languages {
            display: flex;
            flex-wrap: wrap;
            gap: 7px;
        }

        .desc-modal-languages span {
            padding: 5px 9px;
            border-radius: 9px;
            color: rgba(255,255,255,.82);
            background: rgba(255,255,255,.075);
            font-size: .85rem;
        }

        .desc-modal-languages span.has-full-audio {
            color: #07130d;
            background: #78ffb0;
            font-weight: 850;
        }

        .desc-modal-score a {
            color: #7dd3fc;
            font-weight: 750;
        }

        .desc-modal-screenshots {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
        }

        .desc-modal-screenshots a {
            display: block;
            overflow: hidden;
            border-radius: 13px;
            background: rgba(255,255,255,.06);
        }

        .desc-modal-screenshots img {
            display: block;
            width: 100%;
            aspect-ratio: 16 / 9;
            object-fit: cover;
            transition: transform .2s ease, filter .2s ease;
        }

        .desc-modal-screenshots a:hover img,
        .desc-modal-screenshots a:focus-visible img {
            transform: scale(1.025);
            filter: brightness(1.08);
        }

        .desc-modal-loading,
        .desc-modal-note,
        .desc-modal-source {
            color: rgba(255,255,255,.55) !important;
            font-size: .86rem;
        }

        .desc-modal-source {
            margin-top: 18px !important;
            text-align: right;
        }

        .desc-modal-trust {
            display: grid;
            gap: 6px;
            margin-top: 20px;
            padding: 14px;
            border: 1px solid rgba(255,255,255,.1);
            border-radius: 14px;
            background: rgba(255,255,255,.045);
            color: rgba(255,255,255,.66);
            font-size: .82rem;
        }

        .desc-modal-close {
            position: sticky;
            top: 0;
            z-index: 3;
            float: right;
            margin: -8px -8px 0 12px;
            width: 36px;
            height: 36px;
            border: 1px solid rgba(255,255,255,.14);
            border-radius: 999px;
            color: #fff;
            background: rgba(255,255,255,.10);
            font-size: 1.25rem;
            line-height: 1;
            cursor: pointer;
        }

        .desc-modal-close:hover,
        .desc-modal-close:focus-visible {
            background: rgba(255,255,255,.18);
            outline: none;
        }

        @media (max-width: 620px) {
            .desc-modal {
                align-items: end;
                padding: 0;
            }

            .desc-modal-card {
                width: 100%;
                max-height: 94dvh;
                padding: 18px 16px 24px;
                border-right: 0;
                border-bottom: 0;
                border-left: 0;
                border-radius: 20px 20px 0 0;
            }

            .desc-modal-screenshots {
                display: flex;
                overflow-x: auto;
                scroll-snap-type: x mandatory;
                overscroll-behavior-inline: contain;
                padding-bottom: 8px;
            }

            .desc-modal-screenshots a {
                flex: 0 0 88%;
                scroll-snap-align: center;
            }

            .desc-modal-close {
                width: 42px;
                height: 42px;
                margin: -6px -4px 0 10px;
                background: rgba(20,24,34,.96);
            }

            .desc-modal-fact {
                min-height: 32px;
                padding: 5px 9px;
                font-size: .8rem;
            }
        }

.legal-footer {
            margin-top: 3rem;
            padding: 2rem 0 2.5rem;
            border-top: 1px solid rgba(255, 255, 255, 0.12);
            color: rgba(255, 255, 255, 0.72);
        }

        .legal-footer-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 1.25rem;
        }

        .legal-footer h2,
        .legal-footer h3 {
            margin: 0 0 0.55rem;
            color: rgba(255, 255, 255, 0.94);
            line-height: 1.15;
        }

        .legal-footer p {
            margin: 0 0 0.7rem;
            font-size: 0.92rem;
            line-height: 1.55;
        }

        .legal-footer ul {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .legal-footer li {
            margin: 0 0 0.42rem;
            font-size: 0.92rem;
            line-height: 1.45;
        }

        .legal-footer a {
            color: inherit;
            text-decoration: underline;
            text-underline-offset: 0.18em;
        }

        .legal-footer-bottom {
            margin-top: 1.45rem;
            padding-top: 1rem;
            border-top: 1px solid rgba(255, 255, 255, 0.09);
            font-size: 0.84rem;
        }

        @media (max-width: 820px) {
            .legal-footer-grid {
                grid-template-columns: 1fr;
            }
        }

.back-to-top[hidden] {
            display: none !important;
        }
        .back-to-top {
            position: fixed;
            right: max(18px, env(safe-area-inset-right));
            bottom: max(18px, env(safe-area-inset-bottom));
            z-index: 130;
            display: inline-grid;
            place-items: center;
            width: 48px;
            height: 48px;
            border: 1px solid rgba(255,255,255,.16);
            border-radius: 999px;
            color: #07110c;
            background: linear-gradient(135deg, var(--accent), var(--accent-2));
            box-shadow: 0 18px 44px rgba(0,0,0,.34);
            text-decoration: none;
            font-size: 1.35rem;
            font-weight: 950;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transform: translate3d(0, 18px, 0) scale(.72) rotate(-8deg);
            transform-origin: 50% 50%;
            transition: transform .22s cubic-bezier(.2, 1.45, .32, 1), opacity .18s ease, visibility 0s linear .22s, box-shadow .16s ease;
        }
        .back-to-top::before {
            content: "\2191";
            line-height: 1;
        }
        .back-to-top.is-visible {
            opacity: .62;
            visibility: visible;
            pointer-events: auto;
            transform: translate3d(0, 0, 0) scale(1) rotate(0deg);
            transition-delay: 0s;
            animation: swetchBackTopPlop .48s cubic-bezier(.18, 1.6, .36, 1) both;
        }
        .back-to-top.is-visible:hover,
        .back-to-top.is-visible:focus-visible {
            opacity: .88;
            transform: translate3d(0, -2px, 0) scale(1.04);
            box-shadow: 0 22px 54px rgba(0,0,0,.42);
            outline: none;
        }
        @keyframes swetchBackTopPlop {
            0% { opacity: 0; transform: translate3d(0, 20px, 0) scale(.56) rotate(-10deg); }
            62% { opacity: .78; transform: translate3d(0, -4px, 0) scale(1.12) rotate(3deg); }
            100% { opacity: .62; transform: translate3d(0, 0, 0) scale(1) rotate(0deg); }
        }
        @media (prefers-reduced-motion: reduce) {
            .back-to-top,
            .back-to-top.is-visible {
                animation: none;
                transition: opacity .12s ease, visibility 0s linear .12s;
                transform: none;
            }
        }
        @media (max-width: 760px) {
            .back-to-top {
                right: max(12px, env(safe-area-inset-right));
                bottom: max(12px, env(safe-area-inset-bottom));
                width: 44px;
                height: 44px;
                font-size: 1.2rem;
            }
        }