:root{--bg:#0d1117;--bg-elev:#161b22;--bg-input:#21262d;--border:#30363d;--text:#e6edf3;--text-dim:#9da7b3;--accent:#2f81f7;--accent-text:#fff;--ok:#3fb950;--warn:#d29922;--error:#f85149;--radius:8px}:root[data-theme=light]{--bg:#fff;--bg-elev:#f6f8fa;--bg-input:#fff;--border:#d0d7de;--text:#1f2328;--text-dim:#636c76;--accent:#0969da;--accent-text:#fff;--ok:#1a7f37;--warn:#9a6700;--error:#cf222e}*{box-sizing:border-box}html,body{height:100%}body{background:var(--bg);color:var(--text);flex-direction:column;margin:0;font-family:Inter Variable,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px;display:flex}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.app-header{border-bottom:1px solid var(--border);background:var(--bg-elev);flex-wrap:wrap;align-items:baseline;gap:.75rem;padding:.75rem 1rem;display:flex}.app-header h1{margin:0;font-size:1.15rem}.badge{color:var(--ok);border:1px solid var(--ok);white-space:nowrap;background:#3fb95026;border-radius:999px;align-items:center;gap:.3rem;padding:.15rem .55rem;font-size:.75rem;font-weight:600;display:inline-flex}.tagline{color:var(--text-dim);flex-basis:100%;margin:0;font-size:.85rem}.toolbar{border-bottom:1px solid var(--border);background:var(--bg-elev);flex-wrap:wrap;align-items:center;gap:.4rem;padding:.5rem 1rem;display:flex}.toolbar button{font:inherit;color:var(--text);background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;align-items:center;gap:.4rem;padding:.35rem .7rem;display:inline-flex}.icon{align-items:center;display:inline-flex}.icon svg{width:1.05em;height:1.05em;display:block}.toolbar button:hover{border-color:var(--accent)}.toolbar button.primary{background:var(--accent);color:var(--accent-text);border-color:var(--accent)}.toolbar label{color:var(--text-dim);cursor:pointer;align-items:center;gap:.3rem;display:inline-flex}.spacer{flex:1}.workspace{background:var(--border);flex:1;grid-template-columns:1fr 1fr;gap:1px;min-height:0;display:grid}.pane{background:var(--bg);flex-direction:column;min-width:0;min-height:0;display:flex}.pane-header{text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.3rem .75rem;font-size:.75rem;display:flex}#editor{flex:1;min-height:0;overflow:hidden}.cm-editor{height:100%}.preview-wrap{flex-direction:column;flex:1;min-height:0;display:flex}#preview{background:#fff;border:0;flex:1;width:100%}.console{border-top:1px solid var(--border);background:var(--bg-elev);flex-direction:column;height:30%;min-height:80px;display:flex}#console-list{flex:1;padding:.25rem .5rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;overflow:auto}.console-line{border-bottom:1px solid var(--border);white-space:pre-wrap;word-break:break-word;padding:.1rem .25rem}.console-warn{color:var(--warn)}.console-error{color:var(--error)}.btn-small{font:inherit;color:var(--text-dim);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;background:0 0;align-items:center;gap:.3rem;padding:.15rem .45rem;font-size:.75rem;display:inline-flex}.btn-small:hover{border-color:var(--accent);color:var(--text)}.btn-small.icon-btn{padding:.2rem}.btn-small .icon svg{width:1rem;height:1rem}body.preview-maximized .preview-pane{z-index:60;background:var(--bg);position:fixed;inset:0}body.preview-maximized .console{display:none}.app-footer{border-top:1px solid var(--border);background:var(--bg-elev);color:var(--text-dim);flex-wrap:wrap;align-items:center;gap:.75rem;padding:.5rem 1rem;font-size:.8rem;display:flex}.app-footer .lang{align-items:center;gap:.3rem;margin-left:auto;display:inline-flex}.app-footer select{font:inherit;color:var(--text);background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);padding:.2rem .4rem}.kofi{color:#ff5e5b;font-weight:600}.legal{max-width:760px;margin:0 auto;padding:2rem 1rem 4rem;line-height:1.6}.legal h1{margin-top:0}.legal h2{margin-top:2rem}.legal .lang-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:1.5rem;display:flex}@media (max-width:760px){.workspace{grid-template-columns:1fr;grid-auto-rows:1fr}}