/* Первый экран: лунный календарь в палитре существующих космических коллажей. */
.app-view[hidden] { display: none !important; }
.practice-header-mark { display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid #bd9354; border-radius: 50%; color: #efcf82; background: #102c36; font-size: 20px; }
.practice-topbar { margin-bottom: 14px; }
.practice-page-intro { margin: 0 4px 18px; color: #526871; font-size: 12px; line-height: 1.55; }
#practice-view .section-heading:first-of-type { margin-top: 24px; }
.lunar-calendar { overflow: hidden; border: 1px solid #315979; border-radius: 22px; color: #f7f3e9; background: #091723; box-shadow: 0 18px 36px #07131c54; }
.calendar-art { position: relative; height: 285px; overflow: hidden; background: #07131c; }
.calendar-art::after { position: absolute; inset: 0; content: ''; background: linear-gradient(90deg, #07131cf0 0%, #07131cb5 34%, transparent 71%), linear-gradient(0deg, #07131c8a, transparent 40%); pointer-events: none; }
.calendar-art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 58% center; }
.calendar-art-copy { position: absolute; z-index: 1; top: 24px; left: 24px; width: 53%; text-shadow: 0 2px 12px #06121c; }
.calendar-art-copy .eyebrow { color: #edc77d; font-size: 10px; }
.calendar-selected-date { margin: 35px 0 8px; color: #f5e5c7; font-size: 13px; font-weight: 700; }
.calendar-art-copy h2 { color: #fffaf0; font-size: 37px; line-height: .88; }
.calendar-lunar-day { margin: 10px 0 0; color: #f0d192; font-size: 11px; font-weight: 700; }
.calendar-panel { padding: 16px 15px 20px; background-color: #0b1a27; background-image: radial-gradient(#f2d18d2e 1px, transparent 1.5px); background-size: 26px 26px; }
.calendar-month-bar { display: grid; grid-template-columns: 34px 1fr 34px; align-items: center; gap: 8px; }
.calendar-month-bar h2 { color: #fffaf0; font-family: Manrope, Arial, sans-serif; font-size: 17px; font-weight: 700; text-align: center; letter-spacing: 0; }
.calendar-month-bar button { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid #bd935483; border-radius: 50%; color: #f1d695; background: #10283b; font-size: 27px; line-height: 1; }
.calendar-month-bar button:hover, .calendar-month-bar button:focus-visible { background: #1d4153; }
.calendar-weekdays, .calendar-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.calendar-weekdays { margin-top: 20px; }
.calendar-weekdays span { color: #9cafb9; font-size: 10px; font-weight: 700; text-align: center; }
.calendar-days { margin-top: 7px; }
.calendar-blank { min-height: 49px; }
.calendar-day { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-width: 0; height: 49px; padding: 2px 0; border: 1px solid transparent; border-radius: 13px; color: #f6f1e6; background: #ffffff08; }
.calendar-day:hover, .calendar-day:focus-visible { border-color: #d2ac6d; background: #ffffff14; }
.calendar-day.is-today { background: #1d4153a8; }
.calendar-day.is-selected { border: 2px solid #ecc46f; color: #fff; background: #c69a3830; box-shadow: 0 0 16px #cda84f26; }
.calendar-day-number { font-size: 13px; font-weight: 700; line-height: 1.1; }
.calendar-day-moon { font-size: 15px; line-height: 1.1; filter: saturate(.55); }
.calendar-today { display: block; margin: 11px auto 0; padding: 5px 10px; border: 0; color: #edc77d; background: transparent; font-size: 10px; font-weight: 700; }
.calendar-recommendation { margin-top: 14px; padding: 16px 15px 15px; border: 1px solid #a5896094; border-radius: 16px; background: linear-gradient(135deg, #162b38e8, #0c2030ed); }
.calendar-recommendation .eyebrow { color: #e1bc79; font-size: 9px; line-height: 1.4; }
.calendar-recommendation h3 { margin: 7px 0 0; color: #fff4dc; font-family: "Cormorant Garamond", Georgia, serif; font-size: 24px; font-weight: 600; line-height: 1; }
.calendar-recommendation .calendar-advice-intro { margin: 9px 0 14px; color: #e8e7e1; font-size: 12px; line-height: 1.6; }
.calendar-recommendation .calendar-advice-subheading { margin: 14px 0 6px; color: #e1bc79; font-size: 9px; font-weight: 800; letter-spacing: 1px; }
.calendar-advice-actions { margin: 0; padding-left: 21px; color: #f1ebe0; font-size: 12px; line-height: 1.55; }
.calendar-advice-actions li { padding-left: 2px; margin: 5px 0; }
.calendar-advice-actions li::marker { color: #e1bc79; font-weight: 800; }
.calendar-recommendation #calendar-advice { margin: 0 0 16px; color: #f1ebe0; font-size: 12px; line-height: 1.55; }
.calendar-practice { width: 100%; padding: 10px 12px; border: 1px solid #ddbd7a; border-radius: 999px; color: #11283b; background: #f5db9c; font-size: 11px; font-weight: 800; }
.calendar-practice span { margin-left: 5px; font-size: 15px; vertical-align: -1px; }
.calendar-disclaimer { margin: 12px 6px 0; color: #9dafb5; font-size: 9px; line-height: 1.5; }
@media (max-width: 370px) {
  .calendar-art { height: 248px; }
  .calendar-art-copy { top: 20px; left: 18px; width: 60%; }
  .calendar-art-copy h2 { font-size: 31px; }
  .calendar-selected-date { margin-top: 27px; }
  .calendar-panel { padding-inline: 10px; }
  .calendar-day { height: 46px; }
}