/* Compact Kyriant artwork within UnfoldKin's existing brand column. */
body:has(.auth-layout) { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
/* Both columns extend through the entire page, including tall invitation forms. */
html:has(.auth-layout),body:has(.auth-layout) { background:#f1f5f4; }
.auth-layout { background:linear-gradient(90deg,#395a65 0 max(350px,42%),#f1f5f4 max(350px,42%) 100%); }
.auth-layout .access { padding:32px clamp(24px,4vw,64px); align-items:start; }
.access-content { width:min(100%,560px); min-width:0; }
.access-content>.language-choice { justify-content:flex-end; margin:0 0 24px; }
.access-content>.language-choice select { background:var(--paper); border-radius:5px; }
.access .access-card { width:100%; margin:0; padding:32px; border-radius:8px; box-shadow:none; }
.access-card .tabs { gap:0; margin-bottom:26px; }
.access-card .tabs button { flex:1; min-height:44px; font-size:14px; }
.access-card h2 { font-size:26px; font-weight:650; line-height:1.2; }
.access-card input { border-radius:5px; }
.access-card .primary { border-radius:5px; min-height:48px; }
.access-card .access-help { margin-top:20px; padding-top:12px; }
.access-footer { padding:0 4px; }
.access-footer .footnote { margin:16px 0 0; padding:0; border:0; line-height:1.6; }
.access-footer .auth-guides { margin-top:18px; gap:8px 18px; align-items:center; }
.access-footer .auth-guides strong { width:auto; }
.access-footer .auth-guides a { display:inline-flex; align-items:center; min-height:36px; }
.access-footer .footnote a { overflow-wrap:anywhere; }

.auth-layout .story,.auth-layout .access { background:transparent!important; }
.auth-layout h1,.auth-layout h2,.auth-layout .brand strong,.auth-layout .mobile-brand { font-family:inherit; }
.auth-layout .story { display:grid; grid-template-rows:auto auto minmax(150px,1fr) auto; gap:18px; padding:32px clamp(24px,4vw,64px); position:sticky; top:0; height:100svh; }
.story .brand { height:37px; min-height:37px; }
.story .eyebrow,.story .story-foot { color:#dce9e6; }
.story .story-content { margin:0; padding:0; }
.story h1 { margin:0 0 15px; font-size:clamp(32px,3.1vw,48px); font-weight:650; line-height:1.1; letter-spacing:-1.3px; }
.story .eyebrow { margin:0 0 10px; font-size:11px; line-height:1.55; font-weight:700; }
.story .story-content>p:not(.eyebrow) { margin:0 0 17px; max-width:430px; color:#edf4f1; font-size:17px; line-height:1.55; }
.story .story-content>p.story-next { margin:20px 0 17px; padding-top:16px; border-top:1px solid #dce9e650; font-size:17px; }
.story .story-foot { min-height:37.1875px; margin:0 0 12px; font-size:12px; line-height:1.55; }
.story .kyriant-login-art { height:100%; min-height:150px; max-width:none; margin:0; background:transparent; border-radius:0; }
.story .venture-story-surface { inset:0 0 46px; }
.story .venture-story-poster { mix-blend-mode:screen; }
.story .kyriant-login-art canvas,.story .venture-story-poster { filter:brightness(1.6); }
.story .venture-story-controls { inset:auto 0 0; min-height:44px; justify-content:flex-start; gap:16px; border:0; }
.story .kyriant-login-art button { font-family:inherit; font-size:13px; padding:8px 3px; color:#f9fbfa; }
.story .kyriant-login-art button:hover { text-decoration:underline; text-underline-offset:4px; }
.story .kyriant-login-art button:focus-visible { outline:2px solid #edf4f1; outline-offset:2px; }
html[data-reduced-motion] .kyriant-login-art canvas { opacity:0; }
html[data-reduced-motion] .venture-story-ready .venture-story-poster { visibility:visible; }
@media(min-width:821px) and (max-height:660px) {
  .auth-layout .story { position:static; height:auto; align-self:start; grid-template-rows:auto auto 150px auto; }
  .story .kyriant-login-art { height:150px; }
}
@media(max-width:820px) {
  html:has(.auth-layout),body:has(.auth-layout),.auth-layout { background:#395a65; }
  .access-content { width:min(100%,560px); }
  .access-content>.language-choice { color:#edf4f1; margin-bottom:16px; }
  .access .access-card { padding:24px; }
  .access-footer .footnote,.access-footer .auth-guides,.access-footer a { color:#edf4f1; }

  .auth-layout .story { grid-template-rows:auto auto 120px; gap:12px; position:static; height:auto; min-height:0; padding:22px 24px 12px; }
  .story .brand strong { font-size:22px; }
  .story .brand-mark { width:30px; height:30px; }
  .story .brand-mark:after { width:17px; height:17px; }
  .story .eyebrow { font-size:12px; letter-spacing:.10em; }
  .story h1 { font-size:32px; margin:0 0 10px; }
  .story h1 br { display:none; }
  .story .story-content>p:not(.eyebrow) { font-size:15px; line-height:1.55; max-width:560px; }
  .story .story-content>p.story-next { margin:12px 0 0; padding-top:12px; font-size:15px; }
  .story .kyriant-login-art { height:120px; min-height:0; max-width:320px; margin:0 auto; }
  .story .story-foot,.access .mobile-brand { display:none; }
  .auth-layout .access { min-height:0; padding:12px 16px 24px; align-items:start; }
  .access .access-card { margin-top:0; }
}
@media(prefers-reduced-motion:reduce) {
  .story .kyriant-login-art #login-motion { display:inline-flex!important; }
}

/* Keep the desktop canvas still; only the column being read scrolls. */
html:has(.auth-layout),body:has(.auth-layout) { overscroll-behavior-y:none; }
@media(min-width:821px) {
  html:has(.auth-layout),body:has(.auth-layout) { height:100%; overflow:hidden; }
  .auth-layout { height:100svh; min-height:0; overflow:hidden; align-items:stretch; }
  .auth-layout .story { position:static; height:100%; min-height:0; overflow-y:auto; overscroll-behavior-y:none; scrollbar-gutter:stable; }
  .auth-layout .access { height:100%; min-height:0; overflow-y:auto; overscroll-behavior-y:none; scrollbar-gutter:stable; }
}