:root{--bg:#fafaf8;--bg-elevated:#fff;--bg-sunken:#f2f2ef;--text:#1c1c1e;--text-secondary:#6b6b70;--text-tertiary:#a1a1a6;--separator:#3c3c431f;--green:#34c759;--green-soft:#e8f8ec;--orange:#ff9500;--orange-soft:#fff4e5;--red:#ff3b30;--red-soft:#ffecea;--blue:#007aff;--blue-soft:#e9f2ff;--radius-sm:10px;--radius-md:14px;--radius-lg:20px;--shadow-card:0 1px 2px #0000000a, 0 8px 24px -12px #0000001f;--font:-apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;--tabbar-height:56px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;overscroll-behavior-y:none;font-size:15px;line-height:1.5}#root{flex-direction:column;min-height:100dvh;display:flex}button{font-family:inherit;font-size:inherit;cursor:pointer;color:inherit;background:0 0;border:none;padding:0}input,textarea,select{font-family:inherit;font-size:inherit;color:inherit}.app-shell{flex-direction:column;flex:1;width:100%;max-width:560px;margin:0 auto;display:flex;position:relative}.page{-webkit-overflow-scrolling:touch;padding:calc(env(safe-area-inset-top) + 12px) 16px calc(var(--tabbar-height) + env(safe-area-inset-bottom) + 24px);flex:1;overflow-y:auto}.page-header{justify-content:space-between;align-items:baseline;margin-bottom:16px;display:flex}.page-title{letter-spacing:-.02em;margin:0;font-size:26px;font-weight:600}.page-subtitle{color:var(--text-secondary);font-size:13px}.section-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;margin:24px 0 10px;font-size:13px;font-weight:600}.card{background:var(--bg-elevated);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:18px}.card+.card{margin-top:12px}.card-action{text-align:left;width:100%;margin-top:12px;padding:14px 18px;transition:transform .15s;display:block}.card-action:active{transform:scale(.99)}.card-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.ring-wrap{flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.ring-center{text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.ring-value{font-variant-numeric:tabular-nums;letter-spacing:-.02em;font-size:24px;font-weight:600;line-height:1.1}.ring-unit{color:var(--text-tertiary);margin-top:2px;font-size:11px}.nutrient-list{flex-direction:column;gap:14px;display:flex}.nutrient-head{justify-content:space-between;align-items:baseline;margin-bottom:6px;display:flex}.nutrient-name{color:var(--text-secondary);font-size:13px}.nutrient-value{font-variant-numeric:tabular-nums;color:var(--text);font-size:13px}.nutrient-value strong{font-weight:600}.nutrient-track{background:var(--bg-sunken);border-radius:4px;height:8px;position:relative;overflow:hidden}.nutrient-band{background:var(--green-soft);position:absolute;top:0;bottom:0}.nutrient-fill{border-radius:4px;transition:width .35s;position:absolute;top:0;bottom:0;left:0}.nutrient-fill.is-within{background:var(--green)}.nutrient-fill.is-over{background:var(--red)}.nutrient-fill.is-under{background:var(--orange)}.record-list{flex-direction:column;gap:10px;display:flex}.record{background:var(--bg-elevated);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:14px 16px}.record-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.record-meal{font-size:14px;font-weight:600}.record-meta{color:var(--text-tertiary);font-variant-numeric:tabular-nums;font-size:12px}.record-entries{flex-direction:column;gap:4px;margin-top:8px;display:flex}.record-entry{color:var(--text-secondary);justify-content:space-between;align-items:baseline;font-size:13px;display:flex}.record-entry-name{text-overflow:ellipsis;white-space:nowrap;margin-right:12px;overflow:hidden}.record-entry-value{font-variant-numeric:tabular-nums;flex-shrink:0}.record-note{color:var(--text-tertiary);margin-top:6px;font-size:12px}.empty-state{text-align:center;color:var(--text-tertiary);padding:40px 20px;font-size:14px}.tag{border-radius:999px;align-items:center;padding:2px 8px;font-size:11px;font-weight:600;line-height:1.6;display:inline-flex}.tag-within{background:var(--green-soft);color:#1d7a34}.tag-over{background:var(--red-soft);color:#b3261e}.tag-under{background:var(--orange-soft);color:#9a5c00}.tag-neutral{background:var(--bg-sunken);color:var(--text-secondary)}.fab{bottom:calc(var(--tabbar-height) + env(safe-area-inset-bottom) + 16px);background:var(--text);color:#fff;border-radius:999px;align-self:flex-end;align-items:center;gap:6px;height:46px;margin-top:16px;padding:0 20px;font-size:15px;font-weight:600;display:inline-flex;position:sticky;box-shadow:0 8px 24px -8px #0006}.fab:active{transform:scale(.97)}.tabbar{z-index:10;-webkit-backdrop-filter:saturate(180%)blur(20px);border-top:1px solid var(--separator);padding-bottom:env(safe-area-inset-bottom);background:#fafaf8eb;display:flex;position:fixed;bottom:0;left:0;right:0}.tabbar-inner{width:100%;max-width:560px;margin:0 auto;display:flex}.tab{height:var(--tabbar-height);color:var(--text-tertiary);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;font-size:10px;text-decoration:none;display:flex}.tab.is-active{color:var(--text)}.tab-icon{font-size:18px;line-height:1}.sheet-backdrop{z-index:20;background:#00000052;justify-content:center;align-items:flex-end;animation:.18s fade-in;display:flex;position:fixed;inset:0}.sheet{background:var(--bg-elevated);width:100%;max-width:560px;max-height:88dvh;padding:8px 20px calc(20px + env(safe-area-inset-bottom));border-radius:22px 22px 0 0;animation:.24s cubic-bezier(.32,.72,0,1) slide-up;overflow-y:auto}.sheet-handle{background:#3c3c4333;border-radius:3px;width:36px;height:5px;margin:6px auto 14px}.sheet-title{margin:0 0 16px;font-size:18px;font-weight:600}@keyframes fade-in{0%{opacity:0}}@keyframes slide-up{0%{opacity:.6;transform:translateY(24px)}}@media (prefers-reduced-motion:reduce){.sheet,.sheet-backdrop{animation:none}.nutrient-fill{transition:none}}.field{flex-direction:column;gap:6px;margin-bottom:14px;display:flex}.field-label{color:var(--text-secondary);font-size:13px;font-weight:500}.input{border-radius:var(--radius-sm);border:1px solid var(--separator);background:var(--bg-sunken);width:100%;height:44px;padding:0 12px;font-size:16px}.input:focus{outline:2px solid var(--blue);outline-offset:-1px;background:var(--bg-elevated)}.field-row{gap:10px;display:flex}.field-row>*{flex:1}.segmented{background:var(--bg-sunken);border-radius:var(--radius-sm);padding:2px;display:flex}.segmented button{height:34px;color:var(--text-secondary);border-radius:8px;flex:1;font-size:13px;font-weight:500}.segmented button.is-active{background:var(--bg-elevated);color:var(--text);box-shadow:0 1px 3px #0000001a}.btn-primary{border-radius:var(--radius-md);background:var(--text);color:#fff;width:100%;height:48px;margin-top:8px;font-size:16px;font-weight:600}.btn-primary:disabled{opacity:.35}.btn-ghost{border-radius:var(--radius-sm);height:40px;color:var(--text-secondary);padding:0 14px;font-size:14px}.btn-ghost:active{background:var(--bg-sunken)}.boot{color:var(--text-tertiary);flex:1;justify-content:center;align-items:center;font-size:14px;display:flex}.hint{color:var(--text-tertiary);font-size:12px;line-height:1.6}.chip{background:var(--bg-sunken);color:var(--text-secondary);border-radius:999px;padding:6px 12px;font-size:13px;line-height:1.4}.chip:active{background:var(--separator)}.summary-text{font-family:var(--font);color:var(--text);white-space:pre-wrap;word-break:break-word;font-variant-numeric:tabular-nums;margin:0;font-size:13px;line-height:1.75}
