:root{--brand-primary:#0a81f2;--brand-primary-alt:#157dfa;--brand-primary-hover:#0e93f9;--brand-primary-active:#0b60de;--brand-50:#eef3fc;--brand-100:#d9e2f6;--gradient-brand:linear-gradient(135deg, #157dfa 0%, #9272f8 50%, #bea4fd 100%);--gradient-brand-cta:linear-gradient(135deg, #157dfa 0%, #9272f8 100%);--accent-teal:#2ab9ad;--accent-purple:#9272f8;--accent-purple-light:#bea4fd;--teal-bg:#e6f7f5;--purple-bg:#f1eafe;--text-primary:#1a1a1a;--text-secondary:#705b7a;--text-placeholder:#a1abbc;--text-inverse:#fff;--bg-page:#f5f5f5;--bg-card:#fff;--bg-info:#eef3fc;--border-light:#eff3f9;--border-strong:#d9e2f6;--success:#27ae60;--success-bg:#e8f8ef;--warning:#e67e22;--warning-bg:#fdf3e3;--warning-text:#b26a00;--danger:#e74c3c;--danger-bg:#fff4f3;--info:#0a81f2;--font-family:-apple-system, "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;--font-xxl:22px;--font-xl:18px;--font-lg:16px;--font-md:14px;--font-sm:12px;--font-xs:11px;--font-num-lg:22px;--radius-card:10px;--radius-button:22px;--radius-input:10px;--radius-pill:999px;--shadow-card:0 2px 8px #0000000a;--shadow-modal:0 8px 32px #1f29372e;--shadow-btn:0 8px 20px #157dfa47;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--content-max-width:480px;--page-padding:16px;--nav-height:44px;--btn-height:44px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--canvas:#f5f5f5;--surface:#fff;--ink-900:#1a1a1a;--ink-600:#705b7a;--ink-400:#a1abbc;--divider:#eff3f9}*,:before,:after{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px}body{font-family:var(--font-family);color:var(--text-primary);background-color:var(--bg-page);text-align:left;min-height:100dvh;line-height:1.5;overflow-x:hidden}#app{min-height:100dvh}button{font-family:inherit}.scroll-hidden{-ms-overflow-style:none;scrollbar-width:none}.scroll-hidden::-webkit-scrollbar{display:none}.flex{display:flex}.flex-col{flex-direction:column}.flex-center{justify-content:center;align-items:center}.flex-between{justify-content:space-between;align-items:center}.text-left{text-align:left}.text-center{text-align:center}.num-tabular{font-variant-numeric:tabular-nums}.btn{cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;font-family:inherit;font-weight:600;transition:transform .15s,background-color .15s,opacity .15s;display:inline-flex}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-primary{background-color:var(--brand-primary);color:var(--text-inverse);height:var(--btn-height);border-radius:var(--radius-button);width:100%;padding:0 24px;font-size:16px}.btn-primary:active{background-color:var(--brand-primary-active)}.btn-primary-gradient{background:var(--gradient-brand-cta);color:var(--text-inverse);height:var(--btn-height);border-radius:var(--radius-button);width:100%;box-shadow:var(--shadow-btn);padding:0 24px;font-size:16px}.btn-primary-gradient:active{filter:brightness(.96);transform:scale(.98)}.btn-secondary{background-color:var(--bg-card);color:var(--brand-primary);height:var(--btn-height);border-radius:var(--radius-button);border:1px solid var(--brand-primary);width:100%;padding:0 24px;font-size:16px}.btn-secondary:active{background-color:var(--brand-50)}.btn-teal{background-color:var(--accent-teal);color:var(--text-inverse);height:var(--btn-height);border-radius:var(--radius-button);width:100%;padding:0 24px;font-size:16px}.btn-teal:active{filter:brightness(.96);transform:scale(.98)}.btn-ghost{border-radius:var(--radius-input);color:var(--brand-primary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;gap:4px;height:44px;padding:0 12px;font-size:14px;font-weight:500;transition:background-color .15s;display:inline-flex}.btn-ghost:active{background-color:var(--brand-50)}.btn-spinner{border:2px solid #ffffff59;border-top-color:#fff;border-radius:50%;width:16px;height:16px;margin-right:8px;animation:.8s linear infinite btn-spin}@keyframes btn-spin{to{transform:rotate(360deg)}}.card{background:var(--bg-card);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:var(--space-4)}.input{border:1px solid var(--border-light);border-radius:var(--radius-input);background:var(--bg-card);width:100%;height:48px;color:var(--text-primary);outline:none;padding:0 16px;font-family:inherit;font-size:16px;transition:border-color .15s,box-shadow .15s}.input::placeholder{color:var(--text-placeholder)}.input:focus{border-color:var(--brand-primary);box-shadow:0 0 0 4px #0a81f21f}.input-error{border-color:var(--danger)}.tag{border-radius:var(--radius-pill);align-items:center;height:24px;padding:0 8px;font-size:12px;line-height:1;display:inline-flex}.tag-recommend{background-color:var(--brand-50);color:var(--brand-primary)}.tag-avoid{color:var(--danger);background-color:#e74c3c1a}.tag-warning{background-color:var(--warning-bg);color:var(--warning-text)}.tag-info{background-color:var(--bg-info);color:var(--text-secondary)}.tag-training{color:var(--accent-teal);background-color:#2ab9ad1a}.tag-diet{color:var(--accent-purple);background-color:#bea4fd29}.divider{background-color:var(--border-light);border:none;height:1px}.page-container{max-width:var(--content-max-width);padding:0 var(--page-padding);min-height:100dvh;margin:0 auto}.safe-top{padding-top:var(--safe-top)}.safe-bottom{padding-bottom:var(--safe-bottom)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.55}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.page-fade-enter-active,.page-fade-leave-active{transition:opacity .15s}.page-fade-enter-from,.page-fade-leave-to{opacity:0}
