body{background-color:#fafafa;margin:0;padding:0;transition:background-color .2s ease;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh}.page-header{width:100%;max-width:410px;text-align:center;margin-bottom:2rem}.page-title{font-size:2.5rem;font-weight:300;color:#141414;margin:0;letter-spacing:.5px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;position:relative;padding-bottom:.75rem}.page-title:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:60px;height:2px;background:linear-gradient(90deg,#78c059,#96ce7e);border-radius:2px}@media(prefers-color-scheme:dark){body{background-color:#141414}.page-title{color:#f0f0f0}.page-title:after{background:linear-gradient(90deg,#87c76b,#a5d590)}}hanko-auth,hanko-profile{--brand-color: hsl(102 45% 55%);--brand-color-shade-1: hsl(102 45% 60%);--brand-contrast-color: hsl(0 0% 100%);--background-color: hsl(0 0% 98%);--color: hsl(0 0% 8%);--color-shade-1: hsl(0 0% 42%);--color-shade-2: hsl(0 0% 90%);--error-color: hsl(0 70% 52%);--link-color: hsl(102 45% 55%);--font-weight: 400;--font-size: 16px;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--border-radius: 8px;--border-style: solid;--border-width: 1px;--item-height: 40px;--item-margin: .5rem 0;--container-padding: 30px;--container-max-width: 410px;--headline1-font-size: 24px;--headline1-font-weight: 600;--headline1-margin: 0 0 1rem;--headline2-font-size: 16px;--headline2-font-weight: 600;--headline2-margin: 1rem 0 .5rem;--divider-padding: 0 42px;--divider-visibility: visible;--link-text-decoration: none;--link-text-decoration-hover: underline;--input-min-width: 14em;--button-min-width: max-content}@media(prefers-color-scheme:dark){hanko-auth,hanko-profile{--brand-color: hsl(102 45% 60%);--brand-color-shade-1: hsl(102 45% 65%);--brand-contrast-color: hsl(0 0% 100%);--background-color: hsl(0 0% 8%);--color: hsl(0 0% 94%);--color-shade-1: hsl(0 0% 55%);--color-shade-2: hsl(0 0% 20%);--error-color: hsl(0 70% 55%);--link-color: hsl(102 45% 60%)}}hanko-auth::part(container),hanko-profile::part(container){background:var(--background-color);box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}@media(prefers-color-scheme:dark){hanko-auth::part(container),hanko-profile::part(container){box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -2px #0000004d;border:1px solid hsl(0 0% 20%)}}hanko-auth::part(primary-button),hanko-profile::part(primary-button){background-color:var(--brand-color);color:var(--brand-contrast-color);font-weight:500;transition:background-color .2s ease}hanko-auth::part(primary-button):hover,hanko-profile::part(primary-button):hover{background-color:var(--brand-color-shade-1)}hanko-auth::part(text-input),hanko-profile::part(text-input){border:1px solid var(--color-shade-2);background-color:var(--background-color);transition:border-color .2s ease,box-shadow .2s ease}hanko-auth::part(text-input):focus,hanko-profile::part(text-input):focus{outline:none;border-color:var(--brand-color);box-shadow:0 0 0 3px #78c0591a}hanko-auth::part(error),hanko-profile::part(error){color:var(--error-color);background-color:#da2f2f1a;padding:.5rem;border-radius:var(--border-radius);border-left:3px solid var(--error-color)}hanko-auth::part(link),hanko-profile::part(link){color:var(--link-color);font-weight:500;transition:opacity .2s ease}hanko-auth::part(link):hover,hanko-profile::part(link):hover{opacity:.8}hanko-auth::part(divider-line),hanko-profile::part(divider-line){background-color:var(--color-shade-2)}hanko-auth::part(divider-text),hanko-profile::part(divider-text){color:var(--color-shade-1);font-size:.875rem}hanko-auth::part(secondary-button),hanko-profile::part(secondary-button){background-color:#f0f0f0;color:#141414;border:1px solid var(--color-shade-2);transition:background-color .2s ease}hanko-auth::part(secondary-button):hover,hanko-profile::part(secondary-button):hover{background-color:#f5f5f5}@media(prefers-color-scheme:dark){hanko-auth::part(secondary-button),hanko-profile::part(secondary-button){background-color:#292929;color:#f0f0f0}hanko-auth::part(secondary-button):hover,hanko-profile::part(secondary-button):hover{background-color:#2e2e2e}}.logoutButton{background-color:#da2f2f;color:#fff;border:none;border-radius:8px;padding:10px 20px;font-size:16px;font-weight:500;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;cursor:pointer;transition:background-color .2s ease,transform .1s ease;margin:0 auto 1rem;display:block;width:100%;max-width:270px}.logoutButton:hover{background-color:#e10e0e}.logoutButton:active{transform:scale(.98)}.logoutButton:focus{outline:none;box-shadow:0 0 0 3px #da2f2f33}@media(prefers-color-scheme:dark){.logoutButton{background-color:#dd3c3c}.logoutButton:hover{background-color:#c90303}.logoutButton:focus{box-shadow:0 0 0 3px #dd3c3c33}}@media(max-width:640px){hanko-auth,hanko-profile{--container-padding: 20px;--font-size: 14px}.logoutButton{font-size:14px;padding:8px 16px}}