html{height:100%}body{margin:0;font-family:IBM Plex Mono,ui-monospace,Menlo,Monaco,Consolas,Courier New,monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:100%;background-color:#1e1e1e;color:#abb2bf}::selection{background:#3a3f49;color:#fff}#root{height:100%}code{font-family:IBM Plex Mono,source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.verticallyCenter{display:flex;align-items:center}.horizontallyCenter{justify-content:center}.fillHeight{height:100%}html,body,#root,#App{width:100%}html,body,#root{height:100%}#App{--accent: #8b93a1;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#1e1e1e;color:#abb2bf}#AppNav{position:sticky;top:0;z-index:20;background:#1e1e1ed1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #2a2e35}.navInner{max-width:1280px;margin:0 auto;padding:18px 28px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{font-weight:600;font-size:20px;letter-spacing:-.01em;color:#fff;text-decoration:none;filter:drop-shadow(0 0 12px rgba(255,255,255,.18))}.navLinks{display:flex;align-items:center;gap:30px;font-size:14px}.navLinks a{color:#9aa1ad;text-decoration:none;transition:color .15s}.navLinks a:hover{color:#fff}.navLinks a.active{color:#fff;font-weight:600}.navLinks a.ghButton{display:flex;align-items:center;gap:8px;color:#cdd2da;border:1px solid #33373f;border-radius:8px;padding:8px 14px;transition:border-color .15s,color .15s}.navLinks a.ghButton:hover{border-color:#4d5564;color:#fff}.ghArrow{color:#6e7681}@media(max-width:768px){.navInner{flex-wrap:wrap;gap:14px}.navLinks{flex-wrap:wrap;gap:14px 18px;font-size:13px}}.page{width:100%;margin:0;box-sizing:border-box;padding:0 28px 20px;flex:1;min-height:0;display:flex;flex-direction:column}.toolbar{padding:16px 0;display:flex;flex-wrap:wrap;align-items:center;gap:16px;justify-content:space-between}.toolbarGroup{display:flex;align-items:center;gap:10px}.toolbarLabel{font-size:13px;color:#6e7681}.control{background:#181a1e;border:1px solid #2f333b;border-radius:9px;color:#cdd2da;font-family:inherit;font-size:13px;padding:9px 12px;cursor:pointer;max-width:560px;transition:border-color .15s,color .15s}.control:hover{border-color:#4d5564;color:#fff}.btn{font-family:inherit;cursor:pointer;border-radius:9px;display:flex;align-items:center;gap:8px}.btnGhost{background:#23262d;border:1px solid #383d47;font-size:13px;color:#9aa1ad;padding:10px 16px;transition:border-color .15s,color .15s}.btnGhost:hover{border-color:#4d5564;color:#fff}.btnPrimary{background:#e8e8ea;border:none;font-weight:600;font-size:13.5px;color:#1a1a1a;padding:10px 22px;transition:background .15s}.btnPrimary:hover{background:#fff}.btnArrow{font-size:12px}.panes{flex:1;min-height:0;display:flex;align-items:stretch}.leftCol{display:flex;flex-direction:column;flex:0 0 calc(var(--left-frac, .5) * 100%);min-width:0;min-height:0}.pane{display:flex;flex-direction:column;min-width:0;background:#181a1e;border:1px solid #33373f;border-radius:14px;overflow:hidden}.inputPane{flex:0 0 calc(var(--input-frac, .65) * 100%);min-height:0}.configPane,.outputPane{flex:1;min-height:0}.divider{position:relative;flex:0 0 16px;touch-action:none}.divider:before{content:"";position:absolute;background:transparent;border-radius:2px;transition:background .15s}.divider:hover:before,.divider:active:before{background:var(--accent)}.dividerVertical{cursor:col-resize}.dividerVertical:before{top:0;bottom:0;left:7px;width:2px}.dividerHorizontal{cursor:row-resize}.dividerHorizontal:before{left:0;right:0;top:7px;height:2px}.paneHeader{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #2a2e35;background:#1f2228;flex-shrink:0}.paneLabel{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#6e7681}.paneMeta{font-size:12px;color:#8b93a1}.paneBody{flex:1;min-height:0}.codeEditor{height:100%;width:100%;position:relative}.errorMessage{padding:18px 20px;color:#d19a66}.tip{margin-top:16px;font-size:12.5px;color:#5b626d}@media(max-width:860px){#App{overflow:auto}.page{overflow:visible}.panes{flex:none;flex-direction:column;gap:16px}.leftCol{flex:none;gap:16px}.inputPane{height:360px;flex:none}.configPane{height:220px;flex:none}.outputPane{height:420px;flex:none}.divider{display:none}}