/*
Theme Name: Maestro
Author: Maestro
Description: Maestro - a fast, fully responsive match-centre theme with editable colours, optional site title and clean navigation.
Version: 6.5.9.1
Requires at least: 5.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: maestro
Tags: sports, live-streaming, football, soccer, rtl, dark-mode, responsive-layout
*/

/* ============================================================
   KOORA LIVE SINGULARITY - GLOBAL MASTER SYSTEM
   ============================================================ */

:root {
    --sg-bg: #000000;
    --sg-primary: #00ff88;
    --sg-cyan: #00f0ff;
    --sg-gold: #ffcc00;
    --sg-accent: #ff0055;
    --sg-text: #ffffff;
    --sg-text-dim: #94a3b8;
    --sg-border: rgba(0, 255, 136, 0.16);
    --sg-glow: rgba(0, 255, 136, 0.35);
    --sg-gradient: linear-gradient(135deg, #00ff88 0%, #00f0ff 100%);
    --kl-glow: rgba(0, 255, 136, 0.35);
    --zn-primary: var(--sg-primary);
    --zn-primary-glow: var(--sg-glow);
    --zn-border: var(--sg-border);
    --zn-surface: rgba(255,255,255,0.03);
    --zn-glass: rgba(255,255,255,0.03);
    --zn-text-dim: var(--sg-text-dim);
    --au-primary: var(--sg-primary);
    --au-text-dim: var(--sg-text-dim);
    --elite-border: var(--sg-border);
    --elite-primary: var(--sg-primary);
    --text-muted: var(--sg-text-dim);
}

html, body {
    background-color: var(--sg-bg) !important;
    color: var(--sg-text) !important;
    font-family: 'Tajawal', sans-serif !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    background-image: radial-gradient(circle at 50% -10%, rgba(0, 255, 136, 0.08) 0%, transparent 50%) !important;
    background-attachment: fixed !important;
}

.container {
    max-width: 1260px !important;
    margin: 0 auto !important;
    padding: 0 25px !important;
}

/* Floating Dock */
.elite-main-header {
    position: fixed !important;
    top: 25px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 999999 !important;
}

.header-inner { 
    background: rgba(0, 0, 0, 0.82) !important; 
    backdrop-filter: blur(35px) saturate(220%) !important; 
    -webkit-backdrop-filter: blur(35px) saturate(220%) !important;
    border: 1px solid rgba(0, 255, 136, 0.22) !important; 
    border-radius: 100px !important; 
    padding: 14px 45px !important; 
    max-width: 1100px !important; 
    margin: 0 auto !important; 
    display: flex !important; 
    justify-content: space-between !important; 
    align-items: center !important;
    box-shadow: 0 50px 120px rgba(0,0,0,0.95) !important;
}

.logo-zenith .mark {
    background: var(--sg-gradient) !important;
    color: #000 !important;
    width: 45px !important;
    height: 45px !important;
    border-radius: 15px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 950 !important;
    box-shadow: 0 0 30px var(--sg-glow) !important;
}

.logo-zenith .text { color: #fff !important; font-weight: 900 !important; font-size: 25px !important; letter-spacing: -0.5px !important; }

/* Match Card */
.grid-master { display: grid !important; gap: 22px !important; padding-bottom: 130px !important; }

.elite-match-card {
    background: linear-gradient(150deg, rgba(255, 255, 255, 0.04) 0%, rgba(0, 0, 0, 0.98) 100%) !important;
    border: 1px solid var(--sg-border) !important;
    border-radius: 30px !important;
    padding: 28px 48px !important;
    display: grid !important;
    grid-template-columns: 1fr 180px 1fr 260px !important;
    align-items: center !important;
    gap: 35px !important;
    transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.elite-match-card:hover { 
    transform: translateY(-12px) scale(1.01) !important; 
    border-color: var(--sg-primary) !important; 
    box-shadow: 0 60px 120px rgba(0,0,0,1) !important;
}

.team-name-zn { font-size: 19px !important; font-weight: 950 !important; color: #fff !important; }
.score-box-zn { font-size: 48px !important; font-weight: 950 !important; color: var(--sg-primary) !important; text-align: center !important; }
.score-box-zn.live { color: var(--sg-gold) !important; }

.status-zn.is-live { 
    background: var(--sg-accent) !important; 
    color: #fff !important; 
    box-shadow: 0 0 25px rgba(255, 0, 85, 0.75) !important; 
}

.btn-watch-zn {
    background: var(--sg-gradient) !important;
    color: #000 !important;
    padding: 16px 32px !important;
    border-radius: 20px !important;
    font-weight: 950 !important;
    text-decoration: none !important;
    text-align: center !important;
    box-shadow: 0 15px 35px rgba(0, 255, 136, 0.35) !important;
}

@media (max-width: 992px) {
    .elite-match-card { grid-template-columns: 1fr 130px 1fr !important; padding: 28px !important; }
}

/* ============================================================
   SINGULARITY MASTER CSS — CONSOLIDATED INSTALLATION BUILD
   ============================================================ */
/* ============================================================
   KOORA LIVE THE ULTIMATE SINGULARITY EDITION (v12.0)
   OLED Black 2.0 | Liquid Mercury | Super-Nova Glow | Zero-Latency
   ============================================================ */

:root {
    --sg-bg: #000000; /* Pure OLED Black */
    --sg-surface: rgba(255, 255, 255, 0.03);
    --sg-primary: #00ff88; /* Singularity Emerald */
    --sg-cyan: #00f0ff; /* Mercury Cyan */
    --sg-gold: #ffcc00; /* Imperial Gold */
    --sg-accent: #ff0055; /* Super-Nova Red */
    --sg-text: #ffffff;
    --sg-text-dim: #94a3b8;
    --sg-border: rgba(0, 255, 136, 0.16);
    --sg-glow: rgba(0, 255, 136, 0.35);
    --sg-gradient: linear-gradient(135deg, #00ff88 0%, #00f0ff 100%);
    --sg-mercury: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.02) 100%);
    
    --sg-radius: 30px;
    --sg-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

body {
    background-color: var(--sg-bg);
    color: var(--sg-text);
    font-family: 'Tajawal', sans-serif;
    margin: 0;
    overflow-x: hidden;
    background-image: 
        radial-gradient(circle at 50% -10%, rgba(0, 255, 136, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 0% 100%, rgba(0, 240, 255, 0.04) 0%, transparent 40%);
    background-attachment: fixed;
}

.container {
    max-width: 1260px;
    margin: 0 auto;
    padding: 0 25px;
}

/* Singularity Floating Dock */
.elite-main-header {
    position: fixed;
    top: 25px;
    left: 0;
    right: 0;
    z-index: 100000;
}

.header-inner {
    background: rgba(0, 0, 0, 0.82);
    backdrop-filter: blur(35px) saturate(220%);
    -webkit-backdrop-filter: blur(35px) saturate(220%);
    border: 1px solid rgba(0, 255, 136, 0.22);
    border-radius: 100px;
    padding: 14px 45px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 50px 120px rgba(0,0,0,0.95), 0 0 50px rgba(0, 255, 136, 0.1);
}

.logo-zenith .mark {
    background: var(--sg-gradient);
    color: #000;
    width: 45px;
    height: 45px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 950;
    font-size: 22px;
    box-shadow: 0 0 30px var(--sg-glow);
}

.logo-zenith .text {
    color: #fff;
    font-weight: 900;
    font-size: 25px;
    letter-spacing: -0.5px;
}

/* Navigation Menu */
.zn-nav-menu {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 32px;
    margin: 0;
    padding: 0;
}

.zn-nav-menu a {
    color: var(--sg-text-dim);
    text-decoration: none;
    font-size: 15px;
    font-weight: 800;
    transition: color 0.3s ease;
}

.zn-nav-menu a:hover,
.zn-nav-menu .current-menu-item a {
    color: var(--sg-primary);
    text-shadow: 0 0 15px var(--sg-glow);
}

/* Singularity Date Switcher */
.elite-date-switcher {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin: 170px auto 50px;
    max-width: 760px;
    background: rgba(255, 255, 255, 0.02);
    padding: 8px;
    border-radius: 26px;
    border: 1px solid var(--sg-border);
    backdrop-filter: blur(25px);
}

.elite-date-btn {
    flex: 1;
    padding: 16px 25px;
    border: none;
    background: transparent;
    color: var(--sg-text-dim);
    font-weight: 900;
    font-size: 16px;
    cursor: pointer;
    border-radius: 20px;
    transition: all 0.5s var(--sg-ease);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.elite-date-btn:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.05);
}

.elite-date-btn.active {
    background: var(--sg-gradient);
    color: #000 !important;
    box-shadow: 0 20px 50px rgba(0, 255, 136, 0.4);
    transform: translateY(-4px) scale(1.02);
}

/* Singularity Match Card (Liquid Mercury Glass) */
.grid-master {
    display: grid;
    gap: 22px;
    padding-bottom: 130px;
}

.elite-match-card {
    background: linear-gradient(150deg, rgba(255, 255, 255, 0.04) 0%, rgba(0, 0, 0, 0.98) 100%);
    backdrop-filter: blur(30px);
    border: 1px solid var(--sg-border);
    border-radius: var(--sg-radius);
    padding: 28px 48px;
    display: grid;
    grid-template-columns: 1fr 180px 1fr 260px;
    align-items: center;
    gap: 35px;
    transition: all 0.7s var(--sg-ease);
    position: relative;
    overflow: hidden;
}

.elite-match-card::before {
    content: '';
    position: absolute;
    top: 0; right: 0; width: 4px; height: 100%;
    background: var(--sg-gradient);
    opacity: 0.3;
    transition: 0.5s;
}

.elite-match-card:hover {
    transform: translateY(-12px) scale(1.01);
    border-color: var(--sg-primary);
    box-shadow: 0 60px 120px rgba(0,0,0,1), 0 0 50px rgba(0, 255, 136, 0.2);
}

.elite-match-card:hover::before {
    opacity: 1;
    box-shadow: 0 0 25px var(--sg-primary);
}

.team-zn { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.logo-zn-frame {
    width: 68px;
    height: 68px;
    padding: 12px;
    background: var(--sg-mercury);
    border-radius: 22px;
    border: 1px solid var(--sg-border);
    box-shadow: inset 0 0 25px rgba(255,255,255,0.03);
}

.team-name-zn {
    font-size: 19px;
    font-weight: 950;
    color: #fff;
    text-align: center;
}

/* Score Box */
.score-box-zn {
    font-size: 48px;
    font-weight: 950;
    color: var(--sg-primary);
    text-shadow: 0 0 35px var(--sg-glow);
    text-align: center;
    letter-spacing: -2px;
}

.score-box-zn.live {
    color: var(--sg-gold);
    text-shadow: 0 0 40px rgba(255, 204, 0, 0.65);
}

.status-zn {
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    padding: 6px 20px;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--sg-text-dim);
    margin-top: 8px;
    letter-spacing: 1px;
}

.status-zn.is-live {
    background: var(--sg-accent);
    color: #fff;
    box-shadow: 0 0 25px rgba(255, 0, 85, 0.75);
    animation: singularityPulse 2s infinite;
}

@keyframes singularityPulse {
    0% { box-shadow: 0 0 0 0 rgba(255, 0, 85, 0.8); }
    70% { box-shadow: 0 0 0 20px rgba(255, 0, 85, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 0, 85, 0); }
}

/* Action Button */
.btn-watch-zn {
    background: var(--sg-gradient);
    color: #000 !important;
    padding: 16px 32px;
    border-radius: 20px;
    font-weight: 950;
    font-size: 15px;
    text-decoration: none !important;
    text-align: center;
    box-shadow: 0 15px 35px rgba(0, 255, 136, 0.35);
    transition: 0.4s var(--sg-ease);
    display: block;
}

.btn-watch-zn:hover {
    transform: scale(1.05);
    box-shadow: 0 25px 50px rgba(0, 240, 255, 0.5);
}

/* Responsive */
@media (max-width: 992px) {
    .elite-match-card {
        grid-template-columns: 1fr 120px 1fr;
        padding: 22px 20px;
        gap: 20px;
    }
    .action-zn {
        grid-column: 1 / -1;
        border-top: 1px solid var(--sg-border);
        padding-top: 18px;
        display: flex;
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }
    .btn-watch-zn { width: 100%; padding: 12px; }
}

@media (max-width: 480px) {
    .header-inner { padding: 10px 15px; width: 90%; margin: 0 auto; }
    .logo-zenith .text { font-size: 18px; }
    .logo-zenith .mark { width: 35px; height: 35px; font-size: 18px; }
    
    .elite-date-switcher { margin-top: 130px; gap: 5px; padding: 5px; }
    .elite-date-btn { padding: 10px 5px; font-size: 12px; border-radius: 12px; }
    .elite-date-btn i { display: none; } /* Hide icons on very small screens to save space */
    
    .elite-match-card { padding: 18px 15px; border-radius: 20px; gap: 10px; }
    .team-name-zn { font-size: 13px; font-weight: 800; }
    .score-box-zn { font-size: 28px; }
    .logo-zn-frame { width: 45px; height: 45px; padding: 8px; border-radius: 14px; }
    .status-zn { font-size: 9px; padding: 4px 12px; }
    
    .premium-meta-zn { flex-direction: row !important; justify-content: center; gap: 10px !important; flex-wrap: wrap; }
}

@media (max-width: 360px) {
    .container { padding: 0 12px; }
    .elite-date-btn { font-size: 11px; }
    .team-name-zn { font-size: 12px; }
    .score-box-zn { font-size: 24px; }
}

.zn-reveal { animation: sgReveal 1.5s var(--sg-ease) forwards; opacity: 0; }
@keyframes sgReveal {
    from { opacity: 0; transform: translateY(50px) scale(0.95); filter: blur(20px); }
    to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}


/* ============================================================
   FINAL MOBILE OVERFLOW GUARD — Koora Live Singularity
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

.elite-match-card,
.elite-match-card > *,
.team-zn,
.score-zn,
.action-zn,
.league-zn,
.premium-meta-zn,
.premium-meta-zn span {
    min-width: 0;
    max-width: 100%;
}

.elite-match-card img {
    display: block;
    max-width: 100%;
    height: auto;
}

.team-name-zn,
.league-zn,
.premium-meta-zn span {
    width: 100%;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.team-name-zn {
    line-height: 1.45;
    text-align: center;
}

.league-zn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
    line-height: 1.5;
}

.premium-meta-zn span {
    line-height: 1.5;
    text-align: center;
}

.btn-watch-zn {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.45;
}

.score-box-zn { white-space: nowrap; }
.status-zn { max-width: 100%; white-space: normal; text-align: center; line-height: 1.35; }

@media (max-width: 992px) {
    .elite-match-card {
        width: 100%;
        grid-template-columns: minmax(0, 1fr) minmax(0, 110px) minmax(0, 1fr);
        overflow: hidden;
    }

    .team-zn,
    .score-zn,
    .action-zn { overflow: hidden; }

    .action-zn .premium-meta-zn,
    .action-zn .league-zn,
    .action-zn .btn-watch-zn { width: 100%; }
}

@media (max-width: 480px) {
    .container { width: 100%; max-width: 100%; padding-left: 12px !important; padding-right: 12px !important; }
    .elite-match-card {
        grid-template-columns: minmax(0, 1fr) minmax(0, 74px) minmax(0, 1fr);
        padding: 16px 10px;
        gap: 8px;
    }
    .team-name-zn {
        font-size: clamp(11px, 3.4vw, 14px);
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }
    .score-box-zn { font-size: clamp(22px, 7vw, 30px); letter-spacing: -1px; }
    .status-zn { font-size: 8px; padding: 4px 6px; }
    .action-zn { padding-top: 14px; gap: 10px; }
    .premium-meta-zn { margin-bottom: 0 !important; }
    .btn-watch-zn { padding: 11px 8px; font-size: 13px; }
}

@media (max-width: 360px) {
    .elite-match-card { grid-template-columns: minmax(0, 1fr) minmax(0, 64px) minmax(0, 1fr); padding-left: 8px; padding-right: 8px; }
    .team-name-zn { font-size: 11px; }
    .score-box-zn { font-size: 22px; }
    .btn-watch-zn { font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    .elite-match-card, .btn-watch-zn, .elite-date-btn, .zn-reveal { transition: none !important; animation: none !important; }
}

/* ============================================================
   KOORA LIVE THE ULTIMATE SINGULARITY EDITION (v12.0)
   OLED Black 2.0 | Liquid Mercury | Super-Nova Glow | Zero-Latency
   ============================================================ */

:root {
    --sg-bg: #000000; /* Pure OLED Black */
    --sg-surface: rgba(255, 255, 255, 0.03);
    --sg-primary: #00ff88; /* Singularity Emerald */
    --sg-cyan: #00f0ff; /* Mercury Cyan */
    --sg-gold: #ffcc00; /* Imperial Gold */
    --sg-accent: #ff0055; /* Super-Nova Red */
    --sg-text: #ffffff;
    --sg-text-dim: #94a3b8;
    --sg-border: rgba(0, 255, 136, 0.16);
    --sg-glow: rgba(0, 255, 136, 0.35);
    --sg-gradient: linear-gradient(135deg, #00ff88 0%, #00f0ff 100%);
    --sg-mercury: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.02) 100%);
    
    --sg-radius: 30px;
    --sg-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

body {
    background-color: var(--sg-bg);
    color: var(--sg-text);
    font-family: 'Tajawal', sans-serif;
    margin: 0;
    overflow-x: hidden;
    background-image: 
        radial-gradient(circle at 50% -10%, rgba(0, 255, 136, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 0% 100%, rgba(0, 240, 255, 0.04) 0%, transparent 40%);
    background-attachment: fixed;
}

.container {
    max-width: 1260px;
    margin: 0 auto;
    padding: 0 25px;
}

/* Singularity Floating Dock */
.elite-main-header {
    position: fixed;
    top: 25px;
    left: 0;
    right: 0;
    z-index: 100000;
}

.header-inner {
    background: rgba(0, 0, 0, 0.82);
    backdrop-filter: blur(35px) saturate(220%);
    -webkit-backdrop-filter: blur(35px) saturate(220%);
    border: 1px solid rgba(0, 255, 136, 0.22);
    border-radius: 100px;
    padding: 14px 45px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 50px 120px rgba(0,0,0,0.95), 0 0 50px rgba(0, 255, 136, 0.1);
}

.logo-zenith .mark {
    background: var(--sg-gradient);
    color: #000;
    width: 45px;
    height: 45px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 950;
    font-size: 22px;
    box-shadow: 0 0 30px var(--sg-glow);
}

.logo-zenith .text {
    color: #fff;
    font-weight: 900;
    font-size: 25px;
    letter-spacing: -0.5px;
}

/* Navigation Menu */
.zn-nav-menu {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 32px;
    margin: 0;
    padding: 0;
}

.zn-nav-menu a {
    color: var(--sg-text-dim);
    text-decoration: none;
    font-size: 15px;
    font-weight: 800;
    transition: color 0.3s ease;
}

.zn-nav-menu a:hover,
.zn-nav-menu .current-menu-item a {
    color: var(--sg-primary);
    text-shadow: 0 0 15px var(--sg-glow);
}

/* Singularity Date Switcher */
.elite-date-switcher {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin: 170px auto 50px;
    max-width: 760px;
    background: rgba(255, 255, 255, 0.02);
    padding: 8px;
    border-radius: 26px;
    border: 1px solid var(--sg-border);
    backdrop-filter: blur(25px);
}

.elite-date-btn {
    flex: 1;
    padding: 16px 25px;
    border: none;
    background: transparent;
    color: var(--sg-text-dim);
    font-weight: 900;
    font-size: 16px;
    cursor: pointer;
    border-radius: 20px;
    transition: all 0.5s var(--sg-ease);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.elite-date-btn:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.05);
}

.elite-date-btn.active {
    background: var(--sg-gradient);
    color: #000 !important;
    box-shadow: 0 20px 50px rgba(0, 255, 136, 0.4);
    transform: translateY(-4px) scale(1.02);
}

/* Singularity Match Card (Liquid Mercury Glass) */
.grid-master {
    display: grid;
    gap: 22px;
    padding-bottom: 130px;
}

.elite-match-card {
    background: linear-gradient(150deg, rgba(255, 255, 255, 0.04) 0%, rgba(0, 0, 0, 0.98) 100%);
    backdrop-filter: blur(30px);
    border: 1px solid var(--sg-border);
    border-radius: var(--sg-radius);
    padding: 28px 48px;
    display: grid;
    grid-template-columns: 1fr 180px 1fr 260px;
    align-items: center;
    gap: 35px;
    transition: all 0.7s var(--sg-ease);
    position: relative;
    overflow: hidden;
}

.elite-match-card::before {
    content: '';
    position: absolute;
    top: 0; right: 0; width: 4px; height: 100%;
    background: var(--sg-gradient);
    opacity: 0.3;
    transition: 0.5s;
}

.elite-match-card:hover {
    transform: translateY(-12px) scale(1.01);
    border-color: var(--sg-primary);
    box-shadow: 0 60px 120px rgba(0,0,0,1), 0 0 50px rgba(0, 255, 136, 0.2);
}

.elite-match-card:hover::before {
    opacity: 1;
    box-shadow: 0 0 25px var(--sg-primary);
}

.team-zn { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.logo-zn-frame {
    width: 68px;
    height: 68px;
    padding: 12px;
    background: var(--sg-mercury);
    border-radius: 22px;
    border: 1px solid var(--sg-border);
    box-shadow: inset 0 0 25px rgba(255,255,255,0.03);
}

.team-name-zn {
    font-size: 19px;
    font-weight: 950;
    color: #fff;
    text-align: center;
}

/* Score Box */
.score-box-zn {
    font-size: 48px;
    font-weight: 950;
    color: var(--sg-primary);
    text-shadow: 0 0 35px var(--sg-glow);
    text-align: center;
    letter-spacing: -2px;
}

.score-box-zn.live {
    color: var(--sg-gold);
    text-shadow: 0 0 40px rgba(255, 204, 0, 0.65);
}

.status-zn {
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    padding: 6px 20px;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--sg-text-dim);
    margin-top: 8px;
    letter-spacing: 1px;
}

.status-zn.is-live {
    background: var(--sg-accent);
    color: #fff;
    box-shadow: 0 0 25px rgba(255, 0, 85, 0.75);
    animation: singularityPulse 2s infinite;
}

@keyframes singularityPulse {
    0% { box-shadow: 0 0 0 0 rgba(255, 0, 85, 0.8); }
    70% { box-shadow: 0 0 0 20px rgba(255, 0, 85, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 0, 85, 0); }
}

/* Action Button */
.btn-watch-zn {
    background: var(--sg-gradient);
    color: #000 !important;
    padding: 16px 32px;
    border-radius: 20px;
    font-weight: 950;
    font-size: 15px;
    text-decoration: none !important;
    text-align: center;
    box-shadow: 0 15px 35px rgba(0, 255, 136, 0.35);
    transition: 0.4s var(--sg-ease);
    display: block;
}

.btn-watch-zn:hover {
    transform: scale(1.05);
    box-shadow: 0 25px 50px rgba(0, 240, 255, 0.5);
}

/* Responsive */
@media (max-width: 992px) {
    .elite-match-card {
        grid-template-columns: 1fr 120px 1fr;
        padding: 22px 20px;
        gap: 20px;
    }
    .action-zn {
        grid-column: 1 / -1;
        border-top: 1px solid var(--sg-border);
        padding-top: 18px;
        display: flex;
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }
    .btn-watch-zn { width: 100%; padding: 12px; }
}

@media (max-width: 480px) {
    .header-inner { padding: 10px 15px; width: 90%; margin: 0 auto; }
    .logo-zenith .text { font-size: 18px; }
    .logo-zenith .mark { width: 35px; height: 35px; font-size: 18px; }
    
    .elite-date-switcher { margin-top: 130px; gap: 5px; padding: 5px; }
    .elite-date-btn { padding: 10px 5px; font-size: 12px; border-radius: 12px; }
    .elite-date-btn i { display: none; } /* Hide icons on very small screens to save space */
    
    .elite-match-card { padding: 18px 15px; border-radius: 20px; gap: 10px; }
    .team-name-zn { font-size: 13px; font-weight: 800; }
    .score-box-zn { font-size: 28px; }
    .logo-zn-frame { width: 45px; height: 45px; padding: 8px; border-radius: 14px; }
    .status-zn { font-size: 9px; padding: 4px 12px; }
    
    .premium-meta-zn { flex-direction: row !important; justify-content: center; gap: 10px !important; flex-wrap: wrap; }
}

@media (max-width: 360px) {
    .container { padding: 0 12px; }
    .elite-date-btn { font-size: 11px; }
    .team-name-zn { font-size: 12px; }
    .score-box-zn { font-size: 24px; }
}

.zn-reveal { animation: sgReveal 1.5s var(--sg-ease) forwards; opacity: 0; }
@keyframes sgReveal {
    from { opacity: 0; transform: translateY(50px) scale(0.95); filter: blur(20px); }
    to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}


/* ============================================================
   FINAL MOBILE OVERFLOW GUARD — Koora Live Singularity
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

.elite-match-card,
.elite-match-card > *,
.team-zn,
.score-zn,
.action-zn,
.league-zn,
.premium-meta-zn,
.premium-meta-zn span {
    min-width: 0;
    max-width: 100%;
}

.elite-match-card img {
    display: block;
    max-width: 100%;
    height: auto;
}

.team-name-zn,
.league-zn,
.premium-meta-zn span {
    width: 100%;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.team-name-zn {
    line-height: 1.45;
    text-align: center;
}

.league-zn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
    line-height: 1.5;
}

.premium-meta-zn span {
    line-height: 1.5;
    text-align: center;
}

.btn-watch-zn {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.45;
}

.score-box-zn { white-space: nowrap; }
.status-zn { max-width: 100%; white-space: normal; text-align: center; line-height: 1.35; }

@media (max-width: 992px) {
    .elite-match-card {
        width: 100%;
        grid-template-columns: minmax(0, 1fr) minmax(0, 110px) minmax(0, 1fr);
        overflow: hidden;
    }

    .team-zn,
    .score-zn,
    .action-zn { overflow: hidden; }

    .action-zn .premium-meta-zn,
    .action-zn .league-zn,
    .action-zn .btn-watch-zn { width: 100%; }
}

@media (max-width: 480px) {
    .container { width: 100%; max-width: 100%; padding-left: 12px !important; padding-right: 12px !important; }
    .elite-match-card {
        grid-template-columns: minmax(0, 1fr) minmax(0, 74px) minmax(0, 1fr);
        padding: 16px 10px;
        gap: 8px;
    }
    .team-name-zn {
        font-size: clamp(11px, 3.4vw, 14px);
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }
    .score-box-zn { font-size: clamp(22px, 7vw, 30px); letter-spacing: -1px; }
    .status-zn { font-size: 8px; padding: 4px 6px; }
    .action-zn { padding-top: 14px; gap: 10px; }
    .premium-meta-zn { margin-bottom: 0 !important; }
    .btn-watch-zn { padding: 11px 8px; font-size: 13px; }
}

@media (max-width: 360px) {
    .elite-match-card { grid-template-columns: minmax(0, 1fr) minmax(0, 64px) minmax(0, 1fr); padding-left: 8px; padding-right: 8px; }
    .team-name-zn { font-size: 11px; }
    .score-box-zn { font-size: 22px; }
    .btn-watch-zn { font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    .elite-match-card, .btn-watch-zn, .elite-date-btn, .zn-reveal { transition: none !important; animation: none !important; }
}

/* ============================================================
   KOORA LIVE THE ULTIMATE SINGULARITY EDITION (v12.0)
   OLED Black 2.0 | Liquid Mercury | Super-Nova Glow | Zero-Latency
   ============================================================ */

:root {
    --sg-bg: #000000; /* Pure OLED Black */
    --sg-surface: rgba(255, 255, 255, 0.03);
    --sg-primary: #00ff88; /* Singularity Emerald */
    --sg-cyan: #00f0ff; /* Mercury Cyan */
    --sg-gold: #ffcc00; /* Imperial Gold */
    --sg-accent: #ff0055; /* Super-Nova Red */
    --sg-text: #ffffff;
    --sg-text-dim: #94a3b8;
    --sg-border: rgba(0, 255, 136, 0.16);
    --sg-glow: rgba(0, 255, 136, 0.35);
    --sg-gradient: linear-gradient(135deg, #00ff88 0%, #00f0ff 100%);
    --sg-mercury: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.02) 100%);
    
    --sg-radius: 30px;
    --sg-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

body {
    background-color: var(--sg-bg);
    color: var(--sg-text);
    font-family: 'Tajawal', sans-serif;
    margin: 0;
    overflow-x: hidden;
    background-image: 
        radial-gradient(circle at 50% -10%, rgba(0, 255, 136, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 0% 100%, rgba(0, 240, 255, 0.04) 0%, transparent 40%);
    background-attachment: fixed;
}

.container {
    max-width: 1260px;
    margin: 0 auto;
    padding: 0 25px;
}

/* Singularity Floating Dock */
.elite-main-header {
    position: fixed;
    top: 25px;
    left: 0;
    right: 0;
    z-index: 100000;
}

.header-inner {
    background: rgba(0, 0, 0, 0.82);
    backdrop-filter: blur(35px) saturate(220%);
    -webkit-backdrop-filter: blur(35px) saturate(220%);
    border: 1px solid rgba(0, 255, 136, 0.22);
    border-radius: 100px;
    padding: 14px 45px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 50px 120px rgba(0,0,0,0.95), 0 0 50px rgba(0, 255, 136, 0.1);
}

.logo-zenith .mark {
    background: var(--sg-gradient);
    color: #000;
    width: 45px;
    height: 45px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 950;
    font-size: 22px;
    box-shadow: 0 0 30px var(--sg-glow);
}

.logo-zenith .text {
    color: #fff;
    font-weight: 900;
    font-size: 25px;
    letter-spacing: -0.5px;
}

/* Navigation Menu */
.zn-nav-menu {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 32px;
    margin: 0;
    padding: 0;
}

.zn-nav-menu a {
    color: var(--sg-text-dim);
    text-decoration: none;
    font-size: 15px;
    font-weight: 800;
    transition: color 0.3s ease;
}

.zn-nav-menu a:hover,
.zn-nav-menu .current-menu-item a {
    color: var(--sg-primary);
    text-shadow: 0 0 15px var(--sg-glow);
}

/* Singularity Date Switcher */
.elite-date-switcher {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin: 170px auto 50px;
    max-width: 760px;
    background: rgba(255, 255, 255, 0.02);
    padding: 8px;
    border-radius: 26px;
    border: 1px solid var(--sg-border);
    backdrop-filter: blur(25px);
}

.elite-date-btn {
    flex: 1;
    padding: 16px 25px;
    border: none;
    background: transparent;
    color: var(--sg-text-dim);
    font-weight: 900;
    font-size: 16px;
    cursor: pointer;
    border-radius: 20px;
    transition: all 0.5s var(--sg-ease);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.elite-date-btn:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.05);
}

.elite-date-btn.active {
    background: var(--sg-gradient);
    color: #000 !important;
    box-shadow: 0 20px 50px rgba(0, 255, 136, 0.4);
    transform: translateY(-4px) scale(1.02);
}

/* Singularity Match Card (Liquid Mercury Glass) */
.grid-master {
    display: grid;
    gap: 22px;
    padding-bottom: 130px;
}

.elite-match-card {
    background: linear-gradient(150deg, rgba(255, 255, 255, 0.04) 0%, rgba(0, 0, 0, 0.98) 100%);
    backdrop-filter: blur(30px);
    border: 1px solid var(--sg-border);
    border-radius: var(--sg-radius);
    padding: 28px 48px;
    display: grid;
    grid-template-columns: 1fr 180px 1fr 260px;
    align-items: center;
    gap: 35px;
    transition: all 0.7s var(--sg-ease);
    position: relative;
    overflow: hidden;
}

.elite-match-card::before {
    content: '';
    position: absolute;
    top: 0; right: 0; width: 4px; height: 100%;
    background: var(--sg-gradient);
    opacity: 0.3;
    transition: 0.5s;
}

.elite-match-card:hover {
    transform: translateY(-12px) scale(1.01);
    border-color: var(--sg-primary);
    box-shadow: 0 60px 120px rgba(0,0,0,1), 0 0 50px rgba(0, 255, 136, 0.2);
}

.elite-match-card:hover::before {
    opacity: 1;
    box-shadow: 0 0 25px var(--sg-primary);
}

.team-zn { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.logo-zn-frame {
    width: 68px;
    height: 68px;
    padding: 12px;
    background: var(--sg-mercury);
    border-radius: 22px;
    border: 1px solid var(--sg-border);
    box-shadow: inset 0 0 25px rgba(255,255,255,0.03);
}

.team-name-zn {
    font-size: 19px;
    font-weight: 950;
    color: #fff;
    text-align: center;
}

/* Score Box */
.score-box-zn {
    font-size: 48px;
    font-weight: 950;
    color: var(--sg-primary);
    text-shadow: 0 0 35px var(--sg-glow);
    text-align: center;
    letter-spacing: -2px;
}

.score-box-zn.live {
    color: var(--sg-gold);
    text-shadow: 0 0 40px rgba(255, 204, 0, 0.65);
}

.status-zn {
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    padding: 6px 20px;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--sg-text-dim);
    margin-top: 8px;
    letter-spacing: 1px;
}

.status-zn.is-live {
    background: var(--sg-accent);
    color: #fff;
    box-shadow: 0 0 25px rgba(255, 0, 85, 0.75);
    animation: singularityPulse 2s infinite;
}

@keyframes singularityPulse {
    0% { box-shadow: 0 0 0 0 rgba(255, 0, 85, 0.8); }
    70% { box-shadow: 0 0 0 20px rgba(255, 0, 85, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 0, 85, 0); }
}

/* Action Button */
.btn-watch-zn {
    background: var(--sg-gradient);
    color: #000 !important;
    padding: 16px 32px;
    border-radius: 20px;
    font-weight: 950;
    font-size: 15px;
    text-decoration: none !important;
    text-align: center;
    box-shadow: 0 15px 35px rgba(0, 255, 136, 0.35);
    transition: 0.4s var(--sg-ease);
    display: block;
}

.btn-watch-zn:hover {
    transform: scale(1.05);
    box-shadow: 0 25px 50px rgba(0, 240, 255, 0.5);
}

/* Responsive */
@media (max-width: 992px) {
    .elite-match-card {
        grid-template-columns: 1fr 120px 1fr;
        padding: 22px 20px;
        gap: 20px;
    }
    .action-zn {
        grid-column: 1 / -1;
        border-top: 1px solid var(--sg-border);
        padding-top: 18px;
        display: flex;
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }
    .btn-watch-zn { width: 100%; padding: 12px; }
}

@media (max-width: 480px) {
    .header-inner { padding: 10px 15px; width: 90%; margin: 0 auto; }
    .logo-zenith .text { font-size: 18px; }
    .logo-zenith .mark { width: 35px; height: 35px; font-size: 18px; }
    
    .elite-date-switcher { margin-top: 130px; gap: 5px; padding: 5px; }
    .elite-date-btn { padding: 10px 5px; font-size: 12px; border-radius: 12px; }
    .elite-date-btn i { display: none; } /* Hide icons on very small screens to save space */
    
    .elite-match-card { padding: 18px 15px; border-radius: 20px; gap: 10px; }
    .team-name-zn { font-size: 13px; font-weight: 800; }
    .score-box-zn { font-size: 28px; }
    .logo-zn-frame { width: 45px; height: 45px; padding: 8px; border-radius: 14px; }
    .status-zn { font-size: 9px; padding: 4px 12px; }
    
    .premium-meta-zn { flex-direction: row !important; justify-content: center; gap: 10px !important; flex-wrap: wrap; }
}

@media (max-width: 360px) {
    .container { padding: 0 12px; }
    .elite-date-btn { font-size: 11px; }
    .team-name-zn { font-size: 12px; }
    .score-box-zn { font-size: 24px; }
}

.zn-reveal { animation: sgReveal 1.5s var(--sg-ease) forwards; opacity: 0; }
@keyframes sgReveal {
    from { opacity: 0; transform: translateY(50px) scale(0.95); filter: blur(20px); }
    to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}


/* ============================================================
   FINAL MOBILE OVERFLOW GUARD — Koora Live Singularity
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

.elite-match-card,
.elite-match-card > *,
.team-zn,
.score-zn,
.action-zn,
.league-zn,
.premium-meta-zn,
.premium-meta-zn span {
    min-width: 0;
    max-width: 100%;
}

.elite-match-card img {
    display: block;
    max-width: 100%;
    height: auto;
}

.team-name-zn,
.league-zn,
.premium-meta-zn span {
    width: 100%;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.team-name-zn {
    line-height: 1.45;
    text-align: center;
}

.league-zn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
    line-height: 1.5;
}

.premium-meta-zn span {
    line-height: 1.5;
    text-align: center;
}

.btn-watch-zn {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.45;
}

.score-box-zn { white-space: nowrap; }
.status-zn { max-width: 100%; white-space: normal; text-align: center; line-height: 1.35; }

@media (max-width: 992px) {
    .elite-match-card {
        width: 100%;
        grid-template-columns: minmax(0, 1fr) minmax(0, 110px) minmax(0, 1fr);
        overflow: hidden;
    }

    .team-zn,
    .score-zn,
    .action-zn { overflow: hidden; }

    .action-zn .premium-meta-zn,
    .action-zn .league-zn,
    .action-zn .btn-watch-zn { width: 100%; }
}

@media (max-width: 480px) {
    .container { width: 100%; max-width: 100%; padding-left: 12px !important; padding-right: 12px !important; }
    .elite-match-card {
        grid-template-columns: minmax(0, 1fr) minmax(0, 74px) minmax(0, 1fr);
        padding: 16px 10px;
        gap: 8px;
    }
    .team-name-zn {
        font-size: clamp(11px, 3.4vw, 14px);
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }
    .score-box-zn { font-size: clamp(22px, 7vw, 30px); letter-spacing: -1px; }
    .status-zn { font-size: 8px; padding: 4px 6px; }
    .action-zn { padding-top: 14px; gap: 10px; }
    .premium-meta-zn { margin-bottom: 0 !important; }
    .btn-watch-zn { padding: 11px 8px; font-size: 13px; }
}

@media (max-width: 360px) {
    .elite-match-card { grid-template-columns: minmax(0, 1fr) minmax(0, 64px) minmax(0, 1fr); padding-left: 8px; padding-right: 8px; }
    .team-name-zn { font-size: 11px; }
    .score-box-zn { font-size: 22px; }
    .btn-watch-zn { font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    .elite-match-card, .btn-watch-zn, .elite-date-btn, .zn-reveal { transition: none !important; animation: none !important; }
}

/* ============================================================
   KOORA LIVE REFERENCE MATCH SKIN
   ============================================================ */
/* Koora Live Reference Skin — an original implementation inspired by the requested layout */
:root {
  --ref-bg: #0a0c12;
  --ref-panel: #12151f;
  --ref-panel-2: #171b28;
  --ref-border: #262c3b;
  --ref-text: #e9edf5;
  --ref-muted: #aeb8c8;
  --ref-red: #b51818;
  --ref-red-2: #d21f1f;
  --ref-blue: #3f6fd6;
  --ref-green: #0a9c3a;
  --ref-gold: #f5a600;
  --ref-radius: 10px;
  --ref-shadow: 0 6px 20px -8px rgba(0,0,0,.55);
}

html { background: var(--ref-bg); }
body.koora-reference-theme {
  margin: 0;
  min-width: 0;
  overflow-x: hidden;
  background: var(--ref-bg);
  color: var(--ref-text);
  font-family: "Tajawal", "Arial", sans-serif;
  font-size: 14px;
  line-height: 1.6;
}
body.koora-reference-theme a { color: inherit; }
body.koora-reference-theme button,
body.koora-reference-theme a { -webkit-tap-highlight-color: transparent; }

.kora-site-header {
  position: sticky;
  top: 0;
  z-index: 90;
  height: 74px;
  background: #12151f;
  border-bottom: 1px solid var(--ref-border);
  box-shadow: 0 2px 16px -6px rgba(0,0,0,.55);
}
.kora-site-header::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, #8f1212, #d21f1f, #f5a600, #8f1212);
}
.kora-header-shell {
  width: min(92%, 1080px);
  height: 100%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.kora-brand-block { flex: 0 0 auto; }
.kora-brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  text-decoration: none;
}
.kora-brand-mark {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, #d21f1f, #8f1212);
  box-shadow: 0 5px 14px rgba(181,24,24,.35);
  font-size: 20px;
  font-weight: 900;
}
.kora-brand-copy { display: flex; flex-direction: column; line-height: 1.05; }
.kora-brand-copy strong { font-size: 17px; font-weight: 800; }
.kora-brand-copy small { color: #9ba7ba; font-size: 9px; direction: ltr; text-align: right; }
.kora-network-nav { display: flex; align-items: center; gap: 5px; min-width: 0; }
.kora-network-nav a {
  padding: 5px 7px;
  color: #d7deeb;
  font-size: 11px;
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
}
.kora-network-nav a:hover { color: #fff; border-bottom-color: var(--ref-red-2); }
.kora-social-nav { display: flex; align-items: center; gap: 5px; }
.kora-social-icon {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 5px;
  color: #fff;
  background: var(--social-color);
  font-size: 12px;
  text-decoration: none;
  transition: transform .2s ease, filter .2s ease;
}
.kora-social-icon:hover { transform: translateY(-2px); filter: brightness(1.15); }
.kora-theme-toggle-desktop {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-right: 12px;
  border: 1px solid var(--ref-border);
  border-radius: 50%;
  background: var(--ref-panel-2);
  color: var(--ref-gold);
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}
.kora-theme-toggle-desktop i { font-size: 16px; }
.kora-theme-toggle-desktop:hover {
  background: var(--ref-gold);
  color: #000;
  border-color: var(--ref-gold);
}
.kora-menu-toggle { display: none; border: 0; background: var(--ref-red-2); color: #fff; width: 38px; height: 38px; border-radius: 8px; }
.kora-site-des {
  width: min(92%, 1080px);
  height: 35px;
  margin: 10px auto 18px;
  display: grid;
  place-items: center;
  color: #75b48b;
  background: #0c241b;
  border: 1px solid #103e2b;
  border-radius: var(--ref-radius);
  font-size: 12px;
}
.kora-site-des span { margin: 0 4px; color: #4e8563; }
.kora-mobile-nav { display: none; }

.kora-reference-main { padding: 0 0 48px; }
.kora-reference-container { width: min(92%, 1080px); margin: 0 auto; }
.kora-page-title {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 14px;
  margin-bottom: 8px;
  background: var(--ref-panel);
  border-radius: var(--ref-radius);
  border: 1px solid var(--ref-border);
}
.kora-page-title h1 { margin: 0; color: #f0f3f9; font-size: 14px; font-weight: 700; }
.kora-date-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 9px; }
.kora-date-tabs .elite-date-btn {
  display: block;
  padding: 8px 6px;
  border: 0;
  border-radius: 8px;
  color: #fff;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
.kora-date-tabs .elite-date-btn:nth-child(1) { background: linear-gradient(135deg,#5580e0,#3457b8); }
.kora-date-tabs .elite-date-btn:nth-child(2) { background: linear-gradient(135deg,#d21f1f,#8f1212); box-shadow: 0 4px 12px -4px rgba(181,24,24,.55); }
.kora-date-tabs .elite-date-btn:nth-child(3) { background: linear-gradient(135deg,#ffc23d,#e59400); color: #251a00; }
.kora-date-tabs .elite-date-btn:hover,
.kora-date-tabs .elite-date-btn.active { transform: translateY(-2px); filter: brightness(1.08); }

.kora-matches-container { display: flex; flex-direction: column; gap: 8px; }
.elite-match-card.kora-match-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background: var(--ref-panel);
  border: 1px solid var(--ref-border);
  border-radius: 4px;
  box-shadow: var(--ref-shadow);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.elite-match-card.kora-match-card:hover { transform: translateY(-2px); border-color: rgba(181,24,24,.7); box-shadow: 0 12px 24px -14px rgba(181,24,24,.8); }
.kora-match-link { display: block; min-width: 0; color: inherit; text-decoration: none; }
.kora-match-head {
  min-width: 0;
  min-height: 31px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 10px;
  border-bottom: 1px solid rgba(255,255,255,.045);
  color: var(--ref-muted);
  font-size: 10px;
}
.kora-match-league, .kora-match-status { min-width: 0; display: inline-flex; align-items: center; gap: 5px; }
.kora-match-league span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kora-match-league img { width: 16px; height: 16px; object-fit: contain; }
.kora-match-status { color: #ff9f3f; white-space: nowrap; }
.kora-match-status.is-live { color: #ff5555; }
.kora-match-status.is-ended { color: #ff9f3f; }
.kora-live-dot { width: 6px; height: 6px; border-radius: 50%; background: #e53935; box-shadow: 0 0 0 5px rgba(229,57,53,.15); }
.kora-match-body {
  min-width: 0;
  min-height: 118px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 110px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
}
.kora-team { min-width: 0; display: flex; align-items: center; justify-content: center; gap: 8px; }
.kora-team-home { order: 1; }
.kora-team-away { order: 3; flex-direction: row-reverse; }
.kora-team-logo { flex: 0 0 55px; width: 55px; height: 55px; display: grid; place-items: center; overflow: hidden; }
.kora-team-logo img { display: block; width: 52px; height: 52px; object-fit: contain; filter: drop-shadow(0 3px 6px rgba(0,0,0,.25)); }
.team-name-zn { min-width: 0; overflow-wrap: anywhere; word-break: break-word; color: #e6ebf4; font-size: 13px; line-height: 1.4; text-align: center; }
.kora-match-center { order: 2; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.kora-score { direction: ltr; color: #fff; font-size: 26px; font-weight: 900; line-height: 1.1; letter-spacing: 1px; }
.kora-score b { padding: 0 3px; color: #cfd5e1; font-weight: 500; }
.kora-match-time { margin-top: 4px; color: #aeb8c8; font-size: 11px; direction: ltr; }
.kora-center-status { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; margin-top: 4px; padding: 2px 9px; border-radius: 12px; background: #717d8c; color: #fff; font-size: 10px; }
.kora-center-status.is-live { background: #b51818; }
.kora-match-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; padding: 6px 10px; border-top: 1px solid rgba(255,255,255,.05); color: #8792a4; font-size: 10px; }
.kora-match-channel { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kora-watch-hint { color: #e0a332; white-space: nowrap; }
.kora-empty-state { padding: 55px 20px; text-align: center; background: var(--ref-panel); border: 1px solid var(--ref-border); border-radius: 4px; color: var(--ref-muted); }
.kora-empty-state i { display: block; margin-bottom: 10px; color: #718096; font-size: 36px; }
.kora-empty-state h2 { margin: 0 0 5px; font-size: 18px; color: #e6ebf4; }
.kora-empty-state p { margin: 0; font-size: 12px; }

.kora-news-section { margin-top: 28px; }
.kora-section-heading { border-right: 3px solid var(--ref-red-2); padding-right: 10px; margin-bottom: 12px; }
.kora-section-heading h2 { margin: 0; font-size: 18px; color: #edf1f7; }
.kora-news-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; }
.kora-news-card { min-width: 0; overflow: hidden; background: var(--ref-panel); border: 1px solid var(--ref-border); border-radius: 5px; }
.kora-news-thumb { display: block; height: 125px; background: #171b28; overflow: hidden; }
.kora-news-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.kora-news-placeholder { height: 100%; display: grid; place-items: center; color: #657084; font-size: 28px; }
.kora-news-content { padding: 9px 10px 11px; }
.kora-news-content h3 { margin: 0 0 5px; font-size: 12px; line-height: 1.5; }
.kora-news-content h3 a { text-decoration: none; }
.kora-news-content time { color: #8490a4; font-size: 10px; }
.kora-no-news { grid-column: 1 / -1; color: var(--ref-muted); text-align: center; }

@media (max-width: 800px) {
  .kora-header-shell { width: calc(100% - 24px); }
  .kora-network-nav { display: none; }
  .kora-menu-toggle { display: block; }
  .kora-social-nav { margin-right: auto; }
  .kora-reference-container, .kora-site-des { width: calc(100% - 24px); }
  .kora-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .kora-site-header { height: 62px; }
  .kora-brand-mark { width: 32px; height: 32px; font-size: 17px; }
  .kora-brand-copy strong { font-size: 14px; }
  .kora-social-icon:nth-child(n+4) { display: none; }
  .kora-site-des { margin-top: 8px; margin-bottom: 10px; height: 32px; font-size: 11px; }
  .kora-page-title { min-height: 38px; padding-inline: 10px; }
  .kora-page-title h1 { font-size: 12px; }
  .kora-date-tabs { gap: 5px; }
  .kora-date-tabs .elite-date-btn { padding: 7px 3px; font-size: 10px; }
  .kora-match-head { padding-inline: 7px; font-size: 9px; }
  .kora-match-body { grid-template-columns: minmax(0,1fr) 70px minmax(0,1fr); gap: 3px; min-height: 140px; padding: 8px 5px; }
  .kora-team { flex-direction: column; gap: 3px; }
  .kora-team-away { flex-direction: column; }
  .kora-team-logo { flex-basis: 48px; width: 48px; height: 48px; }
  .kora-team-logo img { width: 45px; height: 45px; }
  .team-name-zn { width: 100%; font-size: 11px; }
  .kora-score { font-size: 19px; }
  .kora-match-time { font-size: 10px; }
  .kora-match-foot { font-size: 9px; padding-inline: 7px; }
  .kora-news-grid { grid-template-columns: 1fr; }
  .kora-news-thumb { height: 145px; }
}
@media (max-width: 340px) {
  .kora-header-shell, .kora-reference-container, .kora-site-des { width: calc(100% - 16px); }
  .kora-social-nav { gap: 3px; }
  .kora-social-icon { width: 22px; height: 22px; font-size: 10px; }
  .kora-match-body { grid-template-columns: minmax(0,1fr) 62px minmax(0,1fr); }
  .team-name-zn { font-size: 10px; }
  .kora-score { font-size: 17px; }
}

.kora-footer { margin-top: 35px; padding: 22px 12px 80px; border-top: 1px solid var(--ref-border); background: #0c0e16; }
.kora-footer-inner { width: min(92%, 1080px); margin: 0 auto; text-align: center; }
.kora-footer-brand { color: #e9edf5; font-weight: 800; }
.kora-footer-brand span { color: var(--ref-red-2); margin: 0 3px; }
.kora-footer-links { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin: 12px 0; }
.kora-footer-links a { color: #aeb8c8; font-size: 12px; text-decoration: none; }
.kora-footer-links a:hover { color: #fff; }
.kora-footer p { margin: 0; color: #748096; font-size: 10px; }
@media (max-width: 800px) {
  .kora-mobile-nav {
    position: fixed;
    z-index: 100;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    min-height: 56px;
    background: rgba(18,21,31,.97);
    border-top: 1px solid var(--ref-border);
    box-shadow: 0 -6px 18px rgba(0,0,0,.28);
    backdrop-filter: blur(8px);
  }
  .kora-mobile-nav a, .kora-mobile-nav button {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    border: 0;
    background: transparent;
    color: #b7c0cf;
    font: inherit;
    font-size: 9px;
    text-decoration: none;
    cursor: pointer;
  }
  .kora-mobile-nav a:first-child { color: #ff9a34; }
  .kora-mobile-nav i { font-size: 16px; }
  .kora-footer { padding-bottom: 75px; }
  .kora-mobile-nav.is-open { display: grid; }
  .kora-network-nav.is-open {
    position: absolute;
    top: 62px;
    right: 12px;
    left: 12px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 8px;
    background: #12151f;
    border: 1px solid var(--ref-border);
    border-radius: 8px;
    box-shadow: 0 12px 28px rgba(0,0,0,.45);
  }
}
body.koora-reference-theme.light-mode {
  --ref-bg: #e8eff9;
  --ref-panel: #ffffff;
  --ref-panel-2: #f4f7fb;
  --ref-border: #dbe6f5;
  --ref-text: #2b303b;
  --ref-muted: #718096;
  background: var(--ref-bg);
  color: var(--ref-text);
}
body.koora-reference-theme.light-mode .kora-site-header,
body.koora-reference-theme.light-mode .kora-mobile-nav { background: #fff; }
body.koora-reference-theme.light-mode .kora-brand-copy strong,
body.koora-reference-theme.light-mode .kora-page-title h1,
body.koora-reference-theme.light-mode .kora-section-heading h2,
body.koora-reference-theme.light-mode .kora-empty-state h2,
body.koora-reference-theme.light-mode .kora-news-content h3 a,
body.koora-reference-theme.light-mode .team-name-zn { color: #2b303b; }
body.koora-reference-theme.light-mode .kora-network-nav a { color: #475569; }
body.koora-reference-theme.light-mode .kora-footer { background: #f4f7fb; }

/* Final specificity guard: neutralize legacy Singularity card rules */
.elite-match-card.kora-match-card {
  display: block !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  padding: 0 !important;
  border-radius: 4px !important;
  background: var(--ref-panel) !important;
  backdrop-filter: none !important;
}
.elite-match-card.kora-match-card .team-name-zn {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #fff !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
@media (max-width: 560px) {
  .elite-match-card.kora-match-card .team-name-zn { width: 100% !important; font-size: 11px !important; }
}
body.koora-reference-theme.light-mode .elite-match-card.kora-match-card .team-name-zn { color: #2b303b !important; }

/* PIXEL PERFECT REFERENCE CSS — AlphaProTheme */
/* =======================================================================
   Alpha Pro — Main CSS (Modernized 2026)
   NOTE: Every original selector, class and ID is preserved.
   Only visual styling (color, shadow, radius, spacing, motion) is refined.
   ======================================================================= */

:root{
--Main-Color:#b51818;--Secondary-Color:#474747;
--Main-Gradient-BG:linear-gradient(135deg,#d21f1f 0%,#8f1212 100%);
--Body-BG:#e8eff9;--Main-BG:#eef3fb;--Secondary-BG:#ffffff;
--Main-Font-Color:#2b303b;--Main-Font-Size:16px;--Main-Link-Color:#0a63d3;
--Hover-Link-Color:var(--Main-Color);--Main-Font-Weight:500;--Main-Line-Height:35px;
--Main-Padding:12px;--Main-Margin:15px;--Main-Gap:12px;--Main-Border-Radius:12px;
--Main-Border:1px solid #dbe6f5;
--Main-Box-Shadow:0 6px 20px -8px rgba(20,30,60,0.18);
--Hover-Box-Shadow:0 14px 34px -12px rgba(20,30,60,0.30);
--Main-RGB-BG:rgb(0 0 0 / 55%);--Main-Fill-Color:#fff;
--Max-width:1080px;--Full-width:100%;--Half-width:50%;--StartSide:right;--EndSide:left;
--White-Color:#ffffff;--Black-Color:#000000;--Gray-Color:#474747;--Gray-Color-1:#718ba1;
--Red-Color:#b51818;--Green-Color:#0a9c3a;--Blue-Color:#3f6fd6;--Yellow-Color:#f5a600;
--White-BG:#ffffff;--Black-BG:#0b0d13;--T-RGB-BG:rgb(255 255 255 / 0%);
--White-RGB-BG:rgb(255 255 255 / 35%);--Black-RGB-BG:rgb(0 0 0 / 60%);
--Font-Size-1:12px;--Font-Size-2:14px;--Font-Size-3:18px;--Font-Size-4:20px;--Font-Size-5:22px;--Font-Size-6:25px;
--Margin-1:3px;--Margin-2:6px;--Margin-3:10px;--Margin-4:12px;
--Padding-1:4px;--Padding-2:6px;--Padding-3:8px;--Padding-4:10px;
--Border-Radius-1:4px;--Border-Radius-2:8px;--Border-Radius-3:14px;--Border-Radius-4:50%;
--Border-1:1px solid #dbe6f5;--Font-Weight-1:700;--Gap-1:15px;
--Box-Shadow-1:0 2px 8px rgba(20,30,60,0.10);
--TitleBox-BG:var(--White-BG);--TitleBox-Title-BG:var(--Main-Color);--Taps-BG:var(--Gray-Color);
--Post-Holder-BG-1:rgb(233,235,238);--Post-Holder-BG-2:rgb(244,245,246);
--Tran-1:0.3s;--Tran-2:all 0.45s cubic-bezier(.22,.61,.36,1);--Tran-3:all 0.3s ease-out 0s
}
:root body.Night{
--Main-Color:#0e1019;--Secondary-Color:#191d2d;--White-Color:#ffffff;--White-BG:#ffffff;--Black-BG:#0a0c12;
--Main-Gradient-BG:linear-gradient(135deg,#20263a 0%,#0e1019 100%);
--Body-BG:#0c0e16;--Main-BG:#12151f;--Secondary-BG:#171b28;--Main-Font-Color:#e9edf5;
--Main-Border:1px solid #262c3b;--Border-1:1px solid #262c3b;--Hover-Link-Color:#ff8a3d;
--Main-Box-Shadow:0 8px 24px -10px rgba(0,0,0,0.55);
--Hover-Box-Shadow:0 16px 40px -14px rgba(0,0,0,0.65);
--TitleBox-BG:#0f121b;--TitleBox-Title-BG:#20263a;--Taps-BG:#20263a;--Gray-Color:#20263a;
--Post-Holder-BG-1:#12151f;--Post-Holder-BG-2:#171b28;
--Main-Dark-Color:#0e1019;--Secondary-Dark-Color:#20263a;--Main-Dark-Font-Color:#ff8a3d
}

/* Scrollbar */
::-webkit-scrollbar{background:transparent;width:12px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--Main-Color);border-radius:20px;border:3px solid var(--Body-BG)}
::-webkit-scrollbar-thumb:hover{background:#8f1212}
*{scrollbar-color:var(--Main-Color) transparent;scrollbar-width:thin}

a{color:var(--Main-Font-Color);text-decoration:none;transition:color var(--Tran-1)}
a:focus,a:hover{color:var(--Hover-Link-Color)}
:focus-visible{outline:2px solid var(--Main-Color);outline-offset:2px;border-radius:4px}
ul{list-style:none;margin:0;padding:0}
img{max-height:100%;max-width:100%;display:block;position:relative}

svg.icon{fill:var(--Main-Fill-Color);width:24px;height:24px;display:block;font-size:0;margin:5px auto;background-size:100% 100%}

/* Back to top */
.toTop{display:flex;cursor:pointer;align-items:center;justify-content:center;position:fixed;right:24px;bottom:80px;width:48px;height:48px;border-radius:var(--Border-Radius-4);visibility:hidden;opacity:0;z-index:5;transform:scale(.6) translateY(10px);transition:transform var(--Tran-1),opacity var(--Tran-1),visibility var(--Tran-1);filter:drop-shadow(0 6px 14px rgba(0,0,0,.22))}
.toTop.vsbl{visibility:visible;opacity:1;transform:scale(1) translateY(0)}
.toTop:hover{transform:scale(1.08)}
.toTop svg{height:100%;width:var(--Full-width);-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);stroke-width:2;cursor:pointer}
.toTop svg .b{fill:var(--Secondary-BG);stroke:rgba(0,0,0,.08);opacity:.96;stroke-width:2px}
.toTop svg .c{fill:none;stroke:var(--Main-Color);stroke-dasharray:100 100;stroke-dashoffset:100;stroke-linecap:round;stroke-width:2.4px}
.toTop svg .line.d{stroke:var(--Main-Color)}

svg.line,svg .line{width:20px;height:20px;fill:none!important;stroke:var(--Hover-Link-Color);stroke-linecap:round;stroke-linejoin:round;stroke-width:2}

/* Layout */
.container{display:block;width:var(--Full-width);max-width:var(--Max-width);padding:0 var(--Main-Padding);margin:0 auto}

.box,.MW-Ads,.coMatch{display:block;position:relative;width:var(--Full-width);background-color:var(--Secondary-BG);border-radius:var(--Main-Border-Radius);margin-bottom:var(--Main-Margin);box-shadow:var(--Main-Box-Shadow);border:var(--Main-Border);overflow:hidden}
.MW-Ads,.coMatch,.mw-SiteDes{padding:var(--Main-Padding)}
.MW-Ads{text-align:center}

/* Title bar */
.TitleBox{position:relative;background-color:var(--TitleBox-BG);padding:var(--Main-Padding);border-bottom:var(--Main-Border);overflow:hidden}
.TitleBox .Title,.TitleBox a.LoadMore{display:block;position:relative;background:var(--Main-Gradient-BG);text-align:center;color:var(--White-Color);font-weight:var(--Font-Weight-1);letter-spacing:.2px;line-height:2.4;padding:0 var(--Main-Padding);border-radius:var(--Border-Radius-2);box-shadow:0 4px 12px -4px rgba(181,24,24,.5)}
.TitleBox .Title{float:var(--StartSide)}
.TitleBox a.LoadMore{float:var(--EndSide);transition:transform var(--Tran-1),box-shadow var(--Tran-1)}
.TitleBox a.LoadMore:hover{color:var(--White-Color);transform:translateY(-1px);box-shadow:0 8px 18px -6px rgba(181,24,24,.6)}
body.Night .TitleBox .Title,body.Night .TitleBox a.LoadMore{box-shadow:none}

.TopSiteDes{display:flex;align-items:center;justify-content:center;position:relative;background:linear-gradient(135deg,#e0f5e6,#d0efd7);color:#1f7a37;min-height:42px;padding:6px var(--Main-Padding);margin-bottom:var(--Main-Margin);border-radius:var(--Main-Border-Radius);box-shadow:var(--Main-Box-Shadow);border:1px solid rgba(31,122,55,.18);font-size:var(--Font-Size-2);text-align:center;clear:both;overflow:hidden}
body.Night .TopSiteDes{background:linear-gradient(135deg,#12281a,#0f2016);color:#5fd07f;border-color:rgba(95,208,127,.2)}

/* Ad placeholders */
.advertisement-container,.ad-container{border:1px dashed rgba(49,182,148,0.5);box-shadow:0 5px 15px rgba(0,0,0,0.06);border-radius:var(--Main-Border-Radius);background:linear-gradient(45deg,transparent 0 23px,rgba(49,182,148,0.4) 23px 24px,transparent 24px) 0 0 / 20px 20px,linear-gradient(-45deg,transparent 0 23px,rgba(49,182,148,0.4) 23px 24px,transparent 24px) 20px 10px / 20px 20px;background-color:var(--Secondary-BG);padding:20px 10px}
.ad-container{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.advertisement-content,.ad-content{display:flex;color:var(--Main-Link-Color);font-size:22px;font-weight:normal;align-items:center;justify-content:center;flex-direction:column}
.advertisement-link,.ad-link{font-size:18px;color:#e70000}

.Not-available{display:block;background-color:var(--Main-BG);border-radius:var(--Main-Border-Radius);border:var(--Main-Border);font-size:var(--Font-Size-3);position:relative;text-align:center;overflow:hidden;padding:44px 0;opacity:.85}

/* ============================ Header ============================ */
.SiteHeader{display:block;position:sticky;top:0;background-color:var(--Secondary-BG);margin-bottom:var(--Main-Margin);box-shadow:0 2px 16px -6px rgba(20,30,60,.18);border-bottom:1px solid rgba(0,0,0,.05);width:var(--Full-width);height:100px;overflow:hidden;z-index:99}
.SiteHeader:before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--Main-Gradient-BG);z-index:2}
body.Night .SiteHeader{border-bottom:1px solid #262c3b}
.SiteHeader>div{display:flex;align-items:center;height:100%}
#logo{display:block;position:relative;background:var(--Main-Gradient-BG);border-radius:var(--Main-Border-Radius);float:var(--StartSide);margin:var(--Margin-3) 0;width:200px;height:80px;padding:0;overflow:hidden;user-select:none;-webkit-user-select:none;box-shadow:0 6px 16px -6px rgba(181,24,24,.5)}
#logo .logo-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#logo a{display:block;height:100%}
.site-des{display:flex;position:relative;width:var(--Full-width);height:80px;flex-direction:column;overflow:hidden;align-items:center;flex-wrap:nowrap;justify-content:center;margin:0;padding:0}
.site-des span{display:flex;color:var(--White-Color);width:var(--Full-width);height:40px;text-align:center;align-items:center;justify-content:center;line-height:1.1}
.site-des .site-name{font-size:24px;font-weight:700;letter-spacing:.3px}
.site-des .site-url{font-size:13px;opacity:.85;height:24px;font-weight:500}
.nav-menu{width:calc(var(--Full-width) - 200px);margin:30px 0}
#btn-menu{position:absolute;visibility:hidden}
.nav-menu .nav ul.LinksList-Nav{margin-right:var(--Main-Margin)}
.nav-menu .nav ul.LinksList-Nav li{display:block;position:relative;float:var(--StartSide);margin-left:var(--Main-Margin)}
.nav-menu .nav ul.LinksList-Nav li:last-child{margin-left:0}
.nav-menu .nav ul.LinksList-Nav li a{display:flex;padding:0 4px;height:40px;justify-content:center;align-items:center;white-space:nowrap;font-weight:600;position:relative;transition:color var(--Tran-1)}
.nav-menu .nav ul.LinksList-Nav li a:hover{color:var(--Main-Color)}
.nav-menu .nav ul.LinksList-Nav li .dots-table{position:absolute;width:20px;height:4px;transition:all 800ms cubic-bezier(0.23,0.01,0,1);transform:translateY(10px);opacity:0;bottom:-20px;right:50%;margin-right:-10px}
.nav-menu .nav ul.LinksList-Nav li .dots-table span{display:block;position:absolute;background-color:var(--Main-Color);border-radius:var(--Border-Radius-2);top:0;width:4px;height:4px}
.nav-menu .nav ul.LinksList-Nav li .dots-table span.yellow{background-color:var(--Yellow-Color)}
.nav-menu .nav ul.LinksList-Nav li .dots-table .dot-1{right:0}
.nav-menu .nav ul.LinksList-Nav li .dots-table .dot-2{right:8px}
.nav-menu .nav ul.LinksList-Nav li .dots-table .dot-3{left:0}
.nav-menu .nav ul.LinksList-Nav li:hover .dots-table{opacity:1;bottom:0}
.nav-menu .nav ul.SocialMedia-Nav{margin:var(--Margin-1) 0;float:var(--EndSide);padding:0}
.nav-menu .nav ul.SocialMedia-Nav li{display:grid;float:var(--EndSide);margin-right:var(--Margin-2)}
.nav-menu .nav ul.SocialMedia-Nav li:last-child{margin-right:0}
.nav-menu .nav ul.SocialMedia-Nav a,.dark-mode label{display:grid;cursor:pointer;background-color:var(--Taps-BG);border-radius:var(--Border-Radius-2);height:34px;width:34px;padding:0;float:var(--EndSide);transition:transform var(--Tran-1),filter var(--Tran-1),opacity var(--Tran-1)}
.nav-menu .nav ul.SocialMedia-Nav a:hover,.dark-mode label:hover{transform:translateY(-2px);filter:brightness(1.08)}
.SiteHeader h1,.SiteHeader h2{display:none!important}
.dark-mode.hide,.menu-label.op,.menu-label.clo{display:none}
.menu-label.clo .close-icon{width:20px;margin-left:var(--Margin-3)}
.nav-menu .nav .SocialMedia-Nav a[aria-label="facebook"]{background-color:#1877F2}
.nav-menu .nav .SocialMedia-Nav a[aria-label="twitter"]{background-color:#000000}
.nav-menu .nav .SocialMedia-Nav a[aria-label="youtube"]{background-color:#FF0000}
.nav-menu .nav .SocialMedia-Nav a[aria-label="telegram"]{background-color:#0088CC}
.nav-menu .nav .SocialMedia-Nav a[aria-label="google-news"]{background-color:#4285F4}
body.Night g.d2{display:inline}
body.Night g.d1{display:none}
body g.d2{display:none}
body g.d1{display:inline}

/* ============================ Footer ============================ */
footer{position:relative;background-color:var(--Secondary-BG);box-shadow:0 -4px 20px -10px rgba(20,30,60,.16);border-top:1px solid rgba(0,0,0,.05);padding:0;margin:0;overflow:hidden}
body.Night footer{border-top:1px solid #262c3b}
.Top-Footer{position:relative;display:grid;grid-gap:var(--Main-Gap);grid-template-columns:repeat(4,1fr);margin:0;padding:22px 0}
.Top-Footer ul.Links-List{position:relative;display:grid;grid-gap:var(--Margin-3);grid-template-columns:repeat(1,1fr);margin:0}
.Bottom-Footer{display:block;position:relative;border-top:var(--Main-Border);padding:var(--Main-Padding) 0;overflow:hidden}
.Bottom-Footer ul.Site-Links{display:block;position:relative;float:var(--EndSide);overflow:hidden}
ul.Site-Links li{float:var(--EndSide);margin-right:var(--Margin-4)}
ul.Site-Links li:last-of-type{margin-right:0!important}
ul.Links-List li a,ul.Site-Links li a{display:block;background-color:var(--Main-BG);border-radius:var(--Border-Radius-2);border:var(--Main-Border);width:var(--Full-width);font-size:var(--Font-Size-2);line-height:2.5;padding:0 var(--Padding-4);text-align:center;overflow:hidden;transition:background-color var(--Tran-1),color var(--Tran-1),transform var(--Tran-1)}
ul.Links-List li a:hover,ul.Site-Links li a:hover{background:var(--Main-Color);color:var(--White-Color);transform:translateY(-1px)}
.Copy-Rights{display:flex;position:relative;background-color:var(--Main-BG);border:var(--Main-Border);padding:6px var(--Padding-4);border-radius:var(--Border-Radius-2);float:var(--StartSide);text-align:center;flex-direction:row;align-items:center;justify-content:center;min-height:40px}
#Malik-Web a#malik-web:hover{background-position:bottom!important}
#Malik-Web a#malik-web:after{font-family:sans-serif;font-size:0.5rem;padding:2px 6px;position:absolute;top:-11px;right:35px;z-index:1;content:"Dev by:Malik Web";background:#fbc121;color:#ffffff;opacity:0;visibility:hidden;transition:all 0.1s ease-in-out 0.1s;border-radius:var(--Border-Radius-2);line-height:0.8rem;text-transform:uppercase;letter-spacing:2px;white-space:nowrap}
#Malik-Web a#malik-web:hover:after{opacity:1;visibility:visible;right:30px}
.Site-Name{display:inline-block;position:relative;font-size:var(--Font-Size-2)}
.Site-Name a.site-name{color:var(--Main-Color);font-weight:700}
body.Night .Site-Name a.site-name{color:var(--Main-Dark-Font-Color)}
.mw-SiteDes p{line-height:1.9!important;text-align:justify}

/* ============================ Posts Grid ============================ */
.blogpost{display:block;position:relative;background-color:var(--Secondary-BG);border-radius:var(--Main-Border-Radius);margin-bottom:var(--Main-Margin);box-shadow:var(--Main-Box-Shadow);border:var(--Main-Border);overflow:hidden}
.grid-post{display:flex;flex-direction:column;padding:var(--Main-Padding);overflow:hidden}
.grid-posts{position:relative;display:grid;grid-gap:var(--Main-Gap);grid-template-columns:repeat(4,1fr)}
article.post-amp{display:block;position:relative;background-color:var(--Main-BG);border-radius:var(--Main-Border-Radius);border:1px solid rgba(0,0,0,.04);overflow:hidden;transition:transform var(--Tran-1),box-shadow var(--Tran-1)}
body.Night article.post-amp{border-color:#262c3b}
article.post-amp:hover{transform:translateY(-4px);box-shadow:var(--Hover-Box-Shadow)}
.post-img{display:block;position:relative;overflow:hidden}
.thumb{display:block;position:relative;width:var(--Full-width);height:150px;overflow:hidden}
.thumb img{display:block;width:100%;height:100%;max-height:none;object-fit:cover;position:absolute;transition:var(--Tran-2);top:0;right:0;left:0;bottom:0}
article.post-amp:hover .thumb img{transform:scale(1.08)}
span.post-icon{display:flex;width:100%;height:100%;align-items:center;justify-content:center;flex-direction:column}
span.post-icon svg.article-icon{fill:var(--Main-Fill-Color);width:50px;height:50px;z-index:8;transition:transform var(--Tran-1),opacity var(--Tran-1);opacity:0;transform:scale(.7)}
.thumb:after{content:"";width:100%;height:100%;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,.15));position:absolute;inset:0;opacity:0;pointer-events:none;transition:var(--Tran-1);display:flex;align-items:center;justify-content:center}
article.post-amp:hover .thumb:after{opacity:1}
article.post-amp:hover span.post-icon svg.article-icon{opacity:1;transform:scale(1)}
.post-info{padding:var(--Padding-4) var(--Padding-3)}
.post-info h3{font-size:var(--Font-Size-2);line-height:1.55;text-align:center;height:44px;margin:0;padding:0;overflow:hidden;font-weight:600}
.post-info h3 a{transition:color var(--Tran-1)}
article.post-amp:hover .post-info h3 a{color:var(--Main-Color)}

/* ============================ Responsive ============================ */
@media screen and (max-width:1000px){
.SiteHeader>div{justify-content:center}
.menu-label.op{cursor:pointer;display:flex;align-items:center;justify-content:center;background:var(--Main-Gradient-BG);border-radius:var(--Border-Radius-2);height:38px;width:38px;position:absolute;right:var(--Main-Padding);top:31px;box-shadow:0 4px 12px -4px rgba(181,24,24,.5)}
.menu-label.op .icon{fill:var(--White-Color);width:22px;height:22px;display:block;font-size:0;margin:auto;background-size:100% 100%}
#btn-menu:checked ~ .overflow-ul{position:fixed;top:0;left:0;right:0;bottom:0;background-color:var(--Black-RGB-BG);z-index:99999;backdrop-filter:saturate(120%) blur(3px);-webkit-backdrop-filter:saturate(120%) blur(3px)}
.nav-menu .linkm{height:100vh;width:280px;position:fixed;top:0;right:-320px;background-color:var(--Secondary-BG);transition:var(--Tran-3);padding:var(--Main-Padding);float:none;overflow-x:hidden;opacity:0;visibility:hidden;z-index:99;box-shadow:-8px 0 30px rgba(0,0,0,.25)}
#btn-menu:checked ~ .overflow-ul .linkm{right:0;opacity:1;visibility:visible;transform:translateX(0px) translateY(0px)}
.menu-label.clo .icon-menu{position:absolute;left:25px;top:20px}
.dark-mode.hide{display:block;position:absolute;left:var(--Main-Padding);top:31px}
.dark-mode.hide label{height:38px;width:38px}
.menu-label.clo{display:flex;cursor:pointer;background:var(--Main-Gradient-BG);color:var(--White-Color);border-radius:var(--Border-Radius-2);padding:0 var(--Main-Padding);line-height:2.6;margin-bottom:var(--Margin-4);align-items:center;justify-content:flex-start;flex-direction:row;font-weight:600}
.nav-menu .nav ul.LinksList-Nav{display:block;width:var(--Full-width);margin-right:0!important;margin-bottom:var(--Margin-4);padding:0;overflow:hidden}
.nav-menu .nav ul.LinksList-Nav li{float:none;font-size:var(--Font-Size-2);margin-bottom:var(--Margin-4);margin-left:0!important}
.nav-menu .nav ul.LinksList-Nav li:last-child{margin-bottom:0}
.nav-menu .nav ul.LinksList-Nav li a,.menulabc{display:block;background-color:var(--Main-BG);color:var(--Main-Font-Color);border:var(--Main-Border);border-radius:var(--Border-Radius-2);padding:0 var(--Main-Padding);line-height:2.7;margin:0;height:inherit;font-weight:600}
.nav-menu .nav ul.LinksList-Nav li a:hover{background:var(--Main-Color);color:var(--White-Color)}
.nav-menu .nav ul.SocialMedia-Nav{float:none;margin:0!important;display:flex;flex-wrap:wrap;gap:8px}
.nav-menu .nav ul.SocialMedia-Nav li{margin:0}
.nav-menu .nav ul.SocialMedia-Nav a,.dark-mode label{height:40px;width:40px}
.nav-menu{width:auto;float:none}
.nav-menu .nav li .dots-table{display:none}
.grid-posts{grid-template-columns:repeat(3,1fr)}
.ItemsList{grid-template-columns:repeat(2,1fr)}
}
@media screen and (max-width:750px){
.TitleBox .Title,.TitleBox a.LoadMore{width:var(--Full-width);float:none}
.TitleBox a.LoadMore{margin-top:var(--Margin-4)}
.Top-Footer{grid-template-columns:repeat(2,1fr);padding:14px 0}
.Top-Footer ul.Links-List{margin:0!important}
.Copy-Rights{width:100%;float:none;margin-bottom:12px}
.Bottom-Footer ul.Site-Links{width:100%;position:relative;display:grid;grid-gap:var(--Main-Gap);grid-template-columns:repeat(1,1fr)}
ul.Site-Links li{margin-right:0!important}
.grid-posts{grid-template-columns:repeat(3,1fr)}
}
@media screen and (max-width:500px){
.container{padding:0 var(--Padding-3)}
.Top-Footer{grid-template-columns:repeat(1,1fr)}
.mw-adblock-con{left:0;right:0;width:100%}
.mw-adblock-title,.mw-adblock-text{font-size:13px}
.mw-cookie-wrapper{left:0;right:0;bottom:0;margin:auto!important;width:var(--Full-width)!important}
.grid-posts{grid-template-columns:repeat(2,1fr)}
.thumb{height:120px}
}
@media screen and (max-width:350px){.grid-posts{grid-template-columns:repeat(1,1fr)}}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* ============================ Dark Mode fixes ============================ */
.Night .nav-menu .nav ul.SocialMedia-Nav a{filter:none}
.Night ul.nav-tabs li a,.Night span.item-url a{background:var(--Secondary-Dark-Color)!important}
.Night .nav-menu .nav ul.LinksList-Nav li .dots-table span{background:var(--Main-Dark-Font-Color)}
.Night li.item span.item-image{background-color:var(--White-BG)}
.Night a:focus,.Night a:hover{color:var(--Main-Dark-Font-Color)!important}
.Night #blog-pager a:hover svg.icon{fill:var(--Hover-Link-Color)}

/* =======================================================================
   Alpha Pro — Matches Table CSS (Modernized 2026)
   All status classes/IDs used by main.js are preserved:
   mw-live / mw-soon / mw-not-start / mw-end, live/soon/not-start,
   #result, #match-time, .overlay-match, .text-match ...
   ======================================================================= */

ul.nav-tabs{display:grid;gap:var(--Main-Gap);grid-template-columns:1fr 1fr 1fr;float:var(--EndSide)}
ul.nav-tabs li a{display:block;background-color:var(--Gray-Color);color:var(--White-Color);font-size:var(--Font-Size-2);font-weight:600;line-height:2.4;padding:0 var(--Padding-3);border-radius:var(--Border-Radius-2);text-align:center;transition:transform var(--Tran-1),box-shadow var(--Tran-1),filter var(--Tran-1)}
ul.nav-tabs li a:hover{color:var(--White-Color);transform:translateY(-2px);filter:brightness(1.06)}
ul.nav-tabs li.Yes a{background:linear-gradient(135deg,#5580e0,#3457b8);box-shadow:0 4px 12px -4px rgba(63,111,214,.5)}
ul.nav-tabs li.Tod a{background:linear-gradient(135deg,#d21f1f,#8f1212);box-shadow:0 4px 12px -4px rgba(181,24,24,.5)}
ul.nav-tabs li.Tom a{background:linear-gradient(135deg,#ffc23d,#e59400);box-shadow:0 4px 12px -4px rgba(245,166,0,.5)}

.matchflex{position:relative;display:grid;grid-gap:var(--Main-Gap);grid-template-columns:repeat(1,1fr);padding:var(--Main-Padding)}
.match-container{background-color:var(--Main-BG);border-radius:var(--Main-Border-Radius);border:var(--Main-Border);font-size:var(--Font-Size-2);position:relative;text-align:center;overflow:hidden;transition:transform var(--Tran-1),box-shadow var(--Tran-1),border-color var(--Tran-1)}
.match-container:hover{transform:translateY(-2px);box-shadow:var(--Main-Box-Shadow);border-color:rgba(181,24,24,.35)}
.match-container.mw-live{order:1;border-color:rgba(181,24,24,.45);box-shadow:0 0 0 1px rgba(181,24,24,.25) inset}
.match-container.mw-soon{order:2}
.match-container.mw-not-start{order:3}
.match-container.mw-end{order:4;opacity:.94}
.match-container.live #match-time,.match-container.gools #match-time,.match-container.finshed #match-time,.match-container.soon div#result{display:none}
.match-container.comming #result,.match-container.soon #result{display:none}

.right-team,.left-team,.match-center{width:33.3333%;float:var(--StartSide)}
.right-team{display:flex;flex-direction:row;align-items:center;justify-content:center}
.left-team{display:flex;flex-direction:row-reverse;align-items:center;justify-content:center}
.team-logo,.team-name{position:relative;width:var(--Half-width);overflow:hidden}
.team-name{font-weight:600;line-height:1.4}
.team-logo img{display:block;margin:22px auto;width:var(--Full-width);height:auto;max-width:62px;max-height:62px;object-fit:contain;filter:drop-shadow(0 3px 6px rgba(0,0,0,.14));transition:transform var(--Tran-1)}
.match-container:hover .team-logo img{transform:scale(1.06)}

.match-center{display:flex;flex-direction:column;align-items:center;justify-content:center}
.match-timing{margin:var(--Main-Margin) auto}
#result{display:flex;font-size:var(--Font-Size-5);font-weight:700;letter-spacing:2px;margin-bottom:var(--Margin-2);align-items:center;justify-content:center;gap:6px}
#match-time{margin-bottom:var(--Margin-2);font-weight:600}
.match-timing .date,.date.live:before{display:block;position:relative;background-color:var(--Gray-Color);border-radius:var(--Border-Radius-2);font-size:var(--Font-Size-1);font-weight:600;width:82px;line-height:30px;padding:0 var(--Padding-2);color:var(--White-Color)}
.date.live:after,.date.live:before{content:"";position:absolute;left:50%;top:50%;transform:translateX(-50%) translateY(-50%);width:78px;height:28px;display:block}
.date.live:before{z-index:0;background-color:var(--Red-Color);animation:pulse-border 1.1s ease-out infinite;border-radius:var(--Border-Radius-2)}
.date.live:after{z-index:1;border-radius:var(--Border-Radius-2);transition:var(--Tran-1)}
@keyframes pulse-border{0%{transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1);opacity:1}100%{transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1.6);opacity:0}}
.date.live{background:linear-gradient(135deg,#e02424,#b51818)}
.date.soon{background:linear-gradient(135deg,#12b24a,#0a9c3a)}
.date.not-start{background:linear-gradient(135deg,#5580e0,#3f6fd6)}

.match-info{width:var(--Full-width);border-top:var(--Main-Border);overflow:hidden;background:linear-gradient(0deg,rgba(0,0,0,.02),transparent)}
body.Night .match-info{background:linear-gradient(0deg,rgba(255,255,255,.02),transparent)}
.match-info ul li{display:inline-block;float:var(--StartSide);width:33.3333%;text-align:center;margin:0 auto;line-height:2.6;overflow:hidden}

.overlay-match{cursor:pointer;position:absolute;top:0;bottom:0;left:0;right:0;background-color:var(--Main-RGB-BG);transition:var(--Tran-1);z-index:8;opacity:0;backdrop-filter:blur(1px)}
.match-container:hover .overlay-match{opacity:1}
.text-match{position:absolute;bottom:0;right:0;height:52px;margin:auto;left:0;top:0;width:52px;transform:scale(.8);transition:transform var(--Tran-1);background:no-repeat center / contain url("data:image/svg+xml;charset=utf8,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' %3E%3Cpath fill='%23fff' d='M256,0C114.617,0,0,114.615,0,256s114.617,256,256,256s256-114.615,256-256S397.383,0,256,0z M344.48,269.57l-128,80  c-2.59,1.617-5.535,2.43-8.48,2.43c-2.668,0-5.34-0.664-7.758-2.008C195.156,347.172,192,341.82,192,336V176 c0-5.82,3.156-11.172,8.242-13.992c5.086-2.836,11.305-2.664,16.238,0.422l128,80c4.676,2.93,7.52,8.055,7.52,13.57 S349.156,266.641,344.48,269.57z' class=''%3E%3C/path%3E%3C/svg%3E")}
.match-container:hover .text-match{transform:scale(1)}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

@media screen and (max-width:750px){
ul.nav-tabs{display:flex;width:var(--Full-width);flex-direction:row;justify-content:center;align-items:center;margin-top:var(--Margin-4)}
ul.nav-tabs li{width:33.333%}
}
@media screen and (max-width:500px){
ul.nav-tabs li a{font-size:var(--Font-Size-1)}
.right-team,.left-team{flex-direction:column}
.team-logo{width:var(--Full-width);height:80px}
.team-logo img{max-width:50px!important;max-height:50px;margin:var(--Main-Margin) auto}
.team-name{width:var(--Full-width)}
.match-info ul li{float:none;width:var(--Full-width)}
.match-info ul li:not(:nth-child(3)){display:none!important}
}

/* =======================================================================
   Alpha Pro — Web-App UI (Modernized 2026)
   App-style bottom navigation bar + standalone/PWA-like polish.
   100% additive: no existing selector is overridden except safe offsets.
   ======================================================================= */

:root{--AppNav-Height:66px;--AppNav-Safe:env(safe-area-inset-bottom,0px)}

/* Keep page content & footer clear of the fixed bar */
body{padding-bottom:calc(var(--AppNav-Height) + var(--AppNav-Safe))}
/* Lift the back-to-top button above the app bar */
.toTop{bottom:calc(var(--AppNav-Height) + 22px + var(--AppNav-Safe))!important}
/* Keep the floating post ad above the app bar */
.MalikAd{bottom:calc(-500px)}
.MalikAd.activ{bottom:calc(var(--AppNav-Height) + var(--AppNav-Safe))!important}

/* ---------- Bottom App Navigation ---------- */
.app-nav{position:fixed;left:0;right:0;bottom:0;z-index:120;display:flex;align-items:stretch;justify-content:space-around;height:calc(var(--AppNav-Height) + var(--AppNav-Safe));padding-bottom:var(--AppNav-Safe);background:color-mix(in srgb,var(--Secondary-BG) 88%,transparent);border-top:1px solid rgba(0,0,0,.06);box-shadow:0 -10px 30px -14px rgba(20,30,60,.30);backdrop-filter:saturate(150%) blur(12px);-webkit-backdrop-filter:saturate(150%) blur(12px)}
@supports not (background:color-mix(in srgb,#000 50%,transparent)){.app-nav{background:var(--Secondary-BG)}}
body.Night .app-nav{border-top-color:#262c3b}

.app-nav .app-item{flex:1 1 0;max-width:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--Main-Font-Color);font-size:11px;font-weight:600;line-height:1;cursor:pointer;position:relative;background:transparent;border:0;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:color var(--Tran-1),transform .12s ease}
.app-nav .app-item svg{width:23px;height:23px;fill:currentColor;transition:transform var(--Tran-1)}
.app-nav .app-item span{opacity:.9}
.app-nav .app-item:hover,.app-nav .app-item.active{color:var(--Main-Color)}
body.Night .app-nav .app-item:hover,body.Night .app-nav .app-item.active{color:var(--Main-Dark-Font-Color)}
.app-nav .app-item.active svg{transform:translateY(-2px)}
.app-nav .app-item.active::after{content:"";position:absolute;top:7px;width:5px;height:5px;border-radius:50%;background:currentColor}
.app-nav .app-item:active{transform:scale(.9)}

/* Center raised action (FAB) */
.app-nav .app-center{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;margin-top:-24px;text-decoration:none}
.app-nav .app-center .app-fab{position:relative;display:flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:50%;background:var(--Main-Gradient-BG);color:#fff;box-shadow:0 10px 22px -6px rgba(181,24,24,.6);border:4px solid var(--Secondary-BG);transition:transform var(--Tran-1),box-shadow var(--Tran-1)}
body.Night .app-nav .app-center .app-fab{border-color:#171b28}
.app-nav .app-center .app-fab svg{width:26px;height:26px;fill:#fff}
.app-nav .app-center .app-label{font-size:10.5px;font-weight:700;color:var(--Main-Color);margin-top:4px;line-height:1}
body.Night .app-nav .app-center .app-label{color:var(--Main-Dark-Font-Color)}
.app-nav .app-center:hover .app-fab{transform:translateY(-2px)}
.app-nav .app-center:active .app-fab{transform:scale(.92)}
.app-nav .app-center.active .app-fab{box-shadow:0 12px 26px -6px rgba(181,24,24,.75)}
.app-nav .app-center.active .app-label{filter:brightness(1.1)}

/* Live-match indicator on the center action */
.app-nav .app-center .live-badge{position:absolute;top:-2px;right:-2px;width:14px;height:14px;border-radius:50%;background:#ff3b30;border:2px solid #fff;display:none}
body.Night .app-nav .app-center .live-badge{border-color:#171b28}
.app-nav .app-center.has-live .live-badge{display:block;animation:app-live 1.3s infinite}
@keyframes app-live{0%{box-shadow:0 0 0 0 rgba(255,59,48,.65)}70%{box-shadow:0 0 0 9px rgba(255,59,48,0)}100%{box-shadow:0 0 0 0 rgba(255,59,48,0)}}

/* ---------- "القائمة" opens the existing drawer on ALL screen sizes ----------
   All rules scoped under #btn-menu:checked so the normal desktop header
   menu is completely untouched when the drawer is closed. */
@media screen and (min-width:1001px){
#btn-menu:checked ~ .overflow-ul{position:fixed;inset:0;background-color:var(--Black-RGB-BG);z-index:99999;backdrop-filter:saturate(120%) blur(3px);-webkit-backdrop-filter:saturate(120%) blur(3px)}
#btn-menu:checked ~ .overflow-ul .linkm{height:100vh;width:300px;position:fixed;top:0;right:0;background-color:var(--Secondary-BG);padding:var(--Main-Padding);float:none;overflow-y:auto;opacity:1;visibility:visible;box-shadow:-8px 0 30px rgba(0,0,0,.25)}
#btn-menu:checked ~ .overflow-ul .menu-label.clo{display:flex;cursor:pointer;background:var(--Main-Gradient-BG);color:var(--White-Color);border-radius:var(--Border-Radius-2);padding:0 var(--Main-Padding);line-height:2.6;margin-bottom:var(--Margin-4);align-items:center;justify-content:flex-start;font-weight:600}
#btn-menu:checked ~ .overflow-ul ul.LinksList-Nav{display:block;width:100%;margin:0 0 var(--Margin-4);padding:0}
#btn-menu:checked ~ .overflow-ul ul.LinksList-Nav li{float:none;font-size:var(--Font-Size-2);margin:0 0 var(--Margin-4)}
#btn-menu:checked ~ .overflow-ul ul.LinksList-Nav li a{display:block;background-color:var(--Main-BG);color:var(--Main-Font-Color);border:var(--Main-Border);border-radius:var(--Border-Radius-2);padding:0 var(--Main-Padding);line-height:2.7;height:auto;font-weight:600}
#btn-menu:checked ~ .overflow-ul ul.LinksList-Nav li a:hover{background:var(--Main-Color);color:#fff}
#btn-menu:checked ~ .overflow-ul .SocialMedia-Nav{display:flex;flex-wrap:wrap;gap:8px;float:none;margin:0}
#btn-menu:checked ~ .overflow-ul .SocialMedia-Nav li{margin:0}
#btn-menu:checked ~ .overflow-ul .SocialMedia-Nav a,#btn-menu:checked ~ .overflow-ul .dark-mode label{height:40px;width:40px}
#btn-menu:checked ~ .overflow-ul .dots-table{display:none}
}

/* Slightly wider on very small phones so 5 tabs never crowd */
@media screen and (max-width:360px){
.app-nav .app-item{font-size:10px}
.app-nav .app-item svg{width:21px;height:21px}
}

/* App-like press feedback on cards & buttons (touch) */
@media (hover:none){
article.post-amp:active{transform:scale(.98)}
.match-container:active{transform:scale(.995)}
}

@media (prefers-reduced-motion:reduce){
.app-nav .app-center.has-live .live-badge{animation:none}
.app-nav .app-item,.app-nav .app-center .app-fab{transition:none}
}



/* Pixel-perfect match shell for the reference HTML structure */
.kora-matches-container { display: flex; flex-direction: column; gap: 12px; }
.kora-match-card {
  display: block;
  position: relative;
  width: 100%;
  margin-bottom: 0;
  overflow: hidden;
  background: var(--Secondary-BG);
  border: var(--Main-Border);
  border-radius: var(--Main-Border-Radius);
  box-shadow: var(--Main-Box-Shadow);
  color: var(--Main-Font-Color);
  text-decoration: none;
  transition: transform var(--Tran-1), box-shadow var(--Tran-1), border-color var(--Tran-1);
}
.kora-match-card:hover { transform: translateY(-2px); box-shadow: var(--Hover-Box-Shadow); border-color: rgba(181,24,24,.45); }
.kora-match-card .match-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 34px;
  padding: 0 var(--Main-Padding);
  overflow: hidden;
  background: var(--Secondary-BG);
  border-bottom: var(--Main-Border);
  color: var(--Gray-Color-1);
  font-size: var(--Font-Size-1);
}
.kora-match-card .match-league,
.kora-match-card .match-channel { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kora-match-card .match-channel { color: var(--Main-Dark-Font-Color); }
.kora-match-card .match-container { margin: 0; border: 0; border-radius: 0; box-shadow: none; }
.kora-match-card .play-button {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--Main-RGB-BG);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--Tran-1);
}
.kora-match-card .play-button::before {
  content: "▶";
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--Main-Color);
  color: #fff;
  font-size: 20px;
  line-height: 1;
  padding-right: 2px;
  box-shadow: 0 8px 22px rgba(0,0,0,.3);
}
.kora-match-card:hover .play-button { opacity: 1; }
.kora-match-card.is-live { border-color: rgba(181,24,24,.45); box-shadow: 0 0 0 1px rgba(181,24,24,.25) inset; }
.kora-match-card .match-status { min-width: 82px; border-radius: var(--Border-Radius-2); color: #fff; font-size: var(--Font-Size-1); font-weight: 600; line-height: 30px; padding: 0 var(--Padding-2); }
.kora-match-card .match-status.status-live { background: linear-gradient(135deg,#e02424,#b51818); }
.kora-match-card .match-status.status-soon { background: linear-gradient(135deg,#12b24a,#0a9c3a); }
.kora-match-card .match-status.status-ended { background: var(--Gray-Color); }
.kora-match-card .match-score { direction: ltr; }
@media screen and (max-width: 500px) {
  .kora-match-card .match-head { min-height: 30px; padding-inline: 8px; font-size: 10px; }
  .kora-match-card .match-container { min-height: 180px; }
  .kora-match-card .match-status { min-width: 70px; line-height: 28px; }
}


/* FINAL REFERENCE OVERRIDE — remove legacy Singularity visuals */
:root {
  --Main-Color:#b51818;
  --Secondary-Color:#191d2d;
  --Main-Gradient-BG:linear-gradient(135deg,#20263a 0%,#0e1019 100%);
  --Body-BG:#0c0e16;
  --Main-BG:#12151f;
  --Secondary-BG:#171b28;
  --Main-Font-Color:#e9edf5;
  --Main-Dark-Font-Color:#ff8a3d;
  --Main-Border:1px solid #262c3b;
  --Border-1:1px solid #262c3b;
  --White-Color:#fff;
  --Gray-Color:#20263a;
  --Gray-Color-1:#a9b3c4;
  --Main-Fill-Color:#fff;
  --Main-Box-Shadow:0 8px 24px -10px rgba(0,0,0,.55);
  --Hover-Box-Shadow:0 16px 40px -14px rgba(0,0,0,.65);
}
html,body {
  background:#0c0e16!important;
  background-image:none!important;
  color:#e9edf5!important;
  font-family:"Neo Sans Arabic",Changa,"Segoe UI",sans-serif!important;
  overflow-x:hidden!important;
}
body { line-height:1.6!important; }
.container { width:100%!important; max-width:1080px!important; margin:0 auto!important; padding:0 12px!important; }
.SiteHeader { height:100px!important; margin:0 0 15px!important; background:#171b28!important; box-shadow:0 2px 16px -6px rgba(20,30,60,.18)!important; }
.SiteHeader>.container { display:flex!important; height:100%!important; max-width:1080px!important; padding:0 12px!important; margin:0 auto!important; }
.reference-site-strip { height:49px!important; max-width:1080px!important; padding:0 12px!important; margin:0 auto 15px!important; }
.TopSiteDes { display:flex!important; align-items:center!important; justify-content:center!important; position:relative!important; min-height:42px!important; box-sizing:border-box!important; padding:6px 12px!important; margin-bottom:15px!important; border-radius:12px!important; background:linear-gradient(135deg,#12281a,#0f2016)!important; border:1px solid rgba(95,208,127,.2)!important; box-shadow:0 8px 24px -10px rgba(0,0,0,.55)!important; color:#5fd07f!important; font-size:14px!important; text-align:center!important; overflow:hidden!important; }
.TopSiteDes p { margin:0!important; line-height:1.9!important; }
.TitleBox { position:relative!important; min-height:63px!important; height:auto!important; box-sizing:border-box!important; padding:12px!important; margin:0!important; background:#0f121b!important; border-bottom:1px solid #262c3b!important; overflow:hidden!important; }
.TitleBox .Title { display:block!important; float:right!important; width:auto!important; max-width:100%!important; min-width:0!important; margin:0!important; padding:0 12px!important; background:linear-gradient(135deg,#20263a 0%,#0e1019 100%)!important; color:#fff!important; font-family:"Neo Sans Arabic",Changa,"Segoe UI",sans-serif!important; font-size:16px!important; font-weight:700!important; line-height:2.4!important; letter-spacing:.2px!important; border-radius:8px!important; box-shadow:none!important; }
ul.nav-tabs { display:grid!important; float:left!important; width:310px!important; grid-template-columns:1fr 1fr 1fr!important; gap:12px!important; margin:0!important; padding:0!important; }
ul.nav-tabs li a { display:block!important; box-sizing:border-box!important; font-family:"Neo Sans Arabic",Changa,"Segoe UI",sans-serif!important; font-size:14px!important; font-weight:600!important; line-height:2.4!important; padding:0 8px!important; border-radius:8px!important; text-align:center!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; }
.kora-matches-container { display:grid!important; gap:0!important; margin:0 0 24px!important; padding:0!important; }
.kora-match-card { display:block!important; height:170px!important; box-sizing:border-box!important; margin:0!important; padding:0!important; overflow:hidden!important; background:#171b28!important; border:1px solid #262c3b!important; border-radius:12px!important; box-shadow:0 8px 24px -10px rgba(0,0,0,.55)!important; color:#e9edf5!important; }
.kora-match-card .match-head { display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; height:36px!important; box-sizing:border-box!important; padding:9px 16px!important; background:#12151f!important; border:0!important; color:#a9b3c4!important; font-size:12px!important; }
.kora-match-card .match-container { display:grid!important; grid-template-columns:1fr 108px 1fr!important; align-items:center!important; gap:10px!important; height:132px!important; box-sizing:border-box!important; margin:0!important; padding:18px 16px 20px!important; background:transparent!important; border:0!important; box-shadow:none!important; }
.kora-match-card .right-team,.kora-match-card .left-team { display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:9px!important; width:auto!important; height:87px!important; min-width:0!important; }
.kora-match-card .team-logo { display:flex!important; align-items:center!important; justify-content:center!important; width:60px!important; height:60px!important; flex:0 0 60px!important; margin:0!important; padding:0!important; border-radius:50%!important; background:#fff!important; overflow:hidden!important; }
.kora-match-card .team-logo img { display:block!important; width:auto!important; height:auto!important; max-width:50px!important; max-height:50px!important; margin:0!important; object-fit:contain!important; }
.kora-match-card .team-name { display:flow-root!important; width:auto!important; max-width:100%!important; height:18px!important; margin:0!important; padding:0!important; color:#e9edf5!important; font-family:"Neo Sans Arabic",Changa,"Segoe UI",sans-serif!important; font-size:13.5px!important; font-weight:700!important; line-height:18px!important; text-align:center!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; }
.kora-match-card .match-center { display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:0!important; width:auto!important; height:94px!important; }
.kora-match-card .match-status { display:flex!important; align-items:center!important; justify-content:center!important; min-width:0!important; width:max-content!important; height:26px!important; box-sizing:border-box!important; margin:0!important; padding:4px 12px!important; border-radius:999px!important; color:#fff!important; font-size:11.5px!important; font-weight:700!important; line-height:18px!important; }
.kora-match-card .match-status.status-live { background:#3f6fd6!important; }
.kora-match-card .match-status.status-ended { background:#718094!important; }
.kora-match-card .match-status.status-soon { background:#3f6fd6!important; }
.kora-match-card .match-score { display:block!important; height:19px!important; margin:8px 0 0!important; color:#e9edf5!important; font-size:19px!important; font-weight:800!important; line-height:19px!important; direction:ltr!important; }
.kora-match-card .match-time { display:block!important; height:35px!important; margin:0!important; color:#a9b3c4!important; font-size:12.5px!important; font-weight:600!important; line-height:35px!important; }
.kora-match-card .play-button { display:none!important; }
@media screen and (max-width:750px) {
  .TitleBox .Title { float:none!important; width:100%!important; box-sizing:border-box!important; }
  ul.nav-tabs { display:flex!important; float:none!important; width:100%!important; grid-template-columns:none!important; flex-direction:row!important; justify-content:center!important; align-items:center!important; margin-top:12px!important; }
  ul.nav-tabs li { width:33.333%!important; }
  .TitleBox { min-height:0!important; }
}
@media screen and (max-width:500px) {
  .kora-match-card { height:182px!important; }
  .kora-match-card .match-container { height:144px!important; grid-template-columns:1fr 80px 1fr!important; padding:18px 10px 20px!important; }
  .kora-match-card .right-team,.kora-match-card .left-team { height:100px!important; }
  .kora-match-card .team-logo { width:60px!important; height:60px!important; flex-basis:60px!important; }
  .kora-match-card .team-logo img { max-width:50px!important; max-height:50px!important; }
  .kora-match-card .team-name { font-size:12px!important; }
  .kora-match-card .match-center { height:100px!important; }
  .kora-match-card .match-status { font-size:11px!important; padding-inline:9px!important; }
}


/* FINAL ACCESSIBILITY + THEME FIXES */
button.menu-label,
button.dark-mode,
.dark-mode button,
.app-nav button {
  appearance:none!important;
  -webkit-appearance:none!important;
  border:0!important;
  font:inherit!important;
  cursor:pointer!important;
}
.dark-mode button {
  display:grid!important;
  align-items:center!important;
  justify-content:center!important;
  background-color:var(--Taps-BG)!important;
  color:inherit!important;
  border-radius:var(--Border-Radius-2)!important;
  height:34px!important;
  width:34px!important;
  padding:0!important;
  float:var(--EndSide)!important;
  transition:transform var(--Tran-1),filter var(--Tran-1),opacity var(--Tran-1)!important;
}
.dark-mode button:hover,.dark-mode button:focus-visible { transform:translateY(-2px)!important; filter:brightness(1.08)!important; }
.menu-label.op,.menu-label.clo { border:0!important; }
.app-nav button { color:inherit!important; }
.kora-match-card .match-container { direction:rtl!important; }
.kora-match-card .match-score,.kora-match-card .match-time { direction:ltr!important; unicode-bidi:plaintext!important; }

/* Light mode: overrides every hard-coded dark declaration in the legacy stack. */
html body.light-mode,
html body.light-mode .site-content {
  background:#e8eff9!important;
  background-image:none!important;
  color:#2b303b!important;
}
body.light-mode .SiteHeader { background:#fff!important; border-bottom-color:#dbe6f5!important; box-shadow:0 2px 16px -6px rgba(20,30,60,.18)!important; }
body.light-mode #logo { background:linear-gradient(135deg,#d21f1f 0%,#8f1212 100%)!important; }
body.light-mode .nav-menu .nav ul.LinksList-Nav li a,
body.light-mode .nav-menu .nav ul.LinksList-Nav li a:hover { color:#2b303b!important; }
body.light-mode .nav-menu .nav ul.LinksList-Nav li a:hover { color:#b51818!important; }
body.light-mode .nav-menu .nav ul.SocialMedia-Nav a { color:#fff!important; }
body.light-mode .reference-site-strip .TopSiteDes { background:linear-gradient(135deg,#e0f5e6,#d0efd7)!important; color:#1f7a37!important; border-color:rgba(31,122,55,.18)!important; }
body.light-mode .TitleBox { background:#fff!important; border-bottom-color:#dbe6f5!important; }
body.light-mode .TitleBox .Title { background:linear-gradient(135deg,#d21f1f 0%,#8f1212 100%)!important; color:#fff!important; }
body.light-mode ul.nav-tabs li a { color:#2b303b!important; }
body.light-mode ul.nav-tabs li a:hover { color:#b51818!important; }
body.light-mode .kora-match-card { background:#fff!important; border-color:#dbe6f5!important; box-shadow:0 6px 20px -8px rgba(20,30,60,.18)!important; color:#2b303b!important; }
body.light-mode .kora-match-card .match-head { background:#f4f7fb!important; color:#718ba1!important; }
body.light-mode .kora-match-card .team-name { color:#2b303b!important; }
body.light-mode .kora-match-card .match-score { color:#2b303b!important; }
body.light-mode .kora-match-card .match-time { color:#718ba1!important; }
body.light-mode .kora-match-card .match-status.status-ended { background:#718ba1!important; color:#fff!important; }
body.light-mode .kora-match-card .team-logo { background:#fff!important; border:1px solid #dbe6f5!important; }
body.light-mode .blogpost,
body.light-mode article.post-amp,
body.light-mode footer,
body.light-mode .app-nav { background:#fff!important; color:#2b303b!important; border-color:#dbe6f5!important; }
body.light-mode .TitleBox + .kora-matches-container + .TitleBox { background:#fff!important; }
body.light-mode .app-nav { box-shadow:0 -4px 20px -10px rgba(20,30,60,.16)!important; }
body.light-mode .app-nav .app-item,
body.light-mode .app-nav .app-label { color:#2b303b!important; }
body.light-mode .app-nav .app-item.active,
body.light-mode .app-nav .app-label { color:#b51818!important; }
body.light-mode .app-fab { background:#fff!important; border-color:#dbe6f5!important; color:#b51818!important; }
body.light-mode .kora-empty-state { background:#fff!important; color:#2b303b!important; border-color:#dbe6f5!important; }

@media screen and (max-width:750px) {
  .dark-mode button { height:40px!important; width:40px!important; }
  .kora-match-card .match-container { direction:rtl!important; }
}

html.light-mode,
html.light-mode body { background:#e8eff9!important; background-image:none!important; }
html.light-mode body { color:#2b303b!important; }


/* FINAL DETERMINISTIC THEME LAYER — loaded last */
html[data-theme="dark"], html.Night {
  --koora-page-bg:#0c0e16;
  --koora-surface:#171b28;
  --koora-surface-2:#111521;
  --koora-text:#f4f6fb;
  --koora-muted:#a7afc0;
  --koora-border:rgba(255,255,255,.12);
}
html[data-theme="light"], html.light-mode {
  --koora-page-bg:#eef3f9;
  --koora-surface:#ffffff;
  --koora-surface-2:#f6f8fc;
  --koora-text:#202838;
  --koora-muted:#5d6b7f;
  --koora-border:#d8e1ec;
  background-color:#eef3f9!important;
  background-image:none!important;
}
html[data-theme="dark"] body, html.Night body {
  background:#0c0e16!important;
  color:#f4f6fb!important;
  background-image:none!important;
}
html[data-theme="light"] body, html.light-mode body {
  background:#eef3f9!important;
  color:#202838!important;
  background-image:none!important;
}
html[data-theme="dark"] .SiteHeader, html.Night .SiteHeader { background:#171b28!important; color:#f4f6fb!important; }
html[data-theme="light"] .SiteHeader, html.light-mode .SiteHeader { background:#fff!important; color:#202838!important; border-color:#d8e1ec!important; }
html[data-theme="dark"] .reference-site-strip .TopSiteDes { background:#071c12!important; color:#69d18b!important; }
html[data-theme="light"] .reference-site-strip .TopSiteDes { background:#e1f4e6!important; color:#1d7b39!important; }
html[data-theme="dark"] .TitleBox, html.Night .TitleBox { background:#111521!important; border-color:rgba(255,255,255,.08)!important; }
html[data-theme="light"] .TitleBox, html.light-mode .TitleBox { background:#fff!important; border-color:#d8e1ec!important; }
html[data-theme="dark"] .TitleBox .Title { background:#171b28!important; color:#f4f6fb!important; }
html[data-theme="light"] .TitleBox .Title { background:#fff!important; color:#202838!important; }
html[data-theme="dark"] .kora-match-card, html.Night .kora-match-card { background:#171b28!important; border-color:rgba(210,31,31,.42)!important; color:#f4f6fb!important; }
html[data-theme="light"] .kora-match-card, html.light-mode .kora-match-card { background:#fff!important; border-color:#d8e1ec!important; color:#202838!important; box-shadow:0 5px 18px rgba(48,69,96,.10)!important; }
html[data-theme="dark"] .kora-match-card .match-head { background:#111521!important; color:#a7afc0!important; }
html[data-theme="light"] .kora-match-card .match-head { background:#f3f6fa!important; color:#5d6b7f!important; }
html[data-theme="dark"] .kora-match-card .team-name, html[data-theme="dark"] .kora-match-card .match-score { color:#f4f6fb!important; }
html[data-theme="light"] .kora-match-card .team-name, html[data-theme="light"] .kora-match-card .match-score { color:#202838!important; }
html[data-theme="dark"] .kora-match-card .match-time { color:#a7afc0!important; }
html[data-theme="light"] .kora-match-card .match-time { color:#5d6b7f!important; }
html[data-theme="dark"] .app-nav { background:#151a27!important; color:#f4f6fb!important; border-color:rgba(255,255,255,.12)!important; }
html[data-theme="light"] .app-nav { background:#fff!important; color:#202838!important; border-color:#d8e1ec!important; }
html[data-theme="dark"] .app-nav .app-item, html[data-theme="dark"] .app-nav .app-label { color:#f4f6fb!important; }
html[data-theme="light"] .app-nav .app-item, html[data-theme="light"] .app-nav .app-label { color:#202838!important; }
html[data-theme="dark"] .app-nav .active, html[data-theme="dark"] .app-nav .app-label { color:#ff9a3d!important; }
html[data-theme="light"] .app-nav .active, html[data-theme="light"] .app-nav .app-label { color:#c51f1f!important; }
html[data-theme="dark"] .nav-tabs li a,
html[data-theme="dark"] .nav-tabs li.Yes a,
html[data-theme="dark"] .nav-tabs li.Tod a,
html[data-theme="dark"] .nav-tabs li.Tom a { color:#fff!important; }
html[data-theme="light"] .nav-tabs li a,
html[data-theme="light"] .nav-tabs li.Yes a,
html[data-theme="light"] .nav-tabs li.Tod a,
html[data-theme="light"] .nav-tabs li.Tom a { color:#202838!important; }
html[data-theme="dark"] .nav-tabs li.Yes a { background:#1f6fd0!important; color:#fff!important; }
html[data-theme="dark"] .nav-tabs li.Tod a { background:#d21f1f!important; color:#fff!important; }
html[data-theme="dark"] .nav-tabs li.Tom a { background:#bd8b00!important; color:#1b1500!important; }
html[data-theme="light"] .nav-tabs li.Yes a { background:#dcecff!important; color:#134d93!important; }
html[data-theme="light"] .nav-tabs li.Tod a { background:#ffe1e1!important; color:#8e1111!important; }
html[data-theme="light"] .nav-tabs li.Tom a { background:#fff0bd!important; color:#705100!important; }
html[data-theme="dark"] .elite-date-btn.active { outline:2px solid rgba(255,255,255,.65)!important; outline-offset:2px!important; }
html[data-theme="light"] .elite-date-btn.active { outline:2px solid rgba(32,40,56,.35)!important; outline-offset:2px!important; }


/* FINAL MOBILE DAY-TAB FIT — no clipped Arabic labels */
@media screen and (max-width:750px) {
  ul.nav-tabs { gap:4px!important; width:100%!important; overflow:visible!important; }
  ul.nav-tabs li { width:auto!important; min-width:0!important; flex:1 1 0!important; }
  ul.nav-tabs li a { width:100%!important; min-width:0!important; padding-inline:2px!important; font-size:12px!important; line-height:2.3!important; white-space:nowrap!important; overflow:visible!important; text-overflow:clip!important; letter-spacing:-.25px!important; }
}
@media screen and (max-width:340px) {
  ul.nav-tabs { gap:3px!important; }
  ul.nav-tabs li a { font-size:10.5px!important; letter-spacing:-.45px!important; }
}


/* FINAL SCORE SEMANTICS — home score stays beside right/home team */
.kora-match-card .match-score {
  display:flex!important;
  flex-direction:row-reverse!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
  direction:ltr!important;
  unicode-bidi:isolate!important;
  white-space:nowrap!important;
}
.kora-match-card .match-score .score-home,
.kora-match-card .match-score .score-away,
.kora-match-card .match-score .score-divider { display:inline-block!important; direction:ltr!important; unicode-bidi:isolate!important; }
.kora-match-card .match-score .score-divider { padding-inline:2px!important; }
.match-score-large { direction:ltr!important; unicode-bidi:isolate!important; }

/* Koora Live global timezone strip */
.timezone-strip{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 14px;margin-top:10px;margin-bottom:12px;background:var(--zn-surface,#171b28);border:1px solid var(--zn-border,rgba(255,255,255,.12));border-radius:10px;color:var(--zn-text,#f4f6fb);font-size:12px}
.timezone-strip-title{font-weight:800;color:var(--zn-accent,#ff9a3d);white-space:nowrap}
.timezone-control{display:inline-flex;align-items:center;gap:5px;min-width:0}
.timezone-control span{opacity:.8;white-space:nowrap}
.timezone-control select{max-width:205px;min-height:30px;padding:4px 8px;border-radius:6px;border:1px solid var(--zn-border,rgba(255,255,255,.2));background:var(--zn-card,#111521);color:inherit;font:inherit}
.timezone-current,.timezone-format-label{opacity:.7;direction:ltr;unicode-bidi:isolate}
html[data-theme="light"] .timezone-strip,html.light-mode .timezone-strip{background:#fff;color:#202838;border-color:#d8e1ec}
html[data-theme="light"] .timezone-control select,html.light-mode .timezone-control select{background:#f3f6fa;color:#202838;border-color:#cbd5e1}
@media screen and (max-width:600px){.timezone-strip{align-items:stretch;margin-inline:12px;padding:8px;gap:7px}.timezone-strip-title{width:100%}.timezone-control{flex:1;display:flex;flex-direction:column;align-items:stretch;gap:3px}.timezone-control select{max-width:none;width:100%;font-size:11px}.timezone-current,.timezone-format-label{font-size:10px;align-self:center}}

/* SEO image-size guard: keep article and team imagery lightweight and stable. */
.post-featured-image{width:100%;max-width:960px;margin:0 auto 18px;overflow:hidden;border-radius:var(--Main-Border-Radius)}
.post-featured-image img{display:block;width:100%;max-width:960px;height:auto;max-height:540px;object-fit:cover}
.news-card-thumb img{display:block;width:100%;max-width:480px;height:auto;max-height:270px;object-fit:cover}
.detail-team img{display:block;width:96px!important;height:96px!important;max-width:96px;object-fit:contain}
@media screen and (max-width:700px){
  .post-featured-image{max-width:100%;border-radius:10px}
  .post-featured-image img{max-height:320px}
  .detail-team img{width:72px!important;height:72px!important;max-width:72px}
}

/* Dynamic match article — structured, RTL, mobile-first presentation. */
.match-article-page{padding-bottom:120px}
.match-breadcrumbs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:18px 0 14px;color:var(--Main-Font-Color,#8892a7);font-size:13px}
.match-breadcrumbs a{color:var(--Main-Color,#d21f1f);text-decoration:none}
.match-article-card{max-width:960px;margin:0 auto;padding:0 0 24px;background:var(--Main-BG,#111827);border:1px solid rgba(210,31,31,.28);border-radius:18px;overflow:hidden;box-shadow:0 14px 40px rgba(0,0,0,.12)}
.match-article-header{padding:24px 20px 18px;text-align:center;background:linear-gradient(145deg,rgba(210,31,31,.12),rgba(255,255,255,.02))}
.match-article-league{display:inline-flex;align-items:center;justify-content:center;gap:8px;color:var(--Main-Color,#d21f1f);font-weight:700;font-size:14px}
.match-article-league img{width:40px;height:40px;object-fit:contain;border-radius:50%}
.match-league-icon{font-size:22px;line-height:1}
.match-article-title{margin:12px 0 5px;color:var(--Main-Font-Color,#f4f6fb);font-size:clamp(22px,4vw,34px);line-height:1.35;font-weight:800}
.match-article-subtitle{margin:0;color:#8d97a9;font-size:13px}
.match-scoreboard{display:grid;grid-template-columns:minmax(0,1fr) 170px minmax(0,1fr);align-items:center;gap:12px;padding:30px 24px 22px;text-align:center;direction:rtl}
.match-article-team{display:flex;min-width:0;flex-direction:column;align-items:center;justify-content:center;gap:8px;direction:rtl}
.match-article-team img{width:96px!important;height:96px!important;max-width:96px;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(0,0,0,.15))}
.match-article-team h2{max-width:100%;margin:0;color:var(--Main-Font-Color,#f4f6fb);font-size:clamp(15px,2.5vw,21px);line-height:1.35;overflow-wrap:anywhere}
.team-side-label{color:#9099ab;font-size:11px}
.match-article-center{display:flex;min-width:0;flex-direction:column;align-items:center;justify-content:center;direction:rtl}
.match-article-status{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:4px 13px;border-radius:20px;background:rgba(111,123,145,.18);color:#c4cada;font-size:12px;font-weight:700;white-space:nowrap}
.match-article-status.status-live{background:#d21f1f;color:#fff;box-shadow:0 0 18px rgba(210,31,31,.32)}
.match-article-score{display:flex;align-items:center;justify-content:center;gap:9px;margin:10px 0 2px;color:var(--Main-Font-Color,#f4f6fb);font-size:clamp(30px,5vw,46px);font-weight:800;line-height:1}
.match-score-divider{color:var(--Main-Color,#d21f1f);font-size:.7em}
.match-article-time{color:#9ea8b9;font-size:13px;direction:rtl}
.match-article-actions{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding:0 20px 22px}
.match-watch-button,.match-back-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:9px 18px;border-radius:9px;text-decoration:none;font-size:14px;font-weight:700;transition:transform .2s ease,opacity .2s ease}
.match-watch-button{background:var(--Main-Color,#d21f1f);color:#fff!important;box-shadow:0 7px 18px rgba(210,31,31,.24)}
.match-watch-button:hover,.match-back-button:hover{transform:translateY(-2px);opacity:.92}
.match-watch-button.is-disabled{background:#667085;box-shadow:none;cursor:not-allowed}
.match-back-button{background:rgba(111,123,145,.16);color:var(--Main-Font-Color,#f4f6fb)!important;border:1px solid rgba(111,123,145,.24)}
.match-information,.match-description,.match-stream-section,.match-share-section{margin:0 20px 18px;padding:18px;background:rgba(111,123,145,.08);border:1px solid rgba(111,123,145,.18);border-radius:12px}
.match-information h2,.match-description h2,.match-stream-section h2,.match-share-section h2,.related-matches-section h2{margin:0 0 14px;color:var(--Main-Font-Color,#f4f6fb);font-size:18px;font-weight:800}
.match-information-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.match-information-item{display:flex;min-width:0;flex-direction:column;gap:5px;padding:11px 12px;background:rgba(0,0,0,.08);border-radius:8px}
.info-label{color:#8d97a9;font-size:11px}
.match-information-item strong{min-width:0;color:var(--Main-Font-Color,#f4f6fb);font-size:13px;line-height:1.45;overflow-wrap:anywhere}
.match-content{color:var(--Main-Font-Color,#d6dbe5);font-size:15px;line-height:1.9}
.match-content p:last-child{margin-bottom:0}
.match-stream-frame{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:10px;background:#05070b}
.match-stream-frame iframe{display:block;width:100%;height:100%;border:0}
.match-share-buttons{display:flex;gap:8px;flex-wrap:wrap}
.match-share-buttons a{display:inline-flex;align-items:center;justify-content:center;min-width:78px;padding:8px 12px;border-radius:8px;background:rgba(210,31,31,.12);border:1px solid rgba(210,31,31,.25);color:var(--Main-Font-Color,#f4f6fb);font-size:12px;text-decoration:none}
.related-matches-section{max-width:960px;margin:20px auto 0;padding:0 2px}
.related-matches-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.related-match-card{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;padding:12px 14px;border:1px solid rgba(111,123,145,.18);border-radius:10px;background:var(--Main-BG,#111827);color:var(--Main-Font-Color,#f4f6fb);text-decoration:none}
.related-match-card span{min-width:0;font-size:13px;line-height:1.45;overflow-wrap:anywhere}
.related-match-card time{flex:0 0 auto;color:var(--Main-Color,#d21f1f);font-size:12px;white-space:nowrap}
@media screen and (max-width:700px){
  .match-article-card{border-radius:12px}
  .match-article-header{padding:20px 14px 15px}
  .match-scoreboard{grid-template-columns:minmax(0,1fr) 94px minmax(0,1fr);gap:5px;padding:24px 10px 18px}
  .match-article-team img{width:72px!important;height:72px!important;max-width:72px}
  .match-article-team h2{font-size:14px}
  .match-article-score{font-size:29px;gap:5px}
  .match-article-status{padding:4px 8px;font-size:10px}
  .match-information,.match-description,.match-stream-section,.match-share-section{margin-left:12px;margin-right:12px;padding:14px}
  .match-information-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .related-matches-section{padding:0 12px}
}
@media screen and (max-width:380px){
  .match-scoreboard{grid-template-columns:minmax(0,1fr) 82px minmax(0,1fr);padding-left:5px;padding-right:5px}
  .match-article-team img{width:60px!important;height:60px!important;max-width:60px}
  .match-article-team h2{font-size:12px}
  .match-article-score{font-size:25px}
  .related-matches-grid{grid-template-columns:1fr}
}