/* Vristo auth-boxed geometry; reuse the existing semantic Vristo bridge. */
html[data-auth-ui="vristo"] [data-vristo-auth-boxed]{font-family:Nunito,Inter,ui-sans-serif,sans-serif;min-height:100dvh;padding:40px 24px;color:var(--color-base-content)}
[data-vristo-auth-boxed] [data-auth-frame]{max-width:870px;background:linear-gradient(45deg,color-mix(in srgb,var(--color-base-100) 95%,var(--color-error)) 0%,transparent 25%,transparent 75%,color-mix(in srgb,var(--color-base-100) 95%,var(--color-error)) 100%)}
[data-vristo-auth-boxed] [data-auth-box]{display:flex;flex-direction:column;justify-content:center;min-height:758px;padding:80px 24px;background:color-mix(in srgb,var(--color-base-100) 60%,transparent);backdrop-filter:blur(16px);box-shadow:none;border:0}
[data-vristo-auth-boxed] [data-auth-corner]{top:24px;left:24px;right:24px}
[data-vristo-auth-boxed] [data-auth-form]{max-width:440px}
[data-vristo-auth-boxed] [data-auth-heading]{margin-bottom:40px}
[data-vristo-auth-boxed] [data-auth-heading] h1{font-size:36px;line-height:1.375;letter-spacing:0;margin:0}
[data-vristo-auth-boxed] [data-auth-heading] p{font-size:16px;font-weight:700;line-height:1.5;margin-top:4px;color:var(--vristo-muted)}
[data-vristo-auth-boxed] .fieldset{padding:0;gap:8px}
[data-vristo-auth-boxed] .label{color:var(--color-base-content);font-size:14px}
[data-vristo-auth-boxed] .input{background:var(--color-base-100);border-color:var(--color-base-300);height:40px;min-height:40px;gap:12px;padding:0 14px;border-radius:6px;font-size:14px;color:var(--vristo-muted)}
[data-vristo-auth-boxed] .input input{color:var(--color-base-content);font-size:14px}
[data-vristo-auth-boxed] .input:focus-within{outline:2px solid color-mix(in srgb,var(--color-primary) 25%,transparent);outline-offset:1px;border-color:var(--color-primary)}
[data-vristo-auth-boxed] [data-auth-submit]{margin-top:24px;height:40px;min-height:40px;border:0;border-radius:6px;font-weight:600;box-shadow:0 10px 20px -10px color-mix(in srgb,var(--color-primary) 44%,transparent);background:linear-gradient(90deg,var(--color-primary),var(--color-secondary))}
[data-vristo-auth-boxed] [data-auth-switch]{margin-top:40px;font-size:14px}
[data-vristo-auth-boxed] [data-auth-note]{margin-top:18px;font-size:12px;color:var(--vristo-muted)}
[data-vristo-auth-boxed] [data-auth-legal]{position:absolute;left:24px;right:24px;bottom:24px;color:var(--vristo-muted)}
html[data-auth-ui="vristo"][data-theme="graphite"] [data-vristo-auth-boxed]{background:var(--color-base-200)}
html[data-auth-ui="vristo"][data-theme="graphite"] [data-auth-box]{background:color-mix(in srgb,var(--color-base-100) 60%,transparent)}
@media(max-width:767px){[data-vristo-auth-boxed] [data-auth-heading] h1{font-size:30px}[data-vristo-auth-boxed] [data-auth-box]{min-height:0;padding:90px 24px}[data-vristo-auth-boxed] [data-auth-switch]{margin-top:30px}[data-vristo-auth-boxed] [data-auth-legal]{gap:12px}}
@media(prefers-reduced-motion:reduce){[data-vristo-auth-boxed] *{scroll-behavior:auto}}

html[data-auth-ui="vristo"] body>#top{padding:0;margin:0;max-width:none}

@media(min-width:640px){[data-vristo-auth-boxed]{padding-inline:64px}}

