:root{--bg:#f4f4f4;--card:#ffffff;--text:#0d3a40;--muted:#5a6070;--vb-navy:#13a2b0;--vb-orange:#322f2b;--accent:#322f2b;--border:#dde3ea}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
.container{max-width:1200px;margin:0 auto;padding:1rem}
.hero{border-bottom:4px solid var(--accent)}
.hero-logo-bar{background:#fff;padding:.6rem 1rem;display:flex;align-items:center}
.hero .brand-logo{height:60px}
.hero-nav-bar{background:var(--vb-navy);padding:.6rem 1rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.hero-nav-bar h1{color:#fff;margin:0;font-size:1.3rem}
.subtitle{margin:.1rem 0 0 0;color:rgba(255,255,255,.7)}
.card{background:var(--card);border:1px solid var(--border);border-radius:4px;padding:1rem;margin:1rem 0;box-shadow:0 2px 8px rgba(0,0,0,.07)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1rem}
label{display:flex;flex-direction:column;gap:.35rem;color:var(--muted);font-size:.95rem}
input,button{padding:.6rem .7rem;border-radius:4px;border:1px solid var(--border);background:#fff;color:var(--text)}
button.primary{background:var(--accent);border-color:#1a1815;color:#ffffff;font-weight:600}
button.secondary{background:#fff;border-color:var(--border)}
button.ghost{background:transparent}
button.danger{background:#fdecea;color:#c0392b;border-color:#e57373}
button.danger:hover{background:#f8d7d3}
button.icon{background:transparent;border:none;font-size:1.1rem;color:rgba(255,255,255,.7)}
button.icon:hover{color:#fff}
button:hover{filter:brightness(1.05);cursor:pointer}
.actions{display:flex;gap:.6rem;margin-top:1rem;flex-wrap:wrap}
.export-actions button{border:1px solid var(--accent)}
.tabs{display:flex;gap:.5rem;flex-wrap:wrap;border-bottom:2px solid var(--vb-navy);padding:.5rem .5rem 0;background:#fff;border-top-left-radius:4px;border-top-right-radius:4px}
.tab{padding:.5rem 1rem;border:1px solid var(--border);border-bottom:none;background:#f4f4f4;border-top-left-radius:4px;border-top-right-radius:4px;font-weight:500;color:var(--muted)}
.tab.active{background:var(--vb-navy);color:#fff;border-color:var(--vb-navy)}
.table{width:100%;border-collapse:collapse;margin:.5rem 0}
.table th,.table td{border-bottom:1px solid var(--border);padding:.55rem .5rem;text-align:left}
.table th{color:#fff;font-weight:700;background:var(--vb-navy)}
.badge{display:inline-block;padding:.15rem .4rem;border:1px solid var(--border);border-radius:4px;font-size:.75rem;color:var(--muted)}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;align-items:center;justify-content:center;padding:1rem;z-index:99}
.modal[aria-hidden="false"]{display:flex}
.modal-content{background:var(--card);border:1px solid var(--border);border-radius:4px;max-width:900px;width:100%;box-shadow:0 18px 40px rgba(0,0,0,.2)}
.modal-header{padding:.75rem 1rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--vb-navy);border-radius:4px 4px 0 0}
.modal-header h3{color:#fff;margin:0}
.modal-footer{padding:.75rem 1rem;border-top:1px solid var(--border);display:flex;gap:.5rem}
.modal-body{padding:1rem}
.modal-header button.icon{color:rgba(255,255,255,.7)}
.modal-header button.icon:hover{color:#fff}
.setrow{display:grid;grid-template-columns:1fr 60px 60px 1fr;gap:.5rem;align-items:center;margin:.35rem 0}
.setrow input{width:60px;text-align:center}
.jackpots{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.6rem}
.jackpot-card{border:1px solid var(--border);background:#fff;border-radius:4px;padding:.6rem;border-left:4px solid var(--accent)}
.jackpot-card h4{margin:.2rem 0;color:var(--vb-navy)}
.jackpot-amount{font-size:1.2rem;color:var(--accent);font-weight:700}
.sponsors{display:flex;align-items:center;gap:.8rem;margin-top:1rem}
.sponsors img{height:50px;background:#fff;padding:.2rem .4rem;border-radius:4px;border:1px solid var(--border)}
.footer{border-top:4px solid var(--accent);padding:.5rem 0;color:rgba(255,255,255,.7);background:var(--vb-navy)}
.footer strong{color:#fff}
@media (max-width:800px){.grid-3,.grid-2{grid-template-columns:1fr}.setrow{grid-template-columns:1fr 50px 50px 1fr}}

/* ─── PHP/DB additions ──────────────────────────────────────────────────── */
.hero-inner{flex-wrap:wrap}
.hero-actions{display:flex;align-items:center;gap:.6rem;margin-left:auto}
.btn-link{padding:.5rem .9rem;border-radius:4px;border:1px solid rgba(255,255,255,.3);text-decoration:none;color:rgba(255,255,255,.85);font-size:.9rem}
.btn-link.secondary{background:rgba(255,255,255,.1)}
.btn-link:hover{background:rgba(255,255,255,.2);filter:none}
.space-between{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem}
.header-actions{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.muted{color:var(--muted)}
.result-winner{font-weight:700;color:var(--vb-navy)}
.result-home td:nth-child(5){font-weight:700}
.result-away td:nth-child(6){font-weight:700}
.score-cell{font-size:.85rem;white-space:nowrap}
.login-form{max-width:360px;display:flex;flex-direction:column;gap:.8rem;margin-top:.5rem}
.login-form label{display:flex;flex-direction:column;gap:.3rem}
.login-form input{font-size:1rem}
.alert{padding:.6rem .8rem;border-radius:4px;margin:.5rem 0}
.alert-error{background:#fee2e2;border:1px solid #fca5a5;color:#991b1b}
.admin-page .hero{border-bottom-color:var(--accent)}
.footer-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;padding:.3rem 0}
.footer .sponsors{margin-top:0}