:root{
  --mdle-gap:.75rem;
  --mdle-border:1px solid rgba(255,255,255,.12);
  --mdle-bg:rgba(255,255,255,.04);
  --mdle-blur:12px;
  --mdle-radius:16px;
  --mdle-height:70vh;
}
.mdle-root{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif; color:var(--mdle-fg,#e6e6e6);}
.mdle-root *{box-sizing:border-box}
.mdle-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap;margin-bottom:.5rem}
.mdle-btn{padding:.5rem .75rem;border-radius:12px;border:var(--mdle-border);background:var(--mdle-bg);backdrop-filter:blur(var(--mdle-blur));-webkit-backdrop-filter:blur(var(--mdle-blur));cursor:pointer}
.mdle-btn:hover{transform:translateY(-1px)}
.mdle-status{opacity:.85;font-size:.9rem;transition:opacity .2s, transform .2s}
.mdle-status--show{transform:translateY(-2px)}

.mdle-formatbar{display:flex;gap:.35rem;flex-wrap:wrap;margin:.25rem 0 .75rem}
.mdle-fbtn{padding:.4rem .55rem;border-radius:10px;color:#fff;border:var(--mdle-border);background:var(--mdle-bg);backdrop-filter:blur(var(--mdle-blur));-webkit-backdrop-filter:blur(var(--mdle-blur));cursor:pointer;font-size:.9rem}
.mdle-fbtn:hover{transform:translateY(-1px)}
.mdle-sep{width:1px;align-self:stretch;background:linear-gradient(to bottom, transparent, rgba(255,255,255,.2), transparent)}

.mdle-panels{display:grid;grid-template-columns:1fr 1fr;gap:var(--mdle-gap);min-height:var(--mdle-height)}
.mdle-editor,.mdle-preview{border:var(--mdle-border);background:var(--mdle-bg);backdrop-filter:blur(var(--mdle-blur));-webkit-backdrop-filter:blur(var(--mdle-blur));border-radius:var(--mdle-radius);overflow:hidden}
.mdle-textarea{width:100%;height:100%;min-height:inherit;border:0;outline:0;background:transparent;color:inherit;padding:1rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono','Courier New',monospace;resize:none;tab-size:2}
.mdle-preview{padding:1rem;overflow:auto}
.mdle-preview-inner{max-width:70ch;margin:0 auto}
.mdle-preview-inner pre{padding:.75rem;border-radius:12px;overflow:auto;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}
.mdle-preview-inner code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono','Courier New',monospace}
.mdle-preview-inner table{width:100%;border-collapse:collapse;margin:1rem 0}
.mdle-preview-inner th,.mdle-preview-inner td{border:1px solid rgba(255,255,255,.12);padding:.5rem;text-align:left}
.mdle-preview-inner blockquote{margin:1rem 0;padding:.5rem 1rem;border-left:3px solid rgba(255,255,255,.3);opacity:.9}
.mdle-error{color:#ffb4b4}

@media (max-width: 900px){
  .mdle-panels{grid-template-columns:1fr}
}

.mdle-root.mdle-drag{outline:2px dashed rgba(255,255,255,.4);color:#fff;outline-offset:6px}

.mdle-btn,
.mdle-fbtn {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.6) !important;
}

.mdle-btn:hover,
.mdle-fbtn:hover {
  color: #000 !important;
  background: #fff !important;
}