/* Estudio Minike - camada visual sem alterar o motor legado do editor. */
:root {
  --bg0: #070b16;
  --bg1: #0b1120;
  --bg2: #111827;
  --bg3: #182033;
  --bg4: #23304a;
  --border: rgba(148, 163, 184, .22);
  --border-soft: rgba(148, 163, 184, .12);
  --accent: #00d4ff;
  --accent-h: #67e8f9;
  --accent2: #7c3cff;
  --green: #22c55e;
  --blue: #38bdf8;
  --purple: #a78bfa;
  --yellow: #facc15;
  --text: #f8fafc;
  --text-soft: #cbd5e1;
  --muted: #8fa1bd;
  --shadow-sm: 0 2px 10px rgba(2, 6, 23, .35);
  --shadow-md: 0 8px 30px rgba(2, 6, 23, .42);
  --shadow-lg: 0 24px 70px rgba(2, 6, 23, .55);
}

body {
  background:
    radial-gradient(circle at 12% 0%, rgba(0, 212, 255, .14), transparent 34%),
    radial-gradient(circle at 88% 18%, rgba(124, 60, 255, .18), transparent 32%),
    linear-gradient(180deg, #060914 0%, #090d18 54%, #050812 100%);
}

.app-header {
  background: rgba(5, 10, 24, .86);
  border-bottom: 1px solid rgba(0, 212, 255, .18);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
}

.app-logo .mark,
.mn-logo .mark {
  background: linear-gradient(135deg, #00d4ff 0%, #7c3cff 62%, #ff4fd8 100%);
  border-radius: 13px;
  box-shadow: 0 10px 28px rgba(0, 212, 255, .26), inset 0 0 0 1px rgba(255,255,255,.24);
  font-size: 16px;
  letter-spacing: -.08em;
}

.app-logo .txt h2 {
  color: #f8fafc;
  letter-spacing: 2.7px;
}

.app-logo .txt span,
.mn-logo small {
  color: #8bdcff;
}

.tab-bar {
  background: rgba(15, 23, 42, .78);
  border-color: rgba(148, 163, 184, .18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.tab-btn.active,
.btn-primario,
.btn-header.primary,
.modo-btn.active,
.btn-buscar-grande {
  background: linear-gradient(135deg, #00d4ff, #7c3cff);
  box-shadow: 0 10px 28px rgba(0, 212, 255, .22);
}

.btn-primario:hover,
.btn-header.primary:hover {
  box-shadow: 0 14px 34px rgba(124, 60, 255, .32);
}

.btn-secundario,
.btn-header,
.tb-btn,
.worktab,
.modelo-card,
.acao-card,
.produto-card,
.props-card,
.modal-content,
.progress-box {
  border-color: rgba(148, 163, 184, .18);
}

.btn-secundario:hover,
.btn-header:hover,
.tb-btn:hover,
.modelo-card:hover,
.acao-card:hover,
.produto-card:hover {
  border-color: rgba(0, 212, 255, .62);
  color: #67e8f9;
  box-shadow: 0 0 0 1px rgba(0, 212, 255, .12);
}

.modelo-card::before,
.tool-container::before {
  background: linear-gradient(90deg, #00d4ff, #7c3cff);
}

.modelo-card.selected,
.slide-item.active {
  border-color: #00d4ff;
  box-shadow: 0 0 0 4px rgba(0, 212, 255, .16);
}

.aba-modelos-body h1,
.keywords-header h1 {
  background: linear-gradient(135deg, #f8fafc, #67e8f9 45%, #a78bfa);
  -webkit-background-clip: text;
  background-clip: text;
}

.status-pill {
  background: rgba(15, 23, 42, .75);
  border: 1px solid rgba(34, 197, 94, .24);
}

.status-dot {
  background: #22c55e;
  box-shadow: 0 0 0 5px rgba(34, 197, 94, .12);
}

.mobile-nav {
  background: rgba(7, 11, 22, .96);
  border-left: 1px solid rgba(0, 212, 255, .18);
}

.mobile-nav-header {
  border-bottom-color: rgba(148, 163, 184, .16);
}

.mobile-nav-link:hover {
  background: rgba(0, 212, 255, .08);
  color: #67e8f9;
}

.editor-toolbar,
.slides-panel,
#painelProps,
.aba2-sidebar,
.worktabs-bar {
  background: rgba(9, 14, 28, .94);
  border-color: rgba(148, 163, 184, .16);
}

.canvas-wrap {
  background:
    radial-gradient(circle at 50% 0%, rgba(0, 212, 255, .06), transparent 34%),
    linear-gradient(135deg, #0b1020, #050814);
}

.toast {
  border-left-color: #00d4ff;
}

@media (max-width: 760px) {
  .app-header {
    gap: 8px;
  }
  .app-logo .txt span {
    display: none;
  }
}

.minike-launcher {
  position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr); gap: 22px; margin: 0 0 28px; padding: 26px; border: 1px solid rgba(0, 212, 255, .22); border-radius: 30px;
  background: radial-gradient(circle at 10% 0%, rgba(0, 212, 255, .22), transparent 34%), radial-gradient(circle at 100% 20%, rgba(124, 60, 255, .22), transparent 30%), linear-gradient(135deg, rgba(15, 23, 42, .96), rgba(2, 6, 23, .92));
  box-shadow: 0 24px 80px rgba(0, 0, 0, .36);
}
.minike-launcher .eyebrow { display: inline-flex; width: max-content; margin-bottom: 12px; padding: 7px 11px; border: 1px solid rgba(103, 232, 249, .25); border-radius: 999px; color: #67e8f9; font-size: 11px; font-weight: 900; letter-spacing: .22em; text-transform: uppercase; background: rgba(0, 212, 255, .08); }
.minike-launcher h2 { margin: 0; max-width: 760px; font-size: clamp(28px, 4vw, 54px); line-height: .98; letter-spacing: -1.8px; color: #fff; }
.minike-launcher p { max-width: 720px; margin: 16px 0 0; color: #cbd5e1; font-size: 15px; line-height: 1.7; }
.minike-launcher-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-self: center; }
.minike-launcher-actions button { min-height: 94px; padding: 16px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 22px; color: #f8fafc; text-align: left; background: rgba(15, 23, 42, .76); cursor: pointer; transition: transform .16s ease, border-color .16s ease, background .16s ease; }
.minike-launcher-actions button:first-child { background: linear-gradient(135deg, rgba(0, 212, 255, .24), rgba(124, 60, 255, .26)); border-color: rgba(103, 232, 249, .45); }
.minike-launcher-actions button:hover { transform: translateY(-2px); border-color: rgba(103, 232, 249, .62); background: rgba(30, 41, 59, .86); }
.minike-launcher-actions strong, .minike-launcher-actions span { display: block; }
.minike-launcher-actions strong { font-size: 15px; margin-bottom: 8px; }
.minike-launcher-actions span { color: #9fb4d2; font-size: 12px; }
.minike-launcher-sources { grid-column: 1 / -1; padding-top: 14px; border-top: 1px solid rgba(148, 163, 184, .13); color: #8fa1bd; font-size: 12px; }
.demo-mode-card { border: 1px solid rgba(0, 212, 255, .28); background: linear-gradient(135deg, rgba(0, 212, 255, .10), rgba(124, 60, 255, .10)); text-align: left; }
.demo-mode-card .ico { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; margin-bottom: 10px; background: linear-gradient(135deg, #00d4ff, #7c3cff); color: #fff; font-weight: 900; letter-spacing: -1px; }
.produto-card[data-id^="demo-"] { border-color: rgba(0, 212, 255, .25); }
@media (max-width: 920px) { .minike-launcher { grid-template-columns: 1fr; padding: 20px; } .minike-launcher-actions { grid-template-columns: 1fr; } }


body.minike-simple-home:not(.minike-show-complete-home) #aba1 .aba-modelos-body > .modelo-grupo:nth-of-type(n+5) { display: none; }
.minike-show-all { float: right; margin-top: -4px; padding: 8px 12px; border: 1px solid rgba(103, 232, 249, .28); border-radius: 999px; background: rgba(0, 212, 255, .08); color: #67e8f9; font-size: 12px; font-weight: 800; cursor: pointer; }
.minike-show-all:hover { background: rgba(0, 212, 255, .15); }

.minike-mike-body { display: grid; gap: 18px; }
.mike-status-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.mike-status-card { padding: 16px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 18px; background: rgba(15, 23, 42, .78); }
.mike-status-card strong, .mike-status-card span { display: block; }
.mike-status-card strong { color: #fff; font-size: 13px; margin-bottom: 8px; }
.mike-status-card span { color: #cbd5e1; font-size: 12px; }
.mike-status-card.ok { border-color: rgba(34, 197, 94, .35); box-shadow: inset 0 0 0 1px rgba(34, 197, 94, .08); }
.mike-status-card.warn { border-color: rgba(250, 204, 21, .28); box-shadow: inset 0 0 0 1px rgba(250, 204, 21, .06); }
.mike-context-preview { min-height: 260px; width: 100%; padding: 14px; border: 1px solid rgba(148, 163, 184, .18); border-radius: 16px; background: #020617; color: #dbeafe; font: 12px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; resize: vertical; }
.mike-next-actions { display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 760px) { .mike-status-grid { grid-template-columns: 1fr; } }

body.minike-format-first:not(.minike-show-product-search) #aba2 .aba-produtos-body,
.minike-hidden-product-search {
  display: none !important;
}
body.minike-show-product-search #minikeFormatScreen {
  display: none !important;
}
.minike-format-screen {
  min-height: calc(100dvh - 150px);
  padding: clamp(18px, 4vw, 44px);
  overflow: auto;
  background: radial-gradient(circle at top left, rgba(0, 212, 255, .12), transparent 32%), linear-gradient(135deg, rgba(2, 6, 23, .98), rgba(15, 23, 42, .94));
}
.minike-format-hero {
  max-width: 860px;
  margin-bottom: 24px;
}
.minike-format-hero .eyebrow {
  display: inline-flex;
  margin-bottom: 12px;
  padding: 7px 11px;
  border-radius: 999px;
  border: 1px solid rgba(103, 232, 249, .25);
  color: #67e8f9;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.minike-format-hero h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(30px, 5vw, 62px);
  line-height: .96;
  letter-spacing: -2px;
}
.minike-format-hero p {
  max-width: 780px;
  margin: 16px 0 0;
  color: #cbd5e1;
  font-size: 16px;
  line-height: 1.7;
}
.minike-format-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 14px;
}
.minike-format-card {
  min-height: 150px;
  padding: 20px;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 26px;
  color: #f8fafc;
  text-align: left;
  background: rgba(15, 23, 42, .82);
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
.minike-format-card:hover {
  transform: translateY(-3px);
  border-color: rgba(103, 232, 249, .62);
  background: linear-gradient(135deg, rgba(0, 212, 255, .16), rgba(124, 60, 255, .18));
}
.minike-format-card strong,
.minike-format-card span {
  display: block;
}
.minike-format-card strong {
  margin-bottom: 10px;
  font-size: 18px;
}
.minike-format-card span {
  color: #aebfd7;
  font-size: 13px;
  line-height: 1.5;
}
.minike-format-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}
@media (max-width: 760px) {
  .minike-format-screen { min-height: auto; padding: 18px; }
  .minike-format-grid { grid-template-columns: 1fr; }
}

body.minike-single-screen .tab-bar {
  display: none !important;
}
body.minike-single-screen .app-header {
  grid-template-columns: auto 1fr;
}
body.minike-single-screen .app-logo .txt span::after {
  content: " · tela unica";
  color: #67e8f9;
}
body.minike-single-screen .tab-footer {
  display: none !important;
}
.minike-floating-dock {
  position: fixed;
  left: 50%;
  bottom: max(18px, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  z-index: 9990;
  display: flex;
  gap: 8px;
  padding: 8px;
  border: 1px solid rgba(148, 163, 184, .2);
  border-radius: 999px;
  background: rgba(2, 6, 23, .78);
  backdrop-filter: blur(18px);
  box-shadow: 0 18px 60px rgba(0,0,0,.42);
}
.minike-floating-dock button {
  min-width: 84px;
  padding: 10px 14px;
  border: 0;
  border-radius: 999px;
  color: #f8fafc;
  background: transparent;
  cursor: pointer;
  transition: background .16s ease, transform .16s ease;
}
.minike-floating-dock button:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, rgba(0, 212, 255, .22), rgba(124, 60, 255, .2));
}
.minike-floating-dock strong,
.minike-floating-dock span {
  display: block;
}
.minike-floating-dock strong {
  font-size: 12px;
  line-height: 1.1;
}
.minike-floating-dock span {
  margin-top: 2px;
  color: #9fb4d2;
  font-size: 10px;
}
body.minike-single-screen #aba1,
body.minike-single-screen #aba2,
body.minike-single-screen #aba3,
body.minike-single-screen #aba4 {
  animation: minikePaneIn .22s ease both;
}
@keyframes minikePaneIn {
  from { opacity: 0; transform: translateY(10px) scale(.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (max-width: 760px) {
  .minike-floating-dock { width: calc(100vw - 18px); justify-content: space-between; border-radius: 24px; }
  .minike-floating-dock button { min-width: 0; flex: 1; padding: 9px 8px; }
}

.mike-studio-answer {
  min-height: 120px;
  padding: 14px;
  border: 1px solid rgba(103, 232, 249, .18);
  border-radius: 16px;
  background: rgba(2, 6, 23, .72);
  color: #e2e8f0;
  white-space: pre-wrap;
  line-height: 1.55;
}
.mike-studio-answer.error {
  border-color: rgba(248, 113, 113, .45);
  color: #fecaca;
}
.minike-mike-body details summary {
  cursor: pointer;
  color: #67e8f9;
  font-weight: 800;
  margin-bottom: 8px;
}

/* Minike Studio 2026 - modo cliente: entrada simples, canvas primeiro, Mike no centro. */
body.minike-simple-home:not(.minike-show-complete-home) #aba1 .aba-modelos-body > .modelo-grupo {
  display: none !important;
}
body.minike-simple-home:not(.minike-show-complete-home) #minikeStudioLauncher {
  display: grid !important;
}
body.minike-show-complete-home #aba1 .aba-modelos-body > .modelo-grupo {
  display: block;
}
.minike-launcher {
  align-items: start;
}
.minike-launcher::after {
  content: "";
  position: absolute;
  width: 360px;
  height: 360px;
  right: -130px;
  bottom: -170px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(0, 212, 255, .16), transparent 68%);
  pointer-events: none;
}
.minike-studio-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}
.minike-studio-steps span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 999px;
  color: #cbd5e1;
  background: rgba(2, 6, 23, .34);
  font-size: 12px;
  font-weight: 800;
}
.minike-studio-steps b {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  color: #020617;
  background: #67e8f9;
}
.minike-launcher-main-actions {
  grid-template-columns: 1fr;
}
.minike-launcher-actions button.primary,
.minike-launcher-main-actions button.primary {
  background: linear-gradient(135deg, rgba(0, 212, 255, .32), rgba(34, 197, 94, .18));
  border-color: rgba(103, 232, 249, .58);
}
.minike-format-strip {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin-top: 2px;
}
.minike-format-strip button,
.minike-prompt-row button {
  border: 1px solid rgba(148, 163, 184, .16);
  color: #f8fafc;
  background: rgba(2, 6, 23, .42);
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
.minike-format-strip button {
  min-height: 74px;
  padding: 12px;
  border-radius: 18px;
  text-align: left;
}
.minike-format-strip button:hover,
.minike-prompt-row button:hover {
  transform: translateY(-2px);
  border-color: rgba(103, 232, 249, .55);
  background: rgba(15, 23, 42, .72);
}
.minike-format-strip b,
.minike-format-card b {
  display: inline-flex;
  margin-bottom: 8px;
  padding: 4px 7px;
  border-radius: 9px;
  color: #020617;
  background: #67e8f9;
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: .04em;
}
.minike-format-strip span {
  display: block;
  color: #e2e8f0;
  font-size: 12px;
  font-weight: 900;
}
.minike-prompt-row {
  grid-column: 1 / -1;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 4px;
}
.minike-prompt-row button {
  padding: 9px 12px;
  border-radius: 999px;
  color: #cbd5e1;
  font-size: 12px;
}
.minike-launcher-sources {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.minike-launcher-sources > div {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.minike-show-all {
  float: none;
  margin-top: 0;
}
.minike-format-card b {
  margin-bottom: 12px;
}
body.minike-format-first:not(.minike-show-product-search) #aba2 .tab-footer {
  display: none !important;
}
.auto-generator-box::before {
  content: "Encarte e catalogo com produtos";
  display: inline-flex;
  margin-bottom: 10px;
  padding: 6px 10px;
  border: 1px solid rgba(103, 232, 249, .24);
  border-radius: 999px;
  color: #67e8f9;
  background: rgba(0, 212, 255, .08);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
@media (max-width: 980px) {
  .minike-format-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .minike-launcher-sources { align-items: flex-start; flex-direction: column; }
  .minike-launcher-sources > div { justify-content: flex-start; }
}
@media (max-width: 620px) {
  .minike-format-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .minike-studio-steps { gap: 7px; }
  .minike-studio-steps span { width: 100%; }
  .minike-prompt-row button { width: 100%; text-align: left; }
}

/* Mike Studio actions */
.mike-action-list {
  display: grid;
  gap: 8px;
}
.mike-action-row,
.mike-actions-empty {
  padding: 11px 12px;
  border: 1px solid rgba(148, 163, 184, .16);
  border-radius: 14px;
  background: rgba(2, 6, 23, .55);
}
.mike-action-row strong,
.mike-action-row span {
  display: block;
}
.mike-action-row strong {
  color: #f8fafc;
  font-size: 12px;
  margin-bottom: 4px;
}
.mike-action-row span,
.mike-actions-empty {
  color: #9fb4d2;
  font-size: 12px;
  line-height: 1.45;
}
#mikeStudioApplyBtn:disabled,
#mikeStudioUndoBtn:disabled {
  opacity: .45;
  cursor: not-allowed;
  filter: grayscale(.35);
}
/* Mike lateral: conversa continua dentro do editor, sem modal bloqueando o canvas. */
.minike-mike-side-panel {
  position: fixed;
  inset: 12px 12px 12px auto;
  z-index: 10020;
  display: grid;
  grid-template-rows: auto auto auto auto minmax(160px, 1fr) auto auto auto;
  gap: 12px;
  width: min(440px, calc(100vw - 24px));
  padding: 16px;
  border: 1px solid rgba(103, 232, 249, .24);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(15, 23, 42, .98), rgba(2, 6, 23, .98));
  box-shadow: 0 24px 80px rgba(0, 0, 0, .48), inset 0 1px 0 rgba(255,255,255,.05);
  transform: translateX(calc(100% + 28px));
  opacity: 0;
  pointer-events: none;
  transition: transform .22s ease, opacity .18s ease;
}
.minike-mike-side-panel.open {
  transform: translateX(0);
  opacity: 1;
  pointer-events: auto;
}
.mike-side-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.mike-side-header .eyebrow {
  display: inline-flex;
  margin-bottom: 6px;
  color: #67e8f9;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.mike-side-header h2 {
  margin: 0;
  color: #fff;
  font-size: 20px;
  letter-spacing: -.04em;
}
.mike-side-close {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(148, 163, 184, .2);
  border-radius: 999px;
  color: #e2e8f0;
  background: rgba(2, 6, 23, .62);
  cursor: pointer;
}
.mike-side-status,
.mike-quick-prompts,
.mike-side-buttons,
.mike-install-card > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mike-side-status span,
.mike-quick-prompts button {
  border: 1px solid rgba(148, 163, 184, .17);
  border-radius: 999px;
  color: #cbd5e1;
  background: rgba(2, 6, 23, .48);
  font-size: 11px;
  font-weight: 850;
}
.mike-side-status span { padding: 7px 9px; }
.mike-side-status span.ok { border-color: rgba(34, 197, 94, .35); color: #bbf7d0; }
.mike-side-status span.warn { border-color: rgba(250, 204, 21, .28); color: #fde68a; }
.mike-install-card {
  padding: 13px;
  border: 1px solid rgba(250, 204, 21, .22);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(250, 204, 21, .10), rgba(0, 212, 255, .08));
}
.mike-install-card strong,
.mike-install-card p { display: block; }
.mike-install-card strong { color: #fff; font-size: 13px; margin-bottom: 6px; }
.mike-install-card p { margin: 0 0 10px; color: #cbd5e1; font-size: 12px; line-height: 1.45; }
.mike-install-card a { text-decoration: none; }
.mike-quick-prompts button {
  padding: 8px 10px;
  cursor: pointer;
  transition: transform .14s ease, border-color .14s ease, background .14s ease;
}
.mike-quick-prompts button:hover {
  transform: translateY(-1px);
  border-color: rgba(103, 232, 249, .5);
  background: rgba(0, 212, 255, .10);
}
.mike-chat-thread {
  min-height: 160px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, .13);
  border-radius: 20px;
  background: radial-gradient(circle at top right, rgba(0, 212, 255, .10), transparent 36%), rgba(2, 6, 23, .56);
}
.mike-chat-bubble {
  max-width: 92%;
  padding: 11px 12px;
  border: 1px solid rgba(148, 163, 184, .15);
  border-radius: 16px;
  background: rgba(15, 23, 42, .86);
}
.mike-chat-bubble.user {
  align-self: flex-end;
  border-color: rgba(103, 232, 249, .32);
  background: linear-gradient(135deg, rgba(0, 212, 255, .20), rgba(124, 60, 255, .16));
}
.mike-chat-bubble.system,
.mike-chat-bubble.error {
  border-color: rgba(248, 113, 113, .36);
  background: rgba(127, 29, 29, .22);
}
.mike-chat-bubble span {
  display: block;
  margin-bottom: 5px;
  color: #67e8f9;
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.mike-chat-bubble p {
  margin: 0;
  color: #e2e8f0;
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
}
.mike-side-state {
  min-height: 0;
  padding: 10px 12px;
  font-size: 12px;
}
.mike-side-composer {
  display: grid;
  gap: 10px;
  padding-top: 2px;
}
.mike-side-composer textarea {
  width: 100%;
  min-height: 84px;
  padding: 13px;
  border: 1px solid rgba(103, 232, 249, .22);
  border-radius: 18px;
  color: #f8fafc;
  background: #020617;
  resize: vertical;
  outline: none;
}
.mike-side-composer textarea:focus {
  border-color: rgba(103, 232, 249, .68);
  box-shadow: 0 0 0 3px rgba(0, 212, 255, .12);
}
.mike-context-details summary {
  cursor: pointer;
  color: #67e8f9;
  font-size: 12px;
  font-weight: 900;
}
.mike-context-details .mike-context-preview {
  min-height: 120px;
  margin-top: 8px;
}
.minike-mike-side-panel .mike-action-list {
  max-height: 160px;
  overflow: auto;
}
body.minike-mike-panel-open .minike-floating-dock {
  right: min(470px, calc(100vw - 10px));
}
@media (min-width: 1180px) {
  body.minike-mike-panel-open #aba3 .editor-workspace,
  body.minike-mike-panel-open .canvas-area {
    padding-right: 450px;
    transition: padding-right .22s ease;
  }
}
@media (max-width: 760px) {
  .minike-mike-side-panel {
    inset: 8px;
    width: auto;
    border-radius: 22px;
    grid-template-rows: auto auto auto auto minmax(140px, 1fr) auto auto auto;
  }
  .mike-side-buttons .btn-primario,
  .mike-side-buttons .btn-secundario,
  .mike-install-card .btn-primario,
  .mike-install-card .btn-secundario {
    flex: 1 1 120px;
  }
  body.minike-mike-panel-open .minike-floating-dock {
    display: none;
  }
}