/* Monthly mock entrance, using the clinical-light site tokens. */
.monthly-page { padding-top:clamp(24px,4vw,48px); }
.monthly-page > h1 { font-size:clamp(28px,4vw,44px); margin:8px 0 24px; }
.monthly-feature { padding:clamp(20px,4vw,36px); border-color:var(--t-200); box-shadow:var(--sh-2); background:linear-gradient(145deg,var(--t-50),var(--card) 60%); }
.monthly-feature-head { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.monthly-feature h2 { max-width:630px; font-size:clamp(26px,3.5vw,36px); line-height:1.15; text-wrap:pretty; }
.monthly-free { color:var(--t-800); white-space:nowrap; }
.monthly-intro { margin-top:10px; color:var(--ink-2); }
.monthly-includes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); list-style:none; padding:0; margin:24px 0; gap:20px 16px; }
.monthly-includes li { display:flex; align-items:center; gap:10px; }
.monthly-number { display:grid; place-items:center; width:32px; height:32px; flex:none; background:var(--t-100); border-radius:10px; color:var(--t-800); font:12px var(--f-mono); }
.monthly-includes b,.monthly-includes small { display:block; }
.monthly-includes small { color:var(--mute); font-size:13px; }
.monthly-action { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:22px; border-top:1px solid var(--line-2); }
.monthly-action > div { max-width:340px; }
.monthly-action .btn { min-height:50px; }
.monthly-note { margin-top:18px; font-size:13px; color:var(--mute); }
.monthly-participants { margin-top:18px; color:var(--t-800); font-weight:600; }
.monthly-opens { margin-top:20px; font-size:14px; color:var(--ink-2); }
.monthly-opens time { font-weight:600; }
.monthly-section { margin-top:44px; }
.monthly-section h2 { font-size:26px; }
.monthly-section-head p { margin-top:10px; font-size:15px; }
.monthly-archives { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:18px; }
.monthly-archive { display:grid; gap:12px; padding:22px; border-color:var(--line-2); transition:border-color .15s; }
.monthly-archive:hover { border-color:var(--t-600); }
.monthly-archive h3 { font-size:22px; }
.monthly-empty { grid-column:1/-1; border-left:3px solid var(--t-200); padding:8px 0 8px 18px; color:var(--mute); }
.monthly-faq > h2 { margin-bottom:16px; }
.monthly-faq details { border-top:1px solid var(--line-2); padding:18px 0; }
.monthly-faq details:last-child { border-bottom:1px solid var(--line-2); }
.monthly-faq summary { font-weight:600; cursor:pointer; }
.monthly-faq details p { margin-top:12px; color:var(--ink-2); }
[data-monthly-status]:not(:empty) { margin-block:16px; }
[data-monthly] .label { display:block; margin-bottom:16px; }
[data-monthly-signin] { display:block; margin-top:12px; }
@media (max-width:600px) {
  .monthly-page > h1 { margin-bottom:18px; }
  .monthly-feature-head .chip { font-size:12px; }
  .monthly-action { flex-direction:column; align-items:stretch; gap:14px; }
  .monthly-action > div { max-width:none; }
  .monthly-archives { grid-template-columns:1fr; }
}
