:root{--breakpoint-mobile: 768px;--breakpoint-tablet: 1024px;--breakpoint-desktop: 1400px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 48px;--header-height: 64px;--footer-height: 56px;--sidebar-width: 320px;--sidebar-width-narrow: 280px;--sidebar-width-collapsed: 0px;--right-panel-width: 300px;--color-primary: #8b5cf6;--color-primary-light: #a78bfa;--color-secondary: #fbbf24;--color-success: #10b981;--color-error: #ef4444;--color-bg-dark: #0d0d0d;--color-bg-light: #1a1a1a;--color-text: #e5e5e5;--color-text-muted: #999;--color-border: rgba(139, 92, 246, .3);--transition-fast: .2s ease;--transition-normal: .3s ease;--transition-slow: .5s ease;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--color-text);background:linear-gradient(135deg,var(--color-bg-light) 0%,var(--color-bg-dark) 100%);line-height:1.6;min-height:100vh;overflow-x:hidden}.app-layout{display:flex;flex-direction:column;min-height:100vh}.app-header{position:fixed;top:0;left:0;right:0;height:var(--header-height);display:flex;align-items:center;justify-content:space-between;padding:0 var(--spacing-lg);background:linear-gradient(135deg,#8b5cf633,#fbbf241f,#8b5cf626);border-bottom:1px solid var(--color-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 4px 20px #0000004d,0 0 40px #8b5cf61a;z-index:1000;transition:all var(--transition-normal)}.app-header:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(139,92,246,.5),rgba(251,191,36,.5),transparent)}.header-left{display:flex;align-items:center;flex-shrink:0}.logo{display:flex;align-items:center;gap:var(--spacing-sm);transition:transform var(--transition-fast)}.logo:hover{transform:scale(1.02)}.logo-icon{color:var(--color-primary);filter:drop-shadow(0 0 8px rgba(139,92,246,.5));transition:all var(--transition-fast)}.logo:hover .logo-icon{color:var(--color-secondary);filter:drop-shadow(0 0 12px rgba(251,191,36,.6))}.logo-text{font-size:18px;font-weight:700;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.3px}.version-tag{display:inline-block;padding:2px 8px;background:#8b5cf633;color:var(--color-primary-light);font-size:10px;font-weight:500;border-radius:10px;border:1px solid rgba(139,92,246,.3);margin-left:var(--spacing-xs)}.header-right{display:flex;align-items:center;gap:var(--spacing-md)}.user-stats{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-xs) var(--spacing-md);background:#0003;border-radius:var(--radius-md);border:1px solid rgba(255,255,255,.05)}.stat-item{display:flex;align-items:center;gap:var(--spacing-xs);font-size:13px;color:var(--color-text-muted);transition:all var(--transition-fast)}.stat-item.points{padding-right:var(--spacing-md);border-right:1px solid rgba(255,255,255,.1)}.stat-item.points svg{color:var(--color-secondary);filter:drop-shadow(0 0 4px rgba(251,191,36,.4))}.stat-item.points span:not(:first-child){color:var(--color-secondary);font-weight:600;font-size:14px;text-shadow:0 0 10px rgba(251,191,36,.3)}.stat-item.code{font-size:12px}.stat-item.code code{color:var(--color-primary-light);font-size:11px;font-family:SF Mono,Consolas,monospace;background:#8b5cf61a;padding:2px 6px;border-radius:4px;letter-spacing:.5px}.header-btn{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:#ef44441a;color:var(--color-error);border:1px solid rgba(239,68,68,.3);border-radius:var(--radius-sm);font-size:13px;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.header-btn:active{background:#ef44444d}.header-btn svg{transition:color var(--transition-fast)}.mobile-menu-btn{display:none;padding:var(--spacing-sm);background:#8b5cf61a;border:1px solid rgba(139,92,246,.2);border-radius:var(--radius-sm);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast)}.mobile-menu-btn:active{transform:scale(.95)}.main-layout{display:flex;margin-top:var(--header-height);min-height:calc(100vh - var(--header-height) - var(--footer-height))}.sidebar{position:sticky;top:var(--header-height);height:calc(100vh - var(--header-height));overflow-y:auto;padding:var(--spacing-lg);background:#1a1a1a99;border-right:1px solid var(--color-border);transition:transform var(--transition-normal),width var(--transition-normal)}.sidebar-section{margin-bottom:var(--spacing-lg);padding:var(--spacing-md);background:#2a2a2a66;border:1px solid rgba(139,92,246,.2);border-radius:var(--radius-md)}.sidebar-section h3{display:flex;align-items:center;gap:var(--spacing-sm);font-size:14px;font-weight:600;color:var(--color-primary-light);margin-bottom:var(--spacing-md)}.sidebar-section h3 svg{color:var(--color-secondary)}.sidebar.history-sidebar{width:500px;padding:var(--spacing-lg)}.sidebar-header{margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-md);border-bottom:1px solid rgba(139,92,246,.2)}.sidebar-header h3{display:flex;align-items:center;gap:var(--spacing-sm);font-size:16px;font-weight:600;color:var(--color-primary-light);margin:0}.sidebar-header h3 svg{color:var(--color-secondary);flex-shrink:0}.history-list{display:flex;flex-direction:column;gap:var(--spacing-sm);max-height:calc(100vh - var(--header-height) - 120px);overflow-y:auto;padding-right:var(--spacing-xs)}.history-item{display:flex;flex-direction:column;gap:var(--spacing-xs);padding:var(--spacing-md);background:#2a2a2a80;border:1px solid rgba(139,92,246,.15);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast)}.history-item:hover{background:#8b5cf61a;border-color:#8b5cf64d}.history-item:active{background:#8b5cf626}.history-item.active{background:#8b5cf626;border-color:#8b5cf666}.history-item-header{display:flex;justify-content:space-between;align-items:center}.type-badge{display:inline-flex;align-items:center;padding:2px 8px;font-size:10px;font-weight:600;border-radius:10px;text-transform:uppercase;letter-spacing:.5px}.type-badge.pro{background:linear-gradient(135deg,#8b5cf64d,#a78bfa4d);color:var(--color-primary-light);border:1px solid rgba(139,92,246,.4)}.type-badge.normal,.type-badge.basic{background:#6b728033;color:#9ca3af;border:1px solid rgba(107,114,128,.3)}.type-badge.premium{background:linear-gradient(135deg,#fbbf244d,#f59e0b4d);color:var(--color-secondary);border:1px solid rgba(251,191,36,.4)}.fetch-time{font-size:11px;color:var(--color-text-muted)}.history-item-email{font-size:13px;color:var(--color-text);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-item-details{display:flex;flex-direction:column;gap:6px;margin-top:var(--spacing-sm)}.history-detail-row{display:flex;align-items:flex-start;font-size:12px;line-height:1.4}.history-detail-label{color:var(--color-text-muted);flex-shrink:0;min-width:45px}.history-detail-value{color:var(--color-text);word-break:break-all;flex:1}.history-detail-url{color:var(--color-primary-light);font-size:11px;word-break:break-all}.history-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-md);padding:var(--spacing-2xl) var(--spacing-lg);text-align:center}.history-empty svg{color:var(--color-text-muted);opacity:.5}.history-empty p{font-size:14px;color:var(--color-text-muted);margin:0}.sidebar-overlay{display:none;position:fixed;top:var(--header-height);left:0;right:0;bottom:0;background:#00000080;z-index:899;opacity:0;transition:opacity var(--transition-normal)}.sidebar-overlay.active{display:block;opacity:1}.main-content{padding:var(--spacing-lg);min-height:calc(100vh - var(--header-height) - var(--footer-height));max-width:900px;margin:0 auto;width:100%}.stats-panel{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-lg);max-width:600px;margin-left:auto;margin-right:auto}.stats-panel.compact{grid-template-columns:repeat(2,1fr);gap:var(--spacing-lg);max-width:500px}.stat-card{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:#2a2a2a99;border:1px solid rgba(139,92,246,.2);border-radius:var(--radius-md);transition:all var(--transition-fast);position:relative;overflow:hidden}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(139,92,246,.3),transparent);opacity:0;transition:opacity var(--transition-fast)}.stat-card:hover:before{opacity:1}.stat-card.highlight{background:linear-gradient(135deg,#8b5cf626,#fbbf241a);border-color:#fbbf244d}.stat-card.highlight:before{background:linear-gradient(90deg,transparent,rgba(251,191,36,.5),transparent)}.stat-card.highlight:hover{border-color:#fbbf2480}.stat-card .stat-icon{font-size:28px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:#8b5cf61a;border-radius:var(--radius-sm);flex-shrink:0;transition:all var(--transition-fast)}.stat-card.highlight .stat-icon{background:#fbbf2426}.stat-card .stat-info{display:flex;flex-direction:column;gap:2px;min-width:0}.stat-card .stat-value{font-size:24px;font-weight:700;color:var(--color-text);line-height:1.2;transition:all var(--transition-fast)}.stat-card.highlight .stat-value{color:var(--color-secondary);text-shadow:0 0 20px rgba(251,191,36,.4)}.stat-card .stat-label{font-size:12px;color:var(--color-text-muted);font-weight:500;letter-spacing:.3px}.stat-card .stat-value.updating{animation:statPulse .3s ease-out}@keyframes statPulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.app-footer{display:flex;align-items:center;justify-content:space-between;height:var(--footer-height);padding:0 var(--spacing-xl);background:linear-gradient(180deg,#1a1a1ae6,#0d0d0df2);border-top:1px solid var(--color-border);font-size:12px;color:var(--color-text-muted);position:relative;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.app-footer:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(139,92,246,.4),rgba(251,191,36,.3),transparent)}.footer-left{display:flex;align-items:center;gap:var(--spacing-sm)}.footer-left span{display:flex;align-items:center;gap:var(--spacing-xs);color:var(--color-text-muted);font-weight:500;transition:color var(--transition-fast)}.footer-left span:hover{color:var(--color-primary-light)}.footer-center{display:flex;align-items:center;gap:var(--spacing-lg)}.footer-center a{display:inline-flex;align-items:center;gap:var(--spacing-xs);color:var(--color-text-muted);text-decoration:none;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);transition:all var(--transition-fast);position:relative}.footer-center a:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:1px;background:linear-gradient(90deg,var(--color-primary),var(--color-secondary));transition:all var(--transition-fast);transform:translate(-50%)}.footer-center a:hover:after{width:80%}.footer-center a:active{transform:scale(.98)}.footer-right{display:flex;align-items:center;gap:var(--spacing-sm)}.footer-right span{color:var(--color-text-muted);font-size:11px;opacity:.8;transition:opacity var(--transition-fast)}.footer-right span:hover{opacity:1}.container{max-width:480px;margin:0 auto;animation:fadeIn .5s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.hidden{display:none!important}.icon,.btn-icon{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;flex-shrink:0}.info-content h3 .icon{margin-right:6px;color:#fbbf24}.btn-icon{width:16px;height:16px}.header{text-align:center;margin-bottom:24px;padding:20px;background:linear-gradient(135deg,#8b5cf61a,#fbbf241a);border-radius:16px;border:1px solid rgba(139,92,246,.3)}.header h1{font-size:24px;font-weight:700;background:linear-gradient(135deg,#8b5cf6,#fbbf24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px;letter-spacing:-.5px}.subtitle{font-size:13px;color:#999;font-weight:400}.version-tag{display:inline-block;margin-top:8px;padding:2px 8px;background:#8b5cf633;color:#a78bfa;font-size:11px;border-radius:10px}.input-section-container{margin-bottom:16px}.input-section{display:flex;gap:10px;align-items:stretch}.input-wrapper{flex:1;position:relative;display:flex;align-items:center}#activation-code{flex:1;width:100%;padding:12px 16px;background:#2a2a2a99;color:#e5e5e5;border:2px solid rgba(139,92,246,.3);border-radius:12px;font-size:14px;font-family:inherit;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}#activation-code::placeholder{color:#666}#activation-code:focus{outline:none;border-color:#8b5cf6;background:#2a2a2acc;box-shadow:0 0 0 4px #8b5cf61a}#verify-btn{display:flex;align-items:center;gap:8px;padding:12px 24px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:12px;cursor:pointer;font-size:14px;font-weight:600;font-family:inherit;transition:all .3s ease;white-space:nowrap;box-shadow:0 4px 16px #10b98166}#verify-btn:hover:not(:disabled){background:linear-gradient(135deg,#34d399,#10b981)}#verify-btn:active:not(:disabled){background:linear-gradient(135deg,#10b981,#059669)}#verify-btn:disabled{opacity:.4;cursor:not-allowed;background:#10b98133;box-shadow:none}.error-message{padding:12px 16px;background:#ef44441a;color:#ef4444;border:2px solid rgba(239,68,68,.3);border-radius:12px;margin-top:12px;font-size:13px;display:none;align-items:center;gap:10px}.error-message.show{display:flex}.error-message:before{content:"⚠";font-size:16px;flex-shrink:0}.activated-section{margin-top:20px;padding:20px;background:linear-gradient(135deg,#10b9811a,#8b5cf61a);border:2px solid rgba(16,185,129,.3);border-radius:16px;animation:fadeIn .3s ease-out}.activation-info{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px;padding:16px;background:#0000004d;border-radius:12px}.activation-info .info-row{flex:1;min-width:100px;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative}.activation-info .info-label{font-size:12px;color:#888;margin-bottom:0}.code-value{font-size:11px;font-weight:500;color:#8b5cf6;word-break:break-all;text-align:center}.points-value{font-size:22px;font-weight:700;color:#fbbf24;text-shadow:0 0 20px rgba(251,191,36,.5)}.expire-value{font-size:14px;font-weight:500;color:#10b981}.expire-value.expire-error{color:#ef4444;font-weight:600}.expire-value.expire-warning{color:#fbbf24;font-weight:600}.expire-value.expire-permanent{color:#10b981;font-weight:600}.expire-value.expire-valid{color:#10b981;font-weight:500}.account-type-section{margin-bottom:20px}.account-type-section label{display:block;font-size:14px;color:#999;margin-bottom:12px}.account-type-options{display:flex;flex-wrap:wrap;gap:12px}.loading-types,.no-types{width:100%;text-align:center;padding:16px;color:#999;font-size:13px;background:#2a2a2a66;border-radius:12px;border:1px dashed rgba(139,92,246,.3)}.account-type-option{flex:1;min-width:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:14px 16px;background:#2a2a2a99;border:2px solid rgba(139,92,246,.3);border-radius:12px;cursor:pointer;transition:all .3s ease;text-align:center}.account-type-option.selected{border-color:#8b5cf6;background:#8b5cf626}.account-type-option input[type=radio]{width:18px;height:18px;margin:10px 0 0;flex-shrink:0;accent-color:#8b5cf6;cursor:pointer}.option-label{font-size:14px;color:#e5e5e5;transition:all .3s ease;line-height:1.4}.account-type-option.selected .option-label{color:#8b5cf6;font-weight:600}.option-points{font-size:12px;color:#fbbf24;line-height:1.4}.fetch-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;border:none;border-radius:12px;cursor:pointer;font-size:16px;font-weight:600;font-family:inherit;transition:all .3s ease;box-shadow:0 4px 16px #8b5cf666}.fetch-btn:active:not(:disabled){background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.fetch-btn:disabled{opacity:.4;cursor:not-allowed;background:#8b5cf633;box-shadow:none}.history-btn{width:100%;margin-top:12px;display:none;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:#8b5cf61a;color:#a78bfa;border:1px solid rgba(139,92,246,.3);border-radius:12px;cursor:pointer;font-size:14px;font-weight:500;font-family:inherit;transition:all .3s ease}.history-btn:hover{background:#8b5cf633;border-color:#8b5cf680}.logout-btn{width:100%;margin-top:12px;padding:10px 24px;background:transparent;color:#888;border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;font-size:13px;font-family:inherit;transition:all .3s ease}.logout-btn:hover{color:#ef4444;border-color:#ef44444d;background:#ef44441a}.current-email-card{margin-top:20px;background:linear-gradient(145deg,#1e1e2e,#181825);border:1px solid rgba(139,92,246,.3);border-radius:16px;overflow:hidden;animation:fadeIn .3s ease-out}.current-email-card.enhanced{margin-top:var(--spacing-lg);background:linear-gradient(145deg,#1e1e2ef2,#181825fa);border:2px solid rgba(139,92,246,.35);border-radius:var(--radius-lg);box-shadow:0 8px 32px #0000004d,0 0 60px #8b5cf614,inset 0 1px #ffffff0d;transition:all var(--transition-normal)}.current-email-card.enhanced:hover{border-color:#8b5cf680;box-shadow:0 12px 40px #0006,0 0 80px #8b5cf61f,inset 0 1px #ffffff14}.current-email-card.enhanced .card-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) var(--spacing-lg);background:linear-gradient(90deg,#8b5cf62e,#fbbf241f);border-bottom:1px solid rgba(139,92,246,.2)}.current-email-card.enhanced .card-header-left{display:flex;align-items:center;gap:var(--spacing-sm)}.current-email-card.enhanced .card-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;font-size:13px;font-weight:600;border-radius:20px;box-shadow:0 2px 8px #8b5cf666}.current-email-card.enhanced .card-time{font-size:12px;color:var(--color-text-muted);background:#0003;padding:4px 10px;border-radius:12px}.current-email-card.enhanced .card-body{padding:var(--spacing-lg)}.credential-row{margin-bottom:var(--spacing-md)}.credential-row:last-child{margin-bottom:0}.credential-label{display:block;font-size:12px;font-weight:500;color:var(--color-text-muted);margin-bottom:var(--spacing-xs);text-transform:uppercase;letter-spacing:.5px}.credential-value{display:flex;align-items:center;gap:var(--spacing-sm)}.credential-input{flex:1;padding:12px 16px;background:#00000059;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);font-family:SF Mono,Consolas,Monaco,monospace;font-size:14px;color:var(--color-text);transition:all var(--transition-fast)}.credential-input:focus{outline:none;border-color:#8b5cf680;background:#00000073;box-shadow:0 0 0 3px #8b5cf61a}.credential-input.mono{letter-spacing:1px}.credential-copy{display:inline-flex;align-items:center;gap:6px;padding:10px 14px;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#000;border:none;border-radius:var(--radius-sm);font-size:12px;font-weight:600;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.credential-copy:hover{background:linear-gradient(135deg,#fcd34d,#fbbf24)}.credential-copy:active{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.toggle-password-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#8b5cf61a;border:1px solid rgba(139,92,246,.2);border-radius:var(--radius-sm);color:var(--color-primary-light);cursor:pointer;transition:all var(--transition-fast)}.toggle-password-btn:hover{background:#8b5cf633;border-color:#8b5cf666}.toggle-password-btn .eye-icon{transition:color var(--transition-fast)}.open-url-btn{display:inline-flex;align-items:center;gap:6px;padding:10px 14px;background:#10b98126;color:var(--color-success);border:1px solid rgba(16,185,129,.3);border-radius:var(--radius-sm);font-size:12px;font-weight:600;text-decoration:none;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.open-url-btn:hover{background:#10b98140;border-color:#10b98180}.totp-display-section{margin-top:var(--spacing-lg);padding:var(--spacing-lg);background:linear-gradient(135deg,#10b98114,#8b5cf614);border:1px solid rgba(16,185,129,.25);border-radius:var(--radius-md)}.totp-label{text-align:center;margin-bottom:var(--spacing-md)!important;color:var(--color-success)!important}.totp-display-container{display:flex;align-items:center;justify-content:center;gap:var(--spacing-xl);margin-bottom:var(--spacing-md)}.totp-code-large{display:flex;align-items:center;gap:8px}.totp-digit{display:flex;align-items:center;justify-content:center;width:48px;height:60px;background:#0006;border:2px solid rgba(16,185,129,.3);border-radius:var(--radius-sm);font-family:SF Mono,Consolas,Monaco,monospace;font-size:32px;font-weight:700;color:var(--color-success);text-shadow:0 0 20px rgba(16,185,129,.5);transition:all var(--transition-fast)}.totp-separator{width:8px;height:8px;background:#10b98180;border-radius:50%;margin:0 4px}.totp-timer-ring{position:relative;width:80px;height:80px;flex-shrink:0}.timer-ring-svg{width:100%;height:100%;transform:rotate(-90deg)}.timer-ring-bg{fill:none;stroke:#ffffff1a;stroke-width:6}.timer-ring-progress{fill:none;stroke:var(--color-success);stroke-width:6;stroke-linecap:round;stroke-dasharray:283;stroke-dashoffset:0;transition:stroke-dashoffset 1s linear,stroke .3s ease;filter:drop-shadow(0 0 6px rgba(16,185,129,.5))}.timer-ring-progress.warning{stroke:var(--color-error);filter:drop-shadow(0 0 6px rgba(239,68,68,.5))}.timer-ring-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;font-weight:700;color:var(--color-text);font-family:SF Mono,Consolas,monospace}.totp-copy-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);width:100%;padding:14px 24px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:var(--radius-md);font-size:15px;font-weight:600;cursor:pointer;transition:all var(--transition-fast);box-shadow:0 4px 16px #10b9814d}.totp-copy-btn:hover{background:linear-gradient(135deg,#34d399,#10b981)}.totp-copy-btn:active{background:linear-gradient(135deg,#10b981,#059669)}.card-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:linear-gradient(90deg,#8b5cf626,#fbbf241a);border-bottom:1px solid rgba(139,92,246,.15)}.card-badge{display:inline-flex;align-items:center;padding:4px 12px;background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;font-size:12px;font-weight:600;border-radius:20px}.card-time{font-size:11px;color:#666}.card-body{padding:16px}.info-item{margin-bottom:14px}.info-item:last-child{margin-bottom:0}.info-label{font-size:12px;color:#888;margin-bottom:6px}.info-row{display:flex;align-items:center;gap:10px}.info-value{flex:1;padding:10px 14px;background:#0000004d;border:1px solid rgba(255,255,255,.08);border-radius:8px;font-family:SF Mono,Consolas,monospace;font-size:13px;color:#e5e5e5;word-break:break-all}.copy-btn{padding:10px 16px;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#000;border:none;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.copy-btn:hover{background:linear-gradient(135deg,#fcd34d,#fbbf24)}.copy-btn:active{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.totp-row{flex-wrap:wrap}.totp-value{font-size:24px;font-weight:700;letter-spacing:4px;color:#10b981;text-align:center}.totp-timer{width:100%;margin-top:8px;height:4px;background:#ffffff1a;border-radius:2px;overflow:hidden}.totp-progress{height:100%;background:linear-gradient(90deg,#10b981,#34d399);border-radius:2px;transition:width 1s linear}.totp-progress.warning{background:linear-gradient(90deg,#ef4444,#f87171)}.card-guide{padding:14px 16px;background:#10b9810f;border-top:1px solid rgba(16,185,129,.15)}.loading{display:none;text-align:center;padding:24px;color:#8b5cf6}.loading.show{display:block}.spinner{display:inline-block;width:24px;height:24px;border:3px solid rgba(139,92,246,.2);border-top-color:#8b5cf6;border-right-color:#fbbf24;border-radius:50%;animation:spin .8s linear infinite;margin-right:10px;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.loading span:last-child{vertical-align:middle;font-size:14px;color:#8b5cf6;font-weight:500}#toast-container{position:fixed;top:20px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#1a1a1a80;border-radius:5px}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#8b5cf6,#fbbf24);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#a78bfa,#fcd34d)}@media (min-width: 1401px){.main-content{max-width:100%}.stats-panel{grid-template-columns:repeat(2,1fr);max-width:600px}.stat-card .stat-value{font-size:26px}}@media (min-width: 1024px) and (max-width: 1400px){.stats-panel{grid-template-columns:repeat(2,1fr);max-width:600px}.stat-card .stat-value{font-size:22px}}@media (min-width: 768px) and (max-width: 1023px){:root{--sidebar-width: var(--sidebar-width-narrow)}.sidebar{padding:var(--spacing-md)}.sidebar-section{padding:var(--spacing-sm)}.action-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-xs)}.action-btn{padding:var(--spacing-sm);font-size:11px}.action-btn svg{width:16px;height:16px}.stats-panel{grid-template-columns:repeat(2,1fr)}.app-header{padding:0 var(--spacing-md)}.user-stats{gap:var(--spacing-sm)}.stat-item.code{display:none}}@media (max-width: 767px){:root{--header-height: 56px;--footer-height: auto;--touch-target-min: 44px}.app-header{padding:0 var(--spacing-md)}.header-right{display:none}.mobile-menu-btn{display:flex;align-items:center;justify-content:center;width:var(--touch-target-min);height:var(--touch-target-min);min-width:var(--touch-target-min);min-height:var(--touch-target-min);padding:0;background:#8b5cf626;border:1px solid rgba(139,92,246,.3);border-radius:var(--radius-sm);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent;touch-action:manipulation}.mobile-menu-btn:hover,.mobile-menu-btn:focus{background:#8b5cf640;border-color:#8b5cf680;outline:none}.mobile-menu-btn:active{transform:scale(.95);background:#8b5cf659}.mobile-menu-btn.active svg line:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.mobile-menu-btn.active svg line:nth-child(2){opacity:0}.mobile-menu-btn.active svg line:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}.mobile-menu-btn svg line{transition:all var(--transition-fast);transform-origin:center}.sidebar{position:fixed;top:var(--header-height);left:0;width:min(280px,85vw);height:calc(100vh - var(--header-height));transform:translate(-100%);z-index:900;background:#1a1a1afa;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:none;transition:transform var(--transition-normal) cubic-bezier(.4,0,.2,1),box-shadow var(--transition-normal);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.sidebar.open{transform:translate(0);box-shadow:4px 0 32px #00000080,0 0 60px #8b5cf626}.sidebar-overlay{display:block;position:fixed;top:var(--header-height);left:0;right:0;bottom:0;background:#0009;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:899;opacity:0;visibility:hidden;transition:opacity var(--transition-normal),visibility var(--transition-normal);-webkit-tap-highlight-color:transparent}.sidebar-overlay.active{opacity:1;visibility:visible}.main-content{padding:var(--spacing-md);min-height:calc(100vh - var(--header-height))}.stats-panel{grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.stat-card{padding:var(--spacing-sm)}.stat-card .stat-icon{font-size:20px}.stat-card .stat-value{font-size:16px}.stat-card .stat-label{font-size:10px}.app-footer{flex-direction:column;gap:var(--spacing-md);padding:var(--spacing-lg) var(--spacing-md);height:auto;text-align:center}.footer-left,.footer-right{justify-content:center}.footer-center{flex-wrap:wrap;justify-content:center;gap:var(--spacing-sm) var(--spacing-md)}.footer-center a{padding:var(--spacing-sm) var(--spacing-md);min-height:var(--touch-target-min);display:inline-flex;align-items:center}.input-section{flex-direction:column}#verify-btn{width:100%;justify-content:center;min-height:var(--touch-target-min)}.activation-info{flex-direction:column}.activation-info .info-row{min-width:100%}.account-type-options{flex-direction:column}.account-type-option{min-width:100%;min-height:var(--touch-target-min)}#toast-container{left:var(--spacing-md);right:var(--spacing-md);top:calc(var(--header-height) + var(--spacing-md))}.action-btn{min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-md);-webkit-tap-highlight-color:transparent;touch-action:manipulation}.activity-item{min-height:var(--touch-target-min);padding:var(--spacing-sm) var(--spacing-md);-webkit-tap-highlight-color:transparent;touch-action:manipulation}.tip-item{min-height:36px;padding:var(--spacing-sm) 0}.copy-btn,.credential-copy,.toggle-password-btn,.open-url-btn{min-height:var(--touch-target-min);min-width:var(--touch-target-min);-webkit-tap-highlight-color:transparent;touch-action:manipulation}.fetch-btn,.history-btn,.logout-btn{min-height:48px;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.history-btn{display:flex}.sidebar-section{margin-bottom:var(--spacing-md)}.activity-list{max-height:180px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.sidebar.history-sidebar{width:min(320px,90vw);padding:var(--spacing-md)}.history-list{max-height:calc(100vh - var(--header-height) - 100px);padding-right:var(--spacing-sm)}.history-item{padding:var(--spacing-md);min-height:var(--touch-target-min);-webkit-tap-highlight-color:transparent;touch-action:manipulation}.history-item:active{background:#8b5cf633;transform:scale(.98)}.history-item-email{font-size:14px}.type-badge{padding:3px 10px;font-size:11px}.sidebar-header h3{font-size:15px}.history-empty{padding:var(--spacing-xl) var(--spacing-md)}.history-empty svg{width:40px;height:40px}.history-empty p{font-size:13px}}@media (max-width: 360px){.header h1,.logo-text{font-size:16px}.version-tag{display:none}.points-value{font-size:18px}.totp-value{font-size:20px;letter-spacing:2px}.stats-panel,.action-grid{grid-template-columns:1fr}.totp-digit{width:36px;height:48px;font-size:24px}.totp-timer-ring{width:60px;height:60px}.timer-ring-text{font-size:18px}.sidebar{width:100vw}.action-btn{min-height:48px;padding:var(--spacing-md)}.activity-item{padding:var(--spacing-md)}}@media (max-width: 767px){.current-email-card.enhanced .card-body{padding:var(--spacing-md)}.credential-value{flex-wrap:wrap}.credential-input{width:100%;flex:none;margin-bottom:var(--spacing-xs)}.credential-copy,.toggle-password-btn,.open-url-btn{flex:1;justify-content:center;min-height:var(--touch-target-min, 44px)}.totp-display-container{flex-direction:column;gap:var(--spacing-md)}.totp-code-large{gap:4px}.totp-digit{width:40px;height:52px;font-size:26px}.totp-separator{width:6px;height:6px;margin:0 2px}.totp-timer-ring{width:70px;height:70px}.timer-ring-text{font-size:20px}.totp-copy-btn{min-height:48px;padding:var(--spacing-md) var(--spacing-lg);-webkit-tap-highlight-color:transparent;touch-action:manipulation}}.section-animate{transition:opacity var(--transition-normal),transform var(--transition-normal),max-height var(--transition-slow)}.fade-in{animation:fadeInUp .4s ease-out forwards}.fade-out{animation:fadeOutDown .3s ease-in forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOutDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}.slide-in-left{animation:slideInLeft .4s ease-out forwards}.slide-out-left{animation:slideOutLeft .3s ease-in forwards}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slideOutLeft{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-30px)}}.slide-in-right{animation:slideInRight .4s ease-out forwards}.slide-out-right{animation:slideOutRight .3s ease-in forwards}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(30px)}}.scale-in{animation:scaleIn .3s ease-out forwards}.scale-out{animation:scaleOut .2s ease-in forwards}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes scaleOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}.sidebar{transition:transform var(--transition-normal) cubic-bezier(.4,0,.2,1),width var(--transition-normal) cubic-bezier(.4,0,.2,1),opacity var(--transition-fast)}.sidebar.open{transform:translate(0);box-shadow:4px 0 24px #0006,0 0 40px #8b5cf61a}.sidebar.open .sidebar-section{animation:sidebarSectionIn .4s ease-out forwards}.sidebar.open .sidebar-section:nth-child(1){animation-delay:.05s}.sidebar.open .sidebar-section:nth-child(2){animation-delay:.1s}.sidebar.open .sidebar-section:nth-child(3){animation-delay:.15s}@keyframes sidebarSectionIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.sidebar-overlay{transition:opacity var(--transition-normal);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.sidebar-overlay.active{animation:overlayFadeIn .3s ease-out forwards}@keyframes overlayFadeIn{0%{opacity:0;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{opacity:1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}button,.btn,.action-btn,.fetch-btn,.history-btn,.copy-btn,.header-btn,.credential-copy,.totp-copy-btn{transition:all var(--transition-fast) cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}button:after,.btn:after,.action-btn:after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:#fff3;border-radius:50%;transform:translate(-50%,-50%);transition:width .4s ease-out,height .4s ease-out,opacity .4s ease-out;opacity:0;pointer-events:none}button:active:after,.btn:active:after,.action-btn:active:after{width:200px;height:200px;opacity:0}.action-btn{transform-origin:center}.action-btn:hover{background:#8b5cf633;border-color:#8b5cf666}.action-btn:hover svg{color:var(--color-primary)}.action-btn:active{background:#8b5cf64d;transition-duration:.1s}.fetch-btn:hover:not(:disabled){background:linear-gradient(135deg,#a78bfa,#8b5cf6)}.copy-btn:hover,.credential-copy:hover{background:linear-gradient(135deg,#fcd34d,#fbbf24)}.header-btn:hover{background:#ef444433;border-color:#ef444480}.mobile-menu-btn{transition:all var(--transition-fast)}.mobile-menu-btn:hover{background:#8b5cf633;border-color:#8b5cf666}.mobile-menu-btn:active{background:#8b5cf64d}.stat-card{transition:all var(--transition-fast) cubic-bezier(.4,0,.2,1)}.stat-card:hover{border-color:#8b5cf666}.current-email-card{animation:cardSlideIn .5s ease-out forwards}@keyframes cardSlideIn{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.account-type-option{transition:all var(--transition-fast) cubic-bezier(.4,0,.2,1)}.account-type-option:hover{background:#2a2a2acc;border-color:#8b5cf680}.activity-item{transition:all var(--transition-fast) cubic-bezier(.4,0,.2,1)}.activity-item:hover{background:#8b5cf61f}.activity-list .activity-item{animation:activityItemIn .3s ease-out forwards;opacity:0}.activity-list .activity-item:nth-child(1){animation-delay:.05s}.activity-list .activity-item:nth-child(2){animation-delay:.1s}.activity-list .activity-item:nth-child(3){animation-delay:.15s}.activity-list .activity-item:nth-child(4){animation-delay:.2s}.activity-list .activity-item:nth-child(5){animation-delay:.25s}@keyframes activityItemIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.totp-digit{transition:all var(--transition-fast) cubic-bezier(.4,0,.2,1)}.totp-digit:hover{border-color:#10b98180}.totp-digit.updating{animation:digitUpdate .3s ease-out}@keyframes digitUpdate{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.7}to{transform:scale(1);opacity:1}}#activation-code,.credential-input{transition:all var(--transition-fast) cubic-bezier(.4,0,.2,1)}#activation-code:focus,.credential-input:focus{transform:scale(1.01)}.loading.show{animation:loadingFadeIn .3s ease-out forwards}@keyframes loadingFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.spinner{filter:drop-shadow(0 0 8px rgba(139,92,246,.5))}.footer-center a{transition:all var(--transition-fast) cubic-bezier(.4,0,.2,1)}.footer-center a:hover{color:var(--color-primary-light);background:#8b5cf614}.tip-item{transition:all var(--transition-fast)}.tip-item:hover{color:var(--color-primary-light)}.pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}.bounce{animation:bounce .5s ease-out}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.glow{animation:glow 2s ease-in-out infinite alternate}@keyframes glow{0%{box-shadow:0 0 10px #8b5cf64d}to{box-shadow:0 0 20px #8b5cf699,0 0 30px #8b5cf666}}@media (max-width: 767px){html{scroll-behavior:smooth}button,.action-btn,.activity-item,.account-type-option,.tip-item{-webkit-user-select:none;user-select:none}.action-btn:active{background:#8b5cf659;transform:scale(.97)}.activity-item:active{background:#8b5cf633;transform:scale(.98)}.account-type-option:active{transform:scale(.98);background:#8b5cf633}.stat-card:active{transform:scale(.98)}.copy-btn:active,.credential-copy:active{transform:scale(.95)}.fetch-btn:active:not(:disabled){transform:scale(.98)}@media (hover: none){.action-btn:hover{transform:none;box-shadow:none}.stat-card:hover,.activity-item:hover{transform:none}.account-type-option:hover{transform:none;box-shadow:none}.tip-item:hover,.footer-center a:hover{transform:none}}.sidebar::-webkit-scrollbar,.activity-list::-webkit-scrollbar,.main-content::-webkit-scrollbar{width:4px}.sidebar::-webkit-scrollbar-thumb,.activity-list::-webkit-scrollbar-thumb,.main-content::-webkit-scrollbar-thumb{background:#8b5cf64d;border-radius:2px}.app-header{padding-left:max(var(--spacing-md),env(safe-area-inset-left));padding-right:max(var(--spacing-md),env(safe-area-inset-right))}.main-content{padding-left:max(var(--spacing-md),env(safe-area-inset-left));padding-right:max(var(--spacing-md),env(safe-area-inset-right));padding-bottom:max(var(--spacing-md),env(safe-area-inset-bottom))}.app-footer{padding-bottom:max(var(--spacing-lg),env(safe-area-inset-bottom))}.sidebar{padding-left:max(var(--spacing-lg),env(safe-area-inset-left))}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.sidebar,.sidebar-overlay{transition:none}}