.roster-filter{display:flex;align-items:center;flex-wrap:wrap;gap:6px;min-width:0;}
.roster-filter .input{width:auto;min-width:130px;max-width:220px;}
.roster-filter-pill{display:inline-flex;align-items:center;min-width:0;max-width:100%;border:1px solid #80808077;border-radius:6px;background:var(--window-card-bg,#16191b);overflow:hidden;}
.roster-filter .roster-filter-pill .input{border:0!important;background:transparent!important;min-width:110px;max-width:200px;margin:0;flex:1;}
.roster-filter-pill>.roster-icon-btn.btn{border:0;border-radius:0;color:#ec575f!important;background:transparent!important;margin:0;flex:none;}
.roster-view-all{display:flex;align-items:center;gap:6px;white-space:nowrap;}
.roster-view-all input{width:16px;height:16px;accent-color:#259678;}
.roster-icon-btn.btn{width:32px;height:32px;min-width:32px;padding:6px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;}
.roster-icon-btn svg{pointer-events:none;flex:none;}
.roster-icon-btn.active,.roster-group-row.selected{background:#247663!important;color:#fff!important;outline:2px solid #6ad4ae;outline-offset:-2px;}
.roster-group-tree{display:grid;gap:4px;margin-top:10px;}
.roster-group-row{display:flex;align-items:center;gap:6px;padding:4px;border-bottom:1px solid #80808055;}
.roster-group-row>button:first-child{flex:1;text-align:left;overflow-wrap:anywhere;}
.roster-group-row.subgroup{margin-left:24px;border-left:2px solid #80808066;}
.roster-count{min-width:24px;text-align:center;}
.roster-student-tools{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:8px;}
.roster-student-tools .input{max-width:220px;width:auto;}
.roster-photo{display:inline-flex;width:48px;height:48px;min-width:48px;border-radius:6px;align-items:center;justify-content:center;background:#dce8e7;color:#173731;font:700 17px/1 Arial,sans-serif;overflow:hidden;}
.roster-photo img{width:100%;height:100%;object-fit:cover;}
.roster-student-details{display:flex;flex-direction:column;gap:12px;align-items:center;padding:16px 0;}
.roster-student-details .roster-photo{width:96px;height:96px;font-size:28px;}
.roster-save-state{font-size:12px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.roster-error{color:#fbd3ce;background:#672921;padding:8px;border-radius:4px;font-size:14px;overflow-wrap:anywhere;}
.roster-modal{position:fixed;inset:0;background:#0009;z-index:2147483644;display:flex;align-items:center;justify-content:center;padding:16px;}
.roster-dialog{width:min(760px,100%);max-height:calc(100dvh - 32px);display:flex;flex-direction:column;background:var(--window-card-bg,#16191b);color:var(--text,#eee);border:1px solid #80808066;border-radius:8px;box-shadow:0 12px 48px #0007;min-width:0;}
.roster-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid #80808055;}
.roster-dialog-head h2{font:700 18px/1.3 Arial,sans-serif;margin:0;overflow-wrap:anywhere;}
.roster-dialog-body{display:flex;flex-direction:column;gap:14px;padding:16px;overflow:auto;min-height:0;}
.roster-attendance-dropdown{background:transparent;}
.roster-attendance-dropdown .roster-dialog{position:fixed;width:300px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);}
.roster-attendance-dropdown .roster-dialog-head{padding:10px;gap:8px;}
.roster-attendance-dropdown .roster-dialog-head h2{font-size:14px;}
.roster-attendance-dropdown .roster-dialog-body{padding:10px;gap:10px;}
.roster-field{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:14px;}
.roster-field[hidden]{display:none;}
.tab.icon-tab[data-tab="seating"] img{display:none;}
.tab.icon-tab[data-tab="seating"]::before{content:"";display:block;width:22px;height:22px;flex:0 0 22px;background:var(--panel-header-text);mask:url('/assets/tab-icon-seating.png?v=1') center/contain no-repeat;}
.roster-field .input{width:100%;min-width:0;box-sizing:border-box;}
.roster-dialog-body>.btn{align-self:flex-start;}
.roster-photo-candidate img{width:160px;height:160px;object-fit:cover;border-radius:6px;}
.roster-photo-review{display:flex;gap:12px;flex-wrap:wrap;align-items:end;border-bottom:1px solid #80808066;padding-bottom:16px;}
.roster-photo-review h3{flex-basis:100%;font-size:16px;margin:0;}
.roster-photo-review .roster-photo{width:90px;height:90px;}
.roster-picker-result{display:flex;align-items:center;justify-content:center;gap:20px;min-height:140px;}
.roster-picker-result h3{font-size:28px;overflow-wrap:anywhere;}
.roster-seating{padding:12px!important;min-width:0;}
.roster-seating-header{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:12px;}
.roster-seating-header h2{font-size:18px;margin:0 auto 0 0;}
.roster-seating-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:12px;}
.roster-seating-expanded{position:fixed;inset:0;z-index:1200;background:var(--window-card-bg,#16191b);overflow:auto;}
.roster-seat-roster{display:flex;flex-direction:column;gap:10px;min-width:0;max-height:calc(100dvh - 210px);}
.roster-seat-roster h3{font-size:16px;margin:0;}
.roster-seat-roster>.btn{align-self:flex-start;}
.roster-seat-roster .roster-filter .input{max-width:100%;}
.roster-seat-list{overflow:auto;min-height:0;display:flex;flex-direction:column;gap:6px;}
.roster-seat-roster-row{display:flex;align-items:center;gap:8px;padding:6px;border:1px solid #80808055;border-radius:6px;cursor:grab;touch-action:none;}
.roster-seat-roster-row>span:nth-child(2){flex:1;overflow-wrap:anywhere;font-size:14px;}
.roster-seat-roster-row .roster-photo{width:36px;height:36px;min-width:36px;font-size:13px;}
.roster-seat-roster-row.dragging{outline:2px solid #4fc2a2;}
.roster-seat-workspace{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0;}
.roster-room-viewport{width:100%;min-width:0;overflow:auto;}
.roster-drawing-tools{display:flex;gap:4px;flex-wrap:wrap;align-items:center;}
.roster-room-stage{position:relative;width:100%;min-width:960px;aspect-ratio:3/2;background:#fff;border:1px solid #80918b;overflow:hidden;isolation:isolate;}
.roster-room-art{position:absolute;inset:0;overflow:hidden;z-index:0;}
.roster-room-art>.student-presentation-slide{position:absolute!important;left:0!important;top:0!important;max-width:none!important;aspect-ratio:3/2;border:0;border-radius:0;}
.roster-room-art .student-presentation-slide-count{display:none;}
.roster-room-stage canvas{display:block;width:100%;height:100%;touch-action:none;}
.roster-seat-layer{position:absolute;inset:0;pointer-events:none;z-index:1;}
.roster-seat{position:absolute;width:128px;display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:3px;box-sizing:border-box;border:2px solid #87969b;border-radius:6px;background:#f3f6f5;color:#182a25;pointer-events:auto;cursor:grab;touch-action:none;box-shadow:0 2px 4px #0002;}
.roster-seat .roster-photo{width:100%;height:114px;min-width:0;font-size:28px;border-radius:3px;}
.roster-seat-name{font:700 13px/1.2 Arial,sans-serif;overflow-wrap:anywhere;white-space:normal;color:inherit!important;background:transparent!important;border:0;padding:3px 1px;text-align:center;cursor:pointer;}
.roster-seat-name:hover,.roster-seat-name:focus-visible{background:#bdded7!important;outline:1px solid #278062;}
.roster-seat-attendance{font:600 10px/1.2 Arial,sans-serif;white-space:normal;color:inherit;text-align:center;min-width:0;overflow-wrap:anywhere;}
.roster-seat>.roster-icon-btn{position:absolute;right:4px;top:4px;width:24px;height:24px;min-width:24px;padding:3px;border:0;background:#ffffffdf!important;color:#bd2430!important;}
.roster-seat>.roster-icon-btn svg{width:14px;height:14px;}
.roster-seat.moving{z-index:2;outline:2px solid #1979b2;}
.attendance-present{border-color:#278062!important;background:#deeee6!important;}
.attendance-absent{border-color:#b45054!important;background:#f5dfe0!important;}
.attendance-school_activity{border-color:#537aaf!important;background:#e1eaf5!important;}
.attendance-tardy{border-color:#b29029!important;background:#f6edc9!important;}
.roster-calendar-head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.roster-calendar-head input{width:auto;min-width:0;}
.roster-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;}
.roster-calendar>strong{text-align:center;font-size:12px;}
.roster-calendar-day{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-height:85px;padding:7px;border:2px solid #b3bfc3;border-radius:5px;background:#eef2f3;color:#182a25;min-width:0;cursor:pointer;text-align:left;}
.roster-calendar-day span{font:12px/1.2 Arial,sans-serif;overflow-wrap:anywhere;}
.roster-template-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;border-bottom:1px solid #80808066;padding-bottom:10px;}
.roster-template-row>strong{margin-right:auto;overflow-wrap:anywhere;}
.roster-modal .btn:active,.roster-seating .btn:active,.roster-group-row button:active,.roster-student-tools button:active{filter:brightness(1.25);transform:translateY(1px);}
@media(max-width:850px){.roster-seating-layout{grid-template-columns:180px minmax(0,1fr);}.roster-room-viewport{max-height:75dvh;}}
@media(max-width:600px){.roster-seating-layout{grid-template-columns:1fr;}.roster-seat-roster{max-height:220px;}.roster-seat-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}.roster-modal{padding:6px;}.roster-dialog{max-height:calc(100dvh - 12px);}.roster-dialog-body{padding:10px;}.roster-calendar{gap:2px;}.roster-calendar-day{padding:3px;min-height:70px;}.roster-calendar-day span{font-size:9px;}}