/* Fahm sign-in: a homepage-themed skin and animation layer over the app's existing auth screens
   (login, sign-up, forgot password, …). The app keeps rendering and handling the form; this file only
   restyles it. Every rule is scoped to html.fl, which login.js sets while an auth screen is mounted,
   so nothing here can reach the rest of the app, and without the script the old design simply stays. */

@property --fl-a { syntax: '<angle>'; inherits: false; initial-value: 0deg; }

html.fl{
  --fl-gold:#e8c36a; --fl-gold-hi:#f8e2a0; --fl-gold-lo:#b8862f;
  --fl-ivory:#f3ead6; --fl-ivory-2:rgba(243,234,214,.78); --fl-ivory-3:rgba(243,234,214,.54);
  --fl-line:rgba(232,195,106,.32); --fl-line-soft:rgba(232,195,106,.16);
  --fl-ease:cubic-bezier(.22,.8,.2,1);
  --fl-display:'Cormorant Garamond','Amiri','Iowan Old Style',Georgia,serif;
  --fl-ui:'Manrope','Noto Naskh Arabic',system-ui,-apple-system,'Segoe UI',sans-serif;
  --fl-ar:'Aref Ruqaa','Amiri','Geeza Pro',serif;
  background:#06140f!important;
}
html.fl body{background:#06140f!important}
html.fl #root{position:relative;z-index:1}

/* ---------- the scene behind the form (built by login.js, outside the app's root) ---------- */
#fl-scene{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#06140f;opacity:0;visibility:hidden;transition:opacity .9s ease,visibility 0s .9s}
html.fl #fl-scene{opacity:1;visibility:visible;transition:opacity .9s ease}
.fl-film{position:absolute;left:-3%;top:-3%;width:106%;height:106%;display:block;background:#06140f url(/home-v2/scenes/about/wide/0001.jpg) center/cover no-repeat;will-change:transform}
@media (max-aspect-ratio:4/5){.fl-film{background-image:url(/home-v2/scenes/about/tall/0001.jpg)}}
.fl-wash{position:absolute;inset:0;background:#0d4630;mix-blend-mode:soft-light;opacity:.5}
.fl-rays{position:absolute;left:50%;top:0;width:min(60vw,820px);height:100%;transform:translateX(-50%);opacity:var(--fl-glow,.4);
  background:radial-gradient(ellipse 34% 58% at 50% 46%,rgba(255,216,146,.3),rgba(255,216,146,.08) 55%,transparent 75%);animation:fl-breathe 5.5s ease-in-out infinite alternate}
.fl-tint{position:absolute;inset:0;transition:opacity .7s ease;background:
  radial-gradient(70% 80% at 50% 46%,transparent 0,rgba(4,11,8,.2) 55%,rgba(4,11,8,.78) 100%),
  linear-gradient(90deg,rgba(4,12,9,.93) 0%,rgba(4,12,9,.66) 27%,rgba(4,12,9,.08) 45%,rgba(4,12,9,.1) 55%,rgba(4,12,9,.7) 73%,rgba(4,12,9,.92) 100%),
  linear-gradient(180deg,rgba(4,12,9,.6),transparent 26%,transparent 72%,rgba(4,12,9,.78))}
.fl-dust{position:absolute;inset:0;width:100%;height:100%;display:block}
.fl-frond{position:absolute;width:min(40vw,560px);aspect-ratio:1;transition:opacity .7s ease}
.fl-frond-l{left:-17%;top:-27%;opacity:.8}
.fl-frond-r{right:-13%;top:-23%;transform:scaleX(-1)}
.fl-frond svg{width:100%;height:100%;overflow:visible}
.fl-frond .frond{transform-box:fill-box;transform-origin:0 0;animation:fl-sway var(--sd,9s) ease-in-out infinite alternate;animation-delay:var(--sdl,0s)}
.fl-welcome{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;opacity:0;padding:0 24px}
.fl-welcome b{display:block;font-family:var(--fl-ar);font-weight:700;font-size:clamp(54px,8vw,120px);line-height:1.3;color:#fff3cf;text-shadow:0 4px 40px rgba(20,10,0,.75),0 0 60px rgba(232,195,106,.5)}
.fl-welcome span{display:block;margin-top:6px;font-family:var(--fl-display);font-style:italic;font-size:clamp(20px,2.4vw,32px);color:#fff;text-shadow:0 2px 24px rgba(20,10,0,.9)}
@keyframes fl-breathe{from{filter:brightness(.82)}to{filter:brightness(1.18)}}
@keyframes fl-sway{from{transform:rotate(calc(var(--r0,0deg) - 2.5deg))}to{transform:rotate(calc(var(--r0,0deg) + 2.5deg))}}

/* signing in: the camera goes through the doors, then the scene lifts to reveal the app */
html.fl-enter #root{opacity:0;pointer-events:none;transition:opacity .35s ease}
html.fl-enter .fl-tint,html.fl-enter .fl-frond,html.fl-enter .fl-wash{opacity:0}
html.fl-enter .fl-welcome{animation:fl-welcome 1.5s var(--fl-ease) .45s both}
html.fl-enter-out #fl-scene{opacity:0;transition:opacity .7s ease}
html.fl-enter-out #root{opacity:1;pointer-events:auto;transition:opacity .7s ease}
@keyframes fl-welcome{0%{opacity:0;transform:translateY(-38%) scale(.94)}45%,100%{opacity:1;transform:translateY(-50%) scale(1)}}

/* ---------- layout ---------- */
html.fl .auth-layout{
  --page:transparent; --paper:rgba(3,10,7,.55); --ink:#f3ead6; --green:#e8c36a; --muted:rgba(243,234,214,.6); --line:rgba(232,195,106,.28); --soft-green:rgba(232,195,106,.1);
  display:grid!important;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)!important;min-height:100svh;overflow-x:clip;
  background:transparent!important;color:var(--fl-ivory)!important;font-family:var(--fl-ui)!important;color-scheme:dark!important;-webkit-font-smoothing:antialiased}
html.fl .auth-layout a{color:var(--fl-gold-hi)}
html.fl .auth-layout ::selection{background:rgba(232,195,106,.35);color:#fff}

/* ---------- left: the words over the scene ---------- */
html.fl .auth-art{background:transparent!important;isolation:auto!important;overflow:visible!important;min-height:0!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;
  padding:clamp(26px,4.4vh,46px) clamp(26px,5vw,78px) clamp(26px,4.6vh,48px)!important;color:var(--fl-ivory)!important}
html.fl .auth-art::before,html.fl .auth-art::after,html.fl .auth-art>svg,html.fl .auth-art>.app-neon-canopy,html.fl .auth-art [class*="neon-"]{display:none!important}
html.fl .auth-art>.logo{align-self:flex-start;display:block;animation:fl-rise 1s var(--fl-ease) .1s backwards}
html.fl .auth-art>.logo img{display:block;height:clamp(52px,7.4vh,78px)!important;width:auto!important;max-width:none!important;filter:drop-shadow(0 2px 16px rgba(232,195,106,.32))!important}
html.fl .auth-hero-copy{max-width:min(580px,40vw)!important;margin:0!important;padding:0!important;text-align:left}
html.fl .auth-hero-copy{position:relative}
html.fl .auth-hero-copy::before{content:"";position:absolute;z-index:-1;left:-30%;right:-22%;top:-34%;bottom:-34%;pointer-events:none;background:radial-gradient(50% 50% at 46% 50%,rgba(3,10,7,.78),rgba(3,10,7,.45) 55%,transparent 100%)}
html.fl .auth-art .eyebrow{display:flex!important;align-items:center;gap:12px;margin:0 0 20px!important;font:600 11.5px/1 var(--fl-ui)!important;letter-spacing:.26em!important;text-transform:uppercase;color:var(--fl-gold)!important;animation:fl-rise .9s var(--fl-ease) .3s backwards}
html.fl .auth-art .eyebrow::before{content:"";flex:none;width:44px;height:1px;background:linear-gradient(90deg,transparent,var(--fl-gold))}
html.fl .auth-art h1{font-family:var(--fl-display)!important;font-weight:500!important;font-size:clamp(40px,4.5vw,74px)!important;line-height:1.03!important;letter-spacing:-.01em!important;color:var(--fl-ivory)!important;margin:0 0 20px!important;text-shadow:0 4px 30px rgba(0,0,0,.65)}
html.fl .auth-art h1 br{display:inline!important}
html.fl .auth-art h1 em{display:block!important;font-style:italic!important;font-weight:500!important;padding:.04em .14em .14em 0;color:var(--fl-gold-hi)!important;text-shadow:none;
  background:linear-gradient(100deg,var(--fl-gold-lo) 0%,var(--fl-gold-hi) 40%,#fff3c9 50%,var(--fl-gold-hi) 60%,var(--fl-gold) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:fl-sheen 7s ease-in-out 2.2s infinite}
html.fl .auth-art p{display:block!important;margin:0!important;color:var(--fl-ivory-2)!important;font:400 clamp(15px,1.25vw,17.5px)/1.75 var(--fl-ui)!important;text-shadow:0 2px 18px rgba(0,0,0,.85);animation:fl-rise .9s var(--fl-ease) 1.25s backwards}
html.fl .auth-art-footer{display:flex!important;align-items:flex-end!important;gap:12px;margin:0!important;padding:0!important;border:0!important;color:var(--fl-ivory-3)!important;font:500 11.5px/1.6 var(--fl-ui)!important;letter-spacing:.2em;text-transform:uppercase;max-width:min(580px,40vw);animation:fl-rise .9s var(--fl-ease) 1.45s backwards}
html.fl .auth-art-footer svg{color:var(--fl-gold);flex:none;margin-bottom:1px}
html.fl .auth-art-footer>span:last-child{margin-left:auto!important;font-family:var(--fl-ar)!important;font-size:clamp(44px,4.6vw,74px)!important;line-height:.9!important;letter-spacing:0!important;text-transform:none;opacity:1!important;
  background:linear-gradient(180deg,#fff2c6 10%,#e8c36a 55%,#a8761f 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 22px rgba(232,195,106,.35))}

/* letters float in (login.js splits the headings; untouched text simply shows) */
html.fl .fl-chars .w{display:inline-block;white-space:nowrap}
html.fl .fl-chars .ch{display:inline-block;animation:fl-ch 1s var(--fl-ease) backwards;animation-delay:calc(var(--fl-base,.45s) + var(--d,0) * 22ms)}
html.fl .auth-form-container h2.fl-chars{--fl-base:.75s}
@keyframes fl-ch{from{opacity:0;transform:translate3d(0,.55em,0) rotate(5deg)}}
@keyframes fl-rise{from{opacity:0;transform:translate3d(0,22px,0)}}
@keyframes fl-sheen{0%,100%{background-position:100% 0}50%{background-position:0 0}}

/* ---------- right: the form card ---------- */
html.fl .auth-form-panel{background:transparent!important;display:flex!important;flex-direction:column!important;min-height:100svh;padding:clamp(18px,3vh,30px) clamp(20px,4.4vw,70px)!important;position:relative;perspective:1400px}
html.fl .auth-form-panel>.back-link{align-self:flex-start;display:inline-flex!important;align-items:center;gap:8px;margin:0!important;padding:9px 16px 9px 12px!important;border-radius:999px;border:1px solid var(--fl-line-soft);background:rgba(4,12,9,.45);
  color:var(--fl-ivory-2)!important;font:500 13px/1 var(--fl-ui)!important;text-decoration:none!important;transition:color .3s,border-color .3s,background .3s;animation:fl-rise .8s var(--fl-ease) .2s backwards}
html.fl .auth-form-panel>.back-link svg{transition:transform .4s var(--fl-ease)}
html.fl .auth-form-panel>.back-link:hover{color:var(--fl-gold-hi)!important;border-color:var(--fl-line)}
html.fl .auth-form-panel>.back-link:hover svg{transform:translateX(-4px)}

html.fl .auth-form-container{position:relative;width:min(100%,472px)!important;max-width:none!important;margin:18px auto!important;padding:clamp(28px,3.2vw,44px) clamp(24px,3vw,42px)!important;border-radius:28px;text-align:left;
  background:linear-gradient(168deg,rgba(17,56,40,.84),rgba(5,17,12,.9));border:1px solid var(--fl-line);
  box-shadow:0 44px 90px -42px rgba(0,0,0,.95),0 0 0 1px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.07);
  -webkit-backdrop-filter:blur(18px) saturate(1.25);backdrop-filter:blur(18px) saturate(1.25);
  transform:rotateX(var(--fl-rx,0deg)) rotateY(var(--fl-ry,0deg));transition:transform .5s var(--fl-ease);
  animation:fl-card-in 1.15s var(--fl-ease) .28s backwards}
html.fl .auth-form-container:has(.notice-error){animation:fl-card-in 1.15s var(--fl-ease) .28s backwards,fl-shake .55s cubic-bezier(.36,.07,.19,.97)}
/* a point of gold light travels round the card's edge */
html.fl .auth-form-container::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:conic-gradient(from var(--fl-a),transparent 0 70%,rgba(248,226,160,.95) 86%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:fl-orbit 7s linear infinite}
/* inner hairline and a soft sheen that follows the pointer */
html.fl .auth-form-container::after{content:"";position:absolute;inset:9px;border-radius:20px;border:1px solid var(--fl-line-soft);pointer-events:none;
  background:radial-gradient(440px circle at var(--fl-mx,50%) var(--fl-my,-10%),rgba(248,226,160,.1),transparent 60%)}
@keyframes fl-orbit{to{--fl-a:360deg}}
@keyframes fl-card-in{from{opacity:0;transform:translate3d(0,46px,0) rotateX(9deg) scale(.97)}}
@keyframes fl-shake{10%,90%{translate:-2px 0}20%,80%{translate:4px 0}30%,50%,70%{translate:-7px 0}40%,60%{translate:7px 0}}

html.fl .auth-form-container>*,html.fl .auth-form-container form>*{animation:fl-rise .8s var(--fl-ease) backwards;animation-delay:calc(.62s + var(--fl-i,0) * 75ms)}
html.fl .auth-form-container>:nth-child(2){--fl-i:1}html.fl .auth-form-container>:nth-child(3){--fl-i:2}
html.fl .auth-form-container form{--fl-i:0;animation:none!important;margin:22px 0 0!important}
html.fl .auth-form-container form>:nth-child(1){--fl-i:3}html.fl .auth-form-container form>:nth-child(2){--fl-i:4}html.fl .auth-form-container form>:nth-child(3){--fl-i:5}
html.fl .auth-form-container form>:nth-child(4){--fl-i:6}html.fl .auth-form-container form>:nth-child(n+5){--fl-i:7}
html.fl .auth-form-container>.auth-switch{--fl-i:8}html.fl .auth-form-container>.auth-switch~.auth-switch{--fl-i:9}

html.fl .auth-icon{position:relative;display:grid!important;place-items:center;width:58px!important;height:58px!important;margin:0 0 20px!important;border-radius:50%!important;color:var(--fl-gold-hi)!important;
  background:radial-gradient(circle at 50% 32%,rgba(232,195,106,.24),rgba(232,195,106,.04))!important;border:1px solid var(--fl-line)!important;box-shadow:0 0 0 rgba(232,195,106,0);transition:box-shadow .8s ease,background .8s ease}
html.fl .auth-icon::before{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px dashed rgba(232,195,106,.5);animation:fl-spin 24s linear infinite}
html.fl .auth-icon svg{color:inherit;stroke:currentColor}
html.fl .auth-form-container:has(form:valid) .auth-icon{box-shadow:0 0 38px rgba(232,195,106,.5);background:radial-gradient(circle at 50% 32%,rgba(248,226,160,.42),rgba(232,195,106,.1))!important}
html.fl .auth-form-container:has(form:valid) .auth-icon::before{animation-duration:6s;border-color:var(--fl-gold-hi)}
@keyframes fl-spin{to{transform:rotate(360deg)}}

html.fl .auth-form-container h2{font-family:var(--fl-display)!important;font-weight:500!important;font-size:clamp(34px,3.1vw,46px)!important;line-height:1.06!important;letter-spacing:-.01em!important;color:var(--fl-ivory)!important;margin:0 0 8px!important}
html.fl .auth-form-container>p{margin:0!important;color:var(--fl-ivory-2)!important;font:400 15.5px/1.6 var(--fl-ui)!important}

html.fl .auth-form-container .field{position:relative;display:flex!important;flex-direction:column;gap:9px!important;margin:0 0 18px!important;color:var(--fl-ivory)!important}
html.fl .auth-form-container .field>span{font:600 11px/1.2 var(--fl-ui)!important;letter-spacing:.2em!important;text-transform:uppercase;color:var(--fl-gold)!important;transition:color .3s}
html.fl .auth-form-container .field:focus-within>span{color:var(--fl-gold-hi)!important}
html.fl .auth-form-container .field small{color:var(--fl-ivory-3)!important;font-size:12px}
html.fl .auth-form-container .field input{box-sizing:border-box;width:100%;height:54px!important;min-height:0!important;margin:0!important;padding:0 16px!important;border-radius:14px!important;border:1px solid var(--fl-line-soft)!important;
  background:rgba(3,10,7,.58)!important;color:var(--fl-ivory)!important;font:500 16px/1.2 var(--fl-ui)!important;caret-color:var(--fl-gold-hi);outline:none!important;box-shadow:none!important;transition:border-color .35s,box-shadow .35s,background .35s}
html.fl .auth-form-container .field input::placeholder{color:rgba(243,234,214,.34)!important}
html.fl .auth-form-container .field>input:hover,html.fl .password-input:hover{border-color:var(--fl-line)!important}
html.fl .auth-form-container .field>input:focus,html.fl .password-input:focus-within{border-color:var(--fl-gold)!important;background:rgba(3,10,7,.78)!important;box-shadow:0 0 0 4px rgba(232,195,106,.13),0 0 34px -8px rgba(232,195,106,.5)!important}
html.fl .password-input{position:relative;display:flex!important;align-items:center;box-sizing:border-box;height:54px;padding:0!important;border-radius:14px!important;border:1px solid var(--fl-line-soft)!important;background:rgba(3,10,7,.58)!important;overflow:hidden;transition:border-color .35s,box-shadow .35s,background .35s}
html.fl .auth-form-container .field .password-input>input,html.fl .auth-form-container .field .password-input>input:focus{flex:1;min-width:0;height:100%!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
html.fl .password-input .icon-button{position:static!important;flex:none;display:grid!important;place-items:center;width:50px!important;height:100%!important;margin:0!important;padding:0!important;transform:none!important;border:0!important;border-radius:0!important;background:none!important;color:var(--fl-ivory-3)!important;cursor:pointer;transition:color .3s}
html.fl .password-input .icon-button:hover{color:var(--fl-gold-hi)!important}
html.fl .auth-form-container input:-webkit-autofill,html.fl .auth-form-container input:-webkit-autofill:focus{-webkit-text-fill-color:#f3ead6!important;-webkit-box-shadow:0 0 0 1000px #07160f inset!important;caret-color:#f8e2a0;transition:background-color 9999s}
/* a gold line draws under the field you are in */
html.fl .auth-form-container .field::after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:1.5px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--fl-gold-hi),transparent);transform:scaleX(0);transition:transform .7s var(--fl-ease);pointer-events:none}
html.fl .auth-form-container .field:focus-within::after{transform:scaleX(1)}

html.fl .forgot-row{display:flex!important;align-items:center;justify-content:space-between;gap:12px;margin:-4px 0 22px!important;color:var(--fl-ivory-3)!important;font:500 12.5px/1.4 var(--fl-ui)!important}
html.fl .forgot-row>span{display:inline-flex;align-items:center;gap:6px;color:var(--fl-ivory-3)!important}
html.fl .forgot-row a,html.fl .auth-switch a,html.fl .form-disclosure a{color:var(--fl-gold-hi)!important;font-weight:600;text-decoration:none!important;background:linear-gradient(var(--fl-gold-hi),var(--fl-gold-hi)) 0 100%/0 1px no-repeat;transition:background-size .45s var(--fl-ease);padding-bottom:2px}
html.fl .forgot-row a:hover,html.fl .auth-switch a:hover,html.fl .form-disclosure a:hover{background-size:100% 1px}

html.fl .auth-form-container .button{position:relative;overflow:hidden;display:inline-flex!important;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px!important;margin:0!important;padding:0 26px!important;border:0!important;border-radius:999px!important;cursor:pointer;
  color:#1d1505!important;font:700 15px/1 var(--fl-ui)!important;letter-spacing:.02em;
  background:linear-gradient(180deg,#f9e3a3 0%,#e8c36a 45%,#c99a3e 100%)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 -2px 0 rgba(120,80,20,.35) inset,0 14px 34px -10px rgba(232,195,106,.6)!important;
  transition:transform .4s var(--fl-ease),box-shadow .4s,filter .3s}
html.fl .auth-form-container .button::before{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-20deg);animation:fl-shimmer 5s var(--fl-ease) 2.4s infinite}
html.fl .auth-form-container .button svg{color:inherit;stroke:currentColor;transition:transform .4s var(--fl-ease)}
html.fl .auth-form-container .button:hover{transform:translateY(-2px);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 -2px 0 rgba(120,80,20,.35) inset,0 20px 44px -10px rgba(232,195,106,.8)!important}
html.fl .auth-form-container .button:hover svg{transform:translateX(5px)}
html.fl .auth-form-container .button:active{transform:translateY(0) scale(.985)}
html.fl .auth-form-container .button:disabled{cursor:progress;filter:saturate(.7) brightness(.92)}
html.fl .auth-form-container .button:disabled svg{transform:none}
html.fl .auth-form-container .button.button-secondary{background:rgba(4,12,9,.4)!important;color:var(--fl-gold-hi)!important;border:1px solid var(--fl-line)!important;box-shadow:none!important}
html.fl .auth-form-container .button.button-secondary::before{display:none}
@keyframes fl-shimmer{0%,62%{left:-60%}100%{left:135%}}

html.fl .auth-switch{margin:18px 0 0!important;padding:0!important;border:0!important;text-align:center;color:var(--fl-ivory-3)!important;font:500 13.5px/1.5 var(--fl-ui)!important}
html.fl .auth-switch+.auth-switch{margin-top:10px!important}
html.fl .form-disclosure{color:var(--fl-ivory-3)!important;font:400 12.5px/1.65 var(--fl-ui)!important;margin:0 0 18px!important}
html.fl .auth-form-container .notice{display:flex!important;align-items:flex-start;gap:10px;margin:18px 0 0!important;padding:13px 15px!important;border-radius:14px!important;border:1px solid var(--fl-line-soft);background:rgba(232,195,106,.08)!important;color:var(--fl-ivory-2)!important;font:500 13px/1.6 var(--fl-ui)!important;animation:fl-pop .5s var(--fl-ease) backwards!important}
html.fl .auth-form-container .notice svg{flex:none;margin-top:2px;color:var(--fl-gold-hi)}
html.fl .auth-form-container .notice-error{border-color:rgba(255,150,130,.45);background:rgba(160,44,34,.2)!important;color:#ffdcd3!important}
html.fl .auth-form-container .notice-error svg{color:#ffb4a4}
html.fl .auth-form-container .notice-success{border-color:rgba(160,220,170,.4);background:rgba(40,120,70,.2)!important;color:#dff5e3!important}
html.fl .auth-form-container .notice-success svg{color:#a9e3b6}
@keyframes fl-pop{from{opacity:0;transform:translate3d(0,-8px,0) scale(.97)}}

html.fl .auth-bottom{position:static!important;display:flex!important;justify-content:center;gap:22px;margin:0!important;padding:0!important;border:0!important;animation:fl-rise .8s var(--fl-ease) 1.5s backwards}
html.fl .auth-bottom a{color:var(--fl-ivory-3)!important;font:500 12.5px/1 var(--fl-ui)!important;text-decoration:none!important;transition:color .3s}
html.fl .auth-bottom a:hover{color:var(--fl-gold-hi)!important}
html.fl .auth-layout :focus-visible{outline:2px solid var(--fl-gold-hi);outline-offset:3px}
html.fl .auth-form-container .field input:focus-visible{outline:none}

/* ---------- stacked layout: tablets and phones ---------- */
@media (max-width:960px){
  html.fl .auth-layout{display:block!important;min-height:100svh}
  html.fl .auth-art{min-height:clamp(250px,39svh,360px)!important;padding:18px 22px 22px!important}
  html.fl .auth-art>.logo img{height:50px!important}
  html.fl .auth-hero-copy{max-width:none!important}
  html.fl .auth-hero-copy::before{left:-22px;right:-22px;top:-18%;bottom:-22%;background:radial-gradient(62% 62% at 42% 56%,rgba(3,10,7,.72),rgba(3,10,7,.3) 60%,transparent 100%)}
  html.fl .auth-art .eyebrow{margin-bottom:12px!important;font-size:10.5px!important;letter-spacing:.2em!important}
  html.fl .auth-art .eyebrow::before{width:28px}
  html.fl .auth-art h1{font-size:clamp(32px,8.8vw,48px)!important;margin:0!important}
  html.fl .auth-art p,html.fl .auth-art-footer{display:none!important}
  html.fl .auth-form-panel{min-height:0;padding:0 12px 22px!important;perspective:none}
  html.fl .auth-form-panel>.back-link{margin:0 0 12px 4px!important;background:rgba(4,12,9,.7)}
  html.fl .auth-form-container{margin:0 auto 22px!important;padding:26px 20px 28px!important;border-radius:24px;transform:none;
    -webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(168deg,rgba(15,50,36,.95),rgba(5,17,12,.97))}
  html.fl .auth-form-container::after{inset:7px;border-radius:18px;background:none}
  html.fl .auth-form-container h2{font-size:34px!important}
  .fl-tint{background:
    linear-gradient(180deg,rgba(4,12,9,.82) 0%,rgba(4,12,9,.3) 20%,rgba(4,12,9,.18) 34%,rgba(4,12,9,.82) 62%,rgba(4,12,9,.94) 100%),
    radial-gradient(90% 60% at 50% 30%,transparent 30%,rgba(4,11,8,.55) 100%)}
  .fl-frond{width:74vw}.fl-frond-l{left:-30%;top:-13%}.fl-frond-r{right:-34%;top:-17%}
  .fl-rays{width:100vw;background:radial-gradient(ellipse 40% 34% at 50% 26%,rgba(255,216,146,.3),transparent 75%)}
}
/* phones and touch screens: skip the full-screen blend layer (expensive in WebKit) */
@media (pointer:coarse),(max-width:760px){
  .fl-wash{display:none}
  .fl-rays{animation:none}
  html.fl .auth-form-container{-webkit-backdrop-filter:none;backdrop-filter:none;transform:none}
}
@media (max-width:420px){html.fl .auth-bottom{gap:16px}html.fl .forgot-row{font-size:12px!important}}

/* ---------- reduced motion: everything in place, nothing moving ---------- */
@media (prefers-reduced-motion:reduce){
  html.fl .auth-layout,html.fl .auth-layout *,html.fl .auth-layout *::before,html.fl .auth-layout *::after,#fl-scene,#fl-scene *{animation:none!important;transition:none!important}
  html.fl .auth-form-container{transform:none}
}