.roster-tools{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:18px 0}.roster-tools input[type=search]{flex:1;min-width:180px;min-height:48px}.roster-tools label{display:flex;gap:8px;align-items:center;min-height:48px}.roster-tools p{width:100%;margin:0;color:#65565c}.roster-review-hint{background:#fff0d5;color:#583900;border-radius:8px;padding:8px;margin:8px 0;font-size:.9rem}.roster-review-card{padding:18px;border:1px solid #e2cad3;border-radius:14px;background:#fff;margin:12px 0}.roster-review-card p{margin:8px 0}.roster-review-overview button,#attendancePanel button{min-height:44px}#attendancePanel .mark-buttons{gap:8px}#attendancePanel .mark-buttons button{min-width:56px}#attendancePanel td{vertical-align:top}#attendancePanel tr[hidden]{display:none!important}
@media(max-width:900px){#attendancePanel .table-wrap{overflow:visible}#attendancePanel table,#attendancePanel tbody{display:block;width:100%}#attendancePanel thead{display:none}#attendancePanel tbody tr{display:grid;grid-template-columns:1fr 1fr;gap:8px;border:1px solid #e2cad3;border-radius:14px;padding:16px;margin:12px 0;background:#fff}#attendancePanel tbody td{display:block;border:0;padding:6px;min-width:0;overflow-wrap:anywhere}#attendancePanel tbody td::before{content:attr(data-label);display:block;color:#65565c;font-size:.85rem;margin-bottom:6px}#attendancePanel tbody td:first-child,#attendancePanel tbody td:last-child{grid-column:1/-1}#attendancePanel .top-course-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#attendancePanel .top-course-controls .wide{grid-column:1/-1}}
@media(max-width:480px){#attendancePanel .top-course-controls{grid-template-columns:1fr}#attendancePanel tbody tr{padding:10px}.roster-tools{gap:8px}.roster-tools input[type=search]{width:100%}}
@media(min-width:1100px){.roster-review-overview>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.roster-review-overview>div>p{grid-column:1/-1}.roster-review-card{margin:0}}

.roster-extra-actions{margin-top:12px}.roster-extra-actions summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:#65565c;text-decoration:underline}.roster-extra-actions[open] summary{margin-bottom:8px}

.roster-tools[hidden]{display:none}.roster-tools select{min-height:48px;max-width:100%;flex:1;min-width:180px}

.roster-review-overview>a{display:block;margin:12px 0}.roster-review-overview>button{display:block;margin:12px 0}

/* Separate customer cards clearly from the course-list background. */
@media(max-width:900px){
 #attendancePanel .table-wrap{background:#eee4df;border-radius:16px;padding:10px;box-sizing:border-box}
 #attendancePanel tbody tr{border:1px solid #b68c82;background:#fff;box-shadow:0 2px 5px rgba(76,38,29,.12)}
 #attendancePanel tbody tr:first-child{margin-top:0}
 #attendancePanel tbody tr:last-child{margin-bottom:0}
}

/* Card tables must fit the padded tablet panel as well as the phone. */
@media(max-width:900px){#attendancePanel table{min-width:0;max-width:100%;box-sizing:border-box}}