/* 通明堂登录页 — 取自 muse.ai 的实测数值：底色 rgb(24,24,25)；次级文字 rgba(242,247,255,.53)；蓝 #1793ff/#4b93ff 为唯一强调色；
   标题 62px/500/行高 1.1/字距 -1%；输入框 54px、圆角 20px、rgba(255,255,255,.12) 无边框；按钮满圆角药丸。 */
:root{
  --bg:#181819;--surface:rgba(255,255,255,.06);--field:rgba(255,255,255,.12);--line:rgba(255,255,255,.12);
  --text:#fff;--text2:rgba(242,247,255,.53);--text3:rgba(242,247,255,.32);
  --blue:#1793ff;--blue2:#4b93ff;--danger:#ff7a7a;
  --sans:"Figtree","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --g:clamp(20px,4vw,48px);--ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg);-webkit-text-size-adjust:100%}
body{margin:0;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg);color:var(--text);font:400 16px/24px var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,p{margin:0}a{color:inherit;text-decoration:none}button,input{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--blue2);outline-offset:3px;border-radius:10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
[hidden]{display:none!important}

.top{position:absolute;inset:0 0 auto;z-index:5;padding:12px 0}
.top-in{display:flex;align-items:center;justify-content:space-between;max-width:1328px;margin:0 auto;padding:0 var(--g)}
.wm{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;letter-spacing:.14em}
.pill{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 16px;border-radius:999px;background:var(--blue);color:#000;font-size:14px;line-height:20px;font-weight:500;transition:filter .2s}
.pill:hover{filter:brightness(1.1)}

.stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:88px var(--g) 40px;text-align:center}
.mark{width:100px;height:100px;margin-bottom:22px;opacity:0;transform:scale(.9);animation:pop .9s var(--ease) .1s forwards}
.mark .s1,.mark .s2{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.3s var(--ease) .25s forwards}.mark .s2{animation-delay:.6s}
@keyframes draw{to{stroke-dashoffset:0}}@keyframes pop{to{opacity:1;transform:none}}

.rebus{font-size:clamp(34px,5.8vw,62.4px);line-height:1.1;font-weight:500;letter-spacing:-.01em;max-width:21em}
.rebus .ln{display:block;opacity:0;transform:translateY(14px);animation:rise .9s var(--ease) forwards}.rebus .ln:nth-child(2){animation-delay:.18s}
@keyframes rise{to{opacity:1;transform:none}}
/* 吉祥物：卜灵灵（抽象版）。呼吸、眨眼、耳朵轻抖、挂坠摆动；悬停或处理中时耳朵竖起、轻跳。 */
.avatar{display:inline-block;position:relative;width:1.2em;height:1.2em;margin:0 .03em;vertical-align:-.24em;animation:breathe 4s ease-in-out infinite}
.avatar svg{display:block;width:100%;height:100%;overflow:visible}
.avatar [class^="m-"],.avatar .m-ear{transform-box:fill-box}
.m-eyes{transform-origin:center;animation:blink 5s infinite}
.m-ear{transform-origin:50% 90%;animation:twitch 7s ease-in-out infinite}.m-ear.r{animation-delay:.18s}
.m-orn{transform-origin:48px 26px;transform-box:view-box}
.m-tassel{transform-box:view-box;transform-origin:48px 29.7px;animation:swing 3.2s ease-in-out infinite}
.rebus:hover .avatar,.rebus.busy .avatar{animation:hop .9s var(--ease) infinite}
.rebus:hover .m-ear.l,.rebus.busy .m-ear.l{animation:perkL .9s var(--ease) infinite}.rebus:hover .m-ear.r,.rebus.busy .m-ear.r{animation:perkR .9s var(--ease) infinite}
@keyframes breathe{50%{transform:translateY(-.03em) scale(1.02)}}
@keyframes blink{0%,93%,100%{transform:scaleY(1)}96%{transform:scaleY(.1)}}
@keyframes twitch{0%,86%,100%{transform:rotate(0)}90%{transform:rotate(-7deg)}94%{transform:rotate(3deg)}}
@keyframes swing{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
@keyframes hop{50%{transform:translateY(-.1em)}}
@keyframes perkL{50%{transform:rotate(-10deg) translateY(-1.5px)}}@keyframes perkR{50%{transform:rotate(10deg) translateY(-1.5px)}}
@keyframes spin{to{transform:rotate(360deg)}}

/* 轮换图标：质感物件（图标本身带渐变、高光和投影），仅做入场/退场动效 */
.slot{display:inline-block;position:relative;width:1.18em;height:1.18em;margin:0 .02em;vertical-align:-.24em}
.slot .ic{position:absolute;inset:0;opacity:0;transform:translateY(.18em) scale(.7) rotate(-10deg);filter:blur(5px);transition:opacity .5s,transform .7s cubic-bezier(.3,1.4,.5,1),filter .5s}
.slot .ic.on{opacity:1;transform:none;filter:none}
.slot svg{display:block;width:100%;height:100%;overflow:visible}

.card{width:100%;max-width:408px;margin-top:38px;opacity:0;animation:rise .9s var(--ease) .45s forwards}
.step{display:flex;flex-direction:column;gap:6px;text-align:left;animation:stepIn .45s var(--ease)}
@keyframes stepIn{from{opacity:0;transform:translateY(8px)}}
.lead{text-align:center;height:22px;font-size:16px;line-height:22px;color:var(--text2);margin-bottom:6px}
.who{text-align:center;font-size:14px;line-height:20px;color:var(--text2);margin:-2px 0 6px}.who b{color:var(--text);font-weight:500}
.field{display:block;width:100%;min-height:54px;padding:10px 16px;border:0;border-radius:20px;background:var(--field);color:var(--text);font-size:16px;line-height:22px;outline:0;transition:background .2s,box-shadow .2s}
.field.stack{margin-top:6px}
.field::placeholder{color:var(--text2)}
.field:focus{background:rgba(255,255,255,.16);box-shadow:0 0 0 2px rgba(75,147,255,.55)}
.field.code{letter-spacing:.3em;text-align:center;font-size:20px}.field.code::placeholder{letter-spacing:0;font-size:16px}
.field.bad{box-shadow:0 0 0 2px rgba(255,122,122,.6)}
.agree{display:flex;align-items:flex-start;gap:10px;padding:8px 2px 0;font-size:13px;line-height:18px;color:var(--text2);cursor:pointer}
.agree input{appearance:none;flex:none;width:18px;height:18px;margin:0;border-radius:6px;background:var(--field);display:grid;place-items:center;cursor:pointer;transition:background .2s}
.agree input::after{content:"";width:9px;height:5px;border:2px solid #fff;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px) scale(0);transition:transform .2s}
.agree input:checked{background:var(--blue2)}.agree input:checked::after{transform:rotate(-45deg) translate(1px,-1px) scale(1)}
.agree a,.note .link,.who .link{color:var(--blue2)}.agree a:hover{text-decoration:underline}
.note{font-size:12px;line-height:15px;color:var(--text2);padding:2px 2px 0}
.link{border:0;background:none;padding:0;font-size:inherit;cursor:pointer}.link:hover:not(:disabled){text-decoration:underline}.link:disabled{color:var(--text3);cursor:default}
.err{min-height:0;font-size:13px;line-height:18px;color:var(--danger);padding:2px 2px 0}.err:empty{display:none}
.go{display:flex;align-items:center;justify-content:center;width:100%;height:44px;margin-top:10px;padding:0 14px;border:0;border-radius:999px;background:var(--blue2);color:#fff;font-size:16px;line-height:22px;font-weight:500;cursor:pointer;transition:opacity .25s,filter .2s}
.go:disabled{opacity:.4;cursor:default}.go:not(:disabled):hover{filter:brightness(1.1)}
.go.loading{pointer-events:none;opacity:.7}.go.loading::after{content:"";width:14px;height:14px;margin-left:10px;border-radius:50%;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;animation:spin .8s linear infinite}

.foot{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;width:100%;max-width:1328px;margin:0 auto;padding:24px var(--g) 28px;font-size:14px;line-height:20px;color:var(--text2)}
.foot nav{display:flex;gap:24px}.foot a:hover{color:var(--text)}.foot .r{text-align:right}
@media (max-width:720px){.foot{grid-template-columns:1fr;text-align:center;justify-items:center}.foot .r{text-align:center}}
@media (max-width:520px){.stage{padding-top:84px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important}.mark,.rebus .ln,.card{opacity:1!important;transform:none!important}.mark .s1,.mark .s2{stroke-dashoffset:0!important}}

/* Embedded form uses the homepage typography and green focus treatment.
   Inset focus rings remain visible at the iframe boundary. */
html.embedded-login{--bg:#fff;--surface:#f6f8f7;--field:#f6f8f7;--line:#dde4df;--text:#202923;--text2:#637168;--text3:#89928c;--blue:#00614d;--blue2:#00614d;--danger:#b33c35;--sans:'PingFang SC',-apple-system,BlinkMacSystemFont,'Segoe UI','Microsoft YaHei',Roboto,'Helvetica Neue',sans-serif;background:#fff;color-scheme:light}
.embedded-login body{min-height:0;background:#fff}
.embedded-login .top,.embedded-login .foot,.embedded-login .mark,.embedded-login .rebus{display:none}
.embedded-login .stage{padding:0;justify-content:flex-start}
.embedded-login .card{width:100%;max-width:none;margin:0;text-align:left;opacity:1;animation:none;transform:none}
.embedded-login .step{gap:10px;animation:none}
.embedded-login [data-step="id"]>.lead{display:none}
.embedded-login .field{border:1px solid var(--line);border-radius:12px;background:var(--field);min-height:52px;height:52px;padding:13px 16px;font-size:15px;line-height:24px;box-shadow:none;outline:none;transition:border-color .16s,background .16s,box-shadow .16s}
.embedded-login .field::placeholder{color:#78847c}
.embedded-login .field:focus{border-color:var(--blue);background:#fff;box-shadow:inset 0 0 0 1px var(--blue);outline:none}
.embedded-login .field.bad{border-color:var(--danger);box-shadow:inset 0 0 0 1px var(--danger)}
.embedded-login .agree{align-items:flex-start;gap:9px;padding:2px 2px 0;font-size:12px;line-height:20px;color:var(--text2)}
.embedded-login .agree input{width:16px;height:16px;margin:2px 0 0;border:1px solid #bbc7bf;border-radius:4px;background:#fff}
.embedded-login .agree input:checked{background:var(--blue);border-color:var(--blue)}
.embedded-login .agree input:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.embedded-login .agree a:focus-visible,.embedded-login .link:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:2px}
.embedded-login .note{font-size:12px;line-height:20px;padding:0 2px;color:var(--text2)}
.embedded-login .go{height:48px;margin-top:8px;border-radius:12px;background:var(--blue);color:#fff;font-size:15px;line-height:22px;font-weight:600;letter-spacing:0;transition:background .16s,color .16s}
.embedded-login .go:disabled{opacity:1;background:#edf1ee;color:#77847b;cursor:not-allowed}
.embedded-login .go:not(:disabled):hover{background:#004e3e;filter:none}
.embedded-login .go:focus-visible{outline:2px solid var(--blue);outline-offset:-4px;box-shadow:inset 0 0 0 3px #fff}
.embedded-login .go.loading{background:#00614d;color:#fff;opacity:.75}
.embedded-login .err{line-height:20px}
@media(max-width:420px){.embedded-login .field{font-size:16px}}
