/* First slice of the online-class run: waiting room, attendance, phase, summary. */
.cr-panel{
  margin:0 0 14px;padding:14px 16px;border:1px solid #d7e2dc;border-radius:14px;
  background:linear-gradient(180deg,#fbfdfb,#f3f8f5);color:#193c35;
  box-shadow:0 10px 24px -22px rgba(24,60,52,.55);
}
.cr-head,.cr-student-line{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cr-head>div:first-child,.cr-student-line>div:first-child{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.cr-kicker{font-size:9px;letter-spacing:.16em;color:#72847d;font-weight:700}
.cr-head strong,.cr-student-line strong{font-size:15px}
.cr-head small,.cr-student-line small{font-size:12px;color:#597269;font-variant-numeric:tabular-nums}
.cr-head-actions,.cr-student-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.cr-chip,.cr-mini,.cr-primary{
  border:1px solid #ceddd5;background:#fff;color:#244c43;border-radius:8px;
  padding:5px 9px;font:inherit;font-size:11px;line-height:1.3;cursor:pointer;
}
.cr-chip:hover,.cr-mini:hover,.cr-primary:hover{border-color:#8fb3a4;background:#f6fbf8}
.cr-chip.is-active{background:#236357;border-color:#236357;color:#fff}
.cr-chip:disabled{opacity:.45;cursor:default}
.cr-primary{background:#236357;border-color:#236357;color:#fff;padding:7px 12px;font-size:12px}
.cr-phases{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.cr-body{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:12px;margin-top:12px}
.cr-title{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap}
.cr-title strong{font-size:13px}.cr-title span{font-size:11px;color:#5c746b}
.cr-students{list-style:none;margin:7px 0 0;padding:0;display:grid;gap:5px}
.cr-student{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px;border:1px solid #e1eae5;border-radius:9px;background:#fff}
.cr-student-name{display:flex;flex-direction:column;min-width:100px}.cr-student-name strong{font-size:12px}.cr-student-name small{font-size:10px;color:#647a72}
.cr-student-meta{display:flex;gap:7px;font-size:10px;color:#647a72;flex-wrap:wrap}
.cr-student-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.cr-mini{padding:3px 7px;font-size:10px}
.cr-empty,.cr-hint{margin:7px 0 0;font-size:11px;color:#647a72;line-height:1.6}
.cr-summary-slot{min-width:0}
.cr-summary{border-left:1px solid #dce8e1;padding-left:12px;font-size:11px;color:#4f675f;line-height:1.7}
.cr-summary-counts{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:4px}.cr-summary-counts span{display:flex;flex-direction:column}.cr-summary-counts b{font-size:15px;color:#1c4f44}
.cr-phase-durations{display:flex;gap:7px;flex-wrap:wrap;font-size:10px;color:#5c746b}.cr-phase-durations span{background:#edf4f0;border-radius:6px;padding:3px 6px}
.cr-note-label{display:block;margin-top:7px;font-size:11px;color:#3f5e54}.cr-note-label textarea{display:block;width:100%;margin-top:4px;padding:7px 8px;border:1px solid #d5e2db;border-radius:8px;font:inherit;font-size:11px;resize:vertical;background:#fff;color:#21483f}
.cr-summary-actions{display:flex;align-items:center;gap:8px;margin-top:6px}.cr-summary-actions span{font-size:10px;color:#2f7468}
.cr-error{margin:8px 0 0;padding:6px 8px;border-radius:7px;background:#fff2ed;color:#9b4328;font-size:11px}
.cr-announce-bar{display:flex;gap:5px;margin-top:8px}
.cr-announce-bar input{min-width:0;flex:1;padding:5px 7px;border:1px solid #d5e2db;border-radius:7px;font:inherit;font-size:11px;background:#fff;color:#21483f}
.cr-announcements{margin-top:6px;padding:6px 8px;border-radius:7px;background:#eef6f1;color:#2a5b4e;font-size:11px;line-height:1.6}
.cr-announcements p{margin:0}.cr-announcements p+p{margin-top:3px}
.cr-student-announcements{margin-top:7px;padding:7px 9px;border-radius:8px;background:#eef6f1;color:#2a5b4e;font-size:11.5px;line-height:1.6}
.cr-student-announcements p{margin:0}.cr-student-announcements p+p{margin-top:3px}
.cr-device-check{margin:6px 0 0;font-size:10.5px;color:#506b60;line-height:1.6}
.cr-exit-box{margin-top:9px;padding-top:8px;border-top:1px solid #dce8e1}
.cr-exit-box label{display:block;font-size:11px;color:#3f5e54}
.cr-exit-box textarea{display:block;width:100%;margin-top:4px;padding:7px 8px;border:1px solid #d5e2db;border-radius:8px;font:inherit;font-size:11px;resize:vertical;background:#fff;color:#21483f}
.cr-exit-list{margin-top:6px;font-size:10.5px;color:#526a60;line-height:1.6}.cr-exit-list p{margin:3px 0}.cr-exit-list b{color:#2b574c}
.cr-follow-up{margin:5px 0;font-size:10.5px;color:#9b5c35}
.cr-ended{margin:8px 0 0;font-size:11px;color:#647a72}
.cr-checked{font-size:11px;color:#23725f;font-weight:700}
.cr-student{padding:9px 12px}
.cr-student .cr-kicker{font-size:8px}
.cr-teacher{position:fixed!important;z-index:80;left:12px;bottom:12px;width:min(460px,calc(100vw - 24px));max-height:min(72vh,560px);overflow:auto;margin:0}
.cr-teacher.is-collapsed{width:min(330px,calc(100vw - 24px));max-height:none;overflow:hidden}
.cr-teacher.is-collapsed .cr-phases,.cr-teacher.is-collapsed .cr-body,.cr-teacher.is-collapsed .cr-error,.cr-teacher.is-collapsed .cr-ended{display:none}
@media(max-width:760px){
  .cr-panel{padding:11px 12px;margin-bottom:10px}
  .cr-teacher{left:8px;bottom:8px;width:calc(100vw - 16px);max-height:64vh}
  .cr-body{grid-template-columns:1fr}
  .cr-summary{border-left:0;border-top:1px solid #dce8e1;padding:9px 0 0}
  .cr-student{flex-wrap:wrap}.cr-student-actions{width:100%;justify-content:flex-start}
}

.cr-chat{margin-top:10px;border-top:1px solid #e3eee9;padding-top:9px}
.cr-chat-head{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;color:#55716a}
.cr-chat-head strong{font-size:12px;color:#21483f}
.cr-chat-head small{font-size:10px;color:#8aa09b}
.cr-chat-log{max-height:130px;overflow:auto;background:#f7fbf9;border-radius:8px;padding:6px 8px;margin:5px 0}
.cr-chat-line{margin:2px 0;font-size:11px;line-height:1.5;color:#35584e}
.cr-chat-line b{color:#1f6b59;font-size:10px;margin-right:4px}
.cr-chat-empty{font-size:10px;color:#8aa09b;margin:0}
.cr-chat-form{display:flex;gap:5px}
.cr-chat-form input{flex:1;min-width:0;border:1px solid #d5e2db;border-radius:7px;padding:6px 8px;font-size:11px}
