:root{
  /* legacy palette (fallbacks) */
  --mkcc-bg:#111; --mkcc-surface:#1a1a1a; --mkcc-text:#fff; --mkcc-accent:#e93368; --mkcc-accent-hover:#ff4f8a;

  /* default button fallbacks */
  --mkcc-btn-p-bg: var(--mkcc-accent);
  --mkcc-btn-p-bg-h: var(--mkcc-accent-hover);
  --mkcc-btn-p-text: #fff;
  --mkcc-btn-p-text-h: #fff;
  --mkcc-btn-p-border: var(--mkcc-accent);
  --mkcc-btn-p-border-h: var(--mkcc-accent-hover);
  --mkcc-btn-p-bw: 1px;

  --mkcc-btn-s-bg: var(--mkcc-surface);
  --mkcc-btn-s-bg-h: #222;
  --mkcc-btn-s-text: #fff;
  --mkcc-btn-s-text-h: #fff;
  --mkcc-btn-s-border: #333;
  --mkcc-btn-s-border-h: #555;
  --mkcc-btn-s-bw: 1px;

  --mkcc-btn-g-bg: transparent;
  --mkcc-btn-g-bg-h: transparent;
  --mkcc-btn-g-text: #fff;
  --mkcc-btn-g-text-h: #fff;
  --mkcc-btn-g-border: #444;
  --mkcc-btn-g-border-h: #666;
  --mkcc-btn-g-bw: 1px;

  /* box */
  --mkcc-font: system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;
  --mkcc-box-border: #333;
  --mkcc-box-bw: 1px;
  --mkcc-box-radius: 10px;
  --mkcc-box-shadow: 0 10px 30px rgba(0,0,0,.35);
  --mkcc-box-pad: 16px;

  /* preferences layout */
  --mkcc-pref-gap: 12px;
  --mkcc-pref-pad: 12px;
}

.mkcc{
  position: fixed; left: 0; right: 0; z-index: 99999;
  font: 14px/1.5 var(--mkcc-font);
  color: var(--mkcc-text);
}
.mkcc--bottom{ bottom: 0; }
.mkcc--top{ top: 0; }

.mkcc__inner{
  margin: 12px;
  padding: var(--mkcc-box-pad, 16px);
  background: var(--mkcc-bg);
  border-radius: var(--mkcc-box-radius);
  border: var(--mkcc-box-bw) solid var(--mkcc-box-border);
  box-shadow: var(--mkcc-box-shadow);
  display: grid; gap: 12px;
}
.mkcc__message{ opacity: .95; }
.mkcc__actions{ display: flex; gap: 8px; flex-wrap: wrap; }

.mkcc__btn{
  appearance:none; border-style: solid;
  padding:.6rem .9rem; border-radius:999px; cursor:pointer; font-weight:600;
  transition: background .15s ease, border-color .15s ease, color .15s ease, opacity .15s ease;
}

/* Primary */
.mkcc__btn--primary{
  background: var(--mkcc-btn-p-bg) !important;
  color: var(--mkcc-btn-p-text) !important;
  border-color: var(--mkcc-btn-p-border) !important;
  border-width: var(--mkcc-btn-p-bw);
}
.mkcc__btn--primary:hover{
  background: var(--mkcc-btn-p-bg-h) !important;
  color: var(--mkcc-btn-p-text-h) !important;
  border-color: var(--mkcc-btn-p-border-h) !important;
}

/* Secondary */
.mkcc__btn--secondary{
  background: var(--mkcc-btn-s-bg) !important;
  color: var(--mkcc-btn-s-text) !important;
  border-color: var(--mkcc-btn-s-border) !important;
  border-width: var(--mkcc-btn-s-bw);
}
.mkcc__btn--secondary:hover{
  background: var(--mkcc-btn-s-bg-h) !important;
  color: var(--mkcc-btn-s-text-h) !important;
  border-color: var(--mkcc-btn-s-border-h) !important;
}

/* Ghost / Tertiary */
.mkcc__btn--ghost{
  background: var(--mkcc-btn-g-bg) !important;
  color: var(--mkcc-btn-g-text) !important;
  border-color: var(--mkcc-btn-g-border) !important;
  border-width: var(--mkcc-btn-g-bw);
}
.mkcc__btn--ghost:hover{
  background: var(--mkcc-btn-g-bg-h) !important;
  color: var(--mkcc-btn-g-text-h) !important;
  border-color: var(--mkcc-btn-g-border-h) !important;
}

/* Add a chevron/arrow to the Manage (tertiary) button */
.mkcc__btn--ghost[data-mkcc="open-manage"]::after{
  content: "›";
  display: inline-block;
  margin-left: .45em;
  line-height: 1;
  color: currentColor;
  transform: translateY(-1px);
}
.mkcc__btn--ghost[data-mkcc="open-manage"]:hover::after{
  color: currentColor;
}

/* Manage panel */
.mkcc__manage{
  margin: 12px; padding: 16px;
  background: var(--mkcc-surface);
  border-radius: var(--mkcc-box-radius);
  box-shadow: var(--mkcc-box-shadow);
}
.mkcc__title{ margin-top:0; font-size:1.05rem; }
.mkcc__list{
  list-style:none; margin:0; padding:0; display:grid;
  gap: var(--mkcc-pref-gap);
}
.mkcc__item{
  background:#141414;
  padding: var(--mkcc-pref-pad);
  border-radius:8px;
}
.mkcc__label{ display:block; font-weight:700; }
.mkcc__desc{ display:block; font-size:.92em; opacity:.85; }
.mkcc__manage-actions{ display:flex; gap:8px; margin-top:10px; }