#food-rhythm .fr-meals-page { display:grid; gap:20px; padding-bottom:18px; }
#food-rhythm .fr-meals-head { align-items:center; gap:14px; min-height:60px; }
#food-rhythm .fr-meals-head h1 { margin:0; font-size:29px; }
#food-rhythm .fr-meals-head p { margin:3px 0 0; color:#789087; font-size:13px; }
#food-rhythm .fr-meals-overview { position:relative; display:flex; justify-content:space-between; align-items:flex-end; min-height:150px; padding:23px; overflow:hidden; border:1px solid #dce8d7; border-radius:27px; background:linear-gradient(140deg,#e9f2df 0%,#f6f9eb 74%); color:var(--fr-face); }
#food-rhythm .fr-meals-overview::after { content:''; position:absolute; width:180px; height:180px; right:-54px; top:-85px; border:1px solid #bcd6bd99; border-radius:50%; box-shadow:0 0 0 28px #d7e8cf72,0 0 0 56px #e5efdb80; pointer-events:none; }
#food-rhythm .fr-meals-overview>div { position:relative; z-index:1; display:grid; gap:9px; }
#food-rhythm .fr-meals-overview>div>span { font-size:13px; font-weight:650; color:#537a63; }
#food-rhythm .fr-meals-overview strong { font-size:44px; line-height:1; letter-spacing:-.05em; font-variant-numeric:tabular-nums; }
#food-rhythm .fr-meals-overview strong small { margin-left:7px; font-size:15px; font-weight:650; letter-spacing:0; }
#food-rhythm .fr-meals-count { position:relative; z-index:1; display:grid; place-items:center; min-width:37px; height:37px; padding:0 11px; border-radius:13px; background:#fff9; color:var(--fr-leaf); font-size:12px; font-weight:750; white-space:nowrap; }
#food-rhythm .fr-meals-list-head { display:flex; align-items:center; margin:3px 2px -8px; }
#food-rhythm .fr-meals-list-head h2 { font-size:20px; }
#food-rhythm .fr-meals-list { display:grid; gap:10px; }
#food-rhythm .fr-meal-item { position:relative; display:grid; gap:13px; width:100%; min-width:0; padding:16px; border:1px solid #e2e9df; border-radius:23px; background:#fff; box-shadow:0 7px 25px #183e2d08; color:var(--fr-face); text-align:left; }
#food-rhythm button.fr-meal-item { cursor:pointer; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
@media(hover:hover) { #food-rhythm button.fr-meal-item:hover { border-color:#bdd2bf; box-shadow:0 10px 30px #183e2d12; transform:translateY(-2px); } }
#food-rhythm button.fr-meal-item:active { transform:scale(.99); }
#food-rhythm .fr-meal-main { display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:12px; }
#food-rhythm .fr-meal-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:16px; background:#edf4e7; color:var(--fr-leaf); }
#food-rhythm .fr-meal-item--photo .fr-meal-icon { background:#f2f3dc; }
#food-rhythm .fr-meal-item--barcode .fr-meal-icon { background:#e5f2ec; }
#food-rhythm .fr-meal-copy { display:grid; gap:3px; min-width:0; }
#food-rhythm .fr-meal-copy strong { overflow-wrap:anywhere; font-size:15px; line-height:1.25; }
#food-rhythm .fr-meal-copy small { color:#8b9b91; font-size:12px; }
#food-rhythm .fr-meal-energy { display:grid; justify-items:end; gap:1px; align-self:start; padding-top:2px; white-space:nowrap; }
#food-rhythm .fr-meal-energy strong { font-size:20px; line-height:1.1; font-variant-numeric:tabular-nums; }
#food-rhythm .fr-meal-energy small { color:#8b9b91; font-size:11px; }
#food-rhythm .fr-meal-macros { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:12px 18px 0 60px; border-top:1px solid #edf1ea; }
#food-rhythm .fr-meal-macros>span { display:flex; align-items:baseline; gap:5px; white-space:nowrap; }
#food-rhythm .fr-meal-macros small { color:#8b9b91; font-size:11px; }
#food-rhythm .fr-meal-macros strong { font-size:12px; font-weight:650; font-variant-numeric:tabular-nums; }
#food-rhythm .fr-meal-chevron { position:absolute; right:13px; bottom:13px; color:#a8b8ae; }
#food-rhythm .fr-meal-chevron .fr-ui-icon { width:15px; height:15px; }
@media(max-width:370px) { #food-rhythm .fr-meals-overview { min-height:138px; padding:20px; } #food-rhythm .fr-meals-overview strong { font-size:39px; } #food-rhythm .fr-meal-item { padding:14px; } #food-rhythm .fr-meal-main { gap:9px; grid-template-columns:42px minmax(0,1fr) auto; } #food-rhythm .fr-meal-icon { width:42px; height:42px; } #food-rhythm .fr-meal-macros { padding-left:51px; gap:4px; } }
@media(prefers-reduced-motion:reduce) { #food-rhythm button.fr-meal-item { transition:none; } }
