/* BAY EXCUSE X alpha.21 — Stability, typography, adaptive views and App Shell */
:root{--ui-type-scale:1;--ui-body-size:15px;--ui-line-height:1.58;--ui-heading-line:1.22;--ui-control-height:44px}
html{font-size:calc(16px * var(--ui-type-scale))}body{font-size:var(--ui-body-size);line-height:var(--ui-line-height);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.page-head h1,.panel-head h2{line-height:var(--ui-heading-line);overflow-wrap:anywhere;letter-spacing:-.015em}
.page-head h1{font-size:clamp(1.65rem,2.2vw,2.25rem)}.panel-head h2{font-size:clamp(1.22rem,1.5vw,1.55rem)}
p,small,label,td,th,button,input,select,textarea{line-height:1.48}.muted,small{overflow-wrap:anywhere}
.content-inner{transition:opacity .13s ease,transform .13s ease}.content-inner.is-app-shell-loading{opacity:.55;transform:translateY(2px);pointer-events:none}
.app-shell-progress{position:fixed;z-index:9999;top:0;left:0;right:0;height:3px;background:transparent;overflow:hidden}.app-shell-progress span{display:block;width:35%;height:100%;background:var(--primary);animation:alpha21-progress 1s ease-in-out infinite}.app-shell-progress[hidden]{display:none}@keyframes alpha21-progress{0%{transform:translateX(-110%)}100%{transform:translateX(390%)}}
.nav-link-classroom-assistant{position:relative;border:1px solid color-mix(in srgb,var(--primary) 38%,transparent)!important;background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 18%,transparent),color-mix(in srgb,#ffd76a 20%,transparent))!important;box-shadow:0 10px 25px color-mix(in srgb,var(--primary) 14%,transparent)}
.nav-link-classroom-assistant>span:nth-last-child(2){font-weight:800}.nav-link-classroom-assistant b{background:var(--primary)!important;color:#fff!important}.nav-link-classroom-assistant::after{content:'เริ่มคาบ';font-size:10px;font-weight:800;padding:2px 7px;border-radius:999px;background:#fff;color:var(--primary);margin-inline-start:auto}
.account-display-name{margin-top:4px;font-weight:700}.account-email{margin-top:2px;color:var(--muted,#66746f);word-break:break-word}.user-account-table{table-layout:fixed;min-width:980px}.user-account-table th:nth-child(1){width:20%}.user-account-table th:nth-child(2){width:17%}.user-account-table th:nth-child(3){width:25%}.user-account-table th:nth-child(4){width:10%}.user-account-table th:nth-child(5){width:14%}.user-account-table th:nth-child(6){width:14%}.user-account-table td{vertical-align:top;min-width:0;overflow-wrap:anywhere}.user-account-table .row-actions{display:flex;flex-wrap:wrap;gap:7px}.user-account-table .role-pill-wrap{display:flex;flex-wrap:wrap;gap:5px}
.v16-card-view,.v16-list-view{min-width:0}.v16-list-view{display:grid;grid-template-columns:minmax(0,1fr);gap:9px}.v16-list-view[hidden],.v16-card-view[hidden]{display:none!important}.v16-list-view .v16-data-card{display:grid;grid-template-columns:minmax(180px,1.05fr) minmax(0,2fr) auto;align-items:center;gap:14px;padding:14px 16px;min-width:0;overflow:hidden}.v16-list-view .v16-data-card-head,.v16-list-view .v16-data-card-fields,.v16-list-view .v16-card-actions{min-width:0}.v16-list-view .v16-data-card-fields{display:flex;flex-wrap:wrap;gap:8px 16px}.v16-list-view .v16-card-field{min-width:130px;max-width:260px}.v16-list-view .v16-card-field b{display:block;white-space:normal;overflow-wrap:anywhere}.v16-list-view .v16-card-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.v16-data-card{overflow:hidden}.v16-data-card strong,.v16-data-card b{overflow-wrap:anywhere}
.approval-source-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:14px 0}.approval-source-summary article{padding:16px;border:1px solid var(--border,#dce8e3);border-radius:18px;background:var(--surface,#fff);display:grid;gap:3px}.approval-source-summary article span{font-weight:800}.approval-source-summary article strong{font-size:1.65rem;color:var(--primary)}
.academic-grid-toolbar{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:10px 0 12px}.academic-row-search{display:flex;align-items:center;gap:7px;min-width:min(100%,330px);padding:0 12px;border:1px solid var(--border,#dce8e3);border-radius:13px;background:#fff}.academic-row-search input{border:0!important;box-shadow:none!important;min-height:40px;width:100%}.academic-grid-toolbar [data-academic-visible-count]{margin-inline-start:auto;color:var(--muted,#66746f);font-size:.88rem}.academic-grid-panel.is-grid-fullscreen{position:fixed;z-index:9990;inset:12px;overflow:auto;background:var(--surface,#fff);padding:18px}.academic-grid-panel.is-grid-fullscreen .academic-sheet-wrap{max-height:calc(100vh - 175px)}.academic-sheet-wrap{position:relative}.academic-complete-sheet .row-no{position:sticky;left:0;z-index:4;background:var(--surface,#fff)}.academic-complete-sheet .student-name{position:sticky;left:62px;z-index:3;background:var(--surface,#fff);box-shadow:5px 0 9px -8px #17251f}.academic-complete-sheet thead .row-no,.academic-complete-sheet thead .student-name{z-index:7}
.login-page form[data-login-form].is-submitting{pointer-events:none;opacity:.82}.login-page form[data-login-form].is-submitting button[type=submit]::after{content:' · กำลังเข้าสู่ระบบ…'}
.alpha21-dialog-help{margin-top:8px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--primary) 8%,#fff);font-size:.92rem}
@media(max-width:920px){.v16-list-view .v16-data-card{grid-template-columns:minmax(0,1fr)}.v16-list-view .v16-card-actions{justify-content:flex-start}.user-account-table{min-width:820px}.academic-grid-toolbar [data-academic-visible-count]{width:100%;margin:0}.nav-link-classroom-assistant::after{display:none}}
@media(max-width:640px){:root{--ui-body-size:14.5px}.page-head h1{font-size:1.55rem}.panel-head h2{font-size:1.2rem}.v16-view-switcher{overflow:auto;max-width:100%}.v16-view-switcher button{white-space:nowrap}.academic-grid-panel.is-grid-fullscreen{inset:0;border-radius:0}}
@media(prefers-reduced-motion:reduce){.content-inner,.app-shell-progress span{transition:none;animation:none}}


/* BAY EXCUSE X alpha.23.3 — mobile shell navigation hotfix */
@media(max-width:850px){
  body:not(.operational-focus) .topbar{gap:8px;padding-inline:10px;overflow:visible}
  body:not(.operational-focus) .menu-toggle{flex:0 0 40px;width:40px;height:40px}
  body:not(.operational-focus) .top-context{flex:1 1 auto;min-width:0;overflow:hidden}
  body:not(.operational-focus) .top-context small{display:none}
  body:not(.operational-focus) .top-context strong{display:block;max-width:none;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:1rem;line-height:1.25}
  body:not(.operational-focus) .top-actions{flex:0 0 auto;min-width:0;margin-left:0;gap:6px}
  body:not(.operational-focus) .top-actions>.assistant-mode-button,
  body:not(.operational-focus) .top-actions>.top-command-action,
  body:not(.operational-focus) .top-actions>.top-scan-action{display:none!important}
  body:not(.operational-focus) .top-actions .icon-btn{width:40px;height:40px;border-radius:12px}
  body:not(.operational-focus) .user-button{gap:0;padding:1px}
  body:not(.operational-focus) .user-button>span:last-child{display:none}
  body:not(.operational-focus) .avatar{width:40px;height:40px}
}
@media(max-width:390px){
  body:not(.operational-focus) .topbar{gap:6px;padding-inline:8px}
  body:not(.operational-focus) .menu-toggle,
  body:not(.operational-focus) .top-actions .icon-btn,
  body:not(.operational-focus) .avatar{width:38px;height:38px;flex-basis:38px}
  body:not(.operational-focus) .top-context strong{font-size:.94rem}
}