/* Animated editorial authentication. Shared by login, registration and recovery. */
.auth-page.auth-editorial.auth-animated {display:flex;flex-direction:column;min-height:100dvh;background:#f8f7f2;color:#263e32;padding:0;}
.auth-animated .auth-global-header {display:flex;align-items:center;justify-content:space-between;width:100%;padding:26px clamp(24px,5vw,80px);gap:16px;}
.auth-animated .brand {display:flex;align-items:center;gap:10px;text-decoration:none;}
.auth-animated .suvi-auth-stage {width:100%;max-width:1440px;margin:auto;display:grid;grid-template-columns:1.12fr 1fr;align-items:center;flex:1;padding:18px clamp(24px,4vw,64px) 42px;gap:clamp(32px,7vw,110px);}
.auth-animated .auth-story {display:block!important;min-width:0;padding:0;background:none;border:0;border-radius:0;overflow:visible;box-shadow:none;}
.auth-animated .auth-story-content {margin:0;width:100%;max-width:620px;}
.auth-animated .auth-eyebrow {color:#728271;font:500 10px/1.5 Arial,sans-serif;letter-spacing:2.3px;margin:0 0 18px;text-align:center;}
.auth-animated .auth-story h2 {font:400 clamp(34px,3.5vw,52px)/1.1 Georgia,serif;letter-spacing:-1.8px;text-align:center;margin:0;color:#263e32;}
.auth-animated .auth-story h2 em {font-weight:400;font-style:italic;color:#5f7b61;}
.auth-animated .auth-story-description {font:400 13px/1.7 Arial,sans-serif;text-align:center;color:#788174;max-width:370px;margin:20px auto 0;}
.auth-animated .auth-entry {width:100%;min-height:0;max-width:440px;padding:0;background:none;border:0;box-shadow:none;margin:auto;}
.auth-animated .auth-form {display:flex;padding:28px 0;justify-content:center;align-items:center;}
.auth-animated .auth-card {width:100%;max-width:380px;gap:20px;animation:auth-soft-arrive .7s ease-out both;}
.auth-animated .auth-card-mark {width:48px;height:48px;border-radius:14px;background:#e9eee3;margin:0 auto 2px;}
.auth-animated .auth-card-mark .ic {width:31px;height:31px;}
.auth-animated .auth-card h1 {font:400 36px/1.13 Georgia,serif;letter-spacing:-1.1px;}
.auth-animated .auth-card .sub {font-size:13px;margin:-5px 0 6px;}
.auth-animated .auth-card form {gap:16px!important;}
.auth-animated .input {background:#fffefa;min-height:47px;}
.auth-animated .btn.outline {background:#fffefa;}
.auth-animated .auth-global-footer {display:flex;justify-content:space-between;gap:16px;padding:20px clamp(24px,5vw,80px);font:400 11px/1.5 Arial,sans-serif;color:#85897c;}
.suvi-scene {position:relative;width:100%;max-width:600px;margin:6px auto 0;}
.suvi-scene-art {display:block;width:100%;height:auto;overflow:visible;}
.scene-caption {display:flex;align-items:center;justify-content:center;gap:8px;font:400 11px/1.5 Arial,sans-serif;color:#7b8575;margin-top:-8px;}
.scene-status-dot {width:5px;height:5px;border-radius:50%;background:#719a76;animation:scene-breathe 3s ease-in-out infinite;}
.scene-paper {transform-box:fill-box;transform-origin:center;}
.scene-paper-back {animation:scene-paper-drift 7s ease-in-out infinite;}
.scene-paper-front {animation:scene-paper-drift 6s ease-in-out -3s infinite;}
.scene-mascot {transform-box:fill-box;transform-origin:center bottom;animation:scene-bob 4.5s ease-in-out infinite;}
.scene-eyes {transform-box:fill-box;transform-origin:center;animation:scene-blink 5.5s infinite;}
.scene-sun {transform-box:fill-box;transform-origin:center;animation:scene-sun-turn 70s linear infinite;}
.scene-leaf-left,.scene-leaf-right {transform-box:fill-box;transform-origin:center bottom;animation:scene-sway 6s ease-in-out infinite;}
.scene-leaf-right {animation-delay:-3s;}
.scene-spark {transform-box:fill-box;transform-origin:center;animation:scene-twinkle 4s ease-in-out infinite;}
.scene-spark-two {animation-delay:-2s;}
.scene-pencil {transform-box:fill-box;transform-origin:center;animation:scene-pencil-float 8s ease-in-out infinite;}
@keyframes auth-soft-arrive {from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes scene-paper-drift {0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-9px) rotate(1deg)}}
@keyframes scene-bob {0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}
@keyframes scene-blink {0%,43%,47%,100%{transform:scaleY(1)}45%{transform:scaleY(.08)}}
@keyframes scene-sun-turn {to{transform:rotate(360deg)}}
@keyframes scene-sway {0%,100%{transform:rotate(-2deg)}50%{transform:rotate(3deg)}}
@keyframes scene-twinkle {0%,100%{opacity:.45;transform:scale(.85)}50%{opacity:1;transform:scale(1.08)}}
@keyframes scene-pencil-float {0%,100%{transform:translate(0,0) rotate(-5deg)}50%{transform:translate(5px,-10px) rotate(5deg)}}
@keyframes scene-breathe {0%,100%{opacity:.4}50%{opacity:1}}
@media(min-width:1100px) {.auth-animated .auth-story {border-right:1px solid #e4e6db;padding-right:40px;}}
@media(max-width:900px) {
 .auth-animated .auth-global-header {padding:20px 24px;}
 .auth-animated .suvi-auth-stage {grid-template-columns:1fr;gap:22px;padding:18px 24px 24px;max-width:620px;}
 .auth-animated .auth-story {display:block!important;}
 .auth-animated .auth-eyebrow {font-size:9px;margin-bottom:12px;letter-spacing:2px;}
 .auth-animated .auth-story h2 {font-size:34px;letter-spacing:-1.2px;}
 .auth-animated .auth-story-description {font-size:12px;margin-top:13px;max-width:290px;}
 .auth-animated .suvi-scene {max-width:360px;margin-top:0;}
 .auth-animated .scene-caption {font-size:10px;margin-top:-9px;}
 .auth-animated .auth-entry {max-width:400px;min-height:0;padding:0;}
 .auth-animated .auth-form {padding:12px 0 10px;}
 .auth-animated .auth-card {max-width:380px;gap:19px;}
 .auth-animated .auth-card-mark {display:none;}
 .auth-animated .auth-card h1 {font-size:30px;}
 .auth-animated .auth-card .sub {font-size:13px;}
 .auth-animated .input {font-size:16px;}
 .auth-animated .auth-global-footer {padding:24px;justify-content:center;flex-wrap:wrap;font-size:10px;}
}
@media(max-width:400px) {
 .auth-animated .auth-global-header {padding:18px;gap:8px;}
 .auth-animated .brand-name {font-size:22px;}
 .auth-animated .brand img {width:30px;height:30px;}
 .auth-animated .auth-switch a {padding:7px 11px;font-size:12px;}
 .auth-animated .suvi-auth-stage {padding:12px 22px 24px;gap:18px;}
 .auth-animated .auth-story h2 {font-size:29px;}
 .auth-animated .suvi-scene {max-width:290px;}
 .auth-animated .auth-story-description {display:none;}
}
@media(prefers-reduced-motion:reduce) {.auth-animated *,.auth-animated *::before,.auth-animated *::after {animation:none!important;transition:none!important;}}

.auth-animated .auth-story {min-height:0;height:auto;isolation:auto;}
.auth-animated .auth-story::before,.auth-animated .auth-story::after {display:none;}
.auth-animated .suvi-auth-stage {position:relative;inset:auto;min-height:0;flex:1 0 auto;}

/* Permanent geometric brand mark. */
.auth-animated .auth-card-mark {background:transparent;border-radius:0;color:#123f3b;}
.auth-animated .brand img {width:38px;height:38px;}
.auth-animated .brand-name {font-weight:700;letter-spacing:-.9px;}
