/* ============================================================================
   METATRIX · SOVEREIGN AI CONSOLE  —  homepage hero console
   All inference is local (Max on Ollama). Nothing leaves the device.
   Self-contained; uses the page's CSS vars where present, with fallbacks.
   ========================================================================== */
:root{
  --mtx-ink:#f6f7fb; --mtx-dim:#9aa3b2; --mtx-faint:#5d6675;
  --mtx-line:rgba(255,255,255,.10); --mtx-line2:rgba(255,255,255,.18);
  --mtx-glass:rgba(10,11,16,.62); --mtx-card:rgba(255,255,255,.03);
  --mtx-phos:#3eff8a; --mtx-phos-glow:0 0 8px rgba(62,255,138,.55);
  --mtx-amber:#ffb84d; --mtx-blood:#ff4d4d; --mtx-ice:#3fb6ff; --mtx-violet:#a78bfa;
}
/* hide the original disabled hero chat card once our console mounts */
.mtx-hide-original{display:none!important}

#mtx-console{margin-top:6px;font-family:var(--font-body,system-ui,'Segoe UI',sans-serif);color:var(--mtx-ink);
  text-align:left;animation:mtxIn .6s cubic-bezier(.16,1,.3,1) both}
@keyframes mtxIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
#mtx-console *{box-sizing:border-box}
.mtx-shell{width:100%;max-width:860px;margin:0 auto;border:1px solid var(--mtx-line);
  border-radius:18px;background:var(--mtx-glass);backdrop-filter:blur(14px);
  box-shadow:0 30px 90px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.04);overflow:hidden}

/* ---- status strip -------------------------------------------------------- */
.mtx-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:9px 14px;border-bottom:1px solid var(--mtx-line);
  font:600 9.5px/1 ui-monospace,monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--mtx-dim)}
.mtx-dot{width:7px;height:7px;border-radius:50%;background:var(--mtx-faint);flex:none;transition:.3s}
.mtx-dot.on{background:var(--mtx-phos);box-shadow:var(--mtx-phos-glow);animation:mtxPulse 2.4s ease-in-out infinite}
.mtx-dot.mock{background:var(--mtx-amber);box-shadow:0 0 8px rgba(255,184,77,.6)}
@keyframes mtxPulse{0%,100%{opacity:1}50%{opacity:.45}}
.mtx-status b{color:var(--mtx-ink);font-weight:700}
.mtx-status .mtx-sep{color:var(--mtx-faint)}
.mtx-chips{display:flex;gap:5px;margin-left:auto;flex-wrap:wrap}
.mtx-chip{padding:2px 7px;border:1px solid var(--mtx-line);border-radius:999px;color:var(--mtx-faint);font-size:8.5px}
.mtx-chip.law{color:var(--mtx-phos);border-color:rgba(62,255,138,.3);text-shadow:var(--mtx-phos-glow)}

/* ---- lens router --------------------------------------------------------- */
.mtx-lenses{display:flex;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none;
  padding:9px 12px;border-bottom:1px solid var(--mtx-line)}
.mtx-lenses::-webkit-scrollbar{display:none}
.mtx-lens-label{flex:none;font:600 9px/1 ui-monospace,monospace;letter-spacing:.2em;text-transform:uppercase;color:var(--mtx-faint);margin-right:2px}
.mtx-lens{flex:none;display:inline-flex;align-items:center;gap:6px;padding:5px 10px;cursor:pointer;
  border:1px solid var(--mtx-line);border-radius:999px;background:transparent;color:var(--mtx-dim);
  font:600 11px/1 system-ui,sans-serif;transition:.18s;white-space:nowrap}
.mtx-lens:hover{border-color:var(--mtx-line2);color:var(--mtx-ink)}
.mtx-lens[aria-checked="true"]{color:var(--mtx-ink);border-color:var(--lens-accent,var(--mtx-phos));
  background:color-mix(in srgb,var(--lens-accent,var(--mtx-phos)) 12%,transparent);
  box-shadow:0 0 0 1px var(--lens-accent,var(--mtx-phos)) inset, 0 0 14px -4px var(--lens-accent,var(--mtx-phos))}
