@media(min-width:981px){
  #calendarPage .calendar-layout{align-items:stretch!important;grid-template-rows:minmax(0,1fr);height:clamp(700px,calc(100vh - 205px),820px);overflow:hidden}
  #calendarPage .calendar-panel,#calendarPage .calendar-side{align-self:stretch!important;height:100%!important;min-height:0!important;margin:0!important;overflow:hidden}
  #calendarPage .calendar-panel{display:flex;flex-direction:column}
  #calendarPage .calendar-panel .calendar-head,#calendarPage .calendar-panel .calendar-week{flex:none}
  #calendarPage .calendar-panel .calendar-grid{flex:1;min-height:0;grid-template-rows:repeat(6,minmax(0,1fr))}
  #calendarPage .calendar-panel .calendar-day{min-height:0!important}
  #calendarPage .calendar-side{display:flex;flex-direction:column}
  #calendarPage .calendar-side .legend{flex:none}
  #calendarPage .month-summary{flex:1;min-height:0;max-height:none!important;overflow-x:hidden;overflow-y:auto;margin-bottom:0;padding:0 6px 8px 0;scrollbar-width:thin;scrollbar-color:#b9c1ba transparent}
  #calendarPage .month-summary::-webkit-scrollbar{width:6px}
  #calendarPage .month-summary::-webkit-scrollbar-thumb{background:#b9c1ba;border-radius:6px}
  #calendarPage .month-summary::-webkit-scrollbar-track{background:transparent}
}
@media(max-width:980px){
  #calendarPage .calendar-side{height:auto}
  #calendarPage .month-summary{max-height:220px;overflow-y:auto}
}
#calendarPage .calendar-layout{background:transparent!important;gap:16px!important}
#calendarPage .calendar-panel,#calendarPage .calendar-side{border-radius:22px!important;box-shadow:0 12px 32px rgba(54,72,59,.06);overflow:hidden}
#calendarPage .calendar-grid{border-radius:14px;overflow:hidden;border:1px solid var(--line)}
#calendarPage .calendar-day{border-color:#dde1db}
#calendarPage .calendar-head .icon-btn{width:38px;height:38px;border-radius:12px;background:#f0f3ef;display:grid;place-items:center}
#calendarPage .month-summary{border-radius:12px}
#calendarPage .calendar-day{position:relative;transition:background-color .18s ease,color .18s ease}
#calendarPage .calendar-day:hover{background:#f5f7f3;box-shadow:none}
#calendarPage .calendar-day:hover:after{content:"";position:absolute;inset:6px;border:1px solid rgba(91,111,97,.2);pointer-events:none}
#calendarPage .calendar-day.selected{background:#edf2ed;box-shadow:none}
#calendarPage .calendar-day.selected:before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:#6b8272;pointer-events:none}
#calendarPage .calendar-day.selected:after{display:none}
#calendarPage .calendar-day.selected .day-number{background:transparent;color:#31483a;box-shadow:inset 0 0 0 1px #718677;font-weight:700}
#calendarPage .calendar-day.today .day-number{background:#647b6b;color:#fff;box-shadow:none}
#calendarPage .calendar-day.today.selected .day-number{background:#405848;color:#fff;box-shadow:none}
#calendarPage .calendar-day:focus-visible{outline:2px solid #6f8676;outline-offset:-3px;z-index:1}
@media(max-width:720px){#calendarPage .calendar-day:hover:after{inset:3px}#calendarPage .calendar-day.selected:before{width:2px}}
@media(max-width:720px){
  #calendarPage .calendar-grid{
    grid-template-rows:repeat(6,64px);
  }
  #calendarPage .calendar-day{
    min-height:64px!important;
    padding:0!important;
    display:grid;
    place-items:center;
  }
  #calendarPage .calendar-day .calendar-event,
  #calendarPage .calendar-day .item-sub{
    display:none!important;
  }
  #calendarPage .calendar-day .day-number{
    margin:0;
  }
  #calendarPage .calendar-day.today{
    display:grid!important;
    background:#f1f5f1!important;
  }
  #calendarPage .calendar-day.today .day-number{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    background:#405848!important;
    color:#fff!important;
    box-shadow:0 0 0 3px rgba(64,88,72,.16)!important;
    font-weight:800!important;
  }
}