body.health-shell { background: #f4f7f4; }
.health-shell .app-layout { background: #f4f7f4; }
.health-shell .sidebar { background: #173d36; border-color: #173d36; }
.health-shell .side-nav a { color: rgba(255,255,255,.82); }
.health-shell .side-nav a:hover, .health-shell .side-nav a.active { background: rgba(255,255,255,.12); color: #fff; }
.health-shell .app-header { background: rgba(250,252,250,.96); }
.health-shell .workspace { max-width: 1320px; }
.health-product-switcher { display: inline-flex; align-items: center; gap: .45rem; min-height: 40px; padding: .45rem .65rem; border: 1px solid #cfdad3; border-radius: 999px; background: #fff; color: #173d36; text-decoration: none; font-weight: 800; }
.health-product-switcher:hover { background: #eef5f1; color: #173d36; }
.health-product-pill { display: inline-flex; align-items: center; gap: .35rem; padding: .2rem .45rem; border-radius: 999px; background: #e3f0e8; color: #245744; font-size: .78rem; font-weight: 900; letter-spacing: .03em; text-transform: uppercase; }
.health-hero { display: flex; justify-content: space-between; gap: 2rem; align-items: center; padding: 1.6rem; margin-bottom: 1.25rem; border: 1px solid #d7e1da; border-radius: 18px; background: linear-gradient(135deg,#f9fcfa,#eef5f1); }
.health-hero.compact { align-items: flex-start; }
.health-hero h2 { max-width: 760px; margin-bottom: .45rem; font-size: clamp(1.55rem,2vw,2.35rem); }
.health-subcopy { max-width: 760px; margin: 0; color: #5f6e65; }
.health-hero-score { min-width: 142px; padding: 1rem; border-radius: 16px; background: #173d36; color: white; text-align: center; }
.health-hero-score span { display: block; font: 700 2.25rem/1 var(--font-display); }
.health-hero-score small { display: block; margin-top: .45rem; line-height: 1.3; color: rgba(255,255,255,.78); }
.health-hero-actions { display:flex; gap:.65rem; flex-wrap:wrap; }
.health-metric-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.health-metric-card, .health-panel, .meal-card, .nutrition-summary { border: 1px solid #d7e1da; border-radius: 16px; background: #fff; }
.health-metric-card { padding: 1rem; }
.health-metric-head { display: grid; gap: .35rem; }
.health-metric-head span { color: #657269; font-weight: 800; font-size: .85rem; }
.health-metric-head strong { font: 700 1.7rem/1.15 var(--font-display); color: #15352f; }
.health-progress { height: 8px; margin: .9rem 0 .55rem; border-radius: 999px; overflow: hidden; background: #e8eeea; }
.health-progress span { display:block; height:100%; border-radius:inherit; background:#3f7d63; }
.health-metric-card small { color:#728078; }
.health-section { margin: 1.5rem 0; }
.health-section-head { display:flex; justify-content:space-between; gap:1rem; align-items:end; margin-bottom:.85rem; }
.health-section-head h2, .health-section-head h3 { margin-bottom:0; }
.health-section-head .eyebrow { margin-bottom:.25rem; }
.health-quick-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.75rem; }
.health-quick-action { display:grid; gap:.65rem; min-height:100px; padding:1rem; border:1px solid #d7e1da; border-radius:14px; background:#fff; color:#173d36; text-decoration:none; }
.health-quick-action:hover { border-color:#86aa98; background:#f5faf7; color:#173d36; }
.health-quick-action span { font-size:1.35rem; }
.health-two-column { display:grid; grid-template-columns:1.3fr .7fr; gap:1rem; }
.health-panel { padding:1.15rem; }
.health-timeline { display:grid; }
.health-timeline-row { display:grid; grid-template-columns:110px 1fr; gap:1rem; padding:.85rem 0; border-top:1px solid #e6ece8; }
.health-timeline-row:first-child { border-top:0; }
.health-timeline-row time { color:#718077; font-size:.86rem; }
.health-timeline-row div { display:grid; gap:.2rem; }
.health-timeline-row span { color:#66736b; }
.health-habit-list { display:grid; gap:.65rem; }
.health-habit-row { display:flex; align-items:center; gap:.75rem; padding:.7rem 0; border-top:1px solid #e6ece8; }
.health-habit-row:first-child { border-top:0; }
.health-check { width:28px; height:28px; display:grid; place-items:center; border:2px solid #b7c5bd; border-radius:9px; color:white; }
.health-check.done { background:#3f7d63; border-color:#3f7d63; }
.nutrition-summary { display:flex; gap:2rem; align-items:center; padding:1.15rem; margin-bottom:1rem; }
.nutrition-calorie-ring { width:128px; height:128px; flex:0 0 128px; display:grid; place-content:center; text-align:center; border:12px solid #dce9e1; border-top-color:#3f7d63; border-radius:50%; }
.nutrition-calorie-ring strong { font:700 1.65rem/1 var(--font-display); color:#173d36; }
.nutrition-calorie-ring span { margin-top:.3rem; color:#68766d; font-size:.78rem; }
.nutrition-macros { flex:1; display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; }
.nutrition-macros div { padding:.9rem; border-radius:12px; background:#f5f8f6; }
.nutrition-macros span { display:block; color:#6d7b72; font-size:.82rem; }
.nutrition-macros strong { display:block; margin-top:.25rem; color:#173d36; }
.meal-stack { display:grid; gap:1rem; }
.meal-card { overflow:hidden; }
.meal-card > header { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem 1.1rem; background:#f7faf8; border-bottom:1px solid #e1e8e3; }
.meal-card > header h3 { margin:0; }
.meal-card > header span { color:#6c7971; font-size:.82rem; }
.health-text-button { display:inline-flex; border:0; padding:.35rem; background:transparent; color:#2f6c4f; font-weight:800; cursor:pointer; text-decoration:none; }
.food-row { display:flex; justify-content:space-between; gap:1rem; padding:.95rem 1.1rem; border-top:1px solid #edf1ee; }
.food-row:first-of-type { border-top:0; }
.food-row > div { display:grid; gap:.18rem; }
.food-row span { color:#6f7c74; font-size:.84rem; }
.health-tag-row { display:flex !important; flex-direction:row; flex-wrap:wrap; gap:.3rem !important; margin-top:.25rem; }
.health-tag-row span, .health-insight-badge { display:inline-flex; width:max-content; padding:.2rem .5rem; border-radius:999px; background:#edf5f0; color:#2f6c4f; font-size:.72rem; font-weight:800; }
.health-empty-inline { padding:1rem 1.1rem; color:#6f7c74; }
.health-empty-inline p { margin-bottom:.25rem; }
.health-modal { position:fixed; inset:0; z-index:50; display:none; }
.health-modal.open { display:block; }
.health-modal-backdrop { position:absolute; inset:0; background:rgba(15,30,25,.46); }
.health-modal-panel { position:absolute; right:0; top:0; bottom:0; width:min(460px,100%); overflow:auto; padding:1.25rem; background:#fff; box-shadow:-12px 0 32px rgba(20,45,36,.15); }
.health-modal-panel.wide { width:min(720px,100%); }
.health-modal-panel > header { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; margin-bottom:1rem; }
.health-modal-panel > header button { width:42px; height:42px; border:1px solid #d7e1da; border-radius:50%; background:#fff; font-size:1.35rem; cursor:pointer; }
.health-search { margin-bottom:1.25rem; }
.recent-food-list { display:grid; gap:.45rem; }
.recent-food-list button { display:flex; justify-content:space-between; gap:1rem; min-height:46px; padding:.7rem .8rem; border:1px solid #e0e7e2; border-radius:10px; background:#fff; cursor:pointer; text-align:left; }
.health-modal-note { margin-top:1rem; color:#6d7972; font-size:.82rem; }
.health-subnav { display:flex; gap:.3rem; overflow:auto; margin:0 0 1rem; padding:.25rem; border:1px solid #d7e1da; border-radius:12px; background:#fff; }
.health-subnav a { padding:.65rem .8rem; border-radius:9px; text-decoration:none; font-weight:800; white-space:nowrap; }
.health-subnav a.active { background:#e8f1ec; color:#173d36; }
.gi-overview-grid { display:grid; grid-template-columns:.8fr .8fr 1.4fr; gap:1rem; margin-bottom:1rem; }
.gi-last { display:grid; align-content:start; }
.gi-last > strong { font:700 1.45rem var(--font-display); color:#173d36; }
.gi-last > span { color:#66756c; }
.gi-last > small { margin-top:.35rem; color:#7a867f; }
.bristol-preview { width:100%; height:64px; margin-top:1rem; display:grid; place-items:center; border-radius:12px; background:#f4f7f5; }
.bristol-preview span { display:block; width:72%; height:20px; border-radius:999px; background:#8f6f53; }
.gi-symptom-list { display:grid; gap:.55rem; }
.gi-symptom-list div { display:grid; grid-template-columns:1fr auto; gap:.1rem .75rem; padding:.65rem 0; border-top:1px solid #e7ece9; }
.gi-symptom-list div:first-child { border-top:0; }
.gi-symptom-list small { grid-column:1 / -1; color:#7b877f; }
.gi-pattern { background:#f8fbf9; }
.gi-pattern h3 { margin-top:.7rem; }
.gi-pattern small { display:block; color:#69766e; line-height:1.5; margin-bottom:.55rem; }
.gi-safety-note { margin-top:1rem; padding:1rem 1.1rem; border-left:4px solid #c99736; border-radius:10px; background:#fff8e8; }
.gi-safety-note p { margin:.25rem 0 0; color:#615b4f; }
.health-empty-state { max-width:640px; margin:3rem auto; padding:2rem; text-align:center; }
.health-empty-icon { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 1rem; border-radius:18px; background:#e7f0eb; color:#2f6c4f; font-size:1.4rem; }
.auth-product-choice { display:grid; gap:.65rem; margin-top:.35rem; }
.auth-product-choice legend { font-size:.9rem; }
.auth-product-options { display:grid; grid-template-columns:1fr 1fr; gap:.65rem; }
.auth-product-option { display:flex; align-items:flex-start; gap:.65rem; padding:.8rem; border:1px solid var(--color-border); border-radius:10px; background:#fffdf8; cursor:pointer; }
.auth-product-option input { width:auto; min-height:0; margin-top:.2rem; }
.auth-product-option strong, .auth-product-option span { display:block; }
.auth-product-option span { margin-top:.15rem; color:#6a756e; font-size:.78rem; font-weight:500; }
.health-form-stack { display:grid; gap:1rem; }
.health-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
.health-field-hint { color:#6e7b73; font-size:.8rem; line-height:1.45; }
.health-preview-label { padding:.1rem .35rem; border-radius:999px; background:rgba(255,255,255,.15); font-size:.7rem; text-transform:uppercase; letter-spacing:.04em; }
.health-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; }
.health-choice-grid.two { grid-template-columns:1fr 1fr; }
.health-choice { display:flex; align-items:center; gap:.55rem; min-height:44px; padding:.65rem .75rem; border:1px solid #dce5df; border-radius:10px; background:#fbfdfc; cursor:pointer; }
.health-choice input { width:auto; min-height:0; }
.health-choice span { font-weight:700; }
.health-chip-field { margin:0; }
.bristol-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:.65rem; }
.bristol-grid.compact { grid-template-columns:repeat(4,minmax(0,1fr)); }
.bristol-card { display:grid; justify-items:center; gap:.45rem; min-width:0; padding:.8rem .55rem; border:1px solid #d9e2dc; border-radius:12px; background:#fbfdfc; color:#173d36; text-align:center; cursor:pointer; }
.bristol-card:hover, .bristol-card.selected, .bristol-card:has(input:checked) { border-color:#4f836c; background:#edf6f1; box-shadow:0 0 0 2px rgba(79,131,108,.12); }
.bristol-card strong { font-size:.9rem; }
.bristol-card small { min-height:2.5em; color:#69766e; font-size:.7rem; line-height:1.25; }
.bristol-shape { width:70px; height:42px; display:flex; align-items:center; justify-content:center; gap:4px; }
.bristol-shape i { display:none; background:#8f6f53; }
.bristol-shape.type-1 i { display:block; width:11px; height:11px; border-radius:50%; }
.bristol-shape.type-2 i:first-child { display:block; width:58px; height:20px; border-radius:12px; box-shadow:inset 10px 4px 0 rgba(255,255,255,.12), inset -10px -3px 0 rgba(80,50,30,.08); }
.bristol-shape.type-3 i:first-child { display:block; width:62px; height:19px; border-radius:12px; background:repeating-linear-gradient(90deg,#8f6f53 0 13px,#755741 13px 15px); }
.bristol-shape.type-4 i:first-child { display:block; width:64px; height:16px; border-radius:999px; }
.bristol-shape.type-5 i { display:block; width:17px; height:14px; border-radius:55% 45% 52% 48%; }
.bristol-shape.type-6 i { display:block; width:18px; height:14px; border-radius:65% 35% 60% 40%; opacity:.9; }
.bristol-shape.type-7 { position:relative; }
.bristol-shape.type-7::before { content:""; width:56px; height:20px; border-radius:50%; background:rgba(143,111,83,.5); filter:blur(1px); }
.gi-day-header { display:flex; justify-content:space-between; gap:1rem; align-items:end; padding-bottom:1rem; border-bottom:1px solid #e5ebe7; }
.gi-day-header h2 { margin-bottom:0; }
.gi-event-line { position:relative; display:grid; padding:1rem 0 .25rem; }
.gi-event-line::before { content:""; position:absolute; left:129px; top:1.25rem; bottom:1.25rem; width:2px; background:#dce6e0; }
.gi-event { position:relative; display:grid; grid-template-columns:100px 28px 1fr; gap:.8rem; align-items:start; padding:.6rem 0; }
.gi-event time { padding-top:.8rem; color:#6f7d74; font-size:.82rem; text-align:right; }
.gi-event-dot { position:relative; z-index:1; width:16px; height:16px; margin:1rem auto 0; border:4px solid #f8fbf9; border-radius:50%; background:#6f8d7d; box-shadow:0 0 0 2px #dce6e0; }
.gi-event.kind-symptom .gi-event-dot { background:#b37a4a; }
.gi-event.kind-bowel .gi-event-dot { background:#6a6f94; }
.gi-event-card { padding:.85rem 1rem; border:1px solid #e1e8e3; border-radius:12px; background:#fbfdfc; }
.gi-event-card h3 { margin:.2rem 0 .25rem; font-size:1.02rem; }
.gi-event-card p { margin:0; color:#647169; }
.gi-event-meta { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem; align-items:center; }
.gi-event-meta > span:first-child { color:#6e7b73; font-size:.75rem; font-weight:900; text-transform:uppercase; letter-spacing:.06em; }
.weight-summary-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.weight-chart { position:relative; height:270px; overflow:hidden; border-radius:12px; background:linear-gradient(#fbfdfc,#f4f8f5); color:#3f7d63; }
.weight-chart-grid { position:absolute; inset:0; background:repeating-linear-gradient(to bottom,transparent 0 53px,#e5ece7 54px 55px); }
.weight-chart svg { position:absolute; inset:20px 18px 34px; width:calc(100% - 36px); height:calc(100% - 54px); }
.weight-chart-labels { position:absolute; left:1rem; right:1rem; bottom:.7rem; display:flex; justify-content:space-between; color:#67746c; font-size:.78rem; }
.body-measure-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; }
.body-measure-grid > div { display:grid; gap:.3rem; padding:1rem; border:1px solid #e0e7e2; border-radius:12px; background:#f9fbfa; }
.body-measure-grid span { color:#6b7970; font-size:.78rem; font-weight:800; }
.body-measure-grid strong { color:#173d36; font:700 1.2rem var(--font-display); }
.body-measure-grid small { color:#76827b; }
.health-input-unit { display:grid; grid-template-columns:1fr auto; align-items:center; border:1px solid var(--color-border); border-radius:var(--radius-sm); background:#fffdf8; }
.health-input-unit input { border:0; background:transparent; }
.health-input-unit span { padding:0 .8rem; color:#6d7871; font-weight:800; }
.habit-card-list { display:grid; gap:.55rem; }
.habit-card { display:grid; grid-template-columns:42px 1fr auto; gap:.8rem; align-items:center; padding:.85rem; border:1px solid #e1e8e3; border-radius:12px; background:#fbfdfc; }
.habit-card.done { background:#f1f7f3; }
.habit-card > div { min-width:0; }
.habit-card strong, .habit-card span { display:block; }
.habit-card span { margin-top:.15rem; color:#6f7c74; font-size:.82rem; }
.habit-card small { color:#738078; text-align:right; }
.habit-card .health-progress { margin:.5rem 0 0; }
.habit-check-button { width:38px; height:38px; display:grid; place-items:center; border:2px solid #b8c7bf; border-radius:11px; background:#fff; color:#fff; cursor:pointer; }
.habit-card.done .habit-check-button { border-color:#3f7d63; background:#3f7d63; }
.habit-week { height:230px; display:grid; grid-template-columns:repeat(7,1fr); gap:.45rem; align-items:end; }
.habit-week > div { display:grid; gap:.35rem; justify-items:center; height:100%; grid-template-rows:auto 1fr auto; }
.habit-week span, .habit-week strong { font-size:.72rem; color:#6e7a73; }
.habit-week-bar { width:28px; height:100%; display:flex; align-items:flex-end; overflow:hidden; border-radius:999px; background:#e8efeb; }
.habit-week-bar i { display:block; width:100%; border-radius:999px; background:#4f836c; }
@media (max-width: 1100px) {
  .bristol-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .body-measure-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 980px) {
  .health-metric-grid { grid-template-columns:repeat(2,1fr); }
  .health-quick-grid { grid-template-columns:repeat(3,1fr); }
  .gi-overview-grid { grid-template-columns:1fr 1fr; }
  .gi-pattern { grid-column:1 / -1; }
}
@media (max-width: 720px) {
  .health-hero { align-items:stretch; flex-direction:column; gap:1rem; }
  .health-hero-score { width:100%; }
  .health-metric-grid, .health-two-column, .gi-overview-grid, .weight-summary-grid { grid-template-columns:1fr; }
  .gi-pattern { grid-column:auto; }
  .health-quick-grid { grid-template-columns:repeat(2,1fr); }
  .nutrition-summary { align-items:stretch; flex-direction:column; }
  .nutrition-calorie-ring { margin:0 auto; }
  .nutrition-macros { grid-template-columns:repeat(3,1fr); width:100%; }
  .health-timeline-row { grid-template-columns:82px 1fr; }
  .health-form-grid, .health-choice-grid, .health-choice-grid.two { grid-template-columns:1fr; }
  .bristol-grid, .bristol-grid.compact { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gi-event-line::before { left:83px; }
  .gi-event { grid-template-columns:58px 20px 1fr; gap:.55rem; }
  .gi-event time { font-size:.72rem; }
  .body-measure-grid { grid-template-columns:1fr 1fr; }
  .habit-card { grid-template-columns:42px 1fr; }
  .habit-card small { grid-column:2; text-align:left; }
}
@media (max-width: 480px) {
  .health-metric-grid, .health-quick-grid, .nutrition-macros, .auth-product-options, .body-measure-grid { grid-template-columns:1fr; }
  .bristol-grid, .bristol-grid.compact { grid-template-columns:1fr 1fr; }
  .gi-day-header { align-items:flex-start; flex-direction:column; }
}