.mtx-lens .ld{width:7px;height:7px;border-radius:50%;background:var(--lens-accent,#888);flex:none;box-shadow:0 0 6px var(--lens-accent,#888)}
.mtx-lens .lx{opacity:.4;font-size:10px;text-decoration:none;color:inherit;padding:0 1px;transition:.18s}
.mtx-lens .lx:hover{opacity:1;color:var(--lens-accent,var(--mtx-ice))}

/* ---- toolbar (capabilities) --------------------------------------------- */
.mtx-toolbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 12px;border-bottom:1px solid var(--mtx-line)}
.mtx-tg{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;cursor:pointer;
  border:1px solid var(--mtx-line);border-radius:8px;background:transparent;color:var(--mtx-dim);
  font:600 10.5px/1 system-ui,sans-serif;transition:.15s;user-select:none}
.mtx-tg:hover{border-color:var(--mtx-line2);color:var(--mtx-ink)}
.mtx-tg[aria-pressed="true"]{color:#06140b;background:var(--mtx-phos);border-color:var(--mtx-phos);box-shadow:var(--mtx-phos-glow)}
.mtx-tg[aria-pressed="true"].amber{background:var(--mtx-amber);border-color:var(--mtx-amber);box-shadow:0 0 8px rgba(255,184,77,.6);color:#1a1206}
.mtx-tg[aria-pressed="true"].ice{background:var(--mtx-ice);border-color:var(--mtx-ice);box-shadow:0 0 8px rgba(63,182,255,.6);color:#04121e}
.mtx-tg .ic{font-size:13px;line-height:1}
.mtx-toolbar .mtx-spacer{margin-left:auto}

/* ---- messages ------------------------------------------------------------ */
.mtx-msgs{max-height:46vh;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:12px;
  font-size:14.5px;line-height:1.6;scroll-behavior:smooth}
.mtx-msgs:empty{display:none}
.mtx-msgs::-webkit-scrollbar{width:8px}.mtx-msgs::-webkit-scrollbar-thumb{background:var(--mtx-line2);border-radius:8px}
.mtx-m{max-width:92%;white-space:pre-wrap;word-wrap:break-word;position:relative}
.mtx-m.u{align-self:flex-end;background:color-mix(in srgb,var(--lens-accent,var(--mtx-ice)) 16%,transparent);
  border:1px solid var(--mtx-line);border-radius:14px 14px 4px 14px;padding:10px 13px;color:var(--mtx-ink)}
.mtx-m.a{align-self:flex-start;width:100%;max-width:100%}
.mtx-prov{display:inline-flex;align-items:center;gap:6px;font:600 9px/1 ui-monospace,monospace;
  letter-spacing:.16em;text-transform:uppercase;color:var(--mtx-faint);margin-bottom:6px}
.mtx-prov .ld{width:6px;height:6px;border-radius:50%;background:var(--lens-accent,var(--mtx-phos));box-shadow:0 0 6px var(--lens-accent,var(--mtx-phos))}
.mtx-body{color:var(--mtx-ink)}
.mtx-body p{margin:0 0 .55em}.mtx-body p:last-child{margin-bottom:0}
.mtx-body strong{color:#fff}
.mtx-body code{background:rgba(255,255,255,.08);padding:.1em .35em;border-radius:4px;font-size:.9em;font-family:ui-monospace,monospace}
.mtx-body ul,.mtx-body ol{margin:.3em 0 .6em;padding-left:1.3em}
.mtx-body li{margin:.15em 0}
.mtx-cursor::after{content:"▍";color:var(--mtx-phos);margin-left:1px;animation:mtxBlink 1s steps(1) infinite}
@keyframes mtxBlink{50%{opacity:0}}

/* thinking panel (DeepThink) */
.mtx-think{margin:0 0 8px;border:1px solid rgba(255,184,77,.28);border-radius:10px;background:rgba(255,184,77,.05);overflow:hidden}
.mtx-think>summary{cursor:pointer;list-style:none;padding:7px 12px;font:600 10px/1.2 ui-monospace,monospace;
  letter-spacing:.14em;text-transform:uppercase;color:var(--mtx-amber);display:flex;align-items:center;gap:8px}
.mtx-think>summary::-webkit-details-marker{display:none}
.mtx-think>summary .spin{width:9px;height:9px;border:2px solid rgba(255,184,77,.3);border-top-color:var(--mtx-amber);border-radius:50%;animation:mtxSpin .7s linear infinite}
.mtx-think[open]>summary .spin,.mtx-think.done>summary .spin{display:none}
@keyframes mtxSpin{to{transform:rotate(360deg)}}
.mtx-think .tk{padding:0 12px 10px;font-size:12.5px;line-height:1.55;color:var(--mtx-dim);white-space:pre-wrap}

/* code / canvas block */
.mtx-codewrap{position:relative;margin:.5em 0;border:1px solid var(--mtx-line);border-radius:10px;overflow:hidden;background:rgba(0,0,0,.45)}
.mtx-codebar{display:flex;align-items:center;gap:8px;padding:5px 10px;border-bottom:1px solid var(--mtx-line);
  font:600 9px/1 ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mtx-faint)}
.mtx-codebar .lang{color:var(--mtx-ice)}
.mtx-codebar button{margin-left:auto;background:transparent;border:1px solid var(--mtx-line);border-radius:6px;
  color:var(--mtx-dim);font:600 9px ui-monospace,monospace;padding:3px 8px;cursor:pointer;letter-spacing:.1em}
.mtx-codebar button:hover{color:var(--mtx-ink);border-color:var(--mtx-line2)}
.mtx-codewrap pre{margin:0;padding:11px 12px;overflow-x:auto;font:13px/1.5 ui-monospace,monospace;color:#e6edf3}
.mtx-iframe{width:100%;border:0;height:280px;background:#fff;display:block}

/* message action row + follow-up chips */
.mtx-actions{display:flex;gap:4px;margin-top:7px;opacity:0;transition:.18s}
.mtx-m.a:hover .mtx-actions,.mtx-m.a:focus-within .mtx-actions{opacity:1}
.mtx-actions button{background:transparent;border:1px solid var(--mtx-line);border-radius:7px;color:var(--mtx-faint);
  font:600 9px ui-monospace,monospace;letter-spacing:.08em;padding:3px 8px;cursor:pointer;transition:.15s}
.mtx-actions button:hover{color:var(--mtx-ink);border-color:var(--mtx-line2)}
.mtx-followups{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.mtx-fchip{border:1px solid var(--mtx-line);border-radius:999px;background:rgba(63,182,255,.05);color:var(--mtx-ice);
  font:500 11px/1.2 system-ui,sans-serif;padding:6px 11px;cursor:pointer;text-align:left;transition:.15s}
.mtx-fchip:hover{border-color:var(--mtx-ice);background:rgba(63,182,255,.13)}
.mtx-fchip::before{content:"→ ";opacity:.6}

/* ---- input -------------------------------------------------------------- */
.mtx-inputwrap{position:relative;padding:10px 12px;border-top:1px solid var(--mtx-line)}
.mtx-inputrow{display:flex;align-items:flex-end;gap:8px;border:1px solid var(--mtx-line2);border-radius:14px;
  background:rgba(255,255,255,.02);padding:8px 8px 8px 14px;transition:.18s}
.mtx-inputrow:focus-within{border-color:var(--lens-accent,var(--mtx-phos));box-shadow:0 0 0 3px color-mix(in srgb,var(--lens-accent,var(--mtx-phos)) 18%,transparent)}
#mtx-input{flex:1;background:transparent;border:0;resize:none;color:var(--mtx-ink);font:400 15px/1.5 var(--font-body,system-ui,sans-serif);
  outline:none;max-height:160px;min-height:24px;padding:2px 0}
#mtx-input::placeholder{color:var(--mtx-faint)}
.mtx-iconbtn{flex:none;width:38px;height:38px;border-radius:11px;border:1px solid var(--mtx-line);background:transparent;
  color:var(--mtx-dim);cursor:pointer;font-size:16px;display:inline-flex;align-items:center;justify-content:center;transition:.15s}
.mtx-iconbtn:hover{color:var(--mtx-ink);border-color:var(--mtx-line2)}
.mtx-iconbtn.rec{color:var(--mtx-blood);border-color:var(--mtx-blood);animation:mtxPulse 1.1s ease-in-out infinite}
#mtx-send{flex:none;height:38px;padding:0 16px;border-radius:11px;border:0;background:var(--mtx-phos);color:#06140b;
  font:700 11px/1 ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:.15s}
#mtx-send:hover{filter:brightness(1.08)}
#mtx-send:disabled{opacity:.4;cursor:not-allowed}
#mtx-stop{display:none;flex:none;height:38px;padding:0 14px;border-radius:11px;border:1px solid var(--mtx-blood);
  background:rgba(255,77,77,.1);color:var(--mtx-blood);font:700 11px/1 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.mtx-busy #mtx-send{display:none}.mtx-busy #mtx-stop{display:inline-flex}

/* slash palette + autocomplete */
.mtx-pop{position:absolute;left:12px;right:12px;bottom:calc(100% - 4px);z-index:30;
  border:1px solid var(--mtx-line2);border-radius:12px;background:rgba(8,9,13,.96);backdrop-filter:blur(12px);
  box-shadow:0 -18px 50px rgba(0,0,0,.5);overflow:hidden;display:none}
.mtx-pop.open{display:block}
.mtx-pop .it{display:flex;align-items:center;gap:10px;padding:9px 13px;cursor:pointer;border-bottom:1px solid var(--mtx-line)}
.mtx-pop .it:last-child{border-bottom:0}
.mtx-pop .it[aria-selected="true"],.mtx-pop .it:hover{background:rgba(62,255,138,.08)}
.mtx-pop .it .cmd{font:700 12px ui-monospace,monospace;color:var(--mtx-phos);min-width:96px}
.mtx-pop .it .ds{font-size:11.5px;color:var(--mtx-dim)}

/* quick prompts (empty state) + footer */
.mtx-quick{display:flex;flex-wrap:wrap;gap:7px;padding:0 12px 12px}
.mtx-qchip{border:1px dashed var(--mtx-line2);border-radius:10px;background:transparent;color:var(--mtx-dim);
  font:500 12px/1.3 system-ui,sans-serif;padding:8px 12px;cursor:pointer;text-align:left;transition:.15s}
.mtx-qchip:hover{color:var(--mtx-ink);border-color:var(--mtx-phos);border-style:solid;background:rgba(62,255,138,.05)}
.mtx-qchip .k{display:block;font:600 8.5px ui-monospace,monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--mtx-faint);margin-bottom:3px}
.mtx-foot{display:flex;align-items:center;justify-content:center;gap:11px;flex-wrap:nowrap;overflow-x:auto;
  padding:9px 14px;border-top:1px solid var(--mtx-line);font:400 10px/1.5 ui-monospace,monospace;color:var(--mtx-faint);
  scrollbar-width:none}
.mtx-foot::-webkit-scrollbar{display:none}
.mtx-foot .mtx-link{color:var(--mtx-dim);text-decoration:none;border-bottom:1px dotted var(--mtx-line2);cursor:pointer;white-space:nowrap}
.mtx-foot .mtx-link:hover{color:var(--mtx-ink)}
.mtx-foot>span:first-child{display:none}
.mtx-foot .grow{display:none}

/* tooltip */
.mtx-tip{position:relative}
.mtx-tip[data-tip]:hover::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);
  width:max-content;max-width:260px;padding:8px 11px;border-radius:9px;border:1px solid var(--mtx-line2);
  background:rgba(8,9,13,.97);color:var(--mtx-dim);font:400 11px/1.45 system-ui,sans-serif;text-transform:none;letter-spacing:normal;
  white-space:normal;text-align:left;z-index:50;box-shadow:0 12px 40px rgba(0,0,0,.5);pointer-events:none}

@media (max-width:640px){
  .mtx-shell{border-radius:14px}
  .mtx-msgs{max-height:52vh}
  .mtx-lens-label,.mtx-status .mtx-chips{display:none}
}
@media (prefers-reduced-motion:reduce){#mtx-console,.mtx-dot,.mtx-think>summary .spin{animation:none!important}}