/* ---------- Outcome Map ---------- */
.mapsec { padding-block:8px 96px; }
.mlay { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:24px; align-items:start; }
.mgrid { border:1px solid var(--line); border-radius:var(--r-md); background:var(--paper); box-shadow:var(--shadow-card); overflow:hidden; }
.mrow { display:grid; grid-template-columns:140px repeat(4, minmax(0,1fr)); border-top:1px solid var(--line); }
.mrow:first-child { border-top:0; }
.mhead { background:color-mix(in srgb, var(--paper) 60%, var(--line)); }
.mhead span { padding:14px 14px; font-size:13px; font-weight:600; color:var(--ink-subtle); line-height:18px; }
.mgoal { display:flex; gap:8px; align-items:flex-start; color:var(--ink) !important; }
.mgoal i { flex:none; width:8px; height:8px; margin-top:5px; border-radius:50%; background:var(--gi); }
.mgoal.rose, .ochip.rose { --gi:var(--rose-ink); --gt:var(--tint-rose); }
.mgoal.sky, .ochip.sky { --gi:var(--sky-ink); --gt:var(--tint-sky); }
.mgoal.aqua, .ochip.aqua { --gi:var(--aqua-ink); --gt:var(--tint-aqua); }
.mgoal.iris, .ochip.iris { --gi:var(--iris-ink); --gt:var(--tint-iris); }
.mfn { padding:16px 14px; font-size:14.5px; font-weight:600; line-height:20px; }
.mcell { padding:10px 8px; display:flex; flex-direction:column; gap:4px; border-left:1px solid var(--line); min-height:64px; }
.mnone { display:block; width:14px; height:1px; margin:20px 6px; background:var(--line-control); }
.ochip { position:relative; text-align:left; padding:7px 10px 7px 22px; border:1px solid transparent; border-radius:10px; background:transparent; font:inherit; font-size:14px; line-height:19px; font-weight:500; color:var(--ink); cursor:pointer; transition:background-color .2s, opacity .25s, border-color .2s, transform .2s var(--ease); }
.ochip::before { content:""; position:absolute; left:9px; top:14px; width:6px; height:6px; border-radius:50%; background:var(--line-control); transition:background-color .2s, transform .2s; }
.ochip.live { background:var(--gt); }
.ochip.live::before { background:var(--gi); }
.ochip:hover { border-color:var(--line-control); }
.ochip[aria-pressed="true"] { border-color:var(--ink); background:var(--paper); box-shadow:0 1px 0 var(--line), 0 6px 18px -10px rgba(16,18,40,.35); }
.ochip[aria-pressed="true"]::before { background:var(--gi); transform:scale(1.35); }
.ochip:focus-visible { outline:2px solid var(--signal); outline-offset:1px; }
.ochip-g { display:none; }
.mgrid.dim .ochip:not(.live):not([aria-pressed="true"]) { opacity:.42; }
.mpanel { position:sticky; top:96px; padding:26px; border-radius:var(--r-md); background:var(--paper); border:1px solid var(--line); box-shadow:var(--shadow-float); }
.mp-goal { display:inline-block; padding:4px 10px; border-radius:999px; background:var(--gt); color:var(--gi); font-size:12.5px; font-weight:600; }
.mp-fn { display:block; margin-top:10px; font-size:13px; color:var(--ink-subtle); }
.mpanel h2 { margin:16px 0 0; font-size:26px; line-height:31px; font-weight:500; letter-spacing:-.02em; text-wrap:balance; }
.mpanel dl { margin:20px 0 0; display:flex; flex-direction:column; gap:12px; }
.mpanel dt { font-size:12.5px; font-weight:600; color:var(--ink-subtle); }
.mpanel dd { margin:2px 0 0; font-size:15px; line-height:22px; color:var(--ink-muted); }
.mp-apps { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.mp-apps h3 { margin:0; font-size:12.5px; font-weight:600; color:var(--ink-subtle); }
.mp-apps ul { list-style:none; margin:10px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.mp-apps a { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 14px; border-radius:10px; background:var(--gt); color:var(--gi); font-size:15px; font-weight:600; text-decoration:none; }
.mp-apps a small { display:block; font-size:12.5px; font-weight:500; color:var(--ink-muted); }
.mp-apps a svg { flex:none; width:15px; height:15px; transition:transform .2s; }
.mp-apps a:hover svg { transform:translateX(3px); }
.mp-apps p { margin:8px 0 0; font-size:14.5px; line-height:21px; color:var(--ink-muted); }
.mp-apps .plain { margin-top:12px; background:transparent; padding:0; color:var(--ink); justify-content:flex-start; }
.mkey { display:flex; align-items:center; gap:10px; margin:20px 0 0; font-size:14px; color:var(--ink-subtle); }
.kdot { width:22px; height:14px; border-radius:5px; background:var(--tint-sky); box-shadow:inset 0 0 0 1px var(--line); }
@media (max-width: 1180px) { .mlay { grid-template-columns:1fr; } .mpanel { position:static; } }
@media (max-width: 760px) {
  .mgrid { border:0; box-shadow:none; background:transparent; overflow:visible; display:flex; flex-direction:column; gap:12px; }
  .mrow.mhead { display:none; }
  .mrow { display:block; border:1px solid var(--line); border-radius:var(--r-md); background:var(--paper); box-shadow:var(--shadow-card); padding:6px 8px 10px; }
  .mrow:first-child { border-top:1px solid var(--line); }
  .mfn { display:block; padding:12px 8px 6px; }
  .mcell { border:0; padding:0; min-height:0; gap:4px; }
  .mcell:has(.mnone) { display:none; }
  .ochip-g { display:block; font-size:12px; font-weight:600; color:var(--gi); }
  .ochip { padding-block:8px; }
  .ochip::before { top:12px; }
}
@media (prefers-reduced-motion: reduce) { .ochip, .ochip::before, .mp-apps a svg { transition:none; } }