:root,[data-theme=light]{color-scheme:light;--bg-deep: #f4f6f9;--bg-panel: #ffffff;--bg-elevated: #eef1f6;--border: #d4dce8;--text: #1a2332;--text-muted: #5c6b80;--accent: #2b6cb0;--accent-dim: #4a90c9;--danger: #dc2626;--code-bg: #f0f3f8;--code-text: #243044;--preview-error-bg: rgba(220, 38, 38, .06);--preview-error-border: rgba(220, 38, 38, .35);--preview-error-text: #991b1b;--nav-width: 260px;--nav-collapsed: 52px;--radius: 10px;--font: "IBM Plex Sans", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace}[data-theme=dark]{color-scheme:dark;--bg-deep: #0c0f14;--bg-panel: #121820;--bg-elevated: #1a2230;--border: #2a3548;--text: #e6edf5;--text-muted: #8b9cb3;--accent: #5b9bd5;--accent-dim: #3d6a94;--danger: #f87171;--code-bg: #0a0e13;--code-text: #c9d7e8;--preview-error-bg: rgba(248, 113, 113, .08);--preview-error-border: rgba(248, 113, 113, .35);--preview-error-text: #fecaca}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}#root{min-height:100dvh}body{font-family:var(--font);background:var(--bg-deep);color:var(--text);line-height:1.5}button,input,textarea{font:inherit}.shell{height:100%;min-height:100dvh;display:grid;grid-template-columns:var(--nav-width) 1fr;transition:grid-template-columns .22s ease}.shell--nav-closed{grid-template-columns:var(--nav-collapsed) 1fr}.shell--nav-closed .nav-item{justify-content:center;padding:.65rem .35rem}.shell--nav-closed .nav-head{justify-content:center}.nav{display:flex;flex-direction:column;background:var(--bg-panel);border-right:1px solid var(--border);min-height:0;overflow:hidden}.nav-head{display:flex;align-items:center;gap:.5rem;padding:.75rem;border-bottom:1px solid var(--border)}.nav-toggle{flex-shrink:0;width:36px;height:36px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-elevated);color:var(--text);cursor:pointer;font-size:1.1rem;line-height:1}.nav-brand{display:flex;flex-direction:column;min-width:0}.nav-brand strong{font-size:.95rem}.nav-brand span{font-size:.75rem;color:var(--text-muted)}.nav-list{flex:1;padding:.5rem;display:flex;flex-direction:column;gap:.25rem;overflow-y:auto}.nav-item{display:flex;align-items:flex-start;gap:.65rem;padding:.6rem .65rem;border-radius:var(--radius);color:var(--text-muted);text-decoration:none;border:1px solid transparent;transition:background .15s,color .15s}.nav-item-icon{flex-shrink:0;width:1.25rem;text-align:center;color:var(--accent)}.nav-item-text{display:flex;flex-direction:column;min-width:0;font-size:.9rem;color:var(--text)}.nav-item-text small{font-size:.72rem;color:var(--text-muted);margin-top:.1rem}.nav-item:hover:not(.nav-item--disabled){background:var(--bg-elevated)}.nav-item--active{background:var(--bg-elevated);border-color:var(--accent-dim)}.nav-item--disabled{opacity:.45;cursor:not-allowed}.nav-foot{padding:.75rem;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:.5rem}.main{min-height:0;overflow:auto;background:var(--bg-deep)}.service-page{height:100%;display:flex;flex-direction:column;min-height:0}.service-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.25rem 1.5rem;border-bottom:1px solid var(--border);background:var(--bg-panel)}.service-header h1{margin:0 0 .25rem;font-size:1.25rem;font-weight:600}.service-header p{margin:0;color:var(--text-muted);font-size:.9rem}.service-meta{color:var(--text-muted);font-size:.85rem}.service-header-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.btn-secondary{padding:.5rem .85rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-elevated);color:var(--text);cursor:pointer;font-size:.85rem;white-space:nowrap}.btn-secondary:hover{border-color:var(--accent-dim)}.split{flex:1;display:flex;min-height:0;overflow:hidden}.split--horizontal{flex-direction:row}.split--vertical{flex-direction:column}.split-pane{min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}.split--horizontal .split-pane--left{width:var(--split-left, 50%);flex:0 0 auto}.split--horizontal .split-pane--right{flex:1 1 auto;min-width:0}.split--vertical .split-pane--left{height:var(--split-left, 50%);flex:0 0 auto}.split--vertical .split-pane--right{flex:1 1 auto;min-height:0}.split-pane .pane{flex:1;height:100%;border-right:none}.split-resizer{flex:0 0 6px;position:relative;z-index:2;background:var(--border);transition:background .15s;touch-action:none;-webkit-user-select:none;user-select:none}.split--horizontal .split-resizer{cursor:col-resize}.split--vertical .split-resizer{cursor:row-resize}.split-resizer:before{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px}.split-resizer:hover,.split-resizer:focus-visible,.split--dragging .split-resizer{background:var(--accent);outline:none}.split--dragging{cursor:inherit;-webkit-user-select:none;user-select:none}.split--dragging .code-input,.split--dragging .preview-surface{pointer-events:none}.pane{display:flex;flex-direction:column;min-height:0}.pane--preview{background:var(--bg-deep)}.pane-label{padding:.4rem 1rem;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);background:var(--bg-panel);border-bottom:1px solid var(--border)}.code-input{flex:1;width:100%;padding:1rem 1.25rem;border:none;resize:none;background:var(--code-bg);color:var(--code-text);font-family:var(--mono);font-size:.85rem;line-height:1.55}.code-input:focus{outline:none;box-shadow:inset 0 0 0 1px var(--accent-dim)}.preview-surface{flex:1;overflow:auto;padding:1.5rem;display:flex;align-items:center;justify-content:center;min-height:200px}.preview-empty{color:var(--text-muted);font-size:.95rem}.preview-error{align-self:stretch;margin:0;padding:1rem;background:var(--preview-error-bg);border:1px solid var(--preview-error-border);border-radius:var(--radius);color:var(--preview-error-text);font-family:var(--mono);font-size:.8rem;white-space:pre-wrap;word-break:break-word}.mermaid-output{width:100%;max-width:100%}.mermaid-output svg{max-width:100%;height:auto}.theme-toggle{display:inline-flex;padding:2px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-elevated);gap:2px}.theme-toggle--compact .theme-toggle-btn{padding:.35rem .55rem;font-size:.75rem}.theme-toggle-btn{border:none;border-radius:calc(var(--radius) - 2px);padding:.4rem .65rem;background:transparent;color:var(--text-muted);cursor:pointer;font-size:.8rem}.theme-toggle-btn:hover{color:var(--text)}.theme-toggle-btn--active{background:var(--bg-panel);color:var(--text);box-shadow:0 1px 2px #0000000f}[data-theme=dark] .theme-toggle-btn--active{box-shadow:0 1px 2px #00000040}.nav-foot .theme-toggle{width:100%}.nav-foot .theme-toggle-btn{flex:1}.preview-surface--markdown{align-items:flex-start;justify-content:flex-start}.markdown-preview{width:100%;max-width:52rem;margin:0 auto;line-height:1.65;font-size:.95rem;color:var(--text)}.markdown-preview :first-child{margin-top:0}.markdown-preview :last-child{margin-bottom:0}.markdown-preview h1,.markdown-preview h2,.markdown-preview h3,.markdown-preview h4{line-height:1.25;font-weight:600;margin:1.25em 0 .5em}.markdown-preview h1{font-size:1.65rem;border-bottom:1px solid var(--border);padding-bottom:.35em}.markdown-preview h2{font-size:1.35rem}.markdown-preview h3{font-size:1.12rem}.markdown-preview p,.markdown-preview ul,.markdown-preview ol,.markdown-preview blockquote,.markdown-preview pre{margin:.75em 0}.markdown-preview ul,.markdown-preview ol{padding-left:1.4em}.markdown-preview li+li{margin-top:.25em}.markdown-preview blockquote{margin-left:0;padding:.4em 0 .4em 1em;border-left:3px solid var(--accent-dim);color:var(--text-muted)}.markdown-preview code{font-family:var(--mono);font-size:.88em;padding:.12em .35em;border-radius:4px;background:var(--code-bg);color:var(--code-text)}.markdown-preview pre,.markdown-preview pre.hljs{padding:0;border-radius:var(--radius);overflow:auto;border:1px solid var(--border);background:var(--code-bg)}.markdown-preview pre code,.markdown-preview pre.hljs code{display:block;padding:1rem 1.1rem;background:transparent;font-size:.82rem;line-height:1.5;color:inherit}.markdown-preview table{width:100%;border-collapse:collapse;font-size:.9rem;margin:1em 0}.markdown-preview th,.markdown-preview td{border:1px solid var(--border);padding:.45em .65em;text-align:left}.markdown-preview th{background:var(--bg-elevated);font-weight:600}.markdown-preview a{color:var(--accent)}.markdown-preview a:hover{text-decoration:underline}.markdown-preview hr{border:none;border-top:1px solid var(--border);margin:1.5em 0}