/* UIkit owns the modal lifecycle; BEM mixes own date-control presentation. */
/* The native PeriodPicker glyph is retained exactly, painted with theme text. */
@supports (mask-image: url("")) or (-webkit-mask-image: url("")) {
  body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) #tm-main .report-date__launcher .icon_calendar {
    --sl-date-calendar-glyph: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill%3D%22%23010202%22%20d%3D%22M0%206h3v3H0V6zm4%203h3V6H4v3zm4%200h3V6H8v3zm4%200h3V6h-3v3zm0-7v3h3V2h-3zM8%205h3V2H8v3zM4%205h3V2H4v3zm-4%208h3v-3H0v3zm4%200h3v-3H4v3zm4%200h3v-3H8v3z%22%2F%3E%3C%2Fsvg%3E");
    background-image: none;
    background-color: var(--sl-text);
    -webkit-mask: var(--sl-date-calendar-glyph) center / contain no-repeat;
    mask: var(--sl-date-calendar-glyph) center / contain no-repeat;
  }
}
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__panel { width: 560px; max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); box-sizing: border-box; overflow-y: auto; padding: 32px; background: var(--sl-surface); color: var(--sl-text); border: 1px solid var(--sl-line); border-radius: 16px; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__title { margin: 0 28px 28px 0; font: 400 clamp(26px, 3vw, 34px)/1.25 var(--sl-yoo-font-heading, 'Playfair Display', Georgia, serif); color: var(--sl-text); text-transform: none; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__label { display: block; margin-bottom: 10px; color: var(--sl-text); font: 600 18px/1.5 var(--sl-yoo-font-body, Arsenal, Arial, sans-serif); }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date .report-date__input { width: 100%; min-width: 0; min-height: 52px; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--sl-line); border-radius: 8px; color: var(--sl-text); background: var(--sl-bg-deep); font: 400 18px/1.4 var(--sl-yoo-font-body, Arsenal, Arial, sans-serif); font-variant-numeric: tabular-nums; color-scheme: dark; }
html[data-theme='light'] body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__input { color-scheme: light; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__help { margin: 16px 0 24px; color: var(--sl-muted); font: 400 16px/1.55 var(--sl-yoo-font-body, Arsenal, Arial, sans-serif); }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__status { margin: 0 0 16px; color: var(--sl-text); font: 400 16px/1.55 var(--sl-yoo-font-body, Arsenal, Arial, sans-serif); }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__status:empty { display: none; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__actions { display: flex; flex-wrap: wrap; gap: 12px; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__actions button { min-height: 44px; flex: 1; padding: 10px 20px; border-radius: 10px; font: 700 16px/1.4 var(--sl-yoo-font-body, Arsenal, Arial, sans-serif); text-transform: none; white-space: normal; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__confirm { color: #0d0c0b; background: var(--sl-orange); border: 1px solid transparent; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__cancel { color: var(--sl-text); background: transparent; border: 1px solid var(--sl-line); }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date .uk-modal-close-default { top: 8px; right: 8px; width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; color: var(--sl-text); }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date :is(input, button):focus-visible { outline: 2px solid var(--sl-copper-bright); outline-offset: 3px; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__confirm:disabled { opacity: .65; cursor: wait; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) #tm-main #transit_form .report-date__launcher { display: flex; flex-direction: column; gap: 3px; align-items: center; padding: 10px 16px; white-space: normal; }
body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) #tm-main .report-date__hint { display: block; color: var(--sl-muted); font: 400 14px/1.4 var(--sl-yoo-font-body, Arsenal, Arial, sans-serif); text-transform: none; }
@media (max-width: 639px) {
  body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__panel { padding: 24px 20px; }
  body:is(.sl-stage-personal-report, .sl-stage-moon-calendar) .report-date__input { font-size: 16px; }
}