/* Keep the field, icons and browser-filled values on one continuous surface. */
[data-vristo-auth-boxed] .input{gap:10px;padding:0 12px;overflow:hidden;align-items:center;color:var(--color-base-content)}
[data-vristo-auth-boxed] .input>i{flex:none;width:16px;text-align:center;color:var(--vristo-muted)}
[data-vristo-auth-boxed] .input input{flex:1;min-width:0;width:0;height:100%;padding:0 2px;border:0;border-radius:0;background:transparent;outline:none;box-shadow:none;font-family:inherit}
[data-vristo-auth-boxed] .input input::placeholder{color:var(--vristo-muted);opacity:1}
[data-vristo-auth-boxed] .input input:autofill{background:var(--color-base-100);color:var(--color-base-content);box-shadow:0 0 0 1000px var(--color-base-100) inset}
[data-vristo-auth-boxed] .input input:-webkit-autofill,
[data-vristo-auth-boxed] .input input:-webkit-autofill:hover,
[data-vristo-auth-boxed] .input input:-webkit-autofill:focus{-webkit-text-fill-color:var(--color-base-content);caret-color:var(--color-base-content);-webkit-box-shadow:0 0 0 1000px var(--color-base-100) inset;box-shadow:0 0 0 1000px var(--color-base-100) inset}
[data-vristo-auth-boxed] .input .btn{flex:none;margin:0;width:28px;min-width:28px;height:28px;min-height:28px;padding:0;border:0;box-shadow:none;color:var(--color-base-content);background:transparent}
[data-vristo-auth-boxed] [data-portal-language-trigger].btn{width:48px;height:34px;min-height:34px;border:1px solid var(--color-base-300);border-radius:6px;background:var(--color-base-100);box-shadow:none}
[data-vristo-auth-boxed] [data-portal-language-trigger]::after{content:'';width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-left:2px}
[data-vristo-auth-boxed] [data-portal-language-dropdown][open] [data-portal-language-trigger]{border-color:var(--color-primary)}
[data-vristo-auth-boxed] [data-portal-language-dropdown][open] [data-portal-language-trigger]::after{transform:rotate(225deg)}
[data-vristo-auth-boxed] [data-portal-language-dropdown]>.dropdown-content{top:42px}
@media(max-width:479px){[data-vristo-auth-boxed] [data-auth-corner]{left:16px;right:16px}[data-vristo-auth-boxed] [data-auth-box]{padding-inline:16px}[data-vristo-auth-boxed] [data-auth-legal]{position:static;margin-top:36px}[data-vristo-auth-boxed] [data-auth-box]{padding-bottom:28px}}

/* Supplied Firmonaut comet pair follows the existing light/dark theme. */
html[data-auth-ui="vristo"] [data-vristo-auth-boxed]{background-image:url("/template/images/auth/auth-bg-06-komety-light.webp");background-position:center center;background-size:cover;background-repeat:no-repeat}
html[data-auth-ui="vristo"][data-theme="graphite"] [data-vristo-auth-boxed],
html[data-auth-ui="vristo"][data-portal-theme-mode="dark"] [data-vristo-auth-boxed]{background-image:url("/template/images/auth/auth-bg-06-komety-dark.webp");background-position:center center;background-size:cover;background-repeat:no-repeat}

