.login-page{justify-content:center;align-items:center;min-height:100dvh;padding:24px 16px;display:flex;position:relative;overflow:hidden}.login-glow{filter:blur(30px);pointer-events:none;z-index:0;background:radial-gradient(circle,#ffffffb3 0%,#ffffff26 40%,#0000 70%);border-radius:50%;width:600px;height:600px;position:fixed;top:-20%;left:50%;transform:translate(-50%)}.login-container{z-index:1;background:radial-gradient(circle at 20% 10%, #fffffff2 0%, #ffffff94 20%, #fff0 40%), linear-gradient(180deg, var(--surface) 0%, #fafaf5 44%, var(--surface-2) 100%);border-radius:48px;width:100%;max-width:420px;padding:36px 24px 32px;position:relative;box-shadow:0 28px 60px #2c82602e}.login-deco{pointer-events:none;border-radius:0 48px 0 0;width:200px;height:200px;position:absolute;top:0;right:0;overflow:hidden}.deco-circle{border-radius:50%;position:absolute}.deco-circle.c1{background:var(--teal-light);opacity:.6;width:120px;height:120px;top:-30px;right:-20px}.deco-circle.c2{background:var(--orange-light);opacity:.5;width:60px;height:60px;top:40px;right:50px}.deco-circle.c3{background:var(--yellow-light);opacity:.7;width:30px;height:30px;top:20px;right:20px}.login-hero{border-radius:var(--radius-lg);background:linear-gradient(145deg, var(--teal-light) 0%, #e0f5ed 50%, var(--orange-light) 100%);justify-content:center;align-items:center;width:100%;height:220px;margin-bottom:24px;display:flex;position:relative;overflow:visible}.hero-trio{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.hero-img{border-radius:20px;transition:transform .4s cubic-bezier(.34,1.56,.64,1);position:absolute;overflow:hidden}.hero-img img{object-fit:contain;filter:drop-shadow(0 8px 20px #0000001f);width:100%;height:100%;display:block}.hero-img-left{z-index:1;width:110px;height:130px;bottom:-8px;left:8%;transform:rotate(-8deg)}.hero-img-center{z-index:3;width:140px;height:160px;top:50%;left:50%;transform:translate(-50%,-55%)}.hero-img-right{z-index:2;width:110px;height:130px;bottom:-8px;right:8%;transform:rotate(8deg)}.hero-trio:hover .hero-img-left{transform:rotate(-12deg)translate(-6px)}.hero-trio:hover .hero-img-center{transform:translate(-50%,-60%)scale(1.05)}.hero-trio:hover .hero-img-right{transform:rotate(12deg)translate(6px)}.login-text{margin-bottom:28px}.login-text h1{letter-spacing:-.05em;color:var(--text);font-size:32px;font-weight:800;line-height:1.05}.login-text h1 .accent{color:var(--teal)}.login-text p{color:var(--muted);margin-top:10px;font-size:14px;font-weight:500;line-height:1.5}.login-actions{flex-direction:column;gap:14px;display:flex}.login-btn{border-radius:var(--radius-lg);width:100%;height:82px;box-shadow:var(--shadow-md);cursor:pointer;background:#fff;border:none;align-items:center;gap:16px;padding:0 20px;transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s;display:flex}.login-btn:active{box-shadow:var(--shadow-soft);transform:scale(.97)}.login-btn:disabled{opacity:.6;pointer-events:none}.login-btn-icon{border-radius:50%;flex-shrink:0;place-items:center;width:52px;height:52px;display:grid}.login-btn-icon.bg-teal{background:var(--teal);box-shadow:0 8px 18px #3cb08a47}.login-btn-icon.bg-orange{background:var(--orange);box-shadow:0 8px 18px #ffa45b47}.login-btn-text{text-align:left;flex:1;min-width:0}.login-btn-title{letter-spacing:-.02em;color:var(--text);font-size:16px;font-weight:700;line-height:1.2;display:block}.login-btn-sub{color:var(--muted);margin-top:2px;font-size:12px;font-weight:500;display:block}.login-btn-arrow{color:var(--muted);opacity:.5;flex-shrink:0}.login-footer{text-align:center;color:var(--muted);opacity:.6;margin-top:24px;font-size:12px;font-weight:500}.login-error{color:#d44e5c;background:#ff6b7a1a;border-radius:16px;align-items:center;gap:10px;margin-bottom:8px;padding:12px 16px;font-size:13px;font-weight:600;animation:.3s fadeIn;display:flex}.login-loading{flex-direction:column;align-items:center;gap:12px;padding:32px 0;display:flex}.login-loading span{color:var(--muted);font-size:14px;font-weight:600}.student-home .top-bar{justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:8px;display:flex}.top-identity{align-items:center;gap:14px;min-width:0;display:flex}.avatar-float{background:linear-gradient(145deg,#d8f5e8,#b8e8d4);border-radius:50%;flex-shrink:0;width:68px;height:68px;position:relative;box-shadow:0 6px 16px #3cb08a26}.avatar-float-img{object-fit:cover;filter:drop-shadow(0 4px 8px #0000001a);border-radius:50%;width:78px;height:78px;position:absolute;top:-8px;left:-5px}.avatar-float.lg-float{width:80px;height:80px}.avatar-float.lg-float .avatar-float-img{width:94px;height:94px;top:-10px;left:-7px}.top-name{letter-spacing:-.03em;font-size:22px;font-weight:700;line-height:1.1}.top-sub{color:var(--muted);margin-top:3px;font-size:13px;font-weight:500}.icon-circle-btn{border:2.5px solid var(--border);cursor:pointer;background:#ffffffad;border-radius:50%;flex-shrink:0;place-items:center;width:52px;height:52px;display:grid}.hero-section{margin-top:16px;margin-bottom:4px}.hero-heading{letter-spacing:-.05em;font-size:32px;font-weight:800;line-height:1}.hero-heading .accent{color:var(--teal)}.hero-tag{color:#cf731f;align-items:center;gap:8px;margin-top:10px;font-size:13px;font-weight:600;display:flex}.week-switcher{justify-content:center;align-items:center;gap:16px;margin-top:16px;margin-bottom:10px;display:flex}.week-arrow:disabled{opacity:.3;cursor:default}.days-row-wrap{margin-top:8px}.days-row{display:flex;position:relative}.day-indicator{z-index:0;width:calc(100% / var(--day-count) - 6px);top:3px;bottom:3px;left:calc(var(--day-idx) * 100% / var(--day-count) + 3px);background:var(--teal);pointer-events:none;will-change:left;border-radius:22px;transition:left .35s cubic-bezier(.34,1.56,.64,1);position:absolute;box-shadow:0 8px 20px #3cb08a59}.day-card{cursor:pointer;z-index:1;-webkit-tap-highlight-color:transparent;background:0 0;border:2.5px solid #0000;border-radius:22px;flex-direction:column;flex:1;align-items:center;height:100px;padding:10px 2px 8px;transition:transform .15s;display:flex;position:relative}.day-card:active{transform:scale(.93)}.day-card.today:not(.active){border-color:var(--teal);background:#ffffffbf}.day-card:not(.active):not(.today){background:#ffffff80}.day-label{color:#70727b;font-size:11px;font-weight:600;transition:color .3s}.day-num{letter-spacing:-.03em;color:#24252c;margin-top:5px;font-size:18px;font-weight:700;transition:color .3s}.day-card.active .day-label,.day-card.active .day-num{color:#fff}.day-dot{border-radius:50%;place-items:center;width:26px;height:26px;margin-top:auto;font-size:11px;font-weight:700;transition:background .3s,color .3s;display:grid}.day-dot.has{color:var(--orange);background:#fff0e6}.day-card.active .day-dot.has{color:#fff;background:#ffffff40}.day-dot.empty{color:#c0c2ca;background:#f0f1f5}.day-card.active .day-dot.empty{color:#ffffff80;background:#ffffff1f}.info-banner{border-radius:var(--radius-sm);align-items:center;gap:10px;margin-top:14px;padding:12px 16px;font-size:12px;font-weight:500;line-height:1.4;display:flex}.info-banner.warn{background:var(--yellow-light);color:#8a6d12}.info-banner svg{flex-shrink:0}.schedule-list{margin-top:18px}.schedule-cards-wrap{transition:opacity .15s,transform .15s}.schedule-cards-wrap.fading{opacity:0;transform:translateY(6px)}.schedule-cards{flex-direction:column;gap:12px;display:flex}.schedule-card{width:100%;box-shadow:var(--shadow-md);cursor:pointer;background:#fff;border:2.5px solid #0000;border-radius:32px;flex-wrap:wrap;align-items:center;gap:14px;padding:16px 18px 14px;transition:border-color .25s,background .25s,box-shadow .25s,transform .15s;animation:.35s both cardEnter;display:flex;position:relative;overflow:hidden}@keyframes cardEnter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.schedule-card:active{transform:scale(.98)}.schedule-card.selected{border-color:var(--teal);background:var(--teal-light);box-shadow:0 14px 28px #3cb08a29}.schedule-card.disabled{opacity:.55;cursor:default}.sched-icon{border-radius:50%;flex-shrink:0;width:54px;height:54px;overflow:hidden}.sched-info{flex:1;min-width:0}.sched-info h4{letter-spacing:-.02em;margin:0 0 2px;font-size:15px;font-weight:700;line-height:1.15}.sched-teacher{color:var(--muted);margin:0;font-size:13px;font-weight:500}.sched-right{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:6px;display:flex}.sched-time{color:#4c4d56;align-items:center;gap:5px;font-size:13px;font-weight:700;display:flex}.sched-slots{color:var(--muted);font-size:12px;font-weight:700}.selected-bar{background:var(--teal);border-radius:0 4px 4px 0;width:5px;animation:.25s both barEnter;position:absolute;top:12px;bottom:12px;left:0;box-shadow:0 0 10px #3cb08a4d}@keyframes barEnter{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.sched-group{border-top:1px solid #0000000a;align-items:center;gap:6px;width:100%;margin-top:4px;padding-top:8px;display:flex}.group-more{color:var(--muted);font-size:12px;font-weight:700}.floating-confirm{bottom:calc(var(--nav-height) + var(--safe-bottom) + 24px);z-index:95;animation:.3s cubic-bezier(.34,1.56,.64,1) both floatUp;position:fixed;left:50%;transform:translate(-50%)}@keyframes floatUp{0%{opacity:0;transform:translate(-50%)translateY(20px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.confirm-fab{background:var(--teal);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:28px;justify-content:center;align-items:center;gap:10px;height:56px;padding:0 32px;font-family:inherit;font-size:15px;font-weight:700;transition:transform .15s,box-shadow .15s;display:flex;box-shadow:0 10px 28px #3cb08a66,0 4px 12px #00000014}.confirm-fab:active{transform:scale(.96);box-shadow:0 6px 18px #3cb08a4d}.confirm-fab:disabled{opacity:.7;cursor:default}.success-overlay{z-index:200;background:#00000059;place-items:center;padding:24px;animation:.2s fadeIn;display:grid;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.success-card{border-radius:var(--radius-xl);text-align:center;width:100%;max-width:340px;box-shadow:var(--shadow-lg);background:#fff;padding:40px 30px;animation:.3s cubic-bezier(.34,1.56,.64,1) both popIn}@keyframes popIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.success-img{object-fit:contain;width:100px;height:100px;margin:0 auto 18px}.success-card h3{letter-spacing:-.04em;margin-bottom:8px;font-size:22px;font-weight:800}.success-card p{color:var(--muted);font-size:14px;font-weight:500}.page-header{margin-bottom:20px}.page-title{letter-spacing:-.05em;margin-bottom:14px;font-size:28px;font-weight:800}.tab-pills{gap:8px;display:flex}.pill-btn{cursor:pointer;border:2px solid var(--border);height:38px;color:var(--muted);background:0 0;border-radius:19px;padding:0 18px;font-size:13px;font-weight:600;transition:all .25s}.pill-btn.active{background:var(--teal);color:#fff;border-color:var(--teal);box-shadow:0 8px 18px #3cb08a3d}.booking-list{flex-direction:column;gap:14px;display:flex}.booking-card{padding:18px;animation:.3s both cardEnter}.booking-card:first-child{animation-delay:0s}.booking-card:nth-child(2){animation-delay:40ms}.booking-card:nth-child(3){animation-delay:60ms}.booking-card:nth-child(4){animation-delay:80ms}.booking-top{align-items:center;gap:14px;margin-bottom:12px;display:flex}.booking-meta{flex:1;min-width:0}.booking-meta h4{letter-spacing:-.02em;margin:0 0 2px;font-size:15px;font-weight:700}.booking-meta p{color:var(--muted);margin:0;font-size:13px;font-weight:500}.booking-details{flex-wrap:wrap;gap:10px;display:flex}.detail-chip{color:var(--text-secondary);background:#f4f5f7;border-radius:14px;align-items:center;gap:5px;padding:6px 12px;font-size:12px;font-weight:600;display:flex}.detail-chip svg{color:var(--muted)}.booking-actions{border-top:1px solid #0000000d;margin-top:12px;padding-top:12px}.cancel-confirm-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.cancel-warn{color:var(--coral);margin-right:auto;font-size:12px;font-weight:600}.cancel-trigger{color:var(--coral);border-color:#ff6b7a4d}.attendance-row{margin-top:10px}.attendance-tag{border-radius:12px;align-items:center;padding:4px 12px;font-size:12px;font-weight:600;display:inline-flex}.attendance-tag.attended{background:var(--green-light);color:#3d8a28}.attendance-tag.absent{background:var(--coral-light);color:#d44e5c}.profile-avatar-section{text-align:center;margin-bottom:24px}.avatar-showcase{cursor:pointer;display:inline-block;position:relative}.avatar-edit-badge{background:var(--teal);border:3px solid var(--surface);z-index:2;border-radius:50%;place-items:center;width:28px;height:28px;display:grid;position:absolute;bottom:2px;right:-4px;box-shadow:0 4px 10px #3cb08a4d}.profile-name{letter-spacing:-.03em;margin-top:16px;font-size:22px;font-weight:800}.profile-role{color:var(--muted);margin-top:2px;font-size:14px;font-weight:500}.profile-info-card{margin-bottom:20px}.profile-info-row{border-bottom:1px solid #0000000a;justify-content:space-between;align-items:center;padding:14px 0;display:flex}.profile-info-row:last-child{border-bottom:none}.info-label{color:var(--muted);font-size:13px;font-weight:600}.info-value{color:var(--text);font-size:14px;font-weight:700}.profile-form{flex-direction:column;gap:0;margin-top:8px;display:flex}.form-group label{color:var(--text-secondary);margin-bottom:6px;font-size:13px;font-weight:600;display:block}.form-input{border:2.5px solid var(--border);width:100%;height:52px;color:var(--text);background:#fff;border-radius:22px;padding:0 18px;font-size:15px;font-weight:500;transition:border-color .2s}.form-input:focus{border-color:var(--teal)}.overlay{z-index:300;background:#0006;justify-content:center;align-items:flex-end;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.avatar-picker-sheet{background:var(--surface);border-radius:32px 32px 0 0;width:100%;max-width:520px;max-height:75vh;padding:16px 20px 32px;animation:.3s cubic-bezier(.34,1.56,.64,1) both slideUp;overflow-y:auto}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.picker-handle{background:var(--border);border-radius:2px;width:40px;height:4px;margin:0 auto 16px}.avatar-picker-sheet h3{letter-spacing:-.02em;text-align:center;margin-bottom:18px;font-size:18px;font-weight:700}.avatar-grid{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:10px;display:grid}.avatar-option{background:var(--teal-light);cursor:pointer;border:3px solid #0000;border-radius:50%;width:64px;height:64px;padding:0;transition:all .15s;overflow:hidden}.avatar-option img{object-fit:cover;width:100%;height:100%}.avatar-option.selected{border-color:var(--teal);box-shadow:0 0 0 3px #3cb08a33}.avatar-option:active{transform:scale(.92)}.onboarding-page{background:var(--bg);min-height:100dvh;padding:24px 20px 40px;position:relative;overflow-x:hidden}.onboarding-deco{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.deco-blob{filter:blur(80px);opacity:.18;border-radius:50%;position:absolute}.deco-blob.b1{background:var(--teal);width:300px;height:300px;top:-80px;right:-60px}.deco-blob.b2{background:var(--orange);width:250px;height:250px;bottom:-40px;left:-80px}.onboarding-content{z-index:1;max-width:440px;margin:0 auto;position:relative}.onboarding-header{text-align:center;margin-bottom:28px}.onboarding-title{letter-spacing:-.05em;font-size:32px;font-weight:800;line-height:1.05}.onboarding-title .accent{color:var(--teal)}.onboarding-sub{color:var(--muted);margin-top:10px;font-size:14px;font-weight:500;line-height:1.5}.onboarding-avatar-section{text-align:center;margin-bottom:28px}.avatar-hint{color:var(--muted);margin-top:10px;font-size:13px;font-weight:600}.onboarding-section{margin-bottom:22px}.onboarding-label{color:var(--text);letter-spacing:-.02em;margin-bottom:10px;font-size:14px;font-weight:700;display:block}.option-pills{flex-wrap:wrap;gap:10px;display:flex}.option-pill{cursor:pointer;border:2.5px solid var(--border);height:44px;color:var(--text-secondary);background:#fff;border-radius:22px;padding:0 22px;font-family:inherit;font-size:14px;font-weight:700;transition:all .2s}.option-pill:active{transform:scale(.95)}.option-pill.active{background:var(--teal);color:#fff;border-color:var(--teal);box-shadow:0 6px 16px #3cb08a4d}.onboarding-submit{justify-content:center;align-items:center;gap:8px;height:56px;margin-top:8px;font-size:16px;display:flex}.onboarding-submit.disabled{opacity:.4;cursor:default}.icon-circle-btn{position:relative}.notif-badge{color:#fff;border:2px solid var(--bg);background:#ff4757;border-radius:10px;place-items:center;min-width:20px;height:20px;padding:0 5px;font-size:11px;font-weight:700;line-height:1;animation:.3s cubic-bezier(.34,1.56,.64,1) both badgePop;display:grid;position:absolute;top:2px;right:2px}@keyframes badgePop{0%{transform:scale(0)}to{transform:scale(1)}}.notif-sheet{background:var(--surface);border-radius:32px 32px 0 0;width:100%;max-width:520px;max-height:80vh;padding:16px 20px 32px;animation:.3s cubic-bezier(.34,1.56,.64,1) both slideUp;overflow-y:auto}.notif-sheet-header{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.notif-sheet-header h3{letter-spacing:-.02em;font-size:18px;font-weight:700}.notif-mark-all{color:var(--teal);cursor:pointer;background:0 0;border:none;border-radius:8px;padding:4px 8px;font-size:13px;font-weight:600;transition:background .15s}.notif-mark-all:active{background:var(--teal-light)}.notif-empty{text-align:center;color:var(--muted);padding:40px 20px}.notif-empty svg{margin-bottom:12px}.notif-empty p{font-size:14px;font-weight:600}.notif-list{flex-direction:column;gap:4px;display:flex}.notif-item{cursor:pointer;border-radius:20px;align-items:flex-start;gap:12px;padding:14px 12px;transition:background .15s;display:flex;position:relative}.notif-item:active{background:#00000008}.notif-item.unread{background:#3cb08a0f}.notif-icon{border-radius:50%;flex-shrink:0;place-items:center;width:40px;height:40px;display:grid}.notif-icon.notif-green{background:var(--teal)}.notif-icon.notif-red{background:var(--coral)}.notif-icon.notif-blue{background:#5b8def}.notif-body{flex:1;min-width:0}.notif-body h4{letter-spacing:-.01em;margin:0 0 3px;font-size:14px;font-weight:700}.notif-body p{color:var(--text-secondary);margin:0 0 4px;font-size:13px;font-weight:500;line-height:1.4}.notif-time{color:var(--muted);font-size:11px;font-weight:600}.notif-unread-dot{background:var(--teal);border-radius:50%;flex-shrink:0;width:10px;height:10px;margin-top:6px}.teacher-dashboard .top-bar{justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:8px;display:flex}.status-online{color:var(--green);align-items:center;gap:6px;margin-top:3px;font-size:13px;font-weight:500;display:flex}.online-dot{background:var(--green);border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 3px #6dc53d26}.stats-strip{grid-template-columns:repeat(4,1fr);gap:10px;margin-top:18px;margin-bottom:28px;display:grid}.stat-mini{border-radius:var(--radius-sm);text-align:center;padding:14px 10px;animation:.3s both cardEnter}.stat-mini:first-child{animation-delay:0s}.stat-mini:nth-child(2){animation-delay:50ms}.stat-mini:nth-child(3){animation-delay:.1s}.stat-mini:nth-child(4){animation-delay:.15s}.stat-value{letter-spacing:-.05em;font-size:26px;font-weight:800;line-height:1;display:block}.stat-label{color:var(--muted);margin-top:4px;font-size:11px;font-weight:600;display:block}.count-tag{color:var(--muted);font-size:13px;font-weight:600}.teacher-booking-list{flex-direction:column;gap:12px;display:flex}.t-booking-card{padding:16px;animation:.3s both cardEnter}.t-booking-card.pending-highlight{border:2px solid var(--orange);background:var(--orange-light)}.t-booking-top{align-items:center;gap:12px;margin-bottom:10px;display:flex}.t-booking-info{flex:1;min-width:0}.t-booking-info h4{letter-spacing:-.02em;margin:0 0 2px;font-size:15px;font-weight:700}.t-booking-info p{color:var(--muted);margin:0;font-size:12px;font-weight:500}.t-booking-time{text-align:right;flex-shrink:0}.time-text{letter-spacing:-.02em;font-size:15px;font-weight:700;display:block}.dur-text{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;max-width:110px;margin-top:2px;font-size:11px;font-weight:500;display:block;overflow:hidden}.t-booking-bottom{border-top:1px solid #0000000a;justify-content:space-between;align-items:center;padding-top:10px;display:flex}.booking-date-tag{color:var(--text-secondary);background:#f4f5f7;border-radius:12px;padding:4px 12px;font-size:12px;font-weight:600}.link-btn{color:var(--teal);cursor:pointer;background:0 0;border:none;font-size:13px;font-weight:600}.teacher-timetable-v2 .week-nav{align-items:center;gap:12px;margin-top:-6px;display:flex}.week-arrow{border:2px solid var(--border);cursor:pointer;width:34px;height:34px;color:var(--text);background:#fff;border-radius:12px;place-items:center;transition:transform .15s;display:grid}.week-arrow:active{transform:scale(.9)}.week-label-text{color:var(--text);letter-spacing:-.02em;text-align:center;min-width:100px;font-size:14px;font-weight:700}.tt-deco-strip{text-align:center;margin:12px 0 8px}.tt-deco-strip img{opacity:.65;width:80px;height:auto;margin:0 auto}.tt-day-list{flex-direction:column;gap:6px;display:flex}.tt-day-section{animation:.3s both cardEnter}.tt-day-section.is-today{position:relative}.tt-day-section.is-today:before{content:"TODAY";letter-spacing:.08em;color:#fff;background:var(--teal);border-radius:8px;padding:2px 8px;font-size:9px;font-weight:800;position:absolute;top:8px;right:0}.tt-day-head{align-items:center;gap:12px;padding:10px 0 6px;display:flex}.tt-date-badge{text-align:center;flex-shrink:0;width:52px}.tt-date-badge.today .tt-date-num{color:var(--teal)}.tt-date-num{letter-spacing:-.04em;color:var(--text);font-size:22px;font-weight:800;line-height:1;display:block}.tt-date-label{color:var(--muted);margin-top:2px;font-size:11px;font-weight:600;display:block}.tt-day-line{background:var(--border);flex:1;height:1.5px}.tt-day-count{color:var(--teal);white-space:nowrap;font-size:11px;font-weight:700}.tt-no-class{color:var(--muted);padding:6px 0 14px 64px;font-size:13px;font-weight:500}.tt-slots{border-left:2px solid var(--border);flex-direction:column;gap:10px;margin-left:25px;padding:4px 0 14px 20px;display:flex}.tt-slot{border-radius:var(--radius-md);box-shadow:var(--shadow-soft);cursor:pointer;background:#fff;transition:box-shadow .2s;overflow:hidden}.tt-slot:active{box-shadow:var(--shadow-md)}.tt-slot-color{background:linear-gradient(90deg, var(--teal), var(--blue-soft));height:4px}.tt-slot.expanded .tt-slot-color{background:linear-gradient(90deg, var(--teal), var(--green))}.tt-slot-header{align-items:center;gap:14px;padding:14px 16px;display:flex}.tt-slot-time-block{flex-direction:column;flex-shrink:0;align-items:center;min-width:50px;display:flex}.tt-slot-time{letter-spacing:-.03em;color:var(--teal);font-size:14px;font-weight:800;line-height:1.1}.tt-slot-sep{color:var(--muted);font-size:10px;line-height:1}.tt-slot-meta{flex:1;min-width:0}.tt-slot-subject{letter-spacing:-.02em;margin:0 0 6px;font-size:14px;font-weight:700;line-height:1.2}.tt-slot-summary{align-items:center;gap:8px;display:flex}.tt-slot-count{color:var(--muted);font-size:12px;font-weight:700}.tt-chevron{color:var(--muted);flex-shrink:0;transition:transform .25s}.tt-chevron.open{transform:rotate(180deg)}.tt-student-list{border-top:1px solid #0000000a;flex-direction:column;gap:10px;padding:12px 16px 14px;animation:.25s both expandIn;display:flex}@keyframes expandIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.tt-student-row{align-items:center;gap:12px;display:flex}.tt-student-info{flex-direction:column;flex:1;min-width:0;display:flex}.tt-student-name{letter-spacing:-.02em;font-size:14px;font-weight:700}.tt-student-class{color:var(--muted);font-size:11px;font-weight:500}.tt-student-status{flex-shrink:0}.filter-row{flex-wrap:wrap;gap:8px;margin-bottom:14px;display:flex}.date-range-row{align-items:center;gap:8px;margin-bottom:12px;display:flex}.date-input{border-radius:16px;flex:1;height:44px;font-size:13px}.date-separator{color:var(--muted);font-size:13px;font-weight:600}.search-row{gap:8px;margin-bottom:16px;display:flex}.search-row .form-input{border-radius:18px;flex:1;height:44px;font-size:13px}.summary-strip{grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px;display:grid}.summary-item{text-align:center;border-radius:var(--radius-sm);box-shadow:var(--shadow-soft);background:#fff;padding:12px 4px}.summary-num{letter-spacing:-.04em;color:var(--teal);font-size:22px;font-weight:800;display:block}.summary-label{color:var(--muted);margin-top:2px;font-size:10px;font-weight:600;display:block}.export-row{gap:10px;margin-bottom:18px;display:flex}.records-list{flex-direction:column;gap:12px;display:flex}.record-card{padding:14px 16px;animation:.3s both cardEnter}.record-top{align-items:center;gap:12px;margin-bottom:10px;display:flex}.record-meta{flex:1;min-width:0}.record-meta h4{letter-spacing:-.02em;margin:0 0 2px;font-size:14px;font-weight:700}.record-meta p{color:var(--muted);margin:0;font-size:12px;font-weight:500}.record-details{flex-wrap:wrap;gap:6px;display:flex}.record-details .detail-chip{border-radius:12px;padding:4px 10px;font-size:11px}.attended-chip{background:var(--green-light)!important;color:#3d8a28!important}.absent-chip{background:var(--coral-light)!important;color:#d44e5c!important}.page-subtitle{color:var(--muted);margin-top:4px;font-size:13px;font-weight:500}.slot-day-label{margin-bottom:14px;font-size:15px;font-weight:700}.slot-list{flex-direction:column;gap:12px;display:flex}.slot-card{justify-content:space-between;align-items:center;gap:14px;transition:opacity .25s;display:flex}.slot-card.closed{opacity:.5}.slot-info h4{margin:0 0 2px;font-size:14px;font-weight:700}.slot-info p{color:var(--muted);margin:0;font-size:12px;font-weight:500}.toggle-btn{cursor:pointer;border:none;border-radius:15px;flex-shrink:0;width:52px;height:30px;padding:3px;transition:background .3s cubic-bezier(.34,1.56,.64,1)}.toggle-btn.on{background:var(--teal)}.toggle-btn.off{background:#d0d2d8}.toggle-knob{background:#fff;border-radius:50%;width:24px;height:24px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);display:block;box-shadow:0 2px 6px #00000026}.toggle-btn.on .toggle-knob{transform:translate(22px)}.checkin-list{flex-direction:column;gap:12px;display:flex}.checkin-card{padding:16px;animation:.3s both cardEnter}.checkin-top{align-items:center;gap:14px;margin-bottom:12px;display:flex}.checkin-meta{flex:1;min-width:0}.checkin-meta h4{margin:0 0 2px;font-size:15px;font-weight:700}.checkin-meta p{color:var(--muted);margin:0;font-size:12px;font-weight:500}.checkin-time{color:var(--teal)!important;font-weight:600!important}.checkin-actions{border-top:1px solid #0000000a;justify-content:flex-end;gap:10px;padding-top:10px;display:flex}.admin-panel .tab-pills{flex-wrap:wrap;gap:8px;display:flex}.admin-stats-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}@media (width<=420px){.admin-stats-grid{grid-template-columns:repeat(2,1fr)}}.admin-teacher-list,.admin-homeroom-list{flex-direction:column;gap:10px;display:flex}.admin-teacher-row,.admin-homeroom-row{align-items:center;gap:14px;padding:14px 16px;display:flex}.admin-filter-row{gap:8px;margin-bottom:12px;display:flex}.admin-select{border:2.5px solid var(--border);height:44px;color:var(--text);cursor:pointer;appearance:auto;background:#fff;border-radius:16px;flex:1;padding:0 12px;font-size:13px}.admin-form-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}@media (width<=420px){.admin-form-grid{grid-template-columns:1fr}}.admin-form-label{color:var(--muted);margin-bottom:4px;font-size:12px;font-weight:600;display:block}.admin-form-grid .form-input{border-radius:14px;height:40px;font-size:13px}.admin-teacher-manage-list{flex-direction:column;gap:10px;display:flex}.admin-teacher-manage-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;display:flex}.admin-tm-left{align-items:center;gap:12px;min-width:0;display:flex}.admin-tm-info{min-width:0}.admin-tm-info h4{letter-spacing:-.02em;margin:0 0 3px;font-size:14px;font-weight:700}.admin-tm-badges{flex-wrap:wrap;gap:6px;display:flex}.admin-tm-badge{letter-spacing:.02em;border-radius:8px;padding:2px 8px;font-size:10px;font-weight:700}.admin-tm-badge.admin{background:var(--orange-light);color:var(--orange)}.admin-tm-badge.linked{background:var(--green-light);color:var(--green)}.admin-tm-badge.unlinked{color:var(--muted);background:#f0f1f5}.admin-tm-right{flex-shrink:0;align-items:center;gap:10px;display:flex}.admin-tm-phone{color:var(--text);font-variant-numeric:tabular-nums;font-size:13px;font-weight:600}.admin-tm-edit{align-items:center;gap:6px;width:100%;margin-top:6px;display:flex}.atm-hint{color:var(--muted);background:var(--blue-light);border-radius:14px;margin-bottom:16px;padding:10px 14px;font-size:12px;line-height:1.6}.atm-list{flex-direction:column;gap:10px;display:flex}.atm-add-form{background:#38d9a90a;border:2px dashed #38d9a94d;margin-bottom:16px;padding:18px}.atm-add-title{color:var(--text);align-items:center;gap:8px;margin:0 0 14px;font-size:15px;font-weight:700;display:flex}.atm-add-fields{grid-template-columns:1fr 1fr;gap:12px;display:grid}@media (width<=500px){.atm-add-fields{grid-template-columns:1fr}}.atm-field label{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:5px;font-size:11px;font-weight:700;display:block}.atm-field .form-input{border-radius:12px;height:40px;font-size:13px}.atm-add-actions{justify-content:flex-end;margin-top:14px;display:flex}.atm-error{color:var(--coral);margin:8px 0 0;font-size:12px;font-weight:600}.atm-card{padding:0;transition:box-shadow .2s;overflow:hidden}.atm-card:hover{box-shadow:0 4px 20px #0000000f}.atm-inactive{opacity:.55}.atm-inactive:hover{opacity:.8}.atm-main-row{cursor:pointer;-webkit-tap-highlight-color:transparent;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;transition:background .15s;display:flex}@media (hover:hover){.atm-main-row:hover{background:#00000004}}.atm-left{flex:1;align-items:center;gap:12px;min-width:0;display:flex}.atm-info{min-width:0}.atm-info h4{letter-spacing:-.02em;margin:0 0 4px;font-size:15px;font-weight:700}.atm-badges{flex-wrap:wrap;gap:5px;display:flex}.atm-badge{letter-spacing:.02em;white-space:nowrap;border-radius:7px;padding:2px 7px;font-size:10px;font-weight:700}.badge-admin{background:var(--orange-light);color:var(--orange)}.badge-linked{background:var(--green-light);color:var(--green)}.badge-unlinked{color:var(--muted);background:#f0f1f5}.badge-inactive{background:var(--coral-light);color:var(--coral)}.badge-count{background:var(--blue-light);color:var(--blue-soft)}.atm-right{flex-shrink:0;align-items:center;gap:10px;display:flex}.atm-phone{color:var(--text);font-variant-numeric:tabular-nums;font-size:13px;font-weight:600}.atm-no-phone{color:var(--coral);font-weight:600}.atm-chevron{flex-shrink:0;transition:transform .25s}.atm-chevron.rotated{transform:rotate(180deg)}.atm-expanded{border-top:1px solid #0000000d;padding:14px 16px 16px;animation:.25s slideDown}@keyframes slideDown{0%{opacity:0;max-height:0}to{opacity:1;max-height:1200px}}.atm-actions{flex-wrap:wrap;gap:8px;margin-bottom:14px;display:flex}.atm-edit-form{background:var(--blue-light);border-radius:14px;margin-bottom:14px;padding:14px}.atm-edit-fields{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px;display:grid}@media (width<=500px){.atm-edit-fields{grid-template-columns:1fr}}.atm-schedules-section{margin-top:2px}.atm-sched-header{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.atm-sched-header h5{color:var(--text);letter-spacing:-.01em;margin:0;font-size:13px;font-weight:800}.atm-empty{color:var(--muted);text-align:center;padding:18px 0;font-size:12px}.atm-sched-list{flex-direction:column;gap:6px;display:flex}.atm-sched-item{background:#00000005;border-radius:12px;align-items:center;gap:10px;padding:10px 12px;transition:background .15s;display:flex}.atm-sched-item:hover{background:#0000000a}.atm-sched-day{text-align:center;flex-shrink:0;width:40px}.atm-sched-day-name{color:var(--teal);background:var(--teal-light);border-radius:8px;padding:3px 8px;font-size:12px;font-weight:800}.atm-sched-info{flex-wrap:wrap;flex:1;align-items:center;gap:8px;min-width:0;display:flex}.atm-sched-time{color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:13px;font-weight:700}.atm-sched-subject{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;max-width:180px;font-size:12px;overflow:hidden}.atm-sched-cap{color:var(--blue-soft);background:var(--blue-light);white-space:nowrap;border-radius:6px;padding:2px 7px;font-size:10px;font-weight:700}.atm-sched-bookings{color:var(--orange);background:var(--orange-light);white-space:nowrap;border-radius:6px;padding:2px 7px;font-size:10px;font-weight:700}.atm-sched-btns{flex-shrink:0;gap:4px;display:flex}.btn-icon-sm{cursor:pointer;background:#fff;border:1px solid #00000014;border-radius:8px;justify-content:center;align-items:center;width:30px;height:30px;transition:all .15s;display:flex}.btn-icon-sm:hover{background:#f5f5f8;border-color:#00000026;transform:scale(1.05)}.slot-form-card{border:2px solid var(--orange);background:var(--orange-light);border-radius:var(--radius-lg);margin-bottom:12px;padding:16px 24px 14px}.slot-form-title{letter-spacing:-.02em;color:var(--text);margin:0 0 12px;font-size:14px;font-weight:700}.slot-form-card .slot-form-group{margin-bottom:10px}.slot-form-label{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px;font-size:10px;font-weight:700;display:block}.slot-form-input{border:2px solid var(--border);width:100%;min-width:0;max-width:100%;height:44px;color:var(--text);box-sizing:border-box;appearance:none;background:#fff;border-radius:14px;margin:0;padding:0 14px;font-family:inherit;font-size:14px;line-height:40px;display:block}select.slot-form-input{appearance:auto}input[type=number].slot-form-input::-webkit-inner-spin-button{opacity:1}input[type=number].slot-form-input::-webkit-outer-spin-button{opacity:1}.slot-form-input:focus{border-color:var(--orange);outline:none}.slot-form-actions{border-top:1px solid #0000000f;justify-content:flex-end;gap:8px;margin-top:2px;padding-top:10px;display:flex}.bottom-nav{width:calc(100% - 40px);max-width:480px;height:72px;padding:0 6px;padding-bottom:var(--safe-bottom);z-index:100;background:#26272c;border-radius:36px;justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:14px;left:50%;transform:translate(-50%);box-shadow:0 16px 30px #14151c47}.nav-indicator{top:50%;left:calc((var(--active-idx) * (100% - 12px) / var(--tab-count)) + ((100% - 12px) / var(--tab-count) - 52px) / 2 + 6px);background:var(--teal);z-index:0;pointer-events:none;border-radius:18px;width:52px;height:52px;transition:left .35s cubic-bezier(.34,1.56,.64,1);position:absolute;transform:translateY(-50%);box-shadow:0 6px 18px #3cb08a66,inset 0 1px #ffffff2e}.nav-tab{z-index:1;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:16px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;min-width:0;height:100%;padding:4px 0;display:flex;position:relative}.nav-tab:active{transform:scale(.92)}.nav-icon-wrap{place-items:center;width:26px;height:26px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);display:grid}.nav-tab.active .nav-icon-wrap{transform:scale(1.08)}.nav-tab .nav-label{color:#6b6e78;letter-spacing:.02em;font-size:9px;font-weight:600;line-height:1;transition:color .25s,opacity .25s}.nav-tab.active .nav-label{color:#fff;font-weight:700}.loading-spinner{border:3px solid var(--border);border-top-color:var(--teal);border-radius:50%;width:36px;height:36px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.page-loading{place-items:center;min-height:300px;display:grid}:root{--bg-1:#c8f0df;--bg-2:#a4e4ca;--bg-3:#7ad4b2;--surface:#fcfcf7;--surface-2:#f6f7f2;--teal:#3cb08a;--teal-deep:#2d9e7e;--teal-light:#e6f9f1;--orange:#ffa45b;--orange-light:#fff1e6;--coral:#ff6b7a;--coral-light:#ffe6e9;--yellow:#ffd556;--yellow-light:#fff8e0;--blue-soft:#6ea8ff;--blue-light:#e8f1ff;--green:#6dc53d;--green-light:#edf9e4;--text:#23242b;--text-secondary:#5d606b;--muted:#6e707a;--border:#e7e7e6;--badge-dark:#2a2c33;--radius-xs:14px;--radius-sm:20px;--radius-md:28px;--radius-lg:38px;--radius-xl:48px;--radius-full:9999px;--shadow-soft:0 12px 24px #2c82600f;--shadow-md:0 18px 38px #2c826014;--shadow-lg:0 28px 60px #2c826029;--shadow-card:0 14px 28px #2c82601a;--glass-bg:#ffffff14;--glass-border:#ffffff1f;--glass-highlight:inset 0 1px 0 #ffffff24;--nav-height:72px;--safe-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100dvh;color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Poppins,-apple-system,BlinkMacSystemFont,sans-serif}body{background:radial-gradient(circle at 50% 18%, #ffffffb8 0%, #ffffff24 22%, transparent 44%), linear-gradient(180deg, var(--bg-1) 0%, var(--bg-2) 48%, var(--bg-3) 100%);background-attachment:fixed}button{cursor:pointer;border:none;outline:none;font-family:inherit}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}input,select,textarea{outline:none;font-family:inherit}.page-shell{background:radial-gradient(circle at 20% 10%, #fffffff2 0%, #ffffff94 20%, #fff0 40%), linear-gradient(180deg, var(--surface) 0%, #fafaf5 44%, var(--surface-2) 100%);width:100%;max-width:520px;min-height:100dvh;margin:0 auto;position:relative;overflow-x:hidden;box-shadow:0 0 80px #2c82601f}@media (width>=521px){.page-shell{border-radius:42px;min-height:calc(100vh - 48px);margin-top:24px;margin-bottom:24px}}.page-content{padding:24px 20px;padding-bottom:calc(var(--nav-height) + var(--safe-bottom) + 24px)}.page-content::-webkit-scrollbar{display:none}.page-content{-ms-overflow-style:none;scrollbar-width:none}.card{border-radius:var(--radius-lg);box-shadow:var(--shadow-md);background:#fff;padding:18px 20px}.card+.card{margin-top:14px}.glass-card{background:var(--glass-bg);border:1.5px solid var(--glass-border);box-shadow:var(--glass-highlight);-webkit-backdrop-filter:blur(12px);border-radius:var(--radius-lg);padding:18px 20px}.circle-icon{border-radius:50%;flex-shrink:0;place-items:center;width:60px;height:60px;display:grid}.circle-icon svg{color:#fff;width:28px;height:28px}.circle-icon.sm{width:44px;height:44px}.circle-icon.sm svg{width:20px;height:20px}.bg-teal{background:var(--teal)}.bg-orange{background:var(--orange)}.bg-coral{background:var(--coral)}.bg-yellow{background:var(--yellow)}.bg-blue{background:var(--blue-soft)}.avatar{background:var(--teal-light);border-radius:50%;flex-shrink:0;width:52px;height:52px;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.avatar.lg{width:74px;height:74px}.avatar.sm{width:36px;height:36px}.avatar.xs{width:28px;height:28px}.avatar-stack{align-items:center;display:flex}.avatar-stack .avatar{border:3px solid #fff;margin-left:-10px}.avatar-stack .avatar:first-child{margin-left:0}.status-badge{border-radius:var(--radius-full);letter-spacing:.02em;align-items:center;gap:5px;height:28px;padding:0 12px;font-size:11px;font-weight:700;display:inline-flex}.status-badge .dot{border-radius:50%;width:7px;height:7px}.status-confirmed{background:var(--green-light);color:#3d8a28}.status-confirmed .dot{background:var(--green)}.status-pending{background:var(--yellow-light);color:#b8901a}.status-pending .dot{background:var(--yellow)}.status-cancelled{background:var(--coral-light);color:#d44e5c}.status-cancelled .dot{background:var(--coral)}.btn-pill{border-radius:26px;justify-content:center;align-items:center;gap:8px;height:52px;padding:0 28px;font-size:15px;font-weight:700;transition:transform .15s,box-shadow .15s;display:inline-flex}.btn-pill:active{transform:scale(.96)}.btn-primary{background:var(--teal);color:#fff;box-shadow:0 14px 28px #3cb08a4d}.btn-dark{background:var(--badge-dark);color:#fff;box-shadow:0 14px 28px #2a2c333d}.btn-outline{color:var(--text);border:2.5px solid var(--border);background:0 0}.btn-danger{background:var(--coral);color:#fff;box-shadow:0 14px 28px #ff6b7a3d}.btn-sm{border-radius:19px;height:38px;padding:0 18px;font-size:13px}.btn-full{width:100%}.section-header{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.section-header h2{letter-spacing:-.02em;font-size:18px;font-weight:700}.section-header h3{letter-spacing:-.02em;font-size:16px;font-weight:700}.empty-state{text-align:center;padding:40px 20px}.empty-state img{opacity:.8;width:160px;height:auto;margin:0 auto 20px}.empty-state p{color:var(--muted);font-size:15px;font-weight:500}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:.35s ease-out both fadeInUp}.delay-1{animation-delay:50ms}.delay-2{animation-delay:.1s}.delay-3{animation-delay:.15s}.delay-4{animation-delay:.2s}.delay-5{animation-delay:.25s}