@autenticar-me/vue 0.12.0 → 0.14.0

package/README.md

@@ -197,14 +197,21 @@ import { SignUpButton } from '@autenticar-me/vue'
 
 Botão que realiza logout do usuário quando clicado. Só é exibido quando há um usuário autenticado.
 
+**Eventos:**
+- `logout`: Emitido após o logout ser concluído com sucesso
+
 **Exemplo:**
 ```vue
 <template>
-  <SignOutButton />
+  <SignOutButton @logout="handleLogout" />
 </template>
 
 <script setup>
 import { SignOutButton } from '@autenticar-me/vue'
+
+const handleLogout = () => {
+  console.log('Usuário deslogado com sucesso')
+}
 </script>
 ```
 
@@ -214,14 +221,21 @@ import { SignOutButton } from '@autenticar-me/vue'
 
 Componente de perfil do usuário com dropdown menu e modal de gerenciamento. Permite visualizar e editar informações pessoais, gerenciar emails, redefinir senha e gerenciar sessões ativas.
 
+**Eventos:**
+- `logout`: Emitido após o logout ser concluído com sucesso
+
 **Exemplo:**
 ```vue
 <template>
-  <UserProfile />
+  <UserProfile @logout="handleLogout" />
 </template>
 
 <script setup>
 import { UserProfile } from '@autenticar-me/vue'
+
+const handleLogout = () => {
+  console.log('Usuário deslogado com sucesso')
+}
 </script>
 ```
 

package/dist/components/Buttons/SignOutButton.vue.d.ts

@@ -1,3 +1,7 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    logout: () => any;
+}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
+    onLogout?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=SignOutButton.vue.d.ts.map

package/dist/components/Buttons/SignOutButton.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SignOutButton.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Buttons/SignOutButton.vue"],"names":[],"mappings":";AAwHA,wBAKG"}
+{"version":3,"file":"SignOutButton.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Buttons/SignOutButton.vue"],"names":[],"mappings":";;;;;AAyIA,wBAMG"}

package/dist/components/UserProfile.vue.d.ts

@@ -1,4 +1,8 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    logout: () => any;
+}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
+    onLogout?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
     buttonRef: HTMLButtonElement;
 }, any>;
 export default _default;

package/dist/components/UserProfile.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserProfile.vue.d.ts","sourceRoot":"","sources":["../../src/components/UserProfile.vue"],"names":[],"mappings":";;;AAyyFA,wBAMG"}
+{"version":3,"file":"UserProfile.vue.d.ts","sourceRoot":"","sources":["../../src/components/UserProfile.vue"],"names":[],"mappings":";;;;;;;AAqzFA,wBAOG"}

package/dist/index.cjs

