:root{--color-bg: #f4f2ec;--color-bg-panel: #ffffff;--color-primary: #3b6343;--color-secondary: #2c4a32;--color-accent: #000000;--color-text: #1a1a1a;--color-text-muted: #666666;--radius-lg: 16px;--radius-md: 12px;--radius-sm: 8px;--shadow-glow: 0 4px 12px rgba(59, 99, 67, .2);--shadow-panel: 0 4px 16px rgba(0, 0, 0, .05)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Outfit,sans-serif;background-color:var(--color-bg);color:var(--color-text);line-height:1.5;-webkit-font-smoothing:antialiased}.app-container{max-width:480px;margin:0 auto;min-height:100vh;background:var(--color-bg);position:relative;overflow:hidden;display:flex;flex-direction:column}.glass-panel{background:var(--color-bg-panel);border:1px solid rgba(0,0,0,.05);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-panel)}.btn{background:var(--color-primary);color:#fff;border:none;padding:12px 24px;border-radius:24px;font-weight:600;font-size:1rem;cursor:pointer;transition:all .3s ease;font-family:inherit;width:100%;display:inline-flex;justify-content:center;align-items:center;gap:8px}.btn:hover{background:var(--color-secondary);box-shadow:var(--shadow-glow);transform:translateY(-2px)}.btn-secondary{background:transparent;color:var(--color-primary);border:2px solid var(--color-primary)}.btn-secondary:hover{background:rgba(59,99,67,.05);color:var(--color-primary)}.input-field{width:100%;background:#ffffff;border:1px solid #d1d1d1;color:var(--color-text);padding:14px 16px;border-radius:var(--radius-sm);font-size:1rem;font-family:inherit;margin-bottom:16px;transition:border-color .3s}.input-field:focus{outline:none;border-color:var(--color-primary)}.text-gradient{color:var(--color-accent)}.nav-bar{display:flex;justify-content:space-around;padding:16px;background:#ffffff;border-top:1px solid rgba(0,0,0,.05);position:sticky;bottom:0;margin-top:auto;box-shadow:0 -4px 12px #00000008}.nav-item{color:var(--color-text-muted);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.75rem;transition:color .3s}.nav-item.active,.nav-item:hover{color:var(--color-primary)}.header{display:flex;justify-content:space-between;align-items:center;padding:24px 20px;background:#ffffff;box-shadow:0 2px 10px #00000008}.header-logo{font-size:1.5rem;font-weight:800;letter-spacing:1px}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-slide-up{animation:slideUp .5s cubic-bezier(.16,1,.3,1) forwards}