@font-face{font-family:"Helvetica Now Display";src:url("/assets/fonts/HelveticaNowDisplay-Md.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Helvetica Now Display";src:url("/assets/fonts/HelveticaNowDisplay-XBd.woff2") format("woff2");font-weight:800;font-display:swap}

:root{
  color-scheme:dark;
  --ink:#0A0C10;
  --ink-2:#0D1017;
  --royal:#1863DC;
  --blue:#5C8DFF;
  --blue-bright:#82ACFF;
  --pale:#E3EDFF;
  --cream:#EDF1F7;
  --dim:#8A93A3;
  --faint:#565E6E;
  --line:rgba(233,237,244,.16);
  --line-soft:rgba(233,237,244,.09);
  --red:#D47A72;
  --hv:"Helvetica Now Display","Helvetica Neue",Arial,sans-serif;
  --body:"Helvetica Neue",Helvetica,"Helvetica Now Display",Arial,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{min-height:100%;background:var(--ink);scroll-behavior:auto}
body{position:relative;min-height:100%;min-height:100svh;background:var(--ink);color:var(--cream);font-family:var(--hv);font-weight:500;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums lining-nums;overflow-x:hidden;overflow-y:auto}
::selection{background:var(--blue);color:var(--ink)}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

.grain{position:fixed;inset:0;z-index:1;pointer-events:none;background:url("/assets/grain.png");background-size:300px;opacity:.045;mix-blend-mode:overlay;animation:grainshift 7s steps(6) infinite}
@keyframes grainshift{0%{transform:translate(0,0)}20%{transform:translate(-2%,1%)}40%{transform:translate(1%,-2%)}60%{transform:translate(-1%,1%)}80%{transform:translate(1%,-1%)}100%{transform:translate(0,0)}}
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.aurora i{position:absolute;border-radius:50%;filter:blur(clamp(26px,3.6vw,52px));mix-blend-mode:screen;will-change:transform;opacity:1}
.js .aurora i{opacity:0;transition:opacity 2.6s ease .4s}
.js body.on .aurora i{opacity:1}
.aurora .a1{left:-14%;top:-4%;width:128%;height:19%;background:radial-gradient(50% 50% at 50% 50%,rgba(28,110,240,.52) 0%,rgba(24,99,220,.2) 48%,rgba(24,99,220,0) 74%);transform:rotate(-11deg);animation:aur1 150s ease-in-out infinite alternate}
.aurora .a2{right:-20%;top:30%;width:98%;height:15%;background:radial-gradient(50% 50% at 50% 50%,rgba(92,141,255,.4) 0%,rgba(92,141,255,.15) 48%,rgba(92,141,255,0) 72%);transform:rotate(13deg);animation:aur2 190s ease-in-out infinite alternate -70s}
.aurora .a3{left:-16%;bottom:-2%;width:88%;height:15%;background:radial-gradient(50% 50% at 50% 50%,rgba(24,99,220,.32) 0%,rgba(24,99,220,.12) 48%,rgba(24,99,220,0) 74%);transform:rotate(-8deg);animation:aur3 230s ease-in-out infinite alternate -130s}
@keyframes aur1{to{transform:rotate(-6deg) translate(6vw,3vh) scale(1.09)}}
@keyframes aur2{to{transform:rotate(19deg) translate(-7vw,-2.5vh) scale(1.12)}}
@keyframes aur3{to{transform:rotate(-3deg) translate(5vw,-3.5vh) scale(1.06)}}
.ghost{position:fixed;right:-1.5vw;bottom:-6vh;z-index:0;font-weight:800;font-size:clamp(220px,34vh,420px);line-height:.8;letter-spacing:-.06em;color:rgba(233,237,244,.024);pointer-events:none;user-select:none}

.frame-line{position:fixed;left:0;right:0;height:1px;z-index:4;background:linear-gradient(90deg,transparent,rgba(92,141,255,.5) 18%,rgba(92,141,255,.5) 82%,transparent);transform:scaleX(1);transform-origin:center}
.js body.boot .frame-line{transform:scaleX(0)}
.frame-line.top{top:0}
.frame-line.bottom{bottom:0}
.bar{position:fixed;left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:22px clamp(22px,4vw,44px);pointer-events:none}
.bar.top{top:0}
.bar.bottom{bottom:0}
.wordmark{font-weight:800;font-size:13px;letter-spacing:.03em;text-transform:uppercase;color:var(--cream)}
.bar-k{font-weight:800;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.stamp{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.stamp::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 0 rgba(92,141,255,.5);animation:pulse 3.6s ease-in-out infinite 1.4s}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(92,141,255,.45)}50%{box-shadow:0 0 0 6px rgba(92,141,255,0)}}

.plate{position:relative;z-index:3;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;padding:max(96px,calc(72px + env(safe-area-inset-top))) max(22px,calc(5vw + env(safe-area-inset-right))) max(96px,calc(72px + env(safe-area-inset-bottom))) max(22px,calc(5vw + env(safe-area-inset-left)))}
.col{width:min(560px,100%)}
.field{margin-top:0}
.field + .field{margin-top:34px}
.field-k{display:flex;justify-content:space-between;align-items:baseline;font-weight:800;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.field-k .state{letter-spacing:.14em;color:var(--dim);transition:color .3s var(--ease)}
.col.is-verifying .state,.col.is-verified .state{color:var(--blue)}
.field-row{margin-top:6px;display:flex;gap:14px;align-items:stretch;border-bottom:1px solid var(--line);transition:border-color .35s var(--ease),box-shadow .35s var(--ease)}
.field-row:focus-within{border-color:var(--blue);box-shadow:0 1px 0 var(--blue)}
.field.err .field-row{border-color:var(--red);box-shadow:0 1px 0 var(--red)}
.inputwrap{flex:1;min-width:0;display:flex}
input[type="password"],input[type="email"]{flex:1;min-width:0;background:transparent;border:0;outline:0;color:var(--cream);caret-color:var(--blue);border-radius:0}
input[type="email"]{font-family:var(--body);font-weight:500;font-size:17px;letter-spacing:.02em;padding:15px 0 16px}
input[type="password"]{font-family:var(--hv);font-weight:800;font-size:clamp(24px,4vw,32px);letter-spacing:.42em;padding:12px 0 14px}
input::placeholder{color:rgba(138,147,163,.4);font-family:var(--body);font-weight:500;font-size:15px;letter-spacing:.06em}
input:-webkit-autofill{-webkit-text-fill-color:var(--cream);transition:background-color 9999s ease-out}
input:disabled{opacity:.68}
.go{flex:0 0 auto;align-self:center;display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:12px 22px;border:1px solid rgba(92,141,255,.5);border-radius:40px;background:transparent;color:var(--cream);font-family:var(--hv);font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),transform .3s var(--ease),opacity .3s}
.go svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--ease)}
.go:hover,.go:focus-visible{background:var(--royal);border-color:var(--royal);color:#fff}
.go:hover svg{transform:translateX(3px)}
.go:focus-visible{outline:2px solid var(--blue-bright);outline-offset:3px}
.go:disabled{opacity:.45;cursor:default}
.msg,.fallback-error{margin-top:16px;min-height:1.3em;font-family:var(--body);font-weight:500;font-size:13px;line-height:1.45;letter-spacing:.02em}
.msg{color:transparent;transition:color .3s}
.msg.err,.fallback-error{color:var(--red)}
.msg.ok{color:var(--blue-bright)}
.fallback-error{display:none}
.fallback-error:target{display:block}
.js .fallback-error:target{display:none}
.fallback-error:focus{outline:2px solid var(--blue-bright);outline-offset:4px}
.activity-note{max-width:540px;margin-top:18px;color:var(--dim);font-family:var(--body);font-size:11px;line-height:1.55;letter-spacing:.025em}
.activity-note a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.activity-note a:hover{color:var(--white)}
.activity-note a:focus-visible{outline:2px solid var(--blue-bright);outline-offset:3px}

.sweep{position:fixed;top:50%;left:0;right:0;height:1px;z-index:8;background:linear-gradient(90deg,transparent,var(--blue),transparent);transform:scaleX(0);opacity:0;pointer-events:none}
body.granted .sweep{transition:transform .9s var(--ease),opacity .4s ease;transform:scaleX(1);opacity:1}
body.granted .plate,body.granted .bar,body.granted .ghost{transition:opacity .7s ease .25s,filter .7s ease .25s;opacity:0;filter:blur(6px)}

@media(prefers-reduced-motion:no-preference){
  .js body.boot .frame-line{transition:transform 1.1s var(--ease) .15s}
  .js body.boot.on .frame-line{transform:scaleX(1)}
  .js body.boot .bar,.js body.boot .field,.js body.boot .msg,.js body.boot .activity-note{opacity:0;transform:translateY(12px);transition:opacity .7s ease,transform .9s var(--ease)}
  .js body.boot.on .field-email{opacity:1;transform:none;transition-delay:.2s}
  .js body.boot.on .field-key{opacity:1;transform:none;transition-delay:.36s}
  .js body.boot.on .msg{opacity:1;transform:none;transition-delay:.5s}
  .js body.boot.on .activity-note{opacity:1;transform:none;transition-delay:.58s}
  .js body.boot.on .bar{opacity:1;transform:none;transition-delay:.66s}
  .shake{animation:shake .34s ease-in-out}
  @keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}55%{transform:translateX(6px)}80%{transform:translateX(-3px)}}
}

