.login-body{--bg:#0d0c0b;--ink:#f4e9d0;--muted:#b5ab9d;--gold:#deb862;--gold-hot:#f3d58a;--crimson:#9b1b1e;--crimson-hot:#c0262a;--loss:#e84e48;--title:"Bebas Neue", "Barlow Condensed", "Arial Narrow", sans-serif;--body:"Barlow Condensed", "Arial Narrow", system-ui, sans-serif;color-scheme:dark;background:var(--bg);min-height:100dvh;color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased;margin:0;font-size:1.15rem;font-weight:500;line-height:1.35;overflow-x:hidden}.login-body *,.login-body :before,.login-body :after{box-sizing:border-box}.login-stage{pointer-events:none;position:fixed;inset:0;overflow:hidden}.login-glow{background:radial-gradient(60% 55% at 50% 30%,#9b1b1e8c,#0000 70%),radial-gradient(35% 30% at 50% 32%,#deb86238,#0000 70%);height:85%;position:absolute;inset:-20% -10% auto}.login-rays{background:repeating-conic-gradient(#deb86212 0deg 5deg,#0000 5deg 18deg);width:180vmax;height:180vmax;animation:90s linear infinite login-spin;position:absolute;top:24%;left:50%;translate:-50% -50%;-webkit-mask-image:radial-gradient(circle,#000 0%,#0000 42%);mask-image:radial-gradient(circle,#000 0%,#0000 42%)}.login-stripes{background:repeating-linear-gradient(135deg,#f4e9d006 0 1px,#0000 1px 9px);position:absolute;inset:0}.login-stage:after{content:"";background:var(--crimson);height:6px;box-shadow:0 -1px 0 var(--gold);position:absolute;inset:auto 0 0}@keyframes login-spin{to{rotate:360deg}}.login-main{z-index:1;width:100%;max-width:28rem;padding:max(1.25rem, env(safe-area-inset-top)) 1.1rem max(2rem, env(safe-area-inset-bottom));flex-direction:column;align-items:center;gap:.25rem;margin-inline:auto;display:flex;position:relative}.login-crest-wrap{width:min(82vw,21rem);margin-top:clamp(.25rem,3vh,2rem);animation:.9s cubic-bezier(.2,.9,.25,1.15) both login-crest-in}.login-crest{filter:drop-shadow(0 0 22px #deb86259)drop-shadow(0 10px 30px #0009);width:100%;height:auto;animation:3.2s ease-in-out .9s infinite login-crest-pulse;display:block}@keyframes login-crest-in{0%{opacity:0;transform:translateY(-14px)scale(.86)}}@keyframes login-crest-pulse{50%{filter:drop-shadow(0 0 34px #deb86299)drop-shadow(0 10px 30px #0009)}}.login-card{backdrop-filter:blur(6px);background:linear-gradient(#241f1ceb,#141210f0);border-radius:14px;width:100%;margin-top:.25rem;padding:1.35rem 1.2rem 1.4rem;animation:.7s cubic-bezier(.2,.9,.25,1) .18s both login-card-in;position:relative;box-shadow:inset 0 0 0 1px #deb86259,0 0 0 1px #0009,0 24px 60px #0000008c}.login-card:before{content:"";background:var(--crimson);border-radius:0 0 3px 3px;height:3px;position:absolute;top:0;left:1.2rem;right:1.2rem;box-shadow:0 0 14px #9b1b1ee6}@keyframes login-card-in{0%{opacity:0;transform:translateY(18px)}}.login-card.is-shaking{animation:.48s cubic-bezier(.36,.07,.19,.97) both login-shake}@keyframes login-shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(5px)}30%,50%,70%{transform:translate(-10px)}40%,60%{transform:translate(10px)}}.login-kicker{color:var(--gold);letter-spacing:.16em;text-transform:uppercase;margin:0 0 .35rem;font-size:.95rem;font-weight:700}.login-title{font-family:var(--title);letter-spacing:.01em;text-transform:uppercase;text-wrap:balance;margin:0;font-size:clamp(2.4rem,11vw,3.1rem);font-weight:400;line-height:.92}.login-title [data-name]{color:var(--gold)}.login-sub{color:var(--muted);margin:.45rem 0 0;font-size:1.05rem}.login-step{gap:0;display:grid}.login-step[hidden]{display:none}.login-label{color:var(--ink);letter-spacing:.12em;text-transform:uppercase;justify-content:space-between;margin:1rem 0 .35rem;font-size:.95rem;font-weight:700;display:flex}.login-hint{color:var(--muted);letter-spacing:.04em;text-transform:none;font-weight:600}.login-input{width:100%;min-height:3.4rem;color:var(--ink);font:inherit;letter-spacing:.02em;background:#0d0c0bbf;border:2px solid #f4e9d029;border-radius:10px;padding:.5rem 1rem;font-size:1.35rem;font-weight:600;transition:border-color .15s,box-shadow .15s}.login-input:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 4px #deb8622e}.login-input[aria-invalid=true]{border-color:var(--loss);box-shadow:0 0 0 4px #e84e482e}.login-meter{background:#f4e9d01a;border-radius:4px;height:4px;margin-top:.4rem;overflow:hidden}.login-meter span{background:var(--loss);width:0;height:100%;transition:width .2s,background .2s;display:block}.login-meter span[data-score="2"]{background:#f08a4b}.login-meter span[data-score="3"],.login-meter span[data-score="4"]{background:var(--gold)}.login-button{background:linear-gradient(180deg, var(--crimson-hot), var(--crimson));color:#fff;min-height:3.6rem;font-family:var(--title);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;border:0;border-radius:10px;margin-top:1.2rem;font-size:1.9rem;transition:transform .12s,box-shadow .16s;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #deb8628c,0 10px 24px #9b1b1e73}.login-button:after{content:"";background:linear-gradient(100deg,#0000,#f3d58a73,#0000);width:45%;animation:3.6s ease-in-out 1.2s infinite login-sheen;position:absolute;inset:0 auto 0 -60%;transform:skew(-18deg)}@keyframes login-sheen{0%,60%{left:-60%}to{left:130%}}.login-button:hover{box-shadow:inset 0 0 0 1px var(--gold-hot), 0 12px 30px #c0262a99}.login-button:active{transform:scale(.98)}.login-button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.login-button.is-busy span{opacity:.55}.login-button:disabled{cursor:progress}.login-link{color:var(--gold);font:inherit;text-underline-offset:.2em;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.login-help{color:var(--muted);text-align:center;margin:.75rem 0 0;font-size:.98rem}.login-error{border-left:4px solid var(--loss);color:#ffd9d6;background:#e84e481f;border-radius:6px;margin:.9rem 0 0;padding:.6rem .8rem;font-weight:600}.login-error.is-info{border-left-color:var(--gold);color:var(--ink);background:#deb8621a}.login-error[hidden]{display:none}.login-celebrate{z-index:10;pointer-events:none;place-items:center;display:grid;position:fixed;inset:0}.login-celebrate[hidden]{display:none}.login-celebrate:before{content:"";background:radial-gradient(circle,#0d0c0bd1,#0d0c0b8c 55%,#0000 80%);animation:.26s both login-fade;position:absolute;inset:0}.login-canvas{width:100%;height:100%;position:absolute;inset:0}.login-cheer{font-family:var(--title);text-align:center;text-transform:uppercase;color:var(--ink);text-shadow:0 0 30px #deb862cc, 0 4px 0 var(--crimson);margin:0;padding:0 1rem;font-size:clamp(3rem,15vw,7rem);line-height:.9;animation:1.5s cubic-bezier(.2,.9,.25,1.2) both login-cheer;position:relative}.login-cheer span{letter-spacing:.2em;color:var(--gold);font-size:.45em;display:block}.login-cheer strong{font-weight:400}@keyframes login-cheer{0%{opacity:0;transform:scale(.4)}25%{opacity:1;transform:scale(1.08)}40%{transform:scale(1)}85%{opacity:1}to{opacity:0;transform:scale(1.1)}}.is-celebrating .login-crest-wrap{animation:.7s cubic-bezier(.2,.9,.25,1) both login-crest-blast}.is-celebrating .login-card{animation:.26s ease-in both login-card-out}@keyframes login-crest-blast{40%{filter:brightness(1.6);transform:scale(1.18)}to{opacity:.25;transform:scale(1.05)}}@keyframes login-card-out{to{opacity:0;transform:translateY(24px)scale(.96)}}.login-celebrate.is-calm .login-cheer{animation:.7s both login-fade}@keyframes login-fade{0%{opacity:0}}@media (width>=48rem){.login-main{max-width:30rem;padding-top:3vh}.login-crest-wrap{width:24rem}.login-card{padding:1.8rem 1.8rem 1.9rem}}@media (prefers-reduced-motion:reduce){.login-rays,.login-crest,.login-crest-wrap,.login-card,.login-button:after,.is-celebrating .login-crest-wrap,.is-celebrating .login-card{animation:none!important}.login-card.is-shaking{box-shadow:inset 0 0 0 2px var(--loss), 0 24px 60px #0000008c;animation:none}}