@@ -2,7 +2,7 @@
                     (function() {
                     if (typeof document !== 'undefined') {
                         const style = document.createElement('style');
-                        style.textContent = ":root {\n    --atm-bg-primary: #ffffff;\n    --atm-bg-secondary: #f8f9fa;\n    --atm-bg-tertiary: #f0f0f0;\n\n    --atm-text-primary: #333333;\n    --atm-text-secondary: #666666;\n    --atm-text-tertiary: #999999;\n    --atm-text-muted: #888888;\n\n    --atm-border-color: #dddddd;\n    --atm-border-hover: #cccccc;\n\n    --atm-input-bg: #ffffff;\n    --atm-input-disabled: #f5f5f5;\n    --atm-input-border: #dddddd;\n\n    --atm-error-color: #dc3545;\n    --atm-success-color: #28a745;\n\n    --atm-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);\n    --atm-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);\n}\n\n.atm-theme-dark,\n:root.atm-theme-dark {\n    --atm-bg-primary: #1a1a1a;\n    --atm-bg-secondary: #2d2d2d;\n    --atm-bg-tertiary: #404040;\n\n    --atm-text-primary: #e0e0e0;\n    --atm-text-secondary: #b0b0b0;\n    --atm-text-tertiary: #808080;\n    --atm-text-muted: #999999;\n\n    --atm-border-color: #404040;\n    --atm-border-hover: #505050;\n\n    --atm-input-bg: #2d2d2d;\n    --atm-input-disabled: #1f1f1f;\n    --atm-input-border: #404040;\n\n    --atm-error-color: #ff6b6b;\n    --atm-success-color: #51cf66;\n\n    --atm-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);\n    --atm-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.5);\n}\n\n.atm-overlay[data-v-5a315eca] {\n    position: fixed;\n    inset: 0;\n    z-index: 99999;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: rgba(0, 0, 0, 0.5);\n    backdrop-filter: blur(4px);\n    overflow-y: auto;\n    padding: 1.5rem 0;\n}\n.atm-container[data-v-5a315eca] {\n    padding: 0 1.5rem;\n    width: 100%;\n    margin: auto;\n}\n.atm-fade-layer[data-v-5a315eca] {\n    position: fixed;\n    inset: 0;\n    transition: opacity 0.2s ease;\n    pointer-events: none;\n}\n.atm-fade-bg[data-v-5a315eca] {\n    position: absolute;\n    inset: 0;\n    opacity: 0.75;\n}\n.atm-modal[data-v-5a315eca] {\n    position: relative;\n    display: inline-block;\n    vertical-align: bottom;\n    background-color: var(--atm-bg-primary);\n    border-radius: 0.5rem;\n    text-align: left;\n    box-shadow: var(--atm-shadow-md);\n    transform: translate(0);\n    transition: all 0.2s ease-in-out;\n    max-width: 32rem;\n    width: 100%;\n    max-height: calc(100vh - 3rem);\n    display: flex;\n    flex-direction: column;\n}\n.atm-close-button[data-v-5a315eca] {\n    position: absolute;\n    top: 1rem;\n    right: 1rem;\n    color: var(--atm-text-tertiary);\n    background: transparent;\n    border: none;\n    cursor: pointer;\n    padding: 0.25rem;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10;\n    transition: color 0.2s;\n}\n.atm-close-button[data-v-5a315eca]:hover {\n    color: var(--atm-text-secondary);\n}\n.atm-icon[data-v-5a315eca] {\n    width: 1.5rem;\n    height: 1.5rem;\n}\n.atm-modal-content[data-v-5a315eca] {\n    padding: 1.25rem;\n    overflow-y: auto;\n    flex: 1;\n    min-height: 0;\n}\n.atm-modal-title[data-v-5a315eca] {\n    font-size: 1.125rem;\n    font-weight: 500;\n    color: var(--atm-text-primary);\n    margin: 0;\n    margin-bottom: 0.75rem;\n}\n@media (max-width: 768px) {\n.atm-overlay[data-v-5a315eca] {\n        padding: 1rem 0;\n}\n.atm-container[data-v-5a315eca] {\n        padding: 0 1rem;\n}\n.atm-modal[data-v-5a315eca] {\n        border-radius: 0.375rem;\n        max-height: calc(100vh - 2rem);\n}\n.atm-modal-content[data-v-5a315eca] {\n        padding: 1rem;\n}\n.atm-modal-title[data-v-5a315eca] {\n        font-size: 1rem;\n        margin-bottom: 0.75rem;\n}\n.atm-close-button[data-v-5a315eca] {\n        top: 0.75rem;\n        right: 0.75rem;\n}\n.atm-icon[data-v-5a315eca] {\n        width: 1.25rem;\n        height: 1.25rem;\n}\n}\n@media (max-width: 480px) {\n.atm-overlay[data-v-5a315eca] {\n        padding: 0.5rem 0;\n}\n.atm-container[data-v-5a315eca] {\n        padding: 0 0.5rem;\n}\n.atm-modal[data-v-5a315eca] {\n        border-radius: 0.25rem;\n        max-width: 100%;\n        max-height: calc(100vh - 1rem);\n}\n.atm-modal-content[data-v-5a315eca] {\n        padding: 0.875rem;\n}\n.atm-modal-title[data-v-5a315eca] {\n        font-size: 0.9375rem;\n        margin-bottom: 0.625rem;\n}\n.atm-close-button[data-v-5a315eca] {\n        top: 0.5rem;\n        right: 0.5rem;\n}\n}\n@media (max-width: 360px) {\n.atm-overlay[data-v-5a315eca] {\n        padding: 0.25rem 0;\n}\n.atm-container[data-v-5a315eca] {\n        padding: 0 0.25rem;\n}\n.atm-modal[data-v-5a315eca] {\n        max-height: calc(100vh - 0.5rem);\n}\n.atm-modal-content[data-v-5a315eca] {\n        padding: 0.75rem;\n}\n.atm-modal-title[data-v-5a315eca] {\n        font-size: 0.875rem;\n        margin-bottom: 0.5rem;\n}\n}\n\n.atm-notification-container[data-v-f5e47084] {\n    font-family: Arial, Helvetica, sans-serif;\n    position: fixed;\n    top: 20px;\n    right: 20px;\n    z-index: 99999;\n    pointer-events: none;\n}\n.atm-notification[data-v-f5e47084] {\n    padding: 12px 16px;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n    min-width: 250px;\n    max-width: 350px;\n    pointer-events: auto;\n}\n.atm-notification--error[data-v-f5e47084] {\n    background: #ff3333;\n    color: #FFF;\n}\n.atm-notification--success[data-v-f5e47084] {\n    background: #00a622;\n    color: #FFF;\n}\n.atm-notification--warning[data-v-f5e47084] {\n    background: #ffa500;\n    color: #FFF;\n}\n.atm-notification-enter-active[data-v-f5e47084] {\n    transition: all 0.3s ease-out;\n}\n.atm-notification-leave-active[data-v-f5e47084] {\n    transition: all 0.3s ease-in;\n}\n.atm-notification-enter-from[data-v-f5e47084] {\n    transform: translateX(100%);\n    opacity: 0;\n}\n.atm-notification-leave-to[data-v-f5e47084] {\n    transform: translateX(100%);\n    opacity: 0;\n}\n@media (max-width: 768px) {\n.atm-notification-container[data-v-f5e47084] {\n        top: 16px;\n        right: 16px;\n        left: 16px;\n}\n.atm-notification[data-v-f5e47084] {\n        min-width: auto;\n        max-width: 100%;\n        padding: 11px 14px;\n        font-size: 13px;\n}\n}\n@media (max-width: 480px) {\n.atm-notification-container[data-v-f5e47084] {\n        top: 12px;\n        right: 12px;\n        left: 12px;\n}\n.atm-notification[data-v-f5e47084] {\n        padding: 10px 12px;\n        font-size: 12px;\n        border-radius: 5px;\n}\n}\n@media (max-width: 360px) {\n.atm-notification-container[data-v-f5e47084] {\n        top: 10px;\n        right: 10px;\n        left: 10px;\n}\n.atm-notification[data-v-f5e47084] {\n        padding: 9px 11px;\n        font-size: 11px;\n        border-radius: 4px;\n}\n}\n\n.atm-login-container[data-v-b88e6b76] {\n    background: var(--atm-bg-primary);\n    border-radius: 8px;\n    font-family: 'Segoe UI', system-ui, sans-serif;\n    text-align: center;\n}\n.atm-logo-container[data-v-b88e6b76] {\n    margin-bottom: 12px;\n}\n.atm-logo-placeholder[data-v-b88e6b76] {\n    width: 44px;\n    height: 44px;\n    margin: 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: var(--atm-bg-tertiary);\n    border-radius: 50%;\n    color: var(--atm-text-muted);\n    font-size: 11px;\n}\n.atm-logo-image[data-v-b88e6b76] {\n    max-width: 44px;\n    max-height: 44px;\n    margin: 0 auto;\n    display: block;\n    border-radius: 4px;\n    object-fit: contain;\n}\n.atm-project-name[data-v-b88e6b76] {\n    margin: 0 0 4px 0;\n    font-size: 18px;\n    color: var(--v70f1a692);\n    font-weight: 600;\n}\n.atm-welcome-text[data-v-b88e6b76] {\n    margin: 0 0 16px 0;\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n}\n.atm-form-group[data-v-b88e6b76] {\n    margin-bottom: 12px;\n    text-align: left;\n}\n.atm-input-label[data-v-b88e6b76] {\n    display: block;\n    margin-bottom: 4px;\n    font-size: 13px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-input-field[data-v-b88e6b76] {\n    width: 100%;\n    padding: 8px 10px;\n    background: var(--atm-input-bg);\n    color: var(--atm-text-primary);\n    border: 1px solid var(--atm-input-border);\n    border-radius: 6px;\n    font-size: 14px;\n    box-sizing: border-box;\n    transition: border-color 0.2s;\n}\n.atm-input-field[data-v-b88e6b76]:focus {\n    outline: none;\n    border-color: var(--v70f1a692);\n    box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.1);\n}\n.atm-input-field[data-v-b88e6b76]:disabled {\n    background-color: var(--atm-input-disabled);\n    cursor: not-allowed;\n}\n.atm-field-error[data-v-b88e6b76] {\n    color: var(--atm-error-color);\n    font-size: 12px;\n    margin-top: 4px;\n    text-align: left;\n}\n.atm-alternative-options[data-v-b88e6b76] {\n    margin-top: 8px;\n    text-align: center;\n}\n.atm-forgot-password-link[data-v-b88e6b76] {\n    font-size: 12px;\n    background: none;\n    border: none;\n    color: var(--v4a1729f6);\n    cursor: pointer;\n    text-decoration: none;\n    padding: 0;\n    font-family: inherit;\n}\n.atm-forgot-password-link[data-v-b88e6b76]:hover:not(:disabled) {\n    text-decoration: underline;\n}\n.atm-forgot-password-link[data-v-b88e6b76]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n.atm-strategy-choice[data-v-b88e6b76] {\n    text-align: center;\n    margin-bottom: 12px;\n}\n.atm-strategy-title[data-v-b88e6b76] {\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n    margin-bottom: 12px;\n}\n.atm-strategy-buttons[data-v-b88e6b76] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n.atm-strategy-button[data-v-b88e6b76] {\n    width: 100%;\n    padding: 10px;\n    background: var(--atm-bg-secondary);\n    color: var(--atm-text-primary);\n    border: 1px solid var(--atm-border-color);\n    border-radius: 6px;\n    font-size: 14px;\n    cursor: pointer;\n    transition: all 0.2s;\n}\n.atm-strategy-button[data-v-b88e6b76]:hover:not(:disabled) {\n    background: var(--atm-bg-tertiary);\n    border-color: var(--v70f1a692);\n}\n.atm-strategy-button[data-v-b88e6b76]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n.atm-email-link-text[data-v-b88e6b76] {\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n    margin: 0;\n    text-align: center;\n}\n.atm-login-button[data-v-b88e6b76] {\n    width: 100%;\n    padding: 10px;\n    margin-top: 4px;\n    background: var(--v70f1a692);\n    color: #ffffff;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.2s;\n    min-height: 42px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.atm-login-button[data-v-b88e6b76]:hover:not(:disabled) {\n    opacity: 0.9;\n    transform: translateY(-1px);\n}\n.atm-login-button[data-v-b88e6b76]:disabled {\n    opacity: 0.8;\n    cursor: not-allowed;\n    transform: none;\n}\n.button-spinner[data-v-b88e6b76] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    color: #fff;\n    font-weight: 500;\n}\n.spinner-svg[data-v-b88e6b76] {\n    animation: spin-b88e6b76 1s linear infinite;\n    width: 18px;\n    height: 18px;\n    stroke: #fff;\n}\n.spinner-circle[data-v-b88e6b76] {\n    stroke-dasharray: 90, 150;\n    stroke-linecap: round;\n}\n@keyframes spin-b88e6b76 {\n0% {\n        transform: rotate(0deg);\n}\n100% {\n        transform: rotate(360deg);\n}\n}\n.atm-footer-links[data-v-b88e6b76] {\n    margin-top: 16px;\n    font-size: 13px;\n}\n.atm-signup-text[data-v-b88e6b76] {\n    color: var(--atm-text-secondary);\n    margin-bottom: 6px;\n}\n.atm-signup-link[data-v-b88e6b76] {\n    color: var(--v4a1729f6);\n    text-decoration: none;\n    cursor: pointer;\n}\n.atm-signup-link[data-v-b88e6b76]:hover {\n    text-decoration: underline;\n}\n.atm-powered-by[data-v-b88e6b76] {\n    color: var(--atm-text-tertiary);\n    font-size: 11px;\n    margin: 0;\n}\n@media (max-width: 768px) {\n.atm-project-name[data-v-b88e6b76] {\n        font-size: 17px;\n}\n.atm-welcome-text[data-v-b88e6b76] {\n        font-size: 13px;\n        margin-bottom: 14px;\n}\n.atm-form-group[data-v-b88e6b76] {\n        margin-bottom: 10px;\n}\n.atm-input-label[data-v-b88e6b76] {\n        font-size: 12px;\n        margin-bottom: 4px;\n}\n.atm-input-field[data-v-b88e6b76] {\n        padding: 8px 10px;\n        font-size: 13px;\n}\n.atm-login-button[data-v-b88e6b76] {\n        font-size: 13px;\n        padding: 9px;\n        min-height: 40px;\n}\n.atm-strategy-button[data-v-b88e6b76] {\n        padding: 9px;\n        font-size: 13px;\n}\n.atm-footer-links[data-v-b88e6b76] {\n        margin-top: 14px;\n        font-size: 12px;\n}\n}\n@media (max-width: 480px) {\n.atm-logo-placeholder[data-v-b88e6b76] {\n        width: 40px;\n        height: 40px;\n        font-size: 10px;\n}\n.atm-logo-image[data-v-b88e6b76] {\n        max-width: 40px;\n        max-height: 40px;\n}\n.atm-project-name[data-v-b88e6b76] {\n        font-size: 16px;\n        margin-bottom: 4px;\n}\n.atm-welcome-text[data-v-b88e6b76] {\n        font-size: 12px;\n        margin-bottom: 12px;\n}\n.atm-form-group[data-v-b88e6b76] {\n        margin-bottom: 10px;\n}\n.atm-input-label[data-v-b88e6b76] {\n        font-size: 12px;\n        margin-bottom: 3px;\n}\n.atm-input-field[data-v-b88e6b76] {\n        padding: 7px 9px;\n        font-size: 13px;\n}\n.atm-login-button[data-v-b88e6b76] {\n        font-size: 13px;\n        padding: 9px;\n        min-height: 38px;\n}\n.atm-forgot-password-link[data-v-b88e6b76] {\n        font-size: 11px;\n}\n.atm-strategy-title[data-v-b88e6b76] {\n        font-size: 13px;\n        margin-bottom: 10px;\n}\n.atm-strategy-button[data-v-b88e6b76] {\n        padding: 9px;\n        font-size: 13px;\n}\n.atm-email-link-text[data-v-b88e6b76] {\n        font-size: 13px;\n}\n.atm-footer-links[data-v-b88e6b76] {\n        margin-top: 12px;\n        font-size: 12px;\n}\n.atm-powered-by[data-v-b88e6b76] {\n        font-size: 10px;\n}\n.spinner-svg[data-v-b88e6b76] {\n        width: 16px;\n        height: 16px;\n}\n.button-spinner[data-v-b88e6b76] {\n        gap: 6px;\n}\n}\n@media (max-width: 360px) {\n.atm-logo-placeholder[data-v-b88e6b76] {\n        width: 36px;\n        height: 36px;\n        font-size: 9px;\n}\n.atm-logo-image[data-v-b88e6b76] {\n        max-width: 36px;\n        max-height: 36px;\n}\n.atm-project-name[data-v-b88e6b76] {\n        font-size: 15px;\n        margin-bottom: 3px;\n}\n.atm-welcome-text[data-v-b88e6b76] {\n        font-size: 11px;\n        margin-bottom: 10px;\n}\n.atm-form-group[data-v-b88e6b76] {\n        margin-bottom: 8px;\n}\n.atm-input-label[data-v-b88e6b76] {\n        font-size: 11px;\n        margin-bottom: 3px;\n}\n.atm-input-field[data-v-b88e6b76] {\n        padding: 6px 8px;\n        font-size: 12px;\n}\n.atm-login-button[data-v-b88e6b76] {\n        font-size: 12px;\n        padding: 8px;\n        min-height: 36px;\n}\n.atm-strategy-button[data-v-b88e6b76] {\n        padding: 8px;\n        font-size: 12px;\n}\n.atm-footer-links[data-v-b88e6b76] {\n        margin-top: 10px;\n        font-size: 11px;\n}\n.spinner-svg[data-v-b88e6b76] {\n        width: 14px;\n        height: 14px;\n}\n}\n\n.atm-signup-container[data-v-83e9452d] {\n    width: 100%;\n    background: var(--atm-bg-primary);\n    border-radius: 8px;\n    font-family: 'Segoe UI', system-ui, sans-serif;\n    text-align: center;\n}\n.atm-logo-container[data-v-83e9452d] {\n    margin-bottom: 12px;\n}\n.atm-logo-placeholder[data-v-83e9452d] {\n    width: 44px;\n    height: 44px;\n    margin: 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: var(--atm-bg-tertiary);\n    border-radius: 50%;\n    color: var(--atm-text-muted);\n    font-size: 11px;\n}\n.atm-logo-image[data-v-83e9452d] {\n    max-width: 44px;\n    max-height: 44px;\n    margin: 0 auto;\n    display: block;\n    border-radius: 4px;\n    object-fit: contain;\n}\n.atm-project-name[data-v-83e9452d] {\n    margin: 0 0 4px 0;\n    font-size: 18px;\n    color: var(--v2dc4b763);\n    font-weight: 600;\n}\n.atm-welcome-text[data-v-83e9452d] {\n    margin: 0 0 16px 0;\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n}\n.atm-form-group[data-v-83e9452d] {\n    margin-bottom: 12px;\n    text-align: left;\n}\n.atm-input-label[data-v-83e9452d] {\n    display: block;\n    margin-bottom: 4px;\n    font-size: 13px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-input-field[data-v-83e9452d] {\n    width: 100%;\n    padding: 8px 10px;\n    background: var(--atm-input-bg);\n    color: var(--atm-text-primary);\n    border: 1px solid var(--atm-input-border);\n    border-radius: 6px;\n    font-size: 14px;\n    box-sizing: border-box;\n    transition: border-color 0.2s;\n}\n.atm-input-field[data-v-83e9452d]:focus {\n    outline: none;\n    border-color: var(--v2dc4b763);\n    box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.1);\n}\n.atm-input-field[data-v-83e9452d]:disabled {\n    background-color: var(--atm-input-disabled);\n    cursor: not-allowed;\n}\n.atm-field-error[data-v-83e9452d] {\n    color: var(--atm-error-color);\n    font-size: 12px;\n    margin-top: 4px;\n    text-align: left;\n}\n.atm-signup-button[data-v-83e9452d] {\n    width: 100%;\n    padding: 10px;\n    margin-top: 4px;\n    background: var(--v2dc4b763);\n    color: #ffffff;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.2s;\n    min-height: 42px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.atm-signup-button[data-v-83e9452d]:hover:not(:disabled) {\n    opacity: 0.9;\n    transform: translateY(-1px);\n}\n.atm-signup-button[data-v-83e9452d]:disabled {\n    opacity: 0.8;\n    cursor: not-allowed;\n    transform: none;\n}\n.button-spinner[data-v-83e9452d] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    color: #fff;\n    font-weight: 500;\n}\n.spinner-svg[data-v-83e9452d] {\n    animation: spin-83e9452d 1s linear infinite;\n    width: 18px;\n    height: 18px;\n    stroke: #fff;\n}\n.spinner-circle[data-v-83e9452d] {\n    stroke-dasharray: 90, 150;\n    stroke-linecap: round;\n}\n@keyframes spin-83e9452d {\n0% {\n        transform: rotate(0deg);\n}\n100% {\n        transform: rotate(360deg);\n}\n}\n.atm-footer-links[data-v-83e9452d] {\n    margin-top: 16px;\n    font-size: 13px;\n}\n.atm-login-text[data-v-83e9452d] {\n    color: var(--atm-text-secondary);\n    margin-bottom: 6px;\n}\n.atm-login-link[data-v-83e9452d] {\n    color: var(--b00c0a9e);\n    text-decoration: none;\n    cursor: pointer;\n    transition: opacity 0.2s;\n}\n.atm-login-link[data-v-83e9452d]:hover:not(.disabled-link) {\n    text-decoration: underline;\n}\n.atm-login-link.disabled-link[data-v-83e9452d] {\n    opacity: 0.5;\n    cursor: not-allowed;\n    pointer-events: none;\n}\n.atm-powered-by[data-v-83e9452d] {\n    color: var(--atm-text-tertiary);\n    font-size: 11px;\n    margin: 0;\n}\n@media (max-width: 768px) {\n.atm-project-name[data-v-83e9452d] {\n        font-size: 17px;\n}\n.atm-welcome-text[data-v-83e9452d] {\n        font-size: 13px;\n        margin-bottom: 14px;\n}\n.atm-form-group[data-v-83e9452d] {\n        margin-bottom: 10px;\n}\n.atm-input-label[data-v-83e9452d] {\n        font-size: 12px;\n        margin-bottom: 4px;\n}\n.atm-input-field[data-v-83e9452d] {\n        padding: 8px 10px;\n        font-size: 13px;\n}\n.atm-signup-button[data-v-83e9452d] {\n        font-size: 13px;\n        padding: 9px;\n        min-height: 40px;\n}\n.atm-footer-links[data-v-83e9452d] {\n        margin-top: 14px;\n        font-size: 12px;\n}\n}\n@media (max-width: 480px) {\n.atm-logo-placeholder[data-v-83e9452d] {\n        width: 40px;\n        height: 40px;\n        font-size: 10px;\n}\n.atm-logo-image[data-v-83e9452d] {\n        max-width: 40px;\n        max-height: 40px;\n}\n.atm-project-name[data-v-83e9452d] {\n        font-size: 16px;\n        margin-bottom: 4px;\n}\n.atm-welcome-text[data-v-83e9452d] {\n        font-size: 12px;\n        margin-bottom: 12px;\n}\n.atm-form-group[data-v-83e9452d] {\n        margin-bottom: 10px;\n}\n.atm-input-label[data-v-83e9452d] {\n        font-size: 12px;\n        margin-bottom: 3px;\n}\n.atm-input-field[data-v-83e9452d] {\n        padding: 7px 9px;\n        font-size: 13px;\n}\n.atm-signup-button[data-v-83e9452d] {\n        font-size: 13px;\n        padding: 9px;\n        min-height: 38px;\n}\n.atm-footer-links[data-v-83e9452d] {\n        margin-top: 12px;\n        font-size: 12px;\n}\n.atm-powered-by[data-v-83e9452d] {\n        font-size: 10px;\n}\n.spinner-svg[data-v-83e9452d] {\n        width: 16px;\n        height: 16px;\n}\n.button-spinner[data-v-83e9452d] {\n        gap: 6px;\n}\n}\n@media (max-width: 360px) {\n.atm-logo-placeholder[data-v-83e9452d] {\n        width: 36px;\n        height: 36px;\n        font-size: 9px;\n}\n.atm-logo-image[data-v-83e9452d] {\n        max-width: 36px;\n        max-height: 36px;\n}\n.atm-project-name[data-v-83e9452d] {\n        font-size: 15px;\n        margin-bottom: 3px;\n}\n.atm-welcome-text[data-v-83e9452d] {\n        font-size: 11px;\n        margin-bottom: 10px;\n}\n.atm-form-group[data-v-83e9452d] {\n        margin-bottom: 8px;\n}\n.atm-input-label[data-v-83e9452d] {\n        font-size: 11px;\n        margin-bottom: 3px;\n}\n.atm-input-field[data-v-83e9452d] {\n        padding: 6px 8px;\n        font-size: 12px;\n}\n.atm-signup-button[data-v-83e9452d] {\n        font-size: 12px;\n        padding: 8px;\n        min-height: 36px;\n}\n.atm-footer-links[data-v-83e9452d] {\n        margin-top: 10px;\n        font-size: 11px;\n}\n.spinner-svg[data-v-83e9452d] {\n        width: 14px;\n        height: 14px;\n}\n}\n\n.atm-signin-btn[data-v-43bf662d] {\n    padding: 12px;\n    margin-top: 8px;\n    background: var(--v12e673a0);\n    color: #FFF;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: background 0.2s;\n    min-height: 44px;\n}\n.atm-signin-btn[data-v-43bf662d]:hover {\n    opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-signin-btn[data-v-43bf662d] {\n        padding: 11px;\n        font-size: 13px;\n        min-height: 42px;\n}\n}\n@media (max-width: 480px) {\n.atm-signin-btn[data-v-43bf662d] {\n        padding: 10px;\n        font-size: 13px;\n        min-height: 40px;\n}\n}\n@media (max-width: 360px) {\n.atm-signin-btn[data-v-43bf662d] {\n        padding: 9px;\n        font-size: 12px;\n        min-height: 38px;\n}\n}\n\n.atm-registration-disabled[data-v-b58cb91d] {\n    padding: 24px;\n    text-align: center;\n}\n.atm-disabled-message[data-v-b58cb91d] {\n    margin-bottom: 16px;\n    color: var(--atm-text-primary);\n}\n.atm-disabled-login-btn[data-v-b58cb91d] {\n    padding: 12px 24px;\n    background: #007bff;\n    color: #ffffff;\n    border: none;\n    border-radius: 6px;\n    cursor: pointer;\n    font-size: 14px;\n    font-weight: 500;\n    transition: opacity 0.2s;\n}\n.atm-disabled-login-btn[data-v-b58cb91d]:hover {\n    opacity: 0.9;\n}\n\n.atm-signup-btn[data-v-d9ac9b54] {\n    padding: 12px;\n    margin-top: 8px;\n    background: var(--v1c336c46);\n    color: #FFF;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: background 0.2s;\n    min-height: 44px;\n}\n.atm-signup-btn[data-v-d9ac9b54]:hover {\n    opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-signup-btn[data-v-d9ac9b54] {\n        padding: 11px;\n        font-size: 13px;\n        min-height: 42px;\n}\n}\n@media (max-width: 480px) {\n.atm-signup-btn[data-v-d9ac9b54] {\n        padding: 10px;\n        font-size: 13px;\n        min-height: 40px;\n}\n}\n@media (max-width: 360px) {\n.atm-signup-btn[data-v-d9ac9b54] {\n        padding: 9px;\n        font-size: 12px;\n        min-height: 38px;\n}\n}\n\n.atm-profile-container {\n    position: relative;\n    display: inline-block;\n    font-family: 'Segoe UI', system-ui, sans-serif;\n}\n.atm-profile-button {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    background: none;\n    border: none;\n    cursor: pointer;\n    padding: 8px 12px;\n    border-radius: 6px;\n    transition: background 0.2s;\n}\n.atm-profile-button:hover {\n    background: var(--atm-bg-secondary);\n}\n.atm-profile-avatar {\n    width: 32px;\n    height: 32px;\n    border-radius: 50%;\n    background-color: var(--feed21a4);\n    color: #ffffff;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 12px;\n    font-weight: 500;\n}\n.atm-profile-avatar.large {\n    width: 48px;\n    height: 48px;\n    font-size: 16px;\n}\n.atm-profile-avatar-img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    border-radius: 50%;\n}\n.atm-profile-name {\n    font-size: 14px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-profile-arrow {\n    width: 16px;\n    height: 16px;\n    color: var(--atm-text-primary);\n    transition: transform 0.2s;\n}\n.atm-rotate {\n    transform: rotate(180deg);\n}\n.atm-profile-menu {\n    position: absolute;\n    top: 100%;\n    width: 280px;\n    background: var(--atm-bg-primary);\n    border: 1px solid var(--atm-border-color);\n    border-radius: 8px;\n    box-shadow: var(--atm-shadow-md);\n    z-index: 1000;\n    overflow: hidden;\n    margin-top: 4px;\n}\n.atm-position-left {\n    left: 0;\n    right: auto;\n}\n.atm-position-right {\n    right: 0;\n    left: auto;\n}\n.atm-profile-info {\n    display: flex;\n    gap: 12px;\n    padding: 16px;\n    border-bottom: 1px solid var(--atm-border-color);\n}\n.atm-profile-details {\n    flex: 1;\n    min-width: 0;\n}\n.atm-profile-fullname {\n    margin: 0;\n    font-size: 14px;\n    font-weight: 600;\n    color: var(--atm-text-primary);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.atm-profile-email {\n    margin: 4px 0 0;\n    font-size: 13px;\n    color: var(--atm-text-secondary);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.atm-profile-options {\n    padding: 8px 0;\n}\n.atm-profile-option {\n    display: flex;\n    align-items: center;\n    width: 100%;\n    padding: 10px 16px;\n    background: none;\n    border: none;\n    text-align: left;\n    cursor: pointer;\n    font-size: 14px;\n    color: var(--atm-text-primary);\n    gap: 10px;\n    transition: background 0.2s;\n}\n.atm-profile-option:hover {\n    background: var(--atm-bg-secondary);\n}\n.atm-profile-icon {\n    width: 18px;\n    height: 18px;\n    color: var(--atm-text-secondary);\n}\n.atm-fade-enter-active,\n.atm-fade-leave-active {\n    transition: opacity 0.2s, transform 0.2s;\n}\n.atm-fade-enter-from,\n.atm-fade-leave-to {\n    opacity: 0;\n    transform: translateY(-10px);\n}\n.atm-profile-modal {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    z-index: 9999;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow-y: auto;\n    padding: 1.5rem;\n}\n.atm-profile-overlay {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: rgba(0, 0, 0, 0.5);\n    pointer-events: none;\n}\n.atm-profile-content {\n    position: relative;\n    width: 100%;\n    max-width: 450px;\n    background: var(--atm-bg-primary);\n    border-radius: 12px;\n    box-shadow: var(--atm-shadow-md);\n    z-index: 1;\n    max-height: calc(100vh - 3rem);\n    display: flex;\n    flex-direction: column;\n    margin: auto;\n}\n.atm-profile-header {\n    padding: 16px;\n    border-bottom: 1px solid var(--atm-border-color);\n    display: flex;\n    align-items: center;\n}\n.atm-profile-close {\n    background: none;\n    border: none;\n    font-size: 24px;\n    cursor: pointer;\n    padding: 8px;\n    margin-right: 12px;\n    color: var(--atm-text-secondary);\n    transition: color 0.2s;\n}\n.atm-profile-close:hover {\n    color: var(--atm-text-primary);\n}\n.atm-profile-title {\n    margin: 0;\n    font-size: 18px;\n    font-weight: 600;\n    color: var(--atm-text-primary);\n}\n.atm-profile-tabs {\n    display: flex;\n    border-bottom: 1px solid var(--atm-border-color);\n    background: var(--atm-bg-secondary);\n}\n.atm-tab {\n    flex: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 6px;\n    padding: 12px 16px;\n    background: none;\n    border: none;\n    cursor: pointer;\n    font-size: 14px;\n    font-weight: 500;\n    color: var(--atm-text-secondary);\n    transition: all 0.2s;\n}\n.atm-tab:hover {\n    background: var(--atm-bg-tertiary);\n    color: var(--atm-text-primary);\n}\n.atm-tab-active {\n    color: var(--feed21a4) !important;\n    background: var(--atm-bg-primary);\n    border-bottom: 2px solid var(--feed21a4);\n}\n.atm-tab-icon {\n    width: 16px;\n    height: 16px;\n}\n.atm-profile-body {\n    padding: 24px;\n    text-align: center;\n    overflow-y: auto;\n    flex: 1;\n    min-height: 0;\n}\n.atm-profile-avatar-large {\n    width: 80px;\n    height: 80px;\n    border-radius: 50%;\n    background-color: var(--feed21a4);\n    color: #ffffff;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 24px;\n    font-weight: 600;\n    margin: 0 auto 20px;\n}\n.atm-profile-info-grid {\n    width: 100%;\n    text-align: left;\n    margin-top: 20px;\n}\n.atm-profile-info-row {\n    display: flex;\n    flex-direction: column;\n    margin-bottom: 16px;\n}\n.atm-profile-info-label {\n    font-size: 13px;\n    color: var(--atm-text-secondary);\n    margin-bottom: 4px;\n}\n.atm-profile-info-value {\n    font-size: 16px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-profile-edit-form {\n    width: 100%;\n    text-align: left;\n    margin-top: 20px;\n}\n.atm-form-group {\n    margin-bottom: 16px;\n}\n.atm-input-label {\n    display: block;\n    margin-bottom: 6px;\n    font-size: 13px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-input-field {\n    width: 100%;\n    padding: 10px 12px;\n    background: var(--atm-input-bg);\n    color: var(--atm-text-primary);\n    border: 1px solid var(--atm-input-border);\n    border-radius: 6px;\n    font-size: 14px;\n    box-sizing: border-box;\n    transition: border-color 0.2s;\n}\n.atm-input-field:focus {\n    outline: none;\n    border-color: var(--feed21a4);\n    box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.1);\n}\n.atm-form-actions {\n    display: flex;\n    gap: 12px;\n    margin-top: 24px;\n}\n.atm-save-btn,\n.atm-edit-profile-btn,\n.atm-reset-password-btn,\n.atm-add-email-btn {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px;\n    background: var(--feed21a4);\n    color: #FFF;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n    justify-content: center;\n}\n.atm-save-btn:hover,\n.atm-edit-profile-btn:hover,\n.atm-reset-password-btn:hover,\n.atm-add-email-btn:hover {\n    opacity: 0.9;\n}\n.atm-cancel-btn {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    flex: 1;\n    padding: 12px;\n    background: var(--atm-bg-secondary);\n    color: var(--atm-text-secondary);\n    border: 1px solid var(--atm-border-color);\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.2s;\n    justify-content: center;\n}\n.atm-cancel-btn:hover {\n    background: var(--atm-bg-tertiary);\n    color: var(--atm-text-primary);\n}\n.atm-btn-icon {\n    width: 16px;\n    height: 16px;\n}\n.atm-email-add-section {\n    margin-bottom: 24px;\n    text-align: left;\n}\n.atm-email-list {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n    text-align: left;\n}\n.atm-email-item {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px;\n    background: var(--atm-bg-secondary);\n    border-radius: 6px;\n    border: 1px solid var(--atm-border-color);\n}\n.atm-email-info {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    flex: 1;\n}\n.atm-email-address {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    color: var(--atm-text-primary);\n}\n.atm-email-icon {\n    width: 16px;\n    height: 16px;\n    color: var(--v5c6febbc);\n}\n.atm-email-badges {\n    display: flex;\n    gap: 6px;\n    flex-wrap: wrap;\n}\n.atm-badge {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    padding: 2px 8px;\n    font-size: 11px;\n    font-weight: 500;\n    border-radius: 12px;\n    text-transform: uppercase;\n}\n.atm-badge-icon {\n    width: 12px;\n    height: 12px;\n}\n.atm-badge-primary {\n    background: #e3f2fd;\n    color: #1976d2;\n}\n.atm-badge-verified {\n    background: #e8f5e8;\n    color: #2e7d32;\n}\n.atm-badge-unverified {\n    background: #fff3e0;\n    color: #f57c00;\n}\n.atm-email-actions {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n.atm-verify-btn {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    padding: 6px 12px;\n    background: var(--feed21a4);\n    color: white;\n    border: none;\n    border-radius: 4px;\n    font-size: 12px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n}\n.atm-verify-btn:hover {\n    opacity: 0.9;\n}\n.atm-delete-btn {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    padding: 6px 12px;\n    background: #dc3545;\n    color: white;\n    border: none;\n    border-radius: 4px;\n    font-size: 12px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n}\n.atm-delete-btn:hover {\n    opacity: 0.9;\n}\n.atm-password-section {\n    text-align: left;\n}\n.atm-sessions-section {\n    text-align: left;\n}\n.atm-sessions-info {\n    margin-bottom: 20px;\n}\n.atm-sessions-description {\n    margin: 0;\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n    line-height: 1.5;\n}\n.atm-sessions-list {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n.atm-session-item {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px;\n    background: var(--atm-bg-secondary);\n    border-radius: 8px;\n    border: 1px solid var(--atm-border-color);\n    gap: 16px;\n}\n.atm-session-header {\n    display: flex;\n    gap: 12px;\n    align-items: flex-start;\n}\n.atm-session-icon {\n    width: 24px;\n    height: 24px;\n    color: var(--v5c6febbc);\n    flex-shrink: 0;\n}\n.atm-session-details {\n    flex: 1;\n    min-width: 0;\n}\n.atm-session-title {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    margin-bottom: 4px;\n    font-size: 15px;\n    font-weight: 600;\n    color: var(--atm-text-primary);\n}\n.atm-session-device-info {\n    font-size: 13px;\n    color: var(--atm-text-secondary);\n    margin-bottom: 8px;\n}\n.atm-badge-current {\n    background: #d1f4e0;\n    color: #0f9d58;\n}\n.atm-session-timestamps {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n.atm-session-timestamp {\n    display: flex;\n    gap: 6px;\n    font-size: 13px;\n    color: var(--atm-text-secondary);\n}\n.atm-timestamp-label {\n    font-weight: 500;\n    color: var(--atm-text-primary);\n}\n.atm-session-actions {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n.atm-close-session-btn {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    padding: 8px 14px;\n    background: #dc3545;\n    color: white;\n    border: none;\n    border-radius: 6px;\n    font-size: 13px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n    white-space: nowrap;\n}\n.atm-close-session-btn:hover {\n    opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-profile-button {\n        padding: 6px 10px;\n        gap: 6px;\n}\n.atm-profile-name {\n        font-size: 13px;\n}\n.atm-profile-menu {\n        width: 260px;\n}\n.atm-profile-modal {\n        padding: 1rem;\n}\n.atm-profile-content {\n        max-width: 90%;\n        max-height: calc(100vh - 2rem);\n}\n.atm-profile-header {\n        padding: 14px;\n}\n.atm-profile-title {\n        font-size: 16px;\n}\n.atm-profile-body {\n        padding: 20px;\n}\n.atm-tab {\n        padding: 10px 12px;\n        font-size: 13px;\n        gap: 4px;\n}\n.atm-tab-icon {\n        width: 14px;\n        height: 14px;\n}\n.atm-profile-avatar-large {\n        width: 70px;\n        height: 70px;\n        font-size: 22px;\n}\n.atm-email-item {\n        flex-direction: column;\n        gap: 12px;\n        align-items: flex-start;\n}\n.atm-email-actions {\n        flex-direction: row;\n        width: 100%;\n}\n.atm-verify-btn,\n    .atm-delete-btn {\n        flex: 1;\n        justify-content: center;\n}\n.atm-session-item {\n        flex-direction: column;\n        align-items: flex-start;\n}\n.atm-session-actions {\n        width: 100%;\n}\n.atm-close-session-btn {\n        width: 100%;\n        justify-content: center;\n}\n}\n@media (max-width: 480px) {\n.atm-profile-button {\n        padding: 4px 8px;\n        gap: 4px;\n}\n.atm-profile-avatar {\n        width: 28px;\n        height: 28px;\n        font-size: 11px;\n}\n.atm-profile-avatar.large {\n        width: 40px;\n        height: 40px;\n        font-size: 14px;\n}\n.atm-profile-name {\n        font-size: 12px;\n}\n.atm-profile-arrow {\n        width: 14px;\n        height: 14px;\n}\n.atm-profile-menu {\n        width: calc(100vw - 20px);\n        max-width: 240px;\n}\n.atm-profile-info {\n        padding: 12px;\n        gap: 10px;\n}\n.atm-profile-fullname {\n        font-size: 13px;\n}\n.atm-profile-email {\n        font-size: 12px;\n}\n.atm-profile-option {\n        padding: 8px 12px;\n        font-size: 13px;\n        gap: 8px;\n}\n.atm-profile-icon {\n        width: 16px;\n        height: 16px;\n}\n.atm-profile-modal {\n        padding: 0.5rem;\n}\n.atm-profile-content {\n        max-width: 95%;\n        max-height: calc(100vh - 1rem);\n}\n.atm-profile-header {\n        padding: 12px;\n}\n.atm-profile-close {\n        font-size: 20px;\n        padding: 4px;\n        margin-right: 8px;\n}\n.atm-profile-title {\n        font-size: 15px;\n}\n.atm-profile-body {\n        padding: 16px;\n}\n.atm-tab {\n        padding: 8px 8px;\n        font-size: 12px;\n        gap: 3px;\n}\n.atm-tab-icon {\n        width: 13px;\n        height: 13px;\n}\n.atm-profile-avatar-large {\n        width: 60px;\n        height: 60px;\n        font-size: 20px;\n        margin-bottom: 16px;\n}\n.atm-profile-info-label {\n        font-size: 12px;\n}\n.atm-profile-info-value {\n        font-size: 14px;\n}\n.atm-input-label {\n        font-size: 12px;\n}\n.atm-input-field {\n        padding: 8px 10px;\n        font-size: 13px;\n}\n.atm-form-actions {\n        flex-direction: column;\n        gap: 8px;\n}\n.atm-save-btn,\n    .atm-cancel-btn,\n    .atm-edit-profile-btn,\n    .atm-reset-password-btn {\n        width: 100%;\n        padding: 10px;\n        font-size: 13px;\n}\n.atm-email-item {\n        padding: 10px;\n}\n.atm-email-address {\n        font-size: 13px;\n}\n.atm-badge {\n        font-size: 10px;\n        padding: 2px 6px;\n}\n}\n@media (max-width: 360px) {\n.atm-profile-button {\n        padding: 4px 6px;\n}\n.atm-profile-avatar {\n        width: 26px;\n        height: 26px;\n        font-size: 10px;\n}\n.atm-profile-name {\n        display: none;\n}\n.atm-profile-menu {\n        width: calc(100vw - 16px);\n        max-width: 220px;\n}\n.atm-profile-modal {\n        padding: 0.25rem;\n}\n.atm-profile-content {\n        max-width: 98%;\n        max-height: calc(100vh - 0.5rem);\n}\n.atm-profile-body {\n        padding: 12px;\n}\n.atm-tab {\n        padding: 8px 6px;\n        font-size: 11px;\n        flex-direction: column;\n        gap: 2px;\n}\n.atm-profile-avatar-large {\n        width: 50px;\n        height: 50px;\n        font-size: 18px;\n}\n.atm-email-item {\n        padding: 8px;\n}\n}\n\n.atm-auth-buttons[data-v-0c63ecb8] {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 16px;\n}\n@media (max-width: 768px) {\n.atm-auth-buttons[data-v-0c63ecb8] {\n        gap: 14px;\n}\n}\n@media (max-width: 480px) {\n.atm-auth-buttons[data-v-0c63ecb8] {\n        gap: 12px;\n        flex-direction: column;\n}\n}\n@media (max-width: 360px) {\n.atm-auth-buttons[data-v-0c63ecb8] {\n        gap: 10px;\n}\n}\n\n.atm-logout-btn[data-v-7157f989] {\n    padding: 12px;\n    margin-top: 8px;\n    background: var(--v2ec0f896);\n    color: #FFF;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n    min-height: 44px;\n}\n.atm-logout-btn[data-v-7157f989]:hover {\n    opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-logout-btn[data-v-7157f989] {\n        padding: 11px;\n        font-size: 13px;\n        min-height: 42px;\n}\n}\n@media (max-width: 480px) {\n.atm-logout-btn[data-v-7157f989] {\n        padding: 10px;\n        font-size: 13px;\n        min-height: 40px;\n}\n}\n@media (max-width: 360px) {\n.atm-logout-btn[data-v-7157f989] {\n        padding: 9px;\n        font-size: 12px;\n        min-height: 38px;\n}\n}\n";
+                        style.textContent = ":root {\n    --atm-bg-primary: #ffffff;\n    --atm-bg-secondary: #f8f9fa;\n    --atm-bg-tertiary: #f0f0f0;\n\n    --atm-text-primary: #333333;\n    --atm-text-secondary: #666666;\n    --atm-text-tertiary: #999999;\n    --atm-text-muted: #888888;\n\n    --atm-border-color: #dddddd;\n    --atm-border-hover: #cccccc;\n\n    --atm-input-bg: #ffffff;\n    --atm-input-disabled: #f5f5f5;\n    --atm-input-border: #dddddd;\n\n    --atm-error-color: #dc3545;\n    --atm-success-color: #28a745;\n\n    --atm-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);\n    --atm-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);\n}\n\n.atm-theme-dark,\n:root.atm-theme-dark {\n    --atm-bg-primary: #1a1a1a;\n    --atm-bg-secondary: #2d2d2d;\n    --atm-bg-tertiary: #404040;\n\n    --atm-text-primary: #e0e0e0;\n    --atm-text-secondary: #b0b0b0;\n    --atm-text-tertiary: #808080;\n    --atm-text-muted: #999999;\n\n    --atm-border-color: #404040;\n    --atm-border-hover: #505050;\n\n    --atm-input-bg: #2d2d2d;\n    --atm-input-disabled: #1f1f1f;\n    --atm-input-border: #404040;\n\n    --atm-error-color: #ff6b6b;\n    --atm-success-color: #51cf66;\n\n    --atm-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);\n    --atm-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.5);\n}\n\n.atm-overlay[data-v-5a315eca] {\n    position: fixed;\n    inset: 0;\n    z-index: 99999;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: rgba(0, 0, 0, 0.5);\n    backdrop-filter: blur(4px);\n    overflow-y: auto;\n    padding: 1.5rem 0;\n}\n.atm-container[data-v-5a315eca] {\n    padding: 0 1.5rem;\n    width: 100%;\n    margin: auto;\n}\n.atm-fade-layer[data-v-5a315eca] {\n    position: fixed;\n    inset: 0;\n    transition: opacity 0.2s ease;\n    pointer-events: none;\n}\n.atm-fade-bg[data-v-5a315eca] {\n    position: absolute;\n    inset: 0;\n    opacity: 0.75;\n}\n.atm-modal[data-v-5a315eca] {\n    position: relative;\n    display: inline-block;\n    vertical-align: bottom;\n    background-color: var(--atm-bg-primary);\n    border-radius: 0.5rem;\n    text-align: left;\n    box-shadow: var(--atm-shadow-md);\n    transform: translate(0);\n    transition: all 0.2s ease-in-out;\n    max-width: 32rem;\n    width: 100%;\n    max-height: calc(100vh - 3rem);\n    display: flex;\n    flex-direction: column;\n}\n.atm-close-button[data-v-5a315eca] {\n    position: absolute;\n    top: 1rem;\n    right: 1rem;\n    color: var(--atm-text-tertiary);\n    background: transparent;\n    border: none;\n    cursor: pointer;\n    padding: 0.25rem;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10;\n    transition: color 0.2s;\n}\n.atm-close-button[data-v-5a315eca]:hover {\n    color: var(--atm-text-secondary);\n}\n.atm-icon[data-v-5a315eca] {\n    width: 1.5rem;\n    height: 1.5rem;\n}\n.atm-modal-content[data-v-5a315eca] {\n    padding: 1.25rem;\n    overflow-y: auto;\n    flex: 1;\n    min-height: 0;\n}\n.atm-modal-title[data-v-5a315eca] {\n    font-size: 1.125rem;\n    font-weight: 500;\n    color: var(--atm-text-primary);\n    margin: 0;\n    margin-bottom: 0.75rem;\n}\n@media (max-width: 768px) {\n.atm-overlay[data-v-5a315eca] {\n        padding: 1rem 0;\n}\n.atm-container[data-v-5a315eca] {\n        padding: 0 1rem;\n}\n.atm-modal[data-v-5a315eca] {\n        border-radius: 0.375rem;\n        max-height: calc(100vh - 2rem);\n}\n.atm-modal-content[data-v-5a315eca] {\n        padding: 1rem;\n}\n.atm-modal-title[data-v-5a315eca] {\n        font-size: 1rem;\n        margin-bottom: 0.75rem;\n}\n.atm-close-button[data-v-5a315eca] {\n        top: 0.75rem;\n        right: 0.75rem;\n}\n.atm-icon[data-v-5a315eca] {\n        width: 1.25rem;\n        height: 1.25rem;\n}\n}\n@media (max-width: 480px) {\n.atm-overlay[data-v-5a315eca] {\n        padding: 0.5rem 0;\n}\n.atm-container[data-v-5a315eca] {\n        padding: 0 0.5rem;\n}\n.atm-modal[data-v-5a315eca] {\n        border-radius: 0.25rem;\n        max-width: 100%;\n        max-height: calc(100vh - 1rem);\n}\n.atm-modal-content[data-v-5a315eca] {\n        padding: 0.875rem;\n}\n.atm-modal-title[data-v-5a315eca] {\n        font-size: 0.9375rem;\n        margin-bottom: 0.625rem;\n}\n.atm-close-button[data-v-5a315eca] {\n        top: 0.5rem;\n        right: 0.5rem;\n}\n}\n@media (max-width: 360px) {\n.atm-overlay[data-v-5a315eca] {\n        padding: 0.25rem 0;\n}\n.atm-container[data-v-5a315eca] {\n        padding: 0 0.25rem;\n}\n.atm-modal[data-v-5a315eca] {\n        max-height: calc(100vh - 0.5rem);\n}\n.atm-modal-content[data-v-5a315eca] {\n        padding: 0.75rem;\n}\n.atm-modal-title[data-v-5a315eca] {\n        font-size: 0.875rem;\n        margin-bottom: 0.5rem;\n}\n}\n\n.atm-notification-container[data-v-f5e47084] {\n    font-family: Arial, Helvetica, sans-serif;\n    position: fixed;\n    top: 20px;\n    right: 20px;\n    z-index: 99999;\n    pointer-events: none;\n}\n.atm-notification[data-v-f5e47084] {\n    padding: 12px 16px;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n    min-width: 250px;\n    max-width: 350px;\n    pointer-events: auto;\n}\n.atm-notification--error[data-v-f5e47084] {\n    background: #ff3333;\n    color: #FFF;\n}\n.atm-notification--success[data-v-f5e47084] {\n    background: #00a622;\n    color: #FFF;\n}\n.atm-notification--warning[data-v-f5e47084] {\n    background: #ffa500;\n    color: #FFF;\n}\n.atm-notification-enter-active[data-v-f5e47084] {\n    transition: all 0.3s ease-out;\n}\n.atm-notification-leave-active[data-v-f5e47084] {\n    transition: all 0.3s ease-in;\n}\n.atm-notification-enter-from[data-v-f5e47084] {\n    transform: translateX(100%);\n    opacity: 0;\n}\n.atm-notification-leave-to[data-v-f5e47084] {\n    transform: translateX(100%);\n    opacity: 0;\n}\n@media (max-width: 768px) {\n.atm-notification-container[data-v-f5e47084] {\n        top: 16px;\n        right: 16px;\n        left: 16px;\n}\n.atm-notification[data-v-f5e47084] {\n        min-width: auto;\n        max-width: 100%;\n        padding: 11px 14px;\n        font-size: 13px;\n}\n}\n@media (max-width: 480px) {\n.atm-notification-container[data-v-f5e47084] {\n        top: 12px;\n        right: 12px;\n        left: 12px;\n}\n.atm-notification[data-v-f5e47084] {\n        padding: 10px 12px;\n        font-size: 12px;\n        border-radius: 5px;\n}\n}\n@media (max-width: 360px) {\n.atm-notification-container[data-v-f5e47084] {\n        top: 10px;\n        right: 10px;\n        left: 10px;\n}\n.atm-notification[data-v-f5e47084] {\n        padding: 9px 11px;\n        font-size: 11px;\n        border-radius: 4px;\n}\n}\n\n.atm-login-container[data-v-b88e6b76] {\n    background: var(--atm-bg-primary);\n    border-radius: 8px;\n    font-family: 'Segoe UI', system-ui, sans-serif;\n    text-align: center;\n}\n.atm-logo-container[data-v-b88e6b76] {\n    margin-bottom: 12px;\n}\n.atm-logo-placeholder[data-v-b88e6b76] {\n    width: 44px;\n    height: 44px;\n    margin: 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: var(--atm-bg-tertiary);\n    border-radius: 50%;\n    color: var(--atm-text-muted);\n    font-size: 11px;\n}\n.atm-logo-image[data-v-b88e6b76] {\n    max-width: 44px;\n    max-height: 44px;\n    margin: 0 auto;\n    display: block;\n    border-radius: 4px;\n    object-fit: contain;\n}\n.atm-project-name[data-v-b88e6b76] {\n    margin: 0 0 4px 0;\n    font-size: 18px;\n    color: var(--v70f1a692);\n    font-weight: 600;\n}\n.atm-welcome-text[data-v-b88e6b76] {\n    margin: 0 0 16px 0;\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n}\n.atm-form-group[data-v-b88e6b76] {\n    margin-bottom: 12px;\n    text-align: left;\n}\n.atm-input-label[data-v-b88e6b76] {\n    display: block;\n    margin-bottom: 4px;\n    font-size: 13px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-input-field[data-v-b88e6b76] {\n    width: 100%;\n    padding: 8px 10px;\n    background: var(--atm-input-bg);\n    color: var(--atm-text-primary);\n    border: 1px solid var(--atm-input-border);\n    border-radius: 6px;\n    font-size: 14px;\n    box-sizing: border-box;\n    transition: border-color 0.2s;\n}\n.atm-input-field[data-v-b88e6b76]:focus {\n    outline: none;\n    border-color: var(--v70f1a692);\n    box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.1);\n}\n.atm-input-field[data-v-b88e6b76]:disabled {\n    background-color: var(--atm-input-disabled);\n    cursor: not-allowed;\n}\n.atm-field-error[data-v-b88e6b76] {\n    color: var(--atm-error-color);\n    font-size: 12px;\n    margin-top: 4px;\n    text-align: left;\n}\n.atm-alternative-options[data-v-b88e6b76] {\n    margin-top: 8px;\n    text-align: center;\n}\n.atm-forgot-password-link[data-v-b88e6b76] {\n    font-size: 12px;\n    background: none;\n    border: none;\n    color: var(--v4a1729f6);\n    cursor: pointer;\n    text-decoration: none;\n    padding: 0;\n    font-family: inherit;\n}\n.atm-forgot-password-link[data-v-b88e6b76]:hover:not(:disabled) {\n    text-decoration: underline;\n}\n.atm-forgot-password-link[data-v-b88e6b76]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n.atm-strategy-choice[data-v-b88e6b76] {\n    text-align: center;\n    margin-bottom: 12px;\n}\n.atm-strategy-title[data-v-b88e6b76] {\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n    margin-bottom: 12px;\n}\n.atm-strategy-buttons[data-v-b88e6b76] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n.atm-strategy-button[data-v-b88e6b76] {\n    width: 100%;\n    padding: 10px;\n    background: var(--atm-bg-secondary);\n    color: var(--atm-text-primary);\n    border: 1px solid var(--atm-border-color);\n    border-radius: 6px;\n    font-size: 14px;\n    cursor: pointer;\n    transition: all 0.2s;\n}\n.atm-strategy-button[data-v-b88e6b76]:hover:not(:disabled) {\n    background: var(--atm-bg-tertiary);\n    border-color: var(--v70f1a692);\n}\n.atm-strategy-button[data-v-b88e6b76]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n.atm-email-link-text[data-v-b88e6b76] {\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n    margin: 0;\n    text-align: center;\n}\n.atm-login-button[data-v-b88e6b76] {\n    width: 100%;\n    padding: 10px;\n    margin-top: 4px;\n    background: var(--v70f1a692);\n    color: #ffffff;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.2s;\n    min-height: 42px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.atm-login-button[data-v-b88e6b76]:hover:not(:disabled) {\n    opacity: 0.9;\n    transform: translateY(-1px);\n}\n.atm-login-button[data-v-b88e6b76]:disabled {\n    opacity: 0.8;\n    cursor: not-allowed;\n    transform: none;\n}\n.button-spinner[data-v-b88e6b76] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    color: #fff;\n    font-weight: 500;\n}\n.spinner-svg[data-v-b88e6b76] {\n    animation: spin-b88e6b76 1s linear infinite;\n    width: 18px;\n    height: 18px;\n    stroke: #fff;\n}\n.spinner-circle[data-v-b88e6b76] {\n    stroke-dasharray: 90, 150;\n    stroke-linecap: round;\n}\n@keyframes spin-b88e6b76 {\n0% {\n        transform: rotate(0deg);\n}\n100% {\n        transform: rotate(360deg);\n}\n}\n.atm-footer-links[data-v-b88e6b76] {\n    margin-top: 16px;\n    font-size: 13px;\n}\n.atm-signup-text[data-v-b88e6b76] {\n    color: var(--atm-text-secondary);\n    margin-bottom: 6px;\n}\n.atm-signup-link[data-v-b88e6b76] {\n    color: var(--v4a1729f6);\n    text-decoration: none;\n    cursor: pointer;\n}\n.atm-signup-link[data-v-b88e6b76]:hover {\n    text-decoration: underline;\n}\n.atm-powered-by[data-v-b88e6b76] {\n    color: var(--atm-text-tertiary);\n    font-size: 11px;\n    margin: 0;\n}\n@media (max-width: 768px) {\n.atm-project-name[data-v-b88e6b76] {\n        font-size: 17px;\n}\n.atm-welcome-text[data-v-b88e6b76] {\n        font-size: 13px;\n        margin-bottom: 14px;\n}\n.atm-form-group[data-v-b88e6b76] {\n        margin-bottom: 10px;\n}\n.atm-input-label[data-v-b88e6b76] {\n        font-size: 12px;\n        margin-bottom: 4px;\n}\n.atm-input-field[data-v-b88e6b76] {\n        padding: 8px 10px;\n        font-size: 13px;\n}\n.atm-login-button[data-v-b88e6b76] {\n        font-size: 13px;\n        padding: 9px;\n        min-height: 40px;\n}\n.atm-strategy-button[data-v-b88e6b76] {\n        padding: 9px;\n        font-size: 13px;\n}\n.atm-footer-links[data-v-b88e6b76] {\n        margin-top: 14px;\n        font-size: 12px;\n}\n}\n@media (max-width: 480px) {\n.atm-logo-placeholder[data-v-b88e6b76] {\n        width: 40px;\n        height: 40px;\n        font-size: 10px;\n}\n.atm-logo-image[data-v-b88e6b76] {\n        max-width: 40px;\n        max-height: 40px;\n}\n.atm-project-name[data-v-b88e6b76] {\n        font-size: 16px;\n        margin-bottom: 4px;\n}\n.atm-welcome-text[data-v-b88e6b76] {\n        font-size: 12px;\n        margin-bottom: 12px;\n}\n.atm-form-group[data-v-b88e6b76] {\n        margin-bottom: 10px;\n}\n.atm-input-label[data-v-b88e6b76] {\n        font-size: 12px;\n        margin-bottom: 3px;\n}\n.atm-input-field[data-v-b88e6b76] {\n        padding: 7px 9px;\n        font-size: 13px;\n}\n.atm-login-button[data-v-b88e6b76] {\n        font-size: 13px;\n        padding: 9px;\n        min-height: 38px;\n}\n.atm-forgot-password-link[data-v-b88e6b76] {\n        font-size: 11px;\n}\n.atm-strategy-title[data-v-b88e6b76] {\n        font-size: 13px;\n        margin-bottom: 10px;\n}\n.atm-strategy-button[data-v-b88e6b76] {\n        padding: 9px;\n        font-size: 13px;\n}\n.atm-email-link-text[data-v-b88e6b76] {\n        font-size: 13px;\n}\n.atm-footer-links[data-v-b88e6b76] {\n        margin-top: 12px;\n        font-size: 12px;\n}\n.atm-powered-by[data-v-b88e6b76] {\n        font-size: 10px;\n}\n.spinner-svg[data-v-b88e6b76] {\n        width: 16px;\n        height: 16px;\n}\n.button-spinner[data-v-b88e6b76] {\n        gap: 6px;\n}\n}\n@media (max-width: 360px) {\n.atm-logo-placeholder[data-v-b88e6b76] {\n        width: 36px;\n        height: 36px;\n        font-size: 9px;\n}\n.atm-logo-image[data-v-b88e6b76] {\n        max-width: 36px;\n        max-height: 36px;\n}\n.atm-project-name[data-v-b88e6b76] {\n        font-size: 15px;\n        margin-bottom: 3px;\n}\n.atm-welcome-text[data-v-b88e6b76] {\n        font-size: 11px;\n        margin-bottom: 10px;\n}\n.atm-form-group[data-v-b88e6b76] {\n        margin-bottom: 8px;\n}\n.atm-input-label[data-v-b88e6b76] {\n        font-size: 11px;\n        margin-bottom: 3px;\n}\n.atm-input-field[data-v-b88e6b76] {\n        padding: 6px 8px;\n        font-size: 12px;\n}\n.atm-login-button[data-v-b88e6b76] {\n        font-size: 12px;\n        padding: 8px;\n        min-height: 36px;\n}\n.atm-strategy-button[data-v-b88e6b76] {\n        padding: 8px;\n        font-size: 12px;\n}\n.atm-footer-links[data-v-b88e6b76] {\n        margin-top: 10px;\n        font-size: 11px;\n}\n.spinner-svg[data-v-b88e6b76] {\n        width: 14px;\n        height: 14px;\n}\n}\n\n.atm-signup-container[data-v-00e77670] {\n    width: 100%;\n    background: var(--atm-bg-primary);\n    border-radius: 8px;\n    font-family: 'Segoe UI', system-ui, sans-serif;\n    text-align: center;\n}\n.atm-logo-container[data-v-00e77670] {\n    margin-bottom: 12px;\n}\n.atm-logo-placeholder[data-v-00e77670] {\n    width: 44px;\n    height: 44px;\n    margin: 0 auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: var(--atm-bg-tertiary);\n    border-radius: 50%;\n    color: var(--atm-text-muted);\n    font-size: 11px;\n}\n.atm-logo-image[data-v-00e77670] {\n    max-width: 44px;\n    max-height: 44px;\n    margin: 0 auto;\n    display: block;\n    border-radius: 4px;\n    object-fit: contain;\n}\n.atm-project-name[data-v-00e77670] {\n    margin: 0 0 4px 0;\n    font-size: 18px;\n    color: var(--v68a45cdb);\n    font-weight: 600;\n}\n.atm-welcome-text[data-v-00e77670] {\n    margin: 0 0 16px 0;\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n}\n.atm-form-group[data-v-00e77670] {\n    margin-bottom: 12px;\n    text-align: left;\n}\n.atm-input-label[data-v-00e77670] {\n    display: block;\n    margin-bottom: 4px;\n    font-size: 13px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-input-field[data-v-00e77670] {\n    width: 100%;\n    padding: 8px 10px;\n    background: var(--atm-input-bg);\n    color: var(--atm-text-primary);\n    border: 1px solid var(--atm-input-border);\n    border-radius: 6px;\n    font-size: 14px;\n    box-sizing: border-box;\n    transition: border-color 0.2s;\n}\n.atm-input-field[data-v-00e77670]:focus {\n    outline: none;\n    border-color: var(--v68a45cdb);\n    box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.1);\n}\n.atm-input-field[data-v-00e77670]:disabled {\n    background-color: var(--atm-input-disabled);\n    cursor: not-allowed;\n}\n.atm-field-error[data-v-00e77670] {\n    color: var(--atm-error-color);\n    font-size: 12px;\n    margin-top: 4px;\n    text-align: left;\n}\n.atm-signup-button[data-v-00e77670] {\n    width: 100%;\n    padding: 10px;\n    margin-top: 4px;\n    background: var(--v68a45cdb);\n    color: #ffffff;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.2s;\n    min-height: 42px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.atm-signup-button[data-v-00e77670]:hover:not(:disabled) {\n    opacity: 0.9;\n    transform: translateY(-1px);\n}\n.atm-signup-button[data-v-00e77670]:disabled {\n    opacity: 0.8;\n    cursor: not-allowed;\n    transform: none;\n}\n.button-spinner[data-v-00e77670] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    color: #fff;\n    font-weight: 500;\n}\n.spinner-svg[data-v-00e77670] {\n    animation: spin-00e77670 1s linear infinite;\n    width: 18px;\n    height: 18px;\n    stroke: #fff;\n}\n.spinner-circle[data-v-00e77670] {\n    stroke-dasharray: 90, 150;\n    stroke-linecap: round;\n}\n@keyframes spin-00e77670 {\n0% {\n        transform: rotate(0deg);\n}\n100% {\n        transform: rotate(360deg);\n}\n}\n.atm-footer-links[data-v-00e77670] {\n    margin-top: 16px;\n    font-size: 13px;\n}\n.atm-login-text[data-v-00e77670] {\n    color: var(--atm-text-secondary);\n    margin-bottom: 6px;\n}\n.atm-login-link[data-v-00e77670] {\n    color: var(--acf3bbae);\n    text-decoration: none;\n    cursor: pointer;\n    transition: opacity 0.2s;\n}\n.atm-login-link[data-v-00e77670]:hover:not(.disabled-link) {\n    text-decoration: underline;\n}\n.atm-login-link.disabled-link[data-v-00e77670] {\n    opacity: 0.5;\n    cursor: not-allowed;\n    pointer-events: none;\n}\n.atm-powered-by[data-v-00e77670] {\n    color: var(--atm-text-tertiary);\n    font-size: 11px;\n    margin: 0;\n}\n@media (max-width: 768px) {\n.atm-project-name[data-v-00e77670] {\n        font-size: 17px;\n}\n.atm-welcome-text[data-v-00e77670] {\n        font-size: 13px;\n        margin-bottom: 14px;\n}\n.atm-form-group[data-v-00e77670] {\n        margin-bottom: 10px;\n}\n.atm-input-label[data-v-00e77670] {\n        font-size: 12px;\n        margin-bottom: 4px;\n}\n.atm-input-field[data-v-00e77670] {\n        padding: 8px 10px;\n        font-size: 13px;\n}\n.atm-signup-button[data-v-00e77670] {\n        font-size: 13px;\n        padding: 9px;\n        min-height: 40px;\n}\n.atm-footer-links[data-v-00e77670] {\n        margin-top: 14px;\n        font-size: 12px;\n}\n}\n@media (max-width: 480px) {\n.atm-logo-placeholder[data-v-00e77670] {\n        width: 40px;\n        height: 40px;\n        font-size: 10px;\n}\n.atm-logo-image[data-v-00e77670] {\n        max-width: 40px;\n        max-height: 40px;\n}\n.atm-project-name[data-v-00e77670] {\n        font-size: 16px;\n        margin-bottom: 4px;\n}\n.atm-welcome-text[data-v-00e77670] {\n        font-size: 12px;\n        margin-bottom: 12px;\n}\n.atm-form-group[data-v-00e77670] {\n        margin-bottom: 10px;\n}\n.atm-input-label[data-v-00e77670] {\n        font-size: 12px;\n        margin-bottom: 3px;\n}\n.atm-input-field[data-v-00e77670] {\n        padding: 7px 9px;\n        font-size: 13px;\n}\n.atm-signup-button[data-v-00e77670] {\n        font-size: 13px;\n        padding: 9px;\n        min-height: 38px;\n}\n.atm-footer-links[data-v-00e77670] {\n        margin-top: 12px;\n        font-size: 12px;\n}\n.atm-powered-by[data-v-00e77670] {\n        font-size: 10px;\n}\n.spinner-svg[data-v-00e77670] {\n        width: 16px;\n        height: 16px;\n}\n.button-spinner[data-v-00e77670] {\n        gap: 6px;\n}\n}\n@media (max-width: 360px) {\n.atm-logo-placeholder[data-v-00e77670] {\n        width: 36px;\n        height: 36px;\n        font-size: 9px;\n}\n.atm-logo-image[data-v-00e77670] {\n        max-width: 36px;\n        max-height: 36px;\n}\n.atm-project-name[data-v-00e77670] {\n        font-size: 15px;\n        margin-bottom: 3px;\n}\n.atm-welcome-text[data-v-00e77670] {\n        font-size: 11px;\n        margin-bottom: 10px;\n}\n.atm-form-group[data-v-00e77670] {\n        margin-bottom: 8px;\n}\n.atm-input-label[data-v-00e77670] {\n        font-size: 11px;\n        margin-bottom: 3px;\n}\n.atm-input-field[data-v-00e77670] {\n        padding: 6px 8px;\n        font-size: 12px;\n}\n.atm-signup-button[data-v-00e77670] {\n        font-size: 12px;\n        padding: 8px;\n        min-height: 36px;\n}\n.atm-footer-links[data-v-00e77670] {\n        margin-top: 10px;\n        font-size: 11px;\n}\n.spinner-svg[data-v-00e77670] {\n        width: 14px;\n        height: 14px;\n}\n}\n\n.atm-signin-btn[data-v-43bf662d] {\n    padding: 12px;\n    margin-top: 8px;\n    background: var(--v12e673a0);\n    color: #FFF;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: background 0.2s;\n    min-height: 44px;\n}\n.atm-signin-btn[data-v-43bf662d]:hover {\n    opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-signin-btn[data-v-43bf662d] {\n        padding: 11px;\n        font-size: 13px;\n        min-height: 42px;\n}\n}\n@media (max-width: 480px) {\n.atm-signin-btn[data-v-43bf662d] {\n        padding: 10px;\n        font-size: 13px;\n        min-height: 40px;\n}\n}\n@media (max-width: 360px) {\n.atm-signin-btn[data-v-43bf662d] {\n        padding: 9px;\n        font-size: 12px;\n        min-height: 38px;\n}\n}\n\n.atm-registration-disabled[data-v-b58cb91d] {\n    padding: 24px;\n    text-align: center;\n}\n.atm-disabled-message[data-v-b58cb91d] {\n    margin-bottom: 16px;\n    color: var(--atm-text-primary);\n}\n.atm-disabled-login-btn[data-v-b58cb91d] {\n    padding: 12px 24px;\n    background: #007bff;\n    color: #ffffff;\n    border: none;\n    border-radius: 6px;\n    cursor: pointer;\n    font-size: 14px;\n    font-weight: 500;\n    transition: opacity 0.2s;\n}\n.atm-disabled-login-btn[data-v-b58cb91d]:hover {\n    opacity: 0.9;\n}\n\n.atm-signup-btn[data-v-d9ac9b54] {\n    padding: 12px;\n    margin-top: 8px;\n    background: var(--v1c336c46);\n    color: #FFF;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: background 0.2s;\n    min-height: 44px;\n}\n.atm-signup-btn[data-v-d9ac9b54]:hover {\n    opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-signup-btn[data-v-d9ac9b54] {\n        padding: 11px;\n        font-size: 13px;\n        min-height: 42px;\n}\n}\n@media (max-width: 480px) {\n.atm-signup-btn[data-v-d9ac9b54] {\n        padding: 10px;\n        font-size: 13px;\n        min-height: 40px;\n}\n}\n@media (max-width: 360px) {\n.atm-signup-btn[data-v-d9ac9b54] {\n        padding: 9px;\n        font-size: 12px;\n        min-height: 38px;\n}\n}\n\n.atm-profile-container {\n    position: relative;\n    display: inline-block;\n    font-family: 'Segoe UI', system-ui, sans-serif;\n}\n.atm-profile-button {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    background: none;\n    border: none;\n    cursor: pointer;\n    padding: 8px 12px;\n    border-radius: 6px;\n    transition: background 0.2s;\n}\n.atm-profile-button:hover {\n    background: var(--atm-bg-secondary);\n}\n.atm-profile-avatar {\n    width: 32px;\n    height: 32px;\n    border-radius: 50%;\n    background-color: var(--v4c42b40c);\n    color: #ffffff;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 12px;\n    font-weight: 500;\n}\n.atm-profile-avatar.large {\n    width: 48px;\n    height: 48px;\n    font-size: 16px;\n}\n.atm-profile-avatar-img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    border-radius: 50%;\n}\n.atm-profile-name {\n    font-size: 14px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-profile-arrow {\n    width: 16px;\n    height: 16px;\n    color: var(--atm-text-primary);\n    transition: transform 0.2s;\n}\n.atm-rotate {\n    transform: rotate(180deg);\n}\n.atm-profile-menu {\n    position: absolute;\n    top: 100%;\n    width: 280px;\n    background: var(--atm-bg-primary);\n    border: 1px solid var(--atm-border-color);\n    border-radius: 8px;\n    box-shadow: var(--atm-shadow-md);\n    z-index: 1000;\n    overflow: hidden;\n    margin-top: 4px;\n}\n.atm-position-left {\n    left: 0;\n    right: auto;\n}\n.atm-position-right {\n    right: 0;\n    left: auto;\n}\n.atm-profile-info {\n    display: flex;\n    gap: 12px;\n    padding: 16px;\n    border-bottom: 1px solid var(--atm-border-color);\n}\n.atm-profile-details {\n    flex: 1;\n    min-width: 0;\n}\n.atm-profile-fullname {\n    margin: 0;\n    font-size: 14px;\n    font-weight: 600;\n    color: var(--atm-text-primary);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.atm-profile-email {\n    margin: 4px 0 0;\n    font-size: 13px;\n    color: var(--atm-text-secondary);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.atm-profile-options {\n    padding: 8px 0;\n}\n.atm-profile-option {\n    display: flex;\n    align-items: center;\n    width: 100%;\n    padding: 10px 16px;\n    background: none;\n    border: none;\n    text-align: left;\n    cursor: pointer;\n    font-size: 14px;\n    color: var(--atm-text-primary);\n    gap: 10px;\n    transition: background 0.2s;\n}\n.atm-profile-option:hover {\n    background: var(--atm-bg-secondary);\n}\n.atm-profile-icon {\n    width: 18px;\n    height: 18px;\n    color: var(--atm-text-secondary);\n}\n.atm-fade-enter-active,\n.atm-fade-leave-active {\n    transition: opacity 0.2s, transform 0.2s;\n}\n.atm-fade-enter-from,\n.atm-fade-leave-to {\n    opacity: 0;\n    transform: translateY(-10px);\n}\n.atm-profile-modal {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    z-index: 9999;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow-y: auto;\n    padding: 1.5rem;\n}\n.atm-profile-overlay {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: rgba(0, 0, 0, 0.5);\n    pointer-events: none;\n}\n.atm-profile-content {\n    position: relative;\n    width: 100%;\n    max-width: 450px;\n    background: var(--atm-bg-primary);\n    border-radius: 12px;\n    box-shadow: var(--atm-shadow-md);\n    z-index: 1;\n    max-height: calc(100vh - 3rem);\n    display: flex;\n    flex-direction: column;\n    margin: auto;\n}\n.atm-profile-header {\n    padding: 16px;\n    border-bottom: 1px solid var(--atm-border-color);\n    display: flex;\n    align-items: center;\n}\n.atm-profile-close {\n    background: none;\n    border: none;\n    font-size: 24px;\n    cursor: pointer;\n    padding: 8px;\n    margin-right: 12px;\n    color: var(--atm-text-secondary);\n    transition: color 0.2s;\n}\n.atm-profile-close:hover {\n    color: var(--atm-text-primary);\n}\n.atm-profile-title {\n    margin: 0;\n    font-size: 18px;\n    font-weight: 600;\n    color: var(--atm-text-primary);\n}\n.atm-profile-tabs {\n    display: flex;\n    border-bottom: 1px solid var(--atm-border-color);\n    background: var(--atm-bg-secondary);\n}\n.atm-tab {\n    flex: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 6px;\n    padding: 12px 16px;\n    background: none;\n    border: none;\n    cursor: pointer;\n    font-size: 14px;\n    font-weight: 500;\n    color: var(--atm-text-secondary);\n    transition: all 0.2s;\n}\n.atm-tab:hover {\n    background: var(--atm-bg-tertiary);\n    color: var(--atm-text-primary);\n}\n.atm-tab-active {\n    color: var(--v4c42b40c) !important;\n    background: var(--atm-bg-primary);\n    border-bottom: 2px solid var(--v4c42b40c);\n}\n.atm-tab-icon {\n    width: 16px;\n    height: 16px;\n}\n.atm-profile-body {\n    padding: 24px;\n    text-align: center;\n    overflow-y: auto;\n    flex: 1;\n    min-height: 0;\n}\n.atm-profile-avatar-large {\n    width: 80px;\n    height: 80px;\n    border-radius: 50%;\n    background-color: var(--v4c42b40c);\n    color: #ffffff;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 24px;\n    font-weight: 600;\n    margin: 0 auto 20px;\n}\n.atm-profile-info-grid {\n    width: 100%;\n    text-align: left;\n    margin-top: 20px;\n}\n.atm-profile-info-row {\n    display: flex;\n    flex-direction: column;\n    margin-bottom: 16px;\n}\n.atm-profile-info-label {\n    font-size: 13px;\n    color: var(--atm-text-secondary);\n    margin-bottom: 4px;\n}\n.atm-profile-info-value {\n    font-size: 16px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-profile-edit-form {\n    width: 100%;\n    text-align: left;\n    margin-top: 20px;\n}\n.atm-form-group {\n    margin-bottom: 16px;\n}\n.atm-input-label {\n    display: block;\n    margin-bottom: 6px;\n    font-size: 13px;\n    color: var(--atm-text-primary);\n    font-weight: 500;\n}\n.atm-input-field {\n    width: 100%;\n    padding: 10px 12px;\n    background: var(--atm-input-bg);\n    color: var(--atm-text-primary);\n    border: 1px solid var(--atm-input-border);\n    border-radius: 6px;\n    font-size: 14px;\n    box-sizing: border-box;\n    transition: border-color 0.2s;\n}\n.atm-input-field:focus {\n    outline: none;\n    border-color: var(--v4c42b40c);\n    box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.1);\n}\n.atm-form-actions {\n    display: flex;\n    gap: 12px;\n    margin-top: 24px;\n}\n.atm-save-btn,\n.atm-edit-profile-btn,\n.atm-reset-password-btn,\n.atm-add-email-btn {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px;\n    background: var(--v4c42b40c);\n    color: #FFF;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n    justify-content: center;\n}\n.atm-save-btn:hover,\n.atm-edit-profile-btn:hover,\n.atm-reset-password-btn:hover,\n.atm-add-email-btn:hover {\n    opacity: 0.9;\n}\n.atm-cancel-btn {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    flex: 1;\n    padding: 12px;\n    background: var(--atm-bg-secondary);\n    color: var(--atm-text-secondary);\n    border: 1px solid var(--atm-border-color);\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.2s;\n    justify-content: center;\n}\n.atm-cancel-btn:hover {\n    background: var(--atm-bg-tertiary);\n    color: var(--atm-text-primary);\n}\n.atm-btn-icon {\n    width: 16px;\n    height: 16px;\n}\n.atm-email-add-section {\n    margin-bottom: 24px;\n    text-align: left;\n}\n.atm-email-list {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n    text-align: left;\n}\n.atm-email-item {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px;\n    background: var(--atm-bg-secondary);\n    border-radius: 6px;\n    border: 1px solid var(--atm-border-color);\n}\n.atm-email-info {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    flex: 1;\n}\n.atm-email-address {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    color: var(--atm-text-primary);\n}\n.atm-email-icon {\n    width: 16px;\n    height: 16px;\n    color: var(--v955ac0f0);\n}\n.atm-email-badges {\n    display: flex;\n    gap: 6px;\n    flex-wrap: wrap;\n}\n.atm-badge {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    padding: 2px 8px;\n    font-size: 11px;\n    font-weight: 500;\n    border-radius: 12px;\n    text-transform: uppercase;\n}\n.atm-badge-icon {\n    width: 12px;\n    height: 12px;\n}\n.atm-badge-primary {\n    background: #e3f2fd;\n    color: #1976d2;\n}\n.atm-badge-verified {\n    background: #e8f5e8;\n    color: #2e7d32;\n}\n.atm-badge-unverified {\n    background: #fff3e0;\n    color: #f57c00;\n}\n.atm-email-actions {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n.atm-verify-btn {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    padding: 6px 12px;\n    background: var(--v4c42b40c);\n    color: white;\n    border: none;\n    border-radius: 4px;\n    font-size: 12px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n}\n.atm-verify-btn:hover {\n    opacity: 0.9;\n}\n.atm-delete-btn {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    padding: 6px 12px;\n    background: #dc3545;\n    color: white;\n    border: none;\n    border-radius: 4px;\n    font-size: 12px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n}\n.atm-delete-btn:hover {\n    opacity: 0.9;\n}\n.atm-password-section {\n    text-align: left;\n}\n.atm-sessions-section {\n    text-align: left;\n}\n.atm-sessions-info {\n    margin-bottom: 20px;\n}\n.atm-sessions-description {\n    margin: 0;\n    font-size: 14px;\n    color: var(--atm-text-secondary);\n    line-height: 1.5;\n}\n.atm-sessions-list {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n.atm-session-item {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px;\n    background: var(--atm-bg-secondary);\n    border-radius: 8px;\n    border: 1px solid var(--atm-border-color);\n    gap: 16px;\n}\n.atm-session-header {\n    display: flex;\n    gap: 12px;\n    align-items: flex-start;\n}\n.atm-session-icon {\n    width: 24px;\n    height: 24px;\n    color: var(--v955ac0f0);\n    flex-shrink: 0;\n}\n.atm-session-details {\n    flex: 1;\n    min-width: 0;\n}\n.atm-session-title {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    margin-bottom: 4px;\n    font-size: 15px;\n    font-weight: 600;\n    color: var(--atm-text-primary);\n}\n.atm-session-device-info {\n    font-size: 13px;\n    color: var(--atm-text-secondary);\n    margin-bottom: 8px;\n}\n.atm-badge-current {\n    background: #d1f4e0;\n    color: #0f9d58;\n}\n.atm-session-timestamps {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n.atm-session-timestamp {\n    display: flex;\n    gap: 6px;\n    font-size: 13px;\n    color: var(--atm-text-secondary);\n}\n.atm-timestamp-label {\n    font-weight: 500;\n    color: var(--atm-text-primary);\n}\n.atm-session-actions {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n.atm-close-session-btn {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    padding: 8px 14px;\n    background: #dc3545;\n    color: white;\n    border: none;\n    border-radius: 6px;\n    font-size: 13px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n    white-space: nowrap;\n}\n.atm-close-session-btn:hover {\n    opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-profile-button {\n        padding: 6px 10px;\n        gap: 6px;\n}\n.atm-profile-name {\n        font-size: 13px;\n}\n.atm-profile-menu {\n        width: 260px;\n}\n.atm-profile-modal {\n        padding: 1rem;\n}\n.atm-profile-content {\n        max-width: 90%;\n        max-height: calc(100vh - 2rem);\n}\n.atm-profile-header {\n        padding: 14px;\n}\n.atm-profile-title {\n        font-size: 16px;\n}\n.atm-profile-body {\n        padding: 20px;\n}\n.atm-tab {\n        padding: 10px 12px;\n        font-size: 13px;\n        gap: 4px;\n}\n.atm-tab-icon {\n        width: 14px;\n        height: 14px;\n}\n.atm-profile-avatar-large {\n        width: 70px;\n        height: 70px;\n        font-size: 22px;\n}\n.atm-email-item {\n        flex-direction: column;\n        gap: 12px;\n        align-items: flex-start;\n}\n.atm-email-actions {\n        flex-direction: row;\n        width: 100%;\n}\n.atm-verify-btn,\n    .atm-delete-btn {\n        flex: 1;\n        justify-content: center;\n}\n.atm-session-item {\n        flex-direction: column;\n        align-items: flex-start;\n}\n.atm-session-actions {\n        width: 100%;\n}\n.atm-close-session-btn {\n        width: 100%;\n        justify-content: center;\n}\n}\n@media (max-width: 480px) {\n.atm-profile-button {\n        padding: 4px 8px;\n        gap: 4px;\n}\n.atm-profile-avatar {\n        width: 28px;\n        height: 28px;\n        font-size: 11px;\n}\n.atm-profile-avatar.large {\n        width: 40px;\n        height: 40px;\n        font-size: 14px;\n}\n.atm-profile-name {\n        font-size: 12px;\n}\n.atm-profile-arrow {\n        width: 14px;\n        height: 14px;\n}\n.atm-profile-menu {\n        width: calc(100vw - 20px);\n        max-width: 240px;\n}\n.atm-profile-info {\n        padding: 12px;\n        gap: 10px;\n}\n.atm-profile-fullname {\n        font-size: 13px;\n}\n.atm-profile-email {\n        font-size: 12px;\n}\n.atm-profile-option {\n        padding: 8px 12px;\n        font-size: 13px;\n        gap: 8px;\n}\n.atm-profile-icon {\n        width: 16px;\n        height: 16px;\n}\n.atm-profile-modal {\n        padding: 0.5rem;\n}\n.atm-profile-content {\n        max-width: 95%;\n        max-height: calc(100vh - 1rem);\n}\n.atm-profile-header {\n        padding: 12px;\n}\n.atm-profile-close {\n        font-size: 20px;\n        padding: 4px;\n        margin-right: 8px;\n}\n.atm-profile-title {\n        font-size: 15px;\n}\n.atm-profile-body {\n        padding: 16px;\n}\n.atm-tab {\n        padding: 8px 8px;\n        font-size: 12px;\n        gap: 3px;\n}\n.atm-tab-icon {\n        width: 13px;\n        height: 13px;\n}\n.atm-profile-avatar-large {\n        width: 60px;\n        height: 60px;\n        font-size: 20px;\n        margin-bottom: 16px;\n}\n.atm-profile-info-label {\n        font-size: 12px;\n}\n.atm-profile-info-value {\n        font-size: 14px;\n}\n.atm-input-label {\n        font-size: 12px;\n}\n.atm-input-field {\n        padding: 8px 10px;\n        font-size: 13px;\n}\n.atm-form-actions {\n        flex-direction: column;\n        gap: 8px;\n}\n.atm-save-btn,\n    .atm-cancel-btn,\n    .atm-edit-profile-btn,\n    .atm-reset-password-btn {\n        width: 100%;\n        padding: 10px;\n        font-size: 13px;\n}\n.atm-email-item {\n        padding: 10px;\n}\n.atm-email-address {\n        font-size: 13px;\n}\n.atm-badge {\n        font-size: 10px;\n        padding: 2px 6px;\n}\n}\n@media (max-width: 360px) {\n.atm-profile-button {\n        padding: 4px 6px;\n}\n.atm-profile-avatar {\n        width: 26px;\n        height: 26px;\n        font-size: 10px;\n}\n.atm-profile-name {\n        display: none;\n}\n.atm-profile-menu {\n        width: calc(100vw - 16px);\n        max-width: 220px;\n}\n.atm-profile-modal {\n        padding: 0.25rem;\n}\n.atm-profile-content {\n        max-width: 98%;\n        max-height: calc(100vh - 0.5rem);\n}\n.atm-profile-body {\n        padding: 12px;\n}\n.atm-tab {\n        padding: 8px 6px;\n        font-size: 11px;\n        flex-direction: column;\n        gap: 2px;\n}\n.atm-profile-avatar-large {\n        width: 50px;\n        height: 50px;\n        font-size: 18px;\n}\n.atm-email-item {\n        padding: 8px;\n}\n}\n\n.atm-auth-buttons[data-v-0c63ecb8] {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 16px;\n}\n@media (max-width: 768px) {\n.atm-auth-buttons[data-v-0c63ecb8] {\n        gap: 14px;\n}\n}\n@media (max-width: 480px) {\n.atm-auth-buttons[data-v-0c63ecb8] {\n        gap: 12px;\n        flex-direction: column;\n}\n}\n@media (max-width: 360px) {\n.atm-auth-buttons[data-v-0c63ecb8] {\n        gap: 10px;\n}\n}\n\n.atm-logout-btn[data-v-fc53d394] {\n    padding: 12px;\n    margin-top: 8px;\n    background: var(--v3d3b8ec0);\n    color: #FFF;\n    border: none;\n    border-radius: 6px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: opacity 0.2s;\n    min-height: 44px;\n}\n.atm-logout-btn[data-v-fc53d394]:hover {\n    opacity: 0.9;\n}\n@media (max-width: 768px) {\n.atm-logout-btn[data-v-fc53d394] {\n        padding: 11px;\n        font-size: 13px;\n        min-height: 42px;\n}\n}\n@media (max-width: 480px) {\n.atm-logout-btn[data-v-fc53d394] {\n        padding: 10px;\n        font-size: 13px;\n        min-height: 40px;\n}\n}\n@media (max-width: 360px) {\n.atm-logout-btn[data-v-fc53d394] {\n        padding: 9px;\n        font-size: 12px;\n        min-height: 38px;\n}\n}\n";
                         document.head.appendChild(style);
                     }
                     })();