@media(prefers-reduced-motion:reduce){
  .aurora i{animation:none;opacity:1;transition:none}
  .grain,.stamp::before{animation:none}
  .frame-line{transform:scaleX(1)}
  body.granted .plate,body.granted .bar,body.granted .ghost{transition:none}
}

@media(max-width:560px){
  .bar{padding:18px max(20px,env(safe-area-inset-right)) 18px max(20px,env(safe-area-inset-left))}
  .plate{padding-top:max(84px,calc(64px + env(safe-area-inset-top)));padding-right:max(22px,env(safe-area-inset-right));padding-bottom:max(96px,calc(72px + env(safe-area-inset-bottom)));padding-left:max(22px,env(safe-area-inset-left))}
  .field + .field{margin-top:28px}
  .field-key .field-row{flex-direction:column;gap:0;border-bottom:0;box-shadow:none}
  .field-key .inputwrap{border-bottom:1px solid var(--line);transition:border-color .35s var(--ease),box-shadow .35s var(--ease)}
  .field-key:focus-within .inputwrap{border-color:var(--blue);box-shadow:0 1px 0 var(--blue)}
  .field-key.err .inputwrap{border-color:var(--red);box-shadow:0 1px 0 var(--red)}
  input[type="password"]{width:100%;letter-spacing:.34em}
  .go{margin-top:18px;justify-content:center;width:100%}
}

@media(max-height:520px){
  .bar,.frame-line{position:absolute}
  .plate{min-height:680px;align-items:flex-start;padding-top:max(84px,calc(64px + env(safe-area-inset-top)));padding-bottom:max(96px,calc(72px + env(safe-area-inset-bottom)))}
}