/* Layout refinements and spacing. Every selector excludes the protected Layout 1. */
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]:not(.is-hidden){--l24-space:1rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]>.page-hero{margin-bottom:1.2rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] .page-hero h2{font-size:1.55rem;line-height:1.3;letter-spacing:-.025em}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] :is(.panel-header,.staff-section-heading){gap:.8rem;flex-wrap:wrap}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] :is(.panel,.staff-panel,.member-card,.event-card,.p19-settings-card){min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] .table-wrap{max-width:100%;overflow:auto;overscroll-behavior-x:contain;scrollbar-width:thin;border-radius:.8rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] .empty-state{padding:1.4rem 1rem;min-height:7rem}

/* Layout 2: independent columns. A long tournament list no longer stretches the other columns. */
@media(min-width:1250px){
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order){grid-template-columns:12rem minmax(0,1fr) 16rem!important;grid-template-areas:"welcome welcome welcome" "attention attention attention" "numbers main aside"!important;gap:1.1rem!important;align-items:start}
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.staff-stats{grid-area:numbers!important;grid-template-columns:1fr!important;gap:.75rem;border:0;background:transparent;padding:0;height:auto;align-self:start}
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.staff-dashboard-main{display:grid!important;grid-area:main!important;grid-template-columns:1fr!important;gap:1.1rem;min-width:0;align-content:start}
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.staff-dashboard-aside{display:grid!important;grid-area:aside!important;grid-template-columns:1fr!important;gap:1rem;min-width:0;align-content:start}
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>:is(.staff-dashboard-main,.staff-dashboard-aside)>*{grid-area:auto!important;grid-column:auto!important;min-width:0}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-stat{min-height:6.6rem;border:1px solid var(--club-border);border-radius:.9rem;background:var(--surface,#fff);padding:.85rem .75rem}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-stat-content{min-width:0}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-stat-content strong{font-size:.76rem;line-height:1.4;letter-spacing:0}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-stat-arrow{display:none}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-birthdays{display:grid;grid-template-columns:1fr;gap:0}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-birthday-row{display:grid;grid-template-columns:2.5rem minmax(0,1fr);padding:.8rem 0;border-bottom:1px solid var(--club-border)}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-birthday-countdown{grid-column:2;font-size:.7rem}
}
@media(min-width:1101px) and (max-width:1249px){
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order){grid-template-columns:minmax(0,1fr) 16rem!important;grid-template-areas:"welcome welcome" "attention attention" "numbers numbers" "main aside"!important}
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.staff-dashboard-main{display:grid!important;grid-area:main!important;gap:1rem;grid-template-columns:1fr!important}
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.staff-dashboard-aside{display:grid!important;grid-area:aside!important;gap:1rem;grid-template-columns:1fr!important}
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>:is(.staff-dashboard-main,.staff-dashboard-aside)>*{grid-area:auto!important;grid-column:auto!important}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-birthdays{grid-template-columns:1fr}
}
html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-panel{border-radius:1rem;padding:1rem!important}
html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-event-card{gap:.8rem;padding:1rem;border-radius:.85rem}
html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-event-title{font-size:1rem;line-height:1.45}
html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-event-info{gap:.4rem}
html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-section-heading .staff-create-training{width:auto;margin:0;flex-shrink:0}
html[data-app-layout="compact"] #view-dashboard[data-lv-page] .role-summary-grid>button{min-width:0;padding:.75rem .85rem}

/* Layout 4: more balanced modules and a sensible number of cards for the available records. */
html[data-app-layout="focus"] #view-dashboard[data-lv-page] .staff-stats{border:0;background:transparent;gap:.9rem!important}
html[data-app-layout="focus"] #view-dashboard[data-lv-page] .staff-stat{border:1px solid var(--club-border);border-radius:1rem;padding:1.1rem;background:var(--surface,#fff)}
html[data-app-layout="focus"] #view-dashboard[data-lv-page] .staff-panel{padding:1.2rem!important;border-radius:1.1rem}
html[data-app-layout="focus"] #view-dashboard[data-lv-page] .staff-tournaments-panel .staff-event-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr))!important;gap:1rem}
html[data-app-layout="focus"] #view-dashboard[data-lv-page] .staff-event-card{padding:1rem;min-width:0}
html[data-app-layout="focus"] #view-dashboard[data-lv-page] .staff-event-title{font-size:1rem;line-height:1.45}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-response{min-height:44px}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-birthday-row :is(strong,small){overflow-wrap:anywhere}

/* Member lists: cards align their actions without forcing text outside the card. */
html[data-app-layout="compact"] #view-members[data-lv-page] .member-card{display:flex!important;flex-direction:column;align-items:stretch;padding:1.2rem!important;gap:.8rem}
html[data-app-layout="compact"] #view-members[data-lv-page] .member-card-diary{margin-top:auto;padding-top:.8rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-members[data-lv-page] :is(.member-card-identity,.member-card-info,.member-card-basic){min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card-identity h3{line-height:1.4;overflow-wrap:anywhere}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card-diary{gap:.6rem;min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card-diary-label{min-width:0;white-space:normal}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card-diary-state{flex-shrink:0;min-height:36px;display:inline-flex;align-items:center}

