/* Shared rhythm across page actions and every popup, without changing navigation. */
:root { --dialog-space:24px; }
:is(.ic-scroll,.mp-scroll,.j-scroll,.ct-scroll,.lc-scroll,.lp-content,#modal-content) { padding:var(--dialog-space); scroll-padding-block:20px; scrollbar-gutter:stable; }
:is(.ic-header,.mp-dialog-head,.j-dialog-header,.ct-panel > header,.lp-header,#modal > .modal-top) { padding:14px var(--dialog-space); gap:12px; }
:is(.ic-header,.mp-dialog-head,.j-dialog-header,.ct-panel > header) h2 { font-size:16px; line-height:24px; letter-spacing:-.35px; }
:is(.ic-footer,.mp-footer,.j-footer,.ct-panel > footer) { padding:14px var(--dialog-space); gap:10px; }
:is(.ic-note,.ct-status,.mp-footnote,.jr-note):empty { display:none; }
:is(.ic-form,.ile-form) { gap:20px; }
:is(.ic-intro,.mp-step,.j-step-heading) p { line-height:1.8; }
:is(.ic-intro,.j-step-heading) { margin-bottom:20px; }
:is(.j-text-button,.j-preview-line button,.lb-chip) { min-height:44px; }
.j-text-button { padding-block:10px; }
.j-section-heading { flex-wrap:wrap; gap:8px 16px; }
.jr-picked:empty { display:none; }
.ct-status:empty { display:none; }
.ct-empty-actions { display:grid; gap:10px; margin-top:18px; }
.ct-empty-actions > button { min-height:48px; }
.im-period-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.im-period-fields button { display:grid; gap:5px; min-width:0; min-height:68px; padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--text); text-align:left; }
.im-period-fields span { color:var(--muted); font-size:11px; }
.im-period-fields strong { font-size:14px; font-variant-numeric:tabular-nums; }
.im-period-fields [aria-pressed=true] { border-color:var(--accent); }
.im-period > p { font-size:12px; line-height:1.7; color:var(--muted); margin:8px 0 0; }
.im-dates button[aria-pressed=true] { background:color-mix(in srgb,var(--accent) 16%,var(--surface)); color:var(--accent); border-radius:4px; }
.im-dates button[data-range-edge=true][aria-pressed=true] { background:var(--action-bg); color:var(--accent-text); border-radius:10px; }
.im-date-presets,.im-weekday-presets { display:flex; gap:8px; }
.im-calendar-column,.im-options-column { display:grid; gap:16px; min-width:0; align-content:start; }
.im-date-presets { margin:0; }
.im-date-presets button,.im-weekday-presets button { flex:1; min-width:0; min-height:44px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--text); font:inherit; font-size:12px; padding:8px; }
.im-weekdays { margin:0; padding:0; border:0; min-width:0; }
.im-weekdays legend { font-size:13px; font-weight:600; margin-bottom:10px; }
.im-weekday-options { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; margin-top:8px; }
.im-weekday-options button { min-width:0; min-height:44px; padding:6px 0; border:1px solid var(--line); border-radius:9px; font:inherit; font-size:12px; color:var(--muted); background:transparent; }
.im-weekdays [aria-pressed=true] { border-color:var(--accent); color:var(--accent); background:color-mix(in srgb,var(--accent) 10%,var(--surface)); }
.im-time-trigger { display:grid; grid-template-columns:1fr auto; gap:6px; min-width:0; min-height:76px; padding:12px; color:var(--text); border:1px solid var(--line); border-radius:12px; background:var(--surface); text-align:left; }
.im-time-trigger > span:first-child { grid-column:1/-1; color:var(--muted); font-size:11px; }
.im-time-trigger strong { font-size:18px; font-variant-numeric:tabular-nums; }
.im-time-trigger[aria-expanded=true] { border-color:var(--accent); }
.im-time-picker { padding:16px; border:1px solid var(--accent); border-radius:14px; background:var(--surface); display:grid; gap:14px; }
.im-time-picker > div:first-child { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.im-time-picker strong { font-size:14px; }
.im-time-picker > div:first-child > span { font-size:10px; color:var(--muted); }
.im-time-hours { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:5px; }
.im-time-minutes { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; }
.im-time-picker [data-instructor=time-part] { min-width:0; min-height:44px; padding:7px 0; border:1px solid var(--line); border-radius:9px; font:inherit; font-size:13px; background:var(--bg); color:var(--text); }
.im-time-picker [aria-pressed=true] { border-color:var(--accent); background:var(--action-bg); color:var(--accent-text); }
.im-selection-summary { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px 12px; padding:14px; border-radius:12px; background:color-mix(in srgb,var(--accent) 10%,var(--surface)); margin:0; }
.im-selection-summary strong { font-size:13px; color:var(--accent); }
.im-selection-summary span { font-size:13px; font-variant-numeric:tabular-nums; }
.im-connect-lessons { margin-top:0; }
.im-connect-lessons small { display:block; margin-top:5px; color:var(--muted); font-size:11px; font-weight:400; }
.im-slot > small { color:var(--accent); font-size:12px; }
.ld-review-example > header { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.ld-review-example > header > strong { font-size:12px; font-weight:500; color:var(--muted); }
.ld-review-score { display:inline-flex; align-items:center; gap:7px; }
.ld-review-score > span { display:inline-flex; font-size:14px; letter-spacing:1px; color:var(--accent); }
.ld-review-score .ld-star-empty { color:var(--line); }
.ld-review-score b { font-size:12px; font-variant-numeric:tabular-nums; color:var(--text); }
@media(min-width:960px) {
 #instructor-availability { grid-template-columns:minmax(0,1fr); gap:20px; align-items:start; }

 .im-availability-intro { margin-bottom:16px; }
}
@media(max-width:599px) { :root { --dialog-space:20px; } }
@media(max-width:359px) {
 :root { --dialog-space:16px; }
 .im-period-fields { gap:8px; }
 .im-period-fields button { padding:10px; }
 .im-period-fields strong { font-size:13px; }
 .im-time-picker { padding:10px; }
 .im-time-hours { gap:3px; }
}

/* Conversations share the popup frame while using the space normally occupied by navigation. */
#contact-preview[open] { position:fixed; inset:var(--contact-top,0px) 0 auto; width:100%; max-width:none; height:var(--contact-height,100dvh); max-height:none; margin:0; padding:0; border:0; border-radius:0; background:transparent; overflow:hidden; }
#contact-preview > .ct-panel { position:absolute; inset:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom)); max-width:580px; max-height:none; height:auto; min-height:0; margin:0 auto; border:1px solid var(--line); border-radius:26px; background:var(--bg); overflow:hidden; }
.ct-scroll { flex:1; }
.ct-panel > header h2 { min-width:0; line-height:1.5; overflow-wrap:anywhere; }
.ct-panel > header button { flex:none; }
@media(min-width:960px) {
 #contact-preview > .ct-panel { top:50%; bottom:auto; transform:translateY(-50%); height:min(780px,calc(var(--contact-height,100dvh) - 48px)); }
}
@media(max-height:560px) and (min-width:960px) {
 #contact-preview > .ct-panel { top:12px; bottom:12px; height:auto; transform:none; }
}

@media(max-height:560px) {
 :is(.ic-header,.mp-dialog-head,.j-dialog-header,.ct-panel > header),:is(.ic-footer,.mp-footer,.j-footer,.ct-panel > footer) { padding-block:8px; }
 :is(.ic-scroll,.mp-scroll,.j-scroll,.ct-scroll) { padding-block:16px; }
}

/* Shared hit areas for compact controls; calendar dates retain their seven-column grid. */
.j-back { width:44px; height:44px; flex:none; }
#lesson-flow :is(.lc-back,.icon-button) { min-width:44px; min-height:44px; height:44px; flex:none; }
#modal .modal-top .icon-button { width:44px; height:44px; min-width:44px; min-height:44px; flex:none; }
:is(.j-date-options,.j-atlas-filters,.j-photo-options,.j-scenarios) button,
:is(.lc-regions,.lc-options,.lc-date-choices) button,
.lb-seasons .lb-chip { min-height:44px; }
.j-text-button { min-width:44px; }
.jr-empty-copy { margin:0; color:var(--muted); font-size:13px; line-height:1.75; }
.j-field > :is(input,select,textarea) { display:block; box-sizing:border-box; width:100%; min-height:48px; margin-top:10px; padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--text); font:inherit; font-size:16px; font-weight:400; }
#lb-seasons .lb-chip { min-height:44px; }
.jr-photo-picker label { position:relative; min-height:112px; justify-content:center; padding:8px; border-radius:12px; }
.jr-photo-picker input[type=file] { position:absolute; inset:0; width:100%; height:100%; opacity:0; margin:0; cursor:pointer; }
.jr-photo-picker label:focus-within { outline:2px solid var(--accent); outline-offset:3px; }
:is(#modal-content,.ic-field) input[type=file]::file-selector-button { min-height:44px; padding:10px 14px; margin-right:10px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--text); font:inherit; }
.jr-priority-lessons { margin-block:24px; }
:is(.ic-scroll,.mp-scroll,.j-scroll,.ct-scroll,.lc-scroll,#modal-content) { overflow-wrap:anywhere; }
:is(.ic-field,.j-field,.mp-field) :is(input,textarea,select) { min-width:0; }
#lesson-flow .lf-steps { display:grid; grid-template-columns:repeat(5,minmax(44px,1fr)); gap:3px; }
#lesson-flow .lf-steps button { display:flex; flex-direction:column; justify-content:center; gap:1px; min-width:44px; min-height:44px; padding:4px 2px; font-size:10px; line-height:15px; border-radius:8px; }
#lesson-flow .lf-steps button:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
#lesson-flow .lf-search :is(input,button) { min-height:44px; height:44px; }
@media(max-width:599px) {
 :is(.ic-field,.j-field,.mp-field) :is(input,textarea,select),#contact-body { font-size:16px; }
 .im-week { grid-template-columns:repeat(7,minmax(44px,1fr)); overflow-x:auto; padding-bottom:4px; }
}
@media(max-width:359px) {
 .im-weekday-options { grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
 .j-page-head { align-items:flex-start; gap:12px; flex-wrap:wrap; }
}

/* A conversation keeps the current messages above a stable composer. */
.ct-compose { flex:none; display:grid; gap:8px; padding:12px var(--dialog-space); border-top:1px solid var(--line); background:var(--bg); max-height:min(48%,300px); overflow-y:auto; overscroll-behavior:contain; }
.ct-compose .ic-field { gap:6px; font-size:12px; }
.ct-compose #contact-body { min-height:56px; height:68px; max-height:112px; padding:10px 12px; font-size:16px; resize:vertical; }
.ct-compose .ct-quick { display:flex; flex-wrap:wrap; gap:6px; margin:0; }
.ct-compose .ct-quick button { min-height:44px; padding:8px 10px; }
.ct-compose > .ic-primary { min-height:48px; }
.ct-compose .ct-status { margin:0; color:var(--accent); font-size:12px; line-height:1.6; }
.ct-panel > .ct-footer { display:flex; justify-content:flex-end; padding:8px var(--dialog-space); }
.ct-panel > .ct-footer .ic-secondary { width:auto; min-height:44px; padding:8px 12px; font-size:12px; }
.ct-faq-inline { margin:16px 0; border:1px solid var(--line); border-radius:12px; padding:0 14px; }
.ct-faq-inline > summary { display:flex; align-items:center; min-height:48px; cursor:pointer; font-size:13px; color:var(--text); }
.ct-faq-inline .ls-faq { margin:0 0 14px; }
.ct-thread { scroll-margin-bottom:12px; }
.ct-thread [data-contact-message] { scroll-margin-block:12px; }

/* The same audience and guardian choices follow the request into booking. */
.cs-audience,.cs-kids-ages { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.cs-audience button,.cs-kids-ages button,.cs-guardian { min-height:48px; min-width:44px; padding:10px 12px; border:1px solid var(--line); border-radius:11px; background:var(--surface); color:var(--text); font:inherit; font-size:13px; }
.cs-audience button,.cs-kids-ages button { flex:1; }
:is(.cs-audience,.cs-kids-ages) [aria-pressed=true],.cs-guardian[aria-pressed=true] { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 12%,var(--surface)); }
.cs-guardian { display:flex; align-items:center; gap:10px; width:100%; text-align:left; line-height:1.6; }
.cs-guardian input { width:20px; height:20px; flex:none; }
.ls-profile-source,.ls-request-source { margin:12px 0; padding:12px 14px; border-left:3px solid var(--accent); border-radius:4px 10px 10px 4px; background:color-mix(in srgb,var(--accent) 7%,var(--surface)); color:var(--text); font-size:12px; line-height:1.7; }

/* A lesson keeps a single clear detail action, with its availability state beside it. */
.im-location-settings { display:grid; gap:14px; padding:20px; border:1px solid var(--line); border-radius:18px; background:var(--surface); }
.im-location-settings h3 { margin:0 0 8px; font-size:16px; }
.im-location-settings p { margin:0; color:var(--text); font-size:14px; line-height:1.7; }
.im-location-settings small { display:block; margin-top:6px; color:var(--muted); font-size:12px; line-height:1.7; }
.im-location-settings button { display:flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:12px 16px; border:1px solid var(--line); border-radius:12px; background:var(--bg); color:var(--text); font:inherit; font-size:13px; }
article.iw-lesson { display:block; padding:0; overflow:hidden; margin-bottom:12px; }
.iw-lesson-open { display:grid; justify-items:start; gap:10px; width:100%; padding:20px; border:0; background:transparent; color:var(--text); text-align:left; font:inherit; }
.iw-lesson-open > strong { font-size:18px; line-height:1.5; overflow-wrap:anywhere; }
.iw-lesson-open > span:not(.iw-tag) { color:var(--muted); font-size:12px; line-height:1.7; }
.iw-lesson-open > b { font-size:23px; }
.iw-lesson-open > small { display:flex; align-items:center; gap:4px; color:var(--accent); font-size:12px; }
.iw-publication-status { display:block; color:var(--accent); font-size:12px; line-height:1.7; }
.iw-archived .iw-publication-status { color:var(--muted); }
.iw-product-actions { display:flex; flex-wrap:wrap; gap:8px; padding:0 20px 16px; }
.iw-product-actions button { display:flex; align-items:center; justify-content:center; gap:6px; min-width:44px; min-height:44px; flex:1; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--text); font:inherit; font-size:12px; }

/* Each selected challenge owns its own date and place. */
.jr-task-schedule { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:4px 12px; margin:12px 0; padding-top:8px; border-top:1px solid var(--line); }
.jr-task-schedule > span { min-width:0; color:var(--muted); font-size:12px; line-height:1.7; overflow-wrap:anywhere; }
.jr-task-schedule .j-text-button { flex:none; }
.jr-booking-support { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.jr-booking-support button { flex:1; min-width:44px; min-height:44px; padding:10px 12px; border:1px solid var(--line); border-radius:11px; background:transparent; color:var(--text); font:inherit; font-size:13px; }
.jr-inner footer .jr-card-title { font-size:4.8cqw; line-height:1.385; white-space:normal; overflow:hidden; max-height:4.2em; }
.jr-card-title > span { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media(min-width:700px) {
 .im-location-settings { grid-template-columns:minmax(0,1fr) auto; align-items:center; }
}
@media(max-height:560px) {
 .ct-compose { padding-block:8px; max-height:48%; gap:6px; }
 .ct-compose #contact-body { min-height:44px; height:44px; }
 .ct-panel > .ct-footer { padding-block:4px; }
}
@media(max-width:359px) {
 .im-location-settings,.iw-lesson-open { padding:16px; }
 .iw-product-actions { padding:0 16px 16px; }
 .ct-compose { padding-inline:12px; }
 .cs-audience,.cs-kids-ages { gap:6px; }
}
/* Keep nested request fieldsets and per-person choices aligned with the existing form. */
fieldset.cs-audience { display:block; margin:0 0 20px; }
.cs-audience .cs-options { width:100%; }
.cs-kids-ages { display:grid; gap:12px; }
.cs-kids-ages > section { display:grid; gap:12px; min-width:0; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.cs-kids-ages > section > strong { font-size:13px; }
.cs-kids-ages .cs-options { display:flex; flex-wrap:wrap; gap:8px; }
.ct-compose-actions { display:flex; gap:8px; }
.ct-compose-actions > button { flex:1; min-width:0; min-height:48px; font-size:13px; }
.ct-intent-label,.ct-thread-empty { margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.ct-booking-agreement { padding:0 14px; border:1px solid var(--line); border-radius:12px; margin:16px 0; }
.ct-booking-agreement > summary { display:flex; align-items:center; min-height:48px; cursor:pointer; font-size:13px; }
.ct-booking-agreement > p,.ct-faq-inline > p { color:var(--muted); font-size:12px; line-height:1.7; overflow-wrap:anywhere; }
.iw-publication-status { margin:0 20px 16px; }
@media(max-width:359px) { .iw-publication-status { margin-inline:16px; } }
/* visualViewport sets ct-compact, including keyboards that do not resize CSS media queries. */
#contact-preview.ct-compact:has(#contact-body:focus) .ct-footer,
#contact-preview.ct-compact:has(#contact-body:focus) .ct-quick,
#contact-preview.ct-compact:has(#contact-body:focus) .ct-intent-label { display:none; }
#contact-preview.ct-compact:has(#contact-body:focus) .ct-scroll { min-height:64px; padding-block:8px; }
#contact-preview.ct-compact:has(#contact-body:focus) .ct-compose { max-height:calc(var(--contact-height,100dvh) - 152px); padding-block:8px; gap:6px; }
#contact-preview.ct-compact:has(#contact-body:focus) .ct-compose .ic-field { font-size:0; gap:0; }
#contact-preview.ct-compact:has(#contact-body:focus) #contact-body { min-height:44px; height:44px; }
#contact-preview.ct-compact:has(#contact-body:focus) .ct-compose-actions > button { min-height:44px; }

/* Keep a horizontally scrolling week from widening every dashboard card. */
.iw-dashboard { grid-template-columns:minmax(0,1fr); }
.iw-dashboard > * { min-width:0; }
.im-week { min-width:0; max-width:100%; }