@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,500&family=Manrope:wght@400;500;600&display=swap');
:root{--ink:#080608;--ivory:#e7ded5;--muted:#aca0a4;--blood:#b91946;--px:0px;--py:0px;color-scheme:dark;font-family:Manrope,Arial,sans-serif;background:var(--ink);color:var(--ivory)}
*{box-sizing:border-box}body{margin:0;min-height:100svh}button,a,input{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #e39aa9;outline-offset:5px}button{color:inherit}a{color:inherit;text-decoration:none}.scene{position:fixed;inset:0;overflow:hidden;pointer-events:none;background:#020203}.art{position:absolute;inset:-3%;background:url('assets/valgavoth.png') center 39%/cover no-repeat;transform:translate3d(var(--px),var(--py),0) scale(1.035);filter:brightness(.73) saturate(.75);will-change:transform}.haze{position:absolute;inset:-10%;background:radial-gradient(ellipse at 51% 68%,#a4113223,transparent 34%);transform:translate3d(calc(var(--px)*-1.5),calc(var(--py)*-1.5),0)}.vignette{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 44%,transparent 16%,#0503054d 58%,#050305e8 100%),linear-gradient(0deg,#050305e8 0%,transparent 29%,#03020322 68%,#03020391 100%)}.dust{position:absolute;inset:0}.dust i{position:absolute;width:2px;height:2px;border-radius:50%;background:#d1b3a7;box-shadow:0 0 8px #e9ab9d;opacity:0;animation:drift 15s linear infinite}.dust i:nth-child(3n){background:#d22954;width:1px;height:1px}@keyframes drift{0%{opacity:0;translate:0 20px}20%{opacity:.38}80%{opacity:.22}100%{opacity:0;translate:20px -100px}}
header{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:30px 42px}.brand{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.26em}.brand img{border-radius:0}.motion{display:flex;gap:10px;align-items:center;font-size:12px;color:#beb2b8;background:none;border:0;padding:10px}.motion-mark{font-size:24px}.motion:hover{color:white}main{min-height:calc(100svh - 161px);display:grid;place-items:center;position:relative;padding:54px 24px 36px}.entrance{width:min(100%,450px);text-align:center;position:relative;padding:18px 32px 30px}.entrance:before{content:'';position:absolute;z-index:-1;inset:-50px -100px;background:radial-gradient(ellipse,#080609e8 15%,#090609d4 40%,#09060955 62%,transparent 74%);pointer-events:none}.eyebrow{display:flex;justify-content:center;align-items:center;gap:15px;font-size:11px;letter-spacing:.38em;color:#d5b9bd}.eyebrow span{width:28px;height:1px;background:#aa727477}h1{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:clamp(66px,6.5vw,92px);line-height:1.05;letter-spacing:-.045em;margin:13px 0 19px;text-shadow:0 2px 24px #000}.rule{width:120px;height:1px;background:linear-gradient(90deg,transparent,#ad5263,transparent);margin:0 auto 32px;position:relative}.rule i{position:absolute;left:calc(50% - 3px);top:-3px;width:7px;height:7px;rotate:45deg;border:1px solid #bf7182;background:#1f0c12}.prompt{font-size:14px;letter-spacing:.05em;color:#d0bfc2;margin:0 0 20px}.profiles{display:grid;gap:12px}.profile{width:100%;border:1px solid #ab72744d;background:linear-gradient(115deg,#25171bc9,#120e12d9);display:grid;grid-template-columns:32px 1fr 20px;align-items:center;gap:12px;text-align:left;padding:15px 21px;font-size:16px;letter-spacing:.035em;transition:border-color .25s,background .25s,transform .25s;position:relative}.profile:hover{border-color:#c95a78;background:linear-gradient(115deg,#4a1425d9,#1e1017e8);transform:translateY(-2px)}.initial{font:26px 'Cormorant Garamond',Georgia,serif;color:#cc9caa;border-right:1px solid #b4768238;line-height:30px}.arrow{color:#af7787;font-size:21px}.private{margin:25px 0 0;font-size:12px;color:#a3959c;letter-spacing:.04em}.private span{margin-right:7px;color:#af7282}footer{position:relative;display:flex;justify-content:space-between;gap:20px;padding:24px 42px;color:#897c82;font-size:10px;letter-spacing:.2em}.preview{letter-spacing:.06em;color:#95858d}form{text-align:left}form[hidden]{display:none}.back{background:none;border:0;padding:0;color:#b69aa4;font-size:12px}.selected{font:32px 'Cormorant Garamond',Georgia,serif;margin:14px 0 22px}label{font-size:14px;color:#c7b4bd}.password-wrap{display:flex;align-items:center;border-bottom:1px solid #855260;background:#180e15aa;margin-top:8px}.password-wrap:focus-within{border-color:#e4a0b5}input{background:transparent;border:0;outline:0;min-width:0;width:100%;padding:14px;color:#eee;font-size:16px}input::placeholder{color:#8f7f87}.password-wrap button{border:0;background:transparent;padding:12px;color:#ba98a5}.enter{display:flex;justify-content:space-between;align-items:center;width:100%;border:1px solid #c34768;background:#8d193a;padding:14px 18px;margin-top:20px;font-size:14px}.enter:hover{background:#a12147}.feedback{font-size:13px;line-height:1.6;color:#d8adba}.feedback:empty{display:none}.still .dust i{animation-play-state:paused}.still .art,.still .haze{transform:none}
@media(min-width:1600px){main{padding-top:100px}.entrance{transform:translateY(35px)}}
@media(max-width:600px){header{padding:18px 20px}.brand{font-size:10px;gap:7px}.motion #motion-label{display:none}.art{background-position:49% center;filter:brightness(.6) saturate(.75)}main{min-height:calc(100svh - 143px);padding:36px 20px}.entrance{padding:12px 15px 24px}.entrance:before{inset:-30px -25px;background:radial-gradient(ellipse,#080609ed,#080609b0 55%,transparent 76%)}h1{font-size:72px}footer{padding:20px;font-size:9px;letter-spacing:.1em}footer>span:last-child{display:none}.preview{font-size:11px}.profile{padding:16px 18px}}
@media(prefers-reduced-motion:reduce){.art,.haze{transform:none!important}.dust{display:none}.profile{transition:none}}

/* Login typography: engraved names and an italic invitation. */
.prompt{font-family:'Cormorant Garamond',Georgia,serif;font-size:25px;font-style:italic;font-weight:500;line-height:1.3;letter-spacing:.015em;color:#ddcbd0;margin-bottom:24px}
.profile{font-family:'Cinzel',Georgia,serif;font-size:18px;font-weight:400;letter-spacing:.065em}
.initial{font-family:'Cinzel',Georgia,serif;font-size:25px}
.selected{font-family:'Cinzel',Georgia,serif;font-size:28px;letter-spacing:.035em}
@media(max-width:600px){.prompt{font-size:23px}.profile{font-size:17px}}

/* Small screens, touch targets and the on-screen keyboard. */
body{overflow-x:clip}
.back{min-height:44px;padding:8px 0}
.password-wrap button{min-width:48px;min-height:48px}
.enter{min-height:48px}
@media(max-width:380px){h1{font-size:clamp(48px,18vw,66px)}.prompt{font-size:21px}.entrance{padding-inline:4px}.profile{gap:8px;padding-inline:14px}.eyebrow{letter-spacing:.25em}footer{flex-wrap:wrap;gap:8px}}
@media(max-height:600px){main{min-height:0;padding-block:16px}.entrance{padding-top:0;transform:none}h1{font-size:58px}.rule{margin-bottom:20px}header{padding-block:14px}}

/* Text-only account switch with contrast over the artwork. */
.back{display:inline-flex;align-items:center;min-height:44px;padding:10px 0;background:transparent;border:0;color:#fff0f5;font-family:Manrope,Arial,sans-serif;font-size:14px;font-weight:600;line-height:1.4;text-shadow:0 1px 2px #000,0 0 5px #000,0 0 12px #000}
.back:hover{background:transparent;color:#ffc6da;text-decoration:underline;text-underline-offset:4px}
.back:active{background:transparent;color:#fff}

.account-settings{margin-top:24px;text-align:left;color:#e7d7df}.account-settings summary{cursor:pointer;padding:14px 0;font-size:14px}.account-settings label{display:block;margin-top:16px}.account-settings input{display:block;background:#130d13;border-bottom:1px solid #855260;margin-top:8px}.login>a.profile{margin-bottom:14px}