@import"https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@900&family=Nunito:wght@500;600;700;800;900&display=swap";:root{font-family:Nunito,system-ui,sans-serif;color:#23365d;background:#fdf8eb;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;overflow:hidden;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}.web-login{position:relative;min-height:100vh;overflow:hidden;isolation:isolate;background-color:#fbf8ed;background-image:url(/assets/kiddy/web-login-sky.webp);background-position:center;background-size:cover}.language-switch{position:absolute;z-index:5;top:22px;right:26px;display:inline-flex;gap:3px;padding:4px;border:1px solid rgba(156,177,204,.52);border-radius:999px;background:#ffffffc2;box-shadow:0 7px 20px #2d497017;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.language-switch button{min-width:46px;padding:7px 11px;border:0;border-radius:999px;background:transparent;color:#61708e;cursor:pointer;font-size:12px;font-weight:900;transition:background-color .18s ease,color .18s ease,box-shadow .18s ease}.language-switch button[aria-pressed=true]{background:#fff;box-shadow:0 3px 10px #233e691f;color:#087f99}.content-shell{position:relative;z-index:3;width:min(1080px,calc(100vw - 56px));margin:0 auto;padding-top:clamp(32px,5vh,58px)}.brand-block{display:flex;align-items:center;justify-content:center;gap:18px;text-align:left}.brand-block img{width:104px;height:78px;object-fit:contain}.brand-block h1{margin:0;color:#102c84;font-size:clamp(42px,4.4vw,64px);font-weight:900;letter-spacing:-1.7px;line-height:1}.zh-brand-title{font-family:Noto Sans SC,Hiragino Sans GB,STHeiti,PingFang SC,Microsoft YaHei,sans-serif;font-weight:900;letter-spacing:-.045em}.brand-block p{margin:9px 0 0;color:#009fad;font-size:clamp(17px,1.5vw,22px);font-weight:800;letter-spacing:2px}.role-section{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;width:min(830px,100%);margin:clamp(26px,4vh,42px) auto 0}.role-card{display:grid;grid-template-columns:54px 1fr 22px;min-height:88px;align-items:center;gap:12px;padding:14px 16px;border:1.5px solid currentColor;border-radius:20px;background:#ffffffdb;box-shadow:0 10px 26px #2d497014;color:#139dbd;cursor:pointer;text-align:left;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease}.role-card-parent{color:#e6a30a}.role-card-teacher{color:#8259d1}.role-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px #2d497021}.role-card.selected{background:#fff;transform:translateY(-5px);box-shadow:0 16px 36px #24447229}.role-card:disabled{cursor:wait;opacity:.72}.role-icon{display:grid;width:54px;height:54px;place-items:center;border-radius:16px;background:#eef9fc}.role-card-parent .role-icon{background:#fff8e7}.role-card-teacher .role-icon{background:#f4efff}.role-icon img{width:48px;height:48px;object-fit:contain}.role-copy{display:grid;min-width:0}.role-copy strong{color:#173889;font-size:18px;font-weight:900}.role-copy small{margin-top:2px;color:#687695;font-size:11px;font-weight:700;white-space:nowrap}.role-arrow{justify-self:end}.login-panel{width:min(830px,100%);max-height:40px;margin:22px auto 0;overflow:hidden;opacity:.88;transition:max-height .42s ease,opacity .25s ease}.login-panel.visible{max-height:230px;opacity:1}.login-panel>p{margin:7px 0 0;color:#6c7790;font-size:13px;font-weight:800;text-align:center}.login-panel form{padding:18px 22px 14px;border:1px solid rgba(188,205,222,.72);border-radius:22px;background:#ffffffe0;box-shadow:0 16px 42px #324c741c;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.panel-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.panel-title>span{display:flex;align-items:baseline;gap:9px}.panel-title small{color:#6d7893;font-size:11px;font-weight:800}.panel-title strong{color:#153480;font-size:20px;font-weight:900;order:-1}.change-role,.form-meta button,.confirmed-code button{display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;color:#087f99;cursor:pointer;font-size:11px;font-weight:900}.form-row{display:grid;grid-template-columns:minmax(220px,1fr) minmax(220px,1fr) 210px;align-items:end;gap:12px}.role-student .form-row .field-grow{grid-column:span 2}.field-group{display:grid;gap:5px}.field-group>span:first-child{color:#455271;font-size:11px;font-weight:900}.field-shell{display:flex;min-height:46px;align-items:center;padding:0 12px;border:1.5px solid #d7e0ec;border-radius:13px;background:#fff;color:#8694aa}.field-shell:focus-within{border-color:#16a3bd;box-shadow:0 0 0 3px #16a3bd1a}.field-shell>svg{flex:0 0 17px}.field-shell input{width:100%;min-width:0;padding:0 9px;border:0;outline:0;background:transparent;color:#26375b;font-weight:800}.field-shell input::placeholder{color:#a5afc0;font-weight:600}.icon-button{display:grid;width:28px;height:28px;place-items:center;border:0;background:transparent;color:#71809c;cursor:pointer}.confirmed-code{display:flex;min-height:46px;align-items:center;justify-content:space-between;padding:7px 13px;border-radius:13px;background:#edf9fb}.confirmed-code>span{display:grid}.confirmed-code small{color:#73809a;font-size:10px;font-weight:800}.confirmed-code strong{color:#173889;font-weight:900;letter-spacing:1px}.submit-button{display:flex;min-height:46px;align-items:center;justify-content:center;gap:7px;border:0;border-radius:13px;background:#069fb6;box-shadow:0 8px 18px #069fb638;color:#fff;cursor:pointer;font-size:13px;font-weight:900}.submit-button:hover{background:#078daa}.submit-button:disabled{cursor:wait;opacity:.78}.spinner{animation:spin .8s linear infinite}.form-meta{display:flex;min-height:24px;align-items:center;justify-content:space-between;margin-top:8px}.form-message{display:inline-flex;align-items:center;gap:5px;color:#b74942;font-size:11px;font-weight:800}.tone-success{color:#25805f}.tone-info{color:#25728e}.account-options{display:inline-flex;align-items:center;gap:18px;color:#68758f;font-size:11px;font-weight:800}.account-options label{display:inline-flex;align-items:center;gap:6px}.account-options input{accent-color:#079fb7}.planet-stage{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;overflow:visible;pointer-events:none}.kiddy-planet{position:absolute;top:clamp(470px,61vh,620px);left:50%;width:min(1120px,84vw);height:auto;aspect-ratio:1;transform-origin:50% 50%;transition:top .5s ease,left .5s ease,transform .95s cubic-bezier(.16,.82,.18,1);will-change:transform}.web-login.has-role .kiddy-planet{top:clamp(450px,55vh,610px)}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:900px){body{overflow:auto}.content-shell{width:min(720px,calc(100vw - 32px))}.brand-block h1{font-size:clamp(34px,7vw,50px)}.role-card{grid-template-columns:46px 1fr}.role-icon{width:46px;height:46px}.role-icon img{width:42px;height:42px}.role-arrow,.role-copy small{display:none}.form-row{grid-template-columns:1fr 1fr}.submit-button{grid-column:1 / -1}.kiddy-planet{width:980px;max-width:none}}@media(max-width:600px){.web-login{min-height:900px}.content-shell{padding-top:68px;transition:transform .56s cubic-bezier(.22,.78,.22,1)}.web-login:not(.has-role) .content-shell{transform:translateY(clamp(78px,12vh,112px))}.language-switch{top:12px;right:12px}.language-switch button{min-width:40px;padding:6px 8px;font-size:11px}.brand-block{gap:10px}.brand-block img{width:76px;height:58px}.brand-block h1{font-size:31px;letter-spacing:-.8px}.brand-block p{margin-top:5px;font-size:13px;letter-spacing:1.2px}.role-section{gap:8px;margin-top:24px}.role-card{display:flex;min-height:94px;flex-direction:column;justify-content:center;gap:5px;padding:9px 4px;border-radius:16px;text-align:center}.role-copy strong{font-size:14px}.login-panel form{padding:15px}.login-panel.visible{max-height:460px;transition-delay:.14s}.login-panel:not(.visible){transition-delay:0s}.panel-title>span{display:grid;gap:0}.form-row{grid-template-columns:1fr}.role-student .form-row .field-grow,.submit-button{grid-column:auto}.form-meta{align-items:flex-start;gap:8px}.account-options{align-items:flex-end;flex-direction:column;gap:5px}.web-login:not(.has-role) .kiddy-planet{top:clamp(500px,67dvh,560px)}.kiddy-planet{top:650px;width:760px}.web-login.has-role .kiddy-planet{top:640px}.web-login.role-parent .kiddy-planet{left:calc(50% + 56px)}}@media(prefers-reduced-motion:reduce){.content-shell,.role-card,.login-panel,.kiddy-planet{transition-duration:.01ms!important;transition-delay:0s!important}.spinner{animation:none}}