*{
    box-sizing:border-box;
}

:root{
    --bg:#07101e;
    --panel:#0e1a2b;
    --panel2:#111f33;
    --line:rgba(255,255,255,.07);
    --text:#edf4ff;
    --muted:#8497b0;
    --green:#55d8bd;
    --green2:#21ae91;
    --danger:#ff737d;
}

html{
    background:var(--bg);
}

body{
    margin:0;
    min-height:100vh;
    color:var(--text);
    background:var(--bg);
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        "Microsoft YaHei",
        Arial,
        sans-serif;
}

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

button,
input,
select{
    font:inherit;
}

button{
    cursor:pointer;
}

.header{
    height:70px;
    padding:0 6%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:sticky;
    top:0;
    z-index:40;
    background:rgba(7,16,30,.96);
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(12px);
}

.brand{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:900;
    letter-spacing:1px;
    font-size:20px;
}

.brand-mark{
    width:34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background:var(--green2);
    color:#fff;
    font-weight:900;
}

.nav{
    display:flex;
    align-items:center;
    gap:26px;
    font-size:14px;
    color:#9caec5;
}

.nav a:hover,
.nav a.active{
    color:#fff;
}

.nav-btn{
    border:0;
    background:none;
    color:#9caec5;
}

.register-link{
    padding:9px 16px;
    border-radius:8px;
    background:var(--green2);
    color:#fff !important;
}

.hero{
    min-height:510px;
    display:flex;
    align-items:center;
    padding:90px 7%;
    background:
        radial-gradient(
            circle at 80% 30%,
            rgba(32,128,255,.19),
            transparent 34%
        ),
        radial-gradient(
            circle at 20% 70%,
            rgba(64,215,184,.13),
            transparent 32%
        ),
        var(--bg);
}

.hero-inner{
    max-width:760px;
}

.eyebrow,
.small-title{
    color:var(--green);
    font-size:12px;
    font-weight:800;
    letter-spacing:2px;
}

.hero h1{
    max-width:720px;
    margin:18px 0;
    font-size:52px;
    line-height:1.18;
    letter-spacing:-1px;
}

.hero p{
    max-width:620px;
    color:#98aac1;
    font-size:17px;
    line-height:1.9;
}

.hero-actions{
    display:flex;
    gap:12px;
    margin-top:30px;
}

.btn{
    min-height:44px;
    padding:0 22px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:9px;
    font-weight:700;
}

.btn.primary{
    color:#fff;
    background:var(--green2);
}

.btn.secondary{
    color:#dbe6f3;
    background:#142238;
    border:1px solid var(--line);
}

.btn.small{
    min-height:36px;
    padding:0 14px;
    font-size:13px;
}

.full{
    width:100%;
    margin-top:12px;
}

.section{
    width:100%;
    max-width:1280px;
    margin:0 auto;
    padding:58px 7%;
}

.section-head{
    margin-bottom:24px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
}

.section-head h2{
    margin:7px 0 0;
}

.section-head>a{
    color:var(--green);
    font-size:13px;
}

.grid{
    display:grid;
    gap:18px;
}

.grid.three{
    grid-template-columns:
        repeat(3,minmax(0,1fr));
}

.page-head{
    padding:65px 7% 38px;
    border-bottom:1px solid var(--line);
}

.page-head h1{
    margin:10px 0;
    font-size:36px;
}

.page-head p{
    color:var(--muted);
}

.venue-card,
.event-card,
.wallet-card,
.member-card,
.panel,
.stat-card{
    border:1px solid var(--line);
    background:var(--panel);
    border-radius:15px;
}

.venue-card{
    min-height:205px;
    padding:25px;
}

.venue-card:hover{
    border-color:
        rgba(85,216,189,.35);
}

.venue-icon{
    width:50px;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:13px;
    background:
        rgba(85,216,189,.10);
    color:var(--green);
    font-weight:800;
}

.venue-card h3{
    margin:20px 0 9px;
}

.venue-card p{
    min-height:48px;
    color:#8296b0;
    line-height:1.7;
}