/* Forms: no negative margins or horizontal scrolling; the header remains above the scrollable content. */
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-modal]{display:flex;flex-direction:column;min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-modal]>.modal-head{flex:none;padding:1rem 1.2rem;background:var(--surface,#fff)}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-modal]>.modal-body{min-height:0;overflow:auto;overscroll-behavior:contain;scroll-padding:1rem 0 6rem;padding:1.1rem;align-content:start}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-form]{min-width:0;max-width:100%}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-form] :is(.form-field,fieldset,.member-choice-group,.member-family-contact){min-width:0;max-width:100%}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-form] :is(.input,.select,.textarea){min-width:0;max-width:100%;font-size:.875rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-form] .form-field>label{font-size:.76rem;line-height:1.5}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-form] textarea{resize:vertical;line-height:1.6}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form>:is(.member-editor-overview,.member-editor-tabs,.member-form-actions){margin-inline:0!important;width:auto;min-width:0;max-width:100%;box-sizing:border-box}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form>.member-editor-overview{padding:.9rem 1rem;border:1px solid var(--club-border);border-radius:.9rem;background:var(--club-subtle-gradient)}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form>.member-editor-tabs{padding:.5rem;border:1px solid var(--club-border);border-radius:.9rem;background:var(--surface,#fff)}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form>.member-form-actions{padding:.85rem 1rem!important;margin-block:.4rem 0!important;gap:.7rem;border:1px solid var(--club-border);border-radius:.9rem;background:var(--surface,#fff)!important;z-index:6}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form .member-form-save-hint{font-size:.72rem;line-height:1.5}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form :is(.member-choice-chip-button,.member-choice-chip span){min-height:42px;white-space:normal;line-height:1.35}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form [data-member-form-error]{grid-column:1/-1;overflow-wrap:anywhere}
html[data-app-layout="compact"] #modal-root [data-lv-modal="members"]{width:min(65rem,calc(100vw - 2rem))!important}
html[data-app-layout="compact"] #modal-root #member-form{display:grid;gap:.9rem}
html[data-app-layout="compact"] #modal-root #member-form .member-editor-panels{padding-top:0}
html[data-app-layout="compact"] #modal-root #member-form .member-editor-tab{font-size:.8rem;min-height:44px}

/* Layout 4 member workspace: one card per subject, with a small photograph rail. */
html[data-app-layout="focus"] #modal-root [data-lv-modal="members"]{width:min(94rem,calc(100vw - 2rem))!important}
html[data-app-layout="focus"] #modal-root #member-form{gap:1rem}
html[data-app-layout="focus"] #modal-root #member-form>.member-editor-tabs{position:sticky;top:0;z-index:5;overflow-x:auto;box-shadow:0 4px 12px rgb(23 32 51 / 4%)}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-tab{font-size:.8rem;min-height:44px}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-tab[aria-current="location"]{background:var(--club-selected-gradient);border-color:var(--club-control-border);color:var(--club-text)}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem;padding-top:0}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel{display:grid;align-content:start;gap:1rem;padding:0;border:0;background:transparent;scroll-margin-block:5rem}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]{grid-column:1/-1;grid-template-columns:14rem minmax(0,1fr);grid-template-areas:"photo personal" "photo contact";gap:1rem}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-profile-grid{display:contents}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-profile-grid>.member-photo-section{grid-area:photo;align-self:start;height:auto}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-profile-grid>.member-form-section:not(.member-photo-section){grid-area:personal}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]>.member-form-section{grid-area:contact}
html[data-app-layout="focus"] #modal-root #member-form .member-form-section{padding:1rem 1.1rem;border:1px solid var(--club-border);border-radius:1rem;background:var(--surface,#fff);box-shadow:none;margin:0}
html[data-app-layout="focus"] #modal-root #member-form .member-form-section-head{margin-bottom:.85rem;padding-bottom:.7rem}
html[data-app-layout="focus"] #modal-root #member-form .member-form-section-head h3{font-size:.96rem}
html[data-app-layout="focus"] #modal-root #member-form .member-form-section-head p{font-size:.74rem;line-height:1.55}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]>.member-form-section .member-form-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
html[data-app-layout="focus"] #modal-root #member-form .member-photo-editor{display:grid;grid-template-columns:1fr;gap:.8rem;text-align:left}
html[data-app-layout="focus"] #modal-root #member-form .member-photo-preview{width:8rem;height:8rem;margin:0 auto;border-radius:1rem}
html[data-app-layout="focus"] #modal-root #member-form .member-photo-controls{min-width:0}
html[data-app-layout="focus"] #modal-root #member-form .member-photo-file{width:100%;font-size:.72rem;padding:.45rem}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="records"]{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="records"]>.member-form-section:only-child{grid-column:1/-1}
html[data-app-layout="focus"] #modal-root #member-form .member-form-actions{position:sticky;bottom:0;grid-column:1/-1;box-shadow:0 -6px 18px rgb(23 32 51 / 5%)}

/* Shared layout-specific repairs in planner, calendar, tables and catalogs. */
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-training[data-lv-page] .training-week-day{min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-training[data-lv-page] .training-week-day-top{flex-wrap:wrap;gap:.35rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-training[data-lv-page] :is(.training-week-day-main,.training-week-unit,.training-week-unit>span){min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-agenda-copy{min-width:0;overflow-wrap:anywhere}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-filter-row{gap:.6rem;flex-wrap:wrap}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-tournaments[data-lv-page] :is(.tournament-card,.tournament-card h3,.tournament-location){min-width:0;overflow-wrap:anywhere}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-communication[data-lv-page] .communication-card-heading{flex-wrap:wrap;align-items:start}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-communication[data-lv-page] .communication-card-heading>strong{min-width:0;overflow-wrap:anywhere}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-settings[data-lv-page] :is(.p19-settings-card,.p19-folder-body,.p19-form-grid){min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-settings[data-lv-page] .p19-save-bar{flex-wrap:wrap;gap:.7rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-product-card{display:flex!important;flex-direction:column;align-items:stretch;padding:0;min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-product-card>.product-image{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;width:calc(100% - 2rem);height:13rem;margin:1rem;padding:.7rem;background:var(--club-subtle-gradient)}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-product-card>.product-image>img{display:block;min-width:0;min-height:0;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-product-card>.product-body{padding:.2rem 1rem 1rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-product-card>.merch-product-controls{margin-top:auto}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-product-card>.clubwear-product-management{padding:.8rem 1rem}
html[data-app-layout="focus"] #view-clubwear[data-lv-page] .merch-product-card>.product-image{height:11rem}
html[data-app-layout="focus"] #view-clubwear[data-lv-page] .merch-product-card .merch-choices{grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-app-layout="focus"] #view-clubwear[data-lv-page] .merch-choices>label:has([name="merch-quantity"]){grid-column:1/-1;max-width:6rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-purchase-row{flex-wrap:wrap;gap:.7rem}

@media(max-width:1100px){
 html[data-app-layout="focus"] #modal-root #member-form .member-editor-panels{grid-template-columns:1fr}
 html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="records"]{grid-template-columns:1fr}
 html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]{grid-template-columns:12rem minmax(0,1fr)}
 html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]>.member-form-section .member-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] .page-hero h2{font-size:1.3rem}
 html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-modal]>.modal-body{padding:.8rem;scroll-padding-bottom:7rem}
 html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-form] :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){font-size:16px}
 html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form>.member-editor-overview{padding:.7rem .8rem}
 html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form>.member-form-actions{padding:.75rem!important;flex-wrap:wrap}
 html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form .member-form-save-hint{flex-basis:100%;margin:0}
 html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form .member-form-actions>.button{flex:1;min-height:44px}
 html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]{grid-template-columns:1fr;grid-template-areas:"photo" "personal" "contact"}
 html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]>.member-form-section .member-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 html[data-app-layout="focus"] #modal-root #member-form .member-photo-editor{grid-template-columns:7rem minmax(0,1fr);align-items:start}
 html[data-app-layout="focus"] #modal-root #member-form .member-photo-preview{width:7rem;height:7rem;margin:0}
 html[data-app-layout="focus"] #modal-root #member-form>.member-editor-tabs{display:flex;flex-wrap:nowrap;overflow:auto}
 html[data-app-layout="focus"] #modal-root #member-form .member-editor-tab{flex:none;min-width:9rem;white-space:nowrap}
 html[data-app-layout="focus"] #view-dashboard[data-lv-page] .staff-dashboard-aside{grid-template-columns:1fr}
}
@media(max-width:480px){
 html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-modal] .form-grid,html[data-app-layout="focus"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]>.member-form-section .member-form-grid{grid-template-columns:1fr!important}
 html[data-app-layout="focus"] #modal-root #member-form .member-form-section{padding:.85rem}
 html[data-app-layout="focus"] #modal-root #member-form .member-photo-editor{grid-template-columns:1fr}
 html[data-app-layout="focus"] #modal-root #member-form .member-photo-preview{margin-inline:auto}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-section-heading .staff-create-training{width:100%}
}

