:host{
  --bg:#070909;
  --panel:#101313;
  --panel-2:#151818;
  --panel-3:#1b1d1c;
  --text:#f5f1e9;
  --muted:#9d9e99;
  --line:rgba(255,255,255,.075);
  --accent:#e8ad72;
  --accent-2:#ffca91;
  --green:#63c796;
  --blue:#58b8e7;
  --yellow:#e8ca83;
  --danger:#ff8577;
  --radius:22px;
  --shadow:0 18px 60px rgba(0,0,0,.34);
}
*{box-sizing:border-box}
:host{scroll-behavior:smooth}
.nutrition-document{
  margin:0;
  min-width:320px;
  color:var(--text);
  background:
    radial-gradient(1200px 560px at 72% -120px,rgba(229,166,103,.08),transparent 65%),
    linear-gradient(180deg,#0a0c0c 0%,#060808 100%);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  overflow-x:hidden;
}
button,input,select,textarea{font:inherit}
button{color:inherit}
img{display:block;max-width:100%}
.page{
  width:min(1980px,calc(100% - 34px));
  margin:0 auto;
  padding:0 0 34px;
}
.hero{
  position:relative;
  height:873px;
  margin:0;
  border-radius:0 0 28px 28px;
  overflow:hidden;
  isolation:isolate;
  box-shadow:var(--shadow);
}
.hero::after{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,transparent 55%,rgba(0,0,0,.26)),
    linear-gradient(90deg,rgba(0,0,0,.08),transparent 34%,transparent 70%,rgba(0,0,0,.12));
  pointer-events:none;
}
.hero img{
  width:100%;height:100%;object-fit:cover;
  object-position:center center;
  transform:scale(1.015);
  animation:heroBreath 10s ease-in-out infinite alternate;
}
@keyframes heroBreath{
  from{transform:scale(1.015) translate3d(0,0,0)}
  to{transform:scale(1.04) translate3d(0,-5px,0)}
}