.venue-footer{
    margin-top:18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.tag,
.status,
.test-label,
.state-badge,
.admin-badge{
    display:inline-flex;
    align-items:center;
    padding:5px 9px;
    border-radius:20px;
    font-size:11px;
}

.tag{
    color:var(--green);
    background:
        rgba(85,216,189,.09);
}

.status{
    color:#8fa2ba;
    background:
        rgba(255,255,255,.05);
}

.status.live{
    color:var(--green);
}

.test-label{
    margin-left:7px;
    color:#c5a970;
    background:
        rgba(216,180,90,.08);
}

.event-list{
    display:grid;
    gap:14px;
}

.event-card{
    padding:21px 23px;
}

.event-top,
.event-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.event-time{
    color:#71849e;
    font-size:12px;
}

.teams{
    display:grid;
    grid-template-columns:
        1fr 45px 1fr;
    gap:10px;
    align-items:center;
    text-align:center;
    padding:26px 0;
}

.teams strong{
    font-size:19px;
}

.teams span{
    color:#61758f;
    font-size:12px;
}

.event-bottom{
    padding-top:12px;
    border-top:1px solid var(--line);
    color:#71849d;
    font-size:12px;
}

.filters{
    display:flex;
    gap:10px;
    margin-bottom:22px;
}

.filter{
    height:36px;
    padding:0 17px;
    border-radius:8px;
    border:1px solid var(--line);
    background:#101d30;
    color:#91a3ba;
}

.filter.active{
    color:#fff;
    border-color:var(--green2);
    background:
        rgba(33,174,145,.14);
}

.auth-wrap{
    min-height:
        calc(100vh - 140px);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:50px 20px;
}

.auth-box{
    width:100%;
    max-width:430px;
    padding:34px;
    border-radius:18px;
    background:var(--panel);
    border:1px solid var(--line);
}

.auth-box h1{
    margin:10px 0 8px;
}

.muted{
    color:var(--muted);
    margin-bottom:26px;
}

.auth-box label,
.form-grid label{
    display:block;
    margin:16px 0 8px;
    color:#a9b8ca;
    font-size:13px;
}

.auth-box input,
.form-grid input,
.form-grid select,
.search-box input,
.point-adjust input{
    width:100%;
    height:46px;
    padding:0 13px;
    border:1px solid
        rgba(255,255,255,.09);
    border-radius:8px;
    outline:none;
    color:#fff;
    background:#081323;
}

.auth-box input:focus,
.form-grid input:focus,
.form-grid select:focus,
.search-box input:focus,
.point-adjust input:focus{
    border-color:var(--green2);
}

.auth-bottom{
    margin-top:22px;
    text-align:center;
    color:var(--muted);
    font-size:13px;
}

.auth-bottom a{
    color:var(--green);
}

.message{
    min-height:20px;
    font-size:13px;
}

.message.error{
    color:var(--danger);
}

.message.success{
    color:var(--green);
}

.account-grid{
    display:grid;
    grid-template-columns:
        1.1fr 1fr;
    gap:18px;
}

.wallet-card{
    padding:28px;
}

.wallet-label{
    color:var(--muted);
    font-size:13px;
}

.balance{
    margin:14px 0 7px;
    font-size:44px;
    font-weight:900;
}

.wallet-note{
    color:#687c96;
    font-size:12px;
}

.member-card{
    padding:18px 25px;
}

.member-row{
    min-height:58px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid var(--line);
    font-size:13px;
}

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

.member-row span{
    color:var(--muted);
}

.panel{
    overflow:hidden;
}

.panel-head{
    min-height:70px;
    padding:15px 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid var(--line);
}

.panel-head h2,
.panel-head h3{
    margin:0;
}

.panel-head span{
    display:block;
    margin-top:5px;
    color:#75889f;
    font-size:11px;
}

.ledger-row{
    min-height:67px;
    padding:13px 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid var(--line);
}

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

.ledger-row strong{
    display:block;
    font-size:13px;
}

.ledger-row small{
    display:block;
    margin-top:5px;
    color:#6d8099;
}

.ledger-right{
    text-align:right;
}

.plus{
    color:var(--green);
}

.minus{
    color:var(--danger);
}

.empty{
    padding:32px;
    text-align:center;
    color:#71849d;
}

.admin-head{
    padding:40px 6%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    border-bottom:1px solid var(--line);
}

.admin-head h1{
    margin:7px 0 0;
}

.admin-user{
    padding:8px 13px;
    border-radius:20px;
    background:#122238;
    color:#9cb0c8;
    font-size:12px;
}

.admin-main{
    max-width:1500px;
    margin:0 auto;
    padding:28px 5% 60px;
}

.stats-grid{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.stat-card{
    padding:21px;
}

.stat-card span{
    color:#7488a1;
    font-size:12px;
}

.stat-card strong{
    display:block;
    margin-top:10px;
    font-size:28px;
}

.admin-layout{
    display:grid;
    grid-template-columns:
        170px minmax(0,1fr);
    gap:18px;
}

.admin-menu{
    align-self:start;
    padding:8px;
    border-radius:12px;
    background:var(--panel);
    border:1px solid var(--line);
}

.admin-tab{
    width:100%;
    height:43px;
    padding:0 12px;
    border:0;
    border-radius:8px;
    text-align:left;
    color:#8295ae;
    background:transparent;
}

.admin-tab.active{
    color:#fff;
    background:#15253a;
}

.admin-section{
    display:none;
}

.admin-section.active{
    display:block;
}

.admin-row{
    min-height:72px;
    padding:14px 21px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    border-bottom:1px solid var(--line);
}

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

.admin-row strong{
    display:block;
}

.admin-row small{
    display:block;
    margin-top:6px;
    color:#71849c;
}

.admin-actions{
    display:flex;
    align-items:center;
    gap:8px;
}

.small-btn{
    min-width:64px;
    height:34px;
    padding:0 11px;
    border:1px solid var(--line);
    border-radius:7px;
    background:#142238;
    color:#dce7f5;
}

.small-btn.danger{
    color:#ff8990;
}

.search-box{
    display:flex;
    gap:7px;
}

.search-box input{
    width:180px;
    height:36px;
}

.state-badge{
    color:var(--green);
    background:
        rgba(85,216,189,.09);
}

.state-badge.off{
    color:#8a9bb0;
    background:
        rgba(255,255,255,.05);
}

.admin-badge{
    margin-left:7px;
    color:var(--green);
    background:
        rgba(85,216,189,.09);
}

.modal{
    position:fixed;
    inset:0;
    z-index:100;
    display:none;
    align-items:center;
    justify-content:center;
    padding:20px;
    background:
        rgba(2,7,14,.75);
}

.modal.show{
    display:flex;
}

.modal-box{
    width:100%;
    max-width:600px;
    max-height:88vh;
    overflow:auto;
    padding:24px;
    border-radius:16px;
    border:1px solid var(--line);
    background:#0d192a;
    box-shadow:
        0 30px 80px rgba(0,0,0,.4);
}

.modal-box.large{
    max-width:760px;
}

.modal-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:15px;
}

.modal-head h2{
    margin:0;
}

.modal-head button{
    width:34px;
    height:34px;
    border:0;
    background:none;
    color:#93a5bb;
    font-size:25px;
}

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

.form-grid .wide{
    grid-column:1/-1;
}

.checkbox-row{
    padding:10px 0;
}

.checkbox-row label{
    display:flex;
    gap:9px;
    align-items:center;
}

.checkbox-row input{
    width:auto;
    height:auto;
}

.modal-actions{
    display:flex;
    justify-content:flex-end;
    gap:10px;
    margin-top:22px;
}

.member-summary{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.member-summary>div{
    padding:18px;
    border-radius:10px;
    background:#111f33;
}

.member-summary span{
    display:block;
    color:#798ca4;
    font-size:11px;
}

.member-summary strong{
    display:block;
    margin-top:7px;
    font-size:18px;
}

.point-adjust{
    display:grid;
    grid-template-columns:
        130px 1fr auto;
    gap:9px;
    margin:15px 0;
}

.inner-panel{
    margin-top:10px;
}

.log-row{
    display:grid;
    grid-template-columns:
        1.3fr 1fr 1fr 1.5fr;
    gap:14px;
    padding:13px 20px;
    border-bottom:1px solid var(--line);
    color:#8497af;
    font-size:12px;
}

.log-action{
    color:#d5e2f2;
}

.footer{
    padding:28px 6%;
    display:flex;
    justify-content:space-between;
    border-top:1px solid var(--line);
    color:#657991;
    font-size:12px;
}


@media(max-width:900px){

    .grid.three{
        grid-template-columns:1fr;
    }

    .stats-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

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

    .admin-menu{
        display:flex;
        gap:5px;
        overflow:auto;
    }

    .admin-tab{
        min-width:100px;
        text-align:center;
    }

    .account-grid{
        grid-template-columns:1fr;
    }
}


@media(max-width:650px){

    .header{
        padding:0 16px;
    }

    .brand>span:last-child{
        display:none;
    }

    .nav{
        gap:12px;
    }

    .nav>a:nth-child(1),
    .nav>a:nth-child(2),
    .nav>a:nth-child(3){
        display:none;
    }

    .hero{
        min-height:430px;
        padding:70px 20px;
    }

    .hero h1{
        font-size:37px;
    }

    .section{
        padding:43px 18px;
    }

    .page-head{
        padding:45px 20px 30px;
    }

    .teams{
        grid-template-columns:
            1fr 35px 1fr;
    }

    .filters{
        overflow:auto;
    }

    .admin-head{
        padding:28px 18px;
    }

    .admin-main{
        padding:20px 14px 50px;
    }

    .stats-grid{
        grid-template-columns:1fr 1fr;
    }

    .admin-row{
        align-items:flex-start;
    }

    .admin-actions{
        flex-direction:column;
    }

    .form-grid{
        grid-template-columns:1fr;
    }

    .form-grid .wide{
        grid-column:auto;
    }

    .point-adjust{
        grid-template-columns:1fr;
    }

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

    .member-summary{
        grid-template-columns:1fr;
    }
}


/* ============================================================
   TENGXIN SPORTS V5 HOME
   ============================================================ */

.txhome{
    width:100%;
    overflow:hidden;
    background:
        linear-gradient(
            180deg,
            #07101e 0%,
            #081321 100%
        );
}


/* HERO */

.txhome-hero{
    position:relative;
    height:520px;
    overflow:hidden;
    background:#08111e;
}

.txhome-hero-bg{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 7%;
    opacity:0;
    visibility:hidden;
    transform:scale(1.02);
    transition:
        opacity .6s ease,
        transform .7s ease,
        visibility .6s;
}

.txhome-hero-bg.active{
    opacity:1;
    visibility:visible;
    transform:scale(1);
}

.txhome-hero-bg:nth-child(1){
    background:
        radial-gradient(
            circle at 78% 50%,
            rgba(0,208,170,.24),
            transparent 29%
        ),
        radial-gradient(
            circle at 65% 35%,
            rgba(0,115,255,.19),
            transparent 34%
        ),
        linear-gradient(
            105deg,
            #07111f 0%,
            #0b1c30 60%,
            #0a2c35 100%
        );
}

.txhome-hero-bg:nth-child(2){
    background:
        radial-gradient(
            circle at 77% 52%,
            rgba(121,73,255,.28),
            transparent 28%
        ),
        linear-gradient(
            105deg,
            #090d1b 0%,
            #15162d 60%,
            #25174a 100%
        );
}

.txhome-hero-bg:nth-child(3){
    background:
        radial-gradient(
            circle at 80% 50%,
            rgba(255,65,91,.23),
            transparent 30%
        ),
        linear-gradient(
            105deg,
            #0a111d 0%,
            #18172a 60%,
            #421824 100%
        );
}

.txhome-hero-content{
    position:relative;
    z-index:5;
    width:55%;
    max-width:680px;
}

.txhome-kicker{
    color:#58d8bd;
    font-size:12px;
    font-weight:900;
    letter-spacing:4px;
}

.txhome-hero-content h1{
    margin:15px 0 0;
    font-size:60px;
    line-height:1.05;
    letter-spacing:2px;
}

.txhome-hero-content h2{
    margin:12px 0 0;
    font-size:30px;
    color:#dce8f7;
}

.txhome-hero-content p{
    max-width:520px;
    margin:20px 0 0;
    color:#8fa3bb;
    line-height:1.9;
    font-size:16px;
}

.txhome-hero-actions{
    display:flex;
    gap:12px;
    margin-top:30px;
}

.txhome-main-btn,
.txhome-ghost-btn{
    min-width:145px;
    height:45px;
    padding:0 20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    font-size:14px;
    font-weight:800;
}

.txhome-main-btn{
    background:
        linear-gradient(
            135deg,
            #1eb596,
            #32cba9
        );
    color:#fff;
    box-shadow:
        0 12px 30px
        rgba(32,193,158,.18);
}

.txhome-ghost-btn{
    border:
        1px solid
        rgba(255,255,255,.13);
    background:
        rgba(255,255,255,.045);
    color:#dce7f4;
}

.txhome-hero-visual{
    width:40%;
    height:100%;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
}

.txhome-main-emblem{
    position:relative;
    z-index:4;
    width:190px;
    height:190px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    border:
        1px solid
        rgba(103,238,211,.38);
    background:
        radial-gradient(
            circle,
            rgba(42,200,171,.25),
            rgba(8,21,34,.68)
        );
    box-shadow:
        0 0 80px
        rgba(35,209,174,.18);
}

.txhome-main-emblem span{
    font-size:58px;
    font-weight:1000;
    letter-spacing:-3px;
    color:#6be1c9;
}

.txhome-main-emblem small{
    margin-top:3px;
    letter-spacing:4px;
    color:#8ba3b9;
}

.txhome-ball-ring{
    position:absolute;
    border-radius:50%;
    border:
        1px solid
        rgba(255,255,255,.09);
}

.ring-one{
    width:300px;
    height:300px;
}

.ring-two{
    width:390px;
    height:390px;
    opacity:.5;
}

.txhome-esport-box{
    width:270px;
    height:210px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:
        1px solid
        rgba(143,113,255,.35);
    border-radius:30px;
    transform:
        rotate(-6deg);
    background:
        linear-gradient(
            145deg,
            rgba(78,52,172,.43),
            rgba(15,13,39,.9)
        );
    box-shadow:
        0 35px 80px
        rgba(56,31,134,.35);
}

.txhome-esport-box div{
    letter-spacing:5px;
    color:#a997ff;
}

.txhome-esport-box strong{
    margin-top:10px;
    font-size:78px;
    color:#fff;
}

.txhome-live-card{
    width:260px;
    height:170px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-radius:25px;
    border:
        1px solid
        rgba(255,95,115,.32);
    background:
        linear-gradient(
            145deg,
            rgba(153,35,59,.30),
            rgba(26,13,29,.86)
        );
    box-shadow:
        0 30px 80px
        rgba(133,28,46,.30);
}

.txhome-live-card strong{
    margin-top:7px;
    font-size:46px;
    letter-spacing:5px;
}

.txhome-live-card small{
    margin-top:9px;
    color:#9c8591;
    letter-spacing:3px;
}

.txhome-live-dot{
    width:13px;
    height:13px;
    border-radius:50%;
    background:#ff5269;
    box-shadow:
        0 0 18px #ff5269;
}

.txhome-arrow{
    position:absolute;
    z-index:10;
    top:50%;
    width:42px;
    height:60px;
    margin-top:-30px;
    border:0;
    color:#fff;
    background:
        rgba(0,0,0,.20);
    font-size:34px;
    opacity:.5;
}

.txhome-arrow:hover{
    opacity:1;
}

.txhome-prev{
    left:0;
}

.txhome-next{
    right:0;
}

.txhome-dots{
    position:absolute;
    z-index:12;
    left:50%;
    bottom:23px;
    display:flex;
    gap:8px;
    transform:
        translateX(-50%);
}

.txhome-dots button{
    width:26px;
    height:3px;
    padding:0;
    border:0;
    border-radius:10px;
    background:
        rgba(255,255,255,.22);
}

.txhome-dots button.active{
    background:#51d8bc;
}


/* SECTION */

.txhome-section{
    max-width:1320px;
    margin:0 auto;
    padding:48px 5%;
}

.txhome-section-head{
    margin-bottom:22px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
}

.txhome-section-head small{
    color:#50d7bb;
    letter-spacing:2px;
    font-size:11px;
    font-weight:800;
}

.txhome-section-head h2{
    margin:7px 0 0;
    font-size:26px;
}

.txhome-section-head > a{
    color:#7f93aa;
    font-size:13px;
}

.txhome-section-head > a:hover{
    color:#56d9bd;
}


/* QUICK */

.txhome-quick-section{
    padding-top:34px;
}

.txhome-quick-grid{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:13px;
}

.txhome-quick-card{
    min-height:88px;
    padding:16px;
    display:grid;
    grid-template-columns:
        52px 1fr 24px;
    gap:13px;
    align-items:center;
    border-radius:13px;
    border:
        1px solid
        rgba(255,255,255,.065);
    background:#0d192a;
    transition:
        transform .2s,
        border-color .2s,
        background .2s;
}

.txhome-quick-card:hover{
    transform:
        translateY(-3px);
    border-color:
        rgba(81,216,188,.30);
    background:#101e31;
}

.txhome-quick-icon{
    width:52px;
    height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    font-weight:900;
    font-size:15px;
}

.txhome-quick-icon.football{
    color:#61dcc2;
    background:
        rgba(55,207,178,.11);
}

.txhome-quick-icon.basket{
    color:#ffad69;
    background:
        rgba(255,151,71,.11);
}

.txhome-quick-icon.esport{
    color:#a890ff;
    background:
        rgba(139,103,255,.13);
}

.txhome-quick-icon.live{
    color:#ff7889;
    background:
        rgba(255,87,110,.12);
}

.txhome-quick-card strong{
    display:block;
    color:#e7eff9;
    font-size:14px;
}

.txhome-quick-card span{
    display:block;
    margin-top:6px;
    color:#657991;
    font-size:11px;
}

.txhome-quick-card b{
    color:#60758d;
}


/* VENUES */

.txhome-venue-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:16px;
}

.txhome-venue-card{
    position:relative;
    min-height:230px;
    padding:24px;
    overflow:hidden;
    border-radius:17px;
    border:
        1px solid
        rgba(255,255,255,.07);
    background:
        linear-gradient(
            145deg,
            #101f32,
            #0c1727
        );
    transition:
        transform .25s,
        border-color .25s;
}

.txhome-venue-card:nth-child(1){
    background:
        radial-gradient(
            circle at 90% 15%,
            rgba(41,199,170,.22),
            transparent 35%
        ),
        linear-gradient(
            145deg,
            #102031,
            #0b1826
        );
}

.txhome-venue-card:nth-child(2){
    background:
        radial-gradient(
            circle at 90% 15%,
            rgba(114,81,255,.21),
            transparent 36%
        ),
        linear-gradient(
            145deg,
            #151c36,
            #0e1627
        );
}

.txhome-venue-card:nth-child(3){
    background:
        radial-gradient(
            circle at 90% 15%,
            rgba(255,72,100,.20),
            transparent 36%
        ),
        linear-gradient(
            145deg,
            #201b2d,
            #111724
        );
}

.txhome-venue-card:hover{
    transform:
        translateY(-5px);
    border-color:
        rgba(255,255,255,.13);
}

.txhome-venue-card.disabled{
    opacity:.55;
}

.txhome-venue-top{
    display:flex;
    justify-content:space-between;
}

.txhome-venue-code{
    width:50px;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    background:
        rgba(255,255,255,.07);
    font-weight:900;
    color:#fff;
}

.txhome-venue-state{
    height:25px;
    padding:0 10px;
    display:flex;
    align-items:center;
    border-radius:20px;
    background:
        rgba(60,209,177,.09);
    color:#62d9c0;
    font-size:10px;
}

.txhome-venue-name{
    margin-top:47px;
}

.txhome-venue-name small{
    color:#70849b;
}

.txhome-venue-name h3{
    margin:7px 0 0;
    font-size:23px;
}

.txhome-venue-arrow{
    position:absolute;
    right:25px;
    bottom:26px;
    color:#62788f;
    font-size:21px;
}


/* PROMO */

.txhome-promo{
    min-height:275px;
    padding:40px 55px;
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-radius:22px;
    border:
        1px solid
        rgba(255,255,255,.08);
    background:
        radial-gradient(
            circle at 75% 50%,
            rgba(47,202,172,.23),
            transparent 31%
        ),
        linear-gradient(
            110deg,
            #101d30,
            #0a2630
        );
}

.txhome-promo-copy{
    position:relative;
    z-index:3;
}

.txhome-promo-copy small{
    color:#54d7bd;
    letter-spacing:3px;
}

.txhome-promo-copy h2{
    margin:12px 0 10px;
    font-size:35px;
}

.txhome-promo-copy p{
    max-width:490px;
    color:#8499b0;
    line-height:1.8;
}

.txhome-promo-copy a{
    margin-top:14px;
    display:inline-flex;
    padding:10px 19px;
    border-radius:7px;
    background:#22ad91;
    font-weight:700;
    font-size:13px;
}

.txhome-promo-art{
    position:relative;
    width:270px;
    height:200px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.txhome-promo-art strong{
    z-index:5;
    font-size:80px;
    color:#5edfc5;
}

.txhome-promo-circle{
    position:absolute;
    border-radius:50%;
    border:
        1px solid
        rgba(87,221,194,.14);
}

.txhome-promo-circle.c1{
    width:150px;
    height:150px;
}

.txhome-promo-circle.c2{
    width:210px;
    height:210px;
}

.txhome-promo-circle.c3{
    width:270px;
    height:270px;
}


/* EVENTS */

.txhome-event-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:14px;
}

.txhome-event-card{
    padding:20px;
    border-radius:14px;
    border:
        1px solid
        rgba(255,255,255,.065);
    background:#0d192a;
}

.txhome-event-head{
    display:flex;
    justify-content:space-between;
    gap:10px;
    color:#8397ae;
    font-size:11px;
}

.txhome-event-head b{
    color:#8699af;
    font-size:10px;
    font-weight:600;
}

.txhome-event-head b.live{
    color:#5fddc2;
}

.txhome-event-teams{
    margin:22px 0 18px;
    display:grid;
    grid-template-columns:
        1fr 36px 1fr;
    gap:5px;
    align-items:center;
    text-align:center;
}

.txhome-event-teams strong{
    font-size:14px;
}

.txhome-event-teams span{
    color:#566b84;
    font-size:10px;
}

.txhome-event-time{
    padding-top:12px;
    border-top:
        1px solid
        rgba(255,255,255,.055);
    color:#667b94;
    text-align:center;
    font-size:11px;
}

.txhome-loading{
    grid-column:1/-1;
    padding:45px;
    text-align:center;
    color:#687d95;
}


/* FEATURES */

.txhome-feature-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:15px;
}

