.app{height:100%;display:flex;flex-direction:column;max-width:480px;margin:0 auto;position:relative;overflow:hidden}.page-container{flex:1;overflow:hidden;display:flex;flex-direction:column}.header{background:linear-gradient(135deg,var(--color-primary),var(--color-primary-light));padding:12px 16px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:100;box-shadow:0 2px 12px #ff6b6b4d}.header-left{display:flex;align-items:center;gap:10px}.user-selector{display:flex;align-items:center;gap:10px;cursor:pointer;padding:4px 8px;border-radius:12px;transition:background .2s}.user-selector:active{background:#ffffff26}.header-avatar{font-size:32px;animation:float 3s ease-in-out infinite}.header-info{display:flex;flex-direction:column;gap:0}.header-toggle{color:#fff9;font-size:10px;margin-left:-2px}.user-dropdown-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:999;background:#0000004d;display:flex;justify-content:flex-start;padding-top:80px}.user-dropdown{background:#fff;border-radius:var(--radius-lg);margin:0 16px;padding:12px 0;min-width:200px;box-shadow:0 8px 30px #00000026;animation:slideDown .2s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.user-dropdown-title{padding:8px 16px 12px;font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:600;border-bottom:1px solid #f0f0f0;margin-bottom:4px}.user-dropdown-item{display:flex;align-items:center;gap:10px;padding:10px 16px;cursor:pointer;transition:background .15s;font-size:var(--font-size-base)}.user-dropdown-item:active{background:#f5f5f5}.user-dropdown-item.active{background:#fff0f0;color:var(--color-primary);font-weight:700}.user-item-avatar{font-size:24px}.user-item-name{flex:1}.user-item-check{color:var(--color-primary);font-weight:700}.header-name{color:#fff;font-size:var(--font-size-lg);font-weight:700}.header-level{color:#fffc;font-size:var(--font-size-xs)}.header-right{display:flex;align-items:center;gap:8px}.cloud-badge{display:flex;align-items:center;gap:3px;padding:4px 10px;border-radius:12px;font-size:10px;font-weight:600;cursor:pointer;transition:all .2s}.cloud-badge.online{background:#34d39940;color:#fff}.cloud-badge.offline{background:#ffffff26;color:#ffffffb3}.cloud-badge:active{transform:scale(.9)}.cloud-dot{font-size:8px;animation:pulse 2s infinite}.cloud-badge.online .cloud-dot{color:#34d399}.cloud-badge.offline .cloud-dot{color:#999}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.cloud-label{font-size:10px}.header-points{background:#fff3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:6px 14px;border-radius:20px;display:flex;align-items:center;gap:6px;cursor:pointer;transition:all .2s}.header-points:active{transform:scale(.95)}.cloud-status-bar{display:flex;align-items:center;justify-content:center;gap:4px;padding:4px;background:linear-gradient(135deg,#34d399,#10b981);color:#fff;font-size:11px;font-weight:600}.cloud-status-icon{font-size:14px}.cloud-status-text{font-size:11px}.api-config-bar{display:flex;align-items:center;padding:8px 12px;background:#fff8e0;border-bottom:1px solid #FFE0A0;gap:8px}.api-config-content{flex:1;display:flex;gap:6px}.api-url-input{flex:1;padding:6px 10px;border:1.5px solid #FFD080;border-radius:6px;font-size:13px;outline:none;background:#fff}.api-url-input:focus{border-color:#ff9d00}.api-save-btn{padding:6px 14px;border:none;border-radius:6px;background:#ff9d00;color:#fff;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}.api-save-btn:active{transform:scale(.95)}.api-close-btn{background:none;border:none;font-size:16px;color:#999;cursor:pointer;padding:4px}.points-icon{font-size:18px}.points-value{font-size:var(--font-size-xl);font-weight:800;color:#fff;line-height:1}.points-label{color:#ffffffb3;font-size:var(--font-size-xs)}.bottom-tab-bar{display:flex;background:#fff;border-top:1px solid var(--border);padding:6px 0;padding-bottom:max(6px,env(safe-area-inset-bottom));position:sticky;bottom:0;z-index:100;box-shadow:0 -2px 12px #0000000d}.tab-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;padding:4px;cursor:pointer;transition:all .2s;color:var(--text-light);-webkit-tap-highlight-color:transparent}.tab-item.active{color:var(--color-primary)}.tab-item:active{transform:scale(.9)}.tab-icon{font-size:22px;transition:transform .2s}.tab-item.active .tab-icon{transform:scale(1.1)}.tab-label{font-size:10px;font-weight:600}.daily-page{overflow-y:auto;-webkit-overflow-scrolling:touch}.daily-score-card{position:relative;display:flex;align-items:center;justify-content:space-between;padding:20px;border-radius:var(--radius-xl);overflow:hidden;margin-bottom:16px;min-height:120px}.score-card-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:var(--radius-xl)}.score-card-content{position:relative;z-index:1;color:#fff}.score-label{font-size:var(--font-size-sm);opacity:.8;margin-bottom:4px}.score-value{font-size:52px;font-weight:800;line-height:1;margin-bottom:4px;text-shadow:0 2px 8px rgba(0,0,0,.2)}.score-sub{font-size:var(--font-size-xs);opacity:.7}.score-ring{position:relative;width:80px;height:80px;flex-shrink:0}.ring-svg{width:100%;height:100%}.ring-bg{fill:none;stroke:#ffffff26;stroke-width:6}.ring-progress{fill:none;stroke:#ffd93d;stroke-width:6;stroke-linecap:round;transition:stroke-dasharray .6s ease}.ring-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}.ring-emoji{font-size:28px}.habit-category{margin-bottom:12px}.category-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-left:3px solid;margin-bottom:8px;background:var(--bg-card);border-radius:0 var(--radius-md) var(--radius-md) 0}.category-name{font-size:var(--font-size-base);font-weight:700}.category-count{font-size:var(--font-size-xs);color:var(--text-secondary);opacity:.6}.category-items{display:flex;flex-direction:column;gap:8px}.habit-item{background:var(--bg-card);border-radius:var(--radius-md);padding:10px 12px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow-sm);border:1px solid transparent;transition:all .2s}.habit-item.scored{border-color:var(--color-accent);background:ivory}.habit-info{display:flex;align-items:center;gap:8px;min-width:80px;flex-shrink:0}.habit-icon{font-size:20px}.habit-name{font-size:var(--font-size-sm);font-weight:600;white-space:nowrap}.score-btns{display:flex;gap:6px;flex-shrink:0}.score-btn{padding:4px 10px;border-radius:20px;border:1.5px solid #eee;background:#f8f8f8;font-size:var(--font-size-xs);font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap}.score-btn:active{transform:scale(.9)}.score-btn.bad.active{background:#ffe0e0;border-color:#ff6b6b;color:#d63031}.score-btn.good.active{background:#e0ffe8;border-color:#34d399;color:#059669}.score-btn.great.active{background:#fff8e0;border-color:#ffd93d;color:#d4a017}.score-btn.bad:not(.active):hover,.score-btn.good:not(.active):hover,.score-btn.great:not(.active):hover{background:#f0f0f0}.daily-total-card{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:var(--radius-lg);color:#fff;margin-top:4px}.total-label{font-size:var(--font-size-base);opacity:.9}.total-value{font-size:var(--font-size-2xl);font-weight:800}.total-value.positive{color:#ffd93d}.total-value.negative{color:#ff8e8e}.weekly-page{overflow-y:auto;-webkit-overflow-scrolling:touch}.week-header-card{background:linear-gradient(135deg,var(--color-primary),#FF8E8E);border-radius:var(--radius-lg);padding:16px;color:#fff;display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.week-title-row{display:flex;align-items:center;gap:8px}.week-icon{font-size:24px}.week-label{font-size:var(--font-size-base);font-weight:600}.week-total{text-align:right}.week-total-label{font-size:var(--font-size-xs);opacity:.8;display:block}.week-total-value{font-size:var(--font-size-2xl);font-weight:800}.week-total-value.positive{color:#ffd93d}.week-total-value.negative{color:#ffe0e0}.weekly-table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:12px;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.weekly-table{min-width:480px;background:var(--bg-card);border-radius:var(--radius-lg);overflow:hidden}.table-header,.table-footer{display:flex;background:#fff5f5;border-bottom:1px solid var(--border)}.table-footer{border-bottom:none;border-top:1px solid var(--border);background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.header-cell,.footer-total{flex:1;text-align:center;padding:10px 4px;font-size:var(--font-size-xs);font-weight:600;min-width:40px}.header-cell.habit-name-col,.habit-name-col{flex:0 0 100px;min-width:100px;text-align:left;padding-left:8px}.habit-name-col{display:flex;align-items:center;gap:4px;font-size:var(--font-size-xs)}.row-icon{font-size:14px;flex-shrink:0}.row-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-cell.today,.footer-total.today{background:#ff6b6b1a;border-radius:4px}.day-name{display:block;font-size:var(--font-size-xs)}.day-date{display:block;font-size:10px;color:var(--text-secondary);font-weight:400}.header-cell.total-col,.footer-total.total-col{flex:0 0 50px;min-width:50px}.table-category-group{margin-bottom:0}.category-label-row{display:flex;justify-content:space-between;align-items:center;padding:6px 12px;font-size:var(--font-size-xs);font-weight:700}.cat-count{font-size:10px;opacity:.6}.table-row{display:flex;border-bottom:1px solid #f5f5f5;align-items:center}.table-row:last-child{border-bottom:none}.score-cell-wrapper{flex:1;text-align:center;padding:8px 2px;min-width:40px}.score-cell{display:inline-block;width:28px;height:28px;line-height:28px;border-radius:50%;font-size:var(--font-size-xs);font-weight:700;text-align:center}.score-cell.positive{background:#d1fae5;color:#059669}.score-cell.negative{background:#fee2e2;color:#dc2626}.score-cell.zero{background:#f3f4f6;color:#6b7280}.score-cell.empty{background:transparent;color:var(--text-light)}.total-col{flex:0 0 50px;min-width:50px;text-align:center;padding:8px 4px;font-size:var(--font-size-sm);font-weight:700}.total-col.positive{color:#059669}.total-col.negative{color:#dc2626}.footer-label{flex:0 0 100px;min-width:100px;padding:10px 8px;font-size:var(--font-size-xs);font-weight:600;display:flex;align-items:center;gap:4px}.footer-icon{font-size:16px}.footer-value{font-size:var(--font-size-sm);font-weight:700}.footer-value.positive{color:#ffd93d}.footer-value.negative{color:#ffe0e0}.footer-value.highlight{font-size:var(--font-size-base)}.legend-card{background:var(--bg-card);border-radius:var(--radius-md);padding:12px 16px;box-shadow:var(--shadow-sm)}.legend-title{font-size:var(--font-size-sm);font-weight:700;margin-bottom:8px}.legend-items{display:flex;flex-wrap:wrap;gap:8px}.legend-item{display:flex;align-items:center;gap:4px;font-size:var(--font-size-xs);color:var(--text-secondary)}.legend-dot{width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:10px}.legend-dot.great{background:#fff8e0}.legend-dot.good{background:#d1fae5}.legend-dot.bad{background:#fee2e2}.legend-dot.empty{background:#f3f4f6;color:#ccc}.rewards-page{overflow-y:auto;-webkit-overflow-scrolling:touch}.points-card{position:relative;border-radius:var(--radius-xl);overflow:hidden;margin-bottom:16px}.points-card-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#ffd93d,#ff8e53)}.points-card-content{position:relative;z-index:1;padding:20px;color:#fff}.points-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.points-title{font-size:var(--font-size-lg);font-weight:700}.points-amount{font-size:40px;font-weight:800;text-shadow:0 2px 8px rgba(0,0,0,.15)}.points-bar{height:8px;background:#ffffff4d;border-radius:4px;overflow:hidden;margin-bottom:12px}.points-bar-fill{height:100%;background:#fff;border-radius:4px;transition:width .6s ease}.points-milestones{display:flex;gap:12px;flex-wrap:wrap}.milestone{font-size:var(--font-size-xs);background:#fff3;padding:4px 10px;border-radius:12px;font-weight:600}.reward-section{margin-bottom:16px}.reward-section-header{display:flex;align-items:center;gap:8px;margin-bottom:4px}.section-icon{font-size:20px}.section-name{font-size:var(--font-size-base);font-weight:700}.section-points{font-size:var(--font-size-xs);color:var(--text-secondary);background:#f0f0f0;padding:2px 8px;border-radius:10px}.reward-section-desc{font-size:var(--font-size-xs);color:var(--text-secondary);margin-bottom:10px;padding-left:28px}.reward-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.reward-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:16px 12px;display:flex;flex-direction:column;align-items:center;gap:6px;border:2px solid #f0f0f0;cursor:pointer;transition:all .2s;-webkit-tap-highlight-color:transparent}.reward-card:active{transform:scale(.95)}.reward-card.can-afford{border-color:#e0f0ff;background:#fafcff}.reward-card.can-afford:hover{border-color:var(--color-blue);box-shadow:0 4px 12px #60a5fa26}.reward-card.cannot-afford{opacity:.6;border-style:dashed}.reward-icon{font-size:32px}.reward-name{font-size:var(--font-size-sm);font-weight:600;text-align:center}.reward-cost{font-size:var(--font-size-xs);color:var(--color-primary);font-weight:700;background:#fff0f0;padding:2px 10px;border-radius:10px}.redemption-history{background:var(--bg-card);border-radius:var(--radius-lg);padding:16px;box-shadow:var(--shadow-sm);margin-bottom:12px}.history-title{font-size:var(--font-size-base);font-weight:700;margin-bottom:12px}.history-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #f5f5f5}.history-item:last-child{border-bottom:none}.history-icon{font-size:20px}.history-info{flex:1;display:flex;flex-direction:column}.history-name{font-size:var(--font-size-sm);font-weight:600}.history-date{font-size:var(--font-size-xs);color:var(--text-light)}.history-cost{font-size:var(--font-size-base);font-weight:700;color:#dc2626}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:999;padding:24px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:#fff;border-radius:var(--radius-xl);padding:32px 24px;max-width:320px;width:100%;text-align:center}.modal-emoji{font-size:48px;margin-bottom:12px}.modal-title{font-size:var(--font-size-xl);font-weight:700;margin-bottom:8px}.modal-reward-name{font-size:var(--font-size-lg);color:var(--color-primary);font-weight:600;margin-bottom:8px}.modal-desc{font-size:var(--font-size-sm);color:var(--text-secondary);margin-bottom:12px}.modal-cost{font-size:var(--font-size-base);margin-bottom:20px;padding:8px;background:#fff8e0;border-radius:var(--radius-md)}.modal-cost strong{color:var(--color-primary);font-size:var(--font-size-xl)}.modal-btns{display:flex;gap:12px}.modal-btn{flex:1;padding:12px;border-radius:var(--radius-md);border:none;font-size:var(--font-size-base);font-weight:700;cursor:pointer;transition:all .2s}.modal-btn:active{transform:scale(.95)}.modal-btn.cancel{background:#f5f5f5;color:var(--text-secondary)}.modal-btn.confirm{background:linear-gradient(135deg,var(--color-primary),#FF8E8E);color:#fff;box-shadow:0 4px 12px #ff6b6b4d}.confetti-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;pointer-events:none}.success-card{background:#fff;border-radius:var(--radius-xl);padding:40px 32px;text-align:center;box-shadow:0 20px 60px #0003;z-index:1}.success-emoji{font-size:64px;margin-bottom:12px}.success-title{font-size:var(--font-size-2xl);font-weight:800;color:var(--color-primary);margin-bottom:8px}.success-reward{font-size:var(--font-size-lg);font-weight:600;margin-bottom:4px}.success-cost{font-size:var(--font-size-sm);color:var(--text-secondary)}.confetti-particle{position:absolute;top:30%;animation:confettiFall linear forwards;pointer-events:none}.settings-page{overflow-y:auto;-webkit-overflow-scrolling:touch}.settings-card-title{font-size:var(--font-size-base);font-weight:700;margin-bottom:14px}.cloud-status-row{display:flex;align-items:center;justify-content:space-between}.cloud-indicator{display:flex;align-items:center;gap:6px;font-size:var(--font-size-sm);font-weight:600}.cloud-indicator.connected{color:#059669}.cloud-indicator.disconnected{color:var(--text-secondary)}.indicator-dot{font-size:10px;animation:pulse 2s infinite}.cloud-hint{font-size:var(--font-size-xs);color:var(--text-secondary)}.input-hint{font-size:11px;color:var(--text-light);margin-top:6px;line-height:1.4}.avatar-selector{display:flex;align-items:center;gap:12px;margin-bottom:16px}.current-avatar{font-size:48px;width:64px;height:64px;display:flex;align-items:center;justify-content:center;background:#fff5f5;border-radius:var(--radius-lg)}.avatar-grid{display:flex;flex-wrap:wrap;gap:6px;flex:1}.avatar-btn{width:36px;height:36px;font-size:18px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:2px solid transparent;background:#f8f8f8;cursor:pointer;transition:all .2s}.avatar-btn.active{border-color:var(--color-primary);background:#fff0f0;transform:scale(1.1)}.avatar-btn:active{transform:scale(.9)}.input-group{margin-bottom:14px}.input-label{display:block;font-size:var(--font-size-sm);font-weight:600;color:var(--text-secondary);margin-bottom:6px}.input-field{width:100%;padding:10px 14px;border:2px solid #eee;border-radius:var(--radius-md);font-size:var(--font-size-base);outline:none;transition:border-color .2s}.input-field:focus{border-color:var(--color-primary)}.save-btn{width:100%;padding:12px;border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:700;cursor:pointer;transition:all .2s;background:linear-gradient(135deg,var(--color-primary),#FF8E8E);color:#fff;box-shadow:0 4px 12px #ff6b6b4d}.save-btn:active{transform:scale(.97)}.save-btn.saved{background:linear-gradient(135deg,#34d399,#10b981)}.settings-btns{display:flex;gap:10px}.settings-btn{flex:1;padding:10px;border:2px solid #eee;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all .2s;background:#fff;text-align:center}.settings-btn:active{transform:scale(.95)}.settings-btn.import,.settings-btn.export{border-color:#e0f0ff;color:var(--color-blue)}.settings-btn.danger{border-color:#ffd0d0;color:#dc2626}.import-result{margin-top:10px;padding:8px;border-radius:var(--radius-sm);background:#f0fff4;color:#059669;text-align:center;font-size:var(--font-size-sm);font-weight:600}.danger-desc{font-size:var(--font-size-sm);color:var(--text-secondary);margin-bottom:12px}.app-info{text-align:center;padding:20px;font-size:var(--font-size-xs);color:var(--text-light);display:flex;flex-direction:column;gap:4px}@media (min-width: 480px){.app{border-left:1px solid var(--border);border-right:1px solid var(--border);box-shadow:0 0 30px #ff6b6b14}}:root{--color-primary: #FF6B6B;--color-primary-light: #FF8E8E;--color-primary-dark: #E05555;--color-secondary: #4ECDC4;--color-accent: #FFD93D;--color-purple: #A78BFA;--color-blue: #60A5FA;--color-green: #34D399;--color-orange: #FB923C;--color-pink: #F472B6;--bg-page: #FFF5F5;--bg-card: #FFFFFF;--bg-card-alt: #FFFAF0;--text-primary: #2D3436;--text-secondary: #636E72;--text-light: #B2BEC3;--border: #FFE0E0;--shadow-sm: 0 2px 8px rgba(255,107,107,.08);--shadow-md: 0 4px 16px rgba(255,107,107,.12);--shadow-lg: 0 8px 32px rgba(255,107,107,.16);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--font-size-xs: 11px;--font-size-sm: 13px;--font-size-base: 15px;--font-size-lg: 18px;--font-size-xl: 22px;--font-size-2xl: 28px;--font-size-3xl: 36px;--tab-height: 64px;--header-height: 56px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;background:var(--bg-page);color:var(--text-primary);-webkit-font-smoothing:antialiased;overflow-x:hidden;height:100%;-webkit-user-select:none;user-select:none}#root{height:100%;display:flex;flex-direction:column}::-webkit-scrollbar{width:0;height:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes bounceIn{0%{transform:scale(0);opacity:0}50%{transform:scale(1.15)}to{transform:scale(1);opacity:1}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes sparkle{0%,to{opacity:.3;transform:scale(.8) rotate(0)}50%{opacity:1;transform:scale(1.2) rotate(180deg)}}@keyframes progressPulse{0%,to{opacity:.4}50%{opacity:1}}@keyframes confettiFall{0%{transform:translateY(-10px) rotate(0);opacity:1}to{transform:translateY(100px) rotate(720deg);opacity:0}}.animate-fade-in{animation:fadeIn .4s ease-out}.animate-slide-up{animation:slideUp .5s ease-out}.animate-scale-in{animation:scaleIn .3s ease-out}.animate-bounce-in{animation:bounceIn .5s cubic-bezier(.68,-.55,.265,1.55)}.page{flex:1;overflow-y:auto;padding:16px;padding-bottom:calc(var(--tab-height) + 20px);animation:fadeIn .3s ease-out}.page-title{text-align:center;font-size:var(--font-size-xl);font-weight:700;color:var(--text-primary);margin-bottom:16px;position:relative}.card{background:var(--bg-card);border-radius:var(--radius-lg);padding:16px;box-shadow:var(--shadow-sm);margin-bottom:12px;animation:fadeIn .3s ease-out}.page-enter{opacity:0;transform:translate(30px)}.page-enter-active{opacity:1;transform:translate(0);transition:all .3s ease-out}