:root{color-scheme:dark;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#010203;color:#b8cbbf;font-synthesis:none;--reveal:0;--illum:0;--sx:0px;--sy:0px;--red-x:0px;--red-y:0px;--cyan-x:0px;--cyan-y:0px;--penumbra:3px}
*{box-sizing:border-box}body{margin:0;min-height:100svh;display:grid;place-items:center;padding:32px;isolation:isolate;background:#010203;overflow-x:hidden}.atmosphere{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 50% 43%,#09100d20,transparent 58%),#010203}#watchers{position:absolute;inset:0;width:100%;height:100%}.fog{position:absolute;inset:-25%;will-change:transform;pointer-events:none}.fog-back{background:radial-gradient(ellipse at 28% 40%,#49675e0b,transparent 34%),radial-gradient(ellipse at 76% 55%,#76887907,transparent 35%),radial-gradient(ellipse at 45% 74%,#5b827509,transparent 26%);animation:drift 58s ease-in-out infinite alternate}.fog-front{background:radial-gradient(ellipse at 70% 72%,#96b5a407,transparent 34%),radial-gradient(ellipse at 22% 64%,#8aa39806,transparent 26%),linear-gradient(175deg,transparent 50%,#00080b44 72%,transparent);animation:drift 47s ease-in-out infinite alternate-reverse;opacity:.35}
.grain{position:absolute;inset:0;opacity:.012;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.83' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.vignette{position:absolute;inset:0;box-shadow:inset 0 0 20vw 7vw #000c;background:linear-gradient(0deg,#000b,transparent 38%,transparent 68%,#0007)}main{width:min(100%,312px);position:relative;margin-top:-22px;animation:arrival 3.2s ease-out both}.wordmark{display:block;width:max-content;margin:0 auto 60px;text-decoration:none;font-family:"Bodoni MT","Didot","Times New Roman",serif;font-size:clamp(68px,8vw,96px);line-height:1;letter-spacing:.075em;font-weight:400;outline-offset:12px;position:relative}.wordmark>span{display:block;position:relative;font-weight:400}.wordmark:focus-visible{outline:1px solid #72887c}.wordmark:focus-visible>span{--illum:.9!important}
.wordmark>span,label,input,button{color:rgba(191,213,200,calc(.018 + var(--illum)*.94));text-shadow:var(--sx) var(--sy) var(--penumbra) rgba(0,0,0,calc(var(--illum)*.95)),var(--red-x) var(--red-y) 0 rgba(242,75,111,calc(var(--illum)*.5)),var(--cyan-x) var(--cyan-y) 0 rgba(83,207,213,calc(var(--illum)*.48));transition:color .55s ease-out,text-shadow .6s ease-out}
.field{position:relative;margin-top:25px}label{display:block;font-size:11px;letter-spacing:.09em;margin:0 0 9px}input{display:block;width:100%;height:43px;border:0;border-bottom:1px solid rgba(157,187,172,calc(.012 + var(--reveal)*.4));border-radius:0;background:transparent;padding:0 0 10px;font:inherit;font-size:16px;outline:none;caret-color:#bdd5c7;box-shadow:var(--sx) calc(var(--sy)*.4) var(--penumbra) #0005;transition:color .55s,border-color .75s,text-shadow .6s}input:focus-visible{border-color:#6a8e7b;background:linear-gradient(0deg,#80b79b04,transparent)}.field:focus-within{--reveal:.85!important}.field:focus-within label,.field:focus-within input{--illum:.9!important}button{width:100%;height:44px;display:flex;align-items:center;justify-content:space-between;border:0;border-bottom:1px solid rgba(157,187,172,calc(.008 + var(--reveal)*.2));border-radius:0;background:transparent;padding:0;font:inherit;font-size:12px;letter-spacing:.03em;cursor:pointer;transition:color .65s,border-color .75s,text-shadow .6s}button span{font-size:20px;font-weight:300}button:focus-visible{--illum:.9!important;outline:1px solid #6d8879;outline-offset:6px}button:disabled{opacity:.5;cursor:wait}#login-error{font-size:12px;line-height:1.6;color:#d5a39a;min-height:20px;margin:17px 0 8px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes arrival{from{opacity:0}to{opacity:1}}@keyframes drift{from{transform:translate3d(-3%,-1%,0) scale(1)}to{transform:translate3d(4%,3%,0) scale(1.08)}}@media(pointer:coarse),(hover:none){.wordmark>span,label,input,button{--illum:.82!important}.field,button{--reveal:.82!important}.wordmark{margin-bottom:44px}.fog{opacity:.22}}@media(max-width:390px){body{padding:28px}main{max-width:280px}}@media(max-height:540px){body{padding:24px}main{margin:0}.wordmark{font-size:60px;margin-bottom:25px}.field{margin-top:16px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.fog{will-change:auto}}

/* Saved logins retain native autofill without the browser's bright fill block.
   The inset layer covers UA background colors; text keeps the flashlight lighting. */
input:is(:autofill, :-webkit-autofill){
 appearance:none;
 filter:none!important;
 background-color:#010203!important;
 background-image:none!important;
 background-clip:padding-box!important;
 border-bottom-color:rgba(157,187,172,calc(.012 + var(--reveal)*.4))!important;
 box-shadow:inset 0 0 0 1000px #010203!important;
 color:rgba(191,213,200,calc(.018 + var(--illum)*.94))!important;
 -webkit-text-fill-color:rgba(191,213,200,calc(.018 + var(--illum)*.94))!important;
 caret-color:#bdd5c7;
}

input:is(:autofill, :-webkit-autofill):focus-visible{border-bottom-color:#6a8e7b!important}