.txhome-feature{
    min-height:170px;
    padding:24px;
    border-radius:15px;
    border:
        1px solid
        rgba(255,255,255,.06);
    background:#0c1727;
}

.txhome-feature-no{
    color:#50d5ba;
    font-size:11px;
    letter-spacing:2px;
}

.txhome-feature h3{
    margin:22px 0 8px;
}

.txhome-feature p{
    color:#74889f;
    line-height:1.7;
    font-size:13px;
}


/* MOBILE */

@media(max-width:900px){

    .txhome-hero{
        height:500px;
    }

    .txhome-hero-bg{
        padding:0 6%;
    }

    .txhome-hero-content{
        width:65%;
    }

    .txhome-hero-content h1{
        font-size:48px;
    }

    .txhome-hero-visual{
        width:34%;
    }

    .txhome-main-emblem{
        width:150px;
        height:150px;
    }

    .txhome-main-emblem span{
        font-size:45px;
    }

    .ring-one{
        width:220px;
        height:220px;
    }

    .ring-two{
        width:290px;
        height:290px;
    }

    .txhome-quick-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .txhome-venue-grid{
        grid-template-columns:1fr;
    }

    .txhome-event-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }
}


@media(max-width:650px){

    .txhome-hero{
        height:500px;
    }

    .txhome-hero-bg{
        padding:
            55px 22px 65px;
        align-items:flex-start;
    }

    .txhome-hero-content{
        width:100%;
        position:relative;
        z-index:6;
    }

    .txhome-hero-content h1{
        margin-top:13px;
        font-size:42px;
    }

    .txhome-hero-content h2{
        font-size:23px;
    }

    .txhome-hero-content p{
        max-width:95%;
        font-size:14px;
    }

    .txhome-hero-visual{
        position:absolute;
        right:-50px;
        bottom:-70px;
        width:230px;
        height:230px;
        opacity:.35;
    }

    .txhome-hero-actions{
        flex-wrap:wrap;
    }

    .txhome-main-btn,
    .txhome-ghost-btn{
        min-width:130px;
    }

    .txhome-section{
        padding:
            38px 17px;
    }

    .txhome-quick-grid{
        grid-template-columns:1fr;
    }

    .txhome-event-grid{
        grid-template-columns:1fr;
    }

    .txhome-feature-grid{
        grid-template-columns:1fr;
    }

    .txhome-promo{
        min-height:320px;
        padding:32px 24px;
    }

    .txhome-promo-copy{
        width:100%;
        z-index:4;
    }

    .txhome-promo-copy h2{
        font-size:28px;
    }

    .txhome-promo-art{
        position:absolute;
        right:-80px;
        bottom:-45px;
        opacity:.35;
    }

    .txhome-arrow{
        display:none;
    }
}