:root{--ink: #14233A;--ink-soft: #42536B;--paper: #E9EDF2;--card: #F7F9FB;--line: #CBD5E1;--line-soft: #E2E8F0;--amber: #E0890A;--amber-d: #C0740A;--amber-t: #FBEBCF;--amber-tt: #FDF4E4;--teal: #12A594;--teal-d: #0E8174;--teal-t: #CFF3EC;--teal-tt: #E7F8F4;--indigo: #5B5BD6;--indigo-d: #4A4AC4;--indigo-t: #DEDEFA;--indigo-tt: #EEEEFC;--slate: #6B7A8D;--slate-d: #54626F;--slate-t: #E4E9EE;--slate-tt: #EEF1F4;--coral: #E5484D;--coral-d: #CE3B40;--coral-t: #FBDAD9;--coral-tt: #FDEBEA;--dark-bg-deep: #0E1B2C;--dark-bg: #14233A;--dark-line: #22344B;--dark-line-soft: #3A4E68;--dark-text: #B9C6D6;--dark-text-soft: #9FB0C6;--dark-muted: #7C8DA3;--dark-accent: #8BE0D3;--muted-placeholder: #AEB8C4;--muted-tab: #B0BAC7;--muted-faint: #9AA6B4;--muted-wheel-dim: #C4CCD6;--font-display: "Space Grotesk",sans-serif;--font-body: "Inter",system-ui,sans-serif;--font-mono: "Space Mono",monospace;--r-sm: 9px;--r-md: 12px;--r: 14px;--r-xl: 16px;--r-pill: 999px;--shadow-card: 0 18px 44px -30px rgba(20,35,58,.5);--shadow-card-hover: 0 10px 30px -18px rgba(20,35,58,.5);--shadow-phone: 0 24px 50px -26px rgba(20,35,58,.55)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:#fff;color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased}.app{min-height:100%;display:flex;flex-direction:column;background:#fff}.app.dark{background:var(--dark-bg);color-scheme:dark}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;margin:0;cursor:pointer;font:inherit;color:inherit}.app-top{display:flex;align-items:center;gap:11px;padding:13px 20px;border-bottom:1px solid var(--line-soft);flex:0 0 auto}.logo{display:flex;align-items:center;gap:9px;font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:-.01em}.logo .m{width:26px;height:26px;border-radius:8px;border:2px solid var(--ink);background:var(--slate-t);display:grid;place-items:center}.logo .m svg{width:15px;height:15px;stroke:var(--ink);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.toolbar{margin-left:auto;display:flex;gap:5px;align-items:center}.tb{font-family:var(--font-mono);font-size:11px;color:var(--ink-soft);border:1px solid var(--line-soft);border-radius:7px;padding:5px 9px}.tb.on{background:var(--slate-t);border-color:var(--slate);color:var(--ink)}.tb.icon{padding:5px 8px}.dark .app-top{background:var(--dark-bg-deep);border-color:var(--dark-line)}.dark .logo{color:#fff}.dark .logo .m{background:var(--dark-line);border-color:#fff}.dark .logo .m svg{stroke:#fff}.dark .tb{border-color:var(--dark-line-soft);color:var(--dark-text-soft)}.dark .tb.on{background:var(--dark-line);border-color:var(--dark-line-soft);color:#fff}.empty{flex:1;padding:70px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty .di{width:56px;height:56px;border-radius:15px;background:var(--slate-t);display:grid;place-items:center;margin:0 auto 16px}.empty .di svg{width:28px;height:28px;stroke:var(--slate-d);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.empty h2{font-family:var(--font-display);font-weight:700;font-size:22px;letter-spacing:-.02em;margin:0 0 6px}.empty p{color:var(--ink-soft);font-size:14px;margin:0 0 20px}.empty .actions{display:flex;gap:10px;justify-content:center}.empty .btn{font-family:var(--font-display);font-weight:700;font-size:13px;padding:11px 18px;border-radius:10px}.empty .btn.p{background:var(--slate-d);color:#fff}.empty .btn.s{border:1px solid var(--line);color:var(--ink-soft)}.empty .paste{margin-top:22px;font-family:var(--font-mono);font-size:10px;color:var(--muted-faint);letter-spacing:.08em}.dark .empty h2{color:#fff}.dark .empty p{color:var(--dark-text)}.dark .empty .di{background:var(--dark-line)}.dark .empty .di svg{stroke:var(--dark-accent)}.dark .empty .btn.s{border-color:var(--dark-line-soft);color:var(--dark-text-soft)}.dark .empty .paste{color:var(--dark-muted)}.editor{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr)}.editor.single{grid-template-columns:1fr}.pane{padding:22px 24px;min-width:0;display:flex;flex-direction:column}.pane.src{border-right:1px solid var(--line-soft);background:var(--slate-tt)}.pane.prev{overflow-y:auto}.panehdr{font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:14px;flex:0 0 auto}textarea.code{flex:1;width:100%;border:0;padding:0;background:transparent;resize:none;outline:none;font-family:var(--font-mono);font-size:12px;line-height:1.9;color:var(--ink-soft);white-space:pre-wrap}.dark .editor{background:var(--dark-bg)}.dark .pane.src{background:var(--dark-bg-deep);border-color:var(--dark-line)}.dark .pane.prev{background:var(--dark-bg)}.dark .panehdr{color:var(--dark-muted)}.dark textarea.code{color:var(--dark-text-soft)}.prev-body{flex:1}.prev-body>:last-child{margin-bottom:0}.prev-body h1{font-family:var(--font-display);font-weight:700;font-size:24px;letter-spacing:-.02em;margin:0 0 14px;padding-bottom:14px;border-bottom:1px solid var(--line-soft)}.prev-body h2,.prev-body h3,.prev-body h4,.prev-body h5,.prev-body h6{font-family:var(--font-display);font-weight:600;font-size:15px;margin:16px 0 6px}.prev-body h3{font-size:14px}.prev-body h4,.prev-body h5,.prev-body h6{font-size:13px}.prev-body p{font-size:13px;color:var(--ink-soft);line-height:1.6;margin:0 0 10px}.prev-body ul,.prev-body ol{margin:0 0 10px;padding-left:18px}.prev-body li{font-size:13px;color:var(--ink-soft);line-height:1.7}.prev-body code{font-family:var(--font-mono);font-size:11px;background:var(--slate-tt);border:1px solid var(--line-soft);border-radius:5px;padding:1px 6px;color:var(--slate-d)}.prev-body pre{margin:0 0 10px;background:var(--slate-tt);border:1px solid var(--line-soft);border-radius:5px;padding:10px 12px;overflow-x:auto}.prev-body pre code{border:0;background:transparent;padding:0}.prev-body blockquote{margin:0 0 10px;border-left:3px solid var(--slate);padding:2px 0 2px 14px;color:var(--ink-soft);font-style:italic;font-size:13px}.prev-body strong{color:var(--ink)}.prev-body a{color:var(--slate-d)}.prev-body hr{border:0;height:1px;background:var(--line-soft);margin:14px 0}.prev-body img{max-width:100%}.prev-body table{border-collapse:collapse;margin:0 0 10px;font-size:13px;color:var(--ink-soft)}.prev-body th,.prev-body td{border:1px solid var(--line-soft);padding:4px 10px;text-align:left}.prev-body th{font-family:var(--font-display);font-weight:600;color:var(--ink)}.dark .prev-body h1,.dark .prev-body h2,.dark .prev-body h3,.dark .prev-body h4,.dark .prev-body h5,.dark .prev-body h6{color:#fff}.dark .prev-body h1{border-color:var(--dark-line)}.dark .prev-body p,.dark .prev-body li{color:var(--dark-text)}.dark .prev-body code{background:var(--dark-bg-deep);border-color:var(--dark-line);color:var(--dark-accent)}.dark .prev-body pre{background:var(--dark-bg-deep);border-color:var(--dark-line)}.dark .prev-body blockquote{color:var(--dark-text);border-color:var(--slate)}.dark .prev-body strong{color:#fff}.dark .prev-body a{color:var(--dark-accent)}.dark .prev-body hr{background:var(--dark-line)}.dark .prev-body table{color:var(--dark-text)}.dark .prev-body th,.dark .prev-body td{border-color:var(--dark-line)}.dark .prev-body th{color:#fff}@media(max-width:640px){.editor{grid-template-columns:1fr;grid-auto-rows:minmax(0,1fr)}.pane.src{border-right:0;border-bottom:1px solid var(--line-soft)}.dark .pane.src{border-color:var(--dark-line)}}