.date-section{
  display:block;
  margin-top:28px;
}
.date-shell{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.icon-btn,.date-card,.btn,.meal-card,.side-card,.wellbeing,.hunger-btn,.summary-strip,.balance-card,.insight-card,.week-card,.meal-photo-action{
  border:1px solid var(--line);
}
.icon-btn{
  flex:0 0 58px;
  height:124px;
  border-radius:20px;
  background:linear-gradient(180deg,#121515,#0d1010);
  display:grid;place-items:center;
  cursor:pointer;
  transition:.28s ease;
}
.icon-btn:hover{transform:translateY(-3px);border-color:rgba(232,173,114,.42);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.icon-btn:active{transform:translateY(0) scale(.97)}
.icon-btn svg{width:22px;height:22px;stroke:var(--accent-2)}
.date-track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(132px,1fr);
  gap:14px;
  overflow:hidden;
  flex:1;
  min-width:0;
  scroll-behavior:smooth;
}
.date-card{
  min-height:124px;
  border-radius:18px;
  background:linear-gradient(180deg,#151818,#101212);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  cursor:pointer;
  user-select:none;
  transition:.3s ease;
  position:relative;
  overflow:hidden;
  will-change:translate;
  animation:dateDrift 5.2s ease-in-out infinite;
  animation-delay:calc(var(--date-index,0) * -.32s);
}
@keyframes dateDrift{
  0%,100%{translate:0 0}
  50%{translate:0 -4px}
}
.date-card::after{
  content:"";
  position:absolute;inset:0;
  background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.06),transparent 52%);
  opacity:0;transition:.3s ease;
}
.date-card:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.16)}
.date-card:hover::after{opacity:1}
.date-card .day{font-size:32px;font-weight:800;line-height:1}
.date-card .month,.date-card .weekday{font-size:13px;color:var(--muted)}
.date-card.active{
  border-color:var(--accent);
  box-shadow:0 0 0 1px rgba(232,173,114,.25),0 0 26px rgba(232,173,114,.13);
  background:radial-gradient(circle at 50% 0%,rgba(232,173,114,.17),transparent 60%),#171817;
}
.date-card.active .month,.date-card.active .weekday{color:#ddd0c1}
.native-date-picker{
  position:fixed;left:50%;top:148px;width:1px;height:1px;opacity:0;pointer-events:none;
}

.main-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 350px;
  gap:24px;
  margin-top:28px;
}
.content{min-width:0}
.title-row{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:24px;
}
h1{
  margin:0;
  font:700 clamp(42px,4.3vw,66px)/.98 Georgia,"Times New Roman",serif;
  letter-spacing:.01em;
}
.subtitle{margin-top:10px;color:var(--muted);font-size:18px}
.actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}
.btn{
  height:58px;
  padding:0 22px;
  border-radius:18px;
  background:#121515;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  transition:.28s ease;
  white-space:nowrap;
}
.btn.primary{
  color:#21160d;
  border-color:rgba(255,214,170,.2);
  background:linear-gradient(180deg,#efbd8d,#dfa36d);
  font-weight:700;
  box-shadow:0 12px 30px rgba(222,154,94,.13);
  animation:softPulse 4.2s ease-in-out infinite;
}
@keyframes softPulse{
  0%,100%{box-shadow:0 10px 28px rgba(222,154,94,.10)}
  50%{box-shadow:0 12px 34px rgba(222,154,94,.22)}
}
.btn:hover{transform:translateY(-3px);border-color:rgba(232,173,114,.45)}
.btn.primary:hover{filter:brightness(1.06)}
.btn:active{transform:scale(.98)}
.btn svg{width:20px;height:20px}

.dashboard-tools{
  display:grid;
  grid-template-columns:minmax(0,1fr) 370px;
  gap:14px;
  align-items:stretch;
  margin:-6px 0 18px;
}
.summary-strip{
  min-height:64px;
  border-radius:18px;
  background:linear-gradient(180deg,#121515,#0d1010);
  display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;
  padding:14px 18px;
  color:#d8d6cf;
  box-shadow:0 12px 34px rgba(0,0,0,.18);
}
.summary-strip .summary-fire{font-size:22px;color:var(--accent-2)}
.summary-strip strong{color:var(--accent-2);font-size:16px}
.summary-strip .summary-dot{color:#686e6b}
.balance-card{
  min-height:64px;border-radius:18px;padding:11px 14px;
  background:radial-gradient(circle at 15% 0%,rgba(232,173,114,.11),transparent 52%),linear-gradient(180deg,#151818,#101212);
  display:grid;grid-template-columns:46px 1fr;gap:12px;align-items:center;
  box-shadow:0 12px 34px rgba(0,0,0,.18);
}
.balance-ring{
  --p:82; width:44px;aspect-ratio:1;border-radius:50%;
  background:conic-gradient(var(--accent-2) calc(var(--p)*1%),#2a2f2d 0);
  position:relative;
}
.balance-ring::after{content:"";position:absolute;inset:6px;border-radius:50%;background:#111414}
.balance-head{display:flex;align-items:baseline;gap:8px;font-weight:700}
.balance-head strong{font-size:23px;color:var(--accent-2)}
.balance-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.balance-tag{font-size:11px;border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:4px 8px;background:#0d1010;color:#aeb4b1}
.balance-tag.good{color:#8ce2b2;border-color:rgba(99,199,150,.22)}
.balance-tag.warn{color:#e9aa92;border-color:rgba(255,133,119,.2)}
.meal-photo-action{
  margin:0 14px 12px;min-height:43px;border-radius:13px;background:#0d1010;color:#aeb3b0;
  display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:.22s ease;
}
.meal-photo-action:hover{transform:translateY(-2px);border-color:rgba(232,173,114,.35);color:#fff;background:#111414}
.meal-photo-action input{display:none}
.meal-metrics{padding:0 14px 16px;display:grid;gap:12px}
.metric-group{display:grid;gap:7px}
.metric-title{display:flex;justify-content:space-between;gap:10px;color:#959c99;font-size:11px}
.metric-title b{color:#d9d7d1;font-weight:600}
.metric-control{display:grid;gap:5px}
.metric-control.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.metric-control.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hunger-btn.compact{font-size:10px;padding:7px 3px;white-space:normal;line-height:1.15}
.meal-menu{position:relative;margin-left:auto}
.meal-menu .more{margin-left:0}
.meal-menu-pop{
  display:none;position:absolute;right:0;top:38px;z-index:12;width:190px;padding:7px;border-radius:14px;
  background:#111414;border:1px solid rgba(255,255,255,.11);box-shadow:0 18px 50px rgba(0,0,0,.55);
}
.meal-menu.open .meal-menu-pop{display:grid;animation:fade .15s ease}
.meal-menu-pop button{border:0;background:transparent;color:#c9ccc8;text-align:left;padding:10px;border-radius:9px;cursor:pointer;font-size:12px}
.meal-menu-pop button:hover{background:rgba(255,255,255,.06);color:#fff}
.meal-menu-pop button.danger{color:#e99b92}
.insight-card{
  margin-top:18px;border-radius:20px;padding:19px 22px;background:radial-gradient(circle at 0 50%,rgba(232,173,114,.09),transparent 30%),#0d1010;
  display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:center;
}
.insight-icon{font-size:28px;color:var(--accent-2)}
.insight-card strong{display:block;color:var(--accent-2);margin-bottom:4px}
.insight-card p{margin:0;color:#c5c5bf;font-size:14px;line-height:1.5}
.fiber-row{margin-top:12px}
.bar.fiber i{width:60%;background:var(--green)}
.week-card{margin-top:18px;border-radius:20px;background:linear-gradient(180deg,#151818,#101212);padding:18px}
.week-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.week-link{border:0;background:transparent;color:#9da3a0;font-size:11px;cursor:pointer}
.week-link:hover{color:var(--accent-2)}
.week-bars{height:78px;display:grid;grid-template-columns:repeat(7,1fr);gap:8px;align-items:end;margin-top:16px}
.week-bar{display:grid;gap:5px;justify-items:center;border:0;background:transparent;padding:0;cursor:pointer;color:inherit}
.week-bar:hover i{filter:brightness(1.25);transform:translateY(-2px)}
.week-bar:focus-visible{outline:1px solid var(--accent);outline-offset:4px;border-radius:8px}
.week-bar i{display:block;width:100%;max-width:22px;height:var(--h);min-height:4px;border-radius:8px 8px 3px 3px;background:#39403d;transition:.25s ease}
.week-bar.active i{background:linear-gradient(180deg,var(--accent-2),#c58a55);box-shadow:0 0 16px rgba(232,173,114,.15)}
.week-bar span{font-size:9px;color:#737a77}
.week-stats{display:grid;gap:9px;margin-top:14px;padding-top:13px;border-top:1px solid var(--line)}
.week-stat{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:#a9adaa}
.week-stat b{color:#ddd9d0}
.analytics-modal .modal-card{width:min(720px,100%)}
.analytics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}
.analytics-tile{border:1px solid var(--line);border-radius:16px;padding:15px;background:#0b0e0e}
.analytics-tile span{display:block;color:#8f9692;font-size:12px}
.analytics-tile strong{display:block;margin-top:6px;font-size:22px;color:var(--accent-2)}
.analytics-big-bars{height:180px;display:grid;grid-template-columns:repeat(7,1fr);gap:14px;align-items:end;margin-top:24px}
.analytics-big-bar{display:grid;gap:8px;justify-items:center}
.analytics-big-bar i{display:block;width:100%;max-width:46px;height:var(--h);min-height:4px;border-radius:12px 12px 4px 4px;background:linear-gradient(180deg,#b77d4b,#3b3934)}
.analytics-big-bar.active i{background:linear-gradient(180deg,var(--accent-2),#d49b65);box-shadow:0 0 22px rgba(232,173,114,.2)}
.analytics-big-bar span{font-size:11px;color:#8e9591}
.analytics-days{display:grid;gap:9px;margin-top:22px}
.analytics-day{border:1px solid var(--line);border-radius:15px;background:#0b0e0e;overflow:hidden}
.analytics-day[open]{border-color:rgba(232,173,114,.3)}
.analytics-day summary{list-style:none;display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center;padding:14px;cursor:pointer}
.analytics-day summary::-webkit-details-marker{display:none}
.analytics-day summary::after{content:"＋";color:var(--accent-2);font-size:18px}
.analytics-day[open] summary::after{content:"−"}
.analytics-day-name{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#171b1a;color:var(--accent-2);font-weight:800}
.analytics-day-summary b{display:block;font-size:14px}
.analytics-day-summary span{display:block;margin-top:3px;color:#858d89;font-size:11px}
.analytics-day-body{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:0 14px 14px}
.analytics-day-metric{padding:11px;border-radius:11px;background:#111514;color:#939a96;font-size:11px}
.analytics-day-metric b{display:block;margin-top:4px;color:#e1ded6;font-size:13px}
.analytics-day-actions{display:flex;justify-content:flex-end;padding:0 14px 14px}
.analytics-open-day{min-height:39px;border:1px solid rgba(232,173,114,.25);border-radius:11px;background:#191510;color:var(--accent-2);padding:0 13px;cursor:pointer}
.analytics-open-day:hover{border-color:rgba(232,173,114,.5);background:#211a13}
.analytics-meals{display:grid;gap:10px;padding:0 14px 14px}
.analytics-meals-title{margin:1px 0 0;color:#ddd9d1;font-size:13px}
.analytics-meal-preview{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;padding:10px;border-radius:13px;background:#111514;border:1px solid rgba(255,255,255,.06)}
.analytics-meal-photo{width:92px;height:92px;border-radius:11px;overflow:hidden;background:#090b0b;display:grid;place-items:center;color:#626966;font-size:11px;text-align:center}
.analytics-meal-photo img{width:100%;height:100%;object-fit:cover}
.analytics-meal-head{display:flex;justify-content:space-between;gap:9px;font-size:12px}
.analytics-meal-head b{color:#f0ece4}.analytics-meal-head span{color:var(--accent-2);white-space:nowrap}
.analytics-foods{display:grid;gap:4px;margin:7px 0 0;padding:0;list-style:none;color:#9ea4a0;font-size:11px}
.analytics-foods li{display:flex;justify-content:space-between;gap:8px;border-top:1px solid rgba(255,255,255,.045);padding-top:4px}
.analytics-empty{padding:4px 14px 15px;color:#747c78;font-size:12px}
.meal-slider-section{min-width:0}
.meal-slider-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 14px}
.meal-slider-head h2{margin:0;font:700 25px Georgia,serif}
.meal-slider-controls{display:flex;align-items:center;gap:9px}
.meal-slider-count{min-width:52px;text-align:center;color:#9ca29f;font-size:12px}
.slider-arrow{width:42px;height:42px;border-radius:14px;border:1px solid var(--line);background:#121515;color:var(--accent-2);cursor:pointer;transition:.22s ease}
.slider-arrow:hover{transform:translateY(-2px);border-color:rgba(232,173,114,.4);background:#181b1b}
.slider-arrow:disabled{opacity:.35;cursor:default;transform:none}
.meal-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin:16px auto 0;min-height:10px;max-width:100%}
.meal-dot{width:7px;height:7px;padding:0;border:0;border-radius:99px;background:#454a48;cursor:pointer;transition:.25s ease}
.meal-dot.active{width:25px;background:var(--accent)}
.meals{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  padding:24px 0 74px;
  perspective:1900px;
  transform-style:preserve-3d;
  isolation:isolate;
  min-width:0;
  touch-action:pan-y;
  cursor:grab;
}
.meals.is-dragging{cursor:grabbing}
.meal-card{
  grid-area:1/1;
  width:min(78%,800px);
  justify-self:center;
  background:
    radial-gradient(600px 220px at 50% 0%,rgba(255,255,255,.03),transparent),
    linear-gradient(180deg,#161919,#111313);
  border-radius:20px;
  overflow:hidden;
  min-width:0;
  box-shadow:0 14px 40px rgba(0,0,0,.18);
  transform:translate3d(var(--card-x,0%),var(--card-y,0px),var(--card-z,0px)) scale(var(--card-scale,1)) rotateY(var(--card-ry,0deg)) rotateZ(var(--card-rz,0deg));
  transform-origin:center top;
  filter:brightness(var(--card-brightness,1)) saturate(var(--card-saturation,1));
  opacity:var(--card-opacity,1);
  z-index:var(--card-layer,10);
  pointer-events:none;
  transition:transform .52s cubic-bezier(.2,.78,.2,1),filter .45s ease,opacity .45s ease,border-color .25s ease,box-shadow .25s ease;
}
.meal-card.is-active{pointer-events:auto;box-shadow:0 28px 80px rgba(0,0,0,.48),0 0 0 1px rgba(232,173,114,.07)}
.meal-card.is-outside{visibility:hidden;opacity:0!important;pointer-events:none!important}
.meal-card:not(.is-active){box-shadow:0 22px 65px rgba(0,0,0,.55);border-color:rgba(232,173,114,.13)}
.meals.is-dragging .meal-card.is-active{transition:none;transform:translate3d(var(--drag-x,0px),0,75px) scale(1.015) rotateY(var(--drag-ry,0deg)) rotateZ(var(--drag-rz,0deg))}
@keyframes cardIn{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}
.meals:not(.is-dragging) .meal-card.is-active:hover{
  transform:translateY(-6px);
  border-color:rgba(232,173,114,.3);
  box-shadow:0 24px 60px rgba(0,0,0,.34),0 0 28px rgba(232,173,114,.055);
}
.meal-head{
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 18px 14px;
}
.meal-icon{
  width:42px;height:42px;border-radius:50%;
  overflow:hidden;border:1px solid rgba(255,255,255,.08);display:grid;place-items:center;
  box-shadow:0 6px 14px rgba(0,0,0,.3);
}
.meal-icon img{width:100%;height:100%;object-fit:cover}
.meal-title{font-weight:800;font-size:18px}
.meal-time{font-size:14px;color:#9da5a5;margin-top:2px}
.more{
  margin-left:auto;background:none;border:0;color:#9aa09e;font-size:24px;
  cursor:pointer;border-radius:10px;padding:2px 8px;transition:.2s;
}
.more:hover{background:rgba(255,255,255,.06);color:white}
.food-photo{height:187px;margin:0 14px;border-radius:18px;overflow:hidden;position:relative}
.food-photo.empty{display:grid;place-items:center;background:linear-gradient(145deg,#111514,#090b0b);color:#69716d;font-size:13px}
.food-photo img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease,filter .55s ease}
.meal-card:hover .food-photo img{transform:scale(1.045);filter:saturate(1.05)}
.food-list{padding:14px 16px 4px}
.food-list:empty::before{content:"Состав не указан";display:block;padding:8px 0 13px;color:#747c78;font-size:12px}
.food-row{
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.055);
  color:#d8d7d2;font-size:13px;
}
.food-row span:last-child{color:#c7c7c1}
.food-row small{color:#858c89;margin-left:6px}
.meal-total{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 16px 12px;font-size:18px;font-weight:800;
}
.meal-total strong{color:var(--accent-2)}
.hunger{
  padding:0 14px 16px;
}
.hunger-label{
  display:flex;align-items:center;justify-content:space-between;
  color:#9da29f;font-size:12px;margin-bottom:8px;
}
.hunger-label b{color:#d9d7d1;font-weight:600}
.hunger-control{
  display:grid;grid-template-columns:repeat(3,1fr);gap:6px;
}
.hunger-btn{
  min-width:0;
  padding:8px 5px;
  border-radius:12px;
  background:#0d1010;
  color:#929997;
  cursor:pointer;
  font-size:12px;
  transition:.22s ease;
}
.hunger-btn:hover{transform:translateY(-2px);color:#fff;border-color:rgba(255,255,255,.16)}
.hunger-btn.active{
  color:#21160d;
  border-color:rgba(255,214,170,.25);
  background:linear-gradient(180deg,#efbd8d,#dfa36d);
  font-weight:700;
}
.wellbeing{
  margin-top:22px;
  min-height:180px;
  border-radius:22px;
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.55fr);
  align-items:center;
  padding:36px 42px;
  background:
    linear-gradient(90deg,rgba(8,11,11,.97),rgba(8,11,11,.7)),
    radial-gradient(900px 170px at 55% 100%,rgba(211,132,73,.2),transparent);
}
.wellbeing::before,.wellbeing::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:100px;
  background:linear-gradient(160deg,transparent 40%,rgba(39,43,43,.75) 41% 52%,transparent 53%);
  opacity:.45;pointer-events:none;
}
.wellbeing::after{
  transform:scaleX(-1) translateX(-14%);
  opacity:.3;
}
.wellbeing .left,.wellbeing .right{position:relative;z-index:1}
.wellbeing .left{display:flex;gap:22px;align-items:center;font-family:"Segoe Print",cursive;font-style:italic;color:#c4c1b9;font-size:18px}
.wellbeing .sprout{font-size:34px;color:var(--accent)}
.wellbeing .right{text-align:center;font-family:"Segoe Print",cursive;color:var(--accent-2);font-size:18px;transform:rotate(-3deg)}

.sidebar{min-width:0}
.side-card{
  border-radius:22px;
  background:linear-gradient(180deg,#151818,#101212);
  padding:20px;
  box-shadow:0 14px 40px rgba(0,0,0,.18);
}
.side-section+.side-section{border-top:1px solid var(--line);margin-top:22px;padding-top:20px}
.side-title{display:flex;align-items:center;gap:9px;font-weight:800;font-size:16px}
.side-title svg{width:19px;height:19px;stroke:var(--accent-2)}
.calorie{
  display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:center;margin-top:14px;
}
.ring{
  --p:84.95;
  width:144px;aspect-ratio:1;border-radius:50%;
  background:conic-gradient(var(--accent-2) calc(var(--p)*1%),#28302d 0);
  display:grid;place-items:center;position:relative;
  box-shadow:0 0 22px rgba(232,173,114,.08);
}
.ring::before{content:"";position:absolute;inset:10px;border-radius:50%;background:#111414;border:1px solid rgba(255,255,255,.08)}
.ring-text{position:relative;text-align:center}
.ring-text strong{display:block;font-size:26px}
.ring-text span{font-size:11px;color:#aaa}
.remaining{display:flex;gap:10px;align-items:center;color:#c8c7c1}
.remaining .fire{font-size:26px}
.remaining b{display:block;color:#fff;margin-bottom:3px}
.macro{margin-top:13px}
.macro-row{margin-top:12px}
.macro-line{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:#c8c8c2}
.bar{height:7px;background:#252929;border-radius:999px;overflow:hidden;margin-top:7px}
.bar i{display:block;height:100%;border-radius:999px;transform-origin:left;animation:grow 1s .3s both}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.bar.protein i{width:75%;background:var(--green)}
.bar.fat i{width:83%;background:var(--yellow)}
.bar.carbs i{width:72%;background:var(--blue)}
.water-head{display:flex;justify-content:space-between;align-items:center}
.water-value{font-size:24px;margin:8px 0 10px}
.water-glasses{display:grid;grid-template-columns:repeat(8,19px);align-items:end;gap:9px;max-height:112px;overflow-y:auto;padding:3px 3px 5px}
.cup{
  width:19px;height:31px;border:2px solid #5f6765;border-top-width:1px;
  clip-path:polygon(8% 0,92% 0,80% 100%,20% 100%);
  background:transparent;transition:.25s;padding:0;cursor:pointer;
}
.cup:hover{transform:translateY(-3px);border-color:#8a9692}
.cup.full{background:linear-gradient(180deg,#81d8ff,#4db8ea);border-color:#72cdf5;box-shadow:0 0 12px rgba(72,189,238,.15)}
.cup.partial{background:linear-gradient(to top,#4db8ea 0 var(--fill),transparent var(--fill) 100%);border-color:#72cdf5;box-shadow:0 0 10px rgba(72,189,238,.12)}
.water-plus{
  margin-left:auto;width:44px;height:44px;border-radius:50%;background:#181b1b;border:1px solid #4b514f;
  display:grid;place-items:center;font-size:24px;cursor:pointer;transition:.22s;
}
.water-plus:hover{transform:rotate(90deg) scale(1.08);border-color:var(--accent);color:var(--accent)}
.intake-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:12px}
.intake-input{display:flex;align-items:center;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:#090b0b;overflow:hidden}
.intake-input input{min-width:0;width:100%;border:0;background:transparent;color:#f1eee7;padding:10px 11px;outline:0}
.intake-input span{padding-right:10px;color:#808783;font-size:11px}
.intake-add{border:1px solid rgba(232,173,114,.28);border-radius:12px;background:#1a1713;color:var(--accent-2);padding:0 13px;cursor:pointer}
.intake-add:hover{background:#241c15;border-color:rgba(232,173,114,.52)}
.intake-reset{margin-top:8px;border:0;background:transparent;color:#777f7b;font-size:11px;cursor:pointer;padding:0}
.intake-reset:hover{color:#d5d2cb}
.intake-hint{display:block;margin-top:9px;color:#737b77;font-size:10px;line-height:1.4}
.calculator-launch{width:100%;min-height:48px;margin-bottom:18px;border:1px solid rgba(232,173,114,.25);border-radius:15px;background:linear-gradient(135deg,rgba(232,173,114,.13),rgba(232,173,114,.03));color:var(--accent-2);display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;font-weight:700;transition:.24s ease}
.calculator-launch:hover{transform:translateY(-2px);border-color:rgba(232,173,114,.5);background:linear-gradient(135deg,rgba(232,173,114,.2),rgba(232,173,114,.05))}
.calc-modal .modal-card{width:min(720px,100%)}
.calc-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:20px;padding:5px;border:1px solid var(--line);border-radius:15px;background:#090b0b}
.calc-tab{min-height:43px;border:0;border-radius:11px;background:transparent;color:#8f9692;cursor:pointer}
.calc-tab.active{background:#1b1e1d;color:var(--accent-2);font-weight:700;box-shadow:0 6px 18px rgba(0,0,0,.2)}
.calc-panel{display:none;margin-top:18px}
.calc-panel.active{display:block;animation:fade .18s ease}
.calc-note{margin:0 0 14px;color:#929995;font-size:12px;line-height:1.55}
.calc-result{display:none;margin-top:15px;padding:15px;border-radius:14px;background:rgba(232,173,114,.08);border:1px solid rgba(232,173,114,.25)}
.calc-result.show{display:flex;align-items:center;justify-content:space-between;gap:14px}
.calc-result strong{font-size:25px;color:var(--accent-2)}
.empty-meals{grid-area:1/1;min-height:330px;width:min(78%,800px);justify-self:center;border:1px dashed rgba(232,173,114,.24);border-radius:22px;background:radial-gradient(circle at 50% 0%,rgba(232,173,114,.08),transparent 55%),#0e1111;display:grid;place-items:center;text-align:center;padding:36px;color:#8f9793;cursor:default}
.empty-meals strong{display:block;color:#e9e4db;font:700 25px Georgia,serif;margin-bottom:8px}
.empty-meals p{max-width:390px;margin:0 0 20px;line-height:1.5}
.meal-checkin-missing{margin:0 14px 16px;padding:14px;border:1px dashed rgba(232,173,114,.3);border-radius:14px;background:rgba(232,173,114,.055);text-align:center;color:#a9afab;font-size:12px}
.meal-checkin-missing.waiting{border-color:rgba(88,184,231,.2);background:rgba(88,184,231,.045);color:#8f9c9e}
.feedback-countdown{display:block;margin-top:6px;color:#8fcbe7;font-weight:700}
.meal-checkin-missing button{display:block;margin:9px auto 0;border:1px solid rgba(232,173,114,.32);border-radius:11px;background:#1c1712;color:var(--accent-2);padding:9px 13px;cursor:pointer}
.feedback-grid{display:grid;gap:17px;margin-top:20px}
.feedback-group{display:grid;gap:9px}
.feedback-group legend{padding:0;color:#dcd8d0;font-weight:700;font-size:14px}
.feedback-options{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:7px}
.feedback-choice input{position:absolute;opacity:0;pointer-events:none}
.feedback-choice span{min-height:43px;border:1px solid var(--line);border-radius:12px;background:#0b0e0e;color:#929a96;display:grid;place-items:center;text-align:center;padding:7px;font-size:12px;cursor:pointer;transition:.2s ease}
.feedback-choice input:checked+span{color:#21160d;border-color:rgba(255,214,170,.25);background:linear-gradient(180deg,#efbd8d,#dfa36d);font-weight:700}
.feedback-choice input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.goals-head{display:flex;justify-content:space-between;gap:10px;align-items:center}
.edit{border:0;background:transparent;color:#929694;cursor:pointer;font-size:12px}
.goal{
  display:flex;gap:10px;align-items:center;margin-top:10px;color:#bdbebb;font-size:13px
}
.goal-toggle{display:flex;align-items:center;flex:0 0 auto;cursor:pointer}
.goal input{display:none}
.check{
  width:20px;height:20px;flex:0 0 20px;border-radius:6px;
  display:grid;place-items:center;background:#e7bf7b;color:#15100b;font-weight:900;
  transition:.2s;
}
.goal input:not(:checked)+.check{background:transparent;border:1px solid #4f5552;color:transparent}
.goal-info{min-width:0;flex:1;border:0;border-radius:9px;background:transparent;color:#bdbebb;text-align:left;padding:6px 7px;cursor:pointer;transition:.2s ease}
.goal-info:hover{background:rgba(255,255,255,.045);color:var(--accent-2)}
.goal-info-modal .modal-card{width:min(470px,100%)}
.goal-description{margin:18px 0 0;color:#c7cbc7;font-size:14px;line-height:1.65}
.goal-fact{margin-top:16px;padding:15px 16px;border:1px solid rgba(232,173,114,.2);border-radius:14px;background:rgba(232,173,114,.06);color:#aeb4b0;font-size:13px;line-height:1.55}
.goal-fact strong{display:block;margin-bottom:5px;color:var(--accent-2)}
.intake-setting{margin-top:12px}
.intake-setting-label{display:block;margin-bottom:-5px;color:#858d89;font-size:10px}
.products-card{margin-top:18px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,#131616,#0e1111);overflow:hidden}
.products-toggle{width:100%;min-height:64px;border:0;background:transparent;color:#e4e0d8;display:flex;align-items:center;gap:11px;padding:0 18px;cursor:pointer;text-align:left}
.products-toggle strong{font-size:16px}.products-toggle small{margin-left:auto;color:#858d89;font-size:11px}
.products-toggle-chevron{color:var(--accent-2);font-size:17px;transition:transform .25s ease}
.products-card.open .products-toggle-chevron{transform:rotate(180deg)}
.products-panel{display:none;padding:0 18px 18px;border-top:1px solid var(--line)}
.products-card.open .products-panel{display:block;animation:fade .2s ease}
.product-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:15px 0;padding:5px;border-radius:13px;background:#090b0b;border:1px solid var(--line)}
.product-tab{min-height:40px;border:0;border-radius:9px;background:transparent;color:#8e9692;cursor:pointer}
.product-tab.active{background:#1b1e1d;color:var(--accent-2);font-weight:700}
.classified-products{display:grid;gap:8px}
.classified-product{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 12px;border:1px solid rgba(255,255,255,.065);border-radius:12px;background:#0b0e0e}
.classified-product b{display:block;color:#ddd9d1;font-size:13px}.classified-product small{display:block;margin-top:3px;color:#7f8783;font-size:11px;line-height:1.4}
.classified-product-actions{display:flex;gap:5px}
.classified-product-actions button{width:32px;height:32px;border:1px solid var(--line);border-radius:9px;background:#141817;color:#9da5a1;cursor:pointer}
.classified-product-actions button:hover{color:var(--accent-2);border-color:rgba(232,173,114,.3)}
.classified-product-actions button.danger:hover{color:var(--danger);border-color:rgba(255,133,119,.3)}
.products-empty{padding:20px 10px;text-align:center;color:#747c78;font-size:12px}
.products-footer{display:flex;justify-content:flex-end;margin-top:12px}
.products-footer .btn{height:42px;border-radius:12px;font-size:12px}
.product-list-modal .modal-card{width:min(480px,100%)}
.custom-product-modal .modal-card{width:min(620px,100%)}
.fiber-toggle{border:1px solid rgba(232,173,114,.24);border-radius:10px;background:#17130f;color:var(--accent-2);padding:7px 9px;cursor:pointer;font-size:10px;white-space:nowrap}
.fiber-toggle[aria-pressed="false"]{color:#858d89;background:#111414;border-color:var(--line)}
.nutrition-document.hide-fiber .fiber-visible{display:none!important}
.fiber-extra{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.fiber-extra summary{cursor:pointer;color:#8f9692;font-size:11px;margin-bottom:12px}
.meal-product-builder{display:grid;gap:12px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:#0b0e0e}
.meal-product-filters{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(150px,.8fr);gap:8px}
.meal-product-filters input,.meal-product-filters select{min-width:0;width:100%;border:1px solid rgba(255,255,255,.1);border-radius:11px;background:#090b0b;color:#f4f2ec;padding:11px 12px;outline:none}
.meal-product-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:220px;overflow-y:auto}
.catalog-result{border:1px solid var(--line);border-radius:11px;background:#121615;color:#d8d9d4;padding:10px;text-align:left;cursor:pointer;min-width:0}
.catalog-result:hover,.catalog-result.active{border-color:rgba(232,173,114,.46);background:#191612}
.catalog-result b,.catalog-result small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.catalog-result small{margin-top:3px;color:#808884;font-size:10px}
.meal-product-selection{display:grid;grid-template-columns:minmax(0,1fr) 105px 125px auto;gap:8px;align-items:end;padding:11px;border-radius:12px;background:#111514}
.meal-product-selection[hidden]{display:none}
.meal-selected-name{align-self:center;color:var(--accent-2);font-weight:700;min-width:0}
.meal-draft-products{display:grid;gap:7px}
.meal-draft-row{display:grid;grid-template-columns:minmax(0,1fr) 95px 115px 36px;gap:7px;align-items:center;padding:9px;border:1px solid rgba(255,255,255,.065);border-radius:11px;background:#0d1010}
.meal-draft-row b{display:block;font-size:12px}.meal-draft-row small{display:block;color:#7f8783;font-size:10px;margin-top:3px}
.meal-draft-row input,.meal-draft-row select{min-width:0;width:100%;border:1px solid var(--line);border-radius:9px;background:#080a0a;color:#eee;padding:9px}
.meal-draft-remove{width:36px;height:36px;border:1px solid rgba(255,133,119,.25);border-radius:9px;background:#1a1010;color:#e99b92;cursor:pointer}
.meal-product-create{justify-self:start;border:0;background:transparent;color:var(--accent-2);padding:0;cursor:pointer;font-size:11px}
.meal-nutrition{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 13px;color:#929a96;font-size:10px}
.meal-nutrition span{padding:5px 7px;border-radius:8px;background:#0b0e0e;border:1px solid rgba(255,255,255,.05)}
.photo-status{color:#858d89;font-size:11px}
.handnote{
  margin:28px 4px 0;
  font-family:"Segoe Print",cursive;
  font-size:15px;color:var(--accent-2);
  transform:rotate(-2deg);text-align:center;line-height:1.5;
}

.modal{
  position:fixed;inset:0;z-index:50;
  display:none;align-items:center;justify-content:center;
  padding:18px;background:rgba(0,0,0,.72);
  backdrop-filter:blur(12px);
  overflow-y:auto;
}
.modal.open{display:flex;animation:fade .2s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal-card{
  width:min(620px,100%);
  max-height:calc(100vh - 36px);
  overflow-y:auto;
  border:1px solid rgba(255,255,255,.12);
  border-radius:24px;
  background:#111414;
  box-shadow:0 28px 90px rgba(0,0,0,.6);
  padding:24px;
  transform-origin:center;
  animation:pop .25s ease;
}
@keyframes pop{from{transform:scale(.96) translateY(10px);opacity:0}to{transform:none;opacity:1}}
.modal-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.modal-top h2{margin:0;font:700 30px Georgia,serif}
.modal-close{width:42px;height:42px;border-radius:50%;background:#191d1c;border:1px solid var(--line);cursor:pointer}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.field{display:grid;gap:7px}
.field.full{grid-column:1/-1}
.field label{color:#9fa5a2;font-size:13px}
.field input,.field select,.field textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.1);
  border-radius:13px;
  background:#090b0b;color:#f4f2ec;
  padding:13px 14px;outline:none;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:rgba(232,173,114,.65);box-shadow:0 0 0 3px rgba(232,173,114,.08)}
.field textarea{min-height:110px;resize:vertical}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}

.toast{
  position:fixed;right:22px;bottom:22px;z-index:70;
  padding:13px 16px;border-radius:14px;background:#171a1a;border:1px solid rgba(255,255,255,.1);
  color:#efeee8;box-shadow:0 14px 40px rgba(0,0,0,.45);
  opacity:0;transform:translateY(14px);pointer-events:none;transition:.25s;
}
.toast.show{opacity:1;transform:none}

@media (max-width:1400px){
  .date-track{grid-auto-columns:118px}
  .main-grid{grid-template-columns:minmax(0,1fr) 315px}
}
@media (max-width:1150px){
  .dashboard-tools{grid-template-columns:1fr}
}
@media (max-width:980px){
  .page{width:min(100% - 20px,860px)}
  .hero{height:320px}
  .main-grid{grid-template-columns:1fr}
  .title-row{align-items:flex-start;flex-direction:column}
  .actions{justify-content:flex-start}
  .sidebar{display:grid;grid-template-columns:1fr}
  .dashboard-tools{grid-template-columns:1fr}
  .side-card{padding:18px}
  .wellbeing{grid-template-columns:1fr;gap:28px}
}
@media (max-width:650px){
  .page{width:calc(100% - 14px);padding-bottom:18px}
  .hero{height:230px;border-radius:0 0 20px 20px}
  .date-section{margin-top:14px}
  .icon-btn{display:none}
  .date-track{overflow-x:auto;scroll-snap-type:x mandatory;grid-auto-columns:94px;gap:8px;padding:2px 2px 8px}
  .date-card{min-height:94px;scroll-snap-align:center}
  .date-card .day{font-size:26px}
  .date-card .month,.date-card .weekday{font-size:11px}
  .main-grid{margin-top:18px}
  h1{font-size:44px}
  .subtitle{font-size:15px}
  .actions{display:grid;grid-template-columns:1fr;width:100%}
  .actions .btn{width:100%;white-space:normal}
  .summary-strip{font-size:12px}
  .balance-card{grid-template-columns:42px 1fr}
  .metric-control.cols-4{grid-template-columns:repeat(2,1fr)}
  .analytics-grid{grid-template-columns:1fr}
  .btn{height:52px;padding:0 12px;font-size:13px}
  .meals{padding:18px 0 52px}
  .meal-card,.empty-meals{width:calc(100% - 38px)}
  .meal-card{border-radius:18px}
  .food-photo{height:230px}
  .wellbeing{padding:28px 22px;min-height:220px}
  .wellbeing .left{font-size:15px}
  .wellbeing .right{font-size:16px}
  .calorie{grid-template-columns:130px 1fr}
  .ring{width:126px}
  .form-grid{grid-template-columns:1fr}
  .field.full{grid-column:auto}
  .analytics-day-body{grid-template-columns:1fr}
  .analytics-meal-preview{grid-template-columns:72px minmax(0,1fr)}
  .analytics-meal-photo{width:72px;height:72px}
  .feedback-options{grid-template-columns:1fr 1fr}
  .meal-slider-head h2{font-size:22px}
  .meal-product-filters,.meal-product-results{grid-template-columns:1fr}
  .meal-product-selection{grid-template-columns:1fr 1fr}
  .meal-selected-name{grid-column:1/-1}
  .meal-draft-row{grid-template-columns:minmax(0,1fr) 72px 96px 36px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
}

/* Integration: inherit the application's available content area without leaking selectors. */
:host{display:block;min-width:0;color:var(--text)}
.nutrition-document{min-width:0;background:transparent!important}
.page{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
@media(max-width:680px){.page{padding-inline:0!important}.modal{padding:10px!important}.modal-panel{max-height:calc(100dvh - 20px)!important}}
