:root{--bg-app:#080b12;--bg-editor:#0c101a;--bg-panel:#0a0e16;--bg-toolbar:#0e1320;--bg-status:#090c14;--bg-hover:#161e30;--bg-active:#1f2b44;--accent-coffee:#e59344;--accent-coffee-hover:#f3a65b;--accent-coffee-glow:rgba(229, 147, 68, 0.25);--accent-run:#2ea043;--accent-run-hover:#3fb950;--accent-stop:#da3633;--accent-stop-hover:#f85149;--accent-teal:#4ecdc4;--accent-blue:#58a6ff;--text-main:#dbe4f4;--text-bright:#ffffff;--text-muted:#7e8c9f;--text-dim:#4e5a6f;--border:#1a2336;--border-subtle:#121826;--border-focus:#3b5077;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", Menlo, Monaco, Consolas, monospace}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;min-height:100%;background-color:var(--bg-app);color:var(--text-main);font-family:var(--font-sans);overflow-x:hidden;overflow-y:auto;font-size:14px;line-height:1.5}#app{display:flex;flex-direction:column;width:100vw;height:100vh;box-sizing:border-box;overflow:hidden}#toolbar{height:48px;min-height:48px;background:var(--bg-toolbar);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 14px;gap:10px;z-index:10}#brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;letter-spacing:.04em;color:var(--text-bright);margin-right:12px;user-select:none}#brand-icon{display:inline-flex;align-items:center;filter:drop-shadow(0 0 6px var(--accent-coffee-glow))}#brand-icon svg{width:17px;height:24px;display:block}#brand-name{background:linear-gradient(135deg,#ffc288 0%,var(--accent-coffee) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}#version{font-size:11px;color:var(--text-muted);font-weight:500;letter-spacing:.02em;padding:1px 6px;background:rgba(255,255,255,4%);border-radius:4px;border:1px solid var(--border)}#badge-wasm-gc{font-size:10px;font-weight:600;padding:2px 7px;border-radius:12px;background:rgba(78,205,196,.12);color:var(--accent-teal);border:1px solid rgba(78,205,196,.3);letter-spacing:.05em;text-transform:uppercase}.toolbar-sep{width:1px;height:22px;background-color:var(--border);margin:0 2px}button,select{font-family:inherit;font-size:13px;border-radius:6px;border:1px solid var(--border);background:var(--bg-panel);color:var(--text-main);padding:6px 12px;cursor:pointer;outline:none;transition:all .15s ease;display:inline-flex;align-items:center;justify-content:center;gap:6px}button:hover:not(:disabled),select:hover:not(:disabled){background:var(--bg-hover);border-color:var(--border-focus);color:var(--text-bright)}button:active:not(:disabled){transform:translateY(1px)}button:disabled,select:disabled{opacity:.4;cursor:not-allowed}#run-btn{background:var(--accent-run);color:#fff;border-color:#2c8b3d;font-weight:600;padding:6px 16px;box-shadow:0 1px 3px rgba(0,0,0,.3)}#run-btn:hover:not(:disabled){background:var(--accent-run-hover);border-color:#38a548;box-shadow:0 0 10px rgba(46,160,67,.4)}#stop-btn{background:rgba(218,54,51,.15);color:#ff7b72;border-color:rgba(218,54,51,.3);font-weight:600}#stop-btn:hover:not(:disabled){background:var(--accent-stop);color:#fff;border-color:var(--accent-stop-hover);box-shadow:0 0 10px rgba(218,54,51,.4)}#examples-select{max-width:200px;color:var(--text-bright);font-weight:500}.toolbar-right{margin-left:auto;display:flex;align-items:center;gap:8px}.toolbar-link{text-decoration:none;font-size:12.5px;font-weight:500;border-radius:6px;border:1px solid var(--border);background:var(--bg-panel);color:var(--accent-coffee);padding:6px 12px;display:inline-flex;align-items:center;gap:5px;transition:all .15s ease}.toolbar-link:hover{background:var(--bg-hover);border-color:var(--accent-coffee);color:var(--accent-coffee-hover);box-shadow:0 0 8px var(--accent-coffee-glow)}#workspace{flex:1;display:flex;overflow:hidden;position:relative}#editor-col{flex:1;min-width:250px;display:flex;flex-direction:column;background:var(--bg-editor);overflow:hidden}#output-col{flex:1;min-width:250px;display:flex;flex-direction:column;background:var(--bg-panel);border-left:1px solid var(--border);overflow:hidden}#divider{width:6px;background:var(--border-subtle);cursor:col-resize;transition:background .15s ease;z-index:5}#divider:hover,#divider.resizing{background:var(--accent-coffee)}.col-header{height:34px;min-height:34px;background:var(--bg-toolbar);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 12px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);user-select:none}.col-header .tab{color:var(--text-bright)}.header-btn{font-size:11px;padding:2px 8px;background:0 0;border:1px solid transparent;color:var(--text-muted)}.header-btn:hover{background:var(--bg-hover);color:var(--text-bright);border-color:var(--border)}#editor-mount{flex:1;overflow:hidden;position:relative}.cm-editor{height:100%!important;font-family:var(--font-mono)!important;font-size:13.5px!important;background-color:var(--bg-editor)!important}.cm-scroller{line-height:1.6!important}.cm-error-line{background-color:rgba(248,81,73,.15)!important;border-left:3px solid var(--accent-stop)}#stage-container{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#05070c;padding:12px;border-bottom:1px solid var(--border);min-height:180px;position:relative}#stage-container.hidden{display:none}#game{background:#0a0d14;border:1px solid var(--border);border-radius:6px;box-shadow:0 4px 16px rgba(0,0,0,.4);max-width:100%;max-height:380px;image-rendering:pixelated}#stage-status{font-family:var(--font-mono);font-size:12px;color:var(--accent-teal);margin-top:8px;text-align:center;user-select:text}#stage-status:empty{display:none}#console-container{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--bg-panel)}#console-output{flex:1;padding:12px 14px;overflow-y:auto;font-family:var(--font-mono);font-size:13px;line-height:1.55;white-space:pre-wrap;word-break:break-all;user-select:text;color:var(--text-main)}.log-stdout{color:var(--text-main)}.log-system{color:var(--accent-teal);font-style:italic}.log-error{color:#ff7b72;font-weight:500}.log-warning{color:#f7e08a}.log-success{color:#7fe0a0;font-weight:600}.log-link{text-decoration:underline;cursor:pointer;color:var(--accent-coffee)}.log-link:hover{color:var(--accent-coffee-hover)}#statusbar{height:26px;min-height:26px;background:var(--bg-status);border-top:1px solid var(--border);display:flex;align-items:center;padding:0 12px;font-size:11px;color:var(--text-muted);gap:16px;user-select:none}.status-item{display:flex;align-items:center;gap:5px}.status-dot{width:7px;height:7px;border-radius:50%;background-color:var(--accent-run)}.status-dot.idle{background-color:var(--text-dim)}.status-dot.busy{background-color:var(--accent-coffee);animation:pulse 1s infinite alternate}.status-dot.error{background-color:var(--accent-stop)}@keyframes pulse{from{opacity:.4}to{opacity:1}}.status-right{margin-left:auto;display:flex;align-items:center;gap:14px}#about{box-sizing:border-box;max-width:820px;margin:0 auto;padding:60px 24px 100px;line-height:1.75}#about h1{font-size:26px;font-weight:700;color:var(--text-bright);letter-spacing:-.01em;margin:0 0 16px;line-height:1.35}#about h2{font-size:18px;font-weight:600;color:var(--accent-coffee);margin:44px 0 14px;letter-spacing:.02em}#about p{margin:0 0 16px;color:var(--text-main);font-size:14.5px}#about a{color:var(--accent-coffee);text-decoration:underline;text-underline-offset:3px;transition:color .15s ease}#about a:hover{color:var(--accent-coffee-hover)}#about code{font-family:var(--font-mono);font-size:13px;color:var(--accent-teal);background:rgba(78,205,196,8%);border:1px solid rgba(78,205,196,.2);padding:2px 6px;border-radius:4px}#about ul{margin:0 0 20px 24px}#about li{margin:8px 0;color:var(--text-main);font-size:14px}#about strong{color:var(--text-bright)}#about .faq-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:8px;padding:18px 20px;margin-bottom:16px}#about .faq-card h3{font-size:15px;color:var(--text-bright);margin-bottom:8px;font-weight:600}#about .faq-card p{margin:0;color:var(--text-muted);font-size:13.5px;line-height:1.6}#about .links{display:flex;gap:18px;flex-wrap:wrap;font-weight:600;margin:12px 0 24px}:focus-visible{outline:2px solid var(--accent-coffee);outline-offset:2px}#divider:focus-visible{background:var(--accent-coffee);outline-offset:-2px}noscript{display:block;padding:16px;background:#3a1d1d;color:#ffd9d9;text-align:center}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media(max-width:800px){#toolbar{flex-wrap:wrap;height:auto;row-gap:6px;padding:6px 10px}.toolbar-right{margin-left:0}.toolbar-sep{display:none}#workspace{flex-direction:column}#editor-col,#output-col{min-width:0;min-height:220px;width:auto!important;flex:1 1 50%}#output-col{border-left:none;border-top:1px solid var(--border)}#divider{display:none}#cursor-pos,#compile-time{display:none}}