@media(min-width:1250px){
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-stat-content b{font-size:1.65rem;line-height:1.2}
 html[data-app-layout="compact"] #view-dashboard[data-lv-page] .staff-stat-icon{width:2.1rem;height:2.1rem;flex-basis:2.1rem}
}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root #member-form .member-photo-file::file-selector-button{padding:.4rem .5rem;margin-right:.4rem;border:1px solid var(--club-border);border-radius:.5rem;background:var(--club-subtle-gradient);color:var(--club-text);font:inherit;cursor:pointer}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-lv-form] :is(.input:not([type="checkbox"]):not([type="radio"]),.select){min-height:44px}

/* Product editor: photograph and pricing share a rail instead of leaving an empty half-row. */
html[data-app-layout="focus"] #modal-root #wear-product-form{grid-template-columns:minmax(15rem,.85fr) minmax(0,1.15fr);grid-template-areas:"photo details" "pricing details" "visibility visibility" "actions actions";gap:1rem}
html[data-app-layout="focus"] #modal-root #wear-product-form>.wear-photo-editor{grid-area:photo;margin:0}
html[data-app-layout="focus"] #modal-root #wear-product-form>.wear-editor-grid{grid-area:details}
html[data-app-layout="focus"] #modal-root #wear-product-form>.wear-product-prices{grid-area:pricing;min-width:0}
html[data-app-layout="focus"] #modal-root #wear-product-form>.wear-editor-active{grid-area:visibility}
html[data-app-layout="focus"] #modal-root #wear-product-form>.wear-editor-actions{grid-area:actions}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-wear-editor]>.wear-editor-actions{display:flex;justify-content:flex-end;gap:.7rem;align-items:center;box-shadow:none}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-wear-editor]>.wear-editor-actions .button{flex:0 1 auto;min-width:7rem;min-height:44px}

/* Preserve fieldsets and disabled import locks, while removing the browser's default inset frame. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #tournament-form>fieldset[data-editor-lockable]{display:block;min-width:0;margin:0;padding:0;border:0;grid-column:1/-1}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #tournament-form>fieldset[data-editor-lockable]>.tournament-editor-section{width:100%;margin:0}
html[data-app-layout="focus"] #modal-root #camp-form>.camp-fields{border:0;padding:0;margin:0;gap:1rem}
html[data-app-layout="focus"] #modal-root #camp-form>.camp-fields>.form-grid,html[data-app-layout="focus"] #modal-root #camp-form>.camp-fields>.form-field{min-width:0;padding:1rem;border:1px solid var(--club-border);border-radius:1rem;background:var(--surface,#fff)}
html[data-app-layout="focus"] #modal-root #camp-form .form-grid>.form-field:has([name="povolene_kategorie_json"]){grid-column:1/-1}
html[data-app-layout="focus"] #modal-root #camp-form>.camp-fields>p{grid-column:1/-1;margin:0;color:var(--muted);font-size:.75rem;line-height:1.6}
html[data-app-layout="focus"] #modal-root #communication-form .form-field:has(#communication-text) textarea{min-height:19rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-newsletter[data-lv-page] .nl-editor-actions{flex-wrap:wrap;gap:.8rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-newsletter[data-lv-page] .nl-editor-panel :is(textarea,.form-help){line-height:1.6}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-settings[data-lv-page] .p19-settings-card .form-field label{font-size:.76rem;line-height:1.45}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-settings[data-lv-page] .p19-settings-card :is(.input,.select,.textarea){min-width:0;max-width:100%;font-size:.875rem}
@media(max-width:1000px){
 html[data-app-layout="focus"] #modal-root #wear-product-form{grid-template-columns:1fr;grid-template-areas:"photo" "details" "pricing" "visibility" "actions"}
}
@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="focus"]) #modal-root [data-wear-editor]>.wear-editor-actions .button{flex:1}
 html[data-app-layout="focus"] #modal-root #communication-form .form-field:has(#communication-text) textarea{min-height:13rem}
}
@media(min-width:1250px){
 html[data-app-layout="compact"] body:not(.layout-edit-mode) #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.staff-stats{position:sticky;top:1rem}
}
html[data-app-layout="focus"] #modal-root #wear-product-form{grid-template-areas:"photo details" "pricing details" "visibility visibility" "feedback feedback" "actions actions"}
html[data-app-layout="focus"] #modal-root #wear-product-form>.wear-editor-error{grid-area:feedback}
@media(max-width:1000px){
 html[data-app-layout="focus"] #modal-root #wear-product-form{grid-template-areas:"photo" "details" "pricing" "visibility" "feedback" "actions"}
}

/* Consistent spacing for Layouts 2–4. Layout 1 remains outside this scope. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]:not(.is-hidden) :is(.panel,.staff-panel,.p19-settings-card){padding:.85rem!important}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]:not(.is-hidden) :is(.grid,.staff-event-list,.td-content,.td-week-layout,.camp-list,.merch-order-list){gap:.7rem!important}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]:not(.is-hidden) :is(.panel-header,.staff-section-heading){margin-bottom:.65rem;padding-bottom:.55rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]:not(.is-hidden) .empty-state{min-height:5.5rem;padding:1rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]>.page-hero{margin-bottom:.8rem;padding-block:.7rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-event-card{padding:.75rem;gap:.65rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-event-list{margin-top:.65rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-stats{height:auto!important}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .role-summary-grid>button{min-height:0;padding:.65rem .75rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-birthday-row{padding:.55rem 0}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card{padding:.8rem!important;gap:.5rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card-info{margin-block:.45rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card-diary{padding-top:.5rem;margin-top:.45rem}
html[data-app-layout="compact"] #view-members[data-lv-page] .member-card-avatar{width:3rem;height:3rem;flex-basis:3rem}
html[data-app-layout="cards"] #view-attendance[data-lv-page] .attendance-row--simple{min-height:3.4rem;padding:.5rem .7rem}
html[data-app-layout="compact"] #view-attendance[data-lv-page] .attendance-row--simple{min-height:4rem;padding:.6rem}
html[data-app-layout="focus"] #view-attendance[data-lv-page] .attendance-row--simple{min-height:0;padding:.7rem .6rem;gap:.4rem}
html[data-app-layout="focus"] #view-attendance[data-lv-page] .attendance-row--simple>.avatar{width:3rem;height:3rem;flex-basis:3rem}
html:is([data-app-layout="compact"],[data-app-layout="focus"]) #view-training[data-lv-page] .training-week-day{min-height:7rem;padding:.65rem}
html[data-app-layout="cards"] #view-training[data-lv-page] .training-week-day{min-height:0;padding:.65rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-cell{min-height:5rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-program-day-head{padding-block:.5rem;margin-block:.5rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #member-form>:is(.member-editor-overview,.member-editor-tabs,.member-form-actions){margin-inline:0!important;max-width:100%;box-sizing:border-box}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-form] :is(.form-grid,.wear-editor-grid,.member-editor-panels){gap:.7rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-form]>[data-lv-part]{padding:.8rem;margin-bottom:.6rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #member-form .member-form-section{padding:.85rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-detail-area="numbers"] .stat-card{min-height:0;padding:.7rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root .member-detail-body .stat-highlight{padding:.55rem .65rem}

/* Layout 3 drawer fits its actual contents; a short step no longer reserves a full screen. */
html[data-app-layout="cards"] #modal-root .modal-backdrop:has(>[data-lv-modal]){place-items:start end}
html[data-app-layout="cards"] #modal-root [data-lv-modal]{height:auto!important;max-height:calc(100dvh - 1rem);margin-block:.5rem;width:min(68rem,94vw)!important}
html[data-app-layout="cards"] #modal-root [data-lv-modal]>.modal-head{padding:.85rem 1rem}
html[data-app-layout="cards"] #modal-root [data-lv-modal]>.modal-body{min-height:0;overflow:auto;padding:.8rem;align-content:start;flex:0 1 auto}
html[data-app-layout="cards"] #modal-root [data-lv-stepper] [data-lv-step-current="true"]{min-height:0}
html[data-app-layout="cards"] #modal-root .lv-step-controls{margin-top:.5rem;padding:.65rem 0 .4rem;gap:.5rem}
html[data-app-layout="cards"] #modal-root .lv-step-controls+.modal-actions{border-top:0;margin-top:0;padding-top:.3rem}
html[data-app-layout="cards"] #modal-root [data-lv-form-body]:has(>.lv-form-navigation){gap:.9rem;grid-template-columns:10.5rem minmax(0,1fr)}
html[data-app-layout="cards"] #modal-root .lv-form-navigation{gap:.35rem}
html[data-app-layout="cards"] #modal-root .lv-form-navigation .button{padding:.6rem .7rem}
@media(max-width:1100px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-tournaments-panel .staff-event-list{grid-template-columns:1fr!important}
}
@media(max-width:760px){
 html[data-app-layout="cards"] #modal-root [data-lv-modal]{width:100vw!important;max-height:100dvh;margin:0}
 html[data-app-layout="cards"] #modal-root [data-lv-form-body]:has(>.lv-form-navigation){display:block}
 html[data-app-layout="cards"] #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.role-summary{order:1!important}
 html[data-app-layout="cards"] #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.staff-stats{order:2!important}
 html[data-app-layout="cards"] #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.staff-dashboard-main{order:3!important}
 html[data-app-layout="cards"] #view-dashboard[data-lv-page] .staff-dashboard:not(.layout-has-order)>.staff-dashboard-aside{order:4!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root .lv-form-navigation .button{min-height:44px}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-cell{min-height:3.8rem}
}

