.app-container{min-height:100vh;padding-bottom:calc(env(safe-area-inset-bottom) + 80px);width:100%;max-width:100%}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;align-items:center;background:#fff;padding:10px 0 calc(10px + env(safe-area-inset-bottom));box-shadow:0 -2px 10px #0000001a;z-index:100;width:100%;max-width:100%}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 12px;color:#999;text-decoration:none;transition:all .3s ease;flex:1}.nav-item.active{color:#6366f1}.nav-icon{font-size:22px;margin-bottom:4px}.nav-text{font-size:11px}.add-btn{width:52px;height:52px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;box-shadow:0 4px 15px #667eea66;display:flex;align-items:center;justify-content:center;margin-top:-20px;color:#fff;flex:none;padding:0}.add-btn .nav-icon{font-size:26px;margin-bottom:0}@media screen and (max-width: 320px){.nav-item{padding:6px 8px}.nav-icon{font-size:20px}.nav-text{font-size:10px}.add-btn{width:48px;height:48px}.add-btn .nav-icon{font-size:24px}}@media screen and (min-width: 768px){.app-container{max-width:480px;margin:0 auto;box-shadow:0 0 20px #0000001a}.bottom-nav{max-width:480px;margin:0 auto;left:auto;right:auto;box-shadow:0 -2px 15px #0000001a}}*{margin:0;padding:0;box-sizing:border-box}.home-container{min-height:100vh;background:#f5f7fa;padding-bottom:80px}.header-section{position:relative;padding:0 20px 30px}.header-bg{position:absolute;top:0;left:0;right:0;height:260px;background:linear-gradient(135deg,#667eea,#764ba2,#f093fb);border-radius:0 0 40px 40px}.header-content{position:relative;z-index:1;padding-top:45px;padding-bottom:45px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto;gap:8px;height:205px}.logout-btn{grid-column:2;grid-row:1;justify-self:end;width:60px;padding:0;border:none;background-color:#fef2f200;color:#544a4a;font-size:14px;font-weight:500;cursor:pointer;text-align:right}.logout-btn:hover{color:#fff}.user-section{grid-column:1;grid-row:2;display:flex;align-items:center;gap:16px;cursor:pointer}.user-avatar{width:72px;height:72px;border-radius:20px;background:#ffffff40;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:36px;border:2px solid rgba(255,255,255,.3);margin-top:-30px;margin-bottom:-30px}.user-name{font-size:33px;font-weight:600;color:#fff;margin-top:-0px;margin-bottom:-0px}.app-info{grid-column:1;grid-row:3;margin-left:88px}.app-date{grid-column:2;grid-row:3;justify-self:end;align-self:center;margin:0}.app-title{font-size:28px;font-weight:700;color:#fff;margin-top:20px;margin-bottom:20px}.app-date{font-size:14px;color:#ffffffd9}.balance-card{position:relative;z-index:1;background:#fff;border-radius:20px;padding:20px;box-shadow:0 8px 30px #0000001a}.balance-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.balance-icon{font-size:18px}.balance-label{font-size:13px;color:#64748b;font-weight:500}.balance-amount{display:flex;align-items:baseline;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #f1f5f9}.currency{font-size:24px;font-weight:600;color:#475569;margin-right:4px}.amount-value{font-size:42px;font-weight:700;color:#1e293b;letter-spacing:-1px}.amount-value.positive{color:#10b981}.amount-value.negative{color:#ef4444}.balance-stats{display:flex;gap:14px}.stat-card{flex:1;display:flex;align-items:center;gap:12px;padding:16px;border-radius:16px}.stat-card.income{background:linear-gradient(135deg,#d1fae5,#ecfdf5)}.stat-card.expense{background:linear-gradient(135deg,#fee2e2,#fef2f2)}.stat-icon-wrap{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#fff;box-shadow:0 2px 8px #0000000f}.stat-icon{font-size:18px}.stat-content{display:flex;flex-direction:column;gap:2px}.stat-label{font-size:12px;color:#64748b}.stat-value{font-size:18px;font-weight:600}.stat-card.income .stat-value{color:#10b981}.stat-card.expense .stat-value{color:#ef4444}.content-section{padding:0 20px;margin-top:-10px}.tabs{display:flex;background:#fff;border-radius:16px;padding:6px;box-shadow:0 4px 20px #0000000f;margin-bottom:12px}.tab-btn{flex:1;padding:12px;border:none;border-radius:12px;background:transparent;font-size:14px;font-weight:500;color:#64748b;cursor:pointer;transition:all .2s ease}.tab-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.period-tabs{display:flex;gap:8px;margin-bottom:16px}.period-btn{flex:1;padding:10px 12px;border:2px solid #667eea;border-radius:12px;background:#fff;font-size:14px;font-weight:700;color:#667eea!important;cursor:pointer;transition:all .2s ease}.period-btn.active{border-color:#667eea;background:linear-gradient(135deg,#667eea1a,#764ba21a);color:#667eea}.records-section{background:#fff;border-radius:20px;padding:20px;box-shadow:0 4px 20px #0000000f}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.section-title{font-size:16px;font-weight:600;color:#1e293b}.record-count{font-size:12px;color:#94a3b8;padding:4px 10px;background:#f1f5f9;border-radius:10px}.records-list{display:flex;flex-direction:column;gap:16px}.date-group{display:flex;flex-direction:column;gap:8px}.date-header{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.date-label{font-size:14px;color:#94a3b8;font-weight:500}.date-summary{display:flex;gap:16px}.summary-income{font-size:13px;color:#10b981;font-weight:500}.summary-expense{font-size:13px;color:#ef4444;font-weight:500}.record-meta{display:flex;align-items:center;gap:8px}.record-time,.record-desc{font-size:12px;color:#94a3b8}.record-card{display:flex;align-items:center;gap:14px;padding:16px;background:#f8fafc;border-radius:14px;cursor:pointer;transition:all .2s ease}.record-card:hover{background:#f1f5f9;transform:translate(4px)}.record-icon{width:42px;height:42px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;box-shadow:0 2px 8px #0000000a}.record-info{flex:1;display:flex;flex-direction:column;gap:4px}.record-name{font-size:15px;font-weight:500;color:#1e293b}.record-desc{font-size:12px;color:#94a3b8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.record-amount{font-size:16px;font-weight:600;color:#ef4444}.record-amount.income{color:#10b981}.record-arrow{font-size:14px;color:#cbd5e1}.summary-card{background:#f8fafc;border-radius:14px;padding:16px}.summary-header{margin-bottom:12px}.summary-label{font-size:14px;font-weight:600;color:#1e293b}.summary-content{display:flex;flex-direction:column;gap:8px}.summary-row{display:flex;justify-content:space-between;align-items:center}.summary-income-label,.summary-expense-label,.summary-balance-label{font-size:13px;color:#64748b}.summary-income-value{font-size:15px;font-weight:600;color:#10b981}.summary-expense-value{font-size:15px;font-weight:600;color:#ef4444}.summary-balance-value{font-size:16px;font-weight:700;color:#1e293b}.summary-balance-value.positive{color:#10b981}.summary-balance-value.negative{color:#ef4444}.summary-row.balance{padding-top:8px;border-top:1px dashed #e2e8f0;margin-top:4px}.empty-state{display:flex;flex-direction:column;align-items:center;padding:40px 20px}.empty-icon{font-size:48px;margin-bottom:12px;opacity:.7}.empty-state p{font-size:14px;color:#94a3b8}.loading-state{display:flex;flex-direction:column;align-items:center;padding:20px;gap:8px}.loading-spinner{width:24px;height:24px;border:2px solid #e2e8f0;border-top-color:#667eea;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-state span{font-size:13px;color:#94a3b8}.load-more{padding:16px;text-align:center}.load-more-btn{padding:12px 32px;border:2px solid #667eea;border-radius:25px;background:#fff;color:#667eea;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.load-more-btn:hover{background:#667eea;color:#fff}.no-more{padding:16px;text-align:center}.no-more span{font-size:13px;color:#94a3b8}@media screen and (max-width: 320px){.amount-value{font-size:36px}.stat-card{padding:12px}.balance-card{padding:16px}}.add-container{min-height:100vh;background:#f8fafc}.header{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:50px 20px 16px;z-index:100;background:linear-gradient(135deg,#4f46e5,#7c3aed,#ec4899);border-radius:0 0 32px 32px}.back-btn{width:44px;height:44px;border:none;border-radius:14px;background:#fffffff2;font-size:18px;cursor:pointer;box-shadow:0 4px 15px #0000001a;flex-shrink:0;display:flex;align-items:center;justify-content:center}.back-icon{font-size:20px;color:#333}.save-btn{min-width:70px;height:44px;padding:0 16px;border:none;border-radius:14px;background:#fff;color:#4f46e5;font-size:15px;font-weight:600;cursor:pointer;box-shadow:0 4px 15px #0000001a;flex-shrink:0;display:flex;align-items:center;justify-content:center}.title{font-size:18px;font-weight:600;color:#fff}.content-area{position:relative;z-index:1;padding:120px 20px 100px}.type-section{display:flex;gap:12px;margin-bottom:24px}.type-btn{flex:1;display:flex;flex-direction:column;align-items:center;padding:16px;border:2px solid rgba(255,255,255,.3);border-radius:16px;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;transition:all .3s ease}.type-btn.active{border-color:#fff;background:#fff}.type-icon{font-size:28px;margin-bottom:6px}.type-text{font-size:14px;font-weight:500;color:#ffffffe6}.type-btn.active .type-text{color:#333}.amount-section{background:#fff;border-radius:20px;padding:24px;margin-bottom:20px;box-shadow:0 4px 20px #0000000d}.amount-label{font-size:13px;color:#94a3b8;margin-bottom:12px}.amount-input-wrap{display:flex;align-items:baseline}.currency{font-size:32px;font-weight:600;color:#4f46e5;margin-right:8px}.amount-input{font-size:52px;font-weight:700;color:#1e293b;border:none;outline:none;background:transparent;width:200px}.amount-input::placeholder{color:#cbd5e1}.section{background:#fff;border-radius:16px;padding:20px;margin-bottom:16px;box-shadow:0 2px 10px #0000000a}.section-title{font-size:13px;color:#94a3b8;margin-bottom:12px}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.category-item{display:flex;flex-direction:column;align-items:center;padding:14px 8px;border:2px solid #e2e8f0;border-radius:14px;background:#fff;cursor:pointer;transition:all .2s ease}.category-item.active{border-color:#4f46e5;background:linear-gradient(135deg,#4f46e51a,#7c3aed1a)}.category-icon{font-size:26px;margin-bottom:6px}.category-name{font-size:12px;color:#475569}.category-item.active .category-name{color:#4f46e5;font-weight:500}.desc-input{width:100%;padding:14px;border:2px solid #e2e8f0;border-radius:12px;font-size:14px;resize:none;outline:none;transition:all .2s ease;box-sizing:border-box}.desc-input:focus{border-color:#4f46e5}.desc-input::placeholder{color:#cbd5e1}.date-input{width:100%;padding:14px;border:2px solid #e2e8f0;border-radius:12px;font-size:15px;outline:none;transition:all .2s ease;box-sizing:border-box}.date-input:focus{border-color:#4f46e5}.delete-section{margin-top:20px;text-align:center}.delete-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 32px;border:2px solid #ef4444;border-radius:25px;background:transparent;color:#ef4444;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.delete-btn:active{background:#ef44441a}.delete-icon{font-size:16px}@media screen and (max-width: 320px){.content-area{padding:0 15px 100px}.amount-input{font-size:44px;width:160px}.currency{font-size:28px}.category-grid{gap:8px}.category-item{padding:12px 6px}.category-icon{font-size:22px}.category-name{font-size:11px}}.bottom-save-section{padding:20px 0}.bottom-save-btn{width:100%;height:52px;font-size:16px;border-radius:16px;box-shadow:0 4px 20px #4f46e54d}@media screen and (min-width: 768px){.add-container{max-width:480px;margin:0 auto;min-height:100vh;box-shadow:0 0 20px #0000001a}.header-bg{max-width:480px;margin:0 auto}.header{max-width:480px;left:50%;transform:translate(-50%)}}.statistics-container{min-height:100vh;background:#f8fafc;position:relative}.header-bg{position:absolute;top:0;left:0;right:0;height:200px;background:linear-gradient(135deg,#4f46e5,#7c3aed,#ec4899);border-radius:0 0 32px 32px}.header{position:relative;padding:50px 20px 20px;z-index:1}.title{font-size:28px;font-weight:700;color:#fff;margin:0 0 20px}.period-selector{display:flex;gap:8px;background:#fff3;border-radius:12px;padding:6px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.period-btn{flex:1;padding:10px 12px;border:none;border-radius:10px;background:transparent;color:#ffffffe6;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.period-btn.active{background:#fff;color:#4f46e5}.content-area{position:relative;z-index:1;padding:0 20px 100px}.summary-section{display:flex;gap:12px;margin-bottom:16px}.summary-card{flex:1;background:#fff;border-radius:16px;padding:16px;display:flex;align-items:center;gap:12px;box-shadow:0 4px 20px #0000000d}.card-icon-wrap{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center}.summary-card.income .card-icon-wrap{background:linear-gradient(135deg,#d1fae5,#a7f3d0)}.summary-card.expense .card-icon-wrap{background:linear-gradient(135deg,#fee2e2,#fecaca)}.card-icon{font-size:24px}.card-content{flex:1}.card-label{font-size:12px;color:#94a3b8;display:block;margin-bottom:4px}.card-value{font-size:18px;font-weight:600}.summary-card.income .card-value{color:#10b981}.summary-card.expense .card-value{color:#ef4444}.balance-section{background:#fff;border-radius:20px;padding:24px;margin-bottom:20px;text-align:center;box-shadow:0 4px 20px #0000000d}.balance-label{font-size:13px;color:#94a3b8;margin-bottom:8px}.balance-value{font-size:44px;font-weight:700;color:#1e293b}.balance-value.positive{color:#10b981}.balance-value.negative{color:#ef4444}.chart-section{background:#fff;border-radius:16px;padding:20px;margin-bottom:16px;box-shadow:0 2px 10px #0000000a}.section-header{margin-bottom:16px;display:flex;justify-content:space-between;align-items:center}.section-title{font-size:16px;font-weight:600;color:#1e293b;margin:0}.sort-indicator{font-size:12px;color:#94a3b8;padding:4px 8px;background:#f1f5f9;border-radius:8px}.category-list{display:flex;flex-direction:column;gap:16px}.category-item{display:flex;flex-direction:column;gap:8px}.category-header{display:flex;justify-content:space-between;align-items:center}.category-name{font-size:14px;color:#475569}.category-amount{font-size:14px;font-weight:600;color:#1e293b}.progress-bar-wrap{height:12px;background:#e2e8f0;border-radius:6px;overflow:hidden}.progress-bar{height:100%;border-radius:6px;transition:width .5s ease}.progress-bar.bar-0{background:linear-gradient(135deg,#4f46e5,#7c3aed)}.progress-bar.bar-1{background:linear-gradient(135deg,#ec4899,#f43f5e)}.progress-bar.bar-2{background:linear-gradient(135deg,#06b6d4,#0ea5e9)}.progress-bar.bar-3{background:linear-gradient(135deg,#10b981,#14b8a6)}.progress-bar.bar-4{background:linear-gradient(135deg,#f59e0b,#f97316)}.category-percent{font-size:12px;color:#94a3b8;text-align:right}.empty-state{text-align:center;padding:32px;color:#94a3b8;font-size:14px}.line-chart{background:#fafafa;border-radius:12px;padding:16px}.chart-svg{width:100%;height:auto}.x-label{font-size:11px;fill:#94a3b8}.chart-legend{display:flex;justify-content:center;gap:24px;margin-top:16px}.legend-item{display:flex;align-items:center;gap:8px}.legend-color{width:12px;height:3px;border-radius:2px}.legend-color.income{background:#10b981}.legend-color.expense{background:#ef4444}.legend-text{font-size:12px;color:#64748b}@media screen and (max-width: 320px){.header{padding:40px 15px 15px}.title{font-size:24px}.summary-card{padding:14px}.card-icon-wrap{width:40px;height:40px}.card-icon{font-size:22px}.card-value{font-size:16px}.balance-value{font-size:36px}.chart-section{padding:16px}.section-title{font-size:15px}.category-name,.category-amount{font-size:13px}}@media screen and (min-width: 768px){.statistics-container{max-width:480px;margin:0 auto;min-height:100vh;box-shadow:0 0 20px #0000001a}.header-bg{max-width:480px;margin:0 auto}}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;position:relative;background:#f5f7fa}.login-bg{position:absolute;top:-20%;right:-20%;width:60%;height:60%;background:radial-gradient(circle,rgba(124,58,237,.3) 0%,rgba(236,72,153,.2) 50%,transparent 70%);border-radius:50%}.login-card{position:relative;z-index:1;width:100%;max-width:380px;background:#fff;border-radius:24px;padding:40px;box-shadow:0 25px 50px #0000001a}.login-form{display:flex;flex-direction:column;gap:16px}.forgot-link{text-align:right}.forgot-link a{font-size:13px;color:#7c3aed;text-decoration:none}.forgot-link a:hover{text-decoration:underline}.login-btn{margin-top:8px;padding:16px;border:none;border-radius:14px;background:linear-gradient(135deg,#7c3aed,#ec4899);color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}.login-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #7c3aed4d}.login-btn:disabled{opacity:.7;cursor:not-allowed}.register-link{margin-top:24px;text-align:center;font-size:14px;color:#64748b}.register-link a{color:#7c3aed;font-weight:500;text-decoration:none;margin-left:4px}.register-link a:hover{text-decoration:underline}@media screen and (max-width: 320px){.login-card{padding:30px 20px}.app-title{font-size:24px}.logo-icon{font-size:56px}}.register-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;position:relative;background:#f5f7fa}.register-bg{position:absolute;top:-20%;left:-20%;width:60%;height:60%;background:radial-gradient(circle,rgba(124,58,237,.3) 0%,rgba(236,72,153,.2) 50%,transparent 70%);border-radius:50%}.register-card{position:relative;z-index:1;width:100%;max-width:380px;background:#fff;border-radius:24px;padding:20px;box-shadow:0 25px 50px #0000001a}.app-title{font-size:28px;font-weight:700;color:#1e293b;margin:0 0 8px}.app-subtitle{font-size:14px;color:#94a3b8;margin:0}.register-form{display:flex;flex-direction:column;gap:16px}.register-btn{margin-top:8px;padding:16px;border:none;border-radius:14px;background:linear-gradient(135deg,#7c3aed,#ec4899);color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}.register-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #7c3aed4d}.register-btn:disabled{opacity:.7;cursor:not-allowed}.login-link{margin-top:24px;text-align:center;font-size:14px;color:#64748b}.login-link a{color:#7c3aed;font-weight:500;text-decoration:none;margin-left:4px}.login-link a:hover{text-decoration:underline}@media screen and (max-width: 320px){.register-card{padding:30px 20px}.app-title{font-size:24px}.logo-icon{font-size:56px}}.profile-container{min-height:100vh;background:#f5f7fa;padding-bottom:80px}.profile-bg{position:absolute;top:0;left:0;right:0;height:200px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:0 0 40px 40px}.profile-header{position:relative;display:flex;align-items:center;justify-content:space-between;padding:60px 20px 20px}.back-btn{width:40px;height:40px;border-radius:12px;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff;cursor:pointer}.page-title{font-size:20px;font-weight:600;color:#fff}.placeholder{width:40px}.profile-content{position:relative;padding:0 20px;margin-top:-20px}.avatar-section{background:#fff;border-radius:20px;padding:24px;box-shadow:0 4px 20px #0000000f;margin-bottom:16px}.current-avatar{text-align:center;margin-bottom:8px}.avatar-icon{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#e2e8f0,#f1f5f9);display:inline-flex;align-items:center;justify-content:center;font-size:40px;box-shadow:0 4px 15px #00000014}.avatar-label{text-align:center;font-size:13px;color:#94a3b8;margin-bottom:20px}.avatar-options{margin-top:16px}.options-title{font-size:14px;font-weight:600;color:#475569;margin-bottom:12px}.avatar-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.avatar-item{aspect-ratio:1;border-radius:14px;background:#f8fafc;display:flex;align-items:center;justify-content:center;font-size:28px;cursor:pointer;transition:all .2s ease;border:2px solid transparent}.avatar-item:hover{background:#f1f5f9;transform:scale(1.05)}.avatar-item.selected{border-color:#667eea;background:linear-gradient(135deg,#667eea1a,#764ba21a)}.form-section{background:#fff;border-radius:20px;padding:24px;box-shadow:0 4px 20px #0000000f;margin-bottom:16px}.profile-form{display:flex;flex-direction:column;gap:16px}.form-input.disabled{background:#f8fafc;color:#94a3b8;cursor:not-allowed}.save-btn{margin-top:8px;padding:16px;border:none;border-radius:14px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}.save-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #667eea59}.save-btn:disabled{opacity:.7;cursor:not-allowed}.logout-section{background:#fff;border-radius:20px;padding:20px;box-shadow:0 4px 20px #0000000f}.logout-btn{width:100%;padding:14px;border:none;border-radius:12px;background:#fef2f2;color:#ef4444;font-size:15px;font-weight:500;cursor:pointer;transition:all .2s ease;text-align:center}.logout-btn:hover{background:#fee2e2}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:20px;padding:12px 20px 24px;background:#fff;box-shadow:0 -4px 20px #0000000f}.nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 24px;text-decoration:none;color:#64748b;transition:all .2s ease}.nav-item.active{color:#667eea}.nav-icon{font-size:22px}.nav-text{font-size:12px;font-weight:500}.nav-add-btn{position:absolute;top:-28px;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 25px #667eea66;text-decoration:none}.add-icon{font-size:28px;color:#fff;font-weight:300}@media screen and (max-width: 320px){.avatar-grid{gap:10px}.avatar-item{font-size:24px}}.forgot-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;position:relative;background:#f5f7fa}.forgot-bg{position:absolute;top:-20%;left:-20%;width:60%;height:60%;background:radial-gradient(circle,rgba(59,130,246,.3) 0%,rgba(124,58,237,.2) 50%,transparent 70%);border-radius:50%}.forgot-card{position:relative;z-index:1;width:100%;max-width:380px;background:#fff;border-radius:24px;padding:20px;box-shadow:0 25px 50px #0000001a}.card-header{display:flex;align-items:flex-start;gap:12px}.back-btn{width:36px;height:36px;border-radius:10px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;font-size:18px;color:#475569;text-decoration:none;flex-shrink:0}.back-btn:hover{background:#e2e8f0}.logo-section{flex:1;text-align:center;margin-bottom:24px}.forgot-form{display:flex;flex-direction:column;gap:16px}.forgot-btn{margin-top:8px;padding:16px;border:none;border-radius:14px;background:linear-gradient(135deg,#7c3aed,#ec4899);color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}.forgot-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #7c3aed4d}.forgot-btn:disabled{opacity:.7;cursor:not-allowed}.reset-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;position:relative;background:#f5f7fa}.reset-bg{position:absolute;top:-20%;right:-20%;width:60%;height:60%;background:radial-gradient(circle,rgba(16,185,129,.3) 0%,rgba(59,130,246,.2) 50%,transparent 70%);border-radius:50%}.reset-card{position:relative;z-index:1;width:100%;max-width:380px;background:#fff;border-radius:24px;padding:40px;box-shadow:0 25px 50px #0000001a}.logo-section{text-align:center;margin-bottom:32px}.logo-icon{font-size:64px;margin-bottom:16px}.page-title{font-size:28px;font-weight:700;color:#1e293b;margin:0 0 8px}.page-subtitle{font-size:14px;color:#94a3b8;margin:0}.reset-form{display:flex;flex-direction:column;gap:16px}.error-message{padding:12px 16px;background:linear-gradient(135deg,#ef44441a,#ef44440d);border:1px solid rgba(239,68,68,.2);border-radius:10px;font-size:14px;color:#dc2626;text-align:center}.success-message{padding:12px 16px;background:linear-gradient(135deg,#10b9811a,#10b9810d);border:1px solid rgba(16,185,129,.2);border-radius:10px;font-size:14px;color:#059669;text-align:center}.form-group{display:flex;flex-direction:column;gap:8px}.form-label{font-size:13px;font-weight:500;color:#475569}.required{color:#ef4444}.form-input{padding:14px 16px;border:2px solid #e2e8f0;border-radius:12px;font-size:15px;outline:none;transition:all .2s ease}.form-input:focus{border-color:#7c3aed}.form-input::placeholder{color:#cbd5e1}.reset-btn{margin-top:8px;padding:16px;border:none;border-radius:14px;background:linear-gradient(135deg,#7c3aed,#ec4899);color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}.reset-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #7c3aed4d}.reset-btn:disabled{opacity:.7;cursor:not-allowed}.loading{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.back-link{margin-top:24px;text-align:center}.back-link a{font-size:14px;color:#7c3aed;text-decoration:none;font-weight:500}.back-link a:hover{text-decoration:underline}@media screen and (max-width: 320px){.reset-card{padding:30px 20px}.page-title{font-size:24px}.logo-icon{font-size:56px}}