/* QWERTY KIDS — Class Teacher Home slide v212
 * Deliberately scoped to .qct-role so the common employee Home page and all
 * administrative Role dashboards retain their existing interface. */
@media (max-width:1024px){
  .qct-role{--qct-navy:#17223a;--qct-muted:#66758f;--qct-line:#dfe7f2;--qct-blue:#2463eb;--qct-green:#18a957;--qct-teal:#0ea5a8;--qct-red:#ef4444;--qct-orange:#f59e0b;display:grid;gap:16px;padding:16px 16px 30px;color:var(--qct-navy);background:#f2f6fc}
  .qct-role button{font:inherit}
  .qct-head,.qct-summary,.qct-card{border:1px solid rgba(210,221,236,.88);border-radius:24px;background:#fff;box-shadow:0 12px 30px rgba(35,55,91,.07)}
  .qct-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:24px 26px;background:linear-gradient(135deg,#fff 0%,#f5fff9 100%)}
  .qct-head small,.qct-card>header>small,.qct-card>header div>small{display:block;color:var(--qct-green);font-size:13px;font-weight:900;letter-spacing:.08em}
  .qct-head h2{margin:5px 0 4px;font-size:clamp(23px,3.3vw,34px);line-height:1.1;letter-spacing:-.025em}
  .qct-head p{margin:0;color:var(--qct-muted);font-size:15px}
  .qct-head aside{display:grid;justify-items:end;gap:10px;white-space:nowrap}
  .qct-head time{font-weight:800;color:#263652}.qct-head time i{margin-right:8px;color:#334866}
  .qct-head aside span{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:7px 12px;background:#dff8e7;color:#148348;font-size:12px;font-weight:900}
  .qct-head aside span i{width:9px;height:9px;border-radius:50%;background:#24ae5d;box-shadow:0 0 0 5px rgba(36,174,93,.09)}

  .qct-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:22px 20px 0;overflow:hidden}
  .qct-stat{display:grid;grid-template-columns:48px 1fr;grid-template-rows:auto auto;column-gap:11px;align-items:center;padding:0 14px 20px;border-right:1px solid #edf1f6}
  .qct-stat:nth-child(4){border-right:0}.qct-stat>span{grid-row:1/3;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;font-size:20px}
  .qct-stat small{align-self:end;color:#53637c;font-size:13px;line-height:1.15}.qct-stat strong{align-self:start;font-size:27px;line-height:1.1}
  .qct-stat.green>span{background:#e6f8ec;color:#129149}.qct-stat.teal>span{background:#e0f8f6;color:#0b9894}.qct-stat.red>span{background:#ffebeb;color:#dc3434}.qct-stat.orange>span{background:#fff3dc;color:#dc8700}
  .qct-summary footer{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--qct-line);padding:15px 8px 17px}
  .qct-summary footer div{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.qct-summary footer span{color:#596984;font-size:14px}.qct-summary footer strong{color:var(--qct-green);font-size:20px}.qct-summary footer small{flex-basis:100%;color:#8792a6;font-size:11px}
  .qct-summary footer button,.qct-card>header>button{border:0;border-radius:13px;padding:12px 18px;background:linear-gradient(135deg,#16a34a,#22b65f);color:#fff;font-weight:850;box-shadow:0 7px 17px rgba(22,163,74,.2)}
  .qct-summary footer button i{margin-right:7px}

  .qct-card{padding:20px 22px}.qct-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:17px}.qct-card>header h3{margin:4px 0 0;font-size:19px}.qct-card>header>button{padding:10px 15px;background:linear-gradient(135deg,#255ff0,#256bd9);font-size:13px;box-shadow:none}.qct-card>header>button i{margin-left:6px}
  .qct-teaching-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.qct-teaching-metrics article{display:grid;grid-template-columns:42px auto;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:10px 12px;border-radius:17px;background:#f7f9fc}.qct-teaching-metrics i{grid-row:1/3;display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#e8efff;color:#2563eb;font-size:18px}.qct-teaching-metrics strong{font-size:22px;line-height:1}.qct-teaching-metrics span{color:#65738b;font-size:12px;line-height:1.1}.qct-teaching-metrics article:nth-child(2) i{background:#e8f8ed;color:#14964a}.qct-teaching-metrics article.warn i{background:#fff0dc;color:#f08b00}
  .qct-missing{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.qct-missing span{display:inline-flex;align-items:center;gap:7px;border-radius:12px;padding:8px 11px;background:#fff3df;color:#df7800;font-size:12px;font-weight:800}.qct-missing span.is-complete{background:#e7f8ed;color:#17864a}.qct-teaching>p{display:flex;align-items:flex-start;gap:7px;margin:13px 0 0;color:#7a879d;font-size:11px;line-height:1.4}.qct-teaching>p i{margin-top:2px;color:#4f75aa}

  .qct-performance>header{align-items:center}.qct-exam-score{display:grid;justify-items:end}.qct-exam-score>strong{font-size:39px;color:#245fe5;line-height:1}.qct-exam-score>span{margin-top:5px;color:#72809a;font-size:11px}.qct-exam-score>span.is-up{color:#159149}.qct-exam-score>span.is-down{color:#df3c3c}.qct-exam-score>span i{margin-right:5px}
  .qct-performance-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(230px,.8fr);gap:18px}.qct-performance-grid>article{min-width:0;border:1px solid #edf1f6;border-radius:17px;padding:13px 15px}.qct-performance-grid h4{margin:0 0 8px;color:#43526b;font-size:12px}
  .qct-line{position:relative;padding-bottom:23px}.qct-line svg{display:block;width:100%;height:auto;overflow:visible}.qct-line svg line{stroke:#e7edf5;stroke-width:1}.qct-line svg polyline{fill:none;stroke:#2864e7;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.qct-line svg circle{fill:#fff;stroke:#2864e7;stroke-width:3}.qct-line-green svg polyline{stroke:#1c9c53}.qct-line-green svg circle{stroke:#1c9c53}.qct-line-labels{position:absolute;left:0;right:0;bottom:0;height:16px}.qct-line-labels span{position:absolute;max-width:68px;transform:translateX(-50%);color:#7a879a;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.qct-chart-empty{display:grid;place-items:center;gap:7px;min-height:122px;border-radius:13px;background:#f8fafc;color:#8490a3;text-align:center;font-size:12px}.qct-chart-empty i{font-size:23px;color:#aeb8c8}
  .qct-subjects{display:grid;gap:9px}.qct-subject-row{display:grid;grid-template-columns:minmax(72px,1fr) minmax(70px,1.5fr) 42px;gap:8px;align-items:center}.qct-subject-row>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#34425b;font-size:11px}.qct-subject-row>i{height:7px;border-radius:999px;background:#edf1f5;overflow:hidden}.qct-subject-row>i b{display:block;height:100%;border-radius:inherit;background:#20a654}.qct-subject-row>i b.orange{background:#f59e0b}.qct-subject-row>i b.red{background:#ef4444}.qct-subject-row>strong{font-size:11px;text-align:right}.qct-mini-empty{display:grid;place-items:center;min-height:118px;border-radius:13px;background:#f8fafc;color:#8792a5;text-align:center;font-size:12px;padding:10px}
  .qct-link{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;margin-top:14px;border:1px solid #dce5f2;border-radius:13px;padding:11px 14px;background:#f9fbff;color:#245dd8;font-size:13px;font-weight:850}

  .qct-attendance>header h3{font-size:18px}.qct-attendance-grid{display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:17px;align-items:stretch}.qct-attendance-grid>article{min-width:0;border:1px solid #edf1f6;border-radius:17px;padding:11px 13px}.qct-attendance-grid>aside{display:grid;gap:10px}.qct-attendance-grid aside button{display:flex;align-items:center;gap:11px;border:0;border-radius:15px;padding:12px;background:#fff3df;color:#d97800;text-align:left}.qct-attendance-grid aside button.danger{background:#ffeded;color:#dc3434}.qct-attendance-grid aside button>i{font-size:21px}.qct-attendance-grid aside button span{display:grid;gap:2px}.qct-attendance-grid aside button strong{font-size:12px}.qct-attendance-grid aside button small{color:#627089;font-size:11px}

  .qct-attention>header>span{border-radius:999px;padding:6px 9px;background:#ecf8f0;color:#19834a;font-size:10px;font-weight:850}.qct-student-list{display:grid}.qct-student-row{display:grid;grid-template-columns:42px minmax(120px,1.5fr) minmax(58px,.65fr) minmax(58px,.65fr) 22px minmax(96px,.8fr) 12px;gap:9px;align-items:center;width:100%;border:0;border-bottom:1px solid #edf1f6;padding:11px 5px;background:transparent;color:inherit;text-align:left}.qct-student-row:last-child{border-bottom:0}.qct-avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#ffe9e9;color:#dc4141;font-size:11px;font-weight:900}.qct-avatar-2{background:#fff1dc;color:#d67900}.qct-avatar-3{background:#e5f7eb;color:#17864a}.qct-avatar-4{background:#e7eeff;color:#285ed1}.qct-student-row>div{min-width:0}.qct-student-row>div strong,.qct-student-row>div small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.qct-student-row>div strong{font-size:12px}.qct-student-row>div small{margin-top:3px;color:#8793a7;font-size:9px}.qct-student-row>em{font-style:normal;font-size:12px;font-weight:850;text-align:center}.qct-student-row>em small{display:block;margin-top:3px;color:#8a96a8;font-size:8px;font-weight:600}.qct-student-row>i.is-up{color:#16964b}.qct-student-row>i.is-down{color:#e13d3d}.qct-student-row>i.is-flat{color:#8995a7}.qct-student-row>b{border-radius:9px;padding:6px 8px;background:#ffebeb;color:#d93b3b;font-size:9px;text-align:center}.qct-student-row>b.is-orange{background:#fff1dc;color:#db7a00}.qct-student-row>.fa-chevron-right{color:#7b899e;font-size:10px}.qct-attention-clear{display:grid;grid-template-columns:40px 1fr;column-gap:12px;align-items:center;border-radius:16px;padding:16px;background:#effaf3}.qct-attention-clear>i{grid-row:1/3;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#d9f4e3;color:#159049}.qct-attention-clear strong{font-size:13px}.qct-attention-clear span{color:#69768c;font-size:11px}

  .qct-today-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.qct-today-grid>button{display:flex;align-items:center;gap:11px;min-width:0;border:1px solid #e5ebf3;border-radius:16px;padding:13px;background:#fff;text-align:left;color:inherit}.qct-today-grid>button>i{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#e7f7ec;color:#15924a;font-size:18px;flex:0 0 auto}.qct-today-grid>button:nth-child(2)>i{background:#fff0dc;color:#e28700}.qct-today-grid>button:nth-child(3)>i{background:#e8efff;color:#2760dd}.qct-today-grid span{display:grid;min-width:0}.qct-today-grid small{color:#6c7890;font-size:10px}.qct-today-grid strong{font-size:18px}.qct-today-grid em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7f8b9e;font-size:9px;font-style:normal}.qct-today nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}.qct-today nav button{display:grid;place-items:center;gap:7px;border:0;border-radius:14px;padding:12px 7px;background:#f6f8fc;color:#24344e;font-size:10px;font-weight:800}.qct-today nav i{font-size:19px;color:#2762e4}.qct-today nav button:nth-child(1) i{color:#16964a}.qct-today nav button:nth-child(3) i{color:#7141d8}.qct-today nav button:nth-child(4) i{color:#0da0aa}
}

@media (max-width:699px){
  .qct-role{gap:13px;padding:12px 10px 26px}.qct-head,.qct-summary,.qct-card{border-radius:20px}.qct-head{padding:20px 17px}.qct-head h2{font-size:23px}.qct-head p{font-size:13px}.qct-head aside{gap:7px}.qct-head time{font-size:12px}.qct-head aside span{padding:5px 9px;font-size:10px}
  .qct-summary{grid-template-columns:repeat(2,minmax(0,1fr));padding:17px 13px 0}.qct-stat{grid-template-columns:39px 1fr;padding:0 7px 15px}.qct-stat:nth-child(2){border-right:0}.qct-stat:nth-child(-n+2){margin-bottom:13px;border-bottom:1px solid #edf1f6;padding-bottom:13px}.qct-stat>span{width:38px;height:38px;font-size:16px}.qct-stat small{font-size:10px}.qct-stat strong{font-size:23px}.qct-summary footer{padding:13px 2px 15px}.qct-summary footer div{gap:5px}.qct-summary footer span{font-size:11px}.qct-summary footer strong{font-size:17px}.qct-summary footer small{max-width:185px}.qct-summary footer button{padding:10px 12px;font-size:11px}
  .qct-card{padding:17px 15px}.qct-card>header{margin-bottom:13px}.qct-card>header>button{padding:9px 10px;font-size:10px}.qct-teaching-metrics article{grid-template-columns:34px auto;padding:8px 7px}.qct-teaching-metrics i{width:34px;height:34px;border-radius:11px;font-size:14px}.qct-teaching-metrics strong{font-size:19px}.qct-teaching-metrics span{font-size:9px}.qct-missing span{font-size:10px}
  .qct-exam-score>strong{font-size:32px}.qct-performance-grid{grid-template-columns:1fr}.qct-performance-grid>article{padding:12px}.qct-attendance-grid{grid-template-columns:1fr}.qct-attendance-grid>aside{grid-template-columns:repeat(2,minmax(0,1fr))}.qct-attendance-grid aside button{padding:10px 9px}.qct-attendance-grid aside button>i{font-size:17px}
  .qct-student-row{grid-template-columns:35px minmax(82px,1fr) 48px 48px 17px;gap:6px}.qct-student-row>b{grid-column:2/5;justify-self:start}.qct-student-row>.fa-chevron-right{grid-column:5;grid-row:1}.qct-avatar{width:33px;height:33px}.qct-student-row>div strong{font-size:10px}.qct-student-row>em{font-size:10px}.qct-student-row>em small{display:none}
  .qct-today-grid{grid-template-columns:1fr}.qct-today-grid>button{padding:10px 12px}.qct-today nav{gap:5px}.qct-today nav button{padding:10px 3px;font-size:9px}.qct-today nav i{font-size:17px}
}

@media (prefers-reduced-motion:reduce){.qct-role *{scroll-behavior:auto!important;transition:none!important}}

@media (max-width:1024px){.qct-home-slide-hint{margin:0 2px 2px}}