:root {
  color-scheme: dark;
  background: #121b18;
  color: #f2eee2;
  font-family: system-ui, sans-serif;
}
body {
  display: grid;
  place-items: center;
  min-height: 100svh;
  box-sizing: border-box;
  margin: 0;
  padding: 1.25rem;
}
main {
  box-sizing: border-box;
  width: min(100%, 30rem);
  padding: clamp(1.5rem, 6vw, 2.75rem);
  border: 1px solid #3e5b4e;
  border-radius: 1.25rem;
  background: #202e28;
}
[hidden] { display: none !important; }
h1 { margin: 0; font: 2.3rem Georgia, serif; }
p { line-height: 1.55; }
.club { margin-top: 0; color: #a1d6b8; font-size: .9rem; }
.actions { display: flex; gap: .7rem; flex-wrap: wrap; }
button, .primary {
  padding: .75rem .95rem;
  border: 1px solid transparent;
  border-radius: .5rem;
  background: #b9e6cc;
  color: #14231c;
  font: 600 1rem system-ui, sans-serif;
  text-decoration: none;
  cursor: pointer;
}
button:disabled { opacity: .55; cursor: default; }
.secondary { border-color: #59806b; background: transparent; color: #d5ebdb; }
details { margin-top: 1.2rem; }
summary { color: #b9e6cc; cursor: pointer; }
form { display: grid; gap: .65rem; margin-top: .85rem; }
input { box-sizing: border-box; width: 100%; padding: .65rem; font: inherit; }
:focus-visible { outline: 2px solid #e1cf93; outline-offset: 3px; }
#status { margin-bottom: 0; color: #f0c9a0; }