/*
 * Gedian Sports - Index consolidated stylesheet
 * Mobile-first rebuild, 2026-08-23
 * Replaces on Index.cshtml:
 *   gedian-home.css
 *   gedian-home-voting.css
 *   gedian-home-posts.css
 *   gedian-home-redesign.css
 *
 * The global site.css remains for _Layout/global navbar.
 */

/* =========================================================
   GEDIAN SPORTS - HOME PAGE DESIGN SYSTEM
   Arabic RTL / Responsive / No external UI framework required
   ========================================================= */

:root {
    --gs-green: #5B8C3B;
    --gs-green-dark: #365728;
    --gs-green-soft: #edf5e8;
    --gs-black: #070807;
    --gs-black-2: #101311;
    --gs-text: #172017;
    --gs-muted: #6d756f;
    --gs-line: #e4e9e3;
    --gs-bg: #f5f7f4;
    --gs-card: #ffffff;
    --gs-danger: #d94747;
    --gs-warning: #e5a52e;
    --gs-shadow: 0 6px 20px rgba(20, 32, 22, .06);
    --gs-radius: 18px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--gs-bg);
    color: var(--gs-text);
    font-family: "Tajawal", "Segoe UI", Tahoma, Arial, sans-serif;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input {
    font: inherit;
}

button {
    cursor: pointer;
}

.gs-page {
    min-height: 100vh;
    padding-bottom: 40px;
}


/* =========================================================
   COMPACT SCORE TICKER
   ========================================================= */

.gs-score-ticker {
    direction: ltr;
    overflow: hidden;
    background: #111411;
    border-top: 1px solid #181c19;
    border-bottom: 1px solid #262a27;
    height: 82px;
    display: flex;
    align-items: stretch;
}

.gs-score-track {
    display: flex;
    width: max-content;
    animation: gsTicker 48s linear infinite;
    will-change: transform;
}

.gs-score-ticker:hover .gs-score-track {
    animation-play-state: paused;
}

@keyframes gsTicker {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

.gs-score-mini {
    direction: rtl;
    width: 275px;
    flex: 0 0 275px;
    padding: 10px 15px;
    border-left: 1px solid #2b312b;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
}

.gs-score-league {
    font-size: 11px;
    font-weight: 700;
    color: #cdd2cd;
    text-align: center;
}

.gs-score-line {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
    align-items: center;
    gap: 8px;
}

    .gs-score-line > strong {
        font-size: 18px;
        white-space: nowrap;
    }

        .gs-score-line > strong.is-live {
            color: #8dca67;
        }

.gs-mini-team {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

    .gs-mini-team img {
        width: 25px;
        height: 25px;
        border-radius: 50%;
        object-fit: contain;
        background: #fff;
        padding: 2px;
    }

    .gs-mini-team span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 12px;
        font-weight: 700;
    }

/* =========================================================
   GEDIAN FAMOUS
   ========================================================= */

.gs-famous-bar {
    max-width: 1600px;
    margin: 18px auto 0;
    min-height: 86px;
    background: #fff;
    border: 1px solid var(--gs-line);
    border-radius: 17px;
    box-shadow: var(--gs-shadow);
    display: grid;
    grid-template-columns: 190px 1fr 50px;
    align-items: stretch;
    overflow: hidden;
}

.gs-famous-title {
    display: flex;
    align-items: center;
    justify-content: center;
    border-left: 1px solid var(--gs-line);
    font-size: 22px;
    font-weight: 900;
    color: #1d2b1e;
}

.gs-famous-stage {
    position: relative;
    min-height: 86px;
    overflow: hidden;
}

.gs-famous-row {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    opacity: 0;
    transform: translateY(24px);
    pointer-events: none;
    transition: opacity .35s ease, transform .35s ease;
}

    .gs-famous-row.active {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }

.gs-famous-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    border-left: 1px solid var(--gs-line);
}

    .gs-famous-item:hover {
        background: #fbfcfa;
    }

    .gs-famous-item img {
        width: 48px;
        height: 48px;
        border-radius: 50%;
        object-fit: contain;
        background: #f5f7f4;
        border: 1px solid var(--gs-line);
        padding: 3px;
    }

    .gs-famous-item div {
        min-width: 0;
    }

    .gs-famous-item small {
        display: block;
        color: var(--gs-muted);
        font-size: 12px;
        margin-bottom: 3px;
    }

    .gs-famous-item strong {
        display: block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 15px;
    }

.gs-famous-controls {
    display: grid;
    grid-template-rows: 1fr 1fr;
}

    .gs-famous-controls button {
        border: 0;
        background: #fff;
        color: #556057;
    }

        .gs-famous-controls button:first-child {
            border-bottom: 1px solid var(--gs-line);
        }

        .gs-famous-controls button:hover {
            color: var(--gs-green);
            background: #f6f8f5;
        }

/* =========================================================
   MAIN 70/30 GRID
   ========================================================= */

.gs-home-grid {
    max-width: 1600px;
    margin: 18px auto 0;
    display: grid;
    grid-template-columns: 30% minmax(0, 70%);
    gap: 18px;
    padding: 0;
    align-items: start;
}

.gs-side-column {
    display: grid;
    gap: 16px;
}

.gs-side-card,
.gs-main-show {
    background: #fff;
    border: 1px solid var(--gs-line);
    border-radius: var(--gs-radius);
    box-shadow: var(--gs-shadow);
}

.gs-side-card {
    padding: 14px;
    overflow: hidden;
}

.gs-side-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

    .gs-side-heading h2 {
        margin: 0;
        font-size: 20px;
    }

    .gs-side-heading a {
        color: var(--gs-green);
        font-size: 13px;
        font-weight: 800;
    }

/* Slider */

.gs-slider {
    position: relative;
}

.gs-slide {
    display: none;
}

    .gs-slide.active {
        display: block;
    }

.gs-slider-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 10px;
}

    .gs-slider-dots button {
        width: 7px;
        height: 7px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: #c8cec8;
    }

        .gs-slider-dots button.active {
            width: 22px;
            border-radius: 999px;
            background: var(--gs-green);
        }

/* Awards */

.gs-award-slide {
    position: relative;
    min-height: 245px;
    border-radius: 15px;
    overflow: hidden;
    color: #fff;
    background: #271c0a;
}

.gs-award-bg,
.gs-award-overlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.gs-award-bg {
    object-fit: cover;
    opacity: .48;
}

.gs-award-overlay {
    background: radial-gradient(circle at 18% 10%, rgba(255,216,111,.42), transparent 35%), linear-gradient(135deg, rgba(62,39,7,.58), rgba(20,15,5,.96));
}

.gs-award-content {
    position: relative;
    z-index: 2;
    padding: 18px;
}

    .gs-award-content > small {
        color: #ffe397;
    }

    .gs-award-content h3 {
        margin: 6px 0 3px;
        font-size: 22px;
        line-height: 1.4;
    }

    .gs-award-content > span {
        font-size: 13px;
        opacity: .8;
    }

.gs-award-leader {
    margin-top: 23px;
    display: grid;
    grid-template-columns: 52px 1fr auto;
    gap: 10px;
    align-items: center;
}

    .gs-award-leader img {
        width: 52px;
        height: 52px;
        object-fit: cover;
        border-radius: 50%;
        border: 3px solid #fff;
    }

    .gs-award-leader strong,
    .gs-award-leader small {
        display: block;
    }

    .gs-award-leader small {
        margin-top: 3px;
        color: #f7dda2;
    }

    .gs-award-leader b {
        width: 36px;
        height: 36px;
        display: grid;
        place-items: center;
        background: #e7be56;
        color: #3b2706;
        border-radius: 50%;
    }

.gs-award-progress,
.gs-vote-progress {
    height: 8px;
    background: rgba(255,255,255,.18);
    border-radius: 999px;
    overflow: hidden;
}

