:root{--bg:#f4f0e8;--elev:#fffcf7;--ink:#1c1a17;--muted:#6f685e;--line:#1c1a171a;--rust:#c45c26;--font:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--display:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--mono:ui-monospace, "Cascadia Code", "SF Mono", Consolas, Menlo, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{background:var(--bg);color:var(--ink);font-family:var(--font);margin:0}body{width:520px;min-height:560px}.quill-app{background:radial-gradient(480px 220px at 0% 0%, #c45c261a, transparent 55%), var(--bg);flex-direction:column;min-height:560px;display:flex}.header{align-items:flex-start;gap:8px;padding:12px 12px 8px;display:flex}.header h1{font-family:var(--display);letter-spacing:-.03em;flex:1;margin:0;font-size:1.3rem;font-weight:700}.header span{color:var(--muted);font-size:.72rem}.toolbar{flex-wrap:wrap;gap:6px;padding:0 12px 8px;display:flex}.btn{appearance:none;border:1px solid var(--line);background:var(--elev);color:var(--ink);font:inherit;cursor:pointer;border-radius:9px;padding:7px 9px;font-size:.72rem;font-weight:700}.btn.primary{background:var(--rust);color:#fff7f0;border-color:#0000}.btn:disabled{opacity:.5;cursor:not-allowed}.panes{flex:1;grid-template-columns:1fr 1fr;gap:8px;min-height:420px;padding:0 12px 12px;display:grid}.pane{border:1px solid var(--line);background:var(--elev);border-radius:12px;flex-direction:column;min-height:0;display:flex;overflow:hidden}.pane h2{color:var(--muted);border-bottom:1px solid var(--line);letter-spacing:.04em;text-transform:uppercase;margin:0;padding:8px 10px;font-size:.7rem;font-weight:700}.pane textarea{resize:none;width:100%;color:var(--ink);font-family:var(--mono);background:0 0;border:none;outline:none;flex:1;padding:10px;font-size:.74rem;line-height:1.5}.preview{flex:1;padding:10px 12px 14px;font-size:.86rem;line-height:1.55;overflow:auto}.preview h1,.preview h2,.preview h3{font-family:var(--display);margin:.9em 0 .4em;line-height:1.2}.preview h1{font-size:1.35rem}.preview h2{font-size:1.15rem}.preview p{margin:0 0 .75em}.preview a{color:var(--rust)}.preview code{font-family:var(--mono);background:#1c1a170f;border-radius:5px;padding:.1em .35em;font-size:.82em}.preview pre{color:#f4f0e8;background:#1c1a17;border-radius:10px;padding:10px;font-size:.72rem;overflow:auto}.preview pre code{color:inherit;background:0 0;padding:0}.preview blockquote{color:var(--muted);border-left:3px solid #c45c2673;margin:0 0 .8em;padding-left:10px}.preview ul,.preview ol{padding-left:1.2em}.preview img{border-radius:8px;max-width:100%;height:auto}.preview table{border-collapse:collapse;width:100%;font-size:.8rem}.preview th,.preview td{border:1px solid var(--line);text-align:left;padding:4px 6px}.status{color:var(--muted);font-size:.7rem;font-family:var(--mono);padding:0 12px 10px}.toast{background:var(--ink);color:#fff;border-radius:999px;padding:7px 12px;font-size:.72rem;font-weight:700;position:fixed;bottom:12px;left:50%;transform:translate(-50%)}.error{color:#8a3222;background:#ffe8e0;border-radius:10px;margin:0 12px 8px;padding:8px 10px;font-size:.74rem}@media (width<=480px){.panes{grid-template-columns:1fr}}