/* === MN-0 Floating Terminal Widget — external CSS === */
:root { --mn0-edge:#2a2a2a; --mn0-shadow:rgba(0,0,0,.5); }

/* Launcher button */
#mn0-launcher{
  position:fixed; right:18px; bottom:18px; z-index:99999;
  width:56px; height:56px; border-radius:50%;
  background:color-mix(in oklab, var(--bg) 80%, #000);
  border:1px solid var(--mn0-edge);
  box-shadow:0 0 18px color-mix(in oklab, var(--accent) 15%, transparent) inset, 0 0 12px rgba(0,0,0,.6);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
#mn0-launcher:after{
  content:'›_'; font:700 22px/1.2 var(--font); color:var(--accent);
  animation:mn0-blink .9s steps(1,end) infinite;
}
@keyframes mn0-blink{50%{opacity:.25}}

/* Panel */
#mn0-panel{
  display:none;
  position:fixed;
  right:18px;
  bottom:84px;
  z-index:99998;
  width:min(420px, calc(100vw - 36px));
  height:380px;
  background:#000;
  color:var(--fg);
  border:1px solid var(--mn0-edge);
  border-radius:8px;
  box-shadow: 0 0 6px color-mix(in oklab, var(--accent) 70%, transparent);
  animation: mn0-glowPulse 2.5s ease-in-out infinite;
  will-change: box-shadow;
}

/* Glow pulse animation — narrow, not wide */
@keyframes mn0-glowPulse {
  0%, 100% {
    box-shadow: 0 0 6px color-mix(in oklab, var(--accent) 50%, transparent);
  }
  50% {
    box-shadow: 0 0 12px color-mix(in oklab, var(--accent) 90%, transparent);
  }
}


/* Title bar + dots */
#mn0-top{
  height:34px; background:linear-gradient(#0c0c0c,#070707);
  display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid #1c1c1c; padding:0 10px;
  font:12px var(--font); color:color-mix(in oklab, var(--fg) 70%, #98a39a);
}
#mn0-dots{ display:flex; gap:6px }
#mn0-dots i{
  width:8px; height:8px; border-radius:50%; display:inline-block;
  background: color-mix(in oklab, var(--accent) 20%, #1b2a1e);
  box-shadow: 0 0 10px color-mix(in oklab, var(--accent) 25%, transparent);
  opacity:.45; animation: mn0-dotBlink 1.2s ease-in-out infinite;
}
#mn0-dots i:nth-child(2){ background: color-mix(in oklab, var(--accent) 15%, #223428); animation-delay:.2s }
#mn0-dots i:nth-child(3){ background: color-mix(in oklab, var(--accent) 12%, #2a3d30); animation-delay:.4s }
@keyframes mn0-dotBlink{
  0%,100%{ opacity:.35; filter:brightness(.9); box-shadow:0 0 6px color-mix(in oklab, var(--accent) 18%, transparent) }
  50%    { opacity:1;   filter:brightness(1.2); box-shadow:0 0 16px color-mix(in oklab, var(--accent) 45%, transparent) }
}

/* Stream + input */
#mn0-stream{
  height:calc(100% - 34px - 46px); padding:12px; overflow:auto;
  font:14px/1.45 var(--font); letter-spacing:.2px;
  background:
    repeating-linear-gradient(transparent,transparent 31px, rgba(255,255,255,.03) 32px),
    radial-gradient(ellipse at center, color-mix(in oklab, var(--accent) 12%, transparent), transparent 60%);
}
.mn0-line{white-space:pre-wrap; margin:0 0 8px}
.mn0-prefix{color:var(--accent)}
.mn0-dim{color:color-mix(in oklab, var(--fg) 70%, #9aa39b)}
.mn0-soft{opacity:.8}
.mn0-warn{color:var(--warn)}
.mn0-caret{display:inline-block; width:.6ch; background:var(--accent); animation:mn0-caret .85s steps(1,end) infinite}
@keyframes mn0-caret{50%{opacity:.2}}

#mn0-inputbar{
  height:46px; border-top:1px solid #1c1c1c;
  display:flex; align-items:center; gap:8px; padding:6px 8px; background:#060606
}
#mn0-q{
  flex:1; height:32px; background:#0a0a0a; color:var(--fg);
  border:1px solid #222; border-radius:6px; outline:none;
  padding:0 10px; font:14px var(--font);
}
#mn0-send{
  height:32px; padding:0 12px; border-radius:6px; border:1px solid #2b2b2b;
  background:#121212; color:var(--accent); cursor:pointer;
}

/* Respect your anti-copy UX: keep inputs selectable */
#mn0-panel, #mn0-panel *{ -webkit-user-select:text; user-select:text; }

/* Make the widget fit phones */
@media (max-width: 640px) {
  #mn0-launcher{
    right:12px;
    bottom:calc(12px + env(safe-area-inset-bottom));
    width:52px; height:52px;
  }
  #mn0-panel{
    left:12px;            /* stretch across, keep small gutters */
    right:12px;
    width:auto;           /* ignore fixed desktop width */
    bottom:calc(76px + env(safe-area-inset-bottom)); /* sit above launcher */
    height:min(64vh, 460px);
    border-radius:10px;
  }

  /* Title bar / input sizing tuned for thumbs + iOS keyboard */
  #mn0-top{ height:32px; }
  #mn0-inputbar{ height:48px; padding:6px 8px; gap:8px; }
  #mn0-q{
    height:36px; padding:0 10px; font-size:16px; /* ≥16px prevents iOS zoom */
  }
  #mn0-send{ height:36px; padding:0 12px; }
  #mn0-stream{
    height:calc(100% - 32px - 48px);  /* panel minus title minus input */
    -webkit-overflow-scrolling:touch; /* smooth scroll on iOS */
    overscroll-behavior:contain;
  }
}
