* { box-sizing: border-box; }

:root {
    --bg: #06101f;
    --panel: #111827;
    --panel2: #172033;
    --border: #334155;
    --text: #e5e7eb;
    --muted: #94a3b8;
    --blue: #2563eb;
    --green: #16a34a;
    --orange: #f59e0b;
    --red: #ef4444;
}

body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    background:
        radial-gradient(circle at top left, rgba(37, 99, 235, 0.16), transparent 34rem),
        linear-gradient(180deg, #08111f, var(--bg));
    color: var(--text);
}

a { color: inherit; }

.app-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: rgba(2, 6, 23, 0.96);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(96, 165, 250, 0.35);
    padding: 16px 22px;
}

.brand-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

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

.logo {
    max-height: 92px;
    max-width: 230px;
    object-fit: contain;
    background: white;
    border-radius: 12px;
    padding: 6px;
}

.brand-title { text-align: center; flex: 1; }

.brand-title h1 {
    margin: 0;
    font-size: 48px;
    letter-spacing: 0.04em;
}

.brand-title p {
    margin: 8px 0 0;
    color: #93c5fd;
    font-size: 18px;
}

.home-header-button {
    display: none;
    background: var(--blue);
    color: white;
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 12px;
    font-weight: 800;
    white-space: nowrap;
}

.main-nav { margin-top: 16px; text-align: center; }

.main-nav a {
    display: inline-block;
    margin: 5px;
    padding: 10px 18px;
    background: #1e293b;
    border: 1px solid var(--border);
    border-radius: 999px;
    text-decoration: none;
    color: white;
}

.container { max-width: 1220px; margin: 0 auto; padding: 24px; }

.hero { text-align: center; }

.grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.card {
    background: linear-gradient(180deg, var(--panel2), var(--panel));
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 22px;
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.28);
    margin-bottom: 18px;
}

.stream-card { margin-top: 14px; }

.button {
    display: inline-block;
    background: var(--blue);
    color: white;
    padding: 12px 18px;
    border-radius: 10px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    font-weight: 700;
    margin: 4px 4px 4px 0;
    text-align: center;
}

