:root {
  --green: #00a850;
  --dark-green: #006b36;
  --yellow: #fff001;
  --ink: #142018;
  --muted: #66756b;
  --line: #dfe8df;
  --soft: #f6faf3;
  --white: #fff;
  --danger: #b42318;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: linear-gradient(135deg, #eaf6e7, #fffde0); color: var(--ink); }
a { color: var(--dark-green); }
.page-shell { min-height: 100vh; }
.topbar { position: sticky; top: 0; z-index: 20; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:12px 18px; background: rgba(255,255,255,.94); border-bottom: 1px solid var(--line); backdrop-filter: blur(10px); }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); }
.brand small { display:block; color:var(--muted); font-size:12px; }
.brand-mark { width:42px; height:42px; border-radius: 13px; display:grid; place-items:center; background: var(--yellow); border: 3px solid var(--green); color:var(--dark-green); font-weight:900; letter-spacing:-.04em; box-shadow: 0 8px 20px rgba(0, 107, 54, .14); }
.brand-mark.big { width:86px; height:86px; border-radius: 24px; font-size:28px; margin:auto; }
.topbar nav { display:flex; align-items:center; gap: 12px; flex-wrap:wrap; }
.topbar nav a, .linkbtn { border:0; background:transparent; color:var(--dark-green); font-weight:700; cursor:pointer; text-decoration:none; font:inherit; }
main { width:min(1180px, calc(100vw - 24px)); margin: 0 auto; padding: 24px 0 48px; }
.auth-card { width:min(430px, 100%); margin: 36px auto; background:var(--white); border:1px solid var(--line); border-radius:24px; padding:24px; box-shadow: 0 18px 60px rgba(20,32,24,.12); }
.hero-mini { text-align:center; padding:10px 8px 20px; }
.hero-mini h1 { margin:14px 0 4px; }
.hero-mini p, .muted { color:var(--muted); }
.stack { display:grid; gap:12px; }
label { display:grid; gap:6px; font-weight:800; color:#243a2c; }
input, select { width:100%; border:1px solid #cddbcc; border-radius:12px; padding:10px 12px; font:inherit; background:white; }
button, .button { border:1px solid var(--dark-green); border-radius:12px; padding:10px 14px; font-weight:900; cursor:pointer; background:white; color:var(--dark-green); text-decoration:none; display:inline-block; }
button.primary, .primary { background:var(--green); color:white; border-color:var(--green); box-shadow: 0 8px 18px rgba(0,168,80,.20); }
button:disabled, input:disabled { opacity:.55; cursor:not-allowed; }
.flash { padding:12px 14px; border-radius:14px; margin-bottom:16px; border:1px solid var(--line); background:#fff; }
.flash.success { border-color:#a8dab8; background:#effaf1; }
.flash.error { border-color:#f2afa9; background:#fff1ef; color:var(--danger); }
.flash.info { border-color:#9bc6f2; background:#eef7ff; }
.panel, .app-panel { background:rgba(255,255,255,.92); border:1px solid var(--line); border-radius:26px; padding:20px; box-shadow: 0 16px 55px rgba(20,32,24,.10); }
.panel.narrow { max-width:560px; margin:auto; }
.app-hero { position:relative; overflow:hidden; border-radius:24px; padding:24px; background: linear-gradient(120deg, var(--dark-green), var(--green)); color:white; margin-bottom:18px; }
.app-hero:after { content:""; position:absolute; inset:auto -70px -100px auto; width:240px; height:240px; border-radius:50%; background:var(--yellow); opacity:.9; }
.app-hero h1 { margin:0 0 8px; font-size:clamp(30px, 5vw, 54px); letter-spacing:-.05em; }
.app-hero p { max-width:760px; margin:0; color:rgba(255,255,255,.86); }
.stat-row { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; margin:18px 0; }
.stat { padding:14px; border-radius:18px; background:var(--soft); border:1px solid var(--line); }
.stat strong { display:block; font-size:24px; color:var(--dark-green); }
.tabs { display:flex; gap:8px; flex-wrap:wrap; margin: 16px 0; }
.tab { border-color: transparent; background:#edf7ed; }
.tab.active { background:var(--yellow); color:var(--dark-green); border-color:var(--green); }
.match-day { margin: 18px 0 24px; }
.day-header { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:14px 16px; border-radius:18px; background:#f8fbf1; border:1px solid var(--line); margin-bottom:10px; }
.day-header h2 { margin:0; }
.deadline { font-size:13px; color:var(--muted); text-align:right; }
.match-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:12px; }
.match-card { border:1px solid var(--line); border-radius:20px; padding:14px; background:white; display:grid; gap:10px; }
.match-card.live { border-color: #efb034; box-shadow: 0 0 0 3px rgba(255,240,1,.35); }
.match-card.locked { background:#fbfcfa; }
.match-meta { display:flex; justify-content:space-between; gap:8px; color:var(--muted); font-size:12px; }
.teams { font-size:17px; font-weight:950; letter-spacing:-.02em; }
.scoreline { font-size:13px; color:var(--dark-green); font-weight:900; }
.hub { display:flex; gap:8px; }
.hub button { flex:1; padding:9px 6px; }
.hub button.selected { background:var(--green); color:white; border-color:var(--green); }
.score-inputs { display:grid; grid-template-columns: 1fr auto 1fr; align-items:center; gap:8px; }
.save-status { min-height:18px; color:var(--muted); font-size:12px; }
.locked-badge, .live-badge { border-radius:999px; padding:3px 8px; font-size:11px; font-weight:900; }
.locked-badge { background:#eee; color:#555; }
.live-badge { background:#fff2b5; color:#8a5b00; }
.table-wrap { overflow:auto; border:1px solid var(--line); border-radius:18px; }
table { width:100%; border-collapse:collapse; background:white; }
th, td { padding:10px 12px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
th { background:var(--dark-green); color:white; }
tr:last-child td { border-bottom:0; }
.admin-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.inline-form { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.inline-form input { width:70px; }
.loading { padding:40px; text-align:center; color:var(--muted); }
@media (max-width: 800px) {
  .topbar { align-items:flex-start; flex-direction:column; }
  .stat-row, .match-grid, .admin-grid { grid-template-columns:1fr; }
  .day-header { flex-direction:column; }
  .deadline { text-align:left; }
  main { width:min(100vw - 12px, 1180px); padding-top: 8px; }
  .panel, .app-panel { padding:12px; border-radius:18px; }
}

.override-panel {
  border: 2px solid #f59e0b;
  background: #fff7ed;
  border-radius: 18px;
  padding: 18px;
  margin: 18px 0;
  box-shadow: 0 10px 30px rgba(245, 158, 11, 0.16);
}
.override-panel h2 {
  margin-top: 0;
}
.override-item {
  background: #fff;
  border: 1px solid #fed7aa;
  border-radius: 14px;
  padding: 14px;
  margin-top: 12px;
}
.override-score {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0;
}
.override-score span {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 6px 10px;
}
.override-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.compact-form textarea,
.override-item textarea {
  min-height: 72px;
}