@media(min-width:1101px){
 html[data-app-layout="cards"] #view-dashboard[data-lv-page] .staff-training-panel .staff-event-card{grid-template-columns:minmax(0,1fr) 11rem!important}
}

html[data-app-layout="cards"] #modal-root [data-lv-stepper]>[data-lv-part]{border-bottom:0}
/* Fields align at their labels instead of stretching to match a neighbouring chip group. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-form] .form-grid{align-items:start}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-form] .form-field{align-content:start}
@media(min-width:1001px){
 html[data-app-layout="focus"] #modal-root #phase17-diary-form{grid-template-areas:"intro intro" "activity readiness" "exercises moods" "attachment note" "actions actions" "feedback feedback";align-items:start}
 html[data-app-layout="focus"] #modal-root #phase17-diary-form>.training-config-intro{grid-area:intro}
 html[data-app-layout="focus"] #modal-root #phase17-diary-form>.form-grid{grid-area:activity}
 html[data-app-layout="focus"] #modal-root #phase17-diary-form>.td-readiness{grid-area:readiness}
 html[data-app-layout="focus"] #modal-root #phase17-diary-form>.td-exercise-builder{grid-area:exercises}
 html[data-app-layout="focus"] #modal-root #phase17-diary-form>.td-mood-fields{grid-area:moods}
 html[data-app-layout="focus"] #modal-root #phase17-diary-form>[data-phase17-diary-attachment]{grid-area:attachment}
 html[data-app-layout="focus"] #modal-root #phase17-diary-form>.form-field:has(#diary-note){grid-area:note}
 html[data-app-layout="focus"] #modal-root #phase17-diary-form>.modal-actions{grid-area:actions}
 html[data-app-layout="focus"] #modal-root #phase17-diary-form>[data-phase17-diary-error]{grid-area:feedback}
}

/* A collapsed search needs one surface, not a padded card inside another card. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-members[data-lv-page]>.member-filter-host{padding:0!important;border:0;background:transparent;box-shadow:none}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-members[data-lv-page] .design-filter-panel.is-collapsed{margin:0;padding:.45rem;gap:.4rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-product-card>.product-image:not(:has(img)){height:7rem!important}

@media(max-width:760px){
 /* Compact the page chrome while preserving complete headings and actions. */
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]>.page-hero{padding-block:0!important;margin-bottom:.65rem!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]>:is(.panel,.grid,.training-week-panel)[style*="margin-top"]{margin-top:.65rem!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page]>.page-hero .hero-actions{margin-top:.55rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-stat{min-height:0;padding:.6rem;gap:.45rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-stat-content{gap:.1rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-stat-content strong{font-size:.72rem;line-height:1.35}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-stat-content b{font-size:1.2rem;line-height:1.3}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-stat-content small{font-size:.68rem;line-height:1.35}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-stat-icon{width:1.5rem;height:1.5rem;flex-basis:1.5rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-stats{gap:.5rem!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .staff-event-card{padding:.6rem;gap:.5rem}

 /* Planner content already has a card: remove the second layer of internal gutters. */
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-training[data-lv-page] .training-week-panel{padding:.75rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen #view-training[data-lv-page] .training-week-board>.training-week-day{padding:.65rem;min-height:0}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-training[data-lv-page] .training-week-day-top{padding:0;min-height:44px;flex-wrap:wrap;gap:.3rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-training[data-lv-page] .training-week-day-main{padding:.2rem 0}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-training[data-lv-page] .training-week-day-main>strong{margin:.15rem 0 .4rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-training[data-lv-page] .training-week-units{padding:.35rem 0 0}

 /* Three counters stay together; message templates remain directly reachable. */
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-communication[data-lv-page]>.panel>.grid.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.4rem!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-communication[data-lv-page]>.panel>.grid.grid-3>.stat-card{min-width:0;min-height:0;padding:.5rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-communication[data-lv-page]>.panel>.grid.grid-3>.stat-card :is(.label,small){font-size:.7rem;line-height:1.4;overflow-wrap:anywhere}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-communication[data-lv-page]>.panel:has(>.grid.grid-3)>.toolbar{flex-wrap:nowrap;overflow-x:auto;gap:.4rem;padding-bottom:.25rem;margin-top:.65rem!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-communication[data-lv-page] [data-communication-template]{flex:none;white-space:nowrap;min-height:44px}

 /* Calendar categories and Today stay visible, with the view switch on its own row. */
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-filter-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.35rem;overflow:visible;align-items:stretch;margin:.35rem 0 .65rem;padding-bottom:.25rem;min-width:0}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-layout-switch{grid-column:1/-1;position:static;width:100%;min-width:0;max-width:100%;margin-top:.2rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-filter-row>:is(.filter-chip,.calendar-today-button){min-height:44px;width:100%;min-width:0;padding:.45rem .3rem;font-size:.72rem;white-space:normal}

 /* Full labels for every member tab, with no sideways hunt for Family or Access. */
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-modal]>.modal-head{padding:.5rem .75rem;min-height:3.5rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-modal]>.modal-body{padding:.65rem!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #member-form>.member-editor-tabs{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:.2rem;padding:.3rem!important;overflow:visible}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #member-form .member-editor-tab{width:auto!important;min-width:0!important;min-height:44px;padding:.35rem .2rem;font-size:.7rem;line-height:1.35;white-space:normal;overflow-wrap:normal}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root .lv-form-navigation{scrollbar-width:thin;scroll-padding-inline:.5rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-modal] :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){font-size:16px}
}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] .compact-filter-panel.is-collapsed{padding:.5rem!important}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] .compact-filter-panel.is-collapsed>.compact-filter-header{padding:0;margin:0;gap:.4rem}
@media(min-width:1001px){
 /* A short personal section no longer waits for the photo card before showing contacts. */
 html[data-app-layout="compact"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]:not([hidden]){display:grid;grid-template-columns:14rem minmax(0,1fr);grid-template-areas:"photo personal" "photo contact";gap:.7rem}
 html[data-app-layout="compact"] #modal-root #member-form .member-editor-profile-grid{display:contents}
 html[data-app-layout="compact"] #modal-root #member-form .member-editor-profile-grid>.member-photo-section{grid-area:photo;align-self:start;height:auto}
 html[data-app-layout="compact"] #modal-root #member-form .member-editor-profile-grid>.member-form-section:not(.member-photo-section){grid-area:personal}
 html[data-app-layout="compact"] #modal-root #member-form .member-editor-panel[data-member-editor-panel="profile"]>.member-form-section{grid-area:contact}
}
@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #member-form .member-photo-editor{display:grid!important;grid-template-columns:4.5rem minmax(0,1fr);align-items:start;gap:.65rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #member-form .member-photo-preview{width:4.5rem!important;height:4.5rem!important;min-width:0;margin:0}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #member-form .member-photo-controls{min-width:0;width:100%;margin:0}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #member-form .member-photo-actions{justify-content:flex-start;margin-top:.4rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card{padding:.7rem!important;gap:.4rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card-avatar{width:2.5rem;height:2.5rem;flex-basis:2.5rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card-info{margin-block:.25rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-members[data-lv-page] .member-card-diary{margin-top:.3rem;padding-top:.45rem;min-height:44px}
}
@media(min-width:380px) and (max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #member-form .member-editor-panels .member-form-section .member-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-modal]>.modal-head>button{min-width:44px;min-height:44px}
}
@media(max-width:760px){
 /* Empty month cells should not consume a desktop-sized row on a phone. */
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-month-grid{gap:.25rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-calendar[data-lv-page] .calendar-month-grid .calendar-cell{min-height:3.25rem!important;height:auto;padding:.35rem .2rem}
}
@media(max-width:760px){
 /* The modular calendar is a grid: its row gap replaces block margins. */
 html[data-app-layout="focus"] #view-calendar[data-lv-page]{row-gap:.65rem!important}
 html[data-app-layout="focus"] #app-screen #view-calendar[data-lv-page]>.page-hero{margin-bottom:0!important}
 html[data-app-layout="focus"] #app-screen #view-calendar[data-lv-page]>.panel{margin-top:0!important}
}
@media(max-width:760px){
 /* Labels and counts read as rows instead of narrow tiles with four-line titles. */
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .role-summary-grid{grid-template-columns:1fr!important;gap:.25rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .role-summary-grid>button{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.1rem .65rem;min-height:44px;padding:.4rem .6rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .role-summary-grid>button>small{grid-column:1;font-size:.75rem;line-height:1.4;margin:0}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .role-summary-grid>button>strong{grid-column:2;grid-row:1/3;font-size:1.15rem;line-height:1.3}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .role-summary-grid>button>span{grid-column:1}
}

/* Member details: fit actual facts, rather than allocating whole desktop tracks to counters. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail]{display:flex;flex-direction:column;height:auto;max-height:calc(100dvh - 1.5rem)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail]>.modal-head{flex:none;padding:.65rem .9rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail]>.modal-head>button{min-width:44px;min-height:44px}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body]{min-height:0;overflow:auto;flex:0 1 auto;padding:.85rem;gap:.7rem;align-content:start}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .panel{padding:.8rem!important}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .stat-card{padding:.65rem;min-height:0}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .stat-card>strong{font-size:1.25rem;margin-block:.25rem;line-height:1.3}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .stat-highlight{padding:.45rem .6rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .stat-highlight>strong{font-size:.7rem;line-height:1.4}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .stat-highlight>span{font-size:.9rem;line-height:1.4}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-detail-area="points"]>.grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.5rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .empty-state{min-height:0;padding:.85rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] :is(.panel-header,.detail-head){gap:.65rem;margin-bottom:.65rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-detail-area="actions"]{gap:.5rem}
html[data-app-layout="cards"] #modal-root [data-lv-member-detail]{margin-block:.5rem;max-height:calc(100dvh - 1rem)}
html[data-app-layout="cards"] #modal-root .modal-backdrop:has(>[data-lv-member-detail]){place-items:start end}
html[data-app-layout="cards"] #modal-root [data-lv-detail-area="profile"]{padding:.8rem;gap:.6rem}
html[data-app-layout="cards"] #modal-root [data-lv-detail-area="profile"] .member-head{width:100%;flex-direction:row;align-items:center;gap:.65rem}
html[data-app-layout="cards"] #modal-root [data-lv-detail-area="profile"] .member-head>div{min-width:0}
html[data-app-layout="cards"] #modal-root [data-lv-detail-area="profile"] .member-head h2{font-size:1.1rem;overflow-wrap:anywhere}
html[data-app-layout="cards"] #modal-root [data-lv-detail-area="profile"] .avatar{width:4rem;height:4rem;flex-basis:4rem}
html[data-app-layout="focus"] #modal-root [data-lv-member-detail-body]{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"profile numbers" "personal contact" "points results" "actions actions"}
html[data-app-layout="focus"] #modal-root [data-lv-detail-area="numbers"]{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.5rem}
html[data-app-layout="focus"] #modal-root [data-lv-detail-area="profile"]{padding:.85rem}
html[data-app-layout="focus"] #modal-root [data-lv-detail-area="profile"] .avatar{width:4rem;height:4rem;flex-basis:4rem}
@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail]{max-height:calc(100dvh - .5rem)}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body]{padding:.65rem;gap:.6rem}
 html:is([data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body]{grid-template-columns:1fr;grid-template-areas:"profile" "numbers" "personal" "contact" "points" "results" "actions"}
 html[data-app-layout="cards"] #modal-root [data-lv-member-detail]{margin:0;max-height:100dvh}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-detail-area="profile"] .avatar{width:3rem;height:3rem;flex-basis:3rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-detail-area="profile"] h2{font-size:1.1rem;overflow-wrap:anywhere}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .stat-card{padding:.5rem}
}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .stat-card>:is(.label,small){display:block;line-height:1.35}
@media(min-width:761px){
 html:is([data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-detail-area="numbers"]{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media(min-width:761px) and (max-width:1100px){
 html[data-app-layout="focus"] #modal-root [data-lv-member-detail-body]{grid-template-areas:"profile profile" "numbers numbers" "personal contact" "points points" "results results" "actions actions"}
}

/* Existing event, camp and tournament details previously missed the form-only geometry. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-detail]{display:flex;flex-direction:column;overflow:auto;scroll-padding-top:4.5rem;width:min(70rem,calc(100vw - 2rem));max-width:calc(100vw - 2rem);max-height:calc(100dvh - 2rem)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-detail]>.modal-head{position:sticky;top:0;z-index:5;flex:none;padding:.65rem .85rem;background:var(--surface,#fff)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-detail]>.modal-head>button{min-width:44px;min-height:44px}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body]{min-height:auto;flex:none;overflow:visible;padding:.85rem;scroll-padding-block:1rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .detail-head{display:flex;align-items:flex-start;flex-wrap:wrap;justify-content:space-between;gap:.7rem;margin-bottom:.7rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .detail-head>div{flex:1 1 20rem;min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .tournament-header-status{flex:0 1 13rem;width:auto;max-width:100%}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] h2{margin:0 0 .35rem;overflow-wrap:anywhere}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] :is(.grid,.detail-action-grid,.camp-detail-columns){gap:.65rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .panel{min-width:0;padding:.8rem!important}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .stat-card{min-width:0;min-height:0;padding:.6rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .stat-card>:is(.label,small){display:block;line-height:1.35}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .stat-card>strong{font-size:1.2rem;line-height:1.3;margin:.25rem 0;overflow-wrap:anywhere}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .tournament-summary-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .staff-detail-response{padding:.65rem .8rem;margin:0 0 .65rem;gap:.65rem;flex-wrap:wrap}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .detail-action-grid{margin-block:.5rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .detail-list>div{display:grid;grid-template-columns:minmax(6rem,.7fr) minmax(0,1fr);gap:.35rem .6rem;padding-block:.35rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .detail-list dd{margin:0;min-width:0;overflow-wrap:anywhere}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .camp-detail-columns{align-items:start;margin-block:.7rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .camp-info{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;margin-block:.7rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .camp-info>span{min-width:0;overflow-wrap:anywhere;line-height:1.5}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .table-wrap{max-width:100%;overflow:auto;overscroll-behavior-x:contain}
html[data-app-layout="cards"] #modal-root .modal-backdrop:has(>[data-lv-record-detail]){place-items:start end;padding:.5rem 0}
html[data-app-layout="cards"] #modal-root [data-lv-record-detail]{width:min(76rem,96vw);max-width:100vw;max-height:calc(100dvh - 1rem);border-radius:1rem 0 0 1rem}
html[data-app-layout="focus"] #modal-root .modal-backdrop:has(>[data-lv-record-detail]){place-items:start center;padding:.75rem}
html[data-app-layout="focus"] #modal-root [data-lv-record-detail]{width:min(78rem,calc(100vw - 1.5rem));max-width:calc(100vw - 1.5rem);max-height:calc(100dvh - 1.5rem)}
@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-detail]{width:calc(100vw - .5rem);max-width:calc(100vw - .5rem);max-height:calc(100dvh - .5rem)}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body]{padding:.65rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] :is(.input,.select,textarea){font-size:16px}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] :is(.tournament-summary-stats,.camp-info){grid-template-columns:repeat(2,minmax(0,1fr))!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body="actions"]>.grid.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .detail-head>div{flex-basis:100%}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .tournament-header-status{flex-basis:100%;width:100%}
 html[data-app-layout="cards"] #modal-root .modal-backdrop:has(>[data-lv-record-detail]){padding:0}
 html[data-app-layout="cards"] #modal-root [data-lv-record-detail]{width:100vw;max-width:100vw;max-height:100dvh;border-radius:0}
 html[data-app-layout="focus"] #modal-root .modal-backdrop:has(>[data-lv-record-detail]){padding:.25rem}
}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .detail-tabs{margin-inline:0!important;max-width:100%;box-sizing:border-box}
@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .detail-tabs>.detail-tab{flex:1 1 0;min-width:0;min-height:44px;padding:.55rem .35rem;white-space:normal;line-height:1.4}
}
/* Attendance responses must use their available width, including disabled referee choice. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .staff-detail-response>.staff-response-block{flex:0 1 24rem;width:24rem;min-width:0;max-width:100%}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .staff-response-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .staff-response{min-width:0;min-height:44px;padding:.5rem .4rem;white-space:normal;justify-content:center}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .staff-response--referee{grid-column:auto}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .staff-response-message:empty{min-height:0;margin:0}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-detail-area="profile"] .member-head{min-width:0;max-width:100%}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-detail-area="profile"] .member-head>div:not(.avatar){min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-detail-area="profile"] h2{overflow-wrap:anywhere}
@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .staff-detail-response>.staff-response-block{flex-basis:100%;width:100%}
 html[data-app-layout="cards"] #modal-root [data-lv-detail-area="contact"] .stat-highlight{display:block;padding:.45rem .5rem}
 html[data-app-layout="cards"] #modal-root [data-lv-detail-area="contact"] .stat-highlight>:is(strong,span){display:block}
}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .panel-header{margin-bottom:.55rem;padding-bottom:0;gap:.5rem;flex-wrap:wrap;align-items:start}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .panel>p{margin-block:.55rem;line-height:1.5}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-record-body] .camp-description:empty{margin:0}
html[data-app-layout="focus"] #modal-root [data-lv-record-body] .camp-info>span{padding:.55rem .65rem;border:1px solid var(--club-border);border-radius:.7rem;background:var(--club-subtle-gradient)}
@media(min-width:761px){
 /* Classical detail pairs points with results instead of two nearly empty full-width panels. */
 html[data-app-layout="compact"] #modal-root [data-lv-member-detail-body]{grid-template-columns:repeat(2,minmax(0,1fr))}
 html[data-app-layout="compact"] #modal-root [data-lv-member-detail-body]>:is([data-lv-detail-area="profile"],[data-lv-detail-area="numbers"],[data-lv-detail-facts],[data-lv-detail-area="actions"]){grid-column:1/-1}
 html[data-app-layout="compact"] #modal-root [data-lv-detail-area="profile"] .avatar{width:4rem;height:4rem;flex-basis:4rem}
}

/* An empty, derived summary must not reserve an otherwise unused sidebar. */
html[data-app-layout="focus"] #modal-root .lv-form-summary[data-lv-summary-empty="true"]{display:none}
html[data-app-layout="focus"] #modal-root [data-lv-form-body]:has(>.lv-form-summary[data-lv-summary-empty="true"]){grid-template-columns:minmax(0,1fr)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-simple]>fieldset.camp-fields{display:block!important;min-inline-size:0;margin:0;padding:.5rem;border:0}

/* Training editor: keep phases, blocks and exercises distinct without five padded boxes. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor>.training-structure{border:0;background:transparent;padding:0!important}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-phase{min-width:0;padding:.7rem;margin-bottom:.65rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-phase>header{margin-bottom:.55rem;gap:.6rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-phase-items{padding:0;gap:.6rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block{min-width:0;padding:.6rem;gap:.55rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-top{display:grid;grid-template-columns:minmax(0,1fr) 4.5rem auto;align-items:center;gap:.4rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-meta{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-block:.35rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-meta>.select{flex:0 1 16rem;width:auto;min-width:0;max-width:100%}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-meta>div{display:flex;flex-wrap:wrap;gap:.35rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-meta button{min-width:44px;min-height:44px;padding:.4rem .6rem;border:1px solid var(--club-border);border-radius:.6rem;background:var(--surface,#fff);font-size:.75rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-elements{padding:.55rem 0 0;border:0;border-top:1px solid var(--club-border);border-radius:0;background:transparent}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-element{min-width:0;padding:.5rem;margin-top:.45rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-element-top{display:grid;grid-template-columns:minmax(0,1fr) 4.5rem auto 2.75rem;gap:.35rem;align-items:center}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-element-rounds{min-height:44px;display:flex;align-items:center;gap:.35rem;margin:0}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor [data-phase17-element-remove]{min-width:44px;min-height:44px}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-phase-empty{min-height:0;padding:.55rem .65rem;margin:.4rem 0}
@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-phase{padding:.55rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block{padding:.5rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-top{grid-template-columns:4.5rem auto minmax(0,1fr)}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-top>[data-training-block-field="title"]{grid-column:1/-1}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-meta>.select{flex-basis:100%;width:100%}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-element-top{grid-template-columns:4.25rem minmax(0,1fr) 2.75rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-element-top>[data-training-element-field="title"]{grid-column:1/-1}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor>.modal-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;padding:.6rem!important}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor>.modal-actions>.button{width:100%;min-width:0;min-height:44px;white-space:normal}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor>.modal-actions>[type="submit"]{grid-column:1/-1}
}
@media(min-width:761px){
 html[data-app-layout="compact"] #modal-root [data-lv-modal]:has([data-lv-simple]){width:min(48rem,calc(100vw - 2rem))!important}
 html[data-app-layout="cards"] #modal-root [data-lv-modal]:has([data-lv-simple]){width:min(52rem,94vw)!important}
 html[data-app-layout="focus"] #modal-root [data-lv-modal]:has([data-lv-simple]){width:min(60rem,calc(100vw - 2rem))!important}
}
@media(max-width:760px){
 /* The classical modal kept a 24 px desktop backdrop gutter on each side. */
 html[data-app-layout="compact"] #modal-root .modal-backdrop:has(>[data-lv-modal]){padding:.25rem}
 html[data-app-layout="compact"] #modal-root [data-lv-modal]{width:calc(100vw - .5rem)!important;max-width:calc(100vw - .5rem);max-height:calc(100dvh - .5rem)}
 /* Basket rows group the quantity with its total, rather than four separate lines. */
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-cart-panel>.panel-header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:.6rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-cart-panel>.panel-header>.button{max-width:7.5rem;min-height:44px;padding:.4rem .5rem;white-space:normal;line-height:1.4}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-cart-row{display:grid;grid-template-columns:3rem minmax(0,1fr) auto;grid-template-areas:"photo copy remove" "controls controls controls";align-items:start;gap:.5rem;padding:.6rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-cart-photo{grid-area:photo;width:3rem;height:3.5rem;margin:0;min-width:0;min-height:0}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-cart-copy{grid-area:copy;min-width:0;overflow-wrap:anywhere}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-cart-copy>p{margin:.2rem 0;line-height:1.4}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-cart-controls{grid-area:controls;display:flex;align-items:flex-end;justify-content:space-between;gap:.6rem;min-width:0}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-cart-row>[data-merch-remove]{grid-area:remove;align-self:start;width:auto;min-width:0;min-height:44px;padding:.4rem .45rem;white-space:normal}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-quantity-stepper>:is(button,input){min-width:44px;min-height:44px}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-clubwear[data-lv-page] .merch-checkout-layout{gap:.7rem;align-items:start}
}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-meta{justify-content:flex-start}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #phase17-training-editor .training-block-meta>div{margin-left:0}
@media(min-width:761px){
 html[data-app-layout="focus"] #modal-root [data-lv-modal]:has(#phase17-training-editor){width:min(80rem,calc(100vw - 2rem))!important}
}
html[data-app-layout="focus"] #modal-root #phase17-training-editor>.form-grid,html[data-app-layout="focus"] #modal-root #phase17-training-editor>.form-field:has(#p17-training-template){grid-column:1/-1}
/* Keep live status nodes mounted without allocating empty rows before any message exists. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-simple] :is([data-camp-error],[data-camp-progress],[data-merch-error]):empty{position:absolute;width:0;height:0;margin:0;padding:0;overflow:hidden}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-simple]>fieldset>h3{margin:.3rem 0 .5rem}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-simple]>fieldset>p{margin:.5rem 0;line-height:1.5}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #camp-nomination-form .camp-member-picker{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.35rem .6rem;align-content:start;min-width:0}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #camp-nomination-form .event-choice:not([hidden]){display:flex;align-items:center;gap:.4rem;min-width:0;min-height:44px;padding:.45rem .55rem;border:1px solid var(--club-border);border-radius:.6rem;background:var(--club-subtle-gradient);overflow-wrap:anywhere}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #camp-nomination-form .event-choice:has(input:checked){border-color:var(--club-control-border);background:var(--club-selected-gradient)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root #camp-nomination-form .event-choice>input{flex:none;width:auto}
@media(max-width:760px){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-simple]>.modal-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;padding:.65rem}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-simple]>.modal-actions>.button{width:100%;min-width:0;min-height:44px;white-space:normal}
}

/* Colour hierarchy derives from the club palette; it never replaces its saved values. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]){
 --lv-surface:var(--surface,#fff);
 --lv-canvas:color-mix(in srgb,var(--club-subtle) 25%,var(--canvas,#f5f6f8));
 --lv-inset:color-mix(in srgb,var(--club-subtle) 40%,var(--surface-muted,#f3f4f6));
 --lv-stroke:color-mix(in srgb,var(--club-border) 24%,var(--line,#e4e7ec));
 --lv-control-edge:color-mix(in srgb,var(--ink,#172033) 52%,var(--surface,#fff));
 --lv-accent-wash:color-mix(in srgb,var(--club-selected) 45%,var(--surface,#fff));
 --lv-panel-shadow:0 1px 4px color-mix(in srgb,var(--ink) 4%,transparent);
 --lv-confirm-surface:linear-gradient(120deg,color-mix(in srgb,var(--club-selected) 50%,var(--surface)) 0%,var(--club-selected) 100%);
}
html[data-app-layout="compact"]{--lv-canvas:var(--canvas,#f5f6f8)}
html[data-app-layout="cards"]{--lv-panel-shadow:none;--lv-canvas:color-mix(in srgb,var(--club-subtle) 15%,var(--canvas))}
html[data-app-layout="focus"]{--lv-panel-shadow:0 3px 12px color-mix(in srgb,var(--ink) 5%,transparent);--lv-canvas:color-mix(in srgb,var(--club-soft) 36%,var(--canvas))}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .main-content{background:var(--lv-canvas)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] :is(.panel,.staff-panel,.p19-settings-card,.member-card,.tournament-card,.merch-product-card){background:var(--lv-surface);border-color:var(--lv-stroke);box-shadow:var(--lv-panel-shadow)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] :is(.staff-stat,.member-card-points){background:var(--lv-surface);border-color:var(--lv-stroke)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] :is(.hero-icon,.staff-stat-icon,.member-card-points){background:var(--lv-accent-wash);color:var(--club-text)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #view-dashboard[data-lv-page] .role-summary-grid>button{background:var(--lv-inset);border-color:var(--lv-stroke)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root :is([data-lv-modal],[data-lv-member-detail],[data-lv-record-detail])>.modal-head{background:var(--lv-surface);border-bottom-color:var(--lv-stroke)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root :is([data-lv-form],[data-lv-member-detail-body],[data-lv-record-body]) :is(.panel,.member-form-section,.training-phase,.training-block,.training-element){background:var(--lv-surface);border-color:var(--lv-stroke);box-shadow:none}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #modal-root [data-lv-member-detail-body] .stat-highlight{background:var(--lv-inset);border-color:var(--lv-stroke)}
html[data-app-layout="cards"] #modal-root [data-lv-detail-area="contact"] .stat-highlight{background:transparent}
html[data-app-layout="focus"] #modal-root :is([data-lv-modal],[data-lv-member-detail]){background:var(--lv-canvas)}
html[data-app-layout="focus"] #modal-root .modal-backdrop:has(>[data-lv-modal]){background:var(--lv-canvas)}
html[data-app-layout="cards"] #view-settings[data-lv-page]>.p19-settings-nav{background:var(--lv-inset);border-color:var(--lv-stroke)}

/* Editable controls have a neutral visible boundary; the accent identifies focus and choice. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(.input,.select,textarea):not(:disabled):not([readonly]):not([aria-invalid="true"]):not(:user-invalid):not(:focus){background-color:var(--lv-surface);border-color:var(--lv-control-edge);color:var(--ink)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(.input,.select,textarea):focus{box-shadow:none}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(.input,.select,textarea):not([aria-invalid="true"]):not(:user-invalid):focus-visible{border-color:var(--club-control-border);outline:2px solid var(--club-control-border);outline-offset:2px}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(.input,.select,textarea):is([aria-invalid="true"],:user-invalid){border-color:var(--danger);background-color:color-mix(in srgb,var(--status-danger-bg) 55%,var(--surface))}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(.input,.select,textarea):is([aria-invalid="true"],:user-invalid):focus-visible{outline:2px solid var(--danger);outline-offset:2px}

/* Keep the approved light action style. Confirmation has more tint than opening or cancelling. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(.button.primary[type="submit"],.button.primary[data-ui-confirm],.button.primary[data-save-attendance],.button.primary[data-save-tournament-draft],.button[data-merch-submit-order],.p19-save-bar .button.primary){background-color:var(--lv-surface);background-image:var(--lv-confirm-surface);border-color:var(--club-control-border);color:var(--club-text);box-shadow:0 2px 5px color-mix(in srgb,var(--club-text) 10%,transparent);font-weight:800}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(.settings-tab.active,.detail-tab.active,.member-editor-tab.is-active,.lv-form-navigation [aria-current="step"],[data-merch-tab][aria-current="page"]){background-color:var(--lv-surface);background-image:var(--club-selected-gradient);border-color:var(--club-control-border);color:var(--club-text);box-shadow:inset 0 -2px var(--club-control-border);font-weight:800}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) .button.secondary:not(:disabled):not([aria-current="page"]):not([aria-current="step"]){border-color:var(--lv-stroke)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(.button,.staff-response):disabled:not(.is-selected):not([aria-pressed="true"]){opacity:1;background:var(--surface-muted);border-color:var(--line);color:var(--muted);box-shadow:none}
@media(hover:hover) and (pointer:fine){
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen .view-section[data-lv-page] :is(.staff-stat:not(:disabled),.role-summary-grid>button:not(:disabled),.member-card,.tournament-card,.club-event-card):hover{border-color:var(--club-control-border);background:var(--club-subtle-gradient);box-shadow:0 3px 10px color-mix(in srgb,var(--club-text) 8%,transparent)}
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(.button.secondary:not(:disabled):not([aria-current="page"]):not([aria-current="step"]):not(.active),.member-editor-tab:not(.is-active)):hover{border-color:var(--club-control-border);background:var(--club-subtle-gradient);color:var(--club-text)}
}
@media(max-width:760px){
 /* An opaque navigation surface keeps scrolling text from showing through its labels. */
 html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #bottom-nav{background:var(--lv-surface);border-top-color:var(--lv-stroke);box-shadow:0 -3px 12px color-mix(in srgb,var(--ink) 6%,transparent)}
}
/* Keep deliberately unframed sections unframed; only their inner cards receive elevation. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen #view-members[data-lv-page]>.member-filter-host{background:transparent;border-color:transparent;box-shadow:none}
html[data-app-layout="cards"] #app-screen #view-dashboard[data-lv-page] .staff-tournaments-panel{background:transparent;box-shadow:none}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) :is(#app-screen,#modal-root) :is(input,textarea)::placeholder{color:var(--muted);opacity:1}
/* Emphasise existing, non-zero work counts; a quiet zero is not an alert. */
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen #view-dashboard[data-lv-page] .role-summary-grid>button[data-lv-attention="warning"]{background:var(--status-warning-bg);border-color:var(--status-warning-border);box-shadow:inset 2px 0 var(--warning)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen #view-dashboard[data-lv-page] .role-summary-grid>button[data-lv-attention="warning"]>strong{color:var(--warning)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen #view-dashboard[data-lv-page] .role-summary-grid>button[data-lv-attention="info"]{background:var(--lv-accent-wash);border-color:var(--club-border)}
html:is([data-app-layout="compact"],[data-app-layout="cards"],[data-app-layout="focus"]) #app-screen #view-dashboard[data-lv-page] .role-summary-grid>button[data-lv-attention="info"]>strong{color:var(--club-text)}

/* Desktop Settings navigation: larger labels and targets across all layouts. */
@media(min-width:761px){
 #app-screen #view-settings>.p19-settings-nav .settings-tab{min-height:3.125rem;padding:.7rem .85rem;font-size:.875rem;line-height:1.35;font-weight:700}
 #app-screen #view-settings>.p19-settings-nav .settings-tab.active{font-weight:800}
 html[data-app-layout="cards"] #view-settings.view-section[data-lv-page]:not(.is-hidden){grid-template-columns:clamp(12rem,15vw,13.5rem) minmax(0,1fr)}
 html[data-app-layout="cards"] #view-settings.view-section[data-lv-page]:not(.is-hidden)>.p19-settings-nav{gap:.4rem;padding:.4rem}
 html[data-app-layout="cards"] #view-settings.view-section[data-lv-page]:not(.is-hidden)>.p19-settings-nav .settings-tab{min-width:0;justify-items:start}
}

/* Layout 3: give desktop Settings navigation a readable working column. */
@media(min-width:1101px){
 html[data-app-layout="cards"] #view-settings.view-section[data-lv-page]:not(.is-hidden){grid-template-columns:clamp(16rem,20vw,19rem) minmax(0,1fr);column-gap:1.25rem}
 html[data-app-layout="cards"] #view-settings.view-section[data-lv-page]:not(.is-hidden)>.p19-settings-nav{padding:.5rem;gap:.45rem;min-width:0}
 html[data-app-layout="cards"] #app-screen #view-settings>.p19-settings-nav .settings-tab{min-height:3.5rem;padding:.85rem 1.1rem;font-size:1rem;line-height:1.4;text-align:left;justify-content:start;justify-items:start}
}