*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{height:100%}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#1e293b}::-webkit-scrollbar-thumb{background:#475569;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#64748b}::selection{background-color:#3b82f64d}._hintButton_19giz_1{display:flex;align-items:center;gap:6px;padding:6px 10px;background-color:#334155;color:#e2e8f0;border:none;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;transition:background-color .2s,transform .1s}._hintButton_19giz_1:hover{background-color:#475569;transform:translateY(-1px)}._icon_19giz_21{width:18px;height:18px;color:#fbbf24}._buttonText_19giz_27{white-space:nowrap}._overlay_19giz_32{position:fixed;inset:0;background-color:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;animation:_fadeIn_19giz_1 .2s ease-out}@keyframes _fadeIn_19giz_1{0%{opacity:0}to{opacity:1}}._modal_19giz_56{background-color:#1e293b;border:1px solid #334155;border-radius:12px;box-shadow:0 20px 60px #00000080;width:90%;max-width:600px;max-height:80vh;display:flex;flex-direction:column;animation:_slideIn_19giz_1 .2s ease-out}@keyframes _slideIn_19giz_1{0%{opacity:0;transform:scale(.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}._modalHeader_19giz_81{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #334155;flex-shrink:0}._modalTitle_19giz_90{display:flex;align-items:center;gap:10px;margin:0;font-size:18px;font-weight:600;color:#f1f5f9}._titleIcon_19giz_100{width:24px;height:24px;color:#fbbf24}._closeButton_19giz_106{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background-color:transparent;border:none;border-radius:6px;cursor:pointer;color:#94a3b8;transition:background-color .2s,color .2s}._closeButton_19giz_106:hover{background-color:#334155;color:#f1f5f9}._closeButton_19giz_106 svg{width:20px;height:20px}._modalContent_19giz_131{padding:20px;overflow-y:auto;flex:1}._h2_19giz_137{margin:0 0 16px;font-size:20px;font-weight:600;color:#f1f5f9;border-bottom:2px solid #3b82f6;padding-bottom:10px}._h3_19giz_146{margin:20px 0 10px;font-size:16px;font-weight:600;color:#60a5fa}._p_19giz_153{margin:6px 0;font-size:14px;color:#cbd5e1;line-height:1.6}._numbered_19giz_160{margin:8px 0;font-size:14px;color:#cbd5e1;line-height:1.7;border-left:3px solid #334155;background-color:#3341554d;padding:8px 12px;border-radius:0 6px 6px 0}._li_19giz_172{font-size:14px;color:#cbd5e1;line-height:1.6;list-style:disc;margin:6px 0 6px 24px}._modalContent_19giz_131::-webkit-scrollbar{width:8px}._modalContent_19giz_131::-webkit-scrollbar-track{background:#1e293b;border-radius:4px}._modalContent_19giz_131::-webkit-scrollbar-thumb{background:#475569;border-radius:4px}._modalContent_19giz_131::-webkit-scrollbar-thumb:hover{background:#64748b}._header_2kt6q_1{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background-color:#1e293b;border-bottom:1px solid #334155;height:48px;flex-shrink:0}._leftSection_2kt6q_12{display:flex;align-items:center;min-width:120px}._centerSection_2kt6q_18{flex:1;display:flex;justify-content:center}._rightSection_2kt6q_24{display:flex;align-items:center;gap:12px;min-width:120px}._githubLink_2kt6q_31{display:flex;align-items:center;gap:6px;color:#e2e8f0;text-decoration:none;padding:6px 10px;border-radius:6px;background-color:#334155;transition:background-color .2s,transform .2s}._githubLink_2kt6q_31:hover{background-color:#475569;transform:translateY(-1px)}._githubIcon_2kt6q_48{width:20px;height:20px}._starIcon_2kt6q_53{width:14px;height:14px;color:#fbbf24}._starCount_2kt6q_59{font-size:14px;font-weight:500;color:#e2e8f0}._titleLink_2kt6q_65{text-decoration:none;color:inherit}._titleLink_2kt6q_65:hover ._title_2kt6q_65{color:#60a5fa}._title_2kt6q_65{margin:0;font-size:18px;font-weight:600;color:#f1f5f9;transition:color .2s}._container_q0hi5_1{padding:8px 16px;background-color:#1e293b;border-bottom:1px solid #334155;flex-shrink:0}._inputRow_q0hi5_8{display:flex;align-items:center;gap:8px;flex-wrap:wrap}._label_q0hi5_15{color:#94a3b8;font-size:13px;font-weight:500;white-space:nowrap}._input_q0hi5_8{flex:1;min-width:200px;max-width:400px;padding:6px 10px;font-size:13px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;background-color:#0f172a;border:1px solid #334155;border-radius:4px;color:#e2e8f0;outline:none;transition:border-color .2s}._input_q0hi5_8:focus{border-color:#3b82f6}._inputError_q0hi5_41{border-color:#ef4444}._submitButton_q0hi5_45{padding:6px 14px;font-size:13px;font-weight:500;background-color:#3b82f6;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s}._submitButton_q0hi5_45:hover{background-color:#2563eb}._randomButton_q0hi5_61{padding:6px 14px;font-size:13px;font-weight:500;background-color:#059669;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s}._randomButton_q0hi5_61:hover{background-color:#047857}._errorMessage_q0hi5_77{margin-top:6px;padding:4px 8px;font-size:12px;color:#fca5a5;background-color:#ef44441a;border-radius:4px}._presetsRow_q0hi5_86{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}._presetsLabel_q0hi5_94{color:#94a3b8;font-size:13px;font-weight:500;white-space:nowrap}._presetButtons_q0hi5_101{display:flex;gap:6px;flex-wrap:wrap}._presetButton_q0hi5_101{padding:4px 10px;font-size:12px;background-color:#334155;color:#e2e8f0;border:1px solid #475569;border-radius:4px;cursor:pointer;transition:background-color .2s,border-color .2s}._presetButton_q0hi5_101:hover{background-color:#475569;border-color:#64748b}code[class*=language-],pre[class*=language-]{color:#ccc;background:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.comment,.token.block-comment,.token.prolog,.token.doctype,.token.cdata{color:#999}.token.punctuation{color:#ccc}.token.tag,.token.attr-name,.token.namespace,.token.deleted{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.number,.token.function{color:#f08d49}.token.property,.token.class-name,.token.constant,.token.symbol{color:#f8c555}.token.selector,.token.important,.token.atrule,.token.keyword,.token.builtin{color:#cc99cd}.token.string,.token.char,.token.attr-value,.token.regex,.token.variable{color:#7ec699}.token.operator,.token.entity,.token.url{color:#67cdcc}.token.important,.token.bold{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}._container_b7ar1_1{display:flex;flex-direction:column;background-color:#1e293b;border-radius:8px;overflow:hidden;height:100%}._header_b7ar1_10{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background-color:#0f172a;border-bottom:1px solid #334155}._title_b7ar1_19{font-size:13px;font-weight:600;color:#94a3b8}._languageTabs_b7ar1_25{display:flex;gap:4px}._languageTab_b7ar1_25{padding:4px 10px;font-size:12px;background-color:transparent;color:#94a3b8;border:1px solid #334155;border-radius:4px;cursor:pointer;transition:all .2s}._languageTab_b7ar1_25:hover{background-color:#334155;color:#e2e8f0}._activeTab_b7ar1_46{background-color:#3b82f6;color:#fff;border-color:#3b82f6}._activeTab_b7ar1_46:hover{background-color:#2563eb}._codeContainer_b7ar1_56{display:flex;flex:1;overflow:auto;font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace;font-size:12px;line-height:1.6}._lineNumbers_b7ar1_65{display:flex;flex-direction:column;padding:8px 0;background-color:#0f172a;border-right:1px solid #334155;-webkit-user-select:none;user-select:none;flex-shrink:0}._lineNumber_b7ar1_65{padding:0 12px;color:#475569;text-align:right;min-width:40px}._highlightedLineNumber_b7ar1_82{color:#fbbf24;font-weight:600}._codeContent_b7ar1_87{flex:1;padding:8px 0;overflow-x:auto}._codeLine_b7ar1_93{display:flex;align-items:center;padding:0 12px;min-height:19.2px;transition:background-color .2s}._highlightedLine_b7ar1_82{background-color:#3b82f633;border-left:3px solid #3b82f6;margin-left:-3px}._pre_b7ar1_107{margin:0;padding:0;background:transparent;white-space:pre}._pre_b7ar1_107 code{background:transparent;padding:0;font-size:inherit;font-family:inherit}._variableValue_b7ar1_121{margin-left:16px;padding:2px 8px;font-size:11px;color:#22c55e;background-color:#22c55e1a;border-radius:4px;white-space:nowrap}.token.comment,.token.prolog,.token.doctype,.token.cdata{color:#6b7280}.token.punctuation{color:#9ca3af}.token.property,.token.tag,.token.boolean,.token.number,.token.constant,.token.symbol,.token.deleted{color:#f472b6}.token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.inserted{color:#a5f3fc}.token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string{color:#fbbf24}.token.atrule,.token.attr-value,.token.keyword{color:#60a5fa}.token.function,.token.class-name{color:#34d399}.token.regex,.token.important,.token.variable{color:#fbbf24}._container_3cek3_1{position:relative;flex:1;background-color:#0f172a;border-radius:8px;overflow:hidden}._svg_3cek3_9{display:block;cursor:grab}._svg_3cek3_9:active{cursor:grabbing}._controls_3cek3_18{position:absolute;bottom:12px;right:12px;display:flex;align-items:center;gap:8px}._hint_3cek3_27{padding:4px 10px;font-size:11px;color:#64748b;background-color:#0f172acc;border-radius:4px}._container_122df_1{padding:12px 16px;background-color:#1e293b;border-top:1px solid #334155;flex-shrink:0}._controls_122df_8{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:12px}._controlButton_122df_16{display:flex;align-items:center;gap:4px;padding:8px 12px;background-color:#334155;color:#e2e8f0;border:none;border-radius:6px;cursor:pointer;transition:background-color .2s,transform .1s}._controlButton_122df_16:hover:not(:disabled){background-color:#475569}._controlButton_122df_16:active:not(:disabled){transform:scale(.95)}._controlButton_122df_16:disabled{opacity:.5;cursor:not-allowed}._playButton_122df_42{background-color:#3b82f6}._playButton_122df_42:hover{background-color:#2563eb}._icon_122df_50{width:20px;height:20px}._shortcut_122df_55{font-size:10px;color:#94a3b8;padding:2px 4px;background-color:#0003;border-radius:3px}._speedControl_122df_63{position:relative}._speedButton_122df_67{padding:8px 14px;font-size:13px;font-weight:500;background-color:#334155;color:#e2e8f0;border:none;border-radius:6px;cursor:pointer;transition:background-color .2s}._speedButton_122df_67:hover{background-color:#475569}._speedMenu_122df_83{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:8px;padding:4px;background-color:#1e293b;border:1px solid #334155;border-radius:6px;box-shadow:0 4px 12px #0000004d;z-index:10}._speedOption_122df_97{display:block;width:100%;padding:6px 16px;font-size:13px;background-color:transparent;color:#e2e8f0;border:none;border-radius:4px;cursor:pointer;text-align:center;transition:background-color .2s}._speedOption_122df_97:hover{background-color:#334155}._activeSpeed_122df_115{background-color:#3b82f6;color:#fff}._activeSpeed_122df_115:hover{background-color:#2563eb}._stepInfo_122df_124{margin-left:16px;font-size:13px;color:#94a3b8;white-space:nowrap}._progressBar_122df_131{position:relative;height:8px;background-color:#334155;border-radius:4px;cursor:pointer;overflow:visible}._progressFill_122df_140{height:100%;background-color:#22c55e;border-radius:4px;transition:width .1s ease-out}._progressHandle_122df_147{position:absolute;top:50%;width:16px;height:16px;background-color:#22c55e;border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 2px 4px #0000004d;transition:transform .1s,box-shadow .1s}._progressBar_122df_131:hover ._progressHandle_122df_147{transform:translate(-50%,-50%) scale(1.2);box-shadow:0 2px 8px #0006}._container_4d1u2_1{position:fixed;bottom:24px;right:24px;z-index:1000}._floatingBall_4d1u2_8{display:flex;flex-direction:column;align-items:center;justify-content:center;width:60px;height:60px;background:linear-gradient(135deg,#22c55e,#16a34a);border-radius:50%;cursor:pointer;box-shadow:0 4px 12px #22c55e66;transition:transform .2s,box-shadow .2s}._floatingBall_4d1u2_8:hover{transform:scale(1.1);box-shadow:0 6px 20px #22c55e80}._icon_4d1u2_27{width:24px;height:24px;color:#fff}._text_4d1u2_33{font-size:10px;color:#fff;font-weight:500;margin-top:2px}._popup_4d1u2_40{position:absolute;bottom:70px;right:0;animation:_fadeIn_4d1u2_1 .2s ease-out}@keyframes _fadeIn_4d1u2_1{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}._popupContent_4d1u2_58{background-color:#1e293b;border:1px solid #334155;border-radius:12px;padding:16px;box-shadow:0 8px 24px #0006}._qrCode_4d1u2_66{display:block;width:200px;height:auto;border-radius:8px}._hint_4d1u2_73{margin:12px 0 0;font-size:13px;color:#94a3b8;text-align:center;line-height:1.5}._hint_4d1u2_73 strong{color:#22c55e}._arrow_4d1u2_85{position:absolute;bottom:-8px;right:24px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid #1e293b}.app{display:flex;flex-direction:column;height:100vh;background-color:#0f172a;color:#e2e8f0;overflow:hidden}.main-content{display:flex;flex:1;gap:12px;padding:12px;overflow:hidden}.code-panel-container{width:494px;flex-shrink:0;display:flex;flex-direction:column}.canvas-container{flex:1;display:flex;flex-direction:column;min-width:0}