.auth-page{background:#f8fafc url(/assets/personalized_care/survey/login_background.png) 50%/cover no-repeat;justify-content:center;align-items:center;min-height:100vh;padding:120px 6vw 80px;font-family:Outfit,sans-serif;display:flex;position:relative}@media (max-width:768px){.auth-page{align-items:flex-start;padding:48px 16px 40px}}@media (max-width:480px){.auth-page{padding:32px 12px}.auth-card{width:100%;padding:24px 20px}.auth-title{font-size:1.5rem}.auth-field input{min-height:48px;padding:14px 16px}.auth-primary{min-height:48px;padding:14px 20px}}.auth-page:before{content:"";pointer-events:none;background:#05080a80;position:absolute;inset:0}.auth-page .auth-card{z-index:1;position:relative}.auth-card{background:#fff;border:1px solid #0f172a14;border-radius:20px;width:min(420px,100%);padding:32px;box-shadow:0 20px 40px #0f172a14}.auth-title{color:#0f172a;margin-bottom:8px;font-family:Space Grotesk,sans-serif;font-size:1.8rem}.auth-subtitle{color:#64748b;margin-bottom:24px}.auth-field{gap:8px;margin-bottom:16px;display:grid}.auth-field label{color:#0f172a;font-size:.9rem;font-weight:600}.auth-field input{border:1px solid #e2e8f0;border-radius:12px;padding:12px 14px;font-size:1rem}.auth-actions{gap:12px;margin-top:16px;display:grid}.auth-primary{color:#fff;cursor:pointer;background:linear-gradient(135deg,#06b6d4,#8b5cf6);border:none;border-radius:999px;padding:12px 22px;font-weight:600;box-shadow:0 12px 30px #8b5cf64d}.auth-secondary{text-align:center;color:#475569;font-size:.95rem}.auth-secondary a{color:#4f46e5;font-weight:600;text-decoration:none}.auth-error{color:#dc2626;margin-top:8px;font-size:.9rem}.auth-card-role{width:min(720px,100%);padding:40px 32px}.role-grid{grid-template-columns:1fr 1fr;gap:24px;margin-top:8px;display:grid}@media (max-width:640px){.role-grid{grid-template-columns:1fr}}.role-card{text-align:center;cursor:pointer;background:#fff;border:2px solid #0f172a14;border-radius:20px;flex-direction:column;align-items:center;padding:28px 24px;font-family:inherit;transition:transform .25s,box-shadow .3s,border-color .25s;display:flex;position:relative;overflow:hidden;box-shadow:0 8px 32px #0f172a0f}.role-card:before{content:"";border-radius:inherit;-webkit-mask-composite:xor;opacity:0;background:linear-gradient(135deg,#0000,#0000);padding:2px;transition:opacity .25s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.role-card:hover{transform:translateY(-6px);box-shadow:0 20px 48px #0f172a1f}.role-card-patient:hover{border-color:#06b6d459;box-shadow:0 20px 48px #06b6d426}.role-card-patient:hover:before{opacity:1;background:linear-gradient(135deg,#06b6d4,#0891b2)}.role-card-scientist:hover{border-color:#8b5cf659;box-shadow:0 20px 48px #8b5cf626}.role-card-scientist:hover:before{opacity:1;background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.role-card-icon-wrap{border-radius:50%;justify-content:center;align-items:center;width:88px;height:88px;margin-bottom:16px;display:flex;overflow:hidden}.role-card-patient .role-card-icon-wrap{background:linear-gradient(135deg,#06b6d426,#06b6d40f);border:1px solid #06b6d433}.role-card-scientist .role-card-icon-wrap{background:linear-gradient(135deg,#8b5cf626,#8b5cf60f);border:1px solid #8b5cf633}.role-card-icon{-o-object-fit:contain;object-fit:contain;width:52px;height:52px}.role-card-title{color:#0f172a;margin-bottom:8px;font-family:Space Grotesk,sans-serif;font-size:1.35rem;font-weight:700}.role-card-desc{color:#64748b;margin-bottom:14px;font-size:.9rem;line-height:1.5}.role-card-cta{color:#06b6d4;font-size:.85rem;font-weight:600;transition:color .2s}.role-card-scientist .role-card-cta{color:#8b5cf6}.role-card:hover .role-card-cta{color:#0891b2}.role-card-scientist:hover .role-card-cta{color:#7c3aed}
