/* ─── /weekly — builds on /css/style.css tokens and the form styles in /alpha/alpha.css ─── */
.hero { padding-bottom: 32px; }
@media (max-width: 560px) { .hero { padding-top: 112px; padding-bottom: 20px; } }

.when { padding-top: 8px; }
.when-card {
    max-width: 640px; margin: 0 auto; text-align: center; border-radius: 16px; padding: 36px 28px;
    border: 1px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, var(--grad) border-box;
}
.when-label { color: var(--text-secondary); font-size: 0.9rem; letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: 10px; }
.when-local { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.3rem, 3.4vw, 1.9rem); line-height: 1.25; margin-bottom: 8px; }
.when-zone { color: var(--text-secondary); margin-bottom: 14px; }
.when-proposed {
    display: inline-block; font-size: 0.85rem; font-weight: 600; color: #B45309;
    background: #FEF3C7; border-radius: 999px; padding: 4px 14px; margin-bottom: 20px;
}
.when:not([data-proposed]) .when-proposed { display: none; }
.when-details { display: grid; gap: 6px; max-width: 460px; margin: 0 auto 16px; text-align: left; font-size: 0.95rem; }
.when-details div { display: grid; grid-template-columns: 76px 1fr; gap: 10px; }
.when-details dt { color: var(--text-secondary); }
.when-details dd { margin: 0; }
.when-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin: 6px 0 18px; }
.cta-quiet { background: #fff; color: var(--ink); border: 1px solid #D9D9E3; }
.cta-quiet:hover { background: #fff; color: var(--ink); border-color: var(--ink); }
.when-note { color: var(--text-secondary); font-size: 0.92rem; }

.show h2, .rec h2 { text-align: center; }
.show-list { list-style: none; max-width: 640px; margin: 0 auto; display: grid; gap: 14px; padding: 0; }
.show-list li {
    display: grid; grid-template-columns: 72px 1fr; gap: 16px; align-items: start;
    border: 1px solid var(--border); border-radius: 14px; padding: 20px 22px; background: #fff;
}
.show-min { font-family: var(--font-display); font-weight: 600; color: var(--brand); padding-top: 2px; }
.show-list h3 { font-size: 1.05rem; margin-bottom: 4px; }
.show-list p { color: var(--text-secondary); font-size: 0.96rem; }

.rec-intro, .rec-empty, .join p { text-align: center; color: var(--text-secondary); }
.rec-empty { margin-top: 10px; font-size: 0.92rem; }
.join a { color: var(--ink); font-weight: 600; text-decoration: underline; }