* { box-sizing: border-box; }
body {
  font-family: Arial, Helvetica, sans-serif;
  background: #f4f6f5;
  margin: 0;
  color: #222;
}
.container {
  max-width: 960px;
  margin: 0 auto;
  padding: 20px;
}
header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
header .logo { height: 48px; }
header h1 { flex: 1; font-size: 1.4rem; color: #1C5E55; }
header nav a, header nav button {
  margin-left: 8px;
  padding: 6px 12px;
  cursor: pointer;
}
.message { font-weight: bold; }
.error { color: #b00020; }
.columns { display: flex; gap: 24px; align-items: flex-start; }
.games { flex: 1; }
.sidebar { width: 260px; }
table { border-collapse: collapse; width: 100%; background: white; }
th, td { border: 1px solid #ddd; padding: 6px 10px; text-align: left; }
th { background: #1C5E55; color: white; }
tr:nth-child(even) { background: #E3EAEB; }
#gamesTable .opponent-column { min-width: 160px; white-space: nowrap; }
#gamesTable .date-column { min-width: 112px; white-space: nowrap; }
#loginPanel, #appPanel { background: white; padding: 16px; border-radius: 6px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
#loginForm label { display: block; margin-bottom: 8px; }
#pickersList { padding-left: 20px; }