/* ==== MY KITCHEN, matched to My Rhythm + Life Vault ======================= */
/* The old journey index and the island's own dashboard body are hidden — this
   is a re-skin of the same navigation, every destination taken from the journey
   so nothing is orphaned. The hero banner is KEPT: she chose it deliberately. */
#page-dashboard #kjWrap,
#page-dashboard #huKitchenReact .max-w-7xl > *:not(.hu-mk-hero){ display:none !important; }
#page-dashboard #huKitchenReact .hu-mk-hero{ display:block !important; }
/* Hiding the island's children still left ~480px of its own padding under the
   hero, so the new section started a screen and a half down the page. The island
   wrapper's padding has to be zeroed too — hiding children is not enough. */
#page-dashboard #huKitchenReact .max-w-7xl,
#page-dashboard #huKitchenReact .min-h-screen{
  padding-top:0 !important; padding-bottom:0 !important;
  margin-top:0 !important; margin-bottom:0 !important;
}
/* AND the island's wrapper carries Tailwind `min-h-screen` — it holds a FULL
   VIEWPORT of height whatever its contents, so with the body hidden it left a
   whole blank screen between the hero and the new section. Collapse it. */
#page-dashboard #huKitchenReact .min-h-screen{ min-height:0 !important; }

#mkxSec.mkx-root{
  max-width:1180px; margin:0 auto; padding:18px clamp(16px,4vw,28px) 30px;
  font-family:'Nunito',system-ui,sans-serif;
}
#mkxSec .mkx-eb{
  margin:0 0 4px; font-size:.72rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:#4E6640 !important; -webkit-text-fill-color:#4E6640 !important;
}
#mkxSec .mkx-h{
  margin:0 0 6px; font-size:clamp(1.4rem,3vw,1.9rem); font-weight:800; line-height:1.2;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#mkxSec .mkx-sub{
  margin:0 0 16px; font-size:.92rem; line-height:1.6; max-width:56ch;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important;
}
#mkxSec .mkx-acts{ display:flex; gap:10px; flex-wrap:wrap; }
#mkxSec .mkx-act{
  cursor:pointer; font:inherit; font-size:.86rem; font-weight:800;
  border-radius:999px; padding:12px 20px; min-height:46px;
  background:#fff !important; border:1px solid #E4DFD2 !important;
  color:#3F4753 !important; -webkit-text-fill-color:#3F4753 !important;
}
#mkxSec .mkx-act:hover{ background:#F4F6F1 !important; border-color:#CFE0C8 !important; }
#mkxSec .mkx-act.is-primary{
  background:#4E6640 !important; border-color:#4E6640 !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important;
}
#mkxSec .mkx-act:focus-visible, #mkxSec .mkx-link:focus-visible, #mkxSec .mkx-chip:focus-visible,
#mkxSec .mkx-tl:focus-visible, #mkxSec .mkx-tool:focus-visible, #mkxSec .mkx-ic:focus-visible,
#mkxSec .mkx-mine-b:focus-visible{ outline:3px solid #CF9E3F; outline-offset:2px; }
#mkxSec .mkx-mine{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  background:#F4F6F1 !important; border:1px solid #E2E8DD; border-radius:20px;
  padding:16px 20px; margin-top:22px;
}
#mkxSec .mkx-mine-ic{
  flex:none; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:#E2EBDD; font-size:1.05rem;
  color:#41533C !important; -webkit-text-fill-color:#41533C !important;
}
#mkxSec .mkx-mine-t{ flex:1; display:flex; flex-direction:column; gap:2px; min-width:200px; }
#mkxSec .mkx-mine-t strong{ font-size:.95rem; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
#mkxSec .mkx-mine-t span{ font-size:.84rem; line-height:1.5; color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
#mkxSec .mkx-mine-b{
  flex:none; cursor:pointer; font:inherit; font-size:.84rem; font-weight:800;
  background:#fff !important; border:1px solid #DDD7C9 !important; border-radius:999px;
  padding:11px 18px; min-height:44px;
  color:#3D4A3A !important; -webkit-text-fill-color:#3D4A3A !important;
}
#mkxSec .mkx-sec{ margin-top:26px; }
#mkxSec .mkx-sechrow{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:12px; }
#mkxSec .mkx-sech{
  margin:0 0 2px; font-family:'Playfair Display',Georgia,serif; font-size:1.16rem; font-weight:700;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#mkxSec .mkx-sech.is-small{
  font-family:'Nunito',sans-serif; font-size:.78rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
}
#mkxSec .mkx-secsub{ margin:0 0 10px; font-size:.82rem; color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
#mkxSec .mkx-link{
  cursor:pointer; font:inherit; font-size:.8rem; font-weight:800; min-height:40px;
  background:#fff !important; border:1px solid #E4DFD2 !important; border-radius:999px; padding:9px 15px;
  color:#3F4753 !important; -webkit-text-fill-color:#3F4753 !important;
}
#mkxSec .mkx-chips{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
#mkxSec .mkx-chip{
  display:flex; flex-direction:column; gap:3px; text-align:left; cursor:pointer; font:inherit;
  border:1px solid transparent; border-radius:14px; padding:13px 14px; min-height:80px;
}
#mkxSec .mkx-chip.is-sage { background:#EDF3E9 !important; border-color:#D7E3D2 !important; }
#mkxSec .mkx-chip.is-cream{ background:#FBF3E4 !important; border-color:#EFE3CB !important; }
#mkxSec .mkx-chip.is-lav  { background:#F1EEF9 !important; border-color:#E1DAF0 !important; }
#mkxSec .mkx-chip.is-sky  { background:#EAF1F7 !important; border-color:#D6E3EE !important; }
#mkxSec .mkx-chip.is-blush{ background:#FBECEF !important; border-color:#F0DCE1 !important; }
#mkxSec .mkx-ct{ font-size:.86rem; font-weight:800; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
#mkxSec .mkx-cm{ font-size:.76rem; color:#525A66 !important; -webkit-text-fill-color:#525A66 !important; }
#mkxSec .mkx-bar{ display:block; height:6px; border-radius:999px; background:rgba(36,52,71,.10); overflow:hidden; margin-top:auto; }
#mkxSec .mkx-fill{ display:block; height:100%; background-image:none !important; background-color:#5F7350 !important; border-radius:999px; }
#mkxSec .mkx-tiles{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
#mkxSec .mkx-tile{
  display:flex; flex-direction:column; gap:4px;
  border:1px solid transparent; border-radius:22px; padding:20px 20px 14px;
}
#mkxSec .mkx-tile.is-wide{ grid-column:1/-1; }
/* The seven group tiles were each tinted. Now white, with the tint kept only
   on the border so the groups are still visually separated (Sep 2026). */
#mkxSec .mkx-tile.is-sage { background:#FFFFFF !important; border-color:#D7E3D2 !important; }
#mkxSec .mkx-tile.is-cream{ background:#FFFFFF !important; border-color:#EFE3CB !important; }
#mkxSec .mkx-tile.is-lav  { background:#FFFFFF !important; border-color:#E1DAF0 !important; }
#mkxSec .mkx-tile.is-sky  { background:#FFFFFF !important; border-color:#D6E3EE !important; }
#mkxSec .mkx-tile.is-blush{ background:#FFFFFF !important; border-color:#F0D9DE !important; }
#mkxSec .mkx-tile.is-teal { background:#FFFFFF !important; border-color:#CFE3DF !important; }
#mkxSec .mkx-chip.is-teal { background:#E8F2F0 !important; border-color:#D2E5E1 !important; }

/* Panels sized to their own content. Grid items stretch to the tallest in the
   row by default, so the two-tile Drinks group was drawing a large empty area
   to match the four-tile Store beside it. */
#mkxSec .mkx-tiles{ align-items:start; }