.button.secondary { background: #334155; }
.button.green { background: var(--green); }
.button.orange { background: var(--orange); color: #111827; }
.button.red { background: var(--red); }

input, select {
    width: 100%;
    padding: 13px;
    border-radius: 10px;
    border: 1px solid #475569;
    background: #020617;
    color: white;
    margin: 8px 0 14px;
    font-size: 16px;
}

.live { color: #22c55e; font-weight: 800; }
.offline { color: var(--muted); }

.video {
    width: 100%;
    max-width: 1200px;
    background: black;
    border-radius: 16px;
    aspect-ratio: 16 / 9;
}

.camera-preview {
    width: 100%;
    background: black;
    border-radius: 16px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.footer { text-align: center; color: var(--muted); padding: 28px; }

.help-text { color: var(--muted); line-height: 1.5; }
.mobile-only { display: none !important; }
.desktop-warning { border-color: rgba(245, 158, 11, 0.65); }

.status-box {
    background: #020617;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 14px;
    margin-top: 12px;
    line-height: 1.5;
}

.status-good { color: #22c55e; font-weight: bold; }
.status-warn { color: #f59e0b; font-weight: bold; }
.status-bad { color: #ef4444; font-weight: bold; }

.zoom-controls {
    background: #020617;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 12px;
    margin-top: 12px;
}

.zoom-controls label {
    display: block;
    font-weight: 800;
    margin-bottom: 8px;
}

.zoom-buttons {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.zoom-button {
    width: auto;
    min-width: 72px;
    margin: 0;
    padding: 10px 14px;
    background: #334155;
}

.zoom-button.active {
    outline: 2px solid #fff;
    background: var(--blue);
}

.zoom-support-text {
    color: var(--muted);
    font-size: 13px;
    margin-top: 8px;
}

.status-box.status-good { border-color: rgba(34,197,94,.65); }
.status-box.status-warn { border-color: rgba(245,158,11,.75); }
.status-box.status-bad { border-color: rgba(239,68,68,.75); }

.timing-preview {
    background: #05070a;
    border: 1px solid #2563eb;
    border-radius: 12px;
    overflow: hidden;
    font-size: 14px;
}

.timing-preview .timing-title {
    background: #bfdbfe;
    color: #000;
    padding: 8px 12px;
    font-weight: bold;
}

.timing-preview table { width: 100%; border-collapse: collapse; }
.timing-preview td, .timing-preview th { padding: 8px; border-bottom: 1px solid #1f2937; }
.timing-preview tr:nth-child(even) { background: #111827; }

@media (max-width: 1050px) { .grid { grid-template-columns: repeat(2, 1fr); } }

@media (max-width: 850px) {
    .app-header { padding: 8px 10px; }

    .brand-row {
        display: grid;
        grid-template-columns: 58px 1fr auto;
        gap: 8px;
    }

    .right-header { gap: 6px; }

    .logo {
        max-height: 48px;
        max-width: 58px;
        padding: 3px;
        border-radius: 8px;
    }

    .brand-title h1 { font-size: 26px; }
    .brand-title p { display: none; }

    .home-header-button {
        display: inline-block;
        font-size: 13px;
        padding: 10px 11px;
    }

    .main-nav { display: none; }
    .mobile-only { display: block !important; }
    .desktop-only { display: none !important; }

    .container { padding: 14px; }
    .hero { text-align: left; }

    .grid {
        display: flex;
        overflow-x: auto;
        gap: 14px;
        scroll-snap-type: x mandatory;
        padding-bottom: 12px;
        -webkit-overflow-scrolling: touch;
    }

    .grid > .card {
        min-width: 86%;
        scroll-snap-align: start;
        margin-bottom: 0;
    }

    .card {
        padding: 18px;
        border-radius: 16px;
    }

    .button {
        width: 100%;
        margin-top: 8px;
    }
}

.admin-grid { grid-template-columns: repeat(2, 1fr); }
.table-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.table-wrap { width: 100%; overflow-x: auto; }
.admin-table { width: 100%; border-collapse: collapse; min-width: 680px; }
.admin-table th, .admin-table td { padding: 10px 12px; border-bottom: 1px solid var(--border); text-align: left; }
.admin-table th { background: #020617; color: #bfdbfe; font-weight: 800; }
.admin-table tr:nth-child(even) { background: rgba(15, 23, 42, 0.55); }
.button.small { padding: 7px 10px; font-size: 13px; border-radius: 8px; width: auto; margin: 0; }
@media (max-width: 850px) {
    .admin-grid { display: block; }
    .table-title-row { display: block; }
}


.driver-details {
    margin: 8px 0 14px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(255,255,255,0.08);
    font-size: 0.95rem;
}
.driver-found { border-left: 4px solid #23d18b; }
.driver-missing { border-left: 4px solid #ff5f56; }
.checkbox-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 12px 0;
}
.checkbox-row input { width: auto; }

.replay-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 18px;
    margin-top: 18px;
}
.replay-card {
    background: #020617;
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
}
.replay-thumb {
    position: relative;
    width: 100%;
    min-height: 150px;
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #0f172a, #1d4ed8 55%, #020617);
    display: flex;
    align-items: center;
    justify-content: center;
}
.replay-car {
    position: absolute;
    left: 12px;
    top: 12px;
    background: rgba(2, 6, 23, 0.78);
    border: 1px solid rgba(191, 219, 254, 0.45);
    border-radius: 999px;
    padding: 6px 10px;
    font-weight: 800;
}
.replay-play {
    width: 58px;
    height: 58px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}
.replay-body { padding: 16px; }
.replay-body h3 { margin: 0 0 6px; font-size: 24px; }
.replay-driver { margin: 0 0 4px; font-weight: 800; }
.replay-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0;
}
.replay-meta span {
    background: rgba(148, 163, 184, 0.14);
    border: 1px solid rgba(148, 163, 184, 0.25);
    border-radius: 999px;
    padding: 6px 9px;
    font-size: 13px;
    color: #bfdbfe;
}


.replay-watch-card { max-width: 1180px; margin: 0 auto; }
.replay-watch-header { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 18px; }
.replay-watch-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.button.secondary { background: #273447; color: #eef3ff; }
.video-shell { background: #000; border: 1px solid #33445d; border-radius: 16px; overflow: hidden; box-shadow: 0 14px 40px rgba(0,0,0,.28); }
.replay-video { display: block; width: 100%; aspect-ratio: 16 / 9; background: #000; }
@media (max-width: 720px) {
  .replay-watch-actions { width: 100%; }
  .replay-watch-actions .button { flex: 1; text-align: center; }
}

.replay-thumb-link {
    display: flex;
    width: 100%;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}
.replay-thumb::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 28% 22%, rgba(255,255,255,0.18), transparent 28%),
        linear-gradient(180deg, rgba(2,6,23,0.05), rgba(2,6,23,0.72));
}
.replay-thumb > * {
    position: relative;
    z-index: 1;
}
.replay-thumb-link:hover .replay-play {
    transform: scale(1.08);
}

.latest-replays-list {
    list-style: none;
    padding: 0;
    margin: 12px 0 18px;
    display: grid;
    gap: 10px;
}

.latest-replays-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border-radius: 12px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
}

.latest-replays-list small {
    opacity: 0.75;
}

.mini-play {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 700;
    background: rgba(255,255,255,0.16);
    color: inherit;
}

.mini-play:hover {
    background: rgba(255,255,255,0.28);
}

.camera-list {
    margin: 12px 0 0;
    padding-left: 20px;
}
.camera-list li { margin-bottom: 10px; }
.surveillance-card h3 { color: #bfdbfe; }

/* Direct MediaMTX WebRTC player embed */
.webrtc-player-frame {
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
    border-radius: 18px;
    background: #000;
}
.button-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
    margin: 10px 0 16px;
}

/* Timing page */
.timing-page { max-width: 1500px; }
.timing-card { overflow: hidden; }
.timing-hero {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: flex-start;
    margin-bottom: 18px;
}
.eyebrow {
    margin: 0 0 6px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.78rem;
    color: #a5b4fc;
    font-weight: 800;
}
.timing-clock {
    min-width: 160px;
    text-align: right;
    padding: 12px 14px;
    border-radius: 16px;
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.10);
}
.timing-clock span, .timing-stats span { display: block; opacity: 0.72; font-size: 0.84rem; }
.timing-clock strong { display:block; font-size: 1.65rem; margin-top: 4px; }
.timing-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 12px 0 16px;
}
.timing-stats > div {
    padding: 13px 14px;
    border-radius: 16px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.09);
}
.timing-stats strong { display: block; font-size: 1.25rem; margin-top: 3px; }
.timing-controls {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 12px;
    align-items: end;
    margin: 12px 0 12px;
}
.timing-controls label { font-weight: 700; font-size: 0.9rem; }
.timing-controls input, .timing-controls select {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin-top: 6px;
    padding: 11px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.18);
    background: rgba(15,23,42,0.82);
    color: inherit;
}
.timing-error {
    margin: 12px 0;
    padding: 12px 14px;
    border-radius: 14px;
    background: rgba(239,68,68,0.16);
    border: 1px solid rgba(239,68,68,0.35);
    color: #fecaca;
}
.timing-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 0.9rem;
    margin: 10px 0 12px;
    opacity: 0.94;
}
.timing-legend span { display: inline-flex; align-items: center; gap: 6px; }
.timing-legend i { width: 13px; height: 13px; border-radius: 4px; display: inline-block; }
.legend-fastest { background: #8b5cf6; }
.legend-pb { background: #22c55e; }
.legend-dns { background: #64748b; }
.legend-dnf { background: #ef4444; }
.timing-table-wrap {
    overflow-x: auto;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(2,6,23,0.25);
}
.timing-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    min-width: 860px;
    font-variant-numeric: tabular-nums;
}
.timing-table th, .timing-table td {
    padding: 10px 11px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    white-space: nowrap;
    text-align: left;
}
.timing-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: rgba(15,23,42,0.98);
    color: #bfdbfe;
    font-size: 0.86rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.timing-table tbody tr:hover { background: rgba(255,255,255,0.045); }
.timing-table .pos, .timing-table .bib, .timing-table .class-cell { font-weight: 800; }
.timing-table .name { min-width: 170px; font-weight: 700; }
.timing-table .run-cell, .timing-table .total { text-align: right; }
.timing-table .total { font-weight: 900; color: #e0f2fe; }
.run-cell.fastest { background: rgba(139,92,246,0.32); color: #f5f3ff; font-weight: 900; }
.run-cell.pb { box-shadow: inset 0 -3px 0 rgba(34,197,94,0.88); }
.run-cell.dns { background: rgba(100,116,139,0.28); color: #cbd5e1; }
.run-cell.dnf { background: rgba(239,68,68,0.28); color: #fecaca; }
.run-cell small { display:block; opacity:0.78; font-size:0.72rem; }
.status-dns { opacity: 0.68; }
.status-dnf .total { color: #fecaca; }
@media (max-width: 800px) {
    .timing-hero { display: block; }
    .timing-clock { text-align: left; margin-top: 12px; }
    .timing-stats { grid-template-columns: 1fr; }
    .timing-controls { grid-template-columns: 1fr; }
    .timing-table { min-width: 720px; font-size: 0.88rem; }
    .timing-table th, .timing-table td { padding: 8px; }
}


.admin-events-list { margin-top: 1rem; }
.admin-event-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0.75rem; }
.admin-event-link { display: block; padding: 1rem; border: 1px solid rgba(255,255,255,0.14); border-radius: 14px; text-decoration: none; background: rgba(255,255,255,0.05); }
.admin-event-link:hover { transform: translateY(-1px); background: rgba(255,255,255,0.08); }
.admin-event-link strong { display: block; color: inherit; margin-bottom: 0.35rem; }
.admin-event-link span { display: block; color: var(--muted); font-size: 0.92rem; }
.admin-event-link em { display: inline-block; margin-top: 0.5rem; padding: 0.2rem 0.55rem; border-radius: 999px; font-style: normal; font-size: 0.78rem; background: rgba(126,87,194,0.22); }

/* Admin dashboard layout update */
.admin-page { max-width: 980px; }
.admin-alerts { margin-bottom: 1rem; }
.admin-dashboard {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(280px, 1fr);
    gap: 1.4rem;
    align-items: start;
}
.admin-dashboard .card, .admin-wide-card {
    background: linear-gradient(180deg, rgba(30,41,59,0.9), rgba(15,23,42,0.9));
    border: 1px solid rgba(148, 163, 184, 0.24);
    box-shadow: 0 18px 50px rgba(0,0,0,0.22);
}
.admin-primary-stack, .admin-side-stack { display: grid; gap: 1.15rem; }
.admin-driver-card { min-height: 420px; }
.admin-mini-card { min-height: 132px; }
.admin-form label { display: block; margin-top: 0.75rem; font-weight: 800; font-size: 0.86rem; color: #dbeafe; }
.admin-form.compact label { margin-top: 0.35rem; }
.admin-form input[type="text"], .admin-form input[type="number"], .admin-form input[type="file"] {
    width: 100%;
    margin: 0.35rem 0 0.65rem;
}
.admin-details { margin-top: 0.85rem; color: var(--muted); }
.admin-details summary { cursor: pointer; color: #bfdbfe; font-weight: 800; }
.compact-list { margin-top: 0.65rem; padding-left: 1rem; font-size: 0.86rem; }
.admin-wide-card { margin-top: 1.25rem; }
.admin-events-card .table-title-row { align-items: center; }
.admin-events-list .offline { margin: 0; }
.admin-event-grid.compact-events { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
@media (max-width: 820px) {
    .admin-page { max-width: none; }
    .admin-dashboard { grid-template-columns: 1fr; }
    .admin-driver-card { min-height: 0; }
}


.admin-topbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.auth-card{max-width:520px;margin:30px auto}.event-card-mini{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px;margin:10px 0}.event-stats{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px}.pill{display:inline-block;margin-top:8px;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.12);font-size:.85em}.home-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.qr-scanner-box{border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:12px;margin:12px 0}.qr-scanner-box video{width:100%;max-height:260px;background:#000;border-radius:10px;margin-top:8px}@media(max-width:900px){.home-grid{grid-template-columns:1fr}.admin-topbar{align-items:flex-start;flex-direction:column}}


.admin-subnav {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 10px 16px;
    border-bottom: 1px solid rgba(96, 165, 250, 0.25);
    background: rgba(15, 23, 42, 0.88);
}
.admin-subnav a {
    display: inline-block;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(51, 65, 85, 0.9);
    color: #e5e7eb;
    text-decoration: none;
    font-weight: 800;
    border: 1px solid rgba(148, 163, 184, 0.25);
}
.admin-subnav a:hover { background: rgba(37, 99, 235, 0.95); }
.admin-nav-blank{display:inline-block;width:78px;height:36px;border-radius:999px;background:transparent;border:1px solid transparent;}
.admin-subnav .admin-logout-link{background:rgba(127,29,29,.9);}
.admin-subnav .admin-logout-link:hover{background:rgba(220,38,38,.95);}
@media(max-width:700px){.admin-nav-blank{display:none;}}

@media(max-width:700px){ .admin-subnav { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; } .admin-subnav a { white-space: nowrap; } }
.live-wall-page{height:calc(100vh - 190px);padding:18px;box-sizing:border-box;overflow:hidden}.live-wall-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}.live-wall-head h2{margin:0}.live-wall{height:calc(100% - 58px);display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));grid-auto-rows:minmax(220px,1fr);overflow:hidden}.live-tile{position:relative;min-height:0;height:100%;border:1px solid #34415a;border-radius:14px;background:#050914;overflow:hidden}.live-tile-player{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}.live-tile-label{position:absolute;left:10px;right:10px;bottom:10px;display:flex;gap:10px;align-items:center;justify-content:space-between;padding:8px 10px;border-radius:10px;background:rgba(5,9,20,.78);backdrop-filter:blur(4px);font-size:.95rem}.live-tile-label span{color:#d8e2f5}.live-wall .offline{grid-column:1/-1;align-self:start}.live-wall[data-count="1"]{grid-template-columns:1fr}.live-wall[data-count="2"]{grid-template-columns:repeat(2,1fr)}.live-wall[data-count="3"],.live-wall[data-count="4"]{grid-template-columns:repeat(2,1fr)}.live-wall[data-count="5"],.live-wall[data-count="6"]{grid-template-columns:repeat(3,1fr)}@media (max-width:767px) and (orientation:portrait){.live-wall-page{height:auto;min-height:calc(100vh - 190px);overflow:auto}.live-wall{height:auto;grid-template-columns:1fr!important;grid-auto-rows:260px;overflow:visible}.live-tile{height:260px}.live-wall-head{display:block}}@media (max-width:767px) and (orientation:landscape){.live-wall{grid-template-columns:repeat(2,1fr)!important}}@media (min-width:768px) and (max-width:1100px) and (orientation:portrait){.live-wall{grid-template-columns:repeat(2,1fr)!important}}@media (min-width:768px) and (max-width:1200px) and (orientation:landscape){.live-wall{grid-template-columns:repeat(3,1fr)!important}}

/* Admin section page layout refinement */
.admin-dashboard-top { grid-template-columns: repeat(2, minmax(280px, 1fr)); margin-bottom: 1.2rem; }
.admin-dashboard-tools { grid-template-columns: minmax(280px, 1fr) minmax(280px, 1fr); margin-bottom: 1.2rem; }
.admin-dashboard-top .admin-mini-card, .admin-dashboard-tools .admin-mini-card { min-height: 0; }
.admin-dashboard-tools .admin-driver-card { min-height: 0; }
.qr-scanner-box video { max-height: 420px; object-fit: cover; }
@media (max-width: 820px) {
  .admin-dashboard-top, .admin-dashboard-tools { grid-template-columns: 1fr; }
}

/* Shared Race rebrand */
.sharedrace-logo { width: min(360px, 42vw); height: auto; object-fit: contain; }
.club-logo { max-height: 74px; object-fit: contain; }
.footer { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; }
.footer-ja-logo { height:28px; width:auto; opacity:.8; border-radius:4px; }