/* be-vietnam-pro-vietnamese-400-normal */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./fonts/be-vietnam-pro-vietnamese-400-normal.woff2) format('woff2');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* be-vietnam-pro-latin-ext-400-normal */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./fonts/be-vietnam-pro-latin-ext-400-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* be-vietnam-pro-latin-400-normal */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./fonts/be-vietnam-pro-latin-400-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* be-vietnam-pro-vietnamese-600-normal */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./fonts/be-vietnam-pro-vietnamese-600-normal.woff2) format('woff2');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* be-vietnam-pro-latin-ext-600-normal */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./fonts/be-vietnam-pro-latin-ext-600-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* be-vietnam-pro-latin-600-normal */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./fonts/be-vietnam-pro-latin-600-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* be-vietnam-pro-vietnamese-700-normal */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(./fonts/be-vietnam-pro-vietnamese-700-normal.woff2) format('woff2');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* be-vietnam-pro-latin-ext-700-normal */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(./fonts/be-vietnam-pro-latin-ext-700-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* be-vietnam-pro-latin-700-normal */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(./fonts/be-vietnam-pro-latin-700-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
:root{--blue:#173c83;--orange:#f57d16;--ink:#172e61;--muted:#637496;--line:#e2eaf5;--pale:#f3f8ff;--radius:14px;font-family:"Be Vietnam Pro","Segoe UI",Arial,system-ui,sans-serif;color:var(--ink);font-synthesis:none}
*{box-sizing:border-box}html,body{margin:0}body{background:#fff;min-height:100vh}a{color:inherit}button,input{font:inherit}[hidden]{display:none!important}button,a,input,summary{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}:focus-visible{outline:3px solid #146ad9;outline-offset:4px}.site-header{background:#fff}.header-inner{max-width:1440px;min-height:88px;padding:14px 36px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:32px}.brand{display:flex;align-items:center;gap:14px;text-decoration:none;min-width:0}.brand img{width:58px;height:58px;object-fit:contain}.brand strong{display:block;font-size:25px;letter-spacing:-.6px;line-height:1.2}.brand small{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-top:5px}.tabs{display:flex;align-items:center;gap:38px;align-self:stretch}.tab{position:relative;display:flex;align-items:center;gap:9px;padding:15px 2px;text-decoration:none;color:#5a6b8b;font-size:16px;font-weight:700;white-space:nowrap}.tab::after{position:absolute;content:"";height:3px;background:var(--orange);left:0;right:0;bottom:0;transform:scaleX(0);transition:transform .15s}.tab:hover,.tab.active{color:#e86e0e}.tab.active::after{transform:scaleX(1)}.icon{width:24px;height:24px;flex-shrink:0;display:block}span[data-icon]{display:inline-flex;vertical-align:middle}.hero{min-height:330px;height:clamp(330px,43vw,500px);max-height:52vh;background:linear-gradient(90deg,rgba(8,48,119,.8),rgba(8,48,119,.18) 58%,rgba(8,48,119,.02)),url('/img/banner.jpg') center 48%/cover no-repeat;display:flex;align-items:center}.hero-inner{max-width:1440px;width:100%;padding:52px 36px;margin:auto;display:flex;align-items:center;gap:24px;color:#fff}.hero-logo{width:90px;height:90px;object-fit:contain;background:#fff;border:6px solid white;border-radius:50%}.hero h1{font-size:clamp(32px,3.2vw,48px);letter-spacing:-1px;line-height:1.15;margin:0 0 12px;font-weight:800}.hero p{font-size:clamp(16px,1.7vw,23px);font-weight:650;margin:0;line-height:1.5}.hero span{display:block;font-size:11px;letter-spacing:2.1px;text-transform:uppercase;margin-top:15px;color:#e0ebff}.wrap{max-width:1320px;margin:auto;padding:38px 36px 48px;min-height:260px}.accent{display:block;background:#9bc6ff;width:46px;height:5px;border-radius:8px;margin-bottom:16px}h2{font-size:32px;letter-spacing:-.7px;line-height:1.25;margin:0 0 9px}p{line-height:1.6}.section-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:26px}.section-head p{margin:0;color:var(--muted);font-size:16px}.search{position:relative;width:min(330px,40%);flex-shrink:0}.search>span{position:absolute;top:50%;left:16px;transform:translateY(-50%);color:#6d82a6}.search .icon{width:20px;height:20px}.search input{width:100%;border:1px solid #cad8ee;background:white;color:var(--ink);border-radius:11px;padding:13px 14px 13px 46px;outline:none;font-size:15px}.search input:focus{border-color:#3073ce;box-shadow:0 0 0 3px #dceaff}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.grid.learning{grid-template-columns:repeat(4,minmax(0,1fr))}.tile{display:flex;align-items:center;gap:16px;border:1px solid #e4ebf6;border-radius:var(--radius);padding:23px 20px;text-decoration:none;min-height:122px;box-shadow:0 4px 15px rgba(28,66,126,.045);background:white;transition:transform .15s,border-color .15s,box-shadow .15s;position:relative;min-width:0}.tile:hover{transform:translateY(-3px);border-color:#a8c5ef;box-shadow:0 7px 20px rgba(28,66,126,.09)}.tile .ic{display:grid;place-items:center;background:var(--tile-pale,#eaf3ff);color:var(--tile-color,#2873d4);width:58px;height:58px;border-radius:13px;flex-shrink:0}.ic .icon{width:30px;height:30px}.tile-copy{flex:1;min-width:0}.nm{display:block;font-weight:750;font-size:17px;line-height:1.35}.tile-description{display:block;font-size:13px;color:var(--muted);margin-top:7px;line-height:1.5}.tile .arrow{color:var(--orange);font-size:25px;flex-shrink:0}.learning .tile{align-items:flex-start;flex-wrap:wrap;padding:22px;gap:15px}.learning .tile-copy{flex-basis:calc(100% - 75px)}.learning .arrow{margin-left:auto}.badge{display:inline-block;font-size:10px;line-height:1.3;padding:3px 7px;border-radius:5px;background:#fff3e7;color:#bb5c0a;margin-top:7px;font-weight:600}.soon{background:#f8fafc;box-shadow:none;cursor:default;color:#77859f}.soon:hover{transform:none;box-shadow:none;border-color:var(--line)}.soon .ic{filter:grayscale(1);opacity:.6}.empty{padding:25px;text-align:center;color:var(--muted);background:var(--pale);border-radius:12px}.admin-section{margin-top:28px;border:1px solid var(--line);border-radius:var(--radius);padding:20px;background:#f8fbff}.admin-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.admin-heading h3{display:flex;align-items:center;gap:8px;margin:0;font-size:17px}.admin-heading small{color:var(--muted);font-size:12px}.admin-section .tile{padding:16px;min-height:90px}.admin-section .ic{height:44px;width:44px}.account-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--pale);border-radius:10px;padding:13px 16px;margin-bottom:20px;font-size:14px}.account-bar a{font-weight:650;color:var(--blue)}.upcoming{margin-top:25px;border-top:1px solid var(--line);padding-top:18px;color:var(--muted)}.upcoming summary{cursor:pointer;font-size:14px;font-weight:650}.upcoming .grid{margin-top:16px}.learning-note{display:flex;align-items:center;gap:12px;background:#ecf5ff;border-radius:10px;padding:17px 20px;margin-top:24px;font-size:14px;color:#496594}.teacher-gate{display:grid;grid-template-columns:1.1fr 1fr;gap:24px 70px;max-width:1080px;margin:auto;align-items:center}.welcome h2{font-size:36px;line-height:1.25}.welcome em{font-style:normal;color:var(--orange)}.welcome p{color:var(--muted);font-size:17px;margin-bottom:0}.login-card{padding:25px 28px;border:1px solid #edf1f8;border-radius:16px;background:#fff;box-shadow:0 8px 30px rgba(22,57,112,.07)}.login-card h3{display:flex;align-items:center;gap:12px;font-size:19px;margin:0 0 12px}.account-icon{color:#1775db;background:#eaf3ff;padding:10px;border-radius:50%}.login-card p{font-size:14px;color:var(--muted);margin:0 0 18px}.microsoft-button{display:flex;align-items:center;justify-content:center;gap:14px;text-decoration:none;background:var(--orange);border:1px solid #ef7410;color:white;border-radius:10px;padding:15px 18px;font-weight:700;font-size:17px;box-shadow:0 4px 10px #f57d1615}.microsoft-button:hover{background:#e76d0a}.ms-logo{display:grid;grid-template-columns:repeat(2,10px);gap:2px;background:white;padding:5px;border-radius:3px;flex-shrink:0}.ms-logo i{width:10px;height:10px;background:#f35325}.ms-logo i:nth-child(2){background:#81bc06}.ms-logo i:nth-child(3){background:#05a6f0}.ms-logo i:nth-child(4){background:#ffba08}.login-arrow{margin-left:auto;font-size:25px}.login-steps{grid-column:1/-1;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:32px;border-top:1px solid var(--line);padding:24px 0 0;margin:5px 0 0}.login-steps li{display:grid;grid-template-columns:auto auto;justify-content:center;justify-items:center;align-items:center;gap:10px 15px;text-align:center;position:relative}.login-steps b,.login-steps small{grid-column:1/-1}.login-steps b{font-size:13px}.login-steps small{font-size:12px;color:var(--muted);line-height:1.5}.login-steps [data-icon]{color:#1780e6;background:#eaf5ff;border-radius:50%;padding:12px}.step-no{display:grid;place-items:center;background:#edf5ff;color:#1876d3;font-size:14px;font-weight:700;border-radius:50%;width:30px;height:30px}.retry{border:1px solid #abc5eb;background:#fff;color:var(--blue);padding:10px 20px;border-radius:8px;cursor:pointer}footer{border-top:1px solid var(--line);padding:20px 24px;text-align:center;font-size:12px;color:#6a7fa4;background:linear-gradient(110deg,#f5faff,#fff 60%,#fff9f2)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.notice{padding:20px;background:var(--pale)}
#tbBox{position:fixed;inset:0;z-index:100;background:#14294a77;display:flex;align-items:center;justify-content:center;padding:20px}.tbCard{background:#fff;border-radius:16px;width:min(520px,100%);max-height:85vh;overflow:auto;box-shadow:0 25px 70px #11223a33}.tbHead{background:#edf5ff;padding:24px 50px 22px 24px;position:relative}.tbHead h2{font-size:23px}.tbHead #tbDate{font-size:13px;color:var(--muted)}#tbX{position:absolute;top:14px;right:14px;border:0;border-radius:50%;width:30px;height:30px;background:#fff;color:var(--blue);font-size:23px;cursor:pointer}.tbBody{padding:16px 24px;font-size:15px;line-height:1.65}.tbBody ul{padding-left:20px}.tbBody li{margin:10px 0}.tbFoot{display:flex;justify-content:flex-end;gap:12px;padding:0 24px 22px}.tbFoot button,.tbFoot a{padding:10px 20px;border:0;border-radius:8px;background:var(--blue);color:#fff;font-weight:650;text-decoration:none;cursor:pointer}
@media(min-width:1600px){.hero{height:490px}.wrap{padding-top:40px}}
@media(max-width:1100px){.header-inner{gap:20px;padding:14px 24px}.brand strong{font-size:22px}.brand small{max-width:260px;font-size:12px}.tabs{gap:22px}.grid.learning{grid-template-columns:repeat(2,minmax(0,1fr))}.tile{padding:19px 16px;gap:12px}.tile .ic{width:48px;height:48px}.nm{font-size:16px}.teacher-gate{gap:24px 38px}}
@media(max-width:800px){.header-inner{flex-wrap:wrap;justify-content:center;padding:16px 20px 0;gap:12px}.brand small{max-width:none}.brand img{width:48px;height:48px}.brand strong{font-size:23px}.tabs{width:100%;justify-content:center;gap:40px}.tab{padding:12px 0}.hero{height:350px;min-height:300px;max-height:none}.hero-inner{padding:35px 24px;gap:16px}.hero-logo{width:70px;height:70px}.hero h1{font-size:34px}.hero p{font-size:17px}.hero span{font-size:9px;letter-spacing:1px}.wrap{padding:28px 24px 36px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.teacher-gate{gap:24px;grid-template-columns:1fr 1fr}.welcome h2{font-size:29px}.welcome p{font-size:15px}.login-card{padding:20px}.login-card h3{font-size:17px}.microsoft-button{font-size:15px;gap:9px;padding:12px}.login-arrow{display:none}h2{font-size:28px}.desktop-break{display:none}}
@media(max-width:560px){.header-inner{padding:14px 16px 0}.brand{gap:10px}.brand strong{font-size:21px}.brand small{font-size:10px}.brand img{width:44px;height:44px}.tabs{gap:28px}.tab{font-size:14px;gap:6px}.tab .icon{width:20px;height:20px}.hero{height:300px;min-height:300px;background-position:center}.hero-inner{padding:30px 20px;align-items:flex-start;gap:13px}.hero-logo{width:58px;height:58px;border-width:4px}.hero h1{font-size:28px;letter-spacing:-.6px;margin-bottom:10px}.hero p{font-size:14px;max-width:240px}.hero span{font-size:8px;line-height:1.7;letter-spacing:.7px}.wrap{padding:26px 18px 34px}.section-head{display:block;margin-bottom:20px}.section-head p{font-size:14px}.search{width:100%;margin-top:20px}.grid,.grid.learning{grid-template-columns:1fr;gap:12px}.tile,.learning .tile{min-height:100px;padding:18px;flex-wrap:nowrap;align-items:center}.learning .tile-copy{flex-basis:auto}.tile .ic{width:50px;height:50px}.tile-description{font-size:13px}.section-head h2{font-size:26px}.teacher-gate{grid-template-columns:1fr;gap:25px}.welcome h2{font-size:30px}.welcome p{font-size:15px}.login-card{padding:22px}.login-card h3{font-size:18px}.microsoft-button{font-size:16px;padding:14px}.login-steps{gap:10px;padding-top:22px}.login-steps li{gap:9px 6px}.login-steps b{font-size:11px;line-height:1.4}.login-steps small{font-size:10px}.login-steps [data-icon]{padding:9px}.login-steps .icon{width:20px;height:20px}.step-no{width:22px;height:22px;font-size:11px}.admin-section{padding:15px}.admin-heading{display:block}.admin-heading small{display:block;margin-top:6px}.account-bar{align-items:flex-start;font-size:12px}.account-bar span{overflow-wrap:anywhere}footer{font-size:11px;line-height:1.6;padding:18px}.tbBody{font-size:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* Không gian giáo viên: lời chào và đồng hồ mẫu 3. */
.header-inner{flex-wrap:wrap;gap:18px}.account-bar{margin:0;padding:8px 0;background:none;gap:14px;max-width:260px;font-size:12px}.account-bar span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}.account-bar a{white-space:nowrap;text-decoration:none;border-left:1px solid var(--line);padding-left:14px}.teacher-ready .hero{height:clamp(280px,26vw,390px);min-height:280px}.daily-welcome{display:flex;align-items:center;justify-content:space-between;gap:26px;border:1px solid #e9edf5;border-radius:17px;box-shadow:0 5px 24px #1c427e08;background:#fff;padding:26px 30px;margin:-12px 0 34px}.greeting-copy{display:flex;align-items:center;gap:22px;min-width:0;flex:1}.greeting-symbol{font-family:Arial,sans-serif;color:#f77719;font-size:67px;line-height:1;flex-shrink:0}.greeting-copy h2{font-size:clamp(22px,2vw,29px);line-height:1.5;margin:0 0 8px;letter-spacing:-.6px}.greeting-copy h2 #greetingName{color:#ed7115}.greeting-copy p{margin:0;font-size:15px;color:#52668e;max-width:650px}.today-clock{display:flex;align-items:center;gap:18px;border-left:1px solid var(--line);padding-left:26px;flex-shrink:0}.calendar-leaf{width:83px;text-align:center;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 4px 14px #173c8308}.calendar-leaf>span{display:block;background:var(--blue);color:white;font-size:10px;font-weight:700;padding:7px 3px}.calendar-leaf strong{display:block;color:#f47717;font-size:37px;line-height:1.25;padding-top:4px;font-variant-numeric:tabular-nums}.calendar-leaf small{display:block;font-size:12px;color:#6d7d9b;padding-bottom:6px}.clock-copy{display:flex;flex-direction:column;gap:6px}.clock-copy time{font-size:37px;font-weight:700;line-height:1.15;letter-spacing:-1px;font-variant-numeric:tabular-nums}.clock-copy>strong{font-size:15px}.clock-copy>span{font-size:12px;color:#637496}.teacher-ready .admin-section{border:0;border-top:1px solid var(--line);border-radius:0;padding:25px 0 0;background:none}.teacher-ready .admin-heading h3{font-size:25px}.teacher-ready .tile .arrow{display:grid;place-items:center;border-radius:50%;width:30px;height:30px;color:white;background:#f47b16;font-size:21px}.teacher-ready .admin-section .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.teacher-ready .admin-section .tile{padding:20px;min-height:108px}.teacher-ready .admin-section .ic{width:52px;height:52px}
@media(min-width:1101px){.teacher-ready .header-inner{gap:20px}.teacher-ready .brand strong{font-size:22px}.teacher-ready .brand small{font-size:11px}.teacher-ready .tabs{gap:22px}.teacher-ready .tab{font-size:14px}.teacher-ready .account-bar{max-width:215px}}
@media(max-width:1100px){.daily-welcome{padding:24px;gap:18px}.greeting-symbol{font-size:47px}.greeting-copy{gap:14px}.today-clock{padding-left:18px;gap:12px}.clock-copy time{font-size:32px}.account-bar{margin-left:auto}.greeting-copy h2{font-size:24px}}
@media(max-width:800px){.daily-welcome{align-items:stretch;flex-direction:column;padding:22px;margin-top:0}.today-clock{border-left:0;border-top:1px solid var(--line);padding:20px 0 0;justify-content:center}.greeting-copy h2{font-size:24px}.header-inner .account-bar{max-width:100%;width:100%;justify-content:center;margin:0 0 12px}.teacher-ready .admin-section .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.daily-welcome{padding:20px 18px;margin-bottom:26px;gap:18px}.greeting-copy{align-items:flex-start;gap:12px}.greeting-symbol{font-size:35px;margin-top:5px}.greeting-copy h2{font-size:21px;letter-spacing:-.4px}.greeting-copy p{font-size:13px}.today-clock{gap:22px;padding-top:18px}.calendar-leaf{width:75px}.clock-copy time{font-size:36px}.teacher-ready .admin-section .grid{grid-template-columns:1fr}.account-bar span{max-width:230px}.teacher-ready .hero{height:300px}}