@layer modules {
/* Auth owns its viewport layout; no changes to the dashboard styles. */
.auth-page{background:#fffdfb}
.auth-layout{min-height:100svh;display:grid;grid-template-columns:44% 56%}
.auth-story{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:38px 44px;background:#630b13;color:white;overflow:hidden}
.story-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:43% center}
.auth-story:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#48040860 0%,#39020708 35%,#480408e8 100%)}
.auth-story-content{position:relative;z-index:1;margin-top:auto}
.auth-story h1{font-size:clamp(28px,3vw,46px);line-height:1.18;letter-spacing:-1.3px;margin:0;max-width:520px}
.auth-story h1 span{color:#f6d6b3}
.auth-form-side{min-height:100svh;padding:24px 42px 20px;display:grid;grid-template-rows:auto 1fr auto;gap:16px}
.auth-header{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px}
.back-link{display:flex;align-items:center;gap:8px;font-size:14px;color:#75666a}
.back-link svg{width:16px;height:16px}
.mobile-brand{display:none}
.auth-header .demo-tag{font-size:12px}
.auth-form-wrap{width:100%;max-width:430px;margin:auto}
.auth-form-wrap h2{font-size:32px;line-height:1.2;letter-spacing:-.8px;margin:0 0 24px;font-weight:650}
.google-button{width:100%;min-height:50px;border:1px solid #dadce0;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;gap:12px;padding:10px 14px;font-size:16px;color:#444}
.google-button:disabled{cursor:not-allowed;background:#fafafa;color:#625b5b}
.google-icon{width:20px;height:20px;flex-shrink:0}
.google-button small{font-size:11px;color:#7c7272;margin-left:auto}
.auth-divider{display:flex;align-items:center;gap:13px;color:var(--ui-muted);font-size:13px;margin:18px 0}
.auth-divider:before,.auth-divider:after{content:"";height:1px;background:#eae2df;flex:1}
label{font-size:16px;font-weight:600;display:block;line-height:1.3}
.input-shell{display:flex;align-items:center;gap:12px;border:1px solid #ded6d3;border-radius:8px;background:#fff;padding:0 14px;margin-top:7px;height:50px}
.input-shell>svg{color:var(--ui-muted);width:19px;height:19px}
.input-shell input{width:100%;min-width:0;border:0;background:transparent;padding:12px 0;outline:none;color:#54474b;font-size:16px}
.input-shell:focus-within{border-color:var(--wine);box-shadow:0 0 0 3px #8508060d}
.password-label{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:18px}
.text-button{border:0;background:none;color:var(--wine);padding:0;font-size:14px;font-weight:600;line-height:1.5}
.eye-button{border:0;background:none;color:#82767a;padding:0;display:grid;place-items:center;min-width:32px;height:42px}
.eye-button svg{width:21px;height:21px}
.auth-submit{width:100%;height:50px;font-size:16px;margin-top:22px}
.auth-submit svg{width:18px;height:18px}
.demo-note{font-size:13px;line-height:1.5;color:#7e7074;margin:10px 0 0;text-align:center}
.auth-register{text-align:center;margin:22px 0 0;font-size:15px;color:#77696e;line-height:1.5}
.auth-register .text-button{font-size:15px;margin-left:4px}
.register-note{font-size:16px;line-height:1.6;color:#77696e;margin:20px 0 0}
.auth-footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;color:#85777c;font-size:12px;line-height:1.4}
#auth-dialog{border:1px solid #eadfdd;border-radius:14px;padding:26px;max-width:420px;width:calc(100vw - 36px);color:var(--text);background:#fffdfb}
#auth-dialog::backdrop{background:#24171966}
#auth-dialog h2{font-size:23px;margin:0 0 14px}
#auth-dialog p{font-size:16px;line-height:1.65}
#auth-dialog form{display:flex;justify-content:flex-end}
@media(max-width:1000px){.auth-layout{grid-template-columns:38% 62%}.auth-story{padding:28px}.auth-story h1{font-size:32px}.auth-form-side{padding:22px 32px}}
@media(max-width:760px){
.auth-layout{display:block}
.auth-story{display:none}
.auth-form-side{padding:14px 24px;gap:12px}
.auth-header{min-height:48px}
.mobile-brand{display:block;line-height:0}
.mobile-brand img{width:56px;height:56px;object-fit:contain}
.back-link{display:none}
.auth-form-wrap{max-width:430px}
.auth-form-wrap h2{font-size:28px;margin-bottom:20px}
.google-button{min-height:48px;font-size:15px;padding:10px 12px;gap:10px}
.google-button small{font-size:10px}
.auth-divider{margin:15px 0;font-size:12px}
.input-shell{height:48px}
.auth-submit{height:48px;margin-top:18px}
.password-label{margin-top:15px}
.auth-register{margin-top:18px}
.auth-footer{font-size:11px}
}
@media(max-height:700px){
.auth-form-side{padding-top:12px;padding-bottom:12px;gap:8px}
.auth-form-wrap h2{font-size:27px;margin-bottom:16px}
.auth-divider{margin:12px 0}
.google-button,.input-shell,.auth-submit{min-height:44px;height:44px}
.password-label{margin-top:12px}
.auth-submit{margin-top:14px}
.auth-register{margin-top:14px}
.mobile-brand img{width:44px;height:44px}
.auth-header{min-height:32px}
}
@media(max-width:360px){
.auth-form-side{padding-left:18px;padding-right:18px}
.auth-form-wrap h2{font-size:26px}
.google-button{font-size:14px;gap:8px}
.google-button small{font-size:9px}
.auth-register,.auth-register .text-button{font-size:14px}
.auth-footer{font-size:10px}
.demo-note{font-size:12px}
}
@media(max-height:480px) and (orientation:landscape){
.auth-layout{display:block}
.auth-story{display:none}
.auth-form-side{padding:10px 24px;min-height:100svh;gap:8px}
.mobile-brand,.auth-header,.auth-footer{display:none}
.auth-form-wrap{max-width:760px}
.auth-form-wrap h2{font-size:25px;margin-bottom:12px}
.google-button{max-width:430px;margin:auto}
#demo-login{display:grid;grid-template-columns:1fr 1fr;gap:7px 18px}
#demo-login>label{grid-column:1;grid-row:1}
#demo-login>.input-shell{grid-column:1;grid-row:2;margin:0}
#demo-login>.password-label{grid-column:2;grid-row:1;margin:0}
#demo-login>.password-label+.input-shell{grid-column:2;grid-row:2}
.auth-submit{grid-column:1/-1;grid-row:3;width:50%;margin:5px auto 0}
.demo-note{grid-column:1/-1;grid-row:4;margin:0}
.auth-register{margin-top:10px}
}

@media(max-height:360px) and (orientation:landscape){
.auth-divider{display:none}
.google-button{margin-bottom:8px}
.auth-form-wrap h2{font-size:23px;margin-bottom:8px}
}
/* Registration: two short steps with personal details kept together. */
.registration-mode .auth-form-wrap{max-width:480px}
.registration-mode .auth-form-wrap h2{margin-bottom:14px}
.register-progress{margin:14px 0 18px;color:#75646b;font-size:14px}
.register-progress>div{display:flex;gap:6px;margin-top:9px}
.register-progress i{height:3px;background:#e9dfdb;flex:1;border-radius:3px}
.register-progress i.complete{background:var(--wine)}
.register-grid,.register-access{border:0;padding:0;margin:0;min-width:0}
.register-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 16px}
.register-access{display:grid;gap:14px}
.register-field{min-width:0}
.register-field label{font-size:14px;line-height:1.35;margin-bottom:6px;white-space:nowrap}
.register-field>input,.register-field>select,.register-password{width:100%;height:46px;border:1px solid #ded6d3;border-radius:8px;background:white;color:#54474b;padding:0 11px;font:inherit;font-size:16px;min-width:0}
.register-field select{padding-right:4px}
.register-password{display:flex;align-items:center;padding-right:7px}
.register-password input{border:0;background:none;outline:none;font:inherit;font-size:16px;min-width:0;width:100%;height:100%}
.register-password:focus-within{border-color:var(--wine);outline:2px solid #85080620}
.register-actions{display:flex;gap:12px;margin-top:20px}
.register-actions .primary{flex:1;min-height:46px;padding:10px;font-size:16px;gap:8px}
.register-actions .secondary{font-size:15px;padding:10px 14px}
.register-actions svg{width:18px;height:18px}
.registration-mode .auth-register{margin-top:14px}
#registration-complete{border:1px solid #eadfdd;border-radius:14px;padding:26px;max-width:440px;width:calc(100vw - 36px);color:var(--text);background:#fffdfb}
#registration-complete::backdrop{background:#24171966}
#registration-complete h2{font-size:24px;margin:0 0 14px}
#registration-complete p{font-size:16px;line-height:1.65}
#registration-complete form{display:flex;justify-content:flex-end}
@media(max-width:760px){.register-grid{gap:12px}.register-field label{font-size:13px}.register-field>input,.register-field>select,.register-password{height:44px}.register-progress{margin:12px 0 14px}.register-actions{margin-top:16px}.registration-mode .auth-form-wrap h2{font-size:27px}}
@media(max-height:700px){.registration-mode .auth-header,.registration-mode .auth-footer{display:none}.registration-mode .auth-form-side{grid-template-rows:1fr;gap:0}.register-grid{gap:10px 12px}.register-field label{margin-bottom:4px}.register-actions{margin-top:14px}.registration-mode .auth-form-wrap{padding:6px 0}}
@media(max-width:360px){.register-grid{gap:10px}.register-field label{font-size:12px}.register-field>input,.register-field>select,.register-password{padding-left:8px}.register-actions .primary{font-size:14px}}
@media(max-height:480px) and (orientation:landscape){
.registration-mode .auth-form-wrap{max-width:900px}
.registration-mode .auth-form-wrap h2{font-size:24px;margin-bottom:8px}
.register-progress{margin:6px 0 10px;font-size:13px}
.register-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.register-field label{font-size:12px}
.register-access{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.register-actions{margin-top:10px;justify-content:center}
.register-actions .primary{flex:0 1 280px;min-height:42px}
.registration-mode .auth-register{margin-top:8px}
.registration-mode .google-button{height:42px;min-height:42px}
.registration-mode .demo-note{margin-top:6px}
}

@media(max-height:360px) and (orientation:landscape){
.registration-mode .auth-form-wrap{position:relative;padding:0}
.registration-mode .register-progress{position:absolute;top:5px;right:0;margin:0;font-size:12px}
.registration-mode .register-progress>div{display:none}
.registration-mode .auth-form-wrap h2{font-size:22px;margin-bottom:12px}
.registration-mode .register-grid{gap:8px 10px}
.registration-mode .register-actions{margin-top:8px}
}
/* Mobile brand centered above the standard login; Google comes afterwards. */
@media(max-width:760px) and (orientation:portrait){
.auth-header{justify-content:center;min-height:104px}
.mobile-brand img{width:104px;height:104px}
.auth-header .demo-tag{display:none}
.auth-form-side{gap:10px}
.auth-form-wrap h2{text-align:center}
.registration-mode .auth-header{display:flex}
.registration-mode .auth-form-side{grid-template-rows:auto 1fr auto}
}
@media(max-width:760px) and (max-height:700px) and (orientation:portrait){
.auth-form-side{padding-top:8px;padding-bottom:8px;gap:6px}
.auth-header{min-height:80px}
.mobile-brand img{width:80px;height:80px}
.auth-form-wrap h2{margin-bottom:12px}
.auth-register{margin-top:10px}
.auth-divider{margin:10px 0}
.registration-mode .auth-form-side{grid-template-rows:auto 1fr}
.registration-mode .auth-form-wrap{padding:0}
.registration-mode .auth-form-wrap h2{font-size:25px;margin-bottom:8px}
.register-progress{margin:8px 0 10px}
.register-grid{gap:8px 10px}
.register-field label{margin-bottom:3px}
.register-actions{margin-top:10px}
.registration-mode .auth-register{margin-top:8px}
.registration-mode .demo-note{margin-top:6px}
}.registration-mode #google-option{margin-top:10px}
.registration-mode #google-option .auth-divider{display:none}
@media(max-width:760px) and (max-height:700px){.registration-mode #google-option{margin-top:6px}.registration-mode .register-access{gap:10px}}
.auth-message{font-size:14px;line-height:1.5;color:#850806;margin:12px 0;overflow-wrap:anywhere}.auth-message:empty{display:none}

.auth-footer .legal-links{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.auth-footer .legal-links a{font:inherit}
}

/* Email registration keeps the chosen flow compact on short mobile screens. */
body.auth-page .auth-submit.ui-action--icon,body.auth-page .google-button.ui-action--icon { display:flex!important; margin-inline:auto; }
.auth-page .register-actions { justify-content:flex-end; }
.auth-page .auth-footer a { display:inline-flex; align-items:center; min-height:44px; font-size:13px; }
@media(max-width:760px) {
 .auth-page .auth-header { position:relative; justify-content:center; }
 .auth-page .auth-header .back-link { position:absolute; right:0; top:50%; transform:translateY(-50%); margin:0; }
}
@media(max-width:760px) and (max-height:740px){
 .registration-mode.registration-access-step #google-option{display:none}
 .registration-mode .legal-consent{margin:8px 0}
}
@media(max-width:760px) and (max-height:600px){
 .registration-mode .auth-form-side{gap:2px;padding-top:4px;padding-bottom:4px}
 .registration-mode .legal-consent{margin:4px 0}
 .registration-mode.registration-access-step .auth-header{min-height:56px}
 .registration-mode.registration-access-step .mobile-brand img{width:56px;height:56px}
}

/* Public access needs legible calls to action, independently of compact portal tools. */
.auth-page .auth-submit,.auth-page .google-button{display:flex;align-items:center;justify-content:center;gap:12px;min-height:52px;height:52px;font-size:16px;font-weight:600;border-radius:12px}
.auth-page .auth-submit{position:relative;box-shadow:0 4px 12px #85080612}
.auth-page .auth-submit>svg{width:20px;height:20px;flex:none}
.auth-page .google-button{color:#3b3431;font-weight:500;border-color:#ddd5d0;box-shadow:none}
.auth-page .google-button:not(:disabled):hover{background:#faf7f4;border-color:#bda79b}
.auth-page .auth-account-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}
.auth-page .auth-account-actions .ui-button--text{min-height:44px;padding:0 2px;font-size:14px;line-height:1.4;font-weight:600;border-radius:6px}
.auth-page .auth-register{display:flex;align-items:center;gap:5px;margin:0;font-size:14px}
.auth-page .auth-register .text-button{margin:0}
.auth-page .auth-divider{font-size:13px;line-height:20px;margin:16px 0;color:#73675f}
.auth-page .auth-footer{color:#73675f}
.auth-page .ui-control::placeholder{color:#776c64;opacity:1}
.auth-page .auth-message{margin:12px 0 0;padding:10px 12px;background:#fff3ef;border:1px solid #ead4ca;border-radius:10px;color:#8b2418;font-size:14px;line-height:1.5}
.auth-page .auth-message:empty{display:none}
.auth-page .auth-message[data-tone=success]{background:#f1f8f2;border-color:#cbded0;color:#285e38}
.auth-page .auth-footer a{min-width:44px}
.auth-page.registration-mode #forgot{display:none}
.auth-page.registration-mode .auth-account-actions{justify-content:center;margin-top:8px}
.auth-page.registration-mode .register-access{gap:12px}
.auth-page.registration-mode .legal-consent{margin:10px 0}
.auth-page.registration-mode .register-progress{margin:10px 0 14px}
.auth-page.registration-mode .register-actions{margin-top:14px}

@media(max-width:760px) and (orientation:portrait){
 .auth-page:not(.registration-mode) .auth-form-side{display:flex;flex-direction:column;align-items:center;min-height:100svh;padding:max(20px,env(safe-area-inset-top,0px)) 24px max(12px,env(safe-area-inset-bottom,0px));gap:0}
 .auth-page:not(.registration-mode) .auth-header{flex:none;min-height:0;width:100%;max-width:420px;margin:0 auto 24px}
 .auth-page:not(.registration-mode) .mobile-brand img{display:block;width:128px;height:128px}
 .auth-page:not(.registration-mode) .auth-form-wrap{flex:none;max-width:420px;margin:0 auto}
 .auth-page:not(.registration-mode) .auth-form-wrap h2{font-size:28px;line-height:1.2;letter-spacing:-.7px;margin:0 0 24px;text-align:center}
 .auth-page:not(.registration-mode) .ui-input-shell{height:52px;min-height:52px;border-radius:12px;margin-top:8px;padding-left:14px;background:#fff}
 .auth-page:not(.registration-mode) .ui-input-shell .ui-control{font-size:16px;line-height:1.5;color:#362b25}
 .auth-page:not(.registration-mode) .ui-label{font-size:15px;font-weight:600;color:#45362e}
 .auth-page:not(.registration-mode) .password-label{margin-top:16px}
 .auth-page:not(.registration-mode) .auth-submit{margin-top:24px;width:100%}
 .auth-page:not(.registration-mode) .auth-account-actions{margin-top:12px;gap:14px}
 .auth-page:not(.registration-mode) .auth-account-actions>button,.auth-page:not(.registration-mode) .auth-register{flex:1;justify-content:center;text-align:center}
 .auth-page:not(.registration-mode) .auth-register{border-left:1px solid #e9dfd9;padding-left:14px}
 .auth-page:not(.registration-mode) #switch-prompt{display:none}
 .auth-page:not(.registration-mode) .auth-register .ui-button{width:100%}
 .auth-page:not(.registration-mode) .auth-footer{width:100%;max-width:420px;flex:none;min-height:44px;margin:auto auto 0;padding-top:20px;font-size:12px}
 .auth-page .auth-footer a{font-size:12px}
 .auth-page .auth-footer .legal-links{gap:16px}
}
@media(max-width:760px) and (orientation:portrait) and (max-height:740px){
 .auth-page:not(.registration-mode) .auth-form-side{padding-top:max(16px,env(safe-area-inset-top,0px));padding-bottom:max(16px,env(safe-area-inset-bottom,0px))}
 .auth-page:not(.registration-mode) .auth-header{margin-bottom:16px}
 .auth-page:not(.registration-mode) .mobile-brand img{width:96px;height:96px}
 .auth-page:not(.registration-mode) .auth-form-wrap h2{font-size:26px;margin-bottom:18px}
 .auth-page:not(.registration-mode) .ui-input-shell,.auth-page:not(.registration-mode) .auth-submit,.auth-page:not(.registration-mode) .google-button{height:48px;min-height:48px}
 .auth-page:not(.registration-mode) .ui-input-shell{margin-top:7px}
 .auth-page:not(.registration-mode) .password-label{margin-top:14px}
 .auth-page:not(.registration-mode) .auth-submit{margin-top:18px}
 .auth-page:not(.registration-mode) .auth-divider{margin:10px 0;line-height:16px}
 .auth-page:not(.registration-mode) .auth-footer{padding-top:12px}
}
@media(max-width:760px) and (orientation:portrait) and (max-height:660px){
 .auth-page:not(.registration-mode) .auth-form-side{padding:12px 22px}
 .auth-page:not(.registration-mode) .auth-header{margin-bottom:8px}
 .auth-page:not(.registration-mode) .mobile-brand img{width:96px;height:96px}
 .auth-page:not(.registration-mode) .auth-form-wrap h2{margin-bottom:12px}
 .auth-page:not(.registration-mode) .ui-input-shell,.auth-page:not(.registration-mode) .auth-submit,.auth-page:not(.registration-mode) .google-button{height:44px;min-height:44px}
 .auth-page:not(.registration-mode) .ui-input-shell{margin-top:6px}
 .auth-page:not(.registration-mode) .password-label{margin-top:12px}
 .auth-page:not(.registration-mode) .auth-submit{margin-top:16px}
 .auth-page:not(.registration-mode) .auth-account-actions{margin-top:8px}
 .auth-page:not(.registration-mode) .auth-footer{padding-top:4px}
}
@media(max-width:760px) and (orientation:portrait) and (max-height:600px){
 .auth-page:not(.registration-mode) .auth-form-side{padding:8px 20px}
 .auth-page:not(.registration-mode) .mobile-brand img{width:88px;height:88px}
 .auth-page:not(.registration-mode) .auth-form-wrap h2{font-size:24px;margin-bottom:10px}
 .auth-page:not(.registration-mode) .ui-input-shell{margin-top:4px}
 .auth-page:not(.registration-mode) .password-label{margin-top:8px}
 .auth-page:not(.registration-mode) .auth-submit{margin-top:12px}
 .auth-page:not(.registration-mode) .auth-divider{margin:8px 0;line-height:14px}
 .auth-page:not(.registration-mode) .auth-account-actions{margin-top:4px}
 .auth-page.registration-mode:not(.registration-access-step) .auth-header{min-height:72px}
 .auth-page.registration-mode:not(.registration-access-step) .mobile-brand img{width:72px;height:72px}
 .auth-page.registration-mode .register-progress{margin:6px 0 8px}
 .auth-page.registration-mode .register-actions{margin-top:8px}
 .auth-page.registration-mode .auth-account-actions{margin-top:4px}
 .auth-page.registration-mode .register-access{gap:10px}
 .auth-page.registration-mode .legal-consent{margin:4px 0}
}
@media(max-height:480px) and (orientation:landscape){
 .auth-page:not(.registration-mode) .auth-submit,.auth-page:not(.registration-mode) .google-button{height:44px;min-height:44px}
 .auth-page:not(.registration-mode) .auth-account-actions{margin-top:8px}
 .auth-page.registration-mode .register-access>.legal-consent{grid-column:1/-1;margin:6px 0}
 .auth-page.registration-mode .register-progress{margin:4px 0 8px}
 .auth-page.registration-mode .register-actions{margin-top:6px}
 .auth-page.registration-mode .auth-account-actions{margin-top:4px}
 .auth-page.registration-mode #google-option{margin-top:6px}
 .auth-page.registration-mode .google-button{height:44px;min-height:44px}
}
@media(max-height:360px) and (orientation:landscape){
 .auth-page.registration-mode.registration-access-step #google-option{display:none}
}