/* Womble v32 — preferences + milestones + calendar + sharing */
.progress-sharing{display:flex;flex-wrap:wrap;gap:8px;margin:19px 0 12px}
.progress-sharing button{font-size:12px;min-height:42px}
.milestone-title{display:flex;gap:14px;align-items:center;justify-content:space-between;color:inherit;font-size:13px;font-weight:900;margin-bottom:10px}
.milestone-title small{font-size:11px;font-weight:600;opacity:.76}
.milestone-grid,.profile-milestone-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.milestone,.profile-milestone{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:77px;gap:2px;border-radius:13px;border:1px solid #d7cbdf;background:#f4effa;color:#635478;text-align:center}
.milestone span,.profile-milestone span{font-size:19px;line-height:1.1}.milestone b,.profile-milestone b{font-size:12px}.milestone small,.profile-milestone small{font-size:10px}
.milestone.unlocked,.profile-milestone.unlocked{background:#fff0c2;color:#7a4f07;border:1px solid #dcbd63;box-shadow:inset 0 0 0 1px #e6ce84}
.milestone-celebration{margin:12px 0;padding:13px 15px;border:1px solid #eec363;background:#fff2c9;color:#674000;border-radius:12px;font-weight:900;font-size:13px}
.milestone-celebration[hidden]{display:none}
.milestone-note{font-size:12px;color:inherit;opacity:.85}
.account-progress,.account-appearance{border:1px solid #795b53;border-radius:16px;padding:19px;margin:18px 0;background:#35282b;color:#fff1e4}
.account-progress h3,.account-appearance h3{margin:0 0 12px;color:#fff1e4}
.account-progress a{color:#ffc58e;text-decoration:underline;font-weight:800;font-size:13px}
.appearance-label{display:block;margin:6px 0;font-weight:800;font-size:13px}
.appearance-select{border:1px solid #b5a29a;color:#29212b;background:#fff7ee;border-radius:10px;padding:10px;min-height:42px;max-width:100%;font-size:13px}
.account-appearance small{display:block;margin:8px 0;color:#e5cbbd}
.footer-theme-control{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:inherit}
.footer-theme-control select{min-height:36px;padding:6px}
.answer-review{text-align:left;white-space:normal!important;line-height:1.7}
.answer-review>strong{display:block;margin-bottom:9px;font-size:15px}
.answer-review>div{white-space:pre-line;overflow-wrap:anywhere;font-size:13px}
.completion-calendar,.profile-milestones{padding:20px;margin:25px 0;border-radius:18px;border:1px solid #d9c6cb;background:#37292d;color:#fff0e3}
.completion-calendar h3,.profile-milestones h3{color:#fff0e3;margin:0 0 8px}
.completion-calendar p,.profile-milestones p{color:#dfc4b7;font-size:13px;line-height:1.5}
.calendar-year{display:grid;grid-template-columns:repeat(53,minmax(0,1fr));grid-template-rows:repeat(7,12px);grid-auto-flow:column;gap:3px;overflow-x:auto;padding:10px 1px}
.calendar-day{min-width:6px;min-height:12px;background:#604b53;border-radius:3px;border:1px solid #6f5660}
.calendar-day.played{background:#f28a3a;border-color:#f6a45d}.calendar-day.perfect{background:#f1cc58;border-color:#f7e394;box-shadow:0 0 0 1px #fff2af}
.calendar-legend{display:flex;justify-content:flex-end;gap:15px;margin-top:10px;font-size:11px;flex-wrap:wrap;color:#f4e6dd}
@media(max-width:700px){.calendar-year{min-width:625px}.completion-calendar{overflow-x:auto}.milestone-grid,.profile-milestone-grid{gap:5px}.milestone,.profile-milestone{min-height:69px}.milestone b,.profile-milestone b{font-size:10px}.milestone small,.profile-milestone small{font-size:9px}}
/* User-selected dark mode. Separate from the site's seasonal palette and role badges. */
html[data-site-mode="dark"]{--bg:#211b20;--ink:#fff0e5;--muted:#d1b8ae;--line:#594343;color-scheme:dark}
html[data-site-mode="dark"] body{background:#211b20;color:#fff0e5}
html[data-site-mode="dark"] .site-header,html[data-site-mode="dark"] .mobile-dock{background:#2c2227;color:#fff1e5;border-color:#604541}
html[data-site-mode="dark"] .games-section,html[data-site-mode="dark"] .how-section,html[data-site-mode="dark"] .leaderboard-section{background:#261e23;color:#fff0e5;border-color:#664a44}
html[data-site-mode="dark"] .game-card,html[data-site-mode="dark"] .score-panel,html[data-site-mode="dark"] .stats-panel,html[data-site-mode="dark"] .step,html[data-site-mode="dark"] .leaderboard-panel,html[data-site-mode="dark"] .leaderboard-row,html[data-site-mode="dark"] .archive-date,html[data-site-mode="dark"] .archive-game,html[data-site-mode="dark"] .players-search-box{background:#36282d;color:#fff0e5;border-color:#614541}
html[data-site-mode="dark"] .game-card h3,html[data-site-mode="dark"] .section-head h2,html[data-site-mode="dark"] .player-profile h2{color:#fff0e5}
html[data-site-mode="dark"] .game-card p,html[data-site-mode="dark"] .section-head p,html[data-site-mode="dark"] .hero p,html[data-site-mode="dark"] .daily-note,html[data-site-mode="dark"] .stats-panel small{color:#e0c7bc}
html[data-site-mode="dark"] .card-play,html[data-site-mode="dark"] .date-pill{background:#493438;color:#fff2e9;border-color:#80615c}
html[data-site-mode="dark"] .footer{background:#211b20;color:#f4e6df}
html[data-site-mode="dark"] .desktop-nav a,html[data-site-mode="dark"] .mobile-dock a,html[data-site-mode="dark"] .mobile-dock button{color:#fff1e5}
html[data-site-mode="dark"] .leaderboard-requirement{background:#3d2b34;color:#fff1e5;border-color:#89605a}
html[data-site-mode="dark"] .leaderboard-requirement p,html[data-site-mode="dark"] .leaderboard-requirement strong{color:#fff1e5}

.changelog-footer-link{font-size:12px;font-weight:800;color:#ed9558;padding:8px}


/* v33: account signup/login dialog ONLY. Make the dark/seasonal dialog
   internally consistent without affecting other modals, pages, or badges. */
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .modal-dialog {
  background:#2d2023;
  color:#fff0e3;
  border-color:#583b36;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .modal-bar {
  background:#2d2023;
  border-bottom-color:#684843;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-content h2,
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-content .form-field label {
  color:#fff1e5;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-content > p:not(.account-hint) {
  color:#e5c5b5;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-tabs {
  background:#3d2c30;
  border:1px solid #76544c;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-tabs button {
  color:#e9cfc0;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-tabs button.active {
  background:#f2dfd3;
  color:#33232b;
  box-shadow:0 2px 8px #120b0b40;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-tabs button:not(.active):hover {
  background:#533a3c;
  color:#fff1e5;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .form-field small,
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .checkbox-line {
  color:#e2c3b5;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .form-field input {
  background:#39292a;
  border-color:#81584f;
  color:#fff1e5;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .form-field input::placeholder {
  color:#d2b0a3;
  opacity:1;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-content p.account-hint {
  background:#453136;
  color:#f5ded0;
  border:1px solid #755049;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-hint a {
  color:#ffbf83;
  text-decoration:underline;
  text-underline-offset:2px;
  font-weight:800;
}
:is(html[data-season="halloween"], html[data-site-mode="dark"]) #account-modal .account-inline-btn {
  color:#ffbf83;
}