/* The welcome page has its own quiet palette, independent of classroom panels. */
.signin-screen{
  --signin-theme-top:clamp(8px,1.8dvh,22px);
  --signin-bg:#f8faf7;--signin-title:#183c30;--signin-body:#6c7d76;--signin-soft:#819089;
  --signin-green:#78966a;--signin-card:#ffffffed;--signin-input:#fafbf9;--signin-border:#e3e9e3;
  --signin-icon-bg:#e5eee0;--signin-icon:#2e674e;--signin-button:#246e53;--signin-button-end:#1d5b46;
  position:relative;isolation:isolate;overflow:clip;min-height:100dvh;display:grid;align-items:center;color:var(--signin-title);
  background:radial-gradient(ellipse at 4% 100%,#e9e4d65c,transparent 44%),radial-gradient(ellipse at 89% 20%,#ecf2ef88,transparent 50%),var(--signin-bg);
}
.signin-window-light{position:absolute;z-index:-1;inset:0 auto 0 0;width:34%;pointer-events:none;opacity:.38;background:repeating-linear-gradient(78deg,transparent 0 90px,#d8d5bb25 92px 102px,transparent 114px 222px);filter:blur(9px);transform:skewX(8deg);transform-origin:top left}
.signin-background-leaves{position:absolute;z-index:-1;width:430px;height:700px;left:-320px;bottom:-255px;transform:rotate(-18deg);color:#557941;filter:blur(10px);opacity:.32;pointer-events:none}
.signin-background-leaves svg{width:100%;height:100%}
/* Keep the vertical screen inset, but use the form column's static flex position
   for horizontal alignment. The control and card always share their right edge. */
.signin-theme{position:absolute;top:var(--signin-theme-top);left:auto;right:auto;align-self:flex-end;z-index:3}
.signin-theme .theme-toggle{zoom:1.4;height:44px;padding:3px;background:var(--signin-card);border-color:var(--signin-border)}
.signin-theme .theme-toggle-label{display:inline;color:var(--signin-icon);font-size:12px}
.signin-theme .theme-toggle-light,.signin-theme .theme-toggle-dark{width:36px;height:36px}
.signin-layout{display:grid;grid-template-columns:minmax(0,1.42fr) minmax(340px,1fr);gap:clamp(24px,4.2vw,76px);align-items:center;width:100%;max-width:1820px;height:min(100dvh,1100px);min-height:min-content;margin:0 auto;padding:clamp(56px,7dvh,84px) clamp(24px,5vw,90px) clamp(14px,2.5dvh,30px)}
.signin-story{min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;justify-content:center}
.signin-eyebrow{font-size:clamp(10px,.79vw,13px);line-height:1.5;letter-spacing:.24em;font-weight:650;color:var(--signin-soft);margin:0 0 clamp(12px,2.4dvh,32px)}
.signin-story h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(32px,min(4.5vw,7.6dvh),82px);line-height:1.06;letter-spacing:-.052em;font-weight:700;color:var(--signin-title);margin:0;white-space:nowrap}
.signin-story h1>span{color:var(--signin-green)}
.signin-small-leaf{display:block;width:50px;height:10px;margin:clamp(6px,1.1dvh,12px) 0 clamp(8px,1.3dvh,14px) 4px;flex-shrink:0;background:linear-gradient(160deg,#b8c59b 10%,#698f4d 70%);border-radius:100% 0 100% 0;transform:rotate(-12deg)}
.signin-intro{font-size:clamp(14px,min(1.37vw,2.2dvh),23px);line-height:1.55;color:var(--signin-body);max-width:850px}
.signin-promises{display:flex;justify-content:space-between;gap:16px;margin:clamp(14px,2.3dvh,28px) 0 10px;flex-shrink:0;padding:0;list-style:none;max-width:770px}
.signin-promises li{display:flex;align-items:center;gap:clamp(10px,1.25vw,23px);min-width:0}
.signin-promises li>span{width:clamp(38px,min(4.1vw,6.5dvh),66px);height:clamp(38px,min(4.1vw,6.5dvh),66px);display:grid;place-items:center;border-radius:50%;background:var(--signin-icon-bg);color:var(--signin-icon);flex-shrink:0}
.signin-promises .icon{width:clamp(21px,min(1.85vw,3.4dvh),30px);height:clamp(21px,min(1.85vw,3.4dvh),30px);stroke-width:1.6}
.signin-promises p{font-size:clamp(12px,min(1.1vw,1.9dvh),18px);line-height:1.4;color:var(--signin-body);font-weight:500}
.signin-visual{position:relative;flex:1 1 0;min-height:0;width:100%;margin:8px 0 0;padding:0 0 28px;isolation:isolate}
.signin-visual::before{content:"";position:absolute;width:58%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#d5dec866,transparent 71%);left:27%;top:0;z-index:-1}
.signin-art{position:absolute;inset:0 0 28px;display:block;width:100%;height:calc(100% - 28px);object-fit:contain;z-index:1;filter:drop-shadow(0 18px 28px #3446260b)}
.signin-art-dark{display:none}
.signin-art-orbit{position:absolute;inset:8% 2% 15%;border:1px solid #aebd8e66;border-radius:50%;transform:rotate(-15deg);z-index:-1}
.signin-art-orbit.second{inset:57% 3% -1% 41%;transform:rotate(16deg);border-color:#aebd8e44}
.signin-art-star{position:absolute;right:8%;top:-10px;color:#8fA375;font-size:30px}
.signin-art-caption{position:absolute;right:19%;bottom:0;display:flex;align-items:center;gap:12px;font-family:"Segoe Print","Segoe UI",cursive;font-size:clamp(13px,1.2vw,20px);color:#8a9786;transform:rotate(-3deg)}
.signin-art-caption .icon{width:27px;height:27px;color:#94a681}
.signin-form-column{display:flex;flex-direction:column;min-width:0;max-width:650px;width:100%;justify-self:center}
.signin-card{position:relative;isolation:isolate;overflow:hidden;background:var(--signin-card);border:1px solid #ffffffbd;border-radius:clamp(28px,2.65vw,48px);padding:clamp(20px,min(3.3vw,3.4dvh),48px);box-shadow:0 20px 90px #254b3915,0 2px 5px #24483304;backdrop-filter:blur(14px)}
.signin-card-leaves{position:absolute;width:clamp(115px,11vw,200px);height:clamp(115px,11vw,200px);right:-13px;top:-15px;color:#a6b890;opacity:.5;z-index:-1;pointer-events:none}
.signin-card-leaves svg{display:block;width:100%;height:100%}
.signin-brand-area{width:76%;max-width:330px;padding-bottom:clamp(12px,1.7dvh,24px);margin-bottom:clamp(14px,1.9dvh,26px);border-bottom:1px solid var(--signin-border)}
.brand.school-brand.signin-brand{width:100%;padding:0;gap:0;min-height:0}
.brand.school-brand.signin-brand .brand-mark{aspect-ratio:240/55}
.brand.school-brand.signin-brand .brand-logo{width:120.416667%;left:-5.833333%;top:-16.363636%}
/* Match the reference lockup: the caption spans the wordmark at every size. */
.signin-brand .signin-brand-caption{display:block;width:100%;height:auto;overflow:visible;margin-top:2.5cqi;flex-shrink:0;fill:var(--signin-soft)}
.signin-brand-caption text{font-family:"Segoe UI",Arial,sans-serif;font-size:10px;font-weight:600;letter-spacing:normal}
.signin-card h2{font-family:Georgia,"Times New Roman",serif;font-weight:700;letter-spacing:-.055em;font-size:clamp(27px,min(2.82vw,4.7dvh),47px);line-height:1.17;margin:0 0 7px;color:var(--signin-title);white-space:nowrap}
.signin-card-intro{font-size:clamp(13px,min(1.17vw,2dvh),19px);line-height:1.45;color:var(--signin-body);margin-bottom:clamp(14px,2dvh,26px)}
.signin-form{display:flex;flex-direction:column;gap:clamp(12px,1.8dvh,22px)}
.signin-field>label{display:block;font-size:clamp(13px,min(1.12vw,1.9dvh),17px);line-height:1.4;font-weight:600;color:var(--signin-title);margin-bottom:6px}
.signin-input-wrap{display:flex;align-items:center;gap:15px;border:1px solid var(--signin-border);background:var(--signin-input);border-radius:11px;min-width:0;padding:0 17px;box-shadow:inset 0 1px 3px #182f2510;transition:border-color .15s,box-shadow .15s}
.signin-input-wrap>.icon{width:21px;height:21px;color:var(--signin-soft);flex-shrink:0}
.signin-input-wrap:focus-within{border-color:#719980;box-shadow:0 0 0 3px #71998020}
.signin-input-wrap input{display:block;width:100%;min-width:0;border:0;outline:none;background:transparent;padding:0;min-height:clamp(44px,min(4.25vw,6dvh),64px);font-size:clamp(16px,1.12vw,20px);line-height:1.5;color:var(--signin-title);box-shadow:none;border-radius:0}
.signin-input-wrap input::placeholder{color:var(--signin-soft);opacity:1}
.signin-input-wrap input:focus-visible{outline:none}
.signin-input-wrap input:-webkit-autofill{-webkit-text-fill-color:var(--signin-title);box-shadow:0 0 0 1000px var(--signin-input) inset;caret-color:var(--signin-title)}
.signin-password-toggle{display:grid;place-items:center;min-width:40px;min-height:44px;flex-shrink:0;color:var(--signin-soft);padding:0;margin-right:-7px;border-radius:8px}
.signin-password-toggle:hover{color:var(--signin-icon);background:var(--signin-icon-bg)}
.signin-password-toggle .icon{width:21px;height:21px}
.signin-form .form-error:empty{display:none}
.signin-form .form-error{margin:0;padding:11px 13px;border-radius:8px;color:var(--theme-red-text,#a74438);background:var(--theme-red-soft,#fff1ed);font-size:13px;line-height:1.5}
.signin-submit{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:clamp(48px,min(4.55vw,6.5dvh),70px);padding:10px 20px;border:1px solid #448f7155;border-radius:13px;color:#f5f8f4;background:linear-gradient(135deg,var(--signin-button),var(--signin-button-end));box-shadow:0 9px 22px #245d4320,inset 0 1px 1px #ffffff20;font-size:clamp(16px,min(1.3vw,2.2dvh),22px);font-weight:600;line-height:1.5;transition:box-shadow .15s,background .15s}
.signin-submit>.icon{width:25px;height:25px}
.signin-submit:hover:not(:disabled){background:var(--signin-button-end);box-shadow:0 10px 26px #245d4336}
.signin-submit:disabled{opacity:.65;cursor:wait}
.signin-account-note{display:flex;align-items:center;gap:12px;border-top:1px solid var(--signin-border);border-bottom:1px solid var(--signin-border);padding:clamp(10px,1.7dvh,22px) 0;margin:clamp(14px,2dvh,26px) 0 12px}
.signin-account-note>span{display:grid;place-items:center;flex-shrink:0;width:clamp(36px,5dvh,48px);height:clamp(36px,5dvh,48px);border-radius:50%;background:var(--signin-icon-bg);color:var(--signin-icon)}
.signin-account-note .icon{width:24px;height:24px}
.signin-account-note p{font-size:clamp(12px,min(1vw,1.7dvh),16px);line-height:1.5;color:var(--signin-body)}
.signin-demo-note{font-size:clamp(10px,.83vw,13px);line-height:1.6;text-align:center;color:var(--signin-soft)}
.signin-signature{display:flex;align-items:center;justify-content:flex-end;gap:11px;margin:14px 18px 0 0;font-family:"Segoe Print","Segoe UI",cursive;font-size:clamp(12px,1.1vw,19px);line-height:1.45;transform:rotate(-4deg);color:#94a08d}
.signin-signature .icon{width:29px;height:29px;color:#98b287}

html[data-theme="dark"] .signin-screen{
  --signin-bg:#191b1e;--signin-title:#e8eaed;--signin-body:#c1c5cc;--signin-soft:#aab4ad;
  --signin-green:#a5ba96;--signin-card:#25282bf5;--signin-input:#1e2224;--signin-border:#3b4141;
  --signin-icon-bg:#303c35;--signin-icon:#b6ceb9;--signin-button:#3c7057;--signin-button-end:#2e5c47;
  background:radial-gradient(ellipse at 10% 91%,#6b75531c,transparent 46%),radial-gradient(ellipse at 91% 15%,#738a6c0f,transparent 43%),var(--signin-bg);
}
html[data-theme="dark"] .signin-window-light{opacity:.16}
html[data-theme="dark"] .signin-background-leaves{opacity:.14}
html[data-theme="dark"] .signin-card{border-color:#454d454d;box-shadow:0 24px 85px #00000038,inset 0 1px 1px #ffffff06}
html[data-theme="dark"] .signin-card-leaves{color:#84966d;opacity:.29}
html[data-theme="dark"] .signin-small-leaf{opacity:.85}
html[data-theme="dark"] .signin-input-wrap input::placeholder{color:#b4b9c2}
html[data-theme="dark"] .signin-art-light{display:none}
html[data-theme="dark"] .signin-art-dark{display:block}
html[data-theme="dark"] .signin-visual::before{background:radial-gradient(circle,#87926322,transparent 70%)}
html[data-theme="dark"] .signin-art-orbit{border-color:#a0b18135}
html[data-theme="dark"] .signin-art-caption,html[data-theme="dark"] .signin-signature{color:#aebaa6}
html[data-theme="dark"] .signin-input-wrap:focus-within{border-color:#92b39d;box-shadow:0 0 0 3px #92b39d25}
html[data-theme="dark"] .signin-submit{color:#f0f5ed;box-shadow:0 9px 22px #00000025,inset 0 1px 1px #ffffff15}
html[data-theme="dark"] .signin-submit:hover:not(:disabled){background:#447c61}
/* The illustration uses the space left by the text; it never dictates page height. */
@media(max-height:850px){.signin-signature{display:none}.signin-layout{padding-left:clamp(24px,4vw,70px);padding-right:clamp(24px,4vw,70px)}.signin-brand-area{max-width:265px}.signin-art-caption{font-size:14px}}
@media(min-width:901px) and (max-height:650px){
  .signin-layout{padding-top:54px;padding-bottom:12px;gap:32px;grid-template-columns:minmax(0,1.42fr) minmax(360px,1fr)}
  .signin-card{padding:18px 24px;border-radius:25px}.signin-brand-area{width:64%;max-width:240px;padding-bottom:10px;margin-bottom:12px}
  .signin-card h2{font-size:28px}.signin-card-intro{font-size:13px;margin-bottom:12px}.signin-form{gap:12px}
  .signin-account-note{padding:10px 0;margin:12px 0 8px}.signin-account-note p{font-size:12px}.signin-demo-note{font-size:10px}
}
@media(max-width:1100px) and (min-width:901px){
  .signin-layout{gap:28px;padding-left:28px;padding-right:28px;grid-template-columns:minmax(0,1.25fr) minmax(340px,1fr)}
  .signin-story h1{font-size:min(4.35vw,7.6dvh)}.signin-card h2{font-size:29px}.signin-promises{gap:10px}.signin-promises li{gap:8px}
}
@media(max-width:900px){
  .signin-layout{grid-template-columns:minmax(0,1fr);align-content:center;max-width:510px;height:auto;min-height:100dvh;padding:64px 24px 18px;gap:clamp(14px,2dvh,24px)}
  .signin-story{height:auto;text-align:center}.signin-eyebrow{font-size:10px;letter-spacing:.17em;margin-bottom:12px}
  .signin-story h1{font-size:clamp(28px,min(5.5vw,4.4dvh),42px);line-height:1.1}
  .signin-small-leaf{display:none}.signin-intro{font-size:14px;line-height:1.5;margin-top:12px}.signin-intro br{display:none}
  .signin-promises,.signin-visual,.signin-signature{display:none}
  .signin-card{padding:clamp(18px,3dvh,32px);border-radius:28px}.signin-brand-area{width:70%;max-width:275px}
  .signin-card h2{font-size:clamp(26px,4dvh,34px);white-space:normal}.signin-card-intro{font-size:14px}
  .signin-input-wrap{padding:0 12px;gap:10px}.signin-input-wrap input{font-size:16px}
  .signin-screen{--signin-theme-top:10px}.signin-background-leaves{opacity:.13}
}
@media(max-width:900px) and (max-height:800px){.signin-story{display:none}.signin-layout{max-width:490px}.signin-brand-area{max-width:245px}.signin-account-note>span{display:none}}
@media(max-width:480px){
  .signin-layout{padding:58px 16px 14px;gap:16px}.signin-eyebrow,.signin-intro{display:none}
  .signin-story h1{font-size:clamp(26px,7.4vw,33px)}.signin-card{padding:20px;border-radius:24px}
  .signin-brand-area{width:78%;padding-bottom:12px;margin-bottom:14px}
  .signin-card h2{font-size:clamp(25px,7.5vw,29px)}.signin-card-intro{font-size:13px}
  .signin-submit{font-size:15px;padding:10px 14px}.signin-account-note p{font-size:12px}
  .signin-demo-note{font-size:10px}.signin-screen{--signin-theme-top:8px}
}
@media(max-width:900px) and (max-height:620px){
  .signin-layout{padding-top:52px;padding-bottom:10px}.signin-card{padding:14px 18px}
  .signin-brand-area{width:65%;padding-bottom:8px;margin-bottom:10px}.signin-card h2{font-size:26px;margin-bottom:4px}
  .signin-card-intro{font-size:12px;margin-bottom:12px}.signin-form{gap:10px}.signin-field>label{font-size:13px;margin-bottom:4px}
  .signin-account-note{padding:8px 0;margin:10px 0 6px}.signin-demo-note{font-size:10px}
}
/* Landscape phones and short windows use a side-by-side card instead of shrinking inputs. */
@media(min-width:520px) and (max-height:580px){
  .signin-layout{display:block;max-width:920px;height:auto;min-height:100dvh;padding:54px 24px 12px}
  .signin-story,.signin-signature{display:none}.signin-form-column{max-width:none}
  .signin-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);column-gap:32px;align-content:center;padding:22px 28px;border-radius:24px}
  .signin-brand-area{grid-column:1;width:86%;max-width:230px;padding-bottom:12px;margin-bottom:12px}
  .signin-card h2{grid-column:1;font-size:27px;white-space:normal}.signin-card-intro{grid-column:1;font-size:13px;margin:0}
  .signin-form{grid-column:2;grid-row:1 / span 5;align-self:center;gap:12px}
  .signin-field>label{font-size:13px}.signin-input-wrap{padding:0 10px;gap:8px}.signin-input-wrap input{min-height:44px;font-size:16px}
  .signin-submit{min-height:46px;font-size:15px;padding:10px 12px}
  .signin-account-note{grid-column:1;padding:12px 0;margin:12px 0 6px}.signin-account-note>span{display:none}.signin-account-note p{font-size:12px}
  .signin-demo-note{grid-column:1;font-size:10px;text-align:left}.signin-card-leaves{display:none}
}
@media(max-height:380px) and (min-width:520px){.signin-layout{padding-top:48px;padding-bottom:8px}.signin-card{padding:14px 22px;column-gap:24px}.signin-brand-area{width:65%;padding-bottom:6px;margin-bottom:6px}.signin-card h2{font-size:24px}.signin-card-intro{font-size:12px}.signin-account-note{padding:7px 0;margin:8px 0 5px}.signin-account-note p{font-size:11px}.signin-demo-note{font-size:9px}.signin-form{gap:8px}}
@media(prefers-reduced-motion:reduce){.signin-input-wrap,.signin-submit{transition:none}}

@media(max-width:519px) and (max-height:540px){
  .signin-card h2,.signin-card-intro{display:none}.signin-brand-area{width:156px;max-width:75%;margin-bottom:14px}
  .signin-card{padding:14px 16px}.signin-account-note p{font-size:11px}.signin-input-wrap{gap:8px;padding:0 10px}
}
/* A useful error takes priority over the explanatory note in a short viewport. */
@media(max-height:700px){.signin-card:has(.form-error:not(:empty)) .signin-account-note{display:none}.signin-card:has(.form-error:not(:empty)) .signin-demo-note{margin-top:12px}}
@media(min-width:481px) and (max-width:900px) and (max-height:900px){.signin-story{display:none}}
@media(max-height:380px) and (min-width:520px){.signin-card{padding-top:12px;padding-bottom:12px}.signin-form{gap:6px}.signin-field>label{margin-bottom:4px}.signin-form .form-error{padding:6px 10px;font-size:12px;line-height:1.4}}
/* Reserve the 44px control at 140% plus a 12px gap, including short windows. */
.signin-layout{padding-top:max(clamp(56px,7dvh,84px),calc(var(--signin-theme-top) + 61.6px + 12px))}
@media(max-width:360px) and (min-height:541px) and (max-height:700px){
  .signin-card{padding-block:16px}.signin-account-note{margin-top:10px;margin-bottom:8px}
}
@media(min-width:520px) and (min-height:381px) and (max-height:420px){.signin-card{padding-block:14px}}