/* community module: announcement bar, promo, schedule, daily question, push opt-in */
html[lang="en"] .c-th, html:not([lang="en"]) .c-en { display: none }

.c-annc { background: linear-gradient(90deg, rgb(var(--gold-rgb) / .16), rgb(var(--gold-rgb) / .06)); border-bottom: 1px solid rgb(var(--gold-rgb) / .35) }
.c-annc .wrap { display: flex; align-items: center; gap: 12px; padding-block: 10px }
.c-annc p { margin: 0; flex: 1; min-width: 0; font-size: 0.9062rem; line-height: 1.55 }
.c-annc a { white-space: nowrap }
.c-annc-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--gold-hi); box-shadow: 0 0 0 4px rgb(var(--gold-hi-rgb) / .18) }
.c-annc button { flex: none; background: none; border: 0; color: var(--muted); font-size: 1.375rem; line-height: 1; padding: 4px 8px; cursor: pointer; border-radius: 4px }
.c-annc button:hover { color: var(--fg) }

.c-promo-wrap { padding-top: clamp(32px, 4vw, 48px) }
.c-promo { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; border: 1px solid rgb(var(--gold-rgb) / .45); border-radius: 10px; padding: 24px 28px;
  background: radial-gradient(ellipse at 0% 0%, rgb(var(--gold-hi-rgb) / .12), transparent 60%), var(--navy) }
.c-promo > div { min-width: 0; flex: 1 1 320px; display: grid; gap: 8px }
.c-promo h3 { font-size: clamp(1.25rem, 2.2vw, 1.625rem) }
.c-promo p { margin: 0; color: var(--muted) }

/* schedule */
.c-sched { border-top: 1px solid var(--line) }
.c-sched-head { display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap; margin-bottom: 32px }
.c-sched-head .sec-head { margin: 0 !important }
.c-sched-act { display: flex; gap: 10px; flex-wrap: wrap; align-items: start }
.c-events { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px }
.c-ev { display: grid; grid-template-columns: 92px 1fr auto; gap: 20px; align-items: center; border: 1px solid var(--line); border-radius: 8px; background: var(--navy); padding: 18px 20px }
.c-ev > * { min-width: 0 }
.c-ev.live { border-color: var(--up); box-shadow: 0 0 0 1px rgb(var(--up-rgb) / .25) }
.c-ev.past { color: var(--dim) }
.c-ev-when { display: grid; text-align: center; border-right: 1px solid var(--line); padding-right: 16px }
.c-ev-when b { font: 600 1.5rem/1.1 var(--f-mono); color: var(--gold-hi); font-variant-numeric: tabular-nums }
.c-ev-when span { font-size: 0.875rem }
.c-ev-when small { font-size: 0.75rem; color: var(--dim) }
.c-ev h3 { font-size: 1.125rem }
.c-ev-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 4px; font-size: 0.8438rem; color: var(--muted) }
.c-cd { font: 500 0.7812rem var(--f-mono); color: var(--gold) }
.c-ev.live .c-cd { color: var(--up) }
.c-ev p { margin: 8px 0 0; color: var(--muted); font-size: 0.9062rem }
@media (max-width: 640px) {
  .c-ev { grid-template-columns: 70px 1fr; gap: 14px; padding: 16px }
  .c-ev-when { padding-right: 12px }
  .c-ev-when b { font-size: 1.1875rem }
  .c-ics { grid-column: 1 / -1 }
}

/* daily question */
.c-daily { padding-block: clamp(40px, 5vw, 64px) }
.c-dgrid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 20px; align-items: start }
.c-dgrid > * { min-width: 0 }
.c-dgrid:has(> .c-notify[hidden]) { grid-template-columns: 1fr; max-width: 820px }
.c-card[hidden] { display: none }
.c-card { border: 1px solid var(--line); border-radius: 10px; background: var(--navy); padding: clamp(20px, 3vw, 30px); display: grid; gap: 12px }
.c-qhead { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap }
.c-streak { font: 500 0.8125rem var(--f-body); color: var(--gold-hi); background: rgb(var(--gold-rgb) / .12); border: 1px solid rgb(var(--gold-rgb) / .35); border-radius: 99px; padding: 3px 12px }
.c-q h2 { font-size: clamp(1.375rem, 2.6vw, 1.875rem) }
.c-qtext { margin: 0; font-size: 1.0625rem; font-weight: 600 }
.c-choices { display: grid; gap: 8px }
.c-choice { display: flex; align-items: flex-start; gap: 12px; text-align: left; width: 100%; background: var(--panel); color: var(--fg); border: 1px solid var(--line-2); border-radius: 6px;
  padding: 11px 14px; font: 0.9375rem/1.5 var(--f-body); cursor: pointer; transition: border-color .2s, background .2s }
.c-choice b { flex: none; font: 600 0.8125rem/1.9 var(--f-mono); color: var(--gold) }
.c-choice:hover:not(:disabled) { border-color: var(--gold) }
.c-choice:disabled { cursor: default }
.c-choice.ok { border-color: var(--up); background: rgb(var(--up-rgb) / .12) }
.c-choice.no { border-color: var(--down); background: rgb(var(--down-rgb) / .12) }
.c-res p { margin: 0 0 6px; color: var(--fg-2); font-size: 0.9375rem }
.c-res .c-pct { font-size: 0.8125rem; color: var(--dim) }
.c-hist { display: flex; gap: 6px }
.c-hist:empty { display: none }
.c-hist i { width: 14px; height: 14px; border-radius: 3px; background: var(--line) }
.c-hist i.ok { background: var(--up) } .c-hist i.no { background: var(--down) }
.c-notify h3 { font-size: 1.25rem }
.c-notify p { margin: 0; color: var(--muted); font-size: 0.9062rem }

/* push control */
.c-push { position: relative }
.c-push [hidden], .c-ev [hidden] { display: none !important }
.c-push-btn:disabled { opacity: .6; cursor: not-allowed; transform: none }
.c-push-panel { margin-top: 10px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--panel); padding: 14px 16px; display: grid; gap: 12px; min-width: min(300px, 100%) }
.c-sched-act .c-push-panel { position: absolute; right: 0; z-index: 5; width: 300px; max-width: calc(100vw - 32px); box-shadow: 0 16px 40px rgb(var(--shade) / .45) }
.c-push fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 8px }
.c-push legend { font-size: 0.8125rem; color: var(--dim); margin-bottom: 4px; padding: 0 }
.c-push label { display: flex; gap: 10px; align-items: center; font-size: 0.9062rem; cursor: pointer }
.c-push input { accent-color: var(--gold); width: 16px; height: 16px }
.c-push-row { display: flex; gap: 8px; flex-wrap: wrap }
@media (max-width: 960px) { .c-dgrid { grid-template-columns: 1fr } .c-sched-act .c-push-panel { left: 0; right: auto } }
@media (prefers-reduced-motion: reduce) { .c-choice { transition: none } }
