.teacher-layout{grid-template-columns:minmax(340px,420px) minmax(0,1fr);align-items:start;gap:1rem;display:grid}.teacher-profile-column{gap:.82rem;display:grid;position:sticky;top:.6rem}.teacher-identity-card,.teacher-info-card,.teacher-classes-column{background:var(--panel-2);border:1px solid color-mix(in srgb, var(--border) 88%, var(--panel));border-radius:14px}.teacher-identity-card{text-align:center;padding:1rem;position:relative;overflow:hidden;& h1{z-index:1;margin:0;font-size:clamp(1.2rem,1.1rem + .42vw,1.55rem);line-height:1.2;position:relative}}.teacher-identity-backdrop{background:linear-gradient(120deg, color-mix(in srgb, var(--accent) 32%, transparent), color-mix(in srgb, var(--danger) 18%, transparent));opacity:.58;width:100%;height:7rem;position:absolute;inset:0 auto auto 0}.teacher-avatar-image,.teacher-avatar-placeholder{z-index:1;box-shadow:0 12px 24px color-mix(in srgb, var(--accent) 18%, transparent);border-radius:999px;justify-content:center;align-items:center;width:6.9rem;height:6.9rem;margin:40px auto .66rem;display:flex;position:relative}.teacher-avatar-image{object-fit:cover;background:linear-gradient(130deg, color-mix(in srgb, var(--green-primary-5) 78%, var(--green-terciary-5)), color-mix(in srgb, var(--green-primary-5) 38%, var(--green-terciary-5)));border:4px solid #0000}.teacher-avatar-placeholder{color:#fff;letter-spacing:.04em;background:linear-gradient(140deg,#1e5ea6,#437fc0 52%,#3a8b94);font-size:1.95rem;font-weight:800}.teacher-role-kicker{z-index:1;text-transform:uppercase;letter-spacing:.08em;color:color-mix(in srgb, var(--accent-strong) 80%, var(--text));margin:.22rem 0 .86rem;font-size:.72rem;font-weight:800;position:relative}.teacher-email-link,.teacher-email-empty{z-index:1;margin:0;position:relative}.teacher-email-link{border:1px solid color-mix(in srgb, var(--accent) 28%, var(--border));background:color-mix(in srgb, var(--panel) 72%, var(--panel-2));width:100%;color:var(--text);overflow-wrap:anywhere;border-radius:10px;justify-content:center;align-items:center;gap:.44rem;padding:.56rem .7rem;font-weight:700;text-decoration:none;display:inline-flex;&:hover{border-color:color-mix(in srgb, var(--accent) 54%, var(--border));color:var(--accent-strong)}& svg{flex-shrink:0;width:1.4rem;height:1.4rem}}.teacher-email-empty{color:var(--text-muted);font-size:.92rem;font-weight:600}.teacher-info-card{padding:1.2rem .9rem;position:relative;overflow:hidden;& h2{align-items:center;gap:.42rem;margin:0 0 .62rem;font-size:1rem;display:inline-flex;& svg{width:1.5rem;height:1.5rem;color:color-mix(in srgb, var(--accent-strong) 72%, var(--text));flex-shrink:0;margin:.1rem .4rem}}}.teacher-info-card--management{background:color-mix(in srgb, var(--accent) 5%, var(--panel-2));border-color:color-mix(in srgb, var(--accent) 16%, var(--border))}.teacher-info-card--attendance{isolation:isolate;& h2,& .teacher-attendance-list,& .teacher-attendance-note{z-index:1;position:relative}& h2{color:color-mix(in srgb, var(--accent-strong) 62%, var(--text))}}.teacher-info-card--attendance-open{background:color-mix(in srgb, var(--accent) 14%, var(--panel-2));border-color:color-mix(in srgb, var(--accent) 36%, var(--border))}.teacher-info-card--attendance-empty{background:color-mix(in srgb, var(--danger) 10%, var(--panel-2));border-color:color-mix(in srgb, var(--danger) 28%, var(--border));& .teacher-attendance-deco{color:color-mix(in srgb, var(--danger) 72%, var(--text))}& h2{color:color-mix(in srgb, var(--danger) 62%, var(--text))}}.teacher-attendance-deco{opacity:.14;width:7rem;height:7rem;color:color-mix(in srgb, var(--accent-strong) 72%, var(--text));pointer-events:none;z-index:0;position:absolute;top:-.7rem;right:-.9rem}.teacher-role-list,.teacher-attendance-list{gap:.5rem;margin:0;padding:0;list-style:none;display:grid;& li{background:color-mix(in srgb, var(--panel) 70%, transparent);border-radius:10px;align-items:center;gap:.48rem;padding:.48rem .54rem;font-weight:600;display:flex}}.teacher-attendance-list{& li{justify-content:flex-start;align-items:flex-start;gap:.56rem}}.teacher-role-icon{& svg{width:1.5rem;height:1.5rem;color:color-mix(in srgb, var(--accent-strong) 72%, var(--text));flex-shrink:0;margin-top:.1rem}}.teacher-attendance-day{text-transform:uppercase;letter-spacing:.04em;min-width:6.2rem;color:color-mix(in srgb, var(--accent-strong) 78%, var(--text));background:color-mix(in srgb, var(--panel) 40%, var(--accent) 16%);border-radius:6px;justify-content:center;align-items:center;padding:.32rem .48rem;font-size:.8rem;font-weight:800;display:inline-flex}.teacher-attendance-time{border:1px solid color-mix(in srgb, var(--accent) 36%, var(--border));color:color-mix(in srgb, var(--accent-strong) 82%, var(--text) 30%);background:0 0;border-radius:8px;align-items:center;padding:.24rem .52rem;font-size:.9rem;font-weight:700;display:inline-flex}.teacher-attendance-periods{flex-wrap:wrap;gap:.4rem;min-width:0;display:flex}.teacher-attendance-note{color:color-mix(in srgb, var(--danger) 50%, var(--text) 20%);margin:0;font-weight:600}.teacher-classes-column{min-width:0;padding:.88rem}.teacher-classes-head{border-bottom:1px solid color-mix(in srgb, var(--border) 88%, transparent);margin:0 0 .65rem;padding-bottom:.56rem;& h2{align-items:center;gap:.48rem;margin:0;display:inline-flex;& svg{width:1.8rem;height:1.8rem;color:color-mix(in srgb, var(--accent-strong) 82%, var(--text))}}& p{color:var(--text-muted);margin:.28rem 0 0;font-size:.92rem}}.teacher-classes-empty{color:color-mix(in srgb, var(--text) 50%, var(--text-muted));margin:0;font-weight:600}.teacher-schedule-block{border-radius:14px;min-width:0;overflow:hidden;&+&{margin-top:.9rem}& .mobile-day-panel{padding-bottom:0;display:none;&.is-active{display:block}}& .mobile-class-row{align-items:stretch;min-width:0}& .slot-stack{flex:1;gap:.5rem;display:grid}& .mobile-time-rail{justify-content:space-between;padding-top:.12rem}& .mobile-day-panels{width:100%;max-width:100%;display:block;overflow:hidden}& .mobile-day-tabs{box-sizing:border-box;width:100%;max-width:100%}& .mobile-class-card{min-width:0}}@media (width>=981px){.teacher-schedule-block{& .mobile-day-panel.is-active{animation:.4s ease-out teacher-day-switch-feedback}}}@keyframes teacher-day-switch-feedback{0%{opacity:.2;filter:saturate(.7);transform:translateY(-120px)}55%{opacity:1;filter:saturate();transform:translateY(0)}to{opacity:1;filter:saturate();transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.teacher-schedule-block{& .mobile-day-panel.is-active{animation:none}}}@media (width<=980px){.teacher-layout{grid-template-columns:1fr}.teacher-profile-column{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));align-items:stretch;position:static}.teacher-identity-card{grid-column:1/-1}.teacher-schedule-block{& .mobile-day-panel{scroll-snap-align:start;scroll-snap-stop:always;flex:0 0 100%;width:100%;display:block}& .mobile-day-panels{scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;display:flex;overflow-x:auto}}}@media (width<=760px){.teacher-classes-column{padding:.72rem}.teacher-profile-column{grid-template-columns:1fr}.teacher-schedule-block{& .mobile-day-tabs{gap:.32rem}}}
