:root{--navy:#0d2454;--navy2:#173d80;--sky:#2f6ee9;--paper:#f5f7fb;--line:#e0e7f2;--ink:#162642;--muted:#65738d;--green:#16864b;--yellow:#e7b524;--red:#cc3345;--white:#fff;--shadow:0 12px 35px rgba(13,36,84,.08)}
*{box-sizing:border-box}html{font-family:system-ui,-apple-system,"Segoe UI",Tahoma,Arial,sans-serif;color:var(--ink);background:var(--paper)}body{margin:0;min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:default}a{color:var(--sky)}.hidden{display:none!important}.boot{display:grid;min-height:100vh;place-items:center;color:var(--navy);font-weight:800;font-size:24px}
.login-shell{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}.login-brand{background:linear-gradient(140deg,#08183e,#1e4e9a);color:white;display:flex;flex-direction:column;justify-content:space-between;padding:56px;position:relative;overflow:hidden}.login-brand:after{content:'';position:absolute;width:500px;height:500px;border:70px solid #ffffff0c;border-radius:50%;left:-210px;bottom:-260px}.login-brand h1{font-size:clamp(32px,5vw,62px);line-height:1.13;letter-spacing:-1px;margin:0}.login-brand p{font-size:18px;opacity:.76;max-width:370px;line-height:2}.brand-kicker{letter-spacing:2px;font-weight:800;font-size:13px}.login-pane{padding:10vw max(30px,9vw);display:flex;flex-direction:column;justify-content:center;gap:18px}.login-pane h2{font-size:30px;margin:4px 0}.login-pane p{color:var(--muted);line-height:1.8}.logo-mark{display:inline-flex;align-items:center;justify-content:center;background:#fff;border-radius:14px;color:var(--navy);font-size:22px;font-weight:900;letter-spacing:-2px;width:61px;height:61px;direction:ltr}.logo-mark.mini{width:42px;height:42px;border-radius:11px;font-size:16px;background:#eef4ff}.form-row{display:flex;flex-wrap:wrap;gap:12px}.form-row>*{flex:1;min-width:170px}.field{display:flex;flex-direction:column;gap:7px;margin-bottom:13px}.field>span{font-weight:700;font-size:13px}.field input,.field select,.field textarea,.select{border:1px solid #cdd8e8;background:white;border-radius:10px;padding:12px 13px;color:var(--ink);min-height:46px;width:100%;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--sky);box-shadow:0 0 0 3px #2f6ee917}.field textarea{min-height:92px;resize:vertical}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;border:none;border-radius:10px;font-weight:750;padding:10px 16px;white-space:nowrap}.btn.primary{background:var(--navy);color:white}.btn.blue{background:var(--sky);color:white}.btn.ghost{background:#edf2fa;color:var(--navy)}.btn.outline{background:white;border:1px solid var(--line);color:var(--navy)}.btn.danger{background:#fff0f2;color:var(--red)}.btn:focus-visible,.class-pill:focus-visible{outline:3px solid #67a2ff;outline-offset:2px}.btn.small{font-size:12px;padding:7px 9px;min-height:31px}.btn.full{width:100%}.small-muted{font-size:12px;color:var(--muted);line-height:1.8}.topbar{background:var(--navy);color:white;position:sticky;z-index:10;top:0;box-shadow:0 5px 20px #0d245421}.topinner{max-width:1400px;margin:auto;display:flex;align-items:center;gap:12px;padding:13px 22px}.topinner .brand-title{font-weight:900;font-size:18px;direction:ltr}.topinner .brand-sub{font-size:11px;opacity:.6;direction:ltr}.top-user{margin-right:auto;display:flex;align-items:center;gap:12px;min-width:0}.chip{border-radius:99px;padding:6px 10px;display:inline-flex;align-items:center;gap:5px;background:#eaf0f9;color:var(--navy);font-weight:700;font-size:12px}.topbar .chip{background:#ffffff22;color:white}.topbar .btn.ghost{background:#ffffff1c;color:white}.layout{max-width:1400px;margin:auto;padding:24px 22px 55px}.welcome{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}.welcome h1{font-size:clamp(23px,3vw,32px);margin:0 0 7px}.welcome p{color:var(--muted);margin:0}.stats{display:flex;flex-wrap:wrap;gap:8px}.stat{background:white;border:1px solid var(--line);border-radius:12px;padding:10px 14px;min-width:98px}.stat strong{display:block;font-size:21px}.stat span{font-size:12px;color:var(--muted)}.lab-banner{background:linear-gradient(105deg,#e3f6ea,#f4fbf7);border:1px solid #b3e3c6;padding:16px 20px;border-radius:16px;display:flex;align-items:center;gap:14px;margin-bottom:19px}.lab-dot{background:var(--green);width:12px;height:12px;box-shadow:0 0 0 6px #23a55b1d;border-radius:50%}.lab-banner strong{font-size:17px}.lab-banner p{margin:4px 0 0;color:#4d7864;font-size:13px}.lab-banner .chip{margin-right:auto;background:#fff;color:#167445}.navtabs{display:flex;overflow:auto;gap:5px;margin-bottom:18px;border-bottom:1px solid var(--line)}.tab{border:0;background:transparent;color:var(--muted);padding:13px 18px;border-bottom:3px solid transparent;font-weight:700;white-space:nowrap}.tab.active{color:var(--navy);border-bottom-color:var(--sky)}.panel{background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow);margin-bottom:17px;padding:19px}.panel h2{font-size:19px;margin:0 0 15px}.panel-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:15px}.panel-top h2{margin:0}.controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.controls select{width:auto;min-width:110px}.week-scroll{overflow-x:auto;overscroll-behavior-x:contain;border-radius:12px;border:1px solid var(--line)}.week-grid{min-width:790px;display:grid;grid-template-columns:repeat(7,minmax(110px,1fr));background:#fff}.day-col{border-left:1px solid var(--line);min-height:300px}.day-col:last-child{border-left:none}.day-title{position:sticky;top:0;background:#eff3fb;text-align:center;border-bottom:1px solid var(--line);padding:12px 5px;font-size:13px;font-weight:850}.day-title.today{background:#dfeafe;color:var(--navy)}.day-title small{display:block;font-weight:500;margin-top:4px;color:var(--muted)}.day-content{display:flex;flex-direction:column;gap:8px;padding:8px;min-height:255px}.class-pill{color:white;border:0;border-radius:10px;text-align:right;padding:10px 9px;min-height:88px;width:100%;box-shadow:0 4px 7px #112f5c12}.class-pill.en{background:#2368df}.class-pill.cc{background:#16864b}.class-pill.sc{background:#e7b524;color:#3b330b}.class-pill .class-name{font-size:14px;font-weight:900;display:block;margin-bottom:5px;direction:ltr;text-align:right}.class-pill .teacher-name,.class-pill .seat-count{font-size:11px;display:block;line-height:1.7}.class-pill.full{filter:saturate(.55);opacity:.74}.empty-day{color:#9da9bb;text-align:center;margin:auto;font-size:12px}.legend{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin-top:15px;font-size:12px;color:var(--muted)}.legend .swatch{width:11px;height:11px;border-radius:3px;display:inline-block;margin-left:5px}.en-bg{background:#2368df}.cc-bg{background:#16864b}.sc-bg{background:#e7b524}.table-scroll{overflow:auto}.data-table{border-collapse:collapse;width:100%;min-width:680px;font-size:13px;text-align:right}.data-table th{background:#eff3fb;color:var(--navy);white-space:nowrap;font-weight:850}.data-table th,.data-table td{padding:11px 10px;border-bottom:1px solid #e9eef6}.data-table tr:hover td{background:#f9fbff}.tag{background:#eef4ff;color:#2055b3;border-radius:6px;padding:4px 7px;font-size:11px;font-weight:800}.tag.ok{background:#e6f7ec;color:#167b46}.tag.stop{background:#fff0f1;color:#bc354b}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}.modal{border:none;border-radius:17px;padding:0;max-width:min(660px,calc(100vw - 24px));width:100%;max-height:90vh;overflow:auto;background:white;color:var(--ink);box-shadow:0 30px 85px #071a4466}.modal::backdrop{background:#09183094}.modal-head{position:sticky;top:0;background:#f8fafd;z-index:2;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:15px 20px}.modal-head h2{margin:0;font-size:19px}.modal-body{padding:20px}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px;flex-wrap:wrap}.detail-card{background:#f4f7fc;border-radius:12px;padding:14px;line-height:2;font-size:14px;margin-bottom:14px}.note{padding:12px 14px;background:#f7f9fd;color:var(--muted);font-size:12px;border-radius:8px;line-height:1.9}.warning{background:#fff8e1;color:#6d5416}.toast{position:fixed;bottom:25px;left:25px;z-index:200;background:#173a78;color:white;box-shadow:var(--shadow);border-radius:12px;padding:12px 18px;max-width:calc(100vw - 50px);line-height:1.7}.toast.error{background:#b32b3c}.slides-view{background:#0d1833;color:white;border-radius:11px;padding:12px;margin-top:12px;text-align:center}.slides-view img{object-fit:contain;width:100%;max-height:340px;background:#fff;border-radius:7px}.slides-controls{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:10px}.text-direction{direction:ltr;text-align:left}.copy{font-size:12px;direction:ltr}.helper{color:var(--muted);font-size:12px}.footer{text-align:center;color:var(--muted);font-size:11px;padding-top:15px}
@media(max-width:800px){.login-shell{grid-template-columns:1fr}.login-brand{min-height:225px;padding:24px}.login-brand h1{font-size:34px}.login-brand p{font-size:14px;margin-bottom:0}.login-pane{padding:34px 24px}.topinner{padding:10px 15px}.topinner .brand-title{font-size:15px}.top-user .user-name{display:none}.layout{padding:18px 12px 30px}.welcome{margin-bottom:15px}.welcome h1{font-size:25px}.panel{padding:13px}.lab-banner{padding:14px}.two-cols{grid-template-columns:1fr}.modal-body{padding:15px}.stats{width:100%}.stat{flex:1}.topbar .chip{font-size:10px}}

.modal.classroom-modal{width:min(1200px,calc(100vw - 22px));max-width:1200px}.classroom-layout{display:grid;grid-template-columns:minmax(0,3fr) minmax(230px,1fr);gap:12px;padding:12px}.classroom-video{background:#f5f7fb;border-radius:12px;min-width:0}.classroom-video iframe{height:min(68vh,650px);width:100%;border:0;border-radius:12px;background:#10182d}.classroom-side{padding:12px;overflow:auto;max-height:74vh}.classroom-side h3{margin:0 0 5px}.classroom-slide{width:100%;max-height:300px;object-fit:contain;background:#eef2f8;border-radius:9px;margin-top:10px}@media(max-width:800px){.classroom-layout{grid-template-columns:1fr}.classroom-video iframe{height:52vh}.classroom-side{max-height:400px}}

/* Official supplied WSE mark, displayed without changes to image. */
.brand-logo{object-fit:contain;display:block;background:#fff;border-radius:12px;padding:5px;flex-shrink:0}
.brand-logo-login{width:190px;height:135px;max-width:100%;padding:4px}
.brand-logo-nav{width:68px;height:52px;border-radius:9px;padding:2px}
@media(max-width:800px){.brand-logo-login{width:145px;height:100px}.brand-logo-nav{width:53px;height:42px}}

/* WSE Global English UI: left-to-right visual alignment */
html{direction:ltr}
.top-user{margin-right:0;margin-left:auto}
.lab-banner .chip{margin-right:0;margin-left:auto}
.class-pill{text-align:left}
.class-pill .class-name{direction:ltr;text-align:left}
.data-table{text-align:left}
.day-col{border-left:0;border-right:1px solid var(--line)}
.day-col:last-child{border-right:0}
.text-direction{text-align:left;direction:ltr}
.modal-head,.modal-body{text-align:left}
.login-pane,.login-brand{text-align:left}
.field input,.field select,.field textarea{text-align:left}