/* Device-specific School Word authentication layout. Served from a new URL to avoid stale mixed layouts. */
.account-overlay,.account-overlay.has-welcome{box-sizing:border-box;background:#f8faff url('/assets/brand/login-schoolword.webp') left top/100% auto no-repeat!important;backdrop-filter:none!important;color:#10234b;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,440px);gap:5vw;padding:36px 6vw;align-items:center;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}
.account-overlay::-webkit-scrollbar{display:none;width:0;height:0}
.account-responsive-logo{display:none;box-sizing:border-box}
.account-responsive-logo img{display:block;max-width:100%;height:auto;object-fit:contain}
.account-overlay:not(.has-welcome){grid-template-columns:minmax(0,1fr);justify-items:end}
.account-overlay .account-welcome{align-self:center;padding-top:clamp(180px,20vw,300px);max-width:580px;text-shadow:none;color:#14264c}
.account-overlay .account-welcome h1{color:#12254b;font-size:clamp(27px,3vw,42px);line-height:1.16;letter-spacing:-1.1px;margin:14px 0}
.account-overlay .account-welcome p{color:#586783;font-size:15px;line-height:1.7;max-width:530px}
.account-overlay .public-learning-links{gap:9px 16px;margin-top:20px}.account-overlay .public-learning-links a{color:#2454d7;font-size:13px;text-underline-offset:4px}
.account-overlay .account-box{box-sizing:border-box;min-width:0;width:100%;max-width:440px;max-height:none;overflow:visible;background:#ffffffed!important;color:#14264c;border:1px solid #d7e2f5;border-radius:22px;padding:28px;box-shadow:0 18px 65px #1c3c8117;backdrop-filter:blur(8px)}
.account-overlay .account-box :is(h1,h2){color:#112550}.account-overlay .account-box :is(p,small){color:#586783}.account-overlay .account-box label{color:#243958}
.account-overlay .account-box :is(input,select){box-sizing:border-box;width:100%;max-width:100%;background:#f5f8ff;color:#10234b;color-scheme:light;border:1px solid #cbd7eb;border-radius:10px;min-height:44px}
.account-overlay .account-box :is(input,select):focus-visible{outline:3px solid #386aff40;border-color:#386aff;outline-offset:1px}
.account-overlay .account-box a,.account-overlay .account-box button:not(.btn){color:#2457d8}.account-overlay .account-box .btn.primary{box-sizing:border-box;width:100%;background:linear-gradient(110deg,#075fff,#6342e8)!important;color:white!important;box-shadow:0 5px 15px #285bdb25;border:0;min-height:46px}
.account-overlay .sw-account-brand{color:#3159b3;font-size:10px;letter-spacing:.1em}.account-overlay .account-error{color:#ad243c!important}.account-overlay .account-status{color:#167047!important}.account-overlay .account-notice{background:#edf3ff;border-color:#c8d9fb;color:#26446e}.account-overlay .account-links{font-size:11px!important;line-height:1.9!important}

/* Tablet and iPad: a centered wordmark above a comfortable account card. */
@media(min-width:601px) and (max-width:1023px){
  .account-overlay,.account-overlay.has-welcome,.account-overlay:not(.has-welcome){grid-template-columns:1fr!important;grid-template-rows:auto auto;gap:22px;justify-items:center;align-content:start;min-height:100dvh;padding:42px 28px;background:linear-gradient(155deg,#f9fbff 0%,#eef4ff 100%)!important}
  .account-responsive-logo{display:flex;width:100%;height:auto;margin:4px auto 0;align-items:center;justify-content:center;justify-self:stretch}
  .account-responsive-logo img{width:min(360px,60vw)!important;height:auto!important;margin:0 auto!important}
  .account-overlay .account-welcome{display:none}
  .account-overlay .account-box{width:min(100%,560px);max-width:560px;padding:30px}
}

/* Phone: compact single column with no decorative text competing with the form. */
@media(max-width:600px){
  .account-overlay,.account-overlay.has-welcome,.account-overlay:not(.has-welcome){grid-template-columns:1fr!important;grid-template-rows:auto auto;gap:18px;justify-items:center;align-content:start;min-height:100dvh;padding:24px 14px;background:linear-gradient(165deg,#fbfdff 0%,#edf3ff 100%)!important}
  .account-responsive-logo{display:flex;width:100%;height:auto;margin:8px auto 2px;align-items:center;justify-content:center;justify-self:stretch;overflow:hidden}
  .account-responsive-logo img{width:min(270px,72vw)!important;height:auto!important;margin:0 auto!important;max-width:calc(100vw - 56px)!important}
  .account-overlay .account-welcome{display:none!important}
  .account-overlay .account-box{inline-size:calc(100vw - 28px)!important;width:calc(100vw - 28px)!important;max-width:calc(100vw - 28px)!important;justify-self:center;padding:22px 20px;border-radius:18px}
  .account-overlay .account-pair{grid-template-columns:1fr;gap:0}
  .account-overlay .sw-account-brand{gap:10px}.account-overlay .sw-account-brand .sw-logo{width:34px;height:34px}
  .account-overlay .account-box h2{font-size:30px;line-height:1.1;margin-block:22px 12px}
  .account-overlay .account-links{text-align:center}
}

@media(max-width:360px){
  .account-overlay,.account-overlay.has-welcome,.account-overlay:not(.has-welcome){padding-inline:10px}
  .account-overlay .account-box{inline-size:calc(100vw - 20px)!important;width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)!important;padding:20px 16px}
  .account-responsive-logo img{width:min(228px,70vw)!important;max-width:calc(100vw - 44px)!important}
}
/* A real image in document flow prevents cropped signup branding. */
.account-responsive-logo img{content:url('/assets/brand/schoolword-wordmark-tight.png');image-rendering:auto;filter:none!important}
.account-overlay,.account-overlay.has-welcome,.account-overlay:not(.has-welcome){background:linear-gradient(145deg,#fff,#f0f6ff)!important;align-items:center!important;align-content:start!important}
.account-overlay .account-welcome{display:none!important}
.account-overlay .account-responsive-logo{display:flex!important;position:relative!important;inset:auto!important;transform:none!important;grid-column:1;grid-row:1;align-self:center;justify-self:center;width:100%!important;height:auto!important;min-height:100px;overflow:visible!important;margin:0!important;padding:12px!important}
.account-overlay .account-responsive-logo img{display:block;width:min(520px,100%)!important;max-width:100%!important;height:auto!important;object-fit:contain!important;transform:none!important;filter:none!important}
.account-overlay .account-box{grid-column:2;grid-row:1;backdrop-filter:none!important}
.account-overlay .account-box label.account-agree{display:grid!important;grid-template-columns:22px minmax(0,1fr)!important;gap:12px!important;align-items:start!important;width:100%!important;margin:18px 0!important;font-size:14px!important;line-height:1.6!important}
.account-overlay .account-box label.account-agree input[type="checkbox"]{appearance:auto!important;width:20px!important;height:20px!important;min-height:20px!important;max-width:20px!important;margin:2px 0 0!important;padding:0!important;accent-color:#146b60;justify-self:start;border-radius:4px!important}
.account-overlay .account-agree>span{min-width:0!important;width:auto!important;overflow-wrap:anywhere;text-align:left!important}
@media(max-width:900px){.account-overlay,.account-overlay.has-welcome,.account-overlay:not(.has-welcome){display:flex!important;flex-direction:column!important;justify-content:flex-start!important;align-items:center!important;gap:22px!important;padding:28px 14px!important;overflow-y:auto!important}.account-overlay .account-responsive-logo{flex:none!important;min-height:72px!important;width:100%!important;max-width:400px!important;padding:10px 16px!important}.account-overlay .account-responsive-logo img{width:min(320px,100%)!important}.account-overlay .account-box{flex:none;grid-column:auto;grid-row:auto;margin:0!important;max-width:560px!important}.account-overlay .account-box h1{font-size:clamp(27px,6vw,34px)!important}}

/* Public introduction and comfortable account controls. */
.account-overlay .account-box :is(input,select){font-size:16px!important;min-height:48px;border:1px solid #718099!important}
.account-overlay .account-box :is(p,label,small){font-size:14px;line-height:1.65}
.account-overlay .account-box button:not(.account-close){min-height:44px}
.account-overlay .account-links{display:flex!important;flex-wrap:wrap;justify-content:center;gap:4px 12px;font-size:14px!important}
.account-overlay .account-links a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;padding-inline:3px}
.account-overlay .account-box :is(a,button,input,select):focus-visible{outline:3px solid #0755c9;outline-offset:3px}
.account-overlay.has-welcome{grid-template-columns:minmax(0,1fr) minmax(360px,440px)!important;grid-template-rows:auto 1fr;row-gap:18px;min-height:100dvh}
.account-overlay.has-welcome .account-responsive-logo{grid-column:1;grid-row:1;align-self:end;min-height:0;max-width:520px}
.account-overlay.has-welcome .account-welcome{display:block!important;grid-column:1;grid-row:2;align-self:start;max-width:580px;padding:0 12px!important}
.account-overlay.has-welcome .account-box{grid-column:2;grid-row:1 / span 2;align-self:start}
.account-overlay .account-welcome h1{font-size:clamp(28px,3vw,42px);line-height:1.2}
.account-overlay .account-welcome p{font-size:16px;line-height:1.6}
.account-overlay .public-learning-links{display:flex;flex-wrap:wrap;gap:4px 14px}
.account-overlay .public-learning-links a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;color:#174bb9}
.account-overlay .public-start{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 20px;margin-block:10px;border:0;border-radius:10px;background:#146b60;color:white;font-size:16px;font-weight:700}
.account-overlay .guardian-note{background:#edf6f0;color:#193c40;border:1px solid #718099;border-radius:10px;padding:14px;margin-block:14px}
.account-overlay .guardian-note[hidden]{display:none!important}
.account-overlay .privacy-summary a{font-size:14px;line-height:1.7}
#cloud-save-status.cloud-save-status{position:fixed;z-index:60;right:16px;bottom:20px;max-width:min(420px,calc(100vw - 32px));padding:12px 16px;background:#edf6f0;color:#193c40;border:1px solid #5c7a70;border-radius:12px;font:14px/1.5 system-ui,sans-serif;box-shadow:0 5px 20px #10234b22}
#cloud-save-status.cloud-save-status[data-error="true"]{background:#fff2e9;border-color:#a84318;color:#65230c}
.cloud-save-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.cloud-save-actions button{min-height:44px;padding:8px 12px;border:1px solid currentColor;border-radius:8px;color:inherit;background:transparent;font:inherit;cursor:pointer}
@media(max-width:900px){.account-overlay.has-welcome{display:flex!important}.account-overlay.has-welcome .account-responsive-logo{max-width:320px}.account-overlay.has-welcome .account-welcome{width:100%;padding:0 6px!important}.account-overlay .account-welcome h1{font-size:28px;margin-top:0}.account-overlay .account-welcome p{font-size:16px}.account-overlay .public-learning-links{gap:0 12px}#cloud-save-status.cloud-save-status{bottom:88px}.account-overlay .account-box{max-width:560px!important}}

#cloud-save-status.cloud-save-status,#cloud-save-status.cloud-save-status[data-error="true"]{display:block!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}
html.account-locked #cloud-save-status.cloud-save-status{display:none!important}