:root{--asukoe-widget-primary-color: #0066cc;--asukoe-widget-text-color: #333333;--asukoe-widget-background-color: #ffffff;--negative-color: #f44336}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--asukoe-widget-text-color);background-color:#f5f5f5;line-height:1.6}.login-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px}.login-card,.password-setup-card,.forgot-password-card,.reset-confirm-card{background:#fff;padding:2rem;border-radius:8px;box-shadow:0 4px 12px #0000001a;width:100%;max-width:400px}.login-header{text-align:center;margin-bottom:2rem}.login-header h1{font-size:1.5rem;font-weight:500;margin-bottom:.5rem}.login-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-size:.9rem;color:#666}.form-group input{padding:.75rem;border:1px solid #ddd;border-radius:4px;font-size:1rem}.login-button,.setup-button,.reset-button,.confirm-button{display:flex;justify-content:center;align-items:center;background-color:var(--asukoe-widget-primary-color);color:#fff;border:none;padding:.75rem;border-radius:4px;font-size:1rem;cursor:pointer;transition:background-color .2s}.login-button:hover,.setup-button:hover,.reset-button:hover,.confirm-button:hover{background-color:#05a}.error-message{color:var(--negative-color);font-size:.9rem;text-align:center;margin-top:1rem;display:none}.forgot-password,.back-to-login{text-align:center;font-size:.9rem;margin-top:1rem}.forgot-password a,.back-to-login a{color:var(--asukoe-widget-primary-color);text-decoration:none}.forgot-password a:hover,.back-to-login a:hover{text-decoration:underline}.login-footer{text-align:center;margin-top:2rem;padding-bottom:1.5rem;color:#666;font-size:.8rem;width:100%}.login-footer a{color:var(--asukoe-widget-primary-color);text-decoration:none}.login-footer a:hover{text-decoration:underline}.loading-spinner{display:none;margin-left:8px;width:20px;height:20px;border:3px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff;animation:spin 1s ease-in-out infinite;vertical-align:middle}.login-button.loading .loading-spinner,.setup-button.loading .loading-spinner,.reset-button.loading .loading-spinner,.confirm-button.loading .loading-spinner{display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}