.calendar-toolbar,.calendar-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0}.calendar-toolbar button,.calendar-tabs button{width:auto;min-height:40px;font-size:13px;padding:6px 10px}.calendar-toolbar button[aria-pressed=true],.calendar-tabs button[aria-pressed=true]{outline:2px solid #b47840;outline-offset:1px}.calendar-note{font-size:12px}.calendar-scroll{max-height:460px;overflow:auto;border:1px solid #ced6ce;border-radius:8px;background:#fffaf3}.calendar-grid{display:grid;grid-template-columns:54px repeat(var(--days),minmax(130px,1fr));min-width:100%;width:max-content}.calendar-axis,.calendar-column{min-width:0;border-right:1px solid #d8ded6}.calendar-day-heading{position:sticky;top:0;z-index:3;background:#f4f0e9;padding:8px 4px;font-size:12px;height:44px;border-bottom:1px solid #d8ded6}.calendar-hour{height:144px;font-size:11px;padding:4px}.calendar-track{position:relative}.calendar-gridline{position:absolute;left:0;right:0;border-top:1px solid #d8ded6;font-size:10px;color:#65746d;pointer-events:none}.calendar-event{position:absolute;min-height:80px;display:flex;flex-direction:column;gap:2px;align-items:flex-start;text-align:left;padding:5px;border-radius:5px;background:#dcebe3;color:#18382b;border:1px solid #8ba897;font-size:11px;line-height:1.2;overflow:hidden;overflow-wrap:anywhere}.calendar-event span,.calendar-event strong{max-width:100%}.calendar-event:focus-visible{outline:3px solid #b47840;z-index:4}.calendar-dialog{max-width:min(420px,90vw);border:1px solid #8ba897;border-radius:10px;background:#fffaf3;color:#243d36}.calendar-dialog::backdrop{background:#0006}@media(max-width:700px){.calendar-grid{grid-template-columns:44px repeat(var(--days),minmax(125px,1fr))}.calendar-tabs{flex-wrap:nowrap;overflow-x:auto;padding:3px}.calendar-tabs button{flex:none}.calendar-scroll{max-height:380px}.calendar-event{font-size:12px}}
/* Calendar follows content height; horizontal week/date navigation stays local. */
.calendar-scroll{max-height:none;overflow-x:auto;overflow-y:visible;position:relative}.calendar-empty{min-height:330px}.calendar-empty-message{position:absolute;top:100px;left:64px;right:12px;padding:16px;background:#fffaf3ee;text-align:center;font-weight:600;pointer-events:none}.calendar-details{margin:8px 0;padding:12px;border:1px solid #8ba897;border-radius:8px;background:#fffaf3;overflow-wrap:anywhere}.calendar-details button{width:auto}.calendar-details p{max-width:none}.calendar-grid{min-height:288px}@media(max-width:700px){.calendar-scroll{max-height:none}.calendar-empty-message{left:48px}.calendar-details{padding:8px}}

/* Empty views keep their date headers without fabricating scheduled hours. */
.calendar-grid.calendar-grid-blank{grid-template-columns:repeat(var(--days),minmax(125px,1fr));min-height:330px;width:100%}.calendar-grid-blank .calendar-track{min-height:280px}.calendar-empty-message{left:12px;right:12px;top:100px;font-size:16px}.calendar-details:focus{outline:2px solid #b47840;outline-offset:2px}
/* Fill the whole body below the 44px date header; override the app paragraph cap. */
.calendar-empty-message{inset:44px 0 0;width:auto;max-width:none;transform:none;display:grid;place-items:center;margin:0;padding:16px}

/* Compact time scale matches calendar-ui positioning, including short-class collision lanes. */
.calendar-hour{height:96px}.calendar-event{min-height:72px}.calendar-details .calendar-description{margin:16px 0}.calendar-details .calendar-detail-time{margin-top:12px}

.calendar-timezone{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0 4px;font-size:14px}.calendar-timezone select{min-height:44px;max-width:100%;min-width:0;width:min(100%,360px);font:inherit;padding:10px}.calendar-timezone-note{font-size:12px;margin:4px 0 12px}
@media(max-width:700px){.calendar-timezone{display:block}.calendar-timezone span{display:block;margin-bottom:4px}.calendar-timezone select{width:100%}}

.calendar-view-controls{align-items:center}.calendar-view-controls>span{font-size:14px;margin-right:4px}.calendar-day-navigation{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0}.calendar-day-navigation button{width:auto;font-size:13px}.calendar-selected-date{font-size:14px}.calendar-day-heading:has(.calendar-date-button){padding:0}.calendar-day-heading .calendar-date-button{width:100%;height:42px;min-height:42px;padding:6px 4px;border:0;border-radius:0;background:transparent;color:inherit;font:inherit;letter-spacing:normal}.calendar-day-heading .calendar-date-button:hover{background:#e6e1eb;color:inherit}.calendar-event-offset{font-size:10px}.calendar-timezone-note{margin-bottom:8px}

/* Desktop controls share the calendar width; coarse-pointer/mobile keeps its existing flow. */
section:has(>.calendar-desktop)>#week-title,section:has(>.calendar-desktop)>#zone,section:has(>.calendar-desktop)>.section-heading,details:has(.calendar-desktop)>[data-schedule-source]{display:none}
.calendar-desktop-header,.calendar-desktop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap}
.calendar-heading-block h2{margin:0 0 8px}.calendar-heading-block p{margin:0;font-size:14px}
.calendar-desktop .calendar-view-controls{margin:0}.calendar-desktop-toolbar{margin:16px 0 12px}
.calendar-desktop-toolbar>.calendar-toolbar{margin:0;flex-shrink:0}.calendar-desktop-toolbar>.calendar-timezone{margin:0;flex:0 1 470px;justify-content:flex-end;flex-wrap:nowrap}
.calendar-desktop-toolbar .calendar-timezone select{flex:1;min-width:180px;width:320px}.calendar-desktop-toolbar .calendar-timezone span{white-space:nowrap}
.calendar-desktop .calendar-note{display:inline;margin-right:6px}.calendar-secondary-note{display:inline;font-size:12px}
.calendar-desktop-header{margin-bottom:12px}.calendar-desktop .calendar-day-navigation{margin:0 0 12px}
@media(min-width:701px){.calendar-desktop-toolbar>.calendar-timezone{margin-left:auto}}

/* Search is an inline disclosure; only its result list scrolls. */
.timezone-picker{align-items:flex-start}.timezone-control{flex:1;min-width:0;width:360px;max-width:100%}
.timezone-trigger{width:100%;min-height:44px;text-align:left;font:inherit;padding:10px 30px 10px 12px;position:relative;white-space:normal;line-height:1.4}
.timezone-trigger::after{content:'⌄';position:absolute;right:10px;top:10px}.timezone-picker>span{padding-top:12px}
.timezone-search-panel{margin-top:8px;padding:12px;border:1px solid #cacdd3;background:#fff;color:#2b364e;min-width:0}.timezone-search-panel[hidden]{display:none!important}
.timezone-search-panel label{display:block;font-size:13px;margin:0 0 6px}.timezone-search-panel input{width:100%;min-height:44px;font:inherit;font-size:16px;margin:0 0 8px;padding:10px;border:1px solid #cacdd3;box-sizing:border-box}
.timezone-results{max-height:min(240px,max(44px,calc(var(--host-viewport-height,100dvh) - 220px)),max(44px,calc(100dvh - 220px)));overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}
.timezone-group-heading{padding:8px;font-size:12px;font-weight:700;background:#e7ecf4}.timezone-option{padding:12px 8px;min-height:44px;box-sizing:border-box;cursor:pointer;line-height:1.4;overflow-wrap:anywhere;font-size:14px}
.timezone-option:hover,.timezone-option[aria-selected=true]{background:#2b364e;color:#fff}.timezone-search-status{font-size:12px;margin:8px 0}.timezone-close{width:auto;min-height:44px;font-size:13px}
.timezone-picker input:focus-visible,.timezone-trigger:focus-visible,.timezone-close:focus-visible{outline:2px solid #2b364e;outline-offset:2px}
@media(max-width:700px){.timezone-control{width:100%}.timezone-picker>span{padding-top:0}}

/* Desktop picker overlays the calendar instead of stretching the toolbar row.
   Mobile keeps the existing in-flow disclosure and viewport-bounded results. */
.calendar-desktop .timezone-control{position:relative}
.calendar-desktop .timezone-search-panel{position:absolute;z-index:20;top:100%;right:0;width:100%;box-sizing:border-box;box-shadow:0 8px 24px #2b364e1f}

/* Approved compact agenda calendar. */
#classes .class-list{display:grid;gap:5px}#classes .class-item{background:#f0edf4;border-left:3px solid #a197b0;min-width:0}#classes .class-card{display:grid;grid-template-columns:88px minmax(0,1fr) 24px;align-items:center;gap:16px;width:100%;min-height:68px;padding:12px 16px;border:0;background:transparent;color:#2b364e;text-align:left;text-transform:none;letter-spacing:0;font-family:inherit;line-height:1.35;white-space:normal}#classes .class-time{display:flex;flex-direction:column;gap:2px;font-size:14px;font-weight:500}#classes .class-time small{font-size:11px;font-weight:400;color:#767b86}#classes .class-name{display:flex;flex-direction:column;gap:3px;min-width:0}#classes .class-name strong{font-size:14px;font-weight:500;overflow-wrap:anywhere}#classes .class-name small{font-size:12px;color:#686e7b}#classes .class-plus{font-size:20px;font-weight:400;text-align:center;color:#63657c}#classes .class-card:hover{background:#2b364e08}#classes .class-card:focus-visible{outline:2px solid #2b364e;outline-offset:2px}#classes .class-detail{border-top:1px solid #d8d2df;margin:0 16px;padding:12px 0;font-size:13px;line-height:1.6}#classes .class-detail p{margin:0 0 6px;max-width:none}#classes .class-detail p:last-child{margin:0;color:#6d7381;font-size:11px}#classes .week-scroll{overflow-x:auto}#classes .week-grid{display:grid;grid-template-columns:repeat(var(--day-count,7),minmax(145px,1fr));gap:8px;min-width:1080px;align-items:start}#classes .week-column{min-width:0}#classes .week-day{display:block;width:100%;background:#f5f5f6;border:1px solid #e2e3e7;min-height:42px;padding:9px 5px;font-size:12px;color:#2b364e;letter-spacing:0;text-transform:none;margin:0 0 8px}#classes .week-column.today .week-day{background:#2b364e;color:white;border-color:#2b364e}#classes .week-grid .class-card{grid-template-columns:minmax(0,1fr) 16px;gap:6px;padding:12px 10px;min-height:108px;align-items:start}#classes .week-grid .class-time{grid-column:1;flex-direction:row;flex-wrap:wrap;gap:3px;align-items:baseline;font-size:11px;line-height:1.3}#classes .week-grid .class-time small{font-size:11px}#classes .week-grid .class-name{grid-column:1;gap:5px}#classes .week-grid .class-name strong{font-size:13px;line-height:1.35}#classes .week-grid .class-plus{grid-column:2;grid-row:1/3;font-size:17px}#classes .week-grid .class-detail{margin:0 10px;font-size:12px}#classes .week-grid .class-list{gap:7px}#classes .empty-day{font-size:12px;color:#8a8e99;text-align:center;padding:24px 8px;margin:0;background:#fafafb}#classes .day-empty{padding:32px 16px}
#classes .class-card{position:static;overflow:visible;border-radius:0;max-width:none;min-width:0;font-size:14px;height:auto;overflow-wrap:anywhere} 
#classes .class-card:hover,#classes .class-card:focus{background:#e7e2ed;color:#2b364e}
#classes .calendar-tabs{display:grid;grid-template-columns:repeat(var(--tab-count,7),minmax(0,1fr));gap:5px;margin:14px 0 18px;overflow:visible;padding:0}
#classes .calendar-tabs button{background:white;color:#2b364e;border:1px solid #d8dae1;min-height:42px;padding:9px 4px;font-size:12px;letter-spacing:0;text-transform:none;outline:0}
#classes .calendar-tabs button[aria-pressed=true]{background:#2b364e;color:white;border-color:#2b364e}
#classes .calendar-toolbar button{min-height:36px;padding:7px 12px;font-size:12px;letter-spacing:0;text-transform:none}
#classes .calendar-desktop-toolbar{margin:16px 0 12px}
#classes .week-grid .class-card{min-height:84px;padding:10px;align-content:start;gap:5px}
#classes .week-grid .class-name{gap:3px}
#classes .week-grid{gap:7px}
#classes .calendar-event:focus-visible{outline:2px solid #2b364e;outline-offset:2px}
@media(max-width:700px){#classes .class-card{grid-template-columns:63px minmax(0,1fr) 18px;gap:10px;padding:11px 10px;min-height:68px}#classes .class-time{font-size:13px}#classes .class-name strong{font-size:13px}#classes .class-name small{font-size:11px}#classes .calendar-tabs button{font-size:11px;min-height:44px}#classes .week-grid{min-width:1035px}}
#classes .day-label{font-size:15px;margin:0 0 10px;font-weight:500}
/* Period colours follow the times shown in the selected time zone. */
#classes .class-item-evening{background:#f4efe4;border-left-color:#b49b70}
#classes .class-item-evening .class-card:hover,#classes .class-item-evening .class-card:focus{background:#eae0cb;color:#2b364e}
#classes .calendar-period-key{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:14px;font-size:11px;line-height:1.5;color:#737b89;margin:8px 0 12px}
#classes .calendar-period-key span{display:inline-flex;align-items:center;gap:6px}
#classes .calendar-period-key span:before{content:"";display:inline-block;width:11px;height:11px;border:1px solid #a197b0;background:#f0edf4}
#classes .calendar-period-key .period-evening:before{border-color:#b49b70;background:#f4efe4}
@media(max-width:700px){#classes .calendar-period-key{justify-content:flex-start}}
/* Mobile dates have comfortable, swipeable buttons instead of seven squeezed columns. */
@media(max-width:700px),(pointer:coarse){
 #classes .calendar-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:8px;padding:4px 2px 12px;margin:16px 0 20px;scrollbar-width:thin}
 #classes .calendar-tabs button{flex:0 0 auto;min-width:94px;min-height:46px;padding:12px 14px;font-size:13px;white-space:nowrap}
 #classes .calendar-toolbar{gap:10px;margin:12px 0 20px}
 #classes .calendar-toolbar button{min-height:44px;padding:10px 16px;font-size:13px}
 #classes .calendar-timezone{margin:0 0 8px}
 #classes .calendar-timezone>span{margin-bottom:8px}
 #classes .calendar-details{padding:20px 16px;margin:0 0 24px}
 #classes .class-list{gap:8px}
 #classes .class-card{padding:15px 12px;min-height:78px;gap:12px}
 #classes .day-label{margin-bottom:16px}
 .uniti-app.embed-page main{padding:12px}
}

.calendar-planning-note,.calendar-heading-block .calendar-planning-note{font-size:14px;line-height:1.5;margin:0 0 12px;max-width:720px}