.login-page{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:36px 24px;box-sizing:border-box;background:var(--color-bg)}
.login-page *{box-sizing:border-box}.login-shell{width:min(1080px,100%);display:grid;grid-template-columns:1fr 1.05fr;border:1px solid var(--color-border);border-radius:28px;overflow:hidden;background:var(--color-shell);box-shadow:0 30px 90px var(--color-shadow)}
.login-form-panel{padding:40px 52px;min-width:0}.login-brand{display:inline-flex;align-items:center;gap:12px;color:var(--color-text);font-size:var(--font-xl);font-weight:750;text-decoration:none}.login-brand small{display:block;font-size:var(--font-xs);color:var(--color-muted);font-weight:400}.login-brand .brand-symbol{width:42px;height:42px;font-size:24px;border-radius:13px}
.login-intro{margin:44px 0 28px}.login-eyebrow{color:var(--color-primary-text);font-size:var(--font-sm)}.login-intro h1{font-size:clamp(28px,3vw,36px);letter-spacing:-.8px;line-height:1.4;margin:8px 0 10px;font-weight:750}.login-intro h1 span{color:var(--color-primary-text)}.login-intro p{color:var(--color-muted);font-size:var(--font-sm);margin:0}
.login-field{margin-bottom:20px}.login-field label{display:block;font-size:var(--font-sm);margin-bottom:8px;font-weight:500}.login-field input{width:100%;height:52px;border:1px solid var(--color-border);border-radius:11px;padding:12px 15px;background:var(--color-bg);color:var(--color-text);font-size:16px;outline:none;transition:border-color .15s,box-shadow .15s}.login-field input::placeholder{color:var(--color-muted);font-size:var(--font-sm)}.login-field input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft)}.login-field input.input-validation-error{border-color:var(--color-danger)}
.login-password{position:relative}.login-password input{padding-right:72px}.login-password button{position:absolute;right:4px;top:4px;height:44px;min-width:60px;border:0;background:transparent;color:var(--color-primary-text);font:inherit;font-size:var(--font-xs);border-radius:8px;cursor:pointer}#caps-warning{color:var(--color-danger);font-size:var(--font-xs)}
.login-options{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:var(--font-xs);margin:4px 0 24px}.login-options>span{color:var(--color-muted)}.login-remember{display:flex;align-items:center;gap:8px;min-height:44px;cursor:pointer}.login-remember input{width:18px;height:18px;accent-color:var(--color-primary);margin:0}
.login-submit{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:52px;border:0;border-radius:11px;background:var(--color-primary-hover);color:var(--color-on-primary);font:inherit;font-weight:650;cursor:pointer;transition:background .15s,transform .15s}.login-submit:hover{background:var(--color-primary)}.login-submit:active{transform:translateY(1px)}.login-submit:disabled{cursor:wait;opacity:.8}.login-arrow{font-size:22px}.login-spinner{width:18px;height:18px;border:2px solid currentColor;border-left-color:transparent;border-radius:50%;animation:login-spin .7s linear infinite}@keyframes login-spin{to{transform:rotate(360deg)}}
.login-status{font-size:var(--font-xs);color:var(--color-muted);margin:8px 0;min-height:20px}.login-errors.validation-summary-valid{display:none}.login-errors.validation-summary-errors{padding:12px 16px;border:1px solid var(--color-danger);border-radius:10px;color:var(--color-danger);font-size:var(--font-sm);margin-bottom:20px}.login-errors ul{margin:0;padding-inline-start:18px}
.login-help{padding-top:18px;border-top:1px solid var(--color-border);font-size:var(--font-xs);color:var(--color-muted)}.login-help summary{cursor:pointer;min-height:36px;color:var(--color-text)}.login-help p{line-height:1.9;margin:4px 0 0}.login-footer{color:var(--color-muted);font-size:var(--font-xs);margin-top:30px}
.login-story{position:relative;display:flex;flex-direction:column;padding:38px 42px;color:var(--color-nav);background:var(--color-primary-soft);overflow:hidden;isolation:isolate}.login-story:before{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(var(--color-border) 1px,transparent 1px),linear-gradient(90deg,var(--color-border) 1px,transparent 1px);background-size:48px 48px;opacity:.26}.story-top{display:flex;align-items:center;justify-content:space-between;direction:ltr;letter-spacing:2px;font-size:11px;color:var(--color-muted)}.story-mark{font-size:28px;color:var(--color-primary-text)}.story-copy{margin-top:62px}.story-kicker{font-size:var(--font-sm);color:var(--color-primary-text)}.story-copy h2{font-size:clamp(28px,3vw,40px);line-height:1.55;font-weight:750;letter-spacing:-1px;margin:14px 0 18px;color:var(--color-text)}.story-copy p{font-size:var(--font-sm);color:var(--color-muted);line-height:2}.workshop-art{width:115%;margin:24px -7% 16px;color:var(--color-primary-text);flex:1;min-height:180px}.story-bottom{display:flex;gap:12px;flex-wrap:wrap;font-size:var(--font-xs);border-top:1px solid var(--color-border);padding-top:22px;color:var(--color-muted)}
.login-page [hidden]{display:none!important}.login-page :focus-visible{outline:2px solid var(--color-primary-text);outline-offset:4px}
@media(max-width:850px){.login-story{padding:32px 24px}.login-form-panel{padding:32px}.story-copy h2{font-size:30px}}
@media(max-width:680px){
 .login-page{display:block;padding:0;background:var(--color-shell)}
 .login-shell{display:block;border:0;border-radius:0;box-shadow:none;max-width:480px;margin:auto}
 .login-story{display:none}
 .login-form-panel{display:flex;flex-direction:column;padding:18px max(20px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom));min-height:100svh}
 .login-brand{font-size:20px}.login-brand .brand-symbol{width:38px;height:38px;font-size:21px}
 .login-intro{margin:22px 0 18px}.login-intro h1{font-size:28px;line-height:1.25;margin:5px 0 6px}.login-intro p{line-height:1.6}
 .login-field{margin-bottom:14px}.login-field label{margin-bottom:5px}.login-field input{height:46px;padding-block:9px}.login-password button{height:38px}
 .login-options{margin:0 0 14px}.login-remember{min-height:38px}
 .login-submit{min-height:48px}
 .login-status{min-height:10px;margin:4px 0}
 .login-help{margin-top:auto;padding-top:10px}.login-help summary{min-height:30px}
 .login-footer{margin-top:10px;text-align:center}
}
@media(max-width:680px) and (max-height:700px){
 .login-form-panel{padding-top:12px}.login-intro{margin:14px 0 12px}.login-intro p,.login-eyebrow,.login-footer{display:none}.login-help{padding-top:6px}.login-field{margin-bottom:10px}
}
@media(prefers-reduced-motion:reduce){.login-page *{animation:none!important;transition:none!important}}