/* Approved homepage artwork; presentation only, not a measurement model. */
:root{--blue:#246db4;--ink:#17354e;--bg:#f3f8fc;--line:#d9e7f1;--muted:#627c90}
body{background:linear-gradient(180deg,#f9fcff 0,#eff6fb 100%);color:var(--ink)}
.site-header{padding:18px 28px;min-height:92px;max-width:1600px}
main{max-width:1600px;padding-top:4px}
.site-header nav{gap:8px}.site-header .brand-mark{background:linear-gradient(135deg,#176998,#387fd8);box-shadow:0 8px 24px #135ca226}.site-header .brand small{color:#53788d}
.site-header nav button{background:#ffffffbf;font-size:14px;border-color:#d5e3f0}.site-header nav .head-guide{border:1px solid #b4d2e6;color:#165a84}
.header-more{position:relative;color:#3e617c;font-size:14px}.header-more summary{padding:11px 12px;cursor:pointer;list-style:none;border-radius:10px}.header-more summary::-webkit-details-marker{display:none}.header-more summary::after{content:'⌄';font-size:13px;margin-left:7px}.header-more[open] summary{background:#e9f2f9}.header-more>div{position:absolute;z-index:15;right:0;top:48px;min-width:180px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 36px #1636501f}.header-more a{display:block;padding:9px 12px;text-decoration:none;white-space:nowrap;color:#315a7d;border-radius:8px}.header-more a:hover{background:#edf5fb}
.login-immersive{position:relative;isolation:isolate;display:block;min-height:760px;aspect-ratio:1672 / 941;overflow:hidden;background:#e5f4fc;border:1px solid #d3e4ef;border-radius:25px;box-shadow:0 15px 52px #345c7811}
.motion-scene{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;background:#edf6fc}
.motion-scene picture{position:absolute;inset:0;display:block}.scene-art{display:block;width:100%;height:100%;object-fit:cover;object-position:center top}
.scene-trails{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;opacity:.82;pointer-events:none}
.trail-line{stroke-dasharray:85 915;animation:soft-flow 19s linear infinite;filter:drop-shadow(0 0 4px #c7ffff)}.trail-secondary{stroke-dasharray:45 955;animation-duration:25s;animation-delay:-9s;opacity:.65}
.joint-pulse{animation:soft-pulse 6.5s ease-in-out infinite;animation-delay:var(--delay);opacity:.42}
.scene-sheen{position:absolute;inset:0;pointer-events:none;opacity:.17;background:radial-gradient(ellipse at 38% 24%,#e3ffff50,transparent 34%);animation:soft-light 18s ease-in-out infinite alternate}
@keyframes soft-flow{from{stroke-dashoffset:80}to{stroke-dashoffset:-920}}
@keyframes soft-pulse{0%,100%{transform:scale(.92);opacity:.26}50%{transform:scale(1.15);opacity:.7}}
@keyframes soft-light{from{transform:translateX(-2%);opacity:.1}to{transform:translateX(2%);opacity:.27}}
.scene-signature{position:absolute;z-index:2;bottom:24px;left:28px;background:#f8fdffed;border:1px solid #ffffffc9;backdrop-filter:blur(12px);border-radius:12px;padding:9px 16px;box-shadow:0 6px 22px #2b698118}.scene-signature span{display:block;font-size:13px;font-weight:700;color:#245d82;letter-spacing:.08em}.scene-signature small{font-size:12px;color:#5e839a}
.motion-switch{position:absolute;z-index:3;left:20px;top:19px;border:1px solid #ffffffc2;display:flex;gap:7px;align-items:center;min-height:35px;border-radius:30px;padding:5px 12px;background:#f4fbffe3;box-shadow:0 3px 12px #456e8b12;color:#346b89;font-size:12px;backdrop-filter:blur(10px)}.motion-switch:hover{background:#fff;border-color:#c9e1ef}
.login-immersive .entry-card{position:absolute;z-index:2;top:24%;right:15%;width:354px;max-width:40%;margin:0;padding:27px 29px 22px;background:linear-gradient(150deg,#ffffffed,#f5fbfff2);border:1px solid #ffffff;box-shadow:0 15px 50px #1b597a23,0 0 0 1px #c2dce350;border-radius:23px;backdrop-filter:blur(18px)}
.entry-card .eyebrow{font-size:10px;letter-spacing:.16em;color:#5791aa}.entry-card h2{font-size:26px;line-height:1.35;margin:10px 0 7px;font-weight:750;color:#154a72}.entry-card>p{font-size:14px;color:#6f8698;margin-bottom:12px}
.entry-card label{margin:13px 0 6px;font-size:13px;color:#355e77}.entry-card input{padding:10px 13px;min-height:45px;background:#ffffffdb;border:1px solid #cddfeb;border-radius:10px;font-size:14px}.entry-card input::placeholder{color:#8a9eae}.entry-card input:focus{box-shadow:0 0 0 3px #6cbae124;border-color:#6babc9}
.entry-card .primary{min-height:48px;margin-top:20px;border:none;border-radius:11px;box-shadow:0 8px 20px #276da82c;background:linear-gradient(108deg,#236bbb,#2589a9);font-size:15px;letter-spacing:.03em}.entry-card .primary:hover{background:linear-gradient(108deg,#195da8,#187994);transform:translateY(-1px)}
.entry-privacy{margin-top:14px;color:#7490a1;font-size:12px;line-height:1.7}.entry-privacy summary{cursor:pointer;color:#6d8898}.entry-privacy p{margin:9px 0 0;padding:9px;background:#f5f9fdd9;border:1px solid #dce8f1;border-radius:8px;color:#668093}
.entry-card .error{font-size:13px;padding:7px 10px;line-height:1.5;margin-top:12px}
.home-hero{position:relative;isolation:isolate;height:clamp(385px,38vw,565px);border-radius:24px;overflow:hidden;box-shadow:0 12px 36px #28547212;border:1px solid #d4e5f0;background:#eaf4fc}
.home-hero .scene-art{object-position:center top}.home-greeting{position:absolute;z-index:2;bottom:20px;left:28px;right:28px;padding:18px 22px;background:#ffffffed;border:1px solid #fff;border-radius:17px;backdrop-filter:blur(15px);display:flex;gap:16px;align-items:center;justify-content:space-between;box-shadow:0 8px 26px #35708e17}
.home-greeting h1{font-size:24px;line-height:1.4;margin:5px 0 3px;color:#184e77}.home-greeting p{font-size:14px;color:#658198;margin:0}.home-greeting .eyebrow{font-size:9px;color:#6389a1;letter-spacing:.15em}.home-greeting button{flex-shrink:0;font-size:14px;background:linear-gradient(120deg,#296bbe,#268caf);border:0;padding:12px 18px;border-radius:12px}
.assistant-welcome{display:flex;align-items:center;gap:18px;margin:20px 0 28px;background:linear-gradient(120deg,#edf7fb,#fff);border:1px solid #d4e7f2;border-radius:19px;padding:5px 25px 5px 12px;min-height:96px}.assistant-welcome img{height:106px;width:80px;object-fit:contain;object-position:center}.assistant-welcome h2{font-size:20px;margin:0 0 5px;color:#245d7e}.assistant-welcome p{color:#618195;font-size:14px;margin:0}.assistant-welcome button{margin-left:auto;white-space:nowrap;color:#24678d;background:#fff;border-color:#c7dfed;font-size:14px}
.section-title h2{color:#214d6d}.learning-card{border-color:#d7e6ee;box-shadow:0 9px 25px #224d7810}.learning-card .category{color:#547c99}.learning-card p{color:#658095}.learning-card .primary{background:linear-gradient(115deg,#2467b7,#2c81ad);border:0}.card-icon{box-shadow:none!important}
.notice{background:#f6fafdbd;border-color:#dbe7ef}.notice summary{cursor:pointer;font-weight:650;font-size:14px;color:#63829b}.notice p{margin:13px 0 8px}.scope{border-color:#dbe7ef}footer{max-width:1600px;color:#6e899d}footer a{text-decoration:none;color:#65859e}
html[data-home-motion="off"] .motion-scene *,html[data-home-motion="sleep"] .motion-scene *{animation-play-state:paused!important}
body:not([data-hub-view="login"]) #login .motion-scene *,body:not([data-hub-view="home"]) #home .motion-scene *{animation-play-state:paused!important}
@media(min-width:1650px){.login-immersive{min-height:800px}.login-immersive .entry-card{right:17%;top:25%;width:378px;padding:30px 32px}.entry-card h2{font-size:28px}.entry-card input{min-height:48px}}
@media(max-width:1180px) and (min-width:761px){.login-immersive{min-height:700px;aspect-ratio:auto}.login-immersive .entry-card{right:5%;top:22%;width:350px;max-width:47%}.login-immersive .scene-art{object-position:42% top}.scene-signature{left:20px;bottom:20px}.site-header nav button{font-size:13px;padding:8px 12px}.home-greeting h1{font-size:21px}}
@media(max-width:900px) and (min-width:761px){.site-header{padding:17px 22px;gap:10px;align-items:flex-start}.brand small{font-size:11px}.brand b{font-size:22px}.brand-mark{width:44px;height:44px}.site-header nav{justify-content:flex-end}.login-immersive .entry-card{right:4%;width:330px;max-width:50%;padding:24px}.login-immersive{min-height:675px}.login-immersive .scene-art{object-position:40% top}.home-greeting button{padding:10px 12px;font-size:13px}}
@media(max-width:760px){
 .site-header{padding:15px 16px 12px;min-height:auto;flex-direction:row;align-items:center;gap:8px;flex-wrap:wrap}.site-header .brand{gap:10px;flex:1}.site-header .brand-mark{width:42px;height:42px;font-size:23px;border-radius:13px}.brand b{font-size:20px}.brand small{font-size:10px}.site-header nav{gap:3px;justify-content:flex-end}.site-header nav .head-guide{display:none}.site-header nav button{font-size:12px;padding:7px 9px;min-height:34px}.header-more summary{font-size:12px;padding:8px 7px}.header-more>div{top:39px}
 main{padding:4px 12px 27px}.login-immersive{display:flex;flex-direction:column;min-height:0;aspect-ratio:auto;border-radius:18px;box-shadow:0 8px 28px #24577d0a;background:#fff;overflow:visible;isolation:isolate}
 .login-immersive .motion-scene{position:relative;aspect-ratio:1672/941;flex:none;width:100%;border-radius:18px 18px 0 0;overflow:hidden}.login-immersive .scene-art{object-fit:contain}.login-immersive .scene-trails{height:100%}.scene-sheen{opacity:.1}.scene-signature{position:relative;bottom:auto;left:auto;border:0;border-radius:0;background:#edf6fc;backdrop-filter:none;padding:9px 18px;box-shadow:none;display:flex;align-items:center;justify-content:space-between;gap:6px}.scene-signature span{font-size:9px;letter-spacing:.045em}.scene-signature small{font-size:10px}
 .motion-switch{top:10px;left:10px;min-height:27px;padding:3px 9px;font-size:10px;background:#f6fcffee;border:1px solid #e1f1fccc;gap:4px}.login-immersive .entry-card{position:relative;top:auto;right:auto;width:100%;max-width:none;border:0;border-radius:0 0 18px 18px;padding:22px 22px 20px;box-shadow:none;background:white;backdrop-filter:none}
 .entry-card h2{font-size:24px}.entry-card .eyebrow{font-size:9px}.entry-card>p{font-size:13px}.entry-card label{font-size:13px;margin-top:14px}.entry-card input{font-size:16px;min-height:47px}.entry-card .primary{font-size:15px;min-height:49px}.entry-privacy{font-size:11px;margin-top:13px}
 .home-hero{height:auto;overflow:hidden;border-radius:18px}.home-hero .motion-scene{position:relative;aspect-ratio:1672/941}.home-hero .scene-art{object-fit:contain}.home-greeting{position:relative;inset:auto;box-shadow:none;padding:18px;display:block;border:0;border-radius:0;background:white;backdrop-filter:none}.home-greeting h1{font-size:20px;line-height:1.55}.home-greeting p{font-size:13px}.home-greeting button{margin-top:13px;width:100%;font-size:14px;padding:10px 15px}.home-greeting .eyebrow{font-size:8px}
 .assistant-welcome{padding:8px 12px 8px 4px;margin:15px 0 23px;gap:7px;border-radius:15px;flex-wrap:wrap}.assistant-welcome img{width:59px;height:88px}.assistant-welcome div{flex:1;min-width:150px}.assistant-welcome h2{font-size:17px}.assistant-welcome p{font-size:12px;line-height:1.8}.assistant-welcome button{margin:0 0 6px 66px;padding:6px 12px;min-height:34px;font-size:12px}
 .section-title{align-items:center}.section-title h2{font-size:22px}.section-title button{font-size:12px}.learning-card{padding:22px}.notice{margin-top:23px}.notice summary{font-size:13px}footer{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.motion-scene *{animation:none!important}.entry-card .primary:hover{transform:none}html{scroll-behavior:auto!important}}
/* Error and privacy text must remain readable without spilling outside the artwork. */
@media(min-width:761px){.login-immersive .entry-card{max-height:calc(76% - 20px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#c1d6e7 transparent}}
/* Explicit width avoids aspect-ratio transferring the desktop min-height into an oversized width. */
.login-immersive{width:100%;max-width:100%;min-width:0}
/* On mobile login use the header entrance, not a floating button over the form. */
@media(max-width:760px){.site-header nav .head-guide{display:inline-flex;align-items:center;font-size:0;padding:6px 9px;min-height:33px;border:1px solid #d5e5f1;background:#fff}.site-header nav .head-guide::after{content:'助教老师';font-size:12px;color:#316b91}}
