.browser-login{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:42px 24px;background:#173b3d;color:#193d3e}
.login-card{display:grid;grid-template-columns:1fr 1fr;max-width:900px;width:100%;overflow:hidden;border:2px solid #49634f;border-radius:28px;background:#f0e8d5;box-shadow:0 14px 0 #102d2f;animation:login-arrive .5s cubic-bezier(.2,.75,.3,1) both}
.login-world{position:relative;min-height:540px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:38px 25px;background:#345742 url('/assets/lobby-v2.webp') center/cover;color:#fff4cc;isolation:isolate}
.login-world:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#153a3ed9 0%,#153a3e00 35%,#153a3e1a 60%,#153a3efa 100%);z-index:-1}
.login-brand{font-weight:900;letter-spacing:7px;font-size:38px;line-height:1.15;text-align:center}.login-brand span{display:block;letter-spacing:2.4px;font-size:9px;font-weight:800;margin-top:10px}
.login-book{position:absolute;width:170px;height:170px;object-fit:contain;left:50%;top:49%;transform:translate(-50%,-50%) rotate(-8deg);animation:login-book-float 6s ease-in-out infinite}
.login-world-caption{font-size:24px;line-height:1.25;font-weight:900;text-align:center;margin-top:auto;max-width:320px;z-index:1}
.login-content{padding:46px 35px 30px;display:flex;flex-direction:column;justify-content:center;min-width:0}.login-eyebrow{font-size:10px;letter-spacing:2px;font-weight:900;color:#6c7c62}.login-content h1{font-family:Nunito,sans-serif;font-size:33px;line-height:1.15;letter-spacing:-.8px;color:#1d4141;margin:13px 0}.login-description{color:#607267;font-size:14px;line-height:1.65;margin:0 0 20px;min-height:47px}
.login-code{border:1px solid #cbd1b8;border-radius:16px;background:#e1e4cf;padding:14px 15px;text-align:center;margin-bottom:19px}.login-code[hidden]{display:none}.login-code>span{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:#62745e;font-weight:900;display:block}.login-code strong{display:block;letter-spacing:6px;font-size:30px;color:#234946;font-variant-numeric:tabular-nums;margin:3px 0;overflow-wrap:anywhere}.login-code small{font-size:10px;color:#65735f;display:block;line-height:1.5}
.login-action{width:100%;min-height:54px;padding:14px 15px;border:0;border-bottom:4px solid #133b37;border-radius:13px;background:#2d6558;color:#fff7de;font-size:14px;font-weight:900;font-family:inherit;line-height:1.35;display:flex;justify-content:center;align-items:center;text-align:center;gap:10px;cursor:pointer;text-decoration:none;transition:background .18s,transform .18s}.login-action svg{width:23px;height:23px;fill:currentColor;flex-shrink:0}.login-action:hover{background:#367362;transform:translateY(-2px)}.login-action:active{transform:translateY(1px)}.login-action:focus-visible,.login-text-button:focus-visible{outline:3px solid #b78338;outline-offset:4px}.login-action:disabled{opacity:.68;cursor:wait;transform:none}.login-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px;color:#6e7e6b;font-size:10px;font-variant-numeric:tabular-nums}.login-text-button{border:0;background:none;padding:3px 0;color:#4f6d60;font-family:inherit;font-size:11px;font-weight:800;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.login-status{font-size:11px;line-height:1.6;color:#617a6b;min-height:35px;margin:15px 0 18px}.login-status.is-waiting:before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:#639274;margin-right:7px;animation:login-wait 1.8s ease-in-out infinite}.login-note{display:flex;align-items:center;gap:10px;color:#778574;font-size:10px;line-height:1.6;border-top:1px solid #d4d9c3;padding-top:17px;margin-top:auto}.login-note-mark{color:#567e5c;font-size:20px;font-weight:900}.login-footer{font-size:10px;letter-spacing:.2px;color:#9db6a9;text-align:center;margin:27px 0 0}.login-dots{display:flex;gap:4px}.login-dots i{width:5px;height:5px;border-radius:50%;background:currentColor;animation:login-dot 1.1s ease-in-out infinite}.login-dots i:nth-child(2){animation-delay:.15s}.login-dots i:nth-child(3){animation-delay:.3s}.login-card[data-state=authenticated] .login-book{animation:none;transform:translate(-50%,-50%) rotate(0deg);transition:transform .35s}
@keyframes login-arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes login-book-float{0%,100%{transform:translate(-50%,-50%) rotate(-8deg)}50%{transform:translate(-50%,-54%) rotate(-4deg)}}@keyframes login-wait{50%{opacity:.4}}@keyframes login-dot{0%,80%,100%{transform:translateY(0)}40%{transform:translateY(-4px)}}
@media(max-width:650px){.browser-login{padding:18px 15px 24px;justify-content:flex-start}.login-card{grid-template-columns:1fr;max-width:420px;border-radius:24px;box-shadow:0 8px 0 #102d2f}.login-world{min-height:165px;height:165px;padding:22px 20px;background-position:center 45%;align-items:flex-start;justify-content:center}.login-brand{font-size:31px;text-align:left;letter-spacing:5px}.login-brand span{font-size:8px;letter-spacing:1.5px}.login-book{width:115px;height:115px;left:auto;right:9px;top:50%;transform:translateY(-50%) rotate(-8deg);animation:none}.login-world-caption{display:none}.login-content{padding:27px 25px 24px}.login-content h1{font-size:30px}.login-description{font-size:13px;min-height:0}.login-code{padding:11px;margin-bottom:16px}.login-code strong{font-size:27px}.login-note{margin-top:2px}.login-footer{margin-top:23px;font-size:9px}.login-card[data-state=authenticated] .login-book{transform:translateY(-50%) rotate(0deg)}}
@media(prefers-reduced-motion:reduce){.browser-login *{animation:none!important;transition:none!important}}
