/* Uses the existing Romz palette, backgrounds and typography. */
[hidden] { display:none !important; }
.community-hall { color:var(--foam); background:var(--romz-backdrop); border-top:1px solid rgba(255,255,255,.08); }
.hof-section { padding:7rem 0 4rem; color:var(--foam); background:transparent; }
.hof-section .section-kicker,.member-hearts-section .section-kicker { color:var(--neon); }
.hof-section .section-note,.member-hearts-section .section-note { color:#caaabd; }
.hof-section .section-heading-wide { display:block; max-width:1200px; margin:0 auto; text-align:center; }
.hof-section .section-kicker { justify-content:center; }
.hof-section .section-heading-wide h2 { max-width:none; }
.weekly-grid { display:grid; grid-template-columns:repeat(2,minmax(0,430px)); justify-content:space-between; gap:clamp(3rem,8vw,8rem); max-width:1200px; margin:2.5rem auto 0; }
.weekly-card { margin:0; min-width:0; }
.weekly-card h3 { margin:0 0 .85rem; color:var(--foam); font-size:1rem; }
.weekly-image { width:100%; border:1px solid rgba(255,255,255,.14); border-radius:18px; background:rgba(8,0,6,.68); box-shadow:0 24px 60px rgba(0,0,0,.3); overflow:hidden; }
.weekly-image img { width:100%; height:auto; display:block; }
.weekly-result { margin-top:.85rem; padding:1rem 1.1rem; border:1px solid rgba(255,255,255,.12); border-radius:12px; background:rgba(18,1,14,.66); }
.weekly-result span { display:block; margin-bottom:.45rem; color:var(--neon); font-size:.64rem; font-weight:700; letter-spacing:.14em; }
.weekly-result p { margin:0; color:#d8bdce; font-size:.9rem; line-height:1.55; white-space:pre-line; }
.weekly-date { display:flex; align-items:center; gap:.65rem; width:max-content; max-width:100%; margin:2.5rem auto 0; padding:.72rem 1rem; color:#ead8e3; border:1px solid rgba(255,255,255,.14); border-radius:999px; background:rgba(18,1,14,.72); }
.weekly-date span { color:var(--neon); font-size:.62rem; font-weight:700; letter-spacing:.14em; }
.weekly-date strong { font-size:.86rem; }
dialog { border:1px solid var(--line); border-radius:14px; background:var(--ink); color:var(--foam); max-width:95vw; max-height:90dvh; overflow:auto; padding:1.5rem; }
dialog::backdrop { background:rgba(10,0,8,.85); }
.close-dialog { margin-bottom:1rem; }
.weekly-example { max-width:780px; margin:auto; }
.weekly-example img { width:100%; border-radius:14px; }
.admin-main { max-width:1040px; padding:2.5rem 0 5rem; }
.admin-main h1 { font-size:clamp(2rem,5vw,3rem); }
.admin-main > section { padding:0; }
#draft-preview img { width:100%; }
.member-hearts-section { padding:2rem 0 7rem; }
.member-hearts-section .wrap { padding-top:4rem; border-top:1px solid rgba(255,255,255,.12); }
.member-hearts-section .section-heading-wide { display:block; max-width:900px; margin:0 auto; text-align:center; }
.member-hearts-section .section-kicker { justify-content:center; }
.member-hearts-section .section-heading-wide h2 { max-width:none; }
.member-hearts-section .section-note { max-width:34rem; margin:.9rem auto 0; }
.member-hearts-card { grid-column:1/-1; max-width:900px; margin:2rem auto 0; padding:1.6rem 1.8rem; color:var(--foam); border:1px solid rgba(255,255,255,.13); border-radius:16px; background:rgba(18,1,14,.66); box-shadow:0 24px 60px rgba(0,0,0,.22); }
.member-hearts-card h3 { margin:.2rem 0 1.1rem; color:var(--foam); }
.member-hearts-kicker { margin:0; color:#9e0084; font-size:.68rem; font-weight:700; letter-spacing:.14em; }
.member-hearts-card ol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem 2rem; margin:0; padding-left:1.6rem; }
.member-hearts-card li { padding:.55rem .15rem; color:#ead8e3; border-bottom:1px solid rgba(255,255,255,.12); }
.admin-hearts { margin-top:1.5rem; }
#draft-preview .member-hearts-card { color:var(--foam); border-color:var(--line); background:rgba(18,1,14,.75); box-shadow:none; }
#draft-preview .member-hearts-card h3 { color:var(--foam); }
#draft-preview .member-hearts-card li { border-color:var(--line); }
.admin-login { max-width:460px; }
.admin-main label { display:block; margin:1rem 0; font-weight:600; }
.admin-main input,.admin-main textarea { display:block; width:100%; margin-top:.5rem; border:1px solid var(--line); border-radius:8px; background:var(--ink); padding:.8rem; color:var(--foam); font:inherit; color-scheme:dark; }
.admin-main input[type=date] { max-width:230px; }
.admin-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; margin:1.5rem 0; }
.admin-cards { max-width:none; }
.admin-cards fieldset { min-width:0; margin:0; }
.admin-cards legend { font-weight:700; padding:0 .5rem; }
.admin-image { width:100%; max-height:400px; object-fit:contain; background:var(--ink); border-radius:8px; }
.admin-main button:disabled { opacity:.55; cursor:not-allowed; }
.admin-main button.text-link { background:none; border:0; padding:0; font:inherit; cursor:pointer; }
#admin-status { padding:.8rem 0; }
#admin-status[data-error=true] { color:#ffbac6; }
.admin-options { margin-top:3rem; }
#preview-dialog { width:min(900px,95vw); }
.clip-direct { display:block; padding:.55rem; text-align:center; font-size:.8rem; }
@media(max-width:800px) { .weekly-grid { gap:2.5rem; grid-template-columns:1fr; max-width:430px; } }
@media(max-width:600px) { .weekly-grid { gap:2rem; max-width:380px; } .member-hearts-card ol { grid-template-columns:1fr; } .admin-main { padding-top:1.5rem; } }

/* Team Hartjes takes the place of the former game cards. */
.community-team-section { padding: 6rem 0; background: #0a080a; border-top: 1px solid rgba(255,255,255,.08); }
.community-team-heading .section-kicker { color: var(--neon); }
.community-team-heading h2 { max-width: 19ch; }
.community-team-heading .section-note { color: #caaabd; max-width: 23rem; }
.team-member-grid { display: grid; grid-template-columns: 1fr 1.12fr 1fr; align-items: end; gap: 0 1.25rem; max-width: 1000px; padding: 0; margin: 4rem auto 0; list-style: none; }
.team-member-grid li { position: relative; min-width: 0; }
.team-rank { color: #ae8b9f; font-size: .8rem; letter-spacing: .1em; }
.team-member-info { min-width: 0; color: var(--foam); overflow-wrap: anywhere; }
.team-member-info strong { display: block; font-size: 1.05rem; font-weight: 600; }
.team-member-info small { display: block; margin-top: .25rem; color: #caaabd; font-size: .85rem; }
.team-podium { --medal: #c1c6d6; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; min-height: 15rem; padding: 2rem 1rem; margin-bottom: 2.5rem; text-align: center; border: 1px solid color-mix(in srgb,var(--medal) 40%,transparent); border-radius: 24px 24px 12px 12px; background: radial-gradient(ellipse at top,color-mix(in srgb,var(--medal) 12%,transparent),transparent 80%),#170a14; }
.team-podium .team-rank { color: var(--medal); font-size: .7rem; letter-spacing: .16em; }
.team-podium .team-rank::before { content: 'Nr. '; }
.team-podium img { width: 70px; height: 59px; object-fit: contain; filter: drop-shadow(0 6px 18px rgba(255,129,80,.18)); }
.team-podium .team-member-info strong { font-size: clamp(1.1rem,2vw,1.5rem); }
.team-place-1 { --medal: #efbd70; grid-column: 2; grid-row: 1; min-height: 19rem; background: radial-gradient(ellipse at top,rgba(239,189,112,.18),transparent 75%),#1c0d16; box-shadow: 0 0 60px rgba(239,189,112,.07); }
.team-place-1 img { width: 90px; height: 76px; }
.team-place-2 { grid-column: 1; grid-row: 1; }
.team-place-3 { --medal: #c88d6c; grid-column: 3; grid-row: 1; min-height: 14rem; }
.team-crown { position: absolute; top: -16px; width: 38px; height: 28px; background: #efbd70; clip-path: polygon(0 15%,25% 45%,50% 0,75% 45%,100% 15%,88% 100%,12% 100%); }
.team-ranking-row { grid-column: 1 / -1; display: grid; grid-template-columns: 2rem 28px minmax(0,1fr); align-items: center; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,.1); }
.team-ranking-row img { width: 28px; height: 24px; object-fit: contain; }
.team-ranking-row .team-member-info { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.team-ranking-row .team-member-info small { flex: none; margin: 0; }
.team-ranking-row:nth-child(4) { border-top: 1px solid rgba(255,255,255,.1); }
@media (max-width: 700px) {
  .community-team-section { padding: 4rem 0; }
  .team-member-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 .8rem; margin-top: 3rem; }
  .team-place-1 { grid-column: 1 / -1; grid-row: 1; width: min(100%,22rem); justify-self: center; min-height: 17rem; margin-bottom: 1rem; }
  .team-place-2 { grid-column: 1; grid-row: 2; }
  .team-place-3 { grid-column: 2; grid-row: 2; }
  .team-place-2, .team-place-3 { min-height: 14rem; margin-bottom: 2rem; }
  .team-ranking-row { padding: 1rem .25rem; gap: .65rem; grid-template-columns: 1.5rem 24px minmax(0,1fr); }
  .team-ranking-row img { width: 24px; height: 21px; }
  .team-ranking-row .team-member-info strong { font-size: .95rem; }
}
/* Keep the admin preview's team list readable too. */
#draft-preview .community-team-members { grid-column: 1 / -1; }
#draft-preview .community-team-members ol { list-style: none; padding: 0; }
#draft-preview .community-team-members li { display: flex; align-items: center; gap: .65rem; }
#draft-preview .community-team-members li img { flex: none; width: 32px; height: 27px; object-fit: contain; }

/* Private statistics overview. */
.admin-statistics { padding: 2rem; margin: 1.5rem 0 3rem; border: 1px solid var(--line); border-radius: 20px; background: radial-gradient(ellipse at top left,rgba(166,14,143,.12),transparent 65%),#120b10; }
.statistics-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.statistics-heading h2 { margin: .5rem 0; font-size: clamp(1.8rem,3vw,2.5rem); }
.statistics-controls { display: flex; gap: 1rem; align-items: end; flex-wrap: wrap; }
.statistics-controls label { margin: 0; font-size: .85rem; }
.statistics-controls select { display: block; margin-top: .5rem; max-width: 100%; padding: .7rem; color: var(--foam); background: #1c0e18; border: 1px solid var(--line); border-radius: 8px; font: inherit; }
.statistics-totals { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; margin: 1.5rem 0; }
.statistics-totals article { padding: 1.2rem; border: 1px solid var(--line); border-radius: 12px; background: rgba(166,14,143,.08); }
.statistics-totals span { display: block; color: var(--muted); font-size: .85rem; }
.statistics-totals strong { display: block; margin-top: .5rem; font-size: 2.4rem; overflow-wrap: anywhere; }
.statistics-totals .statistics-best { font-size: 1.2rem; }
.statistics-rankings { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2rem; }
.statistics-rankings h3 { font-size: 1.1rem; }
.statistics-rankings ol, .statistics-days ol { list-style: none; padding: 0; }
.statistics-rankings li { display: grid; grid-template-columns: 1fr auto; gap: .4rem 1rem; margin-bottom: 1rem; font-size: .9rem; }
.statistics-rankings progress { grid-column: 1/-1; width: 100%; height: .35rem; border: 0; border-radius: 8px; overflow: hidden; background: #2c1726; accent-color: var(--neon); }
.statistics-rankings progress::-webkit-progress-bar { background: #2c1726; }
.statistics-rankings progress::-webkit-progress-value { background: var(--neon); border-radius: 8px; }
.statistics-rankings progress::-moz-progress-bar { background: var(--neon); }
.statistics-days { border-top: 1px solid var(--line); padding-top: 1rem; }
.statistics-days ol { max-height: 18rem; overflow: auto; }
.statistics-days li { display: flex; justify-content: space-between; padding: .5rem; border-bottom: 1px solid var(--line); }
@media (max-width: 700px) { .admin-statistics { padding: 1.2rem; } .statistics-totals, .statistics-rankings { grid-template-columns: 1fr; } }

.admin-statistics > .section-note { margin-top: 1.2rem; }
