/* Meridian base tokens (same palette as Cascades) */
  :root {
    --gray-0:#FFFFFF; --gray-50:#F9FAFA; --gray-100:#F0F1F2; --gray-200:#E7E9E9;
    --gray-300:#BBC0C1; --gray-400:#949C9C; --gray-500:#697576; --gray-600:#485050;
    --gray-800:#0B0C0C; --squid:#232F3E;
    --blue-50:#E5F6FB; --blue-100:#B9E8F7; --blue-300:#47C2EC; --blue-400:#00A8E1;
    --blue-500:#077398; --blue-600:#055D7B;
    --forest-100:#D6ECC9; --forest-500:#348118;
    --gold-100:#FFF4D9; --gold-400:#FCC201; --tangerine-500:#D4780C;
    --red-100:#F9D5E2; --red-400:#CC0C39;
    --violet-100:#DDC8FF; --violet-500:#614FD9;
    --turquoise-100:#C3E9E7; --turquoise-500:#227D74;
    --slate-100:#DADEE2; --slate-500:#596571;
  }
  * { box-sizing:border-box; }
  body { margin:0; font-family:"Amazon Ember","Helvetica Neue",Arial,sans-serif;
         font-size:13px; color:var(--gray-800); background:var(--gray-50); height:100vh;
         display:flex; flex-direction:column; overflow:hidden; }
  .mast { display:flex; align-items:center; gap:14px; background:#fff;
          border-bottom:1px solid var(--gray-200); padding:10px 20px; }
  .mark { width:36px; height:36px; border-radius:8px; background:var(--squid); color:#fff;
          display:flex; align-items:center; justify-content:center; font-weight:800; }
  .title { font-weight:700; font-size:15px; }
  .subtitle { color:var(--gray-600); font-size:11px; }
  .lenses { display:flex; background:var(--gray-100); border-radius:6px; padding:3px; margin-left:18px; }
  .lens { border:none; background:none; font:inherit; font-weight:700; padding:6px 16px;
          border-radius:5px; cursor:pointer; color:var(--gray-600); }
  .lens.active { background:#fff; color:var(--blue-500); box-shadow:0 1px 2px rgba(0,0,0,.12); }
  .slice { margin-left:auto; display:flex; gap:8px; align-items:center; }
  select,input[type=search] { font:inherit; border:1px solid var(--gray-300); border-radius:5px;
          padding:6px 10px; background:#fff; }
  .chip { font-size:10px; font-weight:700; letter-spacing:.05em; border-radius:999px;
          padding:3px 10px; background:var(--blue-50); color:var(--blue-600); }
  .layout { flex:1; display:grid; grid-template-columns:1fr 360px; min-height:0; }
  .canvas-wrap { position:relative; overflow:hidden; }
  svg.canvas { width:100%; height:100%; background:
      radial-gradient(circle at 30% 20%, #fff 0%, var(--gray-50) 70%); }
  .legend { position:absolute; left:16px; bottom:14px; background:#fff; border:1px solid var(--gray-200);
            border-radius:8px; padding:10px 14px; font-size:11px; box-shadow:0 2px 8px rgba(11,12,12,.08); }
  .legend div { display:flex; align-items:center; gap:8px; margin:3px 0; }
  .sw { width:22px; height:0; border-top:3px solid var(--gray-400); }
  .rail { border-left:1px solid var(--gray-200); background:#fff; overflow-y:auto; padding:14px; }
  .panel { border:1px solid var(--gray-200); border-radius:8px; padding:12px 14px; margin-bottom:12px;
           background:#fff; box-shadow:0 1px 2px rgba(11,12,12,.05); }
  h2 { font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--gray-600);
       margin:0 0 8px; }
  .assert-title { font-weight:700; font-size:14px; margin-bottom:4px; }
  .status { font-size:10px; font-weight:800; letter-spacing:.05em; border-radius:4px; padding:2px 8px; }
  .s-verified { background:var(--forest-100); color:var(--forest-500); }
  .s-disputed { background:var(--red-100); color:var(--red-400); }
  .s-proposed { background:var(--gold-100); color:var(--tangerine-500); }
  .prov { font-size:11px; color:var(--gray-600); border-left:3px solid var(--gray-200);
          padding-left:10px; margin:8px 0; }
  .prov b { color:var(--gray-800); }
  .btn { font:inherit; font-weight:700; border-radius:5px; padding:7px 14px; cursor:pointer;
         border:1px solid var(--blue-500); color:var(--blue-500); background:#fff; }
  .btn.primary { background:var(--blue-500); color:#fff; }
  .btn.small { font-size:11px; padding:4px 10px; }
  .comment { background:var(--gray-50); border-radius:6px; padding:8px 10px; font-size:12px; margin:6px 0; }
  .comment b { font-size:11px; }
  .composer { display:flex; gap:10px; align-items:center; background:#fff;
              border-top:1px solid var(--gray-200); padding:10px 20px; }
  .micb { width:38px; height:38px; border-radius:50%; background:var(--blue-500); border:none;
          color:#fff; font-size:16px; cursor:pointer; }
  .drop { flex:1; border:2px dashed var(--gray-300); border-radius:8px; padding:8px 14px;
          color:var(--gray-600); font-size:12px; text-align:center; }
  .drop b { color:var(--blue-600); }
  /* graph elements */
  .node rect { fill:#fff; stroke:var(--gray-300); stroke-width:1.2; rx:8; }
  .node.ctx rect { stroke:var(--blue-500); stroke-width:1.6; }
  .node text { font-size:12px; font-weight:700; fill:var(--gray-800); }
  .node .sub { font-size:9.5px; font-weight:400; fill:var(--gray-500); }
  .node { cursor:pointer; }
  .node.selected rect { stroke:var(--blue-400); stroke-width:3; }
  .edge { stroke:var(--gray-400); fill:none; marker-end:url(#arr); }
  .edge.heavy { stroke:var(--gray-600); stroke-width:4; }
  .edge.mid { stroke-width:2.5; }
  .edge.proposed { stroke-dasharray:6 5; stroke:var(--tangerine-500); }
  .edge.disputed { stroke:var(--red-400); stroke-width:2.5; }
  .loopl { font-size:9.5px; fill:var(--violet-500); font-weight:700; }
  .rbadge { cursor:pointer; }
  .rbadge circle { fill:var(--gold-100); stroke:var(--gold-400); stroke-width:1.5; }
  .rbadge text { font-size:9px; font-weight:800; fill:var(--tangerine-500); }
  .npin circle { fill:var(--red-100); stroke:var(--red-400); }
  .npin text { font-size:9px; font-weight:800; fill:var(--red-400); }
  .mock-note { position:absolute; top:12px; right:14px; background:var(--gold-100);
               border:1px solid var(--gold-400); color:var(--tangerine-500); font-weight:700;
               font-size:11px; padding:4px 12px; border-radius:999px; }
  .stage rect { fill:var(--blue-50); stroke:var(--blue-300); }
  .html-lens { position:absolute; inset:0; overflow-y:auto; padding:22px 26px; display:none; }
  .lens-head { font-size:15px; font-weight:800; margin-bottom:2px; }
  .lens-sub { color:var(--gray-600); font-size:12px; margin-bottom:14px; }
  table.terms { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--gray-200);
                border-radius:8px; overflow:hidden; font-size:12px; }
  .terms th { text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:.05em;
              color:var(--gray-600); background:var(--gray-50); padding:8px 12px;
              border-bottom:1px solid var(--gray-200); }
  .terms td { padding:9px 12px; border-bottom:1px solid var(--gray-100); vertical-align:top; }
  .terms tr:hover td { background:var(--blue-50); cursor:pointer; }
  .load { font-size:11px; color:var(--blue-600); }
  .health { display:flex; gap:14px; margin:12px 0 18px; }
  .health .panel { flex:1; margin:0; text-align:center; }
  .health .big { font-size:22px; font-weight:800; }
  .lev { background:#fff; border:1px solid var(--gray-200); border-radius:8px; padding:14px 16px;
         margin-bottom:10px; display:grid; grid-template-columns:44px 1fr auto; gap:4px 14px; }
  .lev .rank { font-size:24px; font-weight:800; color:var(--blue-500); }
  .lev .what { font-weight:700; font-size:13px; }
  .lev .why { font-size:12px; color:var(--gray-600); }
  .lev .trace { font-size:11px; color:var(--blue-600); margin-top:3px; }
  .levbar { grid-column:1 / -1; height:7px; border-radius:4px; background:var(--gray-100); }
  .levbar div { height:100%; border-radius:4px; background:linear-gradient(90deg,var(--blue-400),var(--tangerine-500)); }
  .decide { align-self:center; }
  .kv { display:grid; grid-template-columns:auto 1fr; gap:2px 10px; font-size:11px; margin:6px 0; }
  .kv span:nth-child(odd) { color:var(--gray-600); }
  .ok { color:var(--forest-500); font-weight:700; } .bad { color:var(--red-400); font-weight:700; }
  .warn2 { color:var(--tangerine-500); font-weight:700; }


/* ---- Phase C additions (not in mockup v01) ---- */
.toast { position: fixed; bottom: 64px; left: 50%; transform: translateX(-50%);
  background: #1a2733; color: #fff; padding: 10px 16px; border-radius: 8px;
  font-size: 13px; z-index: 50; box-shadow: 0 4px 16px rgba(0,0,0,.25);
  transition: opacity .3s; }
.toast.err { background: #a12; }
.toast.hidden { opacity: 0; pointer-events: none; }
#card textarea, #card select { font: inherit; font-size: 12px;
  border: 1px solid var(--gray-300, #ccd3da); border-radius: 6px; padding: 6px; }
tr[data-pick]:hover td, .lev[data-pick]:hover { background: rgba(0,110,190,.05); }