/* Phone UI comes after the existing desktop theme. */
.mobile-app-nav{display:none}
html.mobile-device .pc-only{display:none!important}
@media(max-width:760px),(pointer:coarse) and (max-width:1180px){
 input,select,textarea{font-size:16px}
 body.at-login{height:100svh;overflow:hidden;touch-action:pan-y}
 body.at-login #app{height:100%}
 .login-layout,.login-layout[data-layout=center]{height:100svh;min-height:0;display:flex!important;flex-direction:column!important;overflow:hidden}
 .login-layout>.login-side{order:0;min-height:0!important;flex:0 0 auto;padding:18px 24px 12px;align-items:flex-start}
 .login-form{margin:0;max-width:400px}
 .login-form .mobile-logo{display:flex;align-items:center;gap:10px;margin:0 0 14px}
 .login-form .mobile-logo strong{font-size:19px}
 .login-form .mobile-logo .academy-seal{width:28px;height:31px;font-size:21px}
 .login-form>.eyebrow,.login-form-number,.login-form>.subtitle,.login-form>.login-foot{display:none}
 .login-form h2{font-size:20px;margin-bottom:12px}
 .login-form .form-grid{gap:12px}
 .login-form .field{margin:0}
 .login-form .field label{font-size:11px;margin-bottom:5px}
 .login-form .field input{height:44px;font-size:16px}
 .login-form .login-submit{height:44px;min-height:44px;margin-top:14px!important}
 .login-form .inline-error{margin:7px 0;font-size:11px}
 .login-activity{margin:8px 0 0;padding:8px}
 .login-layout>.login-brand{order:1;flex:1 1 auto;min-height:0!important;padding:12px 24px 14px;border:0;border-top:1px solid #d8dece;overflow:auto}
 .login-brand>.logo,.login-brand>.brand-bottom,.login-story .eyebrow,.login-story p,.learning-signature,.login-notice-rule{display:none!important}
 .login-story{margin:0 0 10px;max-width:none}
 .login-story h1{font-family:inherit;font-size:14px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:500}
 .login-promotions{margin:0}
 .promotion-links,.promotion-links[data-count="3"]{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 .promotion-links[data-count="1"]{grid-template-columns:1fr}
 .promotion-link{min-height:36px;padding:7px 9px;grid-template-columns:1fr auto;gap:4px}
 .promotion-link .promotion-index{display:none}
 .promotion-link strong{font-size:11px}
 .promotion-link>span:last-child{font-size:14px}
 .main{padding:14px 12px 145px}
 .workspace{margin-left:0}
 .sidebar:not(.open){transform:translateX(-100%)}
 .sidebar.open{transform:translateX(0);width:245px;max-width:84vw;box-shadow:0 0 0 100vmax #14243d33}
 .mobile-toggle{display:inline-flex}
 .topbar{padding:0 10px;height:50px}
 .breadcrumb{font-size:11px}
 .pc-indicator{font-size:10px!important;padding:5px!important;max-width:125px}
 .topbar-right{gap:3px!important}
 .topbar .btn.icon{width:30px;min-height:30px}
 .attendance-page-head{display:none}
 .attendance-tabs{margin-bottom:10px}
 .attendance-tabs button{padding:11px 18px;font-size:13px}
 .attendance-toolbar{gap:6px;margin-bottom:10px;align-items:end}
 .attendance-toolbar label:first-child{flex:1;min-width:150px}
 .attendance-toolbar select{min-width:0;width:100%;font-size:14px;min-height:36px;padding:6px}
 .attendance-toolbar label{font-size:10px;gap:3px}
 .attendance-toolbar .btn{min-height:32px;font-size:11px;padding:6px 8px}
 .attendance-date{display:none}
 .attendance-heading{gap:6px;margin-bottom:6px}
 .attendance-live .attendance-heading h2{display:none}
 .attendance-heading p{font-size:11px}
 .attendance-heading .btn{font-size:10px;padding:5px 7px;min-height:29px}
 .attendance-live>.muted{font-size:10px;line-height:1.4;margin:6px 0 8px}
 .attendance-student{position:relative;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"person picks" "notification picks";column-gap:6px;row-gap:2px;align-items:center;padding:8px 0;min-height:52px}
 .attendance-person{grid-area:person;min-width:0;display:flex;align-items:center;gap:5px;overflow:hidden}
 .attendance-person>strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}
 .attendance-person>small{display:none}
 .attendance-match{font-size:0;white-space:nowrap;min-width:0}
 .attendance-link-button{padding:0 3px!important;font-size:9px!important;min-height:18px!important;color:#7c8874}
 .attendance-picks{grid-area:picks;display:grid;grid-template-columns:repeat(3,40px);gap:4px;order:0}
 .attendance-picks button{padding:0;min-width:40px;height:36px;font-size:12px;border-radius:4px;touch-action:manipulation}
 .attendance-picks [data-att-time]{display:none}
 .attendance-notification{grid-area:notification;font-size:9px;line-height:1.4;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .attendance-notification .btn{font-size:9px;min-height:18px;padding:0 4px}
 .attendance-save-row{position:fixed;z-index:22;left:8px;right:8px;bottom:calc(56px + env(safe-area-inset-bottom));border:1px solid #d5dfce;background:#fffef9;padding:8px;gap:6px;box-shadow:0 -3px 15px #29412b10;border-radius:5px}
 .attendance-save-row .btn{flex:1;min-height:38px;font-size:13px}
 .attendance-save-row>span{width:100%;font-size:10px;text-align:center}
 .attendance-status:not(:empty){font-size:11px;padding:9px 10px;margin:9px 0}
 .attendance-logs{margin-top:15px;font-size:11px}
 .attendance-book .attendance-heading h2{font-size:15px}
 .attendance-book .muted{font-size:11px}
 .attendance-book-table{font-size:11px}
 .attendance-book-table td,.attendance-book-table th{padding:7px 5px}
 .attendance-book-table select{font-size:12px;padding:5px;min-width:75px}
 .attendance-book-scroll{margin-top:12px}
 .mobile-app-nav{position:fixed;z-index:35;left:0;right:0;bottom:0;height:calc(54px + env(safe-area-inset-bottom));padding:4px 8px calc(4px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #d9dece;background:#fffef9}
 .mobile-app-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:none;border:0;color:#7d8774;font-size:10px}
 .mobile-app-nav .active{color:#2e5c3c;font-weight:700}
 .modal-open .mobile-app-nav{display:none}
 #toast-root{bottom:calc(140px + env(safe-area-inset-bottom));left:12px;right:12px}
 .toast{max-width:100%;font-size:11px}
}
@media(max-width:760px) and (max-height:660px),(pointer:coarse) and (max-width:1180px) and (max-height:660px){
 .login-layout>.login-side{padding:12px 20px 10px}
 .login-form .mobile-logo{margin-bottom:9px}
 .login-form h2{font-size:18px;margin-bottom:9px}
 .login-form .form-grid{gap:9px}
 .login-form .field input{height:40px}
 .login-form .login-submit{height:40px;min-height:40px;margin-top:12px!important}
 .login-layout>.login-brand{padding:9px 20px}
}
@media(max-width:760px) and (max-height:450px),(pointer:coarse) and (max-width:1180px) and (max-height:450px){
 .login-layout>.login-brand,.login-form .mobile-logo,.login-form h2{display:none!important}
 .login-layout>.login-side{flex:1;padding:10px 25px;align-items:center}
 .login-form .field label{margin-bottom:3px}
}
@media print{.mobile-app-nav,.attendance-save-row{display:none!important}}
