.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
/* SEKAI Student UI/UX audit layer — 2026-08-02 */
:root{
  --student-navy:#10243d;
  --student-navy-2:#183f65;
  --student-lime:#c7f05d;
  --student-gold:#f2c75c;
  --student-canvas:#f3f6fa;
  --student-surface:#fff;
  --student-text:#172334;
  --student-muted:#607086;
  --student-line:#dbe3ec;
  --student-danger:#b53c47;
  --student-success:#267558;
  --student-focus:#2f74c0;
  --student-shadow:0 14px 38px rgba(16,36,61,.10);
}
html{scroll-padding-top:96px}
body{overflow-wrap:anywhere}
button,a,input,select,textarea,summary{touch-action:manipulation}
button:not([disabled]),a[href],summary,label[for],input[type=file]{cursor:pointer}
button:disabled,[aria-disabled=true]{cursor:not-allowed;opacity:.6}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:3px solid var(--student-focus)!important;
  outline-offset:3px!important;
  box-shadow:0 0 0 5px rgba(47,116,192,.16)!important;
}
.skip-link{
  position:fixed;z-index:20000;top:10px;left:12px;transform:translateY(-150%);
  padding:11px 15px;border-radius:12px;background:#fff;color:var(--student-navy);
  border:2px solid var(--student-focus);font-weight:900;text-decoration:none;
  box-shadow:0 12px 30px rgba(0,0,0,.22);transition:transform .18s ease;
}
.skip-link:focus{transform:translateY(0)}
[aria-busy=true]{cursor:progress}
.is-loading{position:relative;pointer-events:none}
.is-loading::after{
  content:"";width:16px;height:16px;margin-left:8px;border:2px solid currentColor;
  border-right-color:transparent;border-radius:50%;display:inline-block;vertical-align:-3px;
  animation:studentSpin .7s linear infinite;
}
@keyframes studentSpin{to{transform:rotate(360deg)}}
.field-feedback{display:block;margin-top:6px;color:var(--student-muted);font-size:12px;line-height:1.45}
.field-feedback.error{color:var(--student-danger);font-weight:750}
.field-feedback.success{color:var(--student-success);font-weight:750}
.form-error-summary{margin:0 0 14px;padding:12px 14px;border-radius:13px;background:#fff0f2;border:1px solid #edc6cb;color:#8c2d38;font-weight:750}

/* Shared student shell */
body.education-native,body.portal-body,body.student-login{
  color:var(--student-text);
  font-size:15px;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
body.portal-body{
  background:
    radial-gradient(circle at 92% 0,rgba(61,120,197,.18),transparent 30%),
    linear-gradient(180deg,#0d2037 0,#142f4e 380px,var(--student-canvas) 380px,var(--student-canvas) 100%);
}
.portal-topbar{
  background:rgba(10,30,51,.92)!important;
  border-bottom-color:rgba(255,255,255,.12)!important;
  min-height:72px!important;
}
.portal-brand>span{background:linear-gradient(135deg,var(--student-gold),#ffe49b)!important;color:var(--student-navy)!important}
.portal-brand small,.student-switcher label,.user-chip small{color:#c1ccd7!important}
.student-switcher select{background:#153554!important;border-color:rgba(255,255,255,.2)!important}
.student-hero{
  background:
    radial-gradient(circle at 90% 8%,rgba(199,240,93,.18),transparent 27%),
    linear-gradient(135deg,#0e2139,#183f65 64%,#225c68)!important;
  border-color:rgba(255,255,255,.14)!important;
  box-shadow:0 24px 58px rgba(6,22,39,.28)!important;
}
.student-hero .eyebrow{color:var(--student-lime)!important}
.student-hero .eyebrow span{background:var(--student-lime)!important;box-shadow:0 0 0 5px rgba(199,240,93,.14)!important}
.next-step{border:1px solid rgba(16,36,61,.09);box-shadow:0 14px 34px rgba(4,19,33,.16)}
.portal-nav{background:rgba(16,36,61,.96)!important;border-color:rgba(255,255,255,.12)!important}
.portal-nav a{min-height:44px;display:inline-flex;align-items:center;color:#d0d9e3!important;font-size:13px!important}
.portal-nav a:hover,.portal-nav a.active{background:var(--student-lime)!important;color:var(--student-navy)!important}
.portal-card,.kpi-grid article,.link-card,.empty-state{
  background:rgba(255,255,255,.97)!important;
  border-color:var(--student-line)!important;
  box-shadow:var(--student-shadow)!important;
}
.support-card{background:linear-gradient(145deg,#eff7ff,#fff)!important}
.primary-btn{background:var(--student-navy)!important;color:#fff!important;box-shadow:0 9px 20px rgba(16,36,61,.17)}
.primary-btn:hover{background:var(--student-navy-2)!important}
.secondary-btn{border-color:#cbd7e3!important;color:var(--student-navy)!important}
.status-pill.active,.status-pill.paid,.status-pill.verified,.status-pill.approved,.status-pill.completed{background:#e0f4e9!important;color:#23644a!important}
.status-pill.sent,.status-pill.pending{background:#fff2d8!important;color:#80580c!important}
.status-pill.partial,.status-pill.in_progress{background:#e4effb!important;color:#245c94!important}
.status-pill.rejected,.status-pill.revision,.status-pill.cancelled{background:#ffe6e9!important;color:#96313d!important}
.portal-topbar a,.mobile-nav a,.portal-nav a,.primary-btn,.secondary-btn,.danger-btn,.compact{
  min-height:44px;
}
.compact{padding:9px 12px!important;font-size:12px!important}
.portal-form input,.portal-form select,.portal-form textarea,
.profile-form input,.profile-form select,.profile-form textarea,
.payment-form input,.payment-form select,.payment-form textarea,
.milestone-form input,.milestone-form select,.schedule-status select,.document-review input,.request-actions input{
  min-height:48px!important;font-size:15px!important;border-radius:12px!important;
}
.portal-form label>span,.profile-form label>span,.payment-form label>span{font-size:12px!important;color:#4e5f72!important}
.section-head p:not(.eyebrow),.support-card>p:not(.eyebrow),.journey-item small,.schedule-item p,.schedule-item small,.invoice-item small,.invoice-item em,.linked-account small,.request-list small{font-size:13px!important;line-height:1.5}
.eyebrow{font-size:11px!important;letter-spacing:.14em!important}
.status-pill{font-size:10px!important;line-height:1.2}
.kpi-grid article{min-height:145px}
.kpi-grid small,.kpi-grid span{font-size:12px!important}
.invoice-item{border-radius:18px!important}
.document-item{border-radius:18px!important}
.document-title small{font-size:12px!important;max-width:none!important;white-space:normal!important;overflow-wrap:anywhere}
.upload-form label span{min-height:44px;display:grid!important;place-items:center;font-size:12px!important}
.mobile-nav{
  padding-bottom:max(7px,env(safe-area-inset-bottom))!important;
  background:rgba(16,36,61,.96)!important;border-color:rgba(255,255,255,.14)!important;
}
.mobile-nav a{font-size:10px!important;border-radius:13px}
.mobile-nav a span{color:var(--student-lime)!important}
.mobile-nav a.active{background:rgba(255,255,255,.12)!important;color:#fff!important}
.payment-details summary{min-height:44px}
.payment-details[open] summary{background:var(--student-navy-2)!important}
.payment-form{border-radius:18px!important}

/* Education app readability and interaction */
.edu-appbar{border-bottom-color:var(--student-line)!important}
.edu-sidebar button,.edu-sidebar>a{min-height:48px;font-size:14px}
.edu-sidebar button.active{background:var(--student-navy)!important}
.icon-button,.avatar-button{min-width:44px;min-height:44px}
.edu-brand b{font-size:14px!important}.edu-brand small{font-size:10px!important}
.app-card,.metric-card{border-color:var(--student-line)!important;box-shadow:var(--student-shadow)!important}
.welcome-copy>p:last-of-type{font-size:16px!important;line-height:1.65}
.date-chip,.welcome-tags span,.focus-card span,.focus-card em{font-size:13px!important}
.focus-card small{font-size:10px!important}
.metric-card small{font-size:13px!important}
.section-heading h2{font-size:21px!important}
.text-button{min-height:44px;padding:9px 8px!important;border-radius:10px}
.preparation-list small,.horenso-form label>span,.uniform-badge small,.mental-grid small,.profile-details small{font-size:11px!important}
.preparation-list b,.agenda-row>span b,.timeline-item>div b,.result-row>div b,.attendance-list>div>span b,.competency-list span b,.five-s-grid b,.safety-grid b,.profile-menu a b{font-size:13px!important}
.preparation-list>div,.action-grid button,.agenda-row,.timeline-item,.habit-list span,.accordion-list summary,.result-row,.attendance-list>div,.five-s-grid>div,.care-grid>div,.safety-grid>div,.profile-menu a{min-height:48px}
.action-grid button{font-size:13px!important}
.agenda-row>span small,.timeline-item>div small,.result-row>div small,.attendance-list>div>span small,.competency-list span small,.five-s-grid small,.identity-list span,.care-grid p,.safety-grid p,.profile-menu a small,.empty-state p,.note-item small{font-size:12px!important;line-height:1.5}
.horenso-form input,.horenso-form select,.horenso-form textarea,.guide-search input{min-height:48px;font-size:15px!important}
.primary-action,.secondary-action,.assignment-submit-form button{min-height:48px!important;font-size:14px!important}
.note-item p,.assessment-copy,.recommendation p{font-size:13px!important;line-height:1.6}
.timeline-item time{font-size:12px!important}
.status-chip{font-size:10px!important;min-height:30px}
.habit-list span{font-size:13px!important}
.habit-device-note{margin:11px 0 0;color:var(--student-muted);font-size:12px;line-height:1.5}
.accordion-list ol,.accordion-list details>p{font-size:13px!important;line-height:1.6}
.phrase-list b{font-size:16px!important}.phrase-list span,.phrase-list small{font-size:12px!important}
.guide-section pre{font-size:13px!important}
.profile-identity p,.profile-details b{font-size:14px}
.edu-bottom-nav button{min-height:54px;font-size:10px!important}
.edu-bottom-nav button i{font-size:20px!important}
.edu-toast{z-index:15000!important;max-width:calc(100vw - 28px);text-align:center;font-size:13px}

/* Academic content */
.academic-announcements .section-heading>span,.academic-materials .section-heading>span,.academic-assignments .section-heading>span{font-size:12px!important}
.announcement-list-student small,.student-material-card small,.student-file-meta span,.student-assignment-card summary small,.student-assignment-card summary p,.assignment-submit-form label>span,.student-upload-field small,.assignment-submission-current small{font-size:12px!important}
.announcement-list-student p,.student-material-card p,.assignment-detail-student>p,.assignment-feedback p,.assignment-submission-current p{font-size:13px!important;line-height:1.65!important}
.student-material-actions a{min-height:44px;font-size:13px!important}
.student-assignment-card summary{min-height:68px}
.assignment-submit-form textarea{min-height:120px;font-size:15px!important}
.student-upload-field{min-height:92px;display:grid;align-content:center}
.student-upload-field b{font-size:13px}
.file-selection{display:block;margin-top:6px;color:var(--student-muted);font-size:12px}
.file-selection.error{color:var(--student-danger);font-weight:800}

/* PWA layers must sit above fixed application chrome */
.student-pwa-status{z-index:18000!important}
.student-pwa-install-fab{z-index:17900!important;min-height:52px!important}
.student-pwa-update{z-index:18100!important}
.student-pwa-sheet{z-index:19000!important}
.student-pwa-sheet__close,.student-pwa-primary{min-height:44px}

/* Responsive refinements */
@media(max-width:820px){
  body.education-native,body.portal-body,body.student-login{font-size:15px}
  .edu-main{padding-left:12px!important;padding-right:12px!important}
  .edu-bottom-nav{left:8px!important;right:8px!important}
  .welcome-card{padding:22px!important}
  .metric-card{min-width:78vw!important;max-width:310px}
  .section-heading{align-items:flex-start}
  .profile-details{grid-template-columns:1fr!important}
  .student-pwa-install-fab{right:12px;bottom:calc(92px + env(safe-area-inset-bottom))}
}
@media(max-width:760px){
  html{scroll-padding-top:78px!important}
  .portal-topbar{min-height:62px!important}
  .portal-shell{padding-left:10px!important;padding-right:10px!important}
  .student-hero{padding:21px!important}
  .student-hero h1{font-size:32px!important;line-height:1.08}
  .kpi-grid{grid-template-columns:1fr 1fr!important}
  .kpi-grid article{min-height:126px;padding:16px!important}
  .journey-card,.support-card,.section-card{padding:17px!important}
  .invoice-item{gap:10px!important}
  .payment-form{bottom:calc(82px + env(safe-area-inset-bottom))!important}
  .mobile-nav{left:7px!important;right:7px!important;bottom:max(7px,env(safe-area-inset-bottom))!important}
}
@media(max-width:430px){
  .kpi-grid{grid-template-columns:1fr!important}
  .kpi-grid article{min-height:112px}
  .student-material-card{grid-template-columns:42px minmax(0,1fr)!important}
  .action-grid{grid-template-columns:1fr!important}
  .student-pwa-install-fab b{display:none}
}
@media(prefers-contrast:more){
  :root{--student-muted:#3f4d5f;--student-line:#aebdca}
  .app-card,.portal-card,.metric-card,.kpi-grid article{border-width:2px!important}
}
@media(prefers-reduced-motion:reduce){
  .skip-link{transition:none}.is-loading::after{animation-duration:1.4s}
}