#homeChallenges { grid-column:1/-1; }
#homeChallenges.has-reward { color:#b7f20c; border-color:#b7f20c; }
#challengesDialog { width:min(1050px,94vw); max-height:92dvh; padding:24px; overflow:auto; background:radial-gradient(ellipse at top right,#123c4d,transparent 60%),#0b121d; color:#eef9ff; border:1px solid #12d9f4; }
#challengesDialog header { display:flex; justify-content:space-between; gap:12px; }
#challengesDialog h2 { font:48px/1 var(--display); margin:8px 0; }
.challenge-intro,.challenge-note { font-size:14px; color:#c3d4de; line-height:1.6; }
.challenge-group h3 { color:#12d9f4; font:26px var(--display); margin:24px 0 4px; }
.challenge-group:nth-child(2) h3 { color:#b7f20c; }
.challenge-deadline { font-size:13px; color:#acc4d2; margin:0 0 14px; }
.challenge-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.challenge-card { padding:18px; border:1px solid #355164; background:#102332; display:flex; flex-direction:column; gap:12px; }
.challenge-card.ready { border-color:#b7f20c; background:linear-gradient(135deg,#b7f20c18,#102332); }
.challenge-card.claimed { border-color:#53746f; }
.challenge-state { font:14px var(--display); letter-spacing:.08em; color:#a8c4d3; }
.ready .challenge-state { color:#b7f20c; }
.challenge-card h4 { font:26px/1.1 var(--display); margin:0; }
.challenge-card p { font-size:14px; line-height:1.5; margin:0; flex:1; }
.challenge-card label { font-size:14px; }
.challenge-card progress { display:block; width:100%; height:10px; margin-top:8px; accent-color:#12d9f4; }
.challenge-card strong { font-size:14px; color:#ffd629; }
.challenge-card .button { background:#12d9f4; color:#07121b; min-height:44px; font-size:16px; }
.challenge-card .button:disabled { background:#233743; color:#a4bac7; opacity:1; cursor:default; }
#challengeMessage { color:#b7f20c; font-size:16px; }
@media(max-width:650px) { .challenge-grid { grid-template-columns:1fr; }#challengesDialog { padding:16px; } }
/* Extra menu entry must remain reachable on short desktop and tablet screens too. */
.home-screen { overflow-y:auto; }
.home-screen .home-content { min-height:760px; }
@media(max-width:650px) and (orientation:portrait) { .home-screen .home-content { min-height:0; } }