@font-face{font-family:JetBrains Mono;src:url(/fonts/JetBrainsMono-Regular.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}:root{--color-background:#fff;--color-background-secondary:#f4f4f4;--color-border:#c6c6c6;--color-border-dark:#868581;--color-text:#333;--color-text-muted:#666;--color-white:#fff;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:12px;--spacing-lg:16px;--font-family:system-ui, sans-serif;--font-family-mono:"JetBrains Mono", "Monaco", "Menlo", "Ubuntu Mono", "Consolas", "source-code-pro", monospace;--font-size-xs:11px;--font-size-sm:12px;--font-size-md:13px;--font-size-base:14px;--font-weight-semibold:600;--line-height-base:1.6;--popup-font-size-max:24px;--border-radius-small:.125em;--border-radius-medium:2px;--border-radius:4px;--border-radius-lg:6px;--button-bg:#f0f0f0;--button-bg-hover:#e0e0e0;--button-border:#ddd;--button-border-hover:#999;--input-padding:.625em .9375em;--color-warning-bg:#fff3cd;--color-warning-border:#ffc107;--color-warning-text:#856404;--color-error-text:#721c24;--color-brand-yellow:#dfff00;--color-brand-green:#008351}@media (prefers-color-scheme:dark){:root{--color-background:#1a1a1a;--color-background-secondary:#2a2a2a;--color-border:#404040;--color-border-dark:#606060;--color-text:#e0e0e0;--color-text-muted:#a0a0a0;--color-white:#1a1a1a;--button-bg:#2a2a2a;--button-bg-hover:#3a3a3a;--button-border:#404040;--button-border-hover:#606060;--color-warning-bg:#3a2f1a;--color-warning-border:#665200;--color-warning-text:#f4d03f;--color-error-text:#ff6b6b}}.brand{background:linear-gradient(135deg, var(--color-brand-green) 0%, #006b42 100%)}.brand .button-about{background:var(--color-brand-yellow);color:#333;border-color:#b3cc00}.brand .button-about:hover{background:#e6ff1a;border-color:#9a0}@media (prefers-color-scheme:dark){.brand{background:linear-gradient(135deg, var(--color-brand-yellow) 0%, #e6ff1a 100%)}.brand .button-about{background:var(--color-brand-green);color:#fff;border-color:#006b42}.brand .button-about:hover{background:#00995c;border-color:#007a4d}}html,body{margin:0;padding:0;background-color:var(--color-background-secondary)!important}.app{flex-direction:column;width:100%;height:100vh;display:flex}.editor-container{flex:1;display:flex;overflow:hidden}.editor-pane{border-right:1px solid var(--color-border);flex-direction:column;flex:1;display:flex;overflow:hidden}.editor-pane:last-child{border-right:none}.editor-header{padding:var(--spacing-md) var(--spacing-md) var(--spacing-md) var(--spacing-lg);background-color:var(--color-background-secondary);border-bottom:1px solid var(--color-border);font-weight:var(--font-weight-semibold);font-size:var(--font-size-base);color:var(--color-text);justify-content:space-between;align-items:center;gap:var(--spacing-sm);height:48px;min-height:48px;display:flex}button{box-sizing:border-box;cursor:pointer;border:1px solid var(--color-border);background:var(--button-bg);line-height:1;font-family:var(--font-family);font-size:inherit;color:var(--color-text);padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--border-radius-medium);justify-content:center;align-items:center;margin:0;text-decoration:none;transition:background-color .2s;display:inline-flex}button:hover{background:var(--button-bg-hover)}button:disabled{opacity:.5;cursor:not-allowed}button:disabled:hover{background:var(--button-bg)}.icon-btn{padding:var(--spacing-xs);width:24px}.icon-btn svg{display:block}.editor-wrapper{flex:1;padding:0;overflow:auto}.editor-wrapper .bn-container{height:100%}.markdown-editor{width:100%;padding:var(--spacing-lg);font-family:var(--font-family-mono);font-size:var(--font-size-base);line-height:var(--line-height-base);resize:none;background:var(--color-background-secondary);color:var(--color-text);border:none;outline:none;flex:1}.bn-editor{padding-inline:var(--spacing-lg)!important;padding-block:var(--spacing-lg)!important}.bn-container{background-color:var(--color-background)}.ProseMirror{background-color:var(--color-background);color:var(--color-text)}.html-preview{padding:var(--spacing-lg);background:var(--color-background);flex:1;overflow:auto}.html-preview h1:first-child{margin-top:0}.button-group{gap:var(--spacing-sm);display:flex}.editor-clickable{cursor:text;width:100%;height:100%}.button-large{padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-base)}.modal-body-flex{padding:0;display:flex;overflow:hidden}.responsive-image{max-width:100%;height:auto}.pane-container{flex-direction:column;height:calc(100% - 48px);display:flex}.pane-third{justify-content:center;align-items:center;gap:var(--spacing-sm);flex:1;display:flex}.pane-third:not(:last-child){border-bottom:1px solid var(--color-border)}@media (width<=768px){.pane-third:not(:last-child){border-bottom:none;border-right:1px solid var(--color-border)}.pane-container{flex-direction:row}}.popup-backdrop{z-index:999;background:#00000080;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.popup{background:var(--color-background);z-index:1000;border:1px solid var(--color-border);width:72ch;max-width:calc(100vw - 32px);height:90vh;max-height:calc(100vh - 32px);font-size:clamp(14px, 2.5vw, var(--popup-font-size-max));border-radius:0;flex-direction:column;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 24px #00000026}.popup .modal-content{flex-direction:column;height:100%;max-height:calc(100vh - 32px);display:flex}.popup .modal-body{flex:1;overflow:auto}.popup .modal-body.html-preview{padding:var(--spacing-lg)}.html-preview{background-color:var(--background-body,var(--color-background));color:var(--text-main,var(--color-text))}.html-preview pre{background:var(--color-background-secondary)!important;padding:var(--spacing-md)!important;font-family:var(--font-family-mono)!important;border-radius:0!important}.html-preview pre code{font-family:var(--font-family-mono)!important;background:0 0!important;padding:0!important}.html-preview code{background:var(--color-background-secondary)!important;font-family:var(--font-family-mono)!important;border-radius:0!important}.html-preview h1,.html-preview h2,.html-preview h3,.html-preview h4,.html-preview h5,.html-preview h6,.html-preview a{color:var(--color-text)}@media (prefers-color-scheme:dark){.html-preview{--background-body:#1a1a1a!important;--background:#2a2a2a!important;--background-alt:#252525!important;--selection:#4a4a4a!important;--text-main:#e0e0e0!important;--text-bright:#fff!important;--text-muted:#a0a0a0!important;--links:#4da6ff!important;--focus:#4da6ffab!important;--border:#404040!important;--code:#e0e0e0!important;--button-base:#3a3a3a!important;--button-hover:#4a4a4a!important;--scrollbar-thumb:#505050!important;--scrollbar-thumb-hover:#4a4a4a!important;--form-placeholder:#6a6a6a!important;--form-text:#e0e0e0!important;--variable:#5fc962!important;--highlight:#665200!important}}@media (width<=768px){.popup{width:90vw;max-width:72ch}.modal-body-flex .markdown-editor{font-size:16px}}.mermaid-diagram{margin:var(--spacing-lg) 0;width:100%;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:block;overflow-x:auto}.mermaid-diagram svg{max-width:100%;height:auto;display:block}.mermaid-error{margin:var(--spacing-lg) 0;padding:var(--spacing-lg);background:var(--color-warning-bg);border:1px solid var(--color-warning-border);border-radius:var(--border-radius-lg);color:var(--color-warning-text)}.mermaid-error .error-header{font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-sm);font-size:var(--font-size-base)}.mermaid-error .error-message{font-size:var(--font-size-md);margin-bottom:var(--spacing-md);color:var(--color-error-text)}.mermaid-error details{margin-top:var(--spacing-sm)}.mermaid-error summary{cursor:pointer;font-size:var(--font-size-sm);color:var(--color-warning-text);-webkit-user-select:none;user-select:none}.mermaid-error summary:hover{text-decoration:underline}.mermaid-error pre{margin-top:var(--spacing-sm);padding:var(--spacing-sm);background:var(--color-background);border:1px solid var(--color-border-dark);border-radius:var(--border-radius);font-size:var(--font-size-xs);overflow-x:auto}#paste-pane{flex:1}#markdown-pane,#html-pane{flex:2}@media (width<=768px){.editor-container{flex-direction:column}.editor-pane{border-right:none;border-bottom:1px solid var(--color-border)}.editor-pane:last-child{border-bottom:none}#paste-pane{flex:1}#markdown-pane,#html-pane{flex:2}}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}@media (prefers-color-scheme:dark){body{background-color:#1a1a1a}}#root{width:100vw;height:100vh}
