.demo-page{height:100svh;overflow:hidden}
.demo-page .login-shell{height:100svh;min-height:0}
.demo-card{padding:28px}
.demo-card .login-card__inner{width:min(100%,540px)}
.demo-card h1{font-size:clamp(36px,3.25vw,48px);letter-spacing:-.06em}
.demo-card .muted{margin:12px 0 22px;font-size:clamp(16px,1.35vw,20px);line-height:1.12}
.demo-card .form-stack{gap:9px}
.demo-card .form-stack label:not(.consent-field){height:54px;min-height:54px;border-radius:9px}
.demo-card .form-stack label:not(.consent-field)>span{top:6px;font-size:12px}
.demo-card .form-stack label:not(.consent-field)>input{padding-top:21px;padding-bottom:5px;font-size:15px}
.demo-card .field-help{margin:-4px 0 1px;color:#0877ff;font-size:12px;font-weight:600}
.form-stack .consent-field{position:relative;display:grid!important;grid-template-columns:22px 1fr;align-items:center;gap:10px;width:100%;height:auto;min-height:24px!important;margin:3px 0 1px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#737379;font-size:12px;line-height:1.3;cursor:pointer}
.form-stack .consent-field:focus-within{border:0;box-shadow:none}
.consent-field input{position:absolute;opacity:0;width:1px!important;height:1px!important;padding:0}
.form-stack .consent-field>span{position:static;inset:auto;color:inherit;font-size:inherit}
.form-stack .consent-field>.consent-box{display:block;width:22px;height:22px;border:1.5px solid #d7d7dc;border-radius:6px;background:#f3f3f5;transition:.2s ease}
.consent-field input:checked+.consent-box{border-color:#0877ff!important;background:#0877ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4 4L19 6'/%3E%3C/svg%3E") center/15px no-repeat!important}
.consent-field input:focus-visible+.consent-box{outline:3px solid rgba(8,119,255,.2)}
.consent-field.has-error{color:#c53b3b}
.consent-field.has-error .consent-box{border-color:#ff4b55;background:#fff4f4;animation:consent-shake .32s ease}
@keyframes consent-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.demo-card .form-error{min-height:15px;margin:-3px 0 0;color:#c53b3b;font-size:11px;line-height:15px}
.demo-card .primary-button{height:54px;margin-top:1px;font-size:17px}
.back-home{display:block;margin-top:11px;text-align:center;color:#8b8b91;font-size:12px}.back-home:hover{color:#111}
@media(max-height:720px) and (min-width:781px){.demo-card{padding:20px}.demo-card h1{font-size:38px}.demo-card .muted{margin:8px 0 16px;font-size:16px}.demo-card .form-stack label:not(.consent-field){height:50px;min-height:50px}.demo-card .primary-button{height:50px}.back-home{margin-top:8px}}
@media(max-width:780px){.demo-page{overflow:hidden}.demo-page .login-shell{grid-template-rows:150px minmax(0,1fr)}.demo-page .login-brand{min-height:150px}.demo-card{min-height:0;padding:16px 20px}.demo-card .login-card__inner{width:min(100%,520px)}.demo-card h1{font-size:31px}.demo-card .muted{margin:7px 0 12px;font-size:14px}.demo-card .muted br{display:none}.demo-card .form-stack{gap:6px}.demo-card .form-stack label:not(.consent-field){height:46px;min-height:46px}.demo-card .form-stack label:not(.consent-field)>span{top:4px;font-size:11px}.demo-card .form-stack label:not(.consent-field)>input{padding-top:18px;font-size:14px}.demo-card .field-help{font-size:11px}.form-stack .consent-field{font-size:11px}.demo-card .primary-button{height:46px;font-size:15px}.back-home{margin-top:6px;font-size:11px}}
