@keyframes --gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.auth-page{padding:1.5rem;min-height:100dvh;background:var(--body-bg);justify-content:center;align-items:center;display:flex}@media(width<=600px){.auth-page{padding:1rem}}.auth-container{margin:0 auto;width:100%;max-width:28rem}.auth-card{padding:3rem;background:var(--card-bg);box-shadow:0 0 16px var(--card-shadow);border:1px solid var(--card-border);border-radius:1rem;transition:all .25s var(--ease-out-3)}@media(width<=600px){.auth-card{padding:2rem}}.auth-title{margin:0 0 .5rem;color:var(--card-text);font-size:1.875rem;font-weight:700;line-height:1.25;text-align:center}@media(width<=600px){.auth-title{font-size:1.5rem}}.auth-subtitle{margin:0 0 2rem;color:hsl(from var(--card-text) h s l/60%);font-size:1rem;line-height:1.5;text-align:center}@media(width<=600px){.auth-subtitle{font-size:.875rem}}.auth-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-label{margin:0;color:var(--card-text);font-size:.875rem;font-weight:500}.form-input{padding:.75rem 1rem;width:100%;color:var(--card-text);background:hsl(from var(--card-bg) h s calc(l + 2%));border:1px solid #ccc;border-radius:.5rem;outline:none;font-size:1rem;line-height:1.5;transition:color .25s var(--ease-out-3),background-color .25s var(--ease-out-3),border-color .25s var(--ease-out-3),border-color .25s var(--ease-out-3),box-shadow .25s var(--ease-out-3)}.form-input::placeholder{color:hsl(from var(--card-text) h s l/40%)}.form-input:focus{box-shadow:0 0 0 3px hsl(from #1d8aff h s l/15%);border-color:#1d8aff}.form-input:disabled{opacity:.5;cursor:not-allowed}.auth-button{padding:.75rem 1.5rem;width:100%;color:#fff;background:linear-gradient(135deg,#1d8aff,#0097e9);box-shadow:0 2px 4px #00000014;border:none;border-radius:.5rem;outline:none;font-size:1rem;font-weight:600;transition:transform .25s var(--ease-out-3),opacity .25s var(--ease-out-3),box-shadow .25s var(--ease-out-3);cursor:pointer}.auth-button:hover{box-shadow:0 4px 8px #0000001a;opacity:.9;translate:0 -1px}.auth-button:active{box-shadow:0 1px 2px #0000000d;translate:0 0}.auth-button:focus-visible{outline:2px solid #1d8aff;outline-offset:2px}.auth-button:disabled{opacity:.5;transform:none;cursor:not-allowed}.auth-divider{margin:1.5rem 0;color:hsl(from var(--card-text) h s l/50%);align-items:center;font-size:.875rem;text-align:center;display:flex}.auth-divider:before,.auth-divider:after{content:"";flex:1;border-bottom:1px solid var(--card-border)}.auth-divider span{padding:0 1rem}.social-buttons{display:flex;flex-direction:column;gap:1rem}.social-button{padding:.75rem 1.5rem;width:100%;color:var(--card-text);background:hsl(from var(--card-bg) h s calc(l + 2%));box-shadow:0 1px 2px #0000000d;border:1px solid var(--card-border);border-radius:.5rem;outline:none;justify-content:center;align-items:center;gap:.75rem;font-size:1rem;font-weight:500;text-decoration:none;transition:color .25s var(--ease-out-3),background-color .25s var(--ease-out-3),border-color .25s var(--ease-out-3),border-color .25s var(--ease-out-3),box-shadow .25s var(--ease-out-3),transform .25s var(--ease-out-3);cursor:pointer;display:flex}.social-button svg{width:18px;height:18px;flex-shrink:0}.social-button:hover{background:hsl(from var(--card-bg) h s calc(l - 2%));box-shadow:0 2px 4px #00000014;border-color:hsl(from var(--card-border) h s calc(l - 10%));translate:0 -1px}.social-button:active{box-shadow:0 1px 2px #0000000d;translate:0 0}.social-button:focus-visible{outline:2px solid #1d8aff;outline-offset:2px}.social-button:disabled{opacity:.5;transform:none;cursor:not-allowed}.footer-links{margin-top:1.5rem;text-align:center}.footer-links p{margin:0;color:hsl(from var(--card-text) h s l/60%);font-size:.875rem;line-height:1.5}.footer-link{color:#1d8aff;font-weight:500;transition:color .25s var(--ease-out-3),background-color .25s var(--ease-out-3),border-color .25s var(--ease-out-3)}.footer-link:not(:hover,:focus-visible){text-decoration:none}.footer-link:hover,.footer-link:focus-visible{color:#0097e9}.footer-link:focus-visible{border-radius:.25rem;outline:2px solid #1d8aff;outline-offset:2px}.loading-spinner{margin:2rem auto;width:40px;height:40px;border:4px solid hsl(from var(--card-border) h s l/30%);border-top:4px solid #1d8aff;border-radius:100vw;animation:--spin 1s linear infinite}