:root{--bg:#071624;--ink:#f1f7fb;--muted:#9aafbf;--accent:#167bcb;--line:#ffffff20;--card:#fff;--cardink:#183047;--cardmuted:#657484;--font:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);transition:background .5s,color .5s}button,select,a{font:inherit}button,select{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #4bbfc7;outline-offset:5px}button{touch-action:manipulation}button:disabled{cursor:wait}#scene{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.stage{position:relative;min-height:calc(100svh - 68px);overflow:hidden;isolation:isolate;display:flex;flex-direction:column}.header{padding:32px 4.8%;display:flex;justify-content:space-between;align-items:center;z-index:1}.brand{display:flex;align-items:center;gap:13px}.mark{width:39px;height:39px;fill:none;stroke:#7ad7df;stroke-width:2.4}.brand b{font-size:20px;letter-spacing:1.2px}.brand small{display:block;font-size:11px;color:var(--muted);letter-spacing:2.8px;margin-top:5px}.header-right{display:flex;align-items:center;gap:25px;font-size:13px;color:var(--muted)}.motion{background:transparent;color:inherit;border:1px solid var(--line);border-radius:6px;padding:10px 13px;min-height:40px}.shell{flex:1;width:min(1180px,88%);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:70px;align-items:center;padding:40px 0 56px;position:relative;z-index:1}.hero{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding-bottom:66px}.eyebrow{display:flex;align-items:center;gap:12px;font-size:13px;color:#9ec4d7;margin-bottom:25px}.eyebrow:before{content:'';width:29px;height:2px;background:#66cfdf}.hero h1{font-size:clamp(38px,4.4vw,64px);line-height:1.2;font-weight:600;letter-spacing:-1.5px;margin:0}.hero p{font-size:16px;line-height:1.9;color:var(--muted);margin:25px 0 0;max-width:440px}.scope{display:flex;gap:30px;font-size:13px;color:#bfd0de;margin-top:36px}.scope span{display:flex;gap:9px;align-items:center}.scope svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.4}.caption{position:absolute;bottom:17px;left:0;font-size:11px;color:var(--muted);letter-spacing:1px}.card{background:var(--card);color:var(--cardink);padding:38px 36px 26px;border-radius:16px;width:100%;max-width:400px;position:relative;box-shadow:0 20px 70px #0002}.card-top{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--cardmuted)}.wecom{width:26px;height:26px;fill:#2e8ce6}.card h2{font-size:29px;font-weight:600;margin:24px 0 10px;letter-spacing:-.7px}.sub{font-size:13px;color:var(--cardmuted);line-height:1.7;margin:0}.qr-shell{position:relative;width:208px;height:208px;margin:28px auto 13px;padding:14px;background:#fff;border:1px solid #e6ebef;border-radius:8px;display:grid;place-items:center}.qr-shell svg{width:100%;height:100%}.demo-label{font-size:11px;color:#7b6570;text-align:center;margin:0 0 18px}.qr-overlay{display:none;position:absolute;inset:0;background:#fffffff5;border-radius:8px;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:#183047;text-align:center;font-size:14px;padding:16px}.qr-overlay strong{font-weight:500}.status-icon{width:48px;height:48px;display:grid;place-items:center;background:#e8f5ef;color:#168565;border-radius:50%;font-size:24px}.status{display:flex;justify-content:center;align-items:center;gap:8px;font-size:13px;min-height:20px;color:var(--cardmuted)}.dot{height:6px;width:6px;border-radius:100%;background:#32a885}.refresh{display:block;margin:9px auto 0;border:0;background:none;color:var(--accent);font-size:12px;min-height:35px;padding:6px 14px}.card-bottom{border-top:1px solid #dce4ea;margin-top:19px;padding-top:19px;display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--cardmuted)}.help{background:none;border:0;color:var(--cardmuted);padding:7px 0 7px 10px;font-size:11px}.help-copy{display:none;margin:13px 0 0;font-size:12px;line-height:1.7;color:var(--cardmuted)}.help-copy.open{display:block}.footer{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;padding:0 4.8% 26px;font-size:11px;color:var(--muted)}.footer a{color:inherit;text-decoration:none}.preview-bar{min-height:68px;background:#fff;color:#263547;border-top:1px solid #dde3e8;display:flex;align-items:center;justify-content:center;gap:22px;padding:10px 22px;position:relative;z-index:2}.preview-label{font-size:11px;color:#74808c}.versions{display:flex;gap:5px}.version{border:0;border-radius:6px;background:none;padding:10px 16px;font-size:12px;color:#627080;min-height:40px}.version[aria-pressed=true]{background:#152d40;color:#fff}.version span{margin-right:7px;opacity:.6}.state-control{font-size:11px;color:#73808d;display:flex;align-items:center;gap:8px}.state-control select{font-size:11px;padding:7px 23px 7px 9px;border:1px solid #dce3e8;background:#fff;border-radius:5px;color:#4d5d6c;min-height:34px}.notice{position:fixed;top:18px;left:50%;transform:translateX(-50%);background:#fff;color:#244658;box-shadow:0 4px 30px #0003;padding:12px 22px;font-size:13px;border-radius:8px;z-index:5;display:none}.notice.show{display:block}
body[data-theme=light]{--bg:#f0f5f4;--ink:#173e3b;--muted:#617975;--accent:#187762;--line:#234d3925;--cardink:#183e38;--cardmuted:#627870}.light-only{display:none}body[data-theme=light] .mark{stroke:#21846e}body[data-theme=light] .eyebrow{color:#47786c}body[data-theme=light] .eyebrow:before{background:#27876e}body[data-theme=light] .scope{color:#4a7167}body[data-theme=light] .card{border:1px solid #d7e4df;box-shadow:0 16px 50px #243b3510;border-radius:4px}body[data-theme=light] .hero{padding-bottom:100px}body[data-theme=light] .hero h1{font-weight:500}body[data-theme=light] .wecom{fill:#258970}
body[data-theme=space]{--bg:#080e19;--ink:#f1f5fb;--muted:#a2b0c6;--line:#ffffff26;--accent:#9bc7fa;--card:#101d30;--cardink:#f0f5ff;--cardmuted:#a9b8cc}body[data-theme=space] .shell{display:flex;flex-direction:column;gap:26px;justify-content:center;padding:10px 0 40px}body[data-theme=space] .hero{padding:0;align-self:auto;text-align:center}body[data-theme=space] .hero h1{font-size:34px;font-weight:500;line-height:1.3;letter-spacing:.2px}body[data-theme=space] .hero h1 br{display:none}body[data-theme=space] .hero p{margin:12px 0 0;font-size:13px;max-width:none}body[data-theme=space] .eyebrow,body[data-theme=space] .scope,body[data-theme=space] .caption{display:none}body[data-theme=space] .card{padding-top:25px;max-width:356px;border:1px solid #2b3d55;box-shadow:0 25px 90px #0005;border-radius:12px}body[data-theme=space] .card h2{font-size:23px;margin-top:17px}body[data-theme=space] .qr-shell{width:190px;height:190px;margin-top:20px}body[data-theme=space] .demo-label{color:#abbacf}body[data-theme=space] .card-bottom{border-color:#304055}body[data-theme=space] .card-top{justify-content:center}body[data-theme=space] .card h2,body[data-theme=space] .sub{text-align:center}
@media(min-width:1600px){.shell{width:min(1300px,86%);grid-template-columns:1fr 420px;gap:140px}.card{max-width:420px;padding:44px 42px 30px}.hero h1{font-size:72px}}
@media(max-width:1000px) and (min-width:701px){.shell{width:90%;grid-template-columns:minmax(0,1fr) 340px;gap:28px}.card{padding:30px 25px 23px}.hero h1{font-size:39px}.hero p{font-size:14px}.scope{gap:16px;font-size:12px}.header-right .environment{display:none}.preview-label{display:none}.preview-bar{gap:14px}.version{padding:10px}.state-control{gap:5px}.state-control>span{display:none}}
@media(max-width:700px){.stage{min-height:calc(100svh - 113px)}.header{padding:22px 6%}.brand b{font-size:17px}.brand small{font-size:9px}.mark{width:32px;height:32px}.header-right .environment{display:none}.motion{font-size:11px;padding:8px 10px}.shell{display:flex;flex-direction:column;width:88%;gap:26px;padding:20px 0 34px}.hero,.hero h1,body[data-theme=light] .hero{padding:0;text-align:center;align-self:center}.hero h1{font-size:32px;line-height:1.25;letter-spacing:-.5px}.hero h1 br{display:none}.hero p{font-size:12px;margin-top:12px;line-height:1.7}.eyebrow,.scope,.caption{display:none}.card{max-width:380px;padding:28px 27px 22px}.card h2{font-size:26px;margin-top:20px}.qr-shell{margin-top:22px;width:190px;height:190px}.footer{justify-content:center;padding:0 6% 22px;font-size:10px}.footer .foot-right{display:none}.preview-bar{gap:5px 16px;flex-wrap:wrap;padding:8px 10px;min-height:113px}.preview-label{display:none}.versions{width:100%;justify-content:center}.version{padding:10px 12px}.state-control{font-size:10px}.state-control select{font-size:10px}body[data-theme=space] .hero h1{font-size:28px}body[data-theme=space] .shell{padding-top:20px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

body{padding-bottom:68px}.preview-bar{position:fixed;bottom:0;left:0;right:0}
@media(max-height:820px) and (min-width:701px){.header{padding-top:20px;padding-bottom:20px}.shell{padding-top:10px;padding-bottom:24px}.card{padding:25px 30px 20px}.card h2{font-size:26px;margin-top:16px}.qr-shell{width:174px;height:174px;margin-top:18px;margin-bottom:10px}.demo-label{margin-bottom:12px}.card-bottom{margin-top:10px;padding-top:10px}.footer{padding-bottom:18px}.hero{padding-bottom:65px}.hero h1{font-size:48px}body[data-theme=space] .card h2,body[data-theme=space] .card>.sub{display:none}body[data-theme=space] .qr-shell{width:174px;height:174px}body[data-theme=space] .shell{gap:14px;padding-bottom:12px}body[data-theme=space] .hero h1{font-size:30px}}
@media(max-width:700px){body{padding-bottom:113px}.hero h1 br{display:block}.hero h1{font-size:30px}.card{padding:24px}.qr-shell{width:168px;height:168px;margin-top:18px}.card h2{font-size:24px;margin-top:16px}.demo-label{margin-bottom:12px}.card-bottom{margin-top:10px;padding-top:10px}.shell{gap:22px}body[data-theme=space] .hero h1{font-size:26px}body[data-theme=space] .qr-shell{width:168px;height:168px}}

:root{--bg:#110b2b;--ink:#faf8ff;--muted:#c3b9dc;--accent:#7664ba;--line:#ffffff2b;--card:#fff;--cardink:#27223c;--cardmuted:#726b83}
body[data-theme=light]{--bg:#f6f8ff;--ink:#272c58;--muted:#69728e;--accent:#6553b6;--line:#34467b26;--card:#fff;--cardink:#272c58;--cardmuted:#69728e}
.official-logo{width:242px;background:white;padding:9px 12px;border-radius:5px;line-height:0}.official-logo img{width:100%;height:auto}.brand-label{font-size:13px;color:var(--muted);border-left:1px solid var(--line);padding-left:18px;margin-left:5px}.eyebrow{color:#cec1ed}.eyebrow:before{background:#b7a2e7}.scope{color:#d0c5e4}.hero{padding-bottom:60px}.hero h1{font-weight:550;line-height:1.25}.card{box-shadow:0 18px 70px #08051d24}.caption{color:var(--muted)}
body[data-theme=light] .official-logo{background:transparent;padding-left:0}body[data-theme=light] .card{border:1px solid #e0e5f0;border-radius:16px;box-shadow:0 16px 55px #29395d0c}body[data-theme=light] .eyebrow,body[data-theme=light] .scope{color:#666a98}body[data-theme=light] .eyebrow:before{background:#8b80cb}body[data-theme=light] .hero{padding-bottom:60px}body[data-theme=light] .wecom{fill:#4080d3}.version[aria-pressed=true]{background:#35285d}.preview-label{color:#6d6680}
@media(max-width:1000px){.brand-label{display:none}.official-logo{width:210px}}@media(max-width:700px){.official-logo{width:190px;padding:8px 10px}.brand{gap:0}.header{padding-left:6%;padding-right:6%}.hero,body[data-theme=light] .hero{padding-bottom:0}.hero h1{font-size:30px}.version{font-size:11px;padding:10px}.card{background:#fff}.header-right{gap:0}}

#tune-toggle{border:1px solid #d7cfe5;background:#f4f0fa;color:#49366c;border-radius:6px;padding:10px 14px;font-size:12px;min-height:40px}
.tuner{position:fixed;z-index:8;right:18px;top:90px;width:292px;max-height:calc(100svh - 165px);overflow:auto;background:#fff;color:#302845;border:1px solid #ded7eb;border-radius:12px;box-shadow:0 12px 50px #15092a30;padding:20px;font-size:12px}.tuner[hidden]{display:none}.tune-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.tune-head strong{font-size:16px}.tuner button{border:1px solid #ddd5e9;background:#f8f6fc;border-radius:5px;color:#483562;padding:9px;font-size:12px;min-height:36px}.tune-head button{border:0;background:none;padding:5px}.tune-note{color:#71667e;font-size:11px;line-height:1.6;margin:0 0 17px}.tune-row{display:block;margin:0 0 8px}.tune-row span{display:flex;justify-content:space-between;margin-bottom:5px}.tune-row output{font-variant-numeric:tabular-nums;color:#8158b0}.tune-row input{width:100%;accent-color:#8551c2;cursor:pointer;min-height:22px;margin:0}.tune-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tune-actions .confirm{background:#62408f;color:white;border-color:#62408f}.tune-message{font-size:11px;color:#60516e;line-height:1.7;min-height:19px;margin-top:10px}.tuner textarea{width:100%;height:90px;font-size:11px;border:1px solid #ddd;margin-top:10px;resize:vertical}.tune-presets{display:flex;gap:6px;margin-bottom:18px}.tune-presets button{flex:1;font-size:11px;padding:7px 3px}
@media(max-width:700px){.tuner{top:75px;right:12px;width:min(292px,calc(100vw - 24px));max-height:calc(100svh - 210px)}#tune-toggle{font-size:11px;padding:7px 10px}.preview-bar{gap:5px 10px}.versions{width:auto}.state-control{display:none}}

.official-logo,body[data-theme=light] .official-logo{position:relative;overflow:hidden;background:#fff;padding:12px 15px;border:1px solid #ffffff80;border-radius:5px;box-shadow:0 4px 16px #08051d12;transition:transform .3s ease;line-height:0}
.official-logo img{display:block;width:100%;height:auto;position:relative;z-index:1}
.official-logo:after{content:'';position:absolute;inset:-80% -40%;z-index:2;pointer-events:none;background:linear-gradient(110deg,transparent 42%,#ffffffa0 50%,transparent 58%);transform:translateX(-100%)}
.official-logo:hover:after{animation:logo-sweep 1s ease both}
@keyframes logo-sweep{to{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.official-logo{transition:none}.official-logo:hover:after{animation:none}}

.stage{min-height:100svh}.login-action{display:flex;align-items:center;justify-content:center;min-height:52px;margin:25px 0 14px;background:#57408a;color:white;text-decoration:none;border-radius:8px;font-weight:500}.login-action:hover{background:#69509c}.login-action[aria-disabled=true]{pointer-events:none;opacity:.5}.login-symbol{display:grid;place-items:center;margin:38px auto 20px;width:114px;height:114px;background:#f3f1f9;border-radius:28px}.login-symbol svg{width:62px;height:62px}.login-hint{text-align:center;color:var(--cardmuted);font-size:12px;line-height:1.8}#loginError{color:#a13848;font-size:13px;line-height:1.7;min-height:1em}.card{padding-top:38px;padding-bottom:30px}body.motion-paused .official-logo:after{animation:none}body.motion-paused .official-logo{transform:none!important}@media(max-width:700px){.login-symbol{margin-top:24px;width:80px;height:80px}.login-symbol svg{width:45px;height:45px}.header{gap:15px}.official-logo{max-width:52vw}.card{padding:28px 25px}.shell{padding-top:12px}}

.embedded-qr{width:300px;height:400px;max-width:100%;margin:8px auto 0;overflow:hidden;display:flex;justify-content:center}.embedded-qr iframe{flex-shrink:0;width:300px;height:400px;border:0;background:white}.embedded-qr[hidden],.login-action[hidden],#refreshQr[hidden]{display:none}#qrStatus{margin:0;font-size:12px}#loginError:empty{display:none}.card .sub{line-height:1.6}.card h2{margin-top:18px}.card{padding-top:28px;padding-bottom:22px}#refreshQr{margin:4px auto}.card-bottom{margin-top:12px}@media(max-width:700px){.card{padding:25px 20px}.embedded-qr{margin-top:0}}

.embedded-qr{height:312px}.embedded-qr iframe{transform:scale(.78);transform-origin:top center}

/* Card-scoped Sparkle. Existing typography, QR and brand stay in place. */
.card{isolation:isolate;overflow:hidden;background:#faf8ff}
#cardSparkle{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;border-radius:inherit;background:linear-gradient(135deg,#faf8ff 22%,#dcddfb 55%,#b5eafa 70%,#f3d6ed)}
.card .embedded-qr{background:#fff;border-radius:12px}
.card .card-bottom{border-color:#74729d30}
.card .sub,.card .card-top,.card .card-bottom,.card .help,.card .login-hint,.card .help-copy{color:#514b67}
.sparkle-motion{display:block;margin:14px auto 0;min-height:44px;min-width:104px;padding:9px 14px;border-radius:8px;border:1px solid #8d84b146;background:#fcfaffcf;color:#514067;font-size:12px;touch-action:manipulation}
.sparkle-motion:focus-visible{outline:3px solid #6445a4;outline-offset:3px}
.sparkle-motion:active{background:#e8defa;transform:translateY(1px)}
.sparkle-motion:disabled{opacity:.6;cursor:not-allowed}
@media(hover:hover){.sparkle-motion:hover:not(:disabled){background:#efe7fb}}
@media(prefers-reduced-motion:reduce){.sparkle-motion:active{transform:none}}
/* OpenShaders card shadow, light-edge and six-degree tilt, adapted to login dimensions. */
.card{--tilt-x:0deg;--tilt-y:0deg;--light-x:50%;--light-y:50%;--tilt-strength:0;transform:perspective(1400px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transform-origin:center;box-shadow:0 40px 120px -40px #00000059,inset 0 1px #fff9;border:1px solid #ffffff66}
.card:after{content:'';position:absolute;inset:0;z-index:3;border-radius:inherit;pointer-events:none;padding:2px;background:radial-gradient(75% 75% at var(--light-x) var(--light-y),#00000029,#00000014 45%,#0000000d);opacity:calc(var(--tilt-strength) * .5 + .5);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-clip:content-box,border-box;mask-composite:exclude}
.card .embedded-qr{position:relative;background:#fff!important}
.card h2,.card .card-top,.card .sub,.card .card-bottom,.card .login-hint,.card .refresh,.sparkle-motion,.card .help-copy{position:relative}
@media(prefers-reduced-motion:reduce){.card{transform:none!important}}

.text-type{position:relative;display:inline-block;white-space:pre-wrap}.text-type__sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.text-type__char{position:relative}.text-type__char--selected{background-color:color-mix(in srgb,currentColor 25%,transparent)}.text-type__caret{display:inline-block;width:0}.text-type__cursor{position:absolute;top:0;left:0;white-space:pre;pointer-events:none;transition:opacity .2s ease;will-change:transform}.text-type__cursor--hidden{opacity:0}.text-type__blink{display:inline-block}.text-type__cursor--character .text-type__blink{margin-left:.25rem}.text-type__shape{display:inline-block;margin-left:.06em;background-color:currentColor}.text-type__cursor--bar .text-type__shape{width:max(2px,.07em);height:1.1em;vertical-align:-.2em;border-radius:1px}.text-type__cursor--block .text-type__shape{width:.56em;height:1.1em;vertical-align:-.2em;border-radius:.06em}.text-type__cursor--underscore .text-type__shape{width:.56em;height:max(2px,.075em);vertical-align:-.12em;border-radius:1px}.hero #headline{min-height:2.5em;position:relative}.hero .headline-type,.hero .headline-static{display:block;width:100%;min-height:2.5em;white-space:pre-wrap;line-height:inherit}@media(prefers-reduced-motion:reduce){.headline-static{white-space:pre-wrap}}.official-logo{transform:none!important;transition:none!important}.official-logo:after{display:none!important}.logo-glass-slot{position:absolute;inset:0;line-height:normal;z-index:4}.logo-glass-engine{position:relative;isolation:isolate;cursor:pointer;overflow:hidden;user-select:none;width:100%;height:100%;border-radius:inherit;outline-offset:-4px}.logo-glass-engine:focus-visible{outline:3px solid #7055c7}.logo-glass-engine[aria-disabled=true]{cursor:default}.official-logo img.logo-glass-fallback{position:absolute;inset:0;margin:auto;width:calc(100% - 30px);height:auto}.official-logo.has-glass>img{visibility:hidden}.official-logo:has(.logo-glass-engine[data-settled=true])>img{visibility:visible}.logo-glass-engine[data-settled=true]{background:transparent!important}.logo-glass-engine[data-settled=true] canvas{visibility:hidden}