/* J118 – living Firmonaut brand, starry sky and aurora frame on login, registration and password recovery. */
@property --auth-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
html[data-auth-ui="vristo"] [data-vristo-auth-boxed] [data-auth-sky]{position:absolute;inset:0;z-index:0;width:100%;height:100%;pointer-events:none}
[data-vristo-auth-boxed] [data-auth-frame]{z-index:1;max-width:560px;padding:1.5px;border-radius:16px;background:conic-gradient(from var(--auth-angle),transparent 0 18%,color-mix(in srgb,var(--color-primary) 70%,transparent) 30%,transparent 44% 66%,color-mix(in srgb,var(--color-secondary) 70%,transparent) 80%,transparent 94%);box-shadow:0 40px 90px -40px color-mix(in srgb,var(--color-primary) 55%,transparent);animation:auth-aurora 16s linear infinite}
[data-vristo-auth-boxed] [data-auth-box]{min-height:0;padding:68px 40px 84px;border-radius:14.5px;background:color-mix(in srgb,var(--color-base-100) 78%,transparent);backdrop-filter:blur(18px) saturate(1.2);animation:auth-rise .7s cubic-bezier(.2,.8,.2,1) both}
html[data-auth-ui="vristo"][data-theme="graphite"] [data-auth-box],
html[data-auth-ui="vristo"][data-portal-theme-mode="dark"] [data-auth-box]{background:color-mix(in srgb,var(--color-base-100) 72%,transparent)}
[data-vristo-auth-boxed] [data-auth-corner] a[data-auth-home]{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--vristo-muted);text-decoration:none;border-radius:6px;padding:6px 8px;margin-left:-8px;transition:color .2s,background-color .2s}
[data-vristo-auth-boxed] [data-auth-corner] a[data-auth-home]:hover{color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 8%,transparent)}

/* Brand hero: animated mascot in an orbit + wordmark style D (Firmo heavy, naut light). */
[data-vristo-auth-boxed] [data-auth-brand]{display:flex;flex-direction:column;align-items:center;gap:10px;width:max-content;margin:0 auto 22px;color:var(--color-base-content);text-decoration:none}
[data-vristo-auth-boxed] [data-auth-porthole]{position:relative;display:grid;place-items:center;width:122px;height:122px;border-radius:50%;background:radial-gradient(circle at 50% 46%,color-mix(in srgb,var(--color-primary) 20%,transparent) 0,color-mix(in srgb,var(--color-primary) 6%,transparent) 52%,transparent 70%)}
[data-vristo-auth-boxed] [data-auth-orbit]{position:absolute;inset:4px;border-radius:50%;border:1.5px dashed color-mix(in srgb,var(--color-primary) 38%,transparent);animation:auth-orbit 40s linear infinite}
[data-vristo-auth-boxed] [data-auth-orbit]::after{content:'';position:absolute;top:50%;left:-6px;width:11px;height:11px;margin-top:-5.5px;border-radius:50%;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));box-shadow:0 0 14px color-mix(in srgb,var(--color-primary) 70%,transparent)}
[data-vristo-auth-boxed] [data-auth-orbit="outer"]{inset:-14px;border-style:solid;border-color:color-mix(in srgb,var(--color-secondary) 16%,transparent);animation-duration:64s;animation-direction:reverse}
[data-vristo-auth-boxed] [data-auth-orbit="outer"]::after{top:auto;bottom:14%;left:auto;right:4%;width:7px;height:7px;background:var(--color-secondary);box-shadow:0 0 10px color-mix(in srgb,var(--color-secondary) 70%,transparent)}
[data-vristo-auth-boxed] [data-auth-float]{display:block;animation:auth-float 6.5s ease-in-out infinite}
html[data-brand="firmonaut"] [data-vristo-auth-boxed] [data-auth-brand] .firmonaut-mark{width:60px;height:92px;--fn-mark-scale:1.06;--fn-mark-shift:0px;--firmonaut-logo-helmet:var(--color-primary);--firmonaut-logo-orbit:var(--color-secondary);--firmonaut-logo-suit:var(--color-base-content);--firmonaut-logo-bg:var(--color-base-100);transform-origin:center 80%}
[data-vristo-auth-boxed] [data-auth-wordmark]{font-size:30px;line-height:1;letter-spacing:-.015em;white-space:nowrap}
[data-vristo-auth-boxed] [data-auth-wordmark] [data-firmonaut-wordmark="firmo"]{font-weight:900}
[data-vristo-auth-boxed] [data-auth-wordmark] [data-firmonaut-wordmark="naut"]{font-weight:300;color:var(--color-primary)}
[data-vristo-auth-boxed] [data-auth-heading]{margin-bottom:26px;text-align:center}
[data-vristo-auth-boxed] [data-auth-heading] h1{font-size:28px}
[data-vristo-auth-boxed] [data-auth-heading] p{font-weight:600}

