:root{--bg: #f6f7f9;--surface: #ffffff;--surface-2: #eef0f3;--text: #16202b;--text-dim: #5b6a7a;--border: #dde2e8;--accent: #16a34a;--accent-soft: #dcfce7;--accent-text: #14532d;--danger: #dc2626;--warn: #d97706;--info: #2563eb;--protein: #2563eb;--carbs: #d97706;--fat: #9333ea;--radius: 12px;--tabbar-h: 60px;--shadow: 0 1px 3px rgba(0, 0, 0, .08)}@media (prefers-color-scheme: dark){:root{--bg: #0f172a;--surface: #1e293b;--surface-2: #283548;--text: #e6edf5;--text-dim: #94a3b8;--border: #334155;--accent: #22c55e;--accent-soft: #14532d;--accent-text: #bbf7d0;--shadow: 0 1px 3px rgba(0, 0, 0, .4)}}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px;-webkit-tap-highlight-color:transparent}#root{min-height:100dvh}.app-main{max-width:560px;margin:0 auto;padding:12px 12px calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 16px)}h1{font-size:1.35rem;margin:8px 0 12px}h2{font-size:1.05rem;margin:0 0 8px}button{font:inherit;color:inherit;border:none;background:none;cursor:pointer;padding:0}input,select,textarea{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:10px 12px;width:100%}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px}label{display:block;font-size:.85rem;color:var(--text-dim);margin-bottom:4px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;margin-bottom:12px}.card-tappable:active{background:var(--surface-2)}.row{display:flex;align-items:center;gap:10px}.row-between{display:flex;align-items:center;justify-content:space-between;gap:10px}.grow{flex:1;min-width:0}.dim{color:var(--text-dim)}.small{font-size:.85rem}.tiny{font-size:.75rem}.bold{font-weight:600}.mt8{margin-top:8px}.mt12{margin-top:12px}.mb8{margin-bottom:8px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:10px;padding:10px 16px;font-weight:600;background:var(--surface-2);color:var(--text);border:1px solid var(--border)}.btn:active{filter:brightness(.92)}.btn-primary{background:var(--accent);color:#fff;border-color:transparent}.btn-danger{background:var(--danger);color:#fff;border-color:transparent}.btn-ghost{background:transparent;border-color:transparent;color:var(--accent)}.btn-block{width:100%}.btn-lg{padding:14px 18px;font-size:1.05rem}.btn:disabled{opacity:.5;pointer-events:none}.tabbar{position:fixed;bottom:0;left:0;right:0;height:calc(var(--tabbar-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--surface);border-top:1px solid var(--border);display:flex;z-index:50}.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none;color:var(--text-dim);font-size:.68rem;position:relative}.tabbar a.active{color:var(--accent)}.tabbar .tab-icon{font-size:1.35rem;line-height:1}.tab-badge{position:absolute;top:6px;right:calc(50% - 22px);background:var(--danger);color:#fff;font-size:.65rem;font-weight:700;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 4px}.seg{display:flex;background:var(--surface-2);border-radius:10px;padding:3px;gap:2px}.seg button{flex:1;padding:8px 4px;border-radius:8px;font-size:.85rem;font-weight:600;color:var(--text-dim);white-space:nowrap}.seg button.active{background:var(--surface);color:var(--text);box-shadow:var(--shadow)}.list-item{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}.list-item:last-child{border-bottom:none}.bar{height:8px;border-radius:4px;background:var(--surface-2);overflow:hidden}.bar>div{height:100%;border-radius:4px;background:var(--accent);transition:width .3s}.bar.over>div{background:var(--danger)}.toast{position:fixed;bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 16px);left:50%;transform:translate(-50%);background:var(--text);color:var(--bg);padding:10px 18px;border-radius:20px;font-size:.9rem;font-weight:600;z-index:100;animation:toast-in .2s ease-out;max-width:90vw;text-align:center}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:80;display:flex;align-items:flex-end;justify-content:center}.modal-sheet{background:var(--surface);border-radius:16px 16px 0 0;width:100%;max-width:560px;max-height:85dvh;overflow-y:auto;padding:16px 16px calc(16px + env(safe-area-inset-bottom))}.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.photo-grid .photo-cell{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--surface-2)}.photo-cell img{width:100%;height:100%;object-fit:cover}.photo-cell .photo-time{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#000000b3);color:#fff;font-size:.68rem;padding:12px 6px 4px}.capture-screen{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;z-index:90;display:flex;flex-direction:column}.capture-screen video{flex:1;width:100%;object-fit:cover;min-height:0}.capture-controls{display:flex;align-items:center;justify-content:space-around;padding:20px 20px calc(20px + env(safe-area-inset-bottom));background:#000}.shutter{width:72px;height:72px;border-radius:50%;background:#fff;border:5px solid rgba(255,255,255,.4);background-clip:padding-box}.shutter:active{transform:scale(.92)}.capture-close{color:#fff;font-size:1rem;font-weight:600;width:72px}.scan-wrap{position:relative;border-radius:var(--radius);overflow:hidden;background:#000;aspect-ratio:3/4;max-height:55dvh}.scan-wrap video{width:100%;height:100%;object-fit:cover}.scan-reticle{position:absolute;top:35%;left:12%;right:12%;height:30%;border:2px solid rgba(255,255,255,.85);border-radius:10px;box-shadow:0 0 0 100vmax #00000059}.rings-row{display:flex;justify-content:space-around;align-items:flex-start}.ring-label{text-align:center;font-size:.75rem;color:var(--text-dim);margin-top:4px}.meal-header{display:flex;align-items:center;justify-content:space-between;padding:4px 0}.star-btn{font-size:1.3rem;color:var(--text-dim);padding:4px}.star-btn.on{color:#eab308}.check-btn{width:28px;height:28px;border-radius:50%;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.check-btn.on{background:var(--accent);border-color:var(--accent);color:#fff}.group-children{margin-left:13px;padding-left:14px;border-left:2px solid var(--border)}.group-children .list-item:last-child{border-bottom:none}.med-row{padding:4px 0;touch-action:pan-y}.drag-handle{color:var(--text-dim);cursor:grab;padding:6px 4px;font-size:.9rem;touch-action:none;-webkit-user-select:none;user-select:none}.inline-edit{border:none;background:transparent;border-radius:6px;padding:8px 4px}.inline-edit:focus{outline:none;background:var(--surface-2)}.checked-text{text-decoration:line-through;color:var(--text-dim)}.rate-row{display:flex;gap:8px;justify-content:space-between}.rate-row button{flex:1;aspect-ratio:1;max-width:56px;border-radius:10px;background:var(--surface-2);font-size:1.3rem;border:2px solid transparent}.rate-row button.active{border-color:var(--accent);background:var(--accent-soft)}.fast-timer{text-align:center;padding:10px 0}.fast-timer .elapsed{font-size:2.4rem;font-weight:700;font-variant-numeric:tabular-nums}.nut-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}.nut-grid .nut-cell{background:var(--surface-2);border-radius:8px;padding:8px 4px}.nut-grid .nut-val{font-weight:700;font-size:.95rem}.nut-grid .nut-name{font-size:.68rem;color:var(--text-dim)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-grid .span2{grid-column:span 2}.page-header{position:sticky;top:0;background:var(--bg);z-index:10;padding:8px 0;display:flex;align-items:center;gap:10px}.back-btn{font-size:1.4rem;color:var(--accent);padding:4px 8px}.empty-state{text-align:center;color:var(--text-dim);padding:32px 16px}.empty-state .empty-icon{font-size:2.5rem;margin-bottom:8px}
