:root { color-scheme: light dark; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; background: #0f172a; color: #e5e7eb; }
.card { width: min(920px, calc(100vw - 32px)); background: #111827; border: 1px solid #374151; border-radius: 20px; padding: 28px; box-shadow: 0 24px 80px rgba(0,0,0,.35); }
h1 { margin: 0 0 8px; }
.muted { color: #9ca3af; }
textarea { width: 100%; min-height: 180px; box-sizing: border-box; border-radius: 14px; padding: 14px; border: 1px solid #4b5563; background: #020617; color: #e5e7eb; font-size: 15px; }
.actions { display: flex; gap: 12px; flex-wrap: wrap; margin: 16px 0; }
button { border: 0; border-radius: 999px; padding: 11px 18px; font-weight: 700; cursor: pointer; background: #38bdf8; color: #082f49; }
button:nth-child(2) { background: #a7f3d0; color: #064e3b; }
button:nth-child(3) { background: #fde68a; color: #713f12; }
pre { white-space: pre-wrap; overflow: auto; background: #020617; border: 1px solid #1f2937; border-radius: 14px; padding: 14px; min-height: 120px; }