/* Password fields: the astronaut turns away and closes the visor; "show password" lets him peek. */
html[data-brand="firmonaut"][data-firmonaut-shy] [data-auth-brand] [data-firmonaut-head]{transform:rotate(-13deg) translate(-26px,22px);transition:transform 420ms cubic-bezier(.3,1.4,.45,1)}
html[data-brand="firmonaut"][data-firmonaut-shy] [data-auth-brand] [data-firmonaut-visor]{opacity:1;scale:1 .09;transition:scale 200ms ease-out}
html[data-brand="firmonaut"][data-firmonaut-peek] [data-auth-brand] [data-firmonaut-head]{transform:rotate(7deg) translate(16px,10px) scale(1.04);transition:transform 420ms cubic-bezier(.3,1.4,.45,1)}
html[data-brand="firmonaut"][data-firmonaut-peek] [data-auth-brand] [data-firmonaut-visor]{opacity:1;scale:1.12 1.12}

/* Entrance: the card rises, the form follows line by line. */
[data-vristo-auth-boxed] [data-auth-form]>*{animation:auth-fade .55s cubic-bezier(.2,.8,.2,1) both}
[data-vristo-auth-boxed] [data-auth-form] form>*{animation:auth-fade .5s cubic-bezier(.2,.8,.2,1) both}
[data-vristo-auth-boxed] [data-auth-form] form>:nth-child(2){animation-delay:.08s}
[data-vristo-auth-boxed] [data-auth-form] form>:nth-child(3){animation-delay:.14s}
[data-vristo-auth-boxed] [data-auth-form] form>:nth-child(4){animation-delay:.2s}
[data-vristo-auth-boxed] [data-auth-form] form>:nth-child(5){animation-delay:.26s}
[data-vristo-auth-boxed] [data-auth-form] form>:nth-child(n+6){animation-delay:.32s}
[data-vristo-auth-boxed] [data-auth-submit]{position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}
[data-vristo-auth-boxed] [data-auth-submit]::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgb(255 255 255/.28) 50%,transparent 70%);transform:translateX(-100%);transition:transform .7s}
[data-vristo-auth-boxed] [data-auth-submit]:hover{transform:translateY(-1px);box-shadow:0 14px 26px -12px color-mix(in srgb,var(--color-primary) 60%,transparent)}
[data-vristo-auth-boxed] [data-auth-submit]:hover::after{transform:translateX(100%)}

@keyframes auth-aurora{to{--auth-angle:360deg}}
@keyframes auth-orbit{to{transform:rotate(360deg)}}
@keyframes auth-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes auth-rise{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
@keyframes auth-fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@media(max-width:767px){[data-vristo-auth-boxed] [data-auth-box]{padding:72px 24px 32px}[data-vristo-auth-boxed] [data-auth-heading] h1{font-size:26px}[data-vristo-auth-boxed] [data-auth-legal]{position:static;margin-top:32px}}
@media(max-width:479px){[data-vristo-auth-boxed] [data-auth-porthole]{width:112px;height:112px}html[data-brand="firmonaut"] [data-vristo-auth-boxed] [data-auth-brand] .firmonaut-mark{width:56px;height:86px}[data-vristo-auth-boxed] [data-auth-wordmark]{font-size:28px}[data-vristo-auth-boxed] [data-auth-box]{padding-inline:18px}}
@media(prefers-reduced-motion:reduce){[data-vristo-auth-boxed] :is([data-auth-frame],[data-auth-box],[data-auth-orbit],[data-auth-float],[data-auth-form]>*,[data-auth-form] form>*){animation:none!important}[data-vristo-auth-boxed] [data-auth-submit]::after{display:none}}
