.calendar-detail-layer{position:fixed;inset:0;z-index:70;display:flex;justify-content:flex-end;isolation:isolate}
.calendar-detail-backdrop{position:absolute;inset:0;background:#240d246b;backdrop-filter:blur(3px)}
.calendar-detail-drawer{position:relative;display:flex;flex-direction:column;width:min(550px,100%);height:100dvh;background:#fff;box-shadow:-12px 0 50px #210b2426;overflow:hidden;animation:course-panel-in .18s ease-out}
.calendar-detail-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:30px 28px 23px;border-bottom:1px solid var(--line);background:#fffafd;flex-shrink:0}
.calendar-detail-heading .eyebrow{font-size:9px;letter-spacing:1.5px;display:block;margin-bottom:9px}
.calendar-detail-heading h2{font-size:24px;letter-spacing:-.7px;text-transform:capitalize;line-height:1.2}
.calendar-detail-heading p{font-size:12px;margin-top:9px;color:var(--muted)}
.calendar-detail-heading .icon-button{flex-shrink:0}
.calendar-detail-body{overflow:auto;overscroll-behavior:contain;padding:26px 28px 40px;min-height:0;flex:1}
.calendar-detail-body .agenda-event{padding:17px;align-items:flex-start;flex-wrap:wrap;gap:16px}
.calendar-detail-body .event-main{min-width:150px;flex:1}
.calendar-detail-body .event-side{flex-basis:100%;align-items:flex-start;margin-left:0}
.calendar-detail-body .agenda-replacement-panel{padding:0 16px 16px}
.calendar-detail-body .form-grid{grid-template-columns:1fr}
.calendar-detail-body .coach-replacement{margin-top:17px}
.calendar-detail-body input,.calendar-detail-body select,.calendar-detail-body textarea{max-width:100%}
.agenda-detail-open{overflow:hidden}
.calendar-period-controls>[data-action="calendar-today"]{background:var(--pink-light);border-color:#f4c4df;color:var(--pink-dark);font-weight:750}
.calendar-today-mobile{display:none}
@keyframes course-panel-in{from{transform:translateX(24px);opacity:.6}to{transform:translateX(0);opacity:1}}
@media(max-width:700px){.calendar-detail-drawer{width:100%;border-radius:0}.calendar-detail-heading{padding:23px 20px 20px}.calendar-detail-heading h2{font-size:23px}.calendar-detail-body{padding:22px 20px 32px}.calendar-detail-heading .icon-button{min-width:42px;min-height:42px}.calendar-view-controls input{font-size:12px}.calendar-view-controls .segmented button{min-height:35px;font-size:11px}.calendar-period-controls>.button{min-height:36px;font-size:11px}.calendar-period-arrows .icon-button{width:35px;height:36px}.calendar-time-scroll{max-height:62dvh}.calendar-event>strong{font-size:12px}.calendar-event-time{font-size:11px}.calendar-event-coach{font-size:10px}.calendar-event-status{font-size:9px}.calendar-day-heading{min-height:55px}.calendar-hour-label{font-size:10px}}
@media(prefers-reduced-motion:reduce){.calendar-detail-drawer{animation:none}}

/* On a phone the calendar uses dates and readable course cards, not a cropped timetable. */
@media(max-width:700px){
  .calendar-filter-bar .toolbar{align-items:stretch}
  .calendar-filter-bar .toolbar>.segmented{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;min-width:0;overflow:visible;padding:4px;gap:3px}
  .calendar-filter-bar .toolbar>.segmented button{font-size:10px;min-height:44px;min-width:0;padding:6px 3px;white-space:normal;line-height:1.4}
  .calendar-filter-bar .toolbar-controls{width:100%;min-width:0;justify-content:space-between}
  .calendar-filter-bar .toolbar-controls select{font-size:16px;min-height:44px;max-width:calc(100% - 48px);min-width:0}
  .calendar-controls{display:flex;gap:11px;padding:13px 12px 12px;align-items:stretch}
  .calendar-period-controls{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:8px;width:100%;min-width:0;align-items:center}
  .calendar-period-title{grid-column:2;grid-row:1;font-size:15px;line-height:1.4;letter-spacing:-.3px;text-align:center;min-width:0;margin:0;overflow-wrap:anywhere}
  .calendar-period-arrows{display:contents}
  .calendar-period-arrows .icon-button{width:44px;height:44px;min-width:44px;min-height:44px;border-radius:11px}
  .calendar-period-arrows .icon-button:first-child{grid-column:1;grid-row:1}
  .calendar-period-arrows .icon-button:last-child{grid-column:3;grid-row:1}
  .calendar-period-arrows .icon-button svg{width:18px;height:18px}
  .calendar-period-controls>.calendar-today-desktop{display:none}
  .calendar-view-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 8px;min-width:0;width:100%}
  .calendar-view-controls input{font-size:16px;min-height:44px;width:100%;max-width:100%;min-width:0;padding:10px 12px;border-radius:11px;box-sizing:border-box}
  .calendar-view-controls>.calendar-today-mobile{display:inline-flex;min-height:44px;font-size:11px;padding:9px 10px;border-radius:11px;background:var(--pink-light);border-color:#f4c4df;color:var(--pink-dark)}
  .calendar-view-controls .segmented{display:grid;grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;width:100%;min-width:0;padding:4px;border-radius:12px}
  .calendar-view-controls .segmented button{font-size:12px;min-height:44px;min-width:0;padding:8px 3px;border-radius:9px}
  .calendar-meta{padding:0 14px 15px;gap:8px}
  .calendar-legend>span{font-size:11px;line-height:1.5}
  .calendar-legend i{width:8px;height:8px}
  .calendar-meta>span{font-size:10px;line-height:1.5}
  .role-coach .calendar-surface.is-compact .calendar-meta{display:none}
  .calendar-mobile-days{border-top:1px solid var(--line)}
  .calendar-mobile-week-nav{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;padding:9px 8px;background:#fffbfd;border-bottom:1px solid var(--line);min-width:0}
  .calendar-mobile-day{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:66px;min-width:0;padding:5px 1px;border:1px solid transparent;border-radius:11px;background:transparent;color:var(--muted);line-height:1}
  .calendar-mobile-day>span{font-size:10px;text-transform:capitalize;max-width:100%}
  .calendar-mobile-day>strong{display:flex;align-items:center;justify-content:center;width:29px;height:29px;border-radius:50%;font-size:17px;font-weight:750;letter-spacing:-.5px;color:var(--plum)}
  .calendar-mobile-day.is-today>strong{background:var(--pink-light);color:var(--pink-dark)}
  .calendar-mobile-day.is-today>span{color:var(--pink-dark);font-weight:650}
  .calendar-mobile-day:hover{background:#f9edf4}
  .calendar-mobile-day.is-selected{background:var(--plum);color:#fff}
  .calendar-mobile-day.is-selected>strong{color:#fff;background:transparent}
  .calendar-mobile-day.is-selected.is-today>span{color:#fff}
  .calendar-mobile-day-count{display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:750;min-width:15px;height:15px;border-radius:8px;color:var(--pink-dark);font-variant-numeric:tabular-nums}
  .calendar-mobile-day-count.has-courses{background:#fce1ef}
  .calendar-mobile-day.is-selected .calendar-mobile-day-count.has-courses{background:#ffffff24;color:#fff}
  .calendar-mobile-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:19px 16px 17px;min-width:0}
  .calendar-mobile-summary>div{min-width:0}
  .calendar-mobile-summary h3{font-size:15px;line-height:1.45;font-weight:700;letter-spacing:-.2px;color:var(--plum);text-transform:capitalize;overflow-wrap:anywhere}
  .calendar-mobile-summary>div>span{display:block;font-size:11px;color:var(--muted);margin-top:5px;line-height:1.5}
  .calendar-mobile-summary .text-link{min-height:44px;font-size:11px;line-height:1.5;white-space:normal;text-align:right;flex-shrink:0;max-width:104px}
  .calendar-mobile-course-list{display:flex;flex-direction:column;gap:22px;padding:0 14px 18px;min-width:0}
  .calendar-mobile-day-group{min-width:0}
  .calendar-mobile-day-group>h4{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;line-height:1.6;font-weight:650;color:var(--muted);text-transform:capitalize;padding:0 2px 10px;overflow-wrap:anywhere}
  .calendar-mobile-day-group>h4>span{font-size:9px;line-height:1.6;color:var(--pink-dark);background:var(--pink-light);border-radius:5px;padding:3px 6px;flex-shrink:0}
  .calendar-mobile-course{display:flex;flex-direction:column;align-items:stretch;gap:0;width:100%;min-width:0;margin:0 0 10px;padding:17px 15px 0;border:1px solid var(--line);border-left:3px solid var(--event-color);border-radius:13px;background:#fff;text-align:left;color:var(--plum);box-shadow:0 3px 13px #350a3405;overflow-wrap:anywhere}
  .calendar-mobile-course:last-child{margin-bottom:0}
  .calendar-mobile-course:hover{background:#fffbfd;border-color:color-mix(in srgb,var(--event-color) 35%,var(--line));border-left-color:var(--event-color)}
  .calendar-mobile-course.is-selected{outline:2px solid var(--event-color);outline-offset:2px}
  .calendar-mobile-course-top{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:9px 10px;min-width:0}
  .calendar-mobile-course-time{font-size:20px;line-height:1.4;font-weight:750;letter-spacing:-.6px;font-variant-numeric:tabular-nums;min-width:0}
  .calendar-mobile-course-time>span{font-size:12px;font-weight:500;letter-spacing:0;color:var(--muted)}
  .calendar-mobile-course-time>small{display:block;font-size:10px;line-height:1.5;font-weight:600;letter-spacing:0;color:var(--muted);margin-bottom:2px}
  .calendar-mobile-course-top .badge{font-size:10px;line-height:1.4;min-width:0;max-width:100%;padding:5px 7px;white-space:normal;text-align:left}
  .calendar-mobile-course-player{display:block;font-size:16px;line-height:1.5;font-weight:750;letter-spacing:-.2px;margin-top:14px}
  .calendar-mobile-course-formula{font-size:13px;line-height:1.6;color:var(--muted);margin-top:3px}
  .calendar-mobile-course-facts{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:14px;font-size:12px;line-height:1.6;color:#7d6676}
  .calendar-mobile-course-facts>span{display:flex;align-items:flex-start;gap:7px;min-width:0;max-width:100%}
  .calendar-mobile-course-facts svg{width:15px;height:18px;flex-shrink:0;color:#a78c9e}
  .calendar-mobile-course-open{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:47px;margin-top:15px;border-top:1px solid var(--line);font-size:12px;font-weight:650;color:var(--pink-dark)}
  .calendar-mobile-course-open svg{width:17px;height:17px;flex-shrink:0}
  .calendar-mobile-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:25px 9px 30px;color:var(--muted)}
  .calendar-mobile-empty>svg{width:31px;height:31px;stroke-width:1.3;color:#c2a5b6;margin-bottom:15px}
  .calendar-mobile-empty>strong{font-size:15px;line-height:1.5;color:var(--plum)}
  .calendar-mobile-empty>p{font-size:12px;line-height:1.7;max-width:240px;margin-top:7px}
  .calendar-mobile-month{border-top:1px solid var(--line);padding:14px 8px 8px;min-width:0}
  .calendar-mobile-month-weekdays,.calendar-mobile-month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;min-width:0}
  .calendar-mobile-month-weekdays>span{text-align:center;font-size:10px;font-weight:600;line-height:1.6;color:var(--muted);padding:2px 0 11px;text-transform:capitalize;min-width:0}
  .calendar-mobile-month-day{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:57px;border-radius:10px;padding:7px 1px;background:transparent;color:var(--plum);border:1px solid transparent;font-variant-numeric:tabular-nums}
  .calendar-mobile-month-day>strong{display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:650;width:26px;height:26px;border-radius:50%}
  .calendar-mobile-month-day.is-outside{color:#b9a9b4}
  .calendar-mobile-month-day.has-courses{background:#fcf7fa;border-color:#f0e5ec}
  .calendar-mobile-month-day.is-today>strong{background:var(--pink);color:#fff}
  .calendar-mobile-month-day:hover{background:#f9edf4}
  .calendar-mobile-month-dots{display:flex;align-items:center;justify-content:center;gap:3px;min-height:5px}
  .calendar-mobile-month-dots>i{width:4px;height:4px;border-radius:50%;display:block}
  .calendar-mobile-month-day>small{position:absolute;top:3px;right:3px;font-size:8px;line-height:1;color:#8d6c82}
  .calendar-mobile-month-hint{text-align:center;font-size:11px;line-height:1.6;color:var(--muted);padding:17px 7px 11px}
  .calendar-help{font-size:11px;line-height:1.7;margin-top:14px}
  .calendar-detail-heading .icon-button{min-width:44px;min-height:44px}
  .calendar-mobile-day:focus-visible,.calendar-mobile-course:focus-visible,.calendar-mobile-month-day:focus-visible{outline:2px solid var(--pink);outline-offset:1px}
}
