:root{
    --bg:#07111f;
    --bg-soft:#0d1728;
    --panel:#0f1b31;
    --panel-2:#14213d;
    --text:#e5eefc;
    --muted:#93a4c2;
    --line:rgba(255,255,255,.08);
    --accent:#5eead4;
    --accent-2:#60a5fa;
    --danger:#f87171;
    --warning:#fbbf24;
    --success:#34d399;
    --shadow:0 18px 50px rgba(0,0,0,.35);
    --radius:24px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
    font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    background:
        radial-gradient(circle at top left, rgba(96,165,250,.10), transparent 25%),
        radial-gradient(circle at top right, rgba(94,234,212,.08), transparent 30%),
        linear-gradient(180deg, #06101d 0%, #091423 100%);
    color:var(--text);
    min-height:100vh;
}
a{text-decoration:none}
img{max-width:100%;display:block}
.main-shell{padding-bottom:48px}
.glass{
    background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
    border:1px solid var(--line);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow:var(--shadow);
}
.topbar{
    position:sticky; top:0; z-index:1040;
    background:rgba(6,16,29,.72);
    backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line);
}
.navbar-brand{
    font-weight:800;
    letter-spacing:.02em;
}
.brand-dot{
    width:10px;height:10px;border-radius:50%;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
    display:inline-block;margin-right:8px;box-shadow:0 0 15px rgba(96,165,250,.6);
}
.nav-link{
    color:rgba(229,238,252,.8)!important;
    border-radius:14px;
    padding:.7rem .95rem !important;
    transition:.2s ease;
}
.nav-link:hover,.nav-link.active{
    color:#fff!important;
    background:rgba(255,255,255,.06);
}
.hero{
    padding:28px;
    border-radius:32px;
    position:relative;
    overflow:hidden;
}
.hero::before{
    content:"";
    position:absolute; inset:0;
    background:
        radial-gradient(circle at 15% 20%, rgba(94,234,212,.18), transparent 24%),
        radial-gradient(circle at 85% 10%, rgba(96,165,250,.16), transparent 26%),
        linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
    pointer-events:none;
}
.hero > *{position:relative; z-index:1}
.hero-title{
    font-size:clamp(2rem, 4vw, 4rem);
    font-weight:900;
    line-height:1.02;
    margin-bottom:.65rem;
}
.hero-subtitle{
    color:var(--muted);
    max-width:680px;
    font-size:1rem;
}
.pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    border-radius:999px;
    padding:.55rem .95rem;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:#d7e7ff;
    font-size:.92rem;
}
.stat-card,.content-card,.table-card{
    border-radius:26px;
    padding:22px;
}
.stat-card .label{color:var(--muted);font-size:.95rem}
.stat-card .value{font-weight:900;font-size:2rem;margin-top:.35rem}
.content-card h2,.table-card h2{font-size:1.15rem;font-weight:800;margin-bottom:1rem}
.timer-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:12px;
    margin-top:1.25rem;
}
.timer-item{
    text-align:center;
    padding:16px 10px;
    border-radius:20px;
    border:1px solid var(--line);
    background:rgba(3,10,20,.46);
}
.timer-item .num{
    font-size:1.8rem;
    font-weight:900;
    line-height:1;
}
.timer-item .txt{
    margin-top:.4rem;
    color:var(--muted);
    font-size:.86rem;
}
.info-list{
    display:grid;
    gap:14px;
}
.vehicle-card,.winner-card,.member-card,.rule-card{
    border:1px solid var(--line);
    border-radius:22px;
    padding:18px;
    background:rgba(255,255,255,.03);
    height:100%;
    transition:transform .18s ease, border-color .18s ease, background .18s ease;
}
.vehicle-card:hover,.winner-card:hover,.member-card:hover{
    transform:translateY(-3px);
    border-color:rgba(96,165,250,.32);
    background:rgba(255,255,255,.045);
}
.vehicle-image{
    aspect-ratio: 16/10;
    border-radius:18px;
    overflow:hidden;
    background:
      linear-gradient(135deg, rgba(96,165,250,.18), rgba(94,234,212,.12)),
      linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:14px;
    font-size:2.2rem;
}
.muted{color:var(--muted)!important}
.section-title{
    font-size:1.35rem;
    font-weight:900;
    margin-bottom:1rem;
}
.section-head{
    display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:1rem;
}
.badge-soft{
    display:inline-flex; align-items:center; gap:6px;
    padding:.45rem .75rem; border-radius:999px;
    background:rgba(96,165,250,.12); color:#cfe0ff;
    border:1px solid rgba(96,165,250,.18);
    font-size:.82rem; font-weight:700;
}
.badge-success{background:rgba(52,211,153,.14); color:#d5fff0; border-color:rgba(52,211,153,.18)}
.badge-warning{background:rgba(251,191,36,.14); color:#fff4cf; border-color:rgba(251,191,36,.18)}
.badge-danger{background:rgba(248,113,113,.14); color:#ffd6d6; border-color:rgba(248,113,113,.18)}
.btn-premium{
    background:linear-gradient(135deg, var(--accent-2), var(--accent));
    border:none;
    color:#03111b;
    font-weight:800;
    border-radius:16px;
    padding:.9rem 1.15rem;
    box-shadow:0 12px 28px rgba(94,234,212,.15);
}
.btn-premium:hover{color:#03111b;filter:brightness(1.05)}
.btn-soft{
    background:rgba(255,255,255,.04);
    border:1px solid var(--line);
    color:#fff;
    border-radius:16px;
    padding:.9rem 1.05rem;
}
.btn-soft:hover{background:rgba(255,255,255,.06);color:#fff}
.table-premium{
    width:100%;
    border-collapse:separate;
    border-spacing:0 10px;
}
.table-premium thead th{
    color:var(--muted);
    font-size:.84rem;
    font-weight:700;
    padding:0 14px 8px;
}
.table-premium tbody tr td{
    background:rgba(255,255,255,.035);
    padding:16px 14px;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    vertical-align:middle;
}
.table-premium tbody tr td:first-child{
    border-left:1px solid var(--line);
    border-radius:16px 0 0 16px;
}
.table-premium tbody tr td:last-child{
    border-right:1px solid var(--line);
    border-radius:0 16px 16px 0;
}
.form-control,.form-select,textarea{
    background:rgba(255,255,255,.05)!important;
    color:#fff!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    padding:.9rem .95rem!important;
    box-shadow:none!important;
}
.form-control::placeholder, textarea::placeholder{color:#8fa3c4!important}
.form-label{font-weight:700;color:#dce8fb;margin-bottom:.55rem}
.form-section{
    padding:22px;
    border-radius:26px;
}
.kicker{
    font-size:.82rem;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:#9db6d8;
    font-weight:800;
}
.footer-note{
    color:var(--muted); text-align:center; padding:22px 0 10px; font-size:.92rem;
}
.empty{
    border:1px dashed rgba(255,255,255,.12);
    border-radius:20px;
    padding:20px;
    color:var(--muted);
    background:rgba(255,255,255,.02);
}
.search-box{max-width:280px}
@media (max-width: 991.98px){
    .hero{padding:22px;border-radius:26px}
    .stat-card,.content-card,.table-card,.form-section{padding:18px}
}
@media (max-width: 767.98px){
    .timer-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
    .hero-title{font-size:2rem}
    .section-head{flex-direction:column; align-items:flex-start}
    .table-premium{display:block; overflow-x:auto}
    .btn-premium,.btn-soft{width:100%}
    .search-box{max-width:none;width:100%}
}
