/* Recovery: keep the original page composition and shared club palette.
   Layout variants change density, without hiding attendance or duplicating training details. */
#view-attendance .attendance-member-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
#view-attendance .attendance-row--simple{display:flex;align-items:center;gap:10px;min-width:0;padding:12px;min-height:72px}
#view-attendance .attendance-row--simple .row-main{flex:1;min-width:0}
#view-attendance .attendance-row--simple strong{font-size:14px;line-height:1.4;overflow-wrap:anywhere}
#view-attendance .attendance-row--simple small{font-size:12px;line-height:1.5;overflow-wrap:anywhere}
#view-attendance .attendance-mark{display:grid;place-items:center;flex:none;width:22px;height:22px;border:1px solid var(--club-border);border-radius:50%;color:var(--club-text);background:#fff}
#view-attendance .attendance-mark svg{width:17px;height:17px}
#view-attendance .present .attendance-mark{border-color:var(--club-control-border);background:var(--club-soft)}
#view-attendance .attendance-row--simple[aria-disabled="false"]{cursor:pointer}
#view-attendance .week-day{min-height:54px}
#view-attendance .week-day[aria-pressed="true"]{border-color:var(--club-control-border);background:var(--club-selected-gradient)}
#view-attendance .availability-row{min-width:0}
#view-attendance .availability-row .row-main{min-width:0}
#view-attendance .attendance-save-dock{margin-bottom:12px}
:root[data-app-layout] #app-screen #desktop-nav .nav-btn[data-nav]{font-weight:500}
:root[data-app-layout] #app-screen #desktop-nav .nav-btn[data-nav].active{font-weight:600}
:root[data-app-layout] #app-screen #desktop-nav .nav-btn .nav-icon svg{stroke-width:1.65}
@media(min-width:1000px){
  html[data-app-layout="balanced"] #view-dashboard .staff-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:1279px){#view-attendance .attendance-member-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1099px){#view-attendance .attendance-member-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  #view-attendance .attendance-member-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  #view-attendance .attendance-row--simple{padding:10px;gap:8px}
  #view-attendance .attendance-row--simple strong{font-size:13px}
  #view-attendance .attendance-row--simple .avatar{width:32px;height:32px}
  #view-attendance .attendance-mark{width:18px;height:18px}
  #view-attendance .attendance-mark svg{width:14px;height:14px}
}
@media(max-width:440px){#view-attendance .attendance-member-grid{grid-template-columns:minmax(0,1fr)}}
#view-training .training-week-unit>span:first-child{min-width:0;overflow-wrap:anywhere}
#view-training .training-week-unit small{display:block;margin-top:3px;font-size:12px;line-height:1.4;color:var(--muted);font-variant-numeric:tabular-nums}

/* Keep the existing appearance picker and its real previews. */
.layout-appearance-card .p19-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.layout-appearance-card .p19-card-head>div{min-width:0}
.layout-appearance-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.layout-appearance-option{padding:10px;border:1px solid var(--line);border-radius:12px;min-width:0}.layout-appearance-option.is-selected{border-color:var(--club-control-border);box-shadow:inset 0 0 0 1px var(--club-control-border);background:var(--club-subtle-gradient)}.layout-appearance-option>strong{display:block;margin:10px 0 5px;font-size:.78rem}.layout-appearance-option>span{display:block;font-size:.7rem;line-height:1.5;color:var(--muted)}
button.layout-appearance-option{text-align:left;font:inherit;color:var(--ink);background:var(--surface)}
button.layout-appearance-option.is-selected{background:var(--club-subtle-gradient)}
button.layout-appearance-option:hover:not(:disabled){border-color:var(--club-control-border)}
button.layout-appearance-option:focus-visible{outline:2px solid var(--club-control-border);outline-offset:3px}
@media(max-width:999px){.layout-appearance-options{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.layout-appearance-card .p19-card-head{display:grid;gap:10px}.layout-appearance-card .p19-card-head>.button{justify-self:start}.layout-appearance-options{gap:8px}}
@media(max-width:760px){
  #view-attendance .attendance-draft-note{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
  #view-attendance .attendance-draft-note>.notice-icon{display:none}
  #view-attendance .attendance-roster-controls>.toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto}
  #view-attendance .attendance-roster-controls>.toolbar>.toolbar{display:contents}
  #view-attendance .attendance-roster-controls .compact-choice-chips{grid-column:1/-1;grid-row:2;display:flex;flex-wrap:nowrap;overflow-x:auto;min-width:0;max-width:100%;padding:2px 0}
  #view-attendance .attendance-roster-controls .compact-choice-chip{flex:none}
  #view-attendance .attendance-roster-controls [data-mark-all]{grid-row:1}
}
@media(max-width:760px){
  #view-attendance .attendance-roster-controls>.toolbar>.muted{grid-row:1;grid-column:1}
  #view-attendance .attendance-roster-controls [data-mark-all="true"]{grid-column:2}
  #view-attendance .attendance-roster-controls [data-mark-all="false"]{grid-column:3}
}