/* v5.15: the four pupils lead the cover; all overrides stay within login. */
#loginView.login-shell{width:100%;max-width:1240px;min-height:calc(100dvh - 58px);margin:0 auto;grid-template-columns:minmax(0,1fr) 330px;gap:22px;padding:22px;align-items:center;background:transparent}
#loginView .login-hero{container-type:inline-size;display:grid;gap:12px;padding:16px;min-width:0;border:1px solid #dbc89e;border-radius:24px;background:linear-gradient(135deg,#fbf8edf5,#e8e5f5f2);box-shadow:0 18px 50px #101a4640;text-align:left}
#loginView .school-identity{margin:0;padding:0 0 10px;border-bottom:1px solid #c5bad9;gap:10px}
#loginView .school-badge{width:43px;height:48px;padding:2px;flex:none}
#loginView .school-identity p{font-size:15px;color:#343356;line-height:1.35}
#loginView .school-identity small{font-size:9px;color:#645078;margin-top:4px;letter-spacing:.08em}
#loginView .login-world-counts{display:flex;gap:6px;margin-left:auto}
#loginView .login-world-counts>span{padding:6px 8px;border:1px solid #d6c7e2;border-radius:10px;background:#fffaf1;color:#514160;font-size:10px;white-space:nowrap}
#loginView .login-world-counts b{color:#584086;font-size:16px;margin-right:3px}
#loginView .login-accessible-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
#loginView .login-scene-frame{min-width:0;padding:5px;border-radius:19px;background:linear-gradient(135deg,#eed387,#d4caeb 45%,#b7dfe5);border:1px solid #c4af81;box-shadow:0 4px 0 #b4a1c8}
#loginView .login-scene-frame .hero-party{display:block;width:100%;max-width:none;height:auto;aspect-ratio:3/2;margin:0;padding:0;border:0;border-radius:14px;background:#dce7ec;box-shadow:none;overflow:hidden}
#loginView .login-scene-frame .school-adventure-cover{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;border-radius:14px}
#loginView .login-trail-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0 0}
#loginView .login-trail-heading h2{margin:0;font-family:var(--quest-display);font-weight:400;font-size:23px;line-height:1.2;color:#3f2c61;letter-spacing:.01em}
#loginView .login-trail-heading>span{font-size:12px;color:#625674;font-weight:700}
#loginView .login-world-trail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
#loginView .login-world-card{--world-accent:#a897fa;--world-ink:#332653;display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid #b5a3d5;border-radius:15px;background:var(--world-ink);box-shadow:0 4px 0 #221c3d,0 8px 15px #3322521c;text-decoration:none;transition:transform .18s,box-shadow .18s}
#loginView .login-world-card[data-world=reading]{--world-accent:#78d5e3;--world-ink:#163c4b;border-color:#66b6c1}
#loginView .login-world-card[data-world=synonyms]{--world-accent:#88dcae;--world-ink:#213f37;border-color:#7eb796}
#loginView .login-world-card[data-world=speaking]{--world-accent:#edb5e7;--world-ink:#493054;border-color:#c792c3}
#loginView .login-world-card[data-world=grammar]{--world-accent:#f2ca86;--world-ink:#503423;border-color:#d2a46a}
#loginView .login-world-art{position:relative;aspect-ratio:2/1;width:100%;overflow:hidden;border-bottom:2px solid var(--world-accent)}
#loginView .login-world-art img{display:block;width:100%;height:100%;object-fit:contain}
#loginView .login-world-number{position:absolute;left:6px;top:6px;display:grid;place-items:center;width:24px;height:24px;background:#271e43eb;color:#fff3cd;border:1px solid #edd6a1;border-radius:7px;font-size:10px;font-weight:800}
#loginView .login-world-copy{display:flex;flex-direction:column;flex:1;padding:10px 10px 8px;gap:5px}
#loginView .login-world-copy>b{font-family:var(--quest-display);font-size:20px;font-weight:400;line-height:1.15;letter-spacing:.02em;color:#fff}
#loginView .login-world-copy>small{display:block;flex:1;font-size:12px;line-height:1.4;color:#f0edf5}
#loginView .login-world-enter{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:3px;padding-top:6px;border-top:1px solid #ffffff35;color:var(--world-accent);font-size:11px;font-weight:800}
#loginView .login-world-enter i{font-size:16px;font-style:normal}
#loginView .login-world-card:hover{transform:translateY(-3px);box-shadow:0 6px 0 #221c3d,0 12px 20px #33225230}
#loginView .login-world-card:focus-visible{outline:3px solid #6a409c;outline-offset:4px}
#loginView #account{scroll-margin-top:30px}
#loginView .login-card{width:100%;max-width:330px;justify-self:center;padding:28px 24px;border:1px solid #d6bd83;box-shadow:0 14px 45px #16214552}
@container(max-width:680px){#loginView .login-world-counts{display:none}#loginView .login-world-trail{gap:7px}#loginView .login-world-copy{padding:9px 7px 7px}#loginView .login-world-copy>b{font-size:17px}}
@media(max-width:960px){#loginView.login-shell{grid-template-columns:1fr;max-width:780px;padding:16px;gap:18px}#loginView .login-card{max-width:560px}}
@media(max-width:600px){
 #loginView.login-shell{padding:10px;gap:16px}
 #loginView .login-hero{padding:12px;gap:12px;border-radius:20px}
 #loginView .school-identity p{font-size:14px}
 #loginView .school-identity small{font-size:9px}
 #loginView .school-badge{width:37px;height:43px}
 #loginView .login-scene-frame{padding:3px;border-radius:16px}
 #loginView .login-trail-heading{align-items:flex-start;flex-wrap:wrap;gap:5px}
 #loginView .login-trail-heading h2{font-size:23px}
 #loginView .login-world-trail{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 #loginView .login-world-card:last-child{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}
 #loginView .login-world-card:last-child .login-world-art{height:100%;aspect-ratio:auto;border-bottom:0;border-right:2px solid var(--world-accent);background:#2e233c}
 #loginView .login-world-card:last-child .login-world-art img{object-fit:contain}
 #loginView .login-world-copy{padding:11px;gap:6px}
 #loginView .login-world-copy>b{font-size:21px}
 #loginView .login-world-copy>small{font-size:13px}
 #loginView .login-world-enter{font-size:12px}
}
@media(prefers-reduced-motion:reduce){#loginView .login-world-card{transition:none}#loginView .login-world-card:hover{transform:none}}