@@ -772,8 +772,8 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
   emits: ["completed", "sign-in"],
   setup(__props, { emit: __emit }) {
     vue.useCssVars((_ctx) => ({
-      "v2dc4b763": atmPrimaryColor.value,
-      "b00c0a9e": atmSecondaryColor.value
+      "v68a45cdb": atmPrimaryColor.value,
+      "acf3bbae": atmSecondaryColor.value
     }));
     const props = __props;
     const emit = __emit;
@@ -906,7 +906,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
         showNotification("Conta criada com sucesso!", "success");
         const deviceToken = await getDeviceToken(client);
         const signInStep = await client.auth().signInByEmailAddress(form.value.email_address, deviceToken);
-        const attemptToken = signInStep.token;
+        const attemptToken = signInStep.sign_in_attempt_token;
         if (!attemptToken) {
           throw new Error("Token de tentativa não encontrado");
         }
@@ -1081,7 +1081,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const SignUp = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-83e9452d"]]);
+const SignUp = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-00e77670"]]);
 const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
   __name: "SignInModal",
   props: {
@@ -1440,11 +1440,13 @@ const _hoisted_65 = { class: "atm-session-actions" };
 const _hoisted_66 = ["onClick"];
 const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   __name: "UserProfile",
-  setup(__props) {
+  emits: ["logout"],
+  setup(__props, { emit: __emit }) {
     vue.useCssVars((_ctx) => ({
-      "feed21a4": atmPrimaryColor.value,
-      "v5c6febbc": atmSecondaryColor.value
+      "v4c42b40c": atmPrimaryColor.value,
+      "v955ac0f0": atmSecondaryColor.value
     }));
+    const emit = __emit;
     const { user, logout } = useAuth();
     const { configurations } = useAtm();
     const atmPrimaryColor = vue.computed(() => configurations.value?.design?.primaryColor);
@@ -1663,9 +1665,10 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
         showNotification(error.message || "Erro ao atualizar perfil", "error");
       }
     };
-    const logoutUser = () => {
-      logout();
+    const logoutUser = async () => {
+      await logout();
       isDropdownOpen.value = false;
+      emit("logout");
     };
     const sendResetPasswordLink = async () => {
       if (!user.value?.primaryEmailAddress) {
@@ -2295,23 +2298,29 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
 const AuthSwitcher = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-0c63ecb8"]]);
 const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
   __name: "SignOutButton",
-  setup(__props) {
+  emits: ["logout"],
+  setup(__props, { emit: __emit }) {
     vue.useCssVars((_ctx) => ({
-      "v2ec0f896": atmPrimaryColor.value
+      "v3d3b8ec0": atmPrimaryColor.value
     }));
     const { logout, user } = useAuth();
     const { configurations } = useAtm();
+    const emit = __emit;
     const atmPrimaryColor = vue.computed(() => configurations.value?.design?.primaryColor);
+    const handleLogout = async () => {
+      await logout();
+      emit("logout");
+    };
     return (_ctx, _cache) => {
       return vue.unref(user) ? (vue.openBlock(), vue.createElementBlock("button", {
         key: 0,
-        onClick: _cache[0] || (_cache[0] = ($event) => vue.unref(logout)()),
+        onClick: handleLogout,
         class: "atm-logout-btn"
       }, " Sair ")) : vue.createCommentVNode("", true);
     };
   }
 });
-const SignOutButton = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-7157f989"]]);
+const SignOutButton = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-fc53d394"]]);
 const _hoisted_1$1 = { key: 0 };
 const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
   __name: "SignedIn",