/* SPDX-License-Identifier: AGPL-3.0-or-later */
.calendar-main {padding:65px 0 90px}
.calendar-intro {max-width:800px;margin:0 auto 36px;text-align:center}
.calendar-intro h1 {font:500 clamp(42px,6vw,66px)/1.08 'Cormorant Garamond',serif;margin:12px 0 18px}
.calendar-intro h1 em {color:var(--gold-soft);font-weight:500}
.calendar-intro p {color:var(--silver);line-height:1.75}
.calendar-form,.calendar-guide,.calendar-results,.calendar-detail {background:var(--glass);border:1px solid var(--glass-border);border-radius:var(--radius);padding:28px;margin-bottom:24px}
.calendar-form {display:grid;grid-template-columns:1.2fr 1fr .65fr auto;gap:18px;align-items:end}
.calendar-form label {display:flex;flex-direction:column;gap:9px;font-size:13px;color:var(--silver)}
.calendar-form input,.calendar-form select {width:100%;min-width:0;background:var(--midnight);border:1px solid rgba(192,200,212,.3);border-radius:9px;padding:12px;color:var(--ink);font:inherit;color-scheme:dark}
.calendar-form input:focus,.calendar-form select:focus {outline:2px solid var(--gold);outline-offset:3px}
.calendar-form .leap-rule {grid-column:1/-1;max-width:420px}
.calendar-form .form-note {grid-column:1/-1;margin:0;color:var(--ink-mute);font-size:12px;line-height:1.65}
.calendar-form button {white-space:nowrap;min-height:44px}
.calendar-error {color:#ffc6d3;line-height:1.6}
.calendar-loading {text-align:center;color:var(--gold-soft);padding:12px}
.calendar-guide summary {color:var(--gold-soft);cursor:pointer;font-size:15px}
.calendar-guide p {line-height:1.8;font-size:14px;color:var(--silver);max-width:950px;margin-top:18px}
.calendar-summary {display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:24px}
.calendar-summary h2 {font:500 34px 'Cormorant Garamond',serif;margin:0 0 8px;color:var(--gold-soft)}
.calendar-summary p {font-size:13px;line-height:1.7;color:var(--silver);margin:0}
.cycle-arrows {display:flex;gap:8px}
.calendar-action {border:1px solid var(--glass-border);background:rgba(212,175,55,.06);color:var(--gold-soft);border-radius:8px;padding:10px 14px;cursor:pointer;font:inherit;font-size:13px}
.calendar-action:hover {background:rgba(212,175,55,.15)}
.calendar-action:disabled {opacity:.4;cursor:default}
.phase-grid {display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.phase-card {text-align:left;background:linear-gradient(135deg,rgba(124,95,212,.12),rgba(11,16,38,.6));border:1px solid rgba(192,200,212,.16);border-top:2px solid var(--phase);border-radius:12px;color:var(--ink);padding:22px 18px;cursor:pointer;transition:background .2s,transform .2s;font-family:inherit;min-height:185px}
.phase-card:hover,.phase-card[aria-pressed=true] {background:rgba(124,95,212,.22);transform:translateY(-2px);border-color:var(--phase)}
.phase-card small {display:block;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--phase);min-height:17px}
.phase-card strong {display:block;font:500 32px 'Cormorant Garamond',serif;margin:9px 0}
.phase-card .phase-dates {display:block;line-height:1.65;font-size:13px;color:var(--silver)}
.phase-card .phase-length {display:block;font-size:12px;color:var(--phase);margin-top:14px}
.calendar-detail {scroll-margin-top:85px}
.detail-head {display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:20px}
.detail-head h2 {font:500 34px 'Cormorant Garamond',serif;color:var(--gold-soft);margin:0 0 6px}
.detail-head p,.moon-note,.calendar-legend {font-size:12px;line-height:1.7;color:var(--silver)}
.detail-head p {margin:0}
.detail-actions {display:flex;gap:8px;flex-wrap:wrap}
.month-grid {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.month-title {font:500 25px 'Cormorant Garamond',serif;color:var(--gold-soft);margin:22px 0 10px;text-transform:capitalize}
.weekday {font-size:11px;color:var(--ink-mute);text-align:center;padding:8px 0}
.calendar-day {min-height:91px;border:1px solid rgba(192,200,212,.14);border-radius:8px;background:rgba(124,95,212,.06);padding:9px;display:flex;flex-direction:column;gap:5px;position:relative}
.calendar-day .day-number {font-size:17px;font-weight:500}
.calendar-day .day-astro {display:flex;justify-content:space-between;gap:3px;align-items:center;margin-top:auto}
.calendar-day .moon-sign {font-size:12px;color:var(--silver)}
.calendar-day .moon-sign b {font-size:18px;font-weight:400;color:var(--gold-soft)}
.calendar-day .moon-icon {font-size:18px}
.calendar-day.is-today {border:2px solid var(--gold);background:rgba(212,175,55,.12)}
.calendar-day .today-label {font-size:9px;letter-spacing:.08em;color:var(--gold-soft);position:absolute;top:11px;right:9px}
.calendar-legend {display:flex;gap:8px 20px;flex-wrap:wrap;margin-top:20px}
.calendar-legend span {white-space:nowrap}
.moon-note {margin:18px 0 0}
.calendar-print-brand {display:none}
.calendar-main [hidden] {display:none!important}
@media (max-width:1000px) {.calendar-form {grid-template-columns:1fr 1fr}.phase-grid {grid-template-columns:repeat(3,1fr)}}
@media (max-width:650px) {
  .calendar-main {padding-top:36px}.calendar-form,.calendar-guide,.calendar-results,.calendar-detail {padding:18px}
  .calendar-form {grid-template-columns:1fr}.phase-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .calendar-summary,.detail-head {flex-direction:column;align-items:flex-start}.phase-card {padding:16px 12px;min-height:175px}
  .calendar-day {padding:3px;min-height:72px;border-radius:5px;min-width:0}.month-grid {gap:3px}
  .calendar-day .day-astro {display:grid;grid-template-columns:1fr 1fr;gap:1px}
  .calendar-day .moon-sign {min-width:0}.calendar-day .moon-sign span {display:none}.calendar-day .moon-sign b,.calendar-day .moon-icon {font-size:14px}
  .calendar-day .today-label {font-size:7px;top:8px;right:4px}.calendar-day .day-number {font-size:14px}
}
@media print {
  @page {size:A4 portrait;margin:10mm}
  body {background:white!important;color:#242039!important;font-family:Arial,sans-serif}
  #stars,.site-header,.site-footer,.calendar-intro,.calendar-form,.calendar-guide,.calendar-results,.calendar-error,.calendar-loading,.detail-actions {display:none!important}
  .calendar-main {padding:0}.calendar-main>.container {width:100%;max-width:none;padding:0}
  .calendar-detail {background:white!important;border:0;margin:0;padding:0}
  .calendar-print-brand {display:block;font-size:13px;letter-spacing:.2em;color:#503d79;margin-bottom:12px}
  .detail-head {display:block;margin-bottom:8px}.detail-head h2 {font-size:26px;color:#362548}.detail-head p {font-size:10px;color:#333}
  .month-title {font-size:19px;color:#362548;margin:10px 0 5px}
  .month-grid {gap:3px}.weekday {padding:3px;color:#555;font-size:9px}
  .calendar-day {min-height:49px;height:49px;padding:4px;border-color:#ddd;background:white!important;break-inside:avoid}
  .calendar-day .day-number {font-size:12px}.calendar-day .moon-sign,.calendar-day .moon-sign b {font-size:10px;color:#362548}
  .calendar-day .moon-icon {font-size:13px}.calendar-day.is-today {border:2px solid #857137}.calendar-day .today-label {font-size:7px;top:5px;color:#665523}
  .calendar-day .day-astro {display:flex}.calendar-day .moon-sign span {display:inline}.calendar-legend,.moon-note {font-size:9px;color:#333;margin-top:12px;line-height:1.4}
  .calendar-legend {gap:4px 12px}.month-title {break-after:avoid}
}