.gs-award-progress {
    margin-top: 15px;
}

    .gs-award-progress span {
        display: block;
        height: 100%;
        background: linear-gradient(90deg, #f5d986, #e5ae28);
        border-radius: inherit;
    }

/* Voting */

.gs-votes-card {
    background: linear-gradient(145deg, #0f3235, #143d3d);
    color: #fff;
    border-color: #234b4c;
}

    .gs-votes-card .gs-side-heading a {
        color: #c7e7d2;
    }

.gs-vote-slide {
    min-height: 255px;
}

    .gs-vote-slide h3 {
        margin: 2px 0 3px;
        font-size: 20px;
    }

    .gs-vote-slide > small {
        color: #b5c8c6;
    }

.gs-vote-options {
    display: grid;
    gap: 12px;
    margin-top: 18px;
}

.gs-vote-option-top {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    font-size: 13px;
    margin-bottom: 5px;
}

    .gs-vote-option-top strong {
        color: #d8f2de;
    }

.gs-vote-progress {
    background: rgba(255,255,255,.09);
}

    .gs-vote-progress span {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: #b8d4d1;
    }

.gs-vote-action {
    margin-top: 18px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 10px;
    color: #fff;
    font-weight: 800;
}

    .gs-vote-action:hover {
        background: rgba(255,255,255,.08);
    }

.gs-votes-card .gs-slider-dots button {
    background: rgba(255,255,255,.32);
}

    .gs-votes-card .gs-slider-dots button.active {
        background: #fff;
    }

/* Reserve */

.gs-reserve-card {
    min-height: 130px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 7px;
    color: #7c847e;
    text-align: center;
    border-style: dashed;
    background: #fafbfa;
}

    .gs-reserve-card strong {
        color: #4e5750;
        font-size: 18px;
    }

/* =========================================================
   MAIN SHOW / TABS
   ========================================================= */

.gs-main-show {
    min-width: 0;
    overflow: hidden;
}

.gs-main-tabs {
    height: 64px;
    padding: 8px 10px 0;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    border-bottom: 1px solid var(--gs-line);
    background: #fff;
}

.gs-tab {
    position: relative;
    border: 0;
    background: transparent;
    color: #626a64;
    font-size: 15px;
    font-weight: 800;
    border-radius: 11px 11px 0 0;
}

    .gs-tab::after {
        content: "";
        position: absolute;
        right: 15%;
        left: 15%;
        bottom: 0;
        height: 3px;
        border-radius: 3px 3px 0 0;
        background: transparent;
        transform: scaleX(.2);
        transition: transform .2s ease, background .2s ease;
    }

    .gs-tab:hover {
        color: var(--gs-green-dark);
        background: #fafcf9;
    }

    .gs-tab.active {
        color: var(--gs-green-dark);
        background: linear-gradient(180deg,#fbfdf9,#f4f8f1);
    }

        .gs-tab.active::after {
            background: var(--gs-green);
            transform: scaleX(1);
        }

.gs-tab-panel {
    display: none;
    padding: 18px;
}

    .gs-tab-panel.active {
        display: block;
    }

/* Date strip */

.gs-date-strip {
    display: grid;
    grid-template-columns: 44px repeat(6, minmax(78px,1fr)) 44px;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.gs-date-pill,
.gs-date-arrow {
    height: 40px;
    border: 1px solid var(--gs-line);
    background: #fff;
    border-radius: 999px;
    color: #555d56;
}

.gs-date-arrow {
    border-radius: 11px;
    font-size: 22px;
}

.gs-date-pill.active {
    background: linear-gradient(135deg, #619640, #4b812f);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 7px 18px rgba(91,140,59,.18);
    font-weight: 800;
}

/* Match rows */

.gs-match-list {
    display: grid;
    gap: 9px;
}

.gs-match-row {
    min-height: 108px;
    display: grid;
    grid-template-columns: 31% 47% 22%;
    align-items: stretch;
    border: 1px solid var(--gs-line);
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

    .gs-match-row:hover {
        transform: translateY(-1px);
        box-shadow: 0 8px 18px rgba(30,45,32,.06);
        border-color: #cfd9cc;
    }

.gs-match-competition {
    display: grid;
    grid-template-columns: 64px minmax(0,1fr) minmax(110px, .9fr);
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    border-left: 1px solid var(--gs-line);
}

    .gs-match-competition > img {
        width: 56px;
        height: 56px;
        object-fit: contain;
        justify-self: end;
    }

.gs-competition-name {
    font-weight: 900;
    font-size: 15px;
    line-height: 1.35;
}

.gs-fixture-details {
    padding-right: 14px;
    border-right: 2px dotted #8fbb7c;
    display: flex;
    flex-direction: column;
    gap: 3px;
    color: #565e57;
    font-size: 12px;
}

    .gs-fixture-details strong {
        color: #303832;
    }

    .gs-fixture-details small {
        color: #7c857d;
    }

.gs-match-center {
    display: grid;
    grid-template-columns: minmax(100px,1fr) 110px minmax(100px,1fr);
    align-items: center;
    border-left: 1px solid var(--gs-line);
}

.gs-team {
    min-width: 0;
    text-align: center;
    padding: 8px;
}

    .gs-team img {
        width: 55px;
        height: 55px;
        object-fit: contain;
        border-radius: 50%;
        background: #fff;
        margin-bottom: 5px;
    }

    .gs-team strong {
        display: block;
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.gs-score-center {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.gs-match-time {
    font-size: 12px;
    color: #4e5650;
    margin-bottom: 2px;
    font-weight: 700;
}

.gs-score-center b {
    direction: ltr;
    font-size: 24px;
    line-height: 1.15;
}

.gs-status {
    display: inline-flex;
    min-width: 70px;
    justify-content: center;
    margin-top: 5px;
    padding: 3px 10px;
    font-size: 11px;
    border-radius: 999px;
    border: 1px solid #cdd4ce;
    color: #68706a;
}

    .gs-status.live {
        color: #2d7c2c;
        background: #f4fbf0;
        border-color: #8dbb77;
    }

    .gs-status.finished {
        background: #f7f8f7;
    }

    .gs-status.scheduled {
        background: #fff;
    }

.gs-match-stadium {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    padding: 10px;
    text-align: center;
}

    .gs-match-stadium img {
        width: 48px;
        height: 48px;
        object-fit: contain;
    }

    .gs-match-stadium strong {
        font-size: 12px;
        line-height: 1.3;
    }

/* =========================================================
   NEWS
   ========================================================= */

.gs-news-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 37%;
    gap: 14px;
}

.gs-featured-news {
    display: grid;
    grid-template-columns: 50% 50%;
    border: 1px solid var(--gs-line);
    border-radius: 15px;
    overflow: hidden;
    background: #fff;
    min-height: 520px;
}

    .gs-featured-news > img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.gs-featured-news-body {
    padding: 34px 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.gs-news-tag {
    display: inline-flex;
    align-self: flex-start;
    color: #4f7d34;
    background: #eef5e9;
    padding: 4px 9px;
    border-radius: 7px;
    font-size: 11px;
    font-weight: 800;
}

.gs-featured-news-body h2 {
    font-size: 29px;
    line-height: 1.65;
    margin: 17px 0 12px;
}

.gs-featured-news-body p {
    color: #69716b;
    line-height: 1.9;
    font-size: 15px;
}

.gs-news-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    color: #8a918b;
    font-size: 12px;
    margin-top: 6px;
}

.gs-primary-action {
    margin-top: 22px;
    min-height: 46px;
    border: 0;
    border-radius: 11px;
    background: linear-gradient(135deg, #619c3f, #4b812f);
    color: #fff;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
}

.gs-news-side-list {
    border: 1px solid var(--gs-line);
    border-radius: 15px;
    overflow: hidden;
    background: #fff;
}

.gs-small-news {
    min-height: 118px;
    display: grid;
    grid-template-columns: 118px 1fr;
    gap: 12px;
    padding: 12px;
    border-bottom: 1px solid var(--gs-line);
}

    .gs-small-news:hover {
        background: #fafcf9;
    }

    .gs-small-news img {
        width: 118px;
        height: 94px;
        object-fit: cover;
        border-radius: 10px;
    }

    .gs-small-news h3 {
        font-size: 15px;
        line-height: 1.55;
        margin: 6px 0;
    }

    .gs-small-news small {
        color: #8a918b;
    }

.gs-text-link {
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gs-green);
    font-weight: 800;
    font-size: 13px;
}

/* =========================================================
   COMMUNITY
   ========================================================= */

.gs-community-create {
    border: 1px solid var(--gs-line);
    border-radius: 15px;
    padding: 16px;
    background: #fff;
    margin-bottom: 14px;
}

.gs-community-create-top {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
}

    .gs-community-create-top h2 {
        margin: 0 0 3px;
        font-size: 21px;
    }

    .gs-community-create-top span {
        color: var(--gs-muted);
        font-size: 13px;
    }

.gs-community-create .gs-primary-action {
    margin-top: 0;
    min-width: 150px;
}

.gs-community-note {
    margin-top: 14px;
    padding: 12px 14px;
    background: #f0f6ec;
    color: #58704c;
    border: 1px solid #d6e6cd;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.65;
}

.gs-community-feed {
    display: grid;
    gap: 12px;
}

.gs-community-post {
    background: #fff;
    border: 1px solid var(--gs-line);
    border-radius: 15px;
    padding: 16px;
}

.gs-post-header {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .gs-post-header > img {
        width: 48px;
        height: 48px;
        border-radius: 50%;
        object-fit: cover;
    }

    .gs-post-header div {
        min-width: 0;
        flex: 1;
    }

    .gs-post-header strong,
    .gs-post-header span,
    .gs-post-header small {
        display: block;
    }

    .gs-post-header strong {
        font-size: 15px;
    }

    .gs-post-header span {
        color: #69716b;
        font-size: 12px;
        margin-top: 2px;
    }

    .gs-post-header small {
        color: #9aa09b;
        font-size: 11px;
        margin-top: 3px;
    }

.gs-verified {
    width: 23px;
    height: 23px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #2e8a49;
    color: #fff !important;
    font-size: 13px !important;
}

.gs-post-body {
    padding-top: 14px;
}

    .gs-post-body p {
        margin: 0 0 12px;
        line-height: 1.85;
        font-size: 15px;
    }

.gs-post-image {
    width: 100%;
    max-height: 480px;
    object-fit: cover;
    border-radius: 13px;
    background: #f4f4f4;
}

.gs-post-footer {
    padding-top: 13px;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    color: #7d857e;
    font-size: 12px;
}

.gs-reactions {
    display: flex;
    gap: 7px;
}

    .gs-reactions button {
        border: 1px solid var(--gs-line);
        background: #fff;
        border-radius: 999px;
        padding: 6px 10px;
        color: #626a64;
    }

        .gs-reactions button:hover {
            background: #f7f9f6;
        }

/* =========================================================
   OFFERS
   ========================================================= */

.gs-offer-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    margin-bottom: 14px;
}

    .gs-offer-toolbar > span {
        color: #7b837c;
        font-size: 13px;
    }

.gs-offer-categories {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
}

    .gs-offer-categories button {
        min-height: 36px;
        border-radius: 999px;
        padding: 0 16px;
        border: 1px solid var(--gs-line);
        background: #fff;
        color: #5f6760;
    }

        .gs-offer-categories button.active {
            background: var(--gs-green);
            color: #fff;
            border-color: var(--gs-green);
        }

.gs-products-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 16px;
}

.gs-product-card {
    border: 1px solid var(--gs-line);
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
}

    .gs-product-card.deferred-product {
        display: none;
    }

        .gs-product-card.deferred-product.revealed {
            display: block;
            animation: productReveal .35s ease both;
        }

@keyframes productReveal {
    from {
        opacity: 0;
        transform: translateY(14px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.gs-product-image-wrap {
    position: relative;
    height: 330px;
    background: #f0f1ef;
}

    .gs-product-image-wrap img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.gs-discount {
    position: absolute;
    top: 12px;
    right: 12px;
    padding: 6px 10px;
    background: var(--gs-green);
    color: #fff;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 900;
}

.gs-product-body {
    padding: 16px;
}

    .gs-product-body h3 {
        margin: 0 0 14px;
        font-size: 18px;
    }

.gs-product-specs {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 0;
    border: 1px solid var(--gs-line);
    border-radius: 12px;
    overflow: hidden;
}

    .gs-product-specs div {
        min-height: 64px;
        padding: 9px 12px;
        border-bottom: 1px solid var(--gs-line);
    }

        .gs-product-specs div:nth-child(odd) {
            border-left: 1px solid var(--gs-line);
        }

        .gs-product-specs div:nth-last-child(-n+2) {
            border-bottom: 0;
        }

    .gs-product-specs span,
    .gs-product-specs strong {
        display: block;
    }

    .gs-product-specs span {
        color: #8a918b;
        font-size: 11px;
        margin-bottom: 4px;
    }

    .gs-product-specs strong {
        font-size: 13px;
    }

.gs-product-price-row {
    margin-top: 14px;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
}

    .gs-product-price-row > strong {
        color: var(--gs-green-dark);
        font-size: 18px;
    }

    .gs-product-price-row > a {
        min-height: 39px;
        padding: 0 17px;
        display: inline-flex;
        align-items: center;
        border: 1px solid var(--gs-green);
        color: var(--gs-green);
        border-radius: 10px;
        font-size: 13px;
        font-weight: 800;
    }

.gs-products-sentinel {
    margin-top: 14px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px dashed #ccd4cd;
    color: #8a918b;
    font-size: 12px;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1450px) {
    .gs-navbar-inner,
    .gs-famous-bar,
    .gs-home-grid {
        max-width: calc(100% - 30px);
    }

    .gs-navbar-inner {
        padding: 0;
        grid-template-columns: auto 1fr auto;
    }

    .gs-primary-nav {
        gap: 22px;
    }

    .gs-match-row {
        grid-template-columns: 33% 45% 22%;
    }
}

@media (max-width: 1180px) {
    .gs-brand-text {
        display: none;
    }

    .gs-navbar-inner {
        grid-template-columns: 90px 1fr auto;
    }

    .gs-primary-nav {
        justify-self: center;
        gap: 18px;
        font-size: 14px;
    }

    .gs-login-btn,
    .gs-signup-btn {
        padding: 0 12px;
        font-size: 12px;
    }

    .gs-famous-row {
        grid-template-columns: repeat(2, 1fr);
    }

    .gs-famous-item:nth-child(n+3) {
        display: none;
    }

    .gs-home-grid {
        grid-template-columns: 1fr;
    }

    .gs-side-column {
        grid-template-columns: repeat(3, minmax(0,1fr));
        order: 2;
    }

    .gs-main-show {
        order: 1;
    }

    .gs-news-layout {
        grid-template-columns: 1fr;
    }

    .gs-news-side-list {
        display: grid;
        grid-template-columns: repeat(2,1fr);
    }

    .gs-small-news:nth-child(odd) {
        border-left: 1px solid var(--gs-line);
    }

    .gs-text-link {
        grid-column: 1 / -1;
    }
}

@media (max-width: 900px) {
    .gs-navbar-inner {
        min-height: 78px;
        max-width: 100%;
        padding: 0 14px;
        grid-template-columns: auto 1fr auto;
    }

    .gs-brand-logo {
        width: 56px;
        height: 56px;
    }

    .gs-primary-nav {
        display: none;
    }

    .gs-navbar-actions {
        direction: rtl;
    }

    .gs-login-btn {
        display: none;
    }

    .gs-signup-btn {
        font-size: 12px;
    }

    .gs-language-btn {
        display: none;
    }

    .gs-score-ticker {
        height: 70px;
    }

    .gs-score-mini {
        width: 230px;
        flex-basis: 230px;
        padding: 7px 10px;
    }

    .gs-score-league {
        font-size: 10px;
    }

    .gs-famous-bar {
        max-width: calc(100% - 20px);
        grid-template-columns: 150px 1fr 42px;
    }

    .gs-famous-title {
        font-size: 17px;
    }

    .gs-famous-item {
        padding: 8px 12px;
    }

        .gs-famous-item img {
            width: 40px;
            height: 40px;
        }

    .gs-home-grid {
        max-width: calc(100% - 20px);
    }

    .gs-main-tabs {
        height: auto;
        padding: 8px;
        display: flex;
        overflow-x: auto;
        gap: 4px;
    }

    .gs-tab {
        min-width: 145px;
        height: 48px;
        border-radius: 10px;
    }

        .gs-tab::after {
            display: none;
        }

        .gs-tab.active {
            background: var(--gs-green);
            color: #fff;
        }

    .gs-date-strip {
        grid-template-columns: 38px repeat(6, 92px) 38px;
        overflow-x: auto;
    }

    .gs-match-row {
        grid-template-columns: 1fr;
    }

    .gs-match-competition,
    .gs-match-center {
        border-left: 0;
        border-bottom: 1px solid var(--gs-line);
    }

    .gs-match-stadium {
        flex-direction: row;
    }

        .gs-match-stadium img {
            width: 34px;
            height: 34px;
        }

    .gs-side-column {
        grid-template-columns: 1fr;
    }

    .gs-featured-news {
        grid-template-columns: 1fr;
    }

        .gs-featured-news > img {
            height: 330px;
        }

    .gs-products-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .gs-navbar-actions {
        gap: 6px;
    }

    .gs-signup-btn {
        display: none;
    }

    .gs-user-name {
        max-width: 90px;
    }

    .gs-famous-bar {
        grid-template-columns: 1fr 44px;
    }

    .gs-famous-title {
        grid-column: 1 / -1;
        min-height: 44px;
        border-bottom: 1px solid var(--gs-line);
        border-left: 0;
    }

    .gs-famous-row {
        grid-template-columns: 1fr;
    }

    .gs-famous-item:nth-child(n+2) {
        display: none;
    }

    .gs-tab-panel {
        padding: 10px;
    }

    .gs-match-competition {
        grid-template-columns: 52px minmax(0,1fr) minmax(100px,.8fr);
        padding: 10px;
    }

        .gs-match-competition > img {
            width: 45px;
            height: 45px;
        }

    .gs-match-center {
        grid-template-columns: minmax(80px,1fr) 92px minmax(80px,1fr);
    }

    .gs-team img {
        width: 45px;
        height: 45px;
    }

    .gs-featured-news-body {
        padding: 22px 18px;
    }

        .gs-featured-news-body h2 {
            font-size: 23px;
        }

    .gs-news-side-list {
        grid-template-columns: 1fr;
    }

    .gs-small-news:nth-child(odd) {
        border-left: 0;
    }

    .gs-community-create-top {
        align-items: stretch;
        flex-direction: column;
    }

    .gs-community-create .gs-primary-action {
        width: 100%;
    }

    .gs-post-footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .gs-offer-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .gs-product-image-wrap {
        height: 270px;
    }
}

/* =========================================================
   GEDIAN SPORTS - PRODUCTION INTEGRATION OVERRIDES
   Current production logic + supplied new design.
   ========================================================= */

.gs-redesigned-landing {
    padding-top: 14px;
}

.gs-legacy-wide-shell {
    max-width: 1600px;
}

.gs-redesigned-landing .gs-page {
    min-height: 0;
    padding-bottom: 0;
}

/* Physical left sidebar / right main content, while children stay RTL. */
.gs-home-grid {
    direction: ltr;
    padding-right: 12px;
    padding-left: 12px;
}

.gs-side-column,
.gs-main-show {
    direction: rtl;
}

.gs-redesigned-landing .gedian-hero {
    margin-bottom: 15px;
}

/* =========================================================
   SCORE TICKER
   ========================================================= */

.gs-mini-logo {
    display: grid;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    overflow: hidden;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    color: #35552a;
    font-size: 9px;
    font-weight: 950;
}

    .gs-mini-logo img {
        width: 100%;
        height: 100%;
        padding: 2px;
        object-fit: contain;
    }

    .gs-mini-logo > span {
        display: grid;
        width: 100%;
        height: 100%;
        place-items: center;
    }

.gs-score-mini-empty {
    align-items: center;
    justify-content: center;
    text-align: center;
}

    .gs-score-mini-empty strong {
        font-size: 13px;
    }

    .gs-score-mini-empty span {
        color: #b6c0b7;
        font-size: 11px;
    }

/* =========================================================
   FAMOUS / MOST FOLLOWED
   ========================================================= */

.gs-famous-avatar {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    overflow: hidden;
    place-items: center;
    border: 1px solid var(--gs-line);
    border-radius: 50%;
    background: #f2f6ef;
    color: var(--gs-green-dark);
    font-size: 12px;
    font-weight: 950;
}

    .gs-famous-avatar img {
        width: 100%;
        height: 100%;
        padding: 3px;
        object-fit: contain;
    }

    .gs-famous-avatar > span {
        display: grid;
        width: 100%;
        height: 100%;
        place-items: center;
    }

.gs-famous-item > div em {
    display: block;
    margin-top: 2px;
    overflow: hidden;
    color: #758077;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gs-famous-item.is-pending {
    opacity: .78;
}

/* =========================================================
   SIDEBAR REAL DATA
   ========================================================= */

.gs-side-message {
    display: grid;
    min-height: 180px;
    place-items: center;
    align-content: center;
    gap: 6px;
    padding: 20px 12px;
    color: #788178;
    text-align: center;
}

    .gs-side-message > span {
        font-size: 28px;
    }

    .gs-side-message strong {
        color: #445044;
        font-size: 14px;
    }

    .gs-side-message small {
        max-width: 240px;
        font-size: 11px;
        line-height: 1.6;
    }

    .gs-side-message.is-error {
        min-height: 100px;
        border-radius: 10px;
        background: #fff5f3;
        color: #98473d;
    }

    .gs-side-message.is-dark,
    .gs-side-message.is-dark-error {
        color: #c3d2ca;
    }

        .gs-side-message.is-dark strong,
        .gs-side-message.is-dark-error strong {
            color: #fff;
        }

    .gs-side-message.is-dark-error {
        min-height: 100px;
        border: 1px solid rgba(255,255,255,.12);
        border-radius: 10px;
        background: rgba(255,255,255,.05);
    }

.gs-award-leader-avatar {
    display: grid;
    width: 52px;
    height: 52px;
    overflow: hidden;
    place-items: center;
    border: 3px solid #fff;
    border-radius: 50%;
    background: rgba(255,255,255,.18);
    color: #fff;
    font-weight: 950;
}

    .gs-award-leader-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .gs-award-leader-avatar > span {
        display: grid;
        width: 100%;
        height: 100%;
        place-items: center;
    }

.gs-award-mini-ranking {
    display: grid;
    gap: 4px;
    margin-top: 12px;
}

    .gs-award-mini-ranking > div {
        display: grid;
        grid-template-columns: 22px minmax(0,1fr) auto;
        gap: 6px;
        align-items: center;
        min-height: 25px;
        padding: 3px 5px;
        border-radius: 7px;
        background: rgba(255,255,255,.09);
    }

        .gs-award-mini-ranking > div > span {
            display: grid;
            width: 20px;
            height: 20px;
            place-items: center;
            border-radius: 50%;
            background: rgba(255,255,255,.14);
            font-size: 10px;
            font-weight: 900;
        }

    .gs-award-mini-ranking a,
    .gs-award-mini-ranking strong {
        overflow: hidden;
        color: #fff;
        font-size: 11px;
        font-weight: 850;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .gs-award-mini-ranking small {
        color: #f7dda2;
        font-size: 9px;
    }

.gs-vote-real-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 9px;
}

    .gs-vote-real-badges span {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 3px 6px;
        border-radius: 999px;
        background: rgba(255,255,255,.09);
        color: #d5e5dc;
        font-size: 10px;
        font-weight: 800;
    }

    .gs-vote-real-badges .is-open {
        background: rgba(157,216,126,.13);
        color: #d8f5c9;
    }

        .gs-vote-real-badges .is-open i {
            display: block;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: #98d679;
        }

.gs-vote-description {
    display: -webkit-box;
    overflow: hidden;
    margin: 9px 0 0;
    color: #b9c9c3;
    font-size: 12px;
    line-height: 1.7;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.gs-vote-summary-grid {
    display: grid;
    grid-template-columns: 90px minmax(0,1fr);
    gap: 7px;
    margin-top: 15px;
}

    .gs-vote-summary-grid > div {
        min-height: 64px;
        padding: 9px;
        border: 1px solid rgba(255,255,255,.11);
        border-radius: 10px;
        background: rgba(255,255,255,.05);
    }

    .gs-vote-summary-grid strong,
    .gs-vote-summary-grid span {
        display: block;
    }

    .gs-vote-summary-grid strong {
        color: #fff;
        font-size: 13px;
    }

    .gs-vote-summary-grid span {
        margin-top: 3px;
        color: #afc2bc;
        font-size: 10px;
    }

.gs-dummy-label {
    display: inline-flex;
    padding: 4px 7px;
    border-radius: 999px;
    background: #eef2ed;
    color: #858d86;
    font-size: 10px;
    font-weight: 800;
}

/* =========================================================
   MAIN HEADING + DATES
   ========================================================= */

.gs-panel-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

    .gs-panel-heading > div > span {
        display: block;
        color: var(--gs-green);
        font-size: 11px;
        font-weight: 900;
    }

    .gs-panel-heading h2 {
        margin: 2px 0 0;
        color: #243027;
        font-size: 22px;
        font-weight: 950;
    }

    .gs-panel-heading small {
        display: block;
        margin-top: 2px;
        color: #818a82;
        font-size: 11px;
    }

    .gs-panel-heading > b {
        color: #6f786f;
        font-size: 12px;
        font-weight: 800;
    }

.gs-date-strip {
    grid-template-columns: 44px repeat(5,minmax(78px,1fr)) 44px;
}

a.gs-date-pill,
a.gs-date-arrow {
    display: grid;
    place-items: center;
    text-align: center;
}

.gs-date-pill {
    align-content: center;
    line-height: 1.05;
}

    .gs-date-pill small,
    .gs-date-pill strong,
    .gs-date-pill span {
        display: block;
    }

    .gs-date-pill small,
    .gs-date-pill span {
        font-size: 9px;
    }

    .gs-date-pill strong {
        margin: 1px 0;
        font-size: 13px;
    }

.gs-return-today {
    margin: -4px 0 12px;
}

    .gs-return-today a {
        display: inline-flex;
        min-height: 30px;
        align-items: center;
        padding: 4px 9px;
        border-radius: 8px;
        background: var(--gs-green-soft);
        color: var(--gs-green-dark);
        font-size: 11px;
        font-weight: 900;
    }

.gs-main-message {
    display: grid;
    min-height: 240px;
    place-items: center;
    align-content: center;
    gap: 5px;
    padding: 30px 16px;
    color: #818b82;
    text-align: center;
}

    .gs-main-message > span {
        font-size: 30px;
    }

    .gs-main-message strong {
        color: #485448;
        font-size: 15px;
    }

    .gs-main-message small {
        max-width: 430px;
        font-size: 11px;
        line-height: 1.6;
    }

    .gs-main-message.is-error {
        min-height: 110px;
        border: 1px solid #efd0cb;
        border-radius: 11px;
        background: #fff6f4;
        color: #9a473b;
    }

/* =========================================================
   REAL MATCH ROW
   ========================================================= */

.gs-real-match-row {
    position: relative;
}

    .gs-real-match-row.is-live {
        box-shadow: inset -4px 0 0 #d94747, 0 4px 13px rgba(217,71,71,.04);
    }

.gs-match-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.gs-real-match-row > .gs-match-competition,
.gs-real-match-row > .gs-match-center,
.gs-real-match-row > .gs-match-stadium {
    position: relative;
    z-index: 2;
    pointer-events: none;
}

.gs-real-match-row a,
.gs-real-match-row button.gs-score-button {
    position: relative;
    z-index: 4;
    pointer-events: auto;
}

.gs-competition-logo-link {
    display: grid;
    width: 56px;
    height: 56px;
    overflow: hidden;
    place-items: center;
    justify-self: end;
    border: 1px solid var(--gs-line);
    border-radius: 50%;
    background: #fff;
    color: var(--gs-green-dark);
    font-size: 12px;
    font-weight: 950;
}

    .gs-competition-logo-link img {
        width: 100%;
        height: 100%;
        padding: 5px;
        object-fit: contain;
    }

    .gs-competition-logo-link > span {
        display: grid;
        width: 100%;
        height: 100%;
        place-items: center;
    }

.gs-competition-name a {
    color: inherit;
}

    .gs-competition-name a:hover {
        color: var(--gs-green-dark);
    }

.gs-match-verified {
    color: var(--gs-green-dark) !important;
    font-weight: 850;
}

.gs-team-link {
    display: flex;
    min-width: 0;
    align-items: center;
    flex-direction: column;
    gap: 5px;
    color: inherit;
}

.gs-team-logo {
    display: grid;
    width: 55px;
    height: 55px;
    overflow: hidden;
    place-items: center;
    border: 1px solid var(--gs-line);
    border-radius: 50%;
    background: #fff;
    color: var(--gs-green-dark);
    font-size: 12px;
    font-weight: 950;
}

    .gs-team-logo img {
        width: 100%;
        height: 100%;
        padding: 4px;
        object-fit: contain;
    }

    .gs-team-logo > span {
        display: grid;
        width: 100%;
        height: 100%;
        place-items: center;
    }

.gs-score-button {
    appearance: none;
    width: 100%;
    min-height: 82px;
    padding: 6px;
    border: 0;
    background: transparent;
    color: inherit;
    font-family: inherit;
    cursor: pointer;
}

    .gs-score-button:hover {
        background: #f6faf4;
    }

    .gs-score-button small {
        display: block;
        margin-top: 2px;
        color: #8c948e;
        font-size: 9px;
    }

.gs-stadium-logo {
    display: grid;
    width: 58px;
    height: 58px;
    overflow: hidden;
    place-items: center;
    border: 1px solid var(--gs-line);
    border-radius: 50%;
    background: #f5f7f4;
    color: var(--gs-green-dark);
    font-size: 12px;
    font-weight: 950;
}

    .gs-stadium-logo img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .gs-stadium-logo > span {
        display: grid;
        width: 100%;
        height: 100%;
        place-items: center;
    }

/* =========================================================
   NEWS
   ========================================================= */

.gs-featured-news-image {
    display: grid;
    min-height: 520px;
    overflow: hidden;
    place-items: center;
    background: linear-gradient(135deg,#0c2639,#32623f);
    color: rgba(255,255,255,.78);
    font-size: 26px;
    font-weight: 950;
}

    .gs-featured-news-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .gs-featured-news-image > span {
        place-items: center;
        width: 100%;
        height: 100%;
    }

.gs-news-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
}

.gs-news-toggle {
    cursor: pointer;
}

.gs-secondary-action {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    border: 1px solid var(--gs-line);
    border-radius: 11px;
    color: #58635a;
    font-size: 12px;
    font-weight: 850;
}

.gs-news-expanded {
    margin-top: 9px;
    padding: 10px;
    border-radius: 10px;
    background: #f7faf5;
    color: #59655b;
    font-size: 13px;
    line-height: 1.9;
    white-space: pre-line;
}

.gs-small-news-real {
    grid-template-columns: 105px minmax(0,1fr);
}

.gs-small-news-image {
    display: grid;
    width: 105px;
    min-height: 92px;
    overflow: hidden;
    place-items: center;
    border-radius: 10px;
    background: #eef3ec;
    color: var(--gs-green-dark);
    font-weight: 950;
}

    .gs-small-news-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .gs-small-news-image > span {
        place-items: center;
        width: 100%;
        height: 100%;
    }

.gs-small-news-preview {
    display: -webkit-box;
    overflow: hidden;
    margin: 4px 0 0;
    color: #717971;
    font-size: 10px;
    line-height: 1.55;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.gs-small-news-more {
    appearance: none;
    margin-top: 5px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--gs-green-dark);
    font-size: 10px;
    font-weight: 900;
    cursor: pointer;
}

.gs-small-news-expanded {
    margin-top: 5px;
    color: #687269;
    font-size: 10px;
    line-height: 1.65;
    white-space: pre-line;
}

.gs-small-news-source {
    display: inline-flex;
    margin-top: 5px;
    color: #6a746c;
    font-size: 10px;
    font-weight: 800;
}

/* =========================================================
   COMMUNITY
   ========================================================= */

.gs-community-create-placeholder {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 6px 11px;
    border: 1px dashed #bdd0b4;
    border-radius: 10px;
    background: #f5faf2;
    color: var(--gs-green-dark);
    font-size: 11px;
    font-weight: 850;
}

.gs-real-community-post.is-special {
    border-color: #d8c67f;
    box-shadow: inset 0 3px 0 #c8a23d, var(--gs-shadow);
}

.gs-post-author-avatar {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    overflow: hidden;
    place-items: center;
    border: 1px solid var(--gs-line);
    border-radius: 50%;
    background: var(--gs-green-soft);
    color: var(--gs-green-dark);
    font-weight: 950;
}

    .gs-post-author-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .gs-post-author-avatar > span {
        display: grid;
        width: 100%;
        height: 100%;
        place-items: center;
    }

.gs-post-author-name {
    display: block;
    color: #263328;
    font-size: 15px;
    font-weight: 950;
}

.gs-post-read-more {
    display: inline-flex;
    margin: -5px 0 10px;
    color: var(--gs-green-dark);
    font-size: 11px;
    font-weight: 900;
}

.gs-post-reference {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 10px;
    padding: 6px 8px;
    border-radius: 8px;
    background: #edf4fb;
    color: #486f98;
    font-size: 11px;
    font-weight: 850;
}

    .gs-post-reference.is-external {
        background: #f3eef9;
        color: #6d568a;
    }

.gs-post-image-grid {
    display: grid;
    gap: 3px;
    overflow: hidden;
    border-radius: 13px;
    background: #edf0eb;
}

    .gs-post-image-grid.images-1 {
        grid-template-columns: 1fr;
    }

    .gs-post-image-grid.images-2,
    .gs-post-image-grid.images-3,
    .gs-post-image-grid.images-4 {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

.gs-post-image-cell {
    position: relative;
    display: block;
    min-height: 220px;
    overflow: hidden;
    background: #e7ece5;
}

.gs-post-image-grid.images-1 .gs-post-image-cell {
    min-height: 430px;
}

.gs-post-image-grid.images-3 .gs-post-image-cell:first-child {
    grid-row: span 2;
    min-height: 443px;
}

.gs-post-image-cell img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gs-post-image-cell > span {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgba(7,26,51,.60);
    color: #fff;
    font-size: 25px;
    font-weight: 950;
}

.gs-post-video-list {
    display: grid;
    gap: 7px;
    margin-top: 9px;
}

    .gs-post-video-list video {
        display: block;
        width: 100%;
        max-height: 520px;
        border-radius: 12px;
        background: #07121d;
    }

.gs-post-audio-list {
    display: grid;
    gap: 6px;
    margin-top: 9px;
}

    .gs-post-audio-list audio {
        width: 100%;
    }

.gs-post-links {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}

    .gs-post-links a {
        display: inline-flex;
        min-height: 31px;
        align-items: center;
        padding: 5px 8px;
        border: 1px solid var(--gs-line);
        border-radius: 8px;
        background: #fbfcfa;
        color: #4b5a4e;
        font-size: 10px;
        font-weight: 850;
    }

.gs-post-footer {
    flex-wrap: wrap;
}

.gs-post-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
}

    .gs-post-stats span {
        color: #69736b;
        font-size: 11px;
    }

.gs-post-details-link {
    margin-right: auto;
    color: var(--gs-green-dark);
    font-size: 11px;
    font-weight: 900;
}

.gs-community-legacy-feed {
    margin-top: 18px;
    padding-top: 17px;
    border-top: 1px solid var(--gs-line);
}

    .gs-community-legacy-feed > header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 10px;
    }

        .gs-community-legacy-feed > header span {
            display: block;
            color: var(--gs-green);
            font-size: 10px;
            font-weight: 900;
        }

        .gs-community-legacy-feed > header h2 {
            margin: 2px 0 0;
            color: #29362c;
            font-size: 18px;
        }

.gs-community-activity-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
}

.gs-community-activity-card {
    padding: 11px;
    border: 1px solid var(--gs-line);
    border-radius: 11px;
    background: #fff;
}

.gs-activity-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

    .gs-activity-head a,
    .gs-activity-head strong {
        color: #36443a;
        font-size: 11px;
        font-weight: 900;
    }

    .gs-activity-head span {
        color: #8f9890;
        font-size: 9px;
    }

.gs-community-activity-card h3 {
    margin: 7px 0 0;
    color: #2c392f;
    font-size: 13px;
    line-height: 1.55;
}

.gs-community-activity-card p {
    display: -webkit-box;
    overflow: hidden;
    margin: 4px 0 0;
    color: #69736b;
    font-size: 11px;
    line-height: 1.65;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.gs-community-activity-card small {
    display: block;
    margin-top: 5px;
    color: #7e8880;
    font-size: 9px;
}

.gs-activity-open {
    display: inline-flex;
    margin-top: 6px;
    color: var(--gs-green-dark);
    font-size: 10px;
    font-weight: 900;
}

/* =========================================================
   DUMMY STORE
   ========================================================= */

.gs-product-dummy-visual {
    display: grid;
    height: 330px;
    place-items: center;
    align-content: center;
    gap: 8px;
    background: radial-gradient(circle at 50% 38%,#fff,#edf2ea 68%);
}

    .gs-product-dummy-visual > span {
        font-size: 84px;
        filter: drop-shadow(0 10px 16px rgba(36,60,40,.10));
    }

    .gs-product-dummy-visual small {
        padding: 4px 8px;
        border-radius: 999px;
        background: #fff;
        color: #849087;
        font-size: 10px;
        font-weight: 850;
    }

.gs-product-price-row > span {
    color: #8a938b;
    font-size: 11px;
}

.gs-redesigned-landing .gedian-social-strip {
    margin-top: 20px;
}

/* =========================================================
   RESPONSIVE INTEGRATION
   ========================================================= */

@media (max-width: 1180px) {
    .gs-home-grid {
        grid-template-columns: 31% minmax(0,69%);
    }

    .gs-date-strip {
        grid-template-columns: 38px repeat(5,minmax(62px,1fr)) 38px;
        gap: 6px;
    }

    .gs-match-competition {
        grid-template-columns: 50px minmax(0,1fr);
    }

    .gs-fixture-details {
        grid-column: 1 / -1;
        padding-right: 0;
        border-right: 0;
    }
}

@media (max-width: 900px) {
    .gs-home-grid {
        direction: rtl;
    }

    .gs-date-strip {
        display: flex;
        overflow-x: auto;
        padding-bottom: 5px;
        scrollbar-width: thin;
    }

    .gs-date-pill {
        flex: 0 0 82px;
    }

    .gs-date-arrow {
        flex: 0 0 40px;
    }

    .gs-famous-row {
        grid-template-columns: repeat(2,1fr);
    }

        .gs-famous-row .gs-famous-item:nth-child(n+3) {
            display: none;
        }

    .gs-community-activity-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .gs-redesigned-landing {
        padding-top: 8px;
    }

        .gs-redesigned-landing .gedian-hero {
            margin-right: 3px;
            margin-left: 3px;
        }

    .gs-panel-heading {
        align-items: flex-start;
        flex-direction: column;
    }

        .gs-panel-heading h2 {
            font-size: 18px;
        }

    .gs-post-image-cell {
        min-height: 150px;
    }

    .gs-post-image-grid.images-1 .gs-post-image-cell {
        min-height: 270px;
    }

    .gs-post-image-grid.images-3 .gs-post-image-cell:first-child {
        min-height: 303px;
    }

    .gs-product-dummy-visual {
        height: 230px;
    }

        .gs-product-dummy-visual > span {
            font-size: 62px;
        }
}


/* =========================================================
   GEDIAN FAMOUS - TOTAL FOLLOWERS SOURCE
   ========================================================= */

.gs-famous-title {
    flex-direction: column;
    gap: 2px;
    text-align: center;
}

    .gs-famous-title > small {
        color: #8b958c;
        font-size: 11px;
        font-weight: 750;
    }

.gs-famous-item > div em {
    color: var(--gs-green-dark);
    font-size: 11px;
    font-weight: 850;
}

/* =========================================================
   GEDIAN SPORTS - INDEX / GEDIAN POSTS FEED
   Dedicated styles for مجتمع الجديان.
   ========================================================= */

.gedian-posts-panel-head {
    background: linear-gradient( 145deg, #fbfdf9, #ffffff);
}

.gedian-posts-list {
    display: grid;
    gap: 12px;
    padding: 12px;
    background: #f6f8f5;
}

.gedian-community-post {
    position: relative;
    overflow: hidden;
    border: 1px solid #dfe6dc;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(25, 43, 30, .035);
    transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

    .gedian-community-post:hover {
        transform: translateY(-1px);
        border-color: #bfd1b4;
        box-shadow: 0 10px 25px rgba(68, 105, 46, .075);
    }

    .gedian-community-post.is-special {
        border-color: #d9c685;
        box-shadow: inset 0 3px 0 #c9a443, 0 6px 18px rgba(118, 90, 22, .05);
    }

.gedian-post-overlay-link {
    position: absolute;
    inset: 0;
    z-index: 2;
    border-radius: inherit;
}

.gedian-post-head,
.gedian-post-text,
.gedian-repost-reference,
.gedian-post-image-grid,
.gedian-post-engagement {
    position: relative;
    z-index: 1;
}

/* =========================================================
   Header
   ========================================================= */

.gedian-post-head {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    gap: 9px;
    align-items: center;
    padding: 12px 13px 8px;
}

.gedian-post-author-avatar {
    position: relative;
    z-index: 4;
    display: grid;
    width: 48px;
    height: 48px;
    overflow: hidden;
    place-items: center;
    border: 1px solid #dfe6dc;
    border-radius: 50%;
    background: #edf4e9;
    color: #416d29;
}

    .gedian-post-author-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.gedian-post-avatar-fallback {
    width: 100%;
    height: 100%;
    place-items: center;
    background: linear-gradient( 145deg, #eaf2e6, #f7faf5);
    color: #416d29;
    font-size: .82rem;
    font-weight: 950;
}

.gedian-post-author-copy {
    min-width: 0;
}

.gedian-post-author-line {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
}

.gedian-post-author-name {
    position: relative;
    z-index: 4;
    overflow: hidden;
    color: #172d22;
    font-size: .78rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

a.gedian-post-author-name:hover {
    color: #416d29;
}

.gedian-post-verified {
    display: inline-grid;
    flex: 0 0 17px;
    width: 17px;
    height: 17px;
    place-items: center;
    border-radius: 50%;
    background: #5B8C3B;
    color: #fff;
    font-size: .52rem;
    font-weight: 950;
}

.gedian-post-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    margin-top: 2px;
    color: #88928a;
    font-size: .55rem;
}

    .gedian-post-meta i {
        color: #c0c7bd;
        font-style: normal;
    }

.gedian-post-head-badges {
    display: flex;
    position: relative;
    z-index: 1;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.gedian-post-special-badge,
.gedian-post-type-badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 3px 7px;
    border-radius: 999px;
    font-size: .5rem;
    font-weight: 900;
    white-space: nowrap;
}

.gedian-post-special-badge {
    background: #fff5d6;
    color: #8a6814;
}

.gedian-post-type-badge.is-repost {
    background: #edf4ff;
    color: #426a96;
}

.gedian-post-type-badge.is-external {
    background: #f0edf9;
    color: #685389;
}

/* =========================================================
   Text
   ========================================================= */

.gedian-post-text {
    padding: 3px 14px 12px;
    pointer-events: none;
}

    .gedian-post-text p {
        margin: 0;
        color: #2c3931;
        font-size: .75rem;
        font-weight: 500;
        line-height: 1.9;
        white-space: pre-line;
        word-break: break-word;
    }

.gedian-post-read-more {
    display: inline-block;
    margin-top: 5px;
    color: #5B8C3B;
    font-size: .55rem;
    font-weight: 900;
}

/* =========================================================
   Repost / external
   ========================================================= */

.gedian-repost-reference {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    margin: 0 13px 11px;
    padding: 9px 10px;
    border: 1px solid #dce7f2;
    border-radius: 10px;
    background: #f7fbff;
}

    .gedian-repost-reference > span {
        display: grid;
        width: 30px;
        height: 30px;
        place-items: center;
        border-radius: 8px;
        background: #e8f1fb;
        color: #466d96;
        font-size: .9rem;
    }

    .gedian-repost-reference strong {
        display: block;
        color: #3a536c;
        font-size: .61rem;
        font-weight: 900;
    }

    .gedian-repost-reference p {
        display: -webkit-box;
        overflow: hidden;
        margin: 2px 0 0;
        color: #6d7e8e;
        font-size: .55rem;
        line-height: 1.55;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .gedian-repost-reference a,
    .gedian-post-external-source,
    .gedian-post-links a,
    .gedian-post-video-list,
    .gedian-post-audio-list {
        position: relative;
        z-index: 4;
    }

    .gedian-repost-reference a {
        padding: 4px 7px;
        border-radius: 7px;
        background: #fff;
        color: #466d96;
        font-size: .52rem;
        font-weight: 900;
    }

.gedian-post-external-source {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0 13px 11px;
    padding: 9px 10px;
    border: 1px solid #e3def1;
    border-radius: 10px;
    background: #faf8ff;
    color: #675185;
    font-size: .59rem;
}

/* =========================================================
   Images
   ========================================================= */

.gedian-post-image-grid {
    display: grid;
    gap: 2px;
    overflow: hidden;
    margin-top: 2px;
    background: #edf0eb;
    pointer-events: none;
}

    .gedian-post-image-grid.images-1 {
        grid-template-columns: 1fr;
    }

    .gedian-post-image-grid.images-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gedian-post-image-grid.images-3,
    .gedian-post-image-grid.images-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

.gedian-post-image-cell {
    position: relative;
    min-height: 175px;
    overflow: hidden;
    background: #e8ece6;
}

.gedian-post-image-grid.images-1
.gedian-post-image-cell {
    min-height: 360px;
}

.gedian-post-image-grid.images-3
.gedian-post-image-cell:first-child {
    grid-row: span 2;
    min-height: 352px;
}

.gedian-post-image-cell img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gedian-post-more-images {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgba(7, 26, 51, .58);
    color: #fff;
    font-size: 1.35rem;
    font-weight: 950;
}

/* =========================================================
   Video / audio
   ========================================================= */

.gedian-post-video-list {
    display: grid;
    gap: 7px;
    padding: 0 12px 11px;
}

.gedian-post-video {
    display: block;
    width: 100%;
    max-height: 520px;
    border-radius: 11px;
    background: #07121d;
}

.gedian-post-audio-list {
    display: grid;
    gap: 6px;
    padding: 0 12px 11px;
}

.gedian-post-audio {
    display: grid;
    grid-template-columns: 31px minmax(0, 1fr);
    gap: 7px;
    align-items: center;
    padding: 7px 9px;
    border: 1px solid #e2e8df;
    border-radius: 10px;
    background: #f8faf7;
}

    .gedian-post-audio > span {
        display: grid;
        width: 31px;
        height: 31px;
        place-items: center;
        border-radius: 8px;
        background: #eaf2e6;
    }

    .gedian-post-audio audio {
        width: 100%;
        min-width: 0;
        height: 34px;
    }

/* =========================================================
   Links
   ========================================================= */

.gedian-post-links {
    display: grid;
    gap: 5px;
    padding: 0 12px 11px;
}

    .gedian-post-links a {
        display: grid;
        grid-template-columns: 25px minmax(0, 1fr) auto;
        gap: 7px;
        align-items: center;
        padding: 8px 9px;
        border: 1px solid #e2e8df;
        border-radius: 9px;
        background: #fbfcfa;
        color: #40503e;
    }

        .gedian-post-links a:hover {
            border-color: #c8d9be;
            background: #f3f8f0;
        }

    .gedian-post-links strong {
        overflow: hidden;
        font-size: .58rem;
        font-weight: 900;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .gedian-post-links i {
        color: #5B8C3B;
        font-style: normal;
    }

/* =========================================================
   Engagement
   ========================================================= */

.gedian-post-engagement {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px 13px;
    min-height: 43px;
    padding: 8px 13px;
    border-top: 1px solid #e9eee6;
    background: #fbfcfb;
    color: #79837a;
    pointer-events: none;
}

    .gedian-post-engagement > span {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        font-size: .56rem;
    }

    .gedian-post-engagement b {
        color: #4a5749;
        font-weight: 900;
    }

.gedian-post-open-details {
    margin-right: auto;
    color: #416d29;
    font-weight: 900;
}

    .gedian-post-open-details b {
        color: inherit;
    }

/* =========================================================
   Empty
   ========================================================= */

.gedian-posts-empty {
    display: grid;
    min-height: 230px;
    place-items: center;
    align-content: center;
    gap: 5px;
    padding: 28px;
    color: #7d887e;
    text-align: center;
}

    .gedian-posts-empty > span {
        display: grid;
        width: 50px;
        height: 50px;
        place-items: center;
        margin-bottom: 4px;
        border-radius: 50%;
        background: #edf5e9;
        color: #5B8C3B;
        font-size: 1.35rem;
    }

    .gedian-posts-empty strong {
        color: #42503f;
        font-size: .8rem;
        font-weight: 950;
    }

    .gedian-posts-empty small {
        max-width: 390px;
        font-size: .6rem;
        line-height: 1.7;
    }

/* =========================================================
   Preserve old activity feed in a secondary block
   ========================================================= */

.gedian-community-activity {
    margin: 3px 12px 12px;
    padding-top: 11px;
    border-top: 1px solid #e1e7de;
}

    .gedian-community-activity > header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 8px;
    }

        .gedian-community-activity > header span:first-child {
            display: block;
            color: #5B8C3B;
            font-size: .48rem;
            font-weight: 900;
        }

        .gedian-community-activity > header h3 {
            margin: 1px 0 0;
            color: #243429;
            font-size: .75rem;
            font-weight: 950;
        }

.gedian-community-activity-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.gedian-community-activity-card {
    padding: 9px;
    border: 1px solid #e4e9e1;
    border-radius: 9px;
    background: #fff;
}

    .gedian-community-activity-card > div {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

        .gedian-community-activity-card > div strong {
            color: #3d4b3a;
            font-size: .56rem;
        }

        .gedian-community-activity-card > div span {
            color: #929b92;
            font-size: .45rem;
        }

    .gedian-community-activity-card h4 {
        margin: 6px 0 0;
        color: #28362b;
        font-size: .62rem;
        font-weight: 900;
        line-height: 1.55;
    }

    .gedian-community-activity-card p {
        display: -webkit-box;
        overflow: hidden;
        margin: 3px 0 0;
        color: #6f796f;
        font-size: .53rem;
        line-height: 1.65;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .gedian-community-activity-card > a {
        display: inline-flex;
        margin-top: 5px;
        color: #416d29;
        font-size: .5rem;
        font-weight: 900;
    }

.gedian-community-activity-message {
    padding: 10px;
    border-radius: 8px;
    background: #fff7f4;
    color: #964a3e;
    font-size: .56rem;
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 767.98px) {

    .gedian-posts-list {
        gap: 8px;
        padding: 8px;
    }

    .gedian-community-post {
        border-radius: 12px;
    }

    .gedian-post-head {
        grid-template-columns: 42px minmax(0, 1fr) auto;
        padding: 10px 10px 7px;
    }

    .gedian-post-author-avatar {
        width: 42px;
        height: 42px;
    }

    .gedian-post-author-name {
        font-size: .68rem;
    }

    .gedian-post-meta {
        font-size: .49rem;
    }

    .gedian-post-text {
        padding: 3px 11px 10px;
    }

        .gedian-post-text p {
            font-size: .67rem;
            line-height: 1.8;
        }

    .gedian-post-image-cell {
        min-height: 145px;
    }

    .gedian-post-image-grid.images-1
    .gedian-post-image-cell {
        min-height: 285px;
    }

    .gedian-post-image-grid.images-3
    .gedian-post-image-cell:first-child {
        min-height: 292px;
    }

    .gedian-community-activity-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 479.98px) {

    .gedian-post-head {
        grid-template-columns: 40px minmax(0, 1fr);
    }

    .gedian-post-author-avatar {
        width: 40px;
        height: 40px;
    }

    .gedian-post-head-badges {
        grid-column: 1 / -1;
        flex-direction: row;
        justify-content: flex-start;
        padding-right: 49px;
    }

    .gedian-post-image-cell {
        min-height: 120px;
    }

    .gedian-post-image-grid.images-1
    .gedian-post-image-cell {
        min-height: 235px;
    }

    .gedian-post-image-grid.images-3
    .gedian-post-image-cell:first-child {
        min-height: 242px;
    }

    .gedian-post-engagement {
        gap: 5px 9px;
    }

    .gedian-post-open-details {
        width: 100%;
        margin-right: 0;
        padding-top: 3px;
        border-top: 1px dashed #e2e8df;
    }
}

/* =========================================================
   GEDIAN LANDING V2.4
   Agile awards + vote percentage + most followed + social
   ========================================================= */

/* ----- Awards: vote percentage visualization ----- */

.award-ranking-row {
    min-height: 45px;
}

.award-vote-result {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 5px;
    align-items: center;
    margin-top: 4px;
}

.award-vote-progress {
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: #e9ede8;
}

    .award-vote-progress > span {
        display: block;
        width: 0;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient( 90deg, var(--gedian-green), #82ad65);
    }

        .award-vote-progress > span.rank-1 {
            background: linear-gradient( 90deg, #d7a51d, #f0c75e);
        }

        .award-vote-progress > span.rank-2 {
            background: linear-gradient( 90deg, #8796a2, #bac4cb);
        }

        .award-vote-progress > span.rank-3 {
            background: linear-gradient( 90deg, #a96d49, #d59a75);
        }

.award-vote-result > b {
    min-width: 31px;
    color: var(--gedian-green-dark);
    font-size: .47rem;
    font-weight: 950;
    direction: ltr;
    text-align: left;
}

.awards-view-more-link {
    display: flex;
    min-height: 35px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 9px;
    border: 1px solid #ddd7c8;
    border-radius: 9px;
    background: #fffdf8;
    color: #7c641f;
    font-size: .54rem;
    font-weight: 950;
    text-decoration: none;
    transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

    .awards-view-more-link:hover {
        transform: translateY(-1px);
        border-color: #cdbc8d;
        background: #fff9e9;
        color: #684f0e;
    }

    .awards-view-more-link b {
        font-size: .74rem;
    }

/* ----- Voting CTA / notification ----- */

.awards-voting-note {
    position: relative;
    display: grid;
    grid-template-columns: 31px minmax(0,1fr) 18px;
    gap: 8px;
    align-items: center;
    margin: 9px;
    padding: 10px;
    border: 1px solid #d9e7cf;
    border-radius: 10px;
    background: linear-gradient( 135deg, #eef6e9, #f8fbf6);
    color: inherit;
    text-decoration: none;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

    .awards-voting-note:hover {
        transform: translateY(-1px);
        border-color: #bdd3ae;
        box-shadow: 0 7px 18px rgba(91,140,59,.10);
    }

    .awards-voting-note > .voting-note-icon {
        display: grid;
        width: 31px;
        height: 31px;
        place-items: center;
        border-radius: 9px;
        background: #fff;
        font-size: .9rem;
    }

.voting-note-eyebrow {
    display: flex !important;
    align-items: center;
    gap: 4px;
    color: #688159;
    font-size: .44rem !important;
    font-weight: 900;
}

    .voting-note-eyebrow i {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #d93939;
        box-shadow: 0 0 0 3px rgba(217,57,57,.11);
    }

.awards-voting-note .voting-note-arrow {
    color: var(--gedian-green-dark);
    font-size: .78rem;
}

.awards-voting-note strong {
    margin-top: 1px;
}

.awards-voting-note small {
    line-height: 1.55;
}

/* ----- Most followed ----- */

.most-followed-section {
    border-top: 5px solid #f2f4ef;
}

.most-followed-head {
    display: flex;
    min-height: 64px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid #e9eee6;
    background: linear-gradient( 145deg, #f4f8f1, #fff);
}

    .most-followed-head > div > span {
        display: block;
        color: var(--gedian-green-dark);
        font-size: .5rem;
        font-weight: 900;
    }

    .most-followed-head h2 {
        margin: 1px 0 0;
        color: var(--gedian-navy);
        font-size: .9rem;
        font-weight: 950;
    }

.most-followed-head-icon {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: #fff2e8;
    font-size: .95rem;
}

.most-followed-intro {
    margin: 0;
    padding: 8px 11px;
    border-bottom: 1px solid #edf1eb;
    color: #7f898f;
    font-size: .5rem;
    line-height: 1.7;
}

.most-followed-message {
    margin: 8px 9px 0;
    padding: 8px;
    border-radius: 8px;
    background: #fff8e9;
    color: #8d7025;
    font-size: .48rem;
    line-height: 1.6;
}

.most-followed-list {
    display: grid;
}

.most-followed-row {
    display: grid;
    grid-template-columns: 39px minmax(0,1fr) 16px;
    gap: 7px;
    min-height: 55px;
    align-items: center;
    padding: 7px 9px;
    border-bottom: 1px solid #edf0ec;
    color: inherit;
    text-decoration: none;
    transition: background .15s ease, transform .15s ease;
}

a.most-followed-row:hover {
    background: #f7faf5;
}

.most-followed-row:last-child {
    border-bottom: 0;
}

.most-followed-row.is-pending {
    opacity: .72;
}

.most-followed-avatar {
    display: grid;
    width: 38px;
    height: 38px;
    overflow: hidden;
    place-items: center;
    border: 1px solid #dfe6dc;
    border-radius: 50%;
    background: #eef4eb;
    color: var(--gedian-green-dark);
    font-size: .65rem;
    font-weight: 950;
}

    .most-followed-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .most-followed-avatar.is-placeholder {
        background: #f3f5f2;
        color: #77827b;
        font-size: .9rem;
    }

.most-followed-copy {
    min-width: 0;
}

    .most-followed-copy small,
    .most-followed-copy strong,
    .most-followed-copy b {
        display: block;
    }

    .most-followed-copy small {
        color: #8a949b;
        font-size: .44rem;
        font-weight: 800;
    }

    .most-followed-copy strong {
        overflow: hidden;
        margin-top: 1px;
        color: #283a48;
        font-size: .58rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .most-followed-copy b {
        margin-top: 2px;
        color: var(--gedian-green-dark);
        font-size: .45rem;
        font-weight: 900;
    }

.most-followed-row.is-pending .most-followed-copy b {
    color: #8a949b;
}

.most-followed-arrow {
    color: #9da69f;
    font-size: .68rem;
}

.most-followed-category-icon {
    font-size: .72rem;
}

.most-followed-footnote {
    display: block;
    padding: 8px 10px;
    border-top: 1px solid #edf0ec;
    background: #fafbf9;
    color: #929a95;
    font-size: .44rem;
    line-height: 1.55;
}

/* ----- Social strip ----- */

.gedian-social-strip {
    display: flex;
    min-height: 88px;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 18px;
    padding: 16px 20px;
    border: 1px solid var(--gedian-border);
    border-radius: 15px;
    background: radial-gradient( circle at 90% 0, rgba(91,140,59,.10), transparent 17rem), linear-gradient( 135deg, #fff, #f8faf7);
    box-shadow: 0 7px 22px rgba(7,26,51,.035);
}

.gedian-social-copy > span {
    display: block;
    color: var(--gedian-green-dark);
    font-size: .54rem;
    font-weight: 900;
}

.gedian-social-copy > strong {
    display: block;
    margin-top: 3px;
    color: var(--gedian-navy);
    font-size: .78rem;
    font-weight: 950;
}

.gedian-social-platforms {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 9px;
    direction: ltr;
}

.gedian-social-icon {
    display: grid;
    width: 39px;
    height: 39px;
    place-items: center;
    border: 1px solid #dfe5dc;
    border-radius: 50%;
    background: #fff;
    color: #263744;
    box-shadow: 0 4px 12px rgba(7,26,51,.045);
    font-family: Arial, sans-serif;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    transition: transform .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease;
}

a.gedian-social-icon:hover {
    transform: translateY(-2px);
    border-color: #b8cbaa;
    color: var(--gedian-green-dark);
    box-shadow: 0 7px 17px rgba(91,140,59,.12);
}

.gedian-social-icon.youtube > span {
    font-size: .84rem;
}

.gedian-social-icon.instagram > span {
    font-size: 1.16rem;
}

.gedian-social-icon.whatsapp > span {
    font-size: .88rem;
}

.gedian-social-icon.is-disabled {
    opacity: .48;
    cursor: default;
}

/* ----- V2.4 responsive ----- */

@media (max-width: 767.98px) {
    .most-followed-list {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .most-followed-row {
        border-left: 1px solid #edf0ec;
    }

    .gedian-social-strip {
        flex-direction: column;
        align-items: stretch;
        gap: 13px;
        padding: 15px;
        text-align: center;
    }

    .gedian-social-platforms {
        justify-content: center;
    }
}

@media (max-width: 479.98px) {
    .most-followed-list {
        grid-template-columns: 1fr;
    }

    .most-followed-row {
        border-left: 0;
    }

    .gedian-social-icon {
        width: 36px;
        height: 36px;
    }

    .gedian-social-platforms {
        gap: 7px;
    }
}
/* =========================================================
   LANDING MATCH PREVIEW - V2.5
   ========================================================= */

body.match-preview-open {
    overflow: hidden;
}

.match-preview-overlay[hidden] {
    display: none !important;
}

.match-preview-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 18px;
    direction: rtl;
}

.match-preview-backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(4, 16, 27, .66);
    backdrop-filter: blur(3px);
    cursor: default;
}

.match-preview-dialog {
    position: relative;
    z-index: 2;
    width: min(820px, 100%);
    max-height: min(92vh, 900px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.42);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 28px 90px rgba(0, 15, 30, .27);
    animation: gedianMatchPreviewIn .18s ease-out;
}

@keyframes gedianMatchPreviewIn {
    from {
        transform: translateY(12px) scale(.985);
        opacity: 0;
    }

    to {
        transform: translateY(0) scale(1);
        opacity: 1;
    }
}

.match-preview-dialog-tools {
    display: flex;
    min-height: 45px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px 8px 9px;
    border-bottom: 1px solid #edf0ed;
    background: #fff;
}

    .match-preview-dialog-tools > strong {
        color: #66727b;
        font-size: .63rem;
        font-weight: 900;
    }

.match-preview-close {
    display: grid;
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    place-items: center;
    padding: 0;
    border: 1px solid #e3e8e2;
    border-radius: 50%;
    background: #f7f9f6;
    color: #53616c;
    font: inherit;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
}

    .match-preview-close:hover {
        border-color: #c9d8c0;
        background: #edf5e8;
        color: var(--gedian-green-dark);
    }

.match-preview-content {
    max-height: calc(min(92vh, 900px) - 45px);
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #fff;
}

.match-preview-loading,
.match-preview-error {
    display: grid;
    min-height: 360px;
    place-items: center;
    align-content: center;
    gap: 12px;
    padding: 30px;
    color: #71808a;
    text-align: center;
}

    .match-preview-loading > span {
        width: 32px;
        height: 32px;
        border: 3px solid #dce7d7;
        border-top-color: var(--gedian-green);
        border-radius: 50%;
        animation: gedianPreviewSpin .75s linear infinite;
    }

@keyframes gedianPreviewSpin {
    to {
        transform: rotate(360deg);
    }
}

.match-preview-error > span {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 50%;
    background: #fff2f2;
    color: #bd3030;
    font-size: 1.1rem;
}

.match-preview-error strong {
    color: #344451;
    font-size: .82rem;
}

/* ----- Google-like compact scoreboard ----- */

.preview-match-header {
    padding: 13px 18px 11px;
    border-bottom: 1px solid #edf0ed;
    background: radial-gradient(circle at 50% -30%, rgba(91,140,59,.11), transparent 45%), #fff;
}

.preview-competition-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 24px;
}

    .preview-competition-row a,
    .preview-competition-row strong {
        color: #53616a;
        font-size: .58rem;
        font-weight: 900;
        text-decoration: none;
    }

        .preview-competition-row a:hover {
            color: var(--gedian-green-dark);
        }

.preview-status-pill {
    display: inline-flex;
    min-height: 20px;
    align-items: center;
    gap: 5px;
    padding: 3px 7px;
    border-radius: 999px;
    background: #f1f3f2;
    color: #737f87;
    font-size: .46rem;
    font-weight: 950;
}

    .preview-status-pill.is-live {
        background: #fff0f0;
        color: #c52525;
    }

        .preview-status-pill.is-live::before {
            content: "";
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: currentColor;
            box-shadow: 0 0 0 3px rgba(197,37,37,.10);
        }

    .preview-status-pill.is-finished {
        background: #f2f5f1;
        color: #66716a;
    }

    .preview-status-pill.is-problem {
        background: #fff6e8;
        color: #9b6b17;
    }

.preview-scoreboard {
    display: grid;
    grid-template-columns: minmax(0,1fr) 128px minmax(0,1fr);
    gap: 16px;
    align-items: center;
    max-width: 640px;
    margin: 10px auto 0;
}

.preview-team-card {
    display: grid;
    min-width: 0;
    justify-items: center;
    gap: 6px;
    color: #263744;
    text-decoration: none;
}

    .preview-team-card:hover strong {
        color: var(--gedian-green-dark);
    }

.preview-team-logo {
    display: grid;
    width: 68px;
    height: 68px;
    overflow: hidden;
    place-items: center;
    border: 1px solid #dfe6dc;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 5px 14px rgba(7,26,51,.06);
}

    .preview-team-logo img {
        width: 100%;
        height: 100%;
        padding: 7px;
        object-fit: contain;
    }

    .preview-team-logo > span {
        display: grid;
        width: 100%;
        height: 100%;
        place-items: center;
        background: #edf4e9;
        color: var(--gedian-green-dark);
        font-size: 1rem;
        font-weight: 950;
    }

.preview-team-card > strong {
    overflow: hidden;
    max-width: 190px;
    color: #263744;
    font-size: .78rem;
    font-weight: 950;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.preview-score-center {
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 3px;
    min-height: 86px;
}

    .preview-score-center > strong {
        color: #142a39;
        font-size: 1.55rem;
        font-weight: 950;
        line-height: 1;
        direction: ltr;
    }

    .preview-score-center > span {
        color: #78848c;
        font-size: .52rem;
        font-weight: 850;
    }

    .preview-score-center > small {
        color: #9a7a25;
        font-size: .46rem;
        font-weight: 900;
    }

.preview-match-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px 10px;
    margin-top: 9px;
    color: #7e8991;
    font-size: .49rem;
    font-weight: 800;
}

    .preview-match-meta span {
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }

.preview-gedian-verified {
    color: var(--gedian-green-dark) !important;
    font-weight: 950 !important;
}

/* ----- Small tabs ----- */

.match-preview-tabs {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    overflow-x: auto;
    align-items: stretch;
    justify-content: center;
    padding: 0 12px;
    border-bottom: 1px solid #e9ede8;
    background: rgba(255,255,255,.97);
    backdrop-filter: blur(8px);
    scrollbar-width: none;
}

    .match-preview-tabs::-webkit-scrollbar {
        display: none;
    }

.match-preview-tab {
    position: relative;
    flex: 0 0 auto;
    min-width: 98px;
    min-height: 43px;
    padding: 0 10px;
    border: 0;
    background: transparent;
    color: #7b858c;
    font: inherit;
    font-size: .56rem;
    font-weight: 900;
    cursor: pointer;
}

    .match-preview-tab::after {
        content: "";
        position: absolute;
        right: 25%;
        bottom: -1px;
        left: 25%;
        height: 3px;
        border-radius: 4px 4px 0 0;
        background: transparent;
    }

    .match-preview-tab.is-active {
        color: var(--gedian-green-dark);
    }

        .match-preview-tab.is-active::after {
            background: var(--gedian-green);
        }

.match-preview-panel {
    display: none;
    min-height: 300px;
    padding: 16px 18px 18px;
}

    .match-preview-panel.is-active {
        display: block;
    }

/* ----- General / pitch ----- */

.preview-general-intro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    max-width: 560px;
    margin: 0 auto 11px;
}

    .preview-general-intro > div > span {
        display: block;
        color: #8b969d;
        font-size: .47rem;
        font-weight: 850;
    }

    .preview-general-intro > div > strong {
        display: block;
        margin-top: 1px;
        color: #304250;
        font-size: .66rem;
        font-weight: 950;
    }

.preview-formations-mini {
    display: flex;
    align-items: center;
    gap: 6px;
    direction: ltr;
}

    .preview-formations-mini span {
        padding: 4px 7px;
        border: 1px solid #dce5d7;
        border-radius: 7px;
        background: #f7faf5;
        color: #4b6640;
        font-size: .48rem;
        font-weight: 950;
    }

.preview-pitch-wrap {
    width: min(100%, 490px);
    margin: 0 auto;
}

.preview-football-pitch {
    position: relative;
    width: 100%;
    aspect-ratio: 68 / 92;
    overflow: hidden;
    border: 3px solid rgba(255,255,255,.88);
    border-radius: 16px;
    background: repeating-linear-gradient( 0deg, rgba(255,255,255,.035) 0, rgba(255,255,255,.035) 9.1%, rgba(0,0,0,.02) 9.1%, rgba(0,0,0,.02) 18.2% ), linear-gradient(180deg, #43862f, #347629);
    box-shadow: 0 0 0 1px #2f6b25, 0 14px 34px rgba(38,91,29,.17);
}

    .preview-football-pitch::before {
        content: "";
        position: absolute;
        z-index: 1;
        top: 50%;
        right: 0;
        left: 0;
        height: 1.5px;
        background: rgba(255,255,255,.75);
    }

    .preview-football-pitch::after {
        content: "";
        position: absolute;
        z-index: 1;
        top: 50%;
        left: 50%;
        width: 25%;
        aspect-ratio: 1;
        border: 1.5px solid rgba(255,255,255,.75);
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }

.preview-pitch-outer-line {
    position: absolute;
    z-index: 1;
    inset: 2.5%;
    border: 1.5px solid rgba(255,255,255,.78);
    pointer-events: none;
}

.preview-pitch-box {
    position: absolute;
    z-index: 1;
    left: 21%;
    width: 58%;
    height: 15%;
    border: 1.5px solid rgba(255,255,255,.78);
    pointer-events: none;
}

    .preview-pitch-box.is-top {
        top: 2.5%;
        border-top: 0;
    }

    .preview-pitch-box.is-bottom {
        bottom: 2.5%;
        border-bottom: 0;
    }

.preview-pitch-goal-box {
    position: absolute;
    z-index: 1;
    left: 36%;
    width: 28%;
    height: 6%;
    border: 1.5px solid rgba(255,255,255,.78);
    pointer-events: none;
}

    .preview-pitch-goal-box.is-top {
        top: 2.5%;
        border-top: 0;
    }

    .preview-pitch-goal-box.is-bottom {
        bottom: 2.5%;
        border-bottom: 0;
    }

.preview-pitch-center-dot {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(255,255,255,.9);
    transform: translate(-50%, -50%);
}

.preview-pitch-player {
    position: absolute;
    z-index: 5;
    display: grid;
    width: 66px;
    justify-items: center;
    gap: 2px;
    color: #fff;
    text-decoration: none;
    transform: translate(-50%, -50%);
}

    .preview-pitch-player:hover {
        z-index: 10;
    }

.preview-pitch-player-avatar {
    position: relative;
    display: grid;
    width: 39px;
    height: 39px;
    overflow: visible;
    place-items: center;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #dfe9db;
    box-shadow: 0 4px 10px rgba(0,0,0,.25);
}

.preview-pitch-player.is-home .preview-pitch-player-avatar {
    outline: 3px solid rgba(17,70,134,.78);
}

.preview-pitch-player.is-away .preview-pitch-player-avatar {
    outline: 3px solid rgba(172,48,48,.78);
}

.preview-pitch-player-avatar img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 50%;
    object-fit: cover;
}

.preview-pitch-player-avatar > span:not(.preview-shirt-number) {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    overflow: hidden;
    border-radius: 50%;
    background: #e7efe3;
    color: #2c5f24;
    font-size: .62rem;
    font-weight: 950;
}

.preview-shirt-number {
    position: absolute;
    right: -7px;
    bottom: -3px;
    display: grid;
    min-width: 18px;
    height: 18px;
    place-items: center;
    padding: 0 3px;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #152f43;
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: .42rem;
    font-weight: 900;
}

.preview-pitch-player-name {
    overflow: hidden;
    max-width: 66px;
    padding: 2px 4px;
    border-radius: 5px;
    background: rgba(9,28,19,.75);
    color: #fff;
    font-size: .42rem;
    font-weight: 900;
    line-height: 1.2;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(0,0,0,.35);
}

.preview-pitch-empty {
    position: absolute;
    z-index: 8;
    top: 50%;
    left: 50%;
    width: min(82%, 310px);
    padding: 14px;
    border: 1px solid rgba(255,255,255,.32);
    border-radius: 12px;
    background: rgba(6,36,18,.72);
    color: #fff;
    text-align: center;
    transform: translate(-50%, -50%);
    backdrop-filter: blur(5px);
}

    .preview-pitch-empty strong,
    .preview-pitch-empty small {
        display: block;
    }

    .preview-pitch-empty strong {
        font-size: .66rem;
    }

    .preview-pitch-empty small {
        margin-top: 4px;
        color: rgba(255,255,255,.78);
        font-size: .48rem;
        line-height: 1.6;
    }

.preview-pitch-legend {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 10px;
    color: #748087;
    font-size: .46rem;
    font-weight: 850;
}

    .preview-pitch-legend span {
        display: inline-flex;
        align-items: center;
        gap: 5px;
    }

    .preview-pitch-legend i {
        width: 9px;
        height: 9px;
        border-radius: 50%;
    }

    .preview-pitch-legend .is-home i {
        background: #114686;
    }

    .preview-pitch-legend .is-away i {
        background: #ac3030;
    }

/* ----- Lineup and players ----- */

.preview-two-team-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
}

.preview-team-list-card {
    overflow: hidden;
    border: 1px solid #e1e7df;
    border-radius: 13px;
    background: #fff;
}

.preview-team-list-head {
    display: flex;
    min-height: 52px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 10px;
    border-bottom: 1px solid #e8ede6;
    background: #f8faf7;
}

    .preview-team-list-head > div span,
    .preview-team-list-head > div strong {
        display: block;
    }

    .preview-team-list-head > div span {
        color: #8a959b;
        font-size: .44rem;
        font-weight: 850;
    }

    .preview-team-list-head > div strong {
        margin-top: 1px;
        color: #354754;
        font-size: .62rem;
        font-weight: 950;
    }

.preview-formation-badge {
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 7px;
    background: #eaf3e5;
    color: var(--gedian-green-dark);
    font-size: .46rem;
    font-weight: 950;
    direction: ltr;
}

.preview-player-list {
    display: grid;
}

.preview-player-row {
    display: grid;
    grid-template-columns: 36px minmax(0,1fr) auto;
    gap: 8px;
    min-height: 50px;
    align-items: center;
    padding: 6px 9px;
    border-bottom: 1px solid #edf0ed;
    color: inherit;
    text-decoration: none;
}

    .preview-player-row:last-child {
        border-bottom: 0;
    }

    .preview-player-row[href]:hover {
        background: #f8faf7;
    }

.preview-player-photo {
    display: grid;
    width: 35px;
    height: 35px;
    overflow: hidden;
    place-items: center;
    border: 1px solid #dfe6dc;
    border-radius: 50%;
    background: #edf3e9;
}

    .preview-player-photo img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .preview-player-photo > span {
        display: grid;
        width: 100%;
        height: 100%;
        place-items: center;
        color: var(--gedian-green-dark);
        font-size: .55rem;
        font-weight: 950;
    }

.preview-player-copy {
    min-width: 0;
}

    .preview-player-copy strong,
    .preview-player-copy small {
        display: block;
    }

    .preview-player-copy strong {
        overflow: hidden;
        color: #344653;
        font-size: .56rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .preview-player-copy small {
        overflow: hidden;
        margin-top: 2px;
        color: #929ba1;
        font-size: .43rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.preview-player-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: #68777f;
    font-size: .43rem;
    font-weight: 900;
    white-space: nowrap;
}

    .preview-player-badge b {
        display: grid;
        min-width: 20px;
        height: 20px;
        place-items: center;
        padding: 0 4px;
        border-radius: 6px;
        background: #eef2ed;
        color: #354953;
        font-family: Arial, sans-serif;
        font-size: .44rem;
    }

.preview-team-empty {
    padding: 22px 12px;
    color: #8d979e;
    font-size: .5rem;
    line-height: 1.7;
    text-align: center;
}

/* ----- Possession ----- */

.preview-possession-wrap {
    max-width: 590px;
    margin: 0 auto;
}

.preview-possession-title {
    margin-bottom: 16px;
    text-align: center;
}

    .preview-possession-title span,
    .preview-possession-title strong {
        display: block;
    }

    .preview-possession-title span {
        color: #8c979d;
        font-size: .48rem;
        font-weight: 850;
    }

    .preview-possession-title strong {
        margin-top: 3px;
        color: #304250;
        font-size: .74rem;
        font-weight: 950;
    }

.preview-possession-team {
    margin-top: 15px;
}

.preview-possession-team-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
}

    .preview-possession-team-head strong {
        color: #394b57;
        font-size: .6rem;
        font-weight: 950;
    }

    .preview-possession-team-head b {
        color: var(--gedian-green-dark);
        font-family: Arial, sans-serif;
        font-size: 1.05rem;
        font-weight: 950;
        direction: ltr;
    }

.preview-possession-track {
    height: 11px;
    overflow: hidden;
    border-radius: 999px;
    background: #eef1ed;
}

    .preview-possession-track span {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, #4f8f38, #78aa61);
    }

.preview-possession-team.is-away .preview-possession-track span {
    background: linear-gradient(90deg, #5f7387, #8ba0b0);
}

.preview-possession-note {
    margin-top: 15px;
    padding: 9px 11px;
    border-radius: 9px;
    background: #f7f9f6;
    color: #8c969c;
    font-size: .45rem;
    line-height: 1.65;
    text-align: center;
}

.preview-empty-panel {
    display: grid;
    min-height: 250px;
    place-items: center;
    align-content: center;
    gap: 8px;
    color: #8b969d;
    text-align: center;
}

    .preview-empty-panel > span {
        font-size: 1.6rem;
    }

    .preview-empty-panel > strong {
        color: #43535f;
        font-size: .68rem;
    }

    .preview-empty-panel > small {
        max-width: 430px;
        font-size: .49rem;
        line-height: 1.7;
    }

/* ----- Bottom action ----- */

.match-preview-footer {
    position: sticky;
    bottom: 0;
    z-index: 25;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px 13px;
    border-top: 1px solid #e9ede8;
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(8px);
}

.match-preview-details-button {
    display: inline-flex;
    min-width: 210px;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 18px;
    border-radius: 9px;
    background: var(--gedian-green);
    color: #fff;
    font-size: .57rem;
    font-weight: 950;
    text-decoration: none;
    box-shadow: 0 7px 18px rgba(91,140,59,.18);
}

    .match-preview-details-button:hover {
        background: var(--gedian-green-dark);
        color: #fff;
    }

@media (max-width: 767.98px) {
    .match-preview-overlay {
        padding: 8px;
        align-items: end;
    }

    .match-preview-dialog {
        width: 100%;
        max-height: 95vh;
        border-radius: 18px 18px 10px 10px;
    }

    .match-preview-content {
        max-height: calc(95vh - 45px);
    }

    .preview-match-header {
        padding: 11px 10px 10px;
    }

    .preview-scoreboard {
        grid-template-columns: minmax(0,1fr) 88px minmax(0,1fr);
        gap: 6px;
    }

    .preview-team-logo {
        width: 54px;
        height: 54px;
    }

    .preview-team-card > strong {
        max-width: 110px;
        font-size: .63rem;
    }

    .preview-score-center > strong {
        font-size: 1.22rem;
    }

    .match-preview-tabs {
        justify-content: flex-start;
        padding: 0 4px;
    }

    .match-preview-tab {
        min-width: 88px;
    }

    .match-preview-panel {
        padding: 13px 10px 15px;
    }

    .preview-two-team-grid {
        grid-template-columns: 1fr;
    }

    .preview-football-pitch {
        border-radius: 13px;
    }

    .preview-pitch-player {
        width: 52px;
    }

    .preview-pitch-player-avatar {
        width: 31px;
        height: 31px;
        border-width: 1.5px;
    }

    .preview-pitch-player.is-home .preview-pitch-player-avatar,
    .preview-pitch-player.is-away .preview-pitch-player-avatar {
        outline-width: 2px;
    }

    .preview-pitch-player-name {
        max-width: 52px;
        font-size: .36rem;
    }

    .preview-shirt-number {
        right: -6px;
        min-width: 16px;
        height: 16px;
        border-width: 1.5px;
        font-size: .37rem;
    }
}

@media (max-width: 420px) {
    .preview-team-logo {
        width: 48px;
        height: 48px;
    }

    .preview-team-card > strong {
        max-width: 96px;
        font-size: .58rem;
    }

    .preview-scoreboard {
        grid-template-columns: minmax(0,1fr) 76px minmax(0,1fr);
    }

    .preview-score-center > strong {
        font-size: 1.05rem;
    }

    .preview-general-intro {
        align-items: flex-start;
        flex-direction: column;
    }

    .preview-pitch-player {
        width: 45px;
    }

    .preview-pitch-player-avatar {
        width: 28px;
        height: 28px;
    }

    .preview-pitch-player-name {
        max-width: 45px;
        font-size: .33rem;
    }
}






/* =========================================================
   GEDIAN INDEX 2026 - AUTHORITATIVE MOBILE-FIRST OVERRIDES
   This block intentionally comes last. It is scoped to Index so
   old rules in site.css cannot re-break the landing layout.
   ========================================================= */

html,
body {
    overflow-x: hidden;
}

.gedian-landing.gs-redesigned-landing {
    --index-green: #5B8C3B;
    --index-green-dark: #466f2d;
    --index-green-soft: #edf5e8;
    --index-text: #1f2937;
    --index-muted: #6b7280;
    --index-border: #e5e7eb;
    --index-bg: #f6f8f5;
    --index-card: #ffffff;
    width: 100%;
    min-height: 100vh;
    padding: 8px 0 30px !important;
    background: var(--index-bg) !important;
    color: var(--index-text);
    font-family: "Tajawal", "Segoe UI", Tahoma, Arial, sans-serif;
}

.gedian-landing .gedian-index-shell {
    width: min(100%, 1320px);
    margin-inline: auto;
    padding-inline: 8px;
}

.gedian-landing .gedian-page-alert {
    margin: 0 0 8px;
    padding: 10px 12px;
    border: 1px solid #ead8aa;
    border-radius: 12px;
    background: #fff9ea;
    color: #72591d;
    font-size: .88rem;
    line-height: 1.7;
}

.gedian-landing .gs-page {
    min-height: 0;
    padding: 0 !important;
}

/* -------------------------
   Compact score ticker
   ------------------------- */
.gedian-landing .gs-score-ticker {
    width: 100%;
    max-width: none;
    min-height: 48px;
    margin: 0 auto 8px !important;
    border: 1px solid #dfe5dc;
    border-radius: 13px;
    background: #101512;
    box-shadow: 0 5px 14px rgba(24, 38, 27, .08);
}

.gedian-landing .gs-score-track {
    min-height: 46px;
}

.gedian-landing .gs-score-mini {
    min-width: 215px;
    min-height: 46px;
    padding: 6px 10px;
}

.gedian-landing .gs-score-league,
.gedian-landing .gs-mini-team span {
    font-size: .72rem;
}

/* -------------------------
   Gedian Famous - compact 3D
   ------------------------- */
.gedian-landing .gs-famous-bar {
    position: relative;
    width: calc(100% - 8px);
    max-width: 1080px !important;
    min-height: 166px;
    margin: 10px auto 12px !important;
    display: grid !important;
    grid-template-columns: 1fr 42px !important;
    grid-template-rows: auto 1fr;
    overflow: hidden;
    border: 1px solid rgba(91, 140, 59, .24) !important;
    border-radius: 18px !important;
    background: radial-gradient(circle at 92% -20%, rgba(140, 190, 102, .22), transparent 42%), linear-gradient(145deg, #ffffff 0%, #f3f8ef 55%, #eef5e9 100%) !important;
    box-shadow: 0 14px 28px rgba(52, 75, 44, .11), 0 3px 0 #d8e4d1, inset 0 1px 0 rgba(255,255,255,.9) !important;
    transform: perspective(900px) rotateX(.5deg);
}

    .gedian-landing .gs-famous-bar::after {
        content: "";
        position: absolute;
        inset: auto 8% -18px 8%;
        height: 20px;
        border-radius: 50%;
        background: rgba(51, 77, 41, .13);
        filter: blur(12px);
        pointer-events: none;
    }

.gedian-landing .gs-famous-title {
    grid-column: 1 / -1 !important;
    min-height: 48px;
    padding: 8px 14px;
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    justify-content: space-between !important;
    gap: 10px;
    border: 0 !important;
    border-bottom: 1px solid rgba(91,140,59,.16) !important;
    background: linear-gradient(90deg, rgba(91,140,59,.10), rgba(255,255,255,.55));
    text-align: right !important;
}

    .gedian-landing .gs-famous-title > span {
        color: #263622;
        font-size: 1rem;
        font-weight: 950;
    }

    .gedian-landing .gs-famous-title > small {
        color: #74806f;
        font-size: .75rem !important;
        font-weight: 700;
    }

.gedian-landing .gs-famous-stage {
    min-width: 0;
    min-height: 116px !important;
}

.gedian-landing .gs-famous-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(54px, auto);
    gap: 6px;
    padding: 7px;
}

.gedian-landing .gs-famous-item {
    min-width: 0;
    gap: 8px !important;
    padding: 7px 8px !important;
    border: 1px solid rgba(91,140,59,.14) !important;
    border-radius: 12px;
    background: rgba(255,255,255,.78);
    box-shadow: 0 4px 10px rgba(50,70,43,.055), inset 0 1px 0 #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.gedian-landing a.gs-famous-item:hover {
    transform: translateY(-2px) scale(1.01);
    border-color: rgba(91,140,59,.34) !important;
    background: #fff;
    box-shadow: 0 8px 16px rgba(53,77,44,.10), inset 0 1px 0 #fff;
}

.gedian-landing .gs-famous-avatar,
.gedian-landing .gs-famous-item img {
    flex: 0 0 40px;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50%;
}

.gedian-landing .gs-famous-item small {
    margin: 0 0 1px;
    font-size: .68rem !important;
}

.gedian-landing .gs-famous-item strong {
    font-size: .82rem !important;
}

.gedian-landing .gs-famous-item em {
    display: block;
    overflow: hidden;
    margin-top: 1px;
    color: var(--index-green-dark) !important;
    font-size: .68rem !important;
    font-style: normal;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gedian-landing .gs-famous-controls {
    grid-column: 2;
    grid-row: 2;
    border-right: 1px solid rgba(91,140,59,.14);
    background: rgba(255,255,255,.55);
}

    .gedian-landing .gs-famous-controls button {
        min-height: 50%;
        background: transparent !important;
        font-size: 1rem;
    }

/* -------------------------
   Main layout: MOBILE FIRST
   Main content first; sidebar follows.
   ------------------------- */
.gedian-landing .gs-home-grid {
    width: 100%;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
        "main"
        "side" !important;
    gap: 10px !important;
    direction: rtl !important;
    align-items: start;
}

.gedian-landing .gs-main-show {
    grid-area: main;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--index-border) !important;
    border-radius: 15px !important;
    background: var(--index-card);
    box-shadow: 0 5px 16px rgba(31,41,55,.045) !important;
}

.gedian-landing .gs-side-column {
    grid-area: side;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px !important;
}

.gedian-landing .gs-side-card {
    margin: 0;
    padding: 11px !important;
    border: 1px solid var(--index-border) !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 14px rgba(31,41,55,.035) !important;
}

/* -------------------------
   Main navigation tabs
   ------------------------- */
.gedian-landing .gs-main-tabs {
    position: relative;
    display: flex !important;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 4px;
    padding: 6px;
    border-bottom: 1px solid var(--index-border);
    background: #fff;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

    .gedian-landing .gs-main-tabs::-webkit-scrollbar {
        display: none;
    }

.gedian-landing .gs-tab {
    flex: 0 0 auto !important;
    min-width: max-content;
    min-height: 40px;
    padding: 8px 12px !important;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #526055;
    font-size: .83rem !important;
    font-weight: 800;
    white-space: nowrap;
}

    .gedian-landing .gs-tab.active {
        border-color: #cfe0c5;
        background: var(--index-green-soft) !important;
        color: var(--index-green-dark) !important;
    }

        .gedian-landing .gs-tab.active::after {
            display: none !important;
        }

.gedian-landing .gs-tab-panel {
    padding: 8px !important;
}

.gedian-landing .gs-panel-heading {
    gap: 8px;
    margin-bottom: 9px;
    padding: 3px 2px 7px;
}

    .gedian-landing .gs-panel-heading h2,
    .gedian-landing .content-panel-head h2 {
        font-size: 1.05rem !important;
        line-height: 1.35;
    }

    .gedian-landing .gs-panel-heading span,
    .gedian-landing .gs-panel-heading small,
    .gedian-landing .content-panel-head p,
    .gedian-landing .section-kicker {
        font-size: .76rem !important;
        line-height: 1.6;
    }

/* -------------------------
   Date navigation
   ------------------------- */
.gedian-landing .gs-date-strip {
    display: flex !important;
    align-items: center;
    gap: 6px !important;
    overflow-x: auto;
    padding: 2px 1px 7px;
    margin-bottom: 8px !important;
    scrollbar-width: none;
}

    .gedian-landing .gs-date-strip::-webkit-scrollbar {
        display: none;
    }

.gedian-landing .gs-date-pill {
    flex: 0 0 auto;
    min-width: 74px;
    height: 38px;
    padding-inline: 10px;
    font-size: .76rem;
}

.gedian-landing .gs-date-arrow {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    font-size: 1rem;
}

/* -------------------------
   Match cards - mobile first
   ------------------------- */
.gedian-landing .gs-match-list {
    gap: 8px !important;
}

.gedian-landing .gs-match-row {
    min-height: 0 !important;
    grid-template-columns: minmax(0,1fr) !important;
    border-radius: 13px !important;
}

.gedian-landing .gs-match-competition {
    grid-template-columns: 42px minmax(0,1fr) !important;
    gap: 8px !important;
    padding: 8px 9px !important;
    border-left: 0 !important;
    border-bottom: 1px solid #eef1ed;
}

.gedian-landing .gs-competition-logo-link {
    grid-row: 1 / span 2;
    width: 40px !important;
    height: 40px !important;
    justify-self: start !important;
}

.gedian-landing .gs-competition-name {
    font-size: .82rem !important;
    line-height: 1.4;
}

.gedian-landing .gs-fixture-details {
    grid-column: 2;
    padding: 0 !important;
    border: 0 !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    gap: 4px 8px !important;
    font-size: .68rem !important;
}

.gedian-landing .gs-match-center {
    grid-template-columns: minmax(74px,1fr) 78px minmax(74px,1fr) !important;
    min-height: 92px;
    border: 0 !important;
}

.gedian-landing .gs-team {
    padding: 7px 4px !important;
}

    .gedian-landing .gs-team-logo,
    .gedian-landing .gs-team img {
        width: 44px !important;
        height: 44px !important;
    }

    .gedian-landing .gs-team strong {
        max-width: 100%;
        font-size: .76rem !important;
    }

.gedian-landing .gs-score-button {
    min-height: 78px !important;
    padding: 4px !important;
}

.gedian-landing .gs-score-center b {
    font-size: 1.18rem !important;
}

.gedian-landing .gs-match-time,
.gedian-landing .gs-status,
.gedian-landing .gs-score-button small {
    font-size: .68rem !important;
}

.gedian-landing .gs-match-stadium {
    min-height: 46px;
    flex-direction: row !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    padding: 7px 9px !important;
    border-top: 1px solid #eef1ed;
    text-align: right !important;
}

    .gedian-landing .gs-stadium-logo,
    .gedian-landing .gs-match-stadium img {
        flex: 0 0 34px;
        width: 34px !important;
        height: 34px !important;
    }

    .gedian-landing .gs-match-stadium strong {
        font-size: .72rem !important;
    }

/* -------------------------
   News / community / offers
   ------------------------- */
.gedian-landing .gs-news-layout,
.gedian-landing .gs-featured-news,
.gedian-landing .gs-news-side-list,
.gedian-landing .gs-products-grid,
.gedian-landing .gedian-community-activity-grid {
    grid-template-columns: minmax(0,1fr) !important;
}

.gedian-landing .gs-featured-news-body,
.gedian-landing .gs-small-news-body,
.gedian-landing .gedian-posts-list {
    padding: 9px !important;
}

    .gedian-landing .gs-featured-news-body h2 {
        font-size: 1.08rem !important;
    }

    .gedian-landing .gs-featured-news-body p,
    .gedian-landing .gs-small-news p,
    .gedian-landing .gedian-post-text p {
        font-size: .79rem !important;
        line-height: 1.75 !important;
    }

.gedian-landing .gedian-community-post,
.gedian-landing .gs-product-card {
    border-radius: 13px !important;
}

.gedian-landing .gedian-post-author-name {
    font-size: .82rem !important;
}

.gedian-landing .gedian-post-meta,
.gedian-landing .gedian-post-read-more,
.gedian-landing .gedian-post-engagement,
.gedian-landing .gs-product-specs,
.gedian-landing .gs-offer-toolbar > span {
    font-size: .69rem !important;
}

/* -------------------------
   Sidebar readability
   ------------------------- */
.gedian-landing .gs-side-heading h2 {
    font-size: .96rem !important;
}

.gedian-landing .gs-side-heading a,
.gedian-landing .gs-side-message small,
.gedian-landing .gs-award-content small,
.gedian-landing .gs-vote-slide small,
.gedian-landing .gs-vote-description {
    font-size: .72rem !important;
    line-height: 1.55;
}

.gedian-landing .gs-award-content h3,
.gedian-landing .gs-vote-slide h3 {
    font-size: .9rem !important;
}

/* -------------------------
   Social strip
   ------------------------- */
.gedian-landing .gedian-social-strip {
    width: 100%;
    min-height: 0 !important;
    margin: 10px auto 0 !important;
    padding: 12px !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 10px !important;
    border: 1px solid var(--index-border) !important;
    border-radius: 14px !important;
    background: linear-gradient(145deg, #fff, #f5f9f2) !important;
}

.gedian-landing .gedian-social-copy > span {
    font-size: .72rem !important;
}

.gedian-landing .gedian-social-copy > strong {
    font-size: .9rem !important;
    line-height: 1.5;
}

.gedian-landing .gedian-social-platforms {
    justify-content: flex-start;
    gap: 7px !important;
}

.gedian-landing .gedian-social-icon {
    width: 36px !important;
    height: 36px !important;
}

/* -------------------------
   Match preview mobile safety
   ------------------------- */
.match-preview-dialog {
    width: min(calc(100vw - 16px), 980px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 15px !important;
}

.match-preview-content {
    overflow-x: hidden;
}

/* =========================================================
   TABLET
   ========================================================= */
@media (min-width: 600px) {
    .gedian-landing .gedian-index-shell {
        padding-inline: 12px;
    }

    .gedian-landing .gs-famous-bar {
        min-height: 112px;
        grid-template-columns: 150px minmax(0,1fr) 42px !important;
        grid-template-rows: 1fr;
    }

    .gedian-landing .gs-famous-title {
        grid-column: 1 !important;
        grid-row: 1;
        min-height: 112px;
        flex-direction: column !important;
        justify-content: center !important;
        border-bottom: 0 !important;
        border-left: 1px solid rgba(91,140,59,.16) !important;
        text-align: center !important;
    }

    .gedian-landing .gs-famous-stage {
        grid-column: 2;
        grid-row: 1;
        min-height: 112px !important;
    }

    .gedian-landing .gs-famous-row {
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
        grid-auto-rows: 1fr;
        padding: 7px;
    }

    .gedian-landing .gs-famous-controls {
        grid-column: 3;
        grid-row: 1;
    }

    .gedian-landing .gs-side-column {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .gedian-landing .gs-reserve-card {
        grid-column: 1 / -1;
    }

    .gedian-landing .gs-news-side-list,
    .gedian-landing .gs-products-grid,
    .gedian-landing .gedian-community-activity-grid {
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    }

    .gedian-landing .gedian-social-strip {
        grid-template-columns: minmax(0,1fr) auto !important;
        align-items: center;
    }
}

/* =========================================================
   DESKTOP - restore accepted 30/70 structure
   ========================================================= */
@media (min-width: 992px) {
    .gedian-landing.gs-redesigned-landing {
        padding-top: 10px !important;
    }

    .gedian-landing .gedian-index-shell {
        padding-inline: 16px;
    }

    .gedian-landing .gs-score-ticker {
        margin-bottom: 10px !important;
    }

    .gedian-landing .gs-famous-bar {
        max-width: 1120px !important;
        min-height: 94px;
        grid-template-columns: 160px minmax(0,1fr) 42px !important;
    }

    .gedian-landing .gs-famous-title,
    .gedian-landing .gs-famous-stage {
        min-height: 94px !important;
    }

    .gedian-landing .gs-famous-row {
        grid-template-columns: repeat(4, minmax(0,1fr)) !important;
        gap: 5px;
    }

    .gedian-landing .gs-famous-item {
        padding: 7px 9px !important;
    }

    .gedian-landing .gs-home-grid {
        direction: ltr !important;
        grid-template-columns: minmax(260px, 30%) minmax(0, 70%) !important;
        grid-template-areas: "side main" !important;
        gap: 14px !important;
    }

    .gedian-landing .gs-main-show,
    .gedian-landing .gs-side-column {
        direction: rtl;
    }

    .gedian-landing .gs-side-column {
        grid-template-columns: minmax(0,1fr);
    }

    .gedian-landing .gs-reserve-card {
        grid-column: auto;
    }

    .gedian-landing .gs-tab-panel {
        padding: 12px !important;
    }

    .gedian-landing .gs-main-tabs {
        justify-content: flex-start;
        overflow: visible;
    }

    .gedian-landing .gs-tab {
        flex: 1 1 0 !important;
        min-width: 0;
        text-align: center;
    }

    .gedian-landing .gs-date-strip {
        display: grid !important;
        grid-template-columns: 38px repeat(6, minmax(68px,1fr)) 38px !important;
        overflow: visible;
    }

    .gedian-landing .gs-date-pill {
        min-width: 0;
    }

    .gedian-landing .gs-match-row {
        grid-template-columns: 29% 49% 22% !important;
        min-height: 104px !important;
    }

    .gedian-landing .gs-match-competition {
        grid-template-columns: 48px minmax(0,1fr) !important;
        border-bottom: 0;
        border-left: 1px solid var(--index-border) !important;
        padding: 9px 10px !important;
    }

    .gedian-landing .gs-fixture-details {
        grid-column: 1 / -1;
        padding-right: 50px !important;
        flex-direction: column !important;
        gap: 2px !important;
    }

    .gedian-landing .gs-match-center {
        grid-template-columns: minmax(90px,1fr) 92px minmax(90px,1fr) !important;
        border-left: 1px solid var(--index-border) !important;
    }

    .gedian-landing .gs-match-stadium {
        min-height: 0;
        flex-direction: column !important;
        justify-content: center !important;
        padding: 8px !important;
        border-top: 0;
        text-align: center !important;
    }

        .gedian-landing .gs-stadium-logo,
        .gedian-landing .gs-match-stadium img {
            width: 44px !important;
            height: 44px !important;
        }

    .gedian-landing .gs-news-layout {
        grid-template-columns: minmax(0,1fr) 36% !important;
    }

    .gedian-landing .gs-featured-news {
        grid-template-columns: 48% minmax(0,1fr) !important;
    }

    .gedian-landing .gedian-social-strip {
        padding: 14px 16px !important;
    }
}

/* =========================================================
   LARGE DESKTOP
   ========================================================= */
@media (min-width: 1280px) {
    .gedian-landing .gedian-index-shell {
        padding-inline: 18px;
    }

    .gedian-landing .gs-home-grid {
        grid-template-columns: minmax(290px, 29%) minmax(0, 71%) !important;
        gap: 16px !important;
    }

    .gedian-landing .gs-match-competition {
        grid-template-columns: 54px minmax(0,1fr) minmax(94px,.8fr) !important;
    }

    .gedian-landing .gs-fixture-details {
        grid-column: auto;
        padding-right: 10px !important;
        border-right: 2px dotted #a9c999 !important;
    }
}

/* =========================================================
   2026-08-23 TARGETED FAMOUS + TICKER ADJUSTMENT
   - Famous width matches the scores ticker/page shell.
   - Famous height is approximately 40% lower at each breakpoint.
   - Scores ticker travels visually from left to right.
   ========================================================= */

/* Score ticker: keep the data/order unchanged, reverse only visual travel. */
.gedian-landing .gs-score-track {
    animation-name: gsTickerLeftToRight !important;
}

@keyframes gsTickerLeftToRight {
    from {
        transform: translateX(-50%);
    }

    to {
        transform: translateX(0);
    }
}

/* Famous: same horizontal span as the score ticker. */
.gedian-landing .gs-famous-bar {
    width: 100% !important;
    max-width: none !important;
    min-height: 100px !important; /* was 166px: ~40% reduction */
    margin: 6px 0 10px !important;
    grid-template-columns: minmax(0, 1fr) 36px !important;
    grid-template-rows: 30px 70px !important;
    border-radius: 15px !important;
    transform: perspective(900px) rotateX(.35deg);
}

.gedian-landing .gs-famous-title {
    min-height: 30px !important;
    padding: 3px 10px !important;
    gap: 7px !important;
}

    .gedian-landing .gs-famous-title > span {
        font-size: .86rem !important;
    }

    .gedian-landing .gs-famous-title > small {
        font-size: .64rem !important;
    }

.gedian-landing .gs-famous-stage {
    min-height: 70px !important;
    height: 70px !important;
}

.gedian-landing .gs-famous-row {
    height: 70px !important;
    grid-auto-rows: minmax(31px, 1fr) !important;
    gap: 3px !important;
    padding: 3px !important;
}

.gedian-landing .gs-famous-item {
    min-height: 0 !important;
    gap: 5px !important;
    padding: 2px 5px !important;
    border-radius: 10px !important;
}

    .gedian-landing .gs-famous-avatar,
    .gedian-landing .gs-famous-item img {
        flex-basis: 28px !important;
        width: 28px !important;
        height: 28px !important;
    }

    .gedian-landing .gs-famous-item small {
        font-size: .58rem !important;
        line-height: 1.05 !important;
    }

    .gedian-landing .gs-famous-item strong {
        font-size: .70rem !important;
        line-height: 1.08 !important;
    }

    .gedian-landing .gs-famous-item em {
        font-size: .58rem !important;
        line-height: 1.05 !important;
    }

.gedian-landing .gs-famous-controls {
    grid-column: 2 !important;
    grid-row: 2 !important;
}

    .gedian-landing .gs-famous-controls button {
        min-height: 35px !important;
        font-size: .86rem !important;
    }

@media (min-width: 600px) {
    .gedian-landing .gs-famous-bar {
        min-height: 67px !important; /* was 112px: ~40% reduction */
        height: 67px !important;
        grid-template-columns: 120px minmax(0, 1fr) 36px !important;
        grid-template-rows: 67px !important;
    }

    .gedian-landing .gs-famous-title {
        min-height: 67px !important;
        height: 67px !important;
        padding: 4px 8px !important;
    }

    .gedian-landing .gs-famous-stage {
        min-height: 67px !important;
        height: 67px !important;
    }

    .gedian-landing .gs-famous-row {
        height: 67px !important;
        grid-auto-rows: 1fr !important;
        padding: 4px !important;
        gap: 4px !important;
    }

    .gedian-landing .gs-famous-item {
        padding: 3px 6px !important;
    }

        .gedian-landing .gs-famous-avatar,
        .gedian-landing .gs-famous-item img {
            flex-basis: 30px !important;
            width: 30px !important;
            height: 30px !important;
        }
}

@media (min-width: 992px) {
    .gedian-landing .gs-famous-bar {
        min-height: 56px !important; /* was 94px: ~40% reduction */
        height: 56px !important;
        grid-template-columns: 138px minmax(0, 1fr) 36px !important;
        grid-template-rows: 56px !important;
    }

    .gedian-landing .gs-famous-title,
    .gedian-landing .gs-famous-stage {
        min-height: 56px !important;
        height: 56px !important;
    }

    .gedian-landing .gs-famous-title {
        padding: 4px 9px !important;
    }

        .gedian-landing .gs-famous-title > span {
            font-size: .82rem !important;
        }

        .gedian-landing .gs-famous-title > small {
            font-size: .60rem !important;
        }

    .gedian-landing .gs-famous-row {
        height: 56px !important;
        gap: 4px !important;
        padding: 3px 4px !important;
    }

    .gedian-landing .gs-famous-item {
        padding: 2px 6px !important;
    }

        .gedian-landing .gs-famous-avatar,
        .gedian-landing .gs-famous-item img {
            flex-basis: 30px !important;
            width: 30px !important;
            height: 30px !important;
        }

    .gedian-landing .gs-famous-controls button {
        min-height: 28px !important;
    }
}

/* =========================================================
   2026-08-23 MOBILE FAMOUS FULL-WIDTH FIX
   On phones, one Famous category is shown at a time and it
   occupies the complete stage width. This explicitly overrides
   older mobile rules that hid items 2+ while leaving a 2-column
   row in place (which caused the empty half visible on phones).
   ========================================================= */
@media (max-width: 599.98px) {
    .gedian-landing .gs-famous-stage {
        min-width: 0 !important;
        width: 100% !important;
    }

    .gedian-landing .gs-famous-row {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-auto-columns: minmax(0, 1fr) !important;
        width: 100% !important;
    }

        .gedian-landing .gs-famous-row .gs-famous-item {
            display: none !important;
            grid-column: 1 / -1 !important;
            width: 100% !important;
            max-width: none !important;
            min-width: 0 !important;
            border-left: 0 !important;
        }

            .gedian-landing .gs-famous-row .gs-famous-item.is-mobile-famous-active {
                display: flex !important;
            }

    .gedian-landing .gs-famous-item > div {
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }
}