:root{font-family:Arial,Helvetica,sans-serif;color:#102f26;background:#fff;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:#fff;min-height:100svh}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid #d52170;outline-offset:5px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.back-link{position:absolute;left:36px;top:28px;display:inline-flex;align-items:center;gap:12px;font-size:14px;color:#526358;padding:9px 0}.back-link:hover{color:#184b3b;text-decoration:underline;text-underline-offset:4px}.login-main{width:min(720px,calc(100% - 48px));min-height:100svh;margin:auto;padding:clamp(115px,19vh,180px) 0 70px;text-align:center}.login-brand{width:100%;margin:0 auto}.brand-logo{width:min(560px,100%);margin:0 auto}.brand-logo>span{display:block;position:relative;overflow:hidden;aspect-ratio:1505/335}.brand-logo img{position:absolute;width:132.691%;max-width:none;height:auto;left:-16.146%;top:-61.19%}.login-options{margin-top:26px}.login-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.product-login{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px;width:100%;padding:22px 24px;border:2px solid #184b3b;border-radius:9px;background:#184b3b;color:#fff;font:700 18px/1.2 Arial,Helvetica,sans-serif;text-align:left;box-shadow:0 4px 0 #102f2618;transition:background .18s,border-color .18s}.product-login>span:last-child{font-size:22px;font-weight:400}.product-login[href]:hover{background:#102f26;border-color:#102f26}.product-login:disabled{background:#f7f8f7;border-color:#e1e7e3;color:#748378;box-shadow:none;cursor:default}.product-login .unlinked-mark{color:#a9b5ad}
/* Portal boxes arrive in a short ripple, once per page load. */
.login-main.intro-running .brand-logo{animation:logo-fade .8s ease-out both}
.product-login{position:relative;--arrival-delay:.28s}
.product-login:nth-child(2){--arrival-delay:.40s}
.product-login:nth-child(3){--arrival-delay:.52s}
.product-login:nth-child(4){--arrival-delay:.64s}
.product-login:nth-child(5){--arrival-delay:.76s}
.product-login:nth-child(6){--arrival-delay:.88s}
.intro-running .product-login{animation:portal-arrive .72s var(--arrival-delay) cubic-bezier(.22,.61,.36,1) both}
.intro-running .product-login::after{content:"";position:absolute;inset:-2px;border:1px solid #d52170;border-radius:inherit;pointer-events:none;animation:portal-ripple .72s var(--arrival-delay) ease-out both}
@keyframes logo-fade{from{opacity:0}to{opacity:1}}
@keyframes portal-arrive{0%{opacity:0;transform:translateY(14px) scale(.94)}65%{opacity:1;transform:translateY(-2px) scale(1.015)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes portal-ripple{0%,25%{opacity:0;transform:scale(.98)}40%{opacity:.25}100%{opacity:0;transform:scale(1.10,1.22)}}
@media(max-width:620px){.back-link{left:24px;top:20px}.login-main{width:calc(100% - 40px);padding:118px 0 44px}.brand-logo{width:min(560px,100%)}.login-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.product-login{min-height:72px;padding:20px 14px;font-size:15px;gap:8px}.login-options{margin-top:32px}}
@media(max-width:360px){.product-login{font-size:13px;padding:18px 10px;gap:5px}.product-login>span:last-child{font-size:17px}.brand-logo{width:100%}.back-link{font-size:13px}.login-main{padding-top:106px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.intro-running .product-login::after{display:none}}

/* Keep every login tile pale pink, including products without a link. */
.product-login,.product-login:disabled{background:#f8dce7;border-color:#edbfd0;color:#102f26}
.product-login[href]:hover{background:#f3c8da;border-color:#e6adc3}
.product-login .unlinked-mark{color:inherit}

.intro-pending .brand-logo,.intro-pending .login-options{opacity:0}
@media(prefers-reduced-motion:reduce){.intro-pending .brand-logo,.intro-pending .login-options{opacity:1}}

/* A quiet frame draws once around the chooser, then stays in place. */
.login-options{position:relative}
.login-frame{position:absolute;inset:0 -48px -30px;pointer-events:none;color:#102f26;opacity:.5}
.login-frame svg{display:block;width:100%;height:100%;overflow:visible}
.login-frame path{fill:none;stroke:currentColor;stroke-width:1;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.frame-rail{position:absolute;top:50%;height:1px;background:currentColor;width:max(0px,calc((100vw - 816px)/2))}
.frame-rail-left{right:100%;transform-origin:right center}
.frame-rail-right{left:100%;transform-origin:left center}
.intro-running .login-frame path{animation:frame-draw .85s .45s ease-out both}
.intro-running .frame-rail{animation:rail-draw .55s .76s ease-out both}
@keyframes frame-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes rail-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:900px){.login-frame{inset:0 -14px -24px}.frame-rail{display:none}}
@media(max-width:620px){.login-frame{inset:0 -10px -22px}}


.login-options{margin-top:46px}
.login-frame{inset:-24px -48px -30px}
@media(max-width:900px){.login-frame{inset:-20px -14px -24px}}
@media(max-width:620px){.login-options{margin-top:38px}.login-frame{inset:-20px -10px -22px}}

/* Quiet Kinselo colour and flowing contours across the white canvas. */
:root{background:#f5eff3}
.brand-logo{mix-blend-mode:multiply}
body{position:relative;isolation:isolate;background:radial-gradient(ellipse at 50% 28%,#fffffff2 0%,#ffffffb0 18%,transparent 52%),radial-gradient(ellipse at 3% 8%,#fc7b2530,transparent 60%),radial-gradient(ellipse at 92% 15%,#d5217029,transparent 58%),radial-gradient(ellipse at 96% 94%,#69448e35,transparent 65%),radial-gradient(ellipse at 2% 100%,#184b3b26,transparent 58%),#f5eff3;background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url('/assets/login-brand-waves.svg') center/cover no-repeat;opacity:.8}
@media(max-width:620px){body::before{background-size:auto 100%;background-position:72% center}}
