:root{--bg: #0e0f13;--panel: #161820;--line: #262a36;--text: #e6e8ee;--muted: #8a90a2;--accent: #6c8cff;font-family:Inter,system-ui,sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box;margin:0;padding:0}html,body{margin:0;background:#0e0f13}body{height:100vh;overflow:hidden}button{font:inherit}.ide{display:flex;flex-direction:column;height:100vh}.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 14px;background:var(--panel);border-bottom:1px solid var(--line)}.brand{font-weight:700;letter-spacing:.02em}.top-actions{display:flex;gap:8px;align-items:center}.btn{background:transparent;color:var(--text);border:1px solid var(--line);border-radius:6px;padding:6px 12px;cursor:pointer;font-size:13px}.btn:hover{background:#ffffff0f}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.btn.primary:hover{filter:brightness(1.1)}.workspace{display:grid;grid-template-columns:230px 1fr 340px;flex:1;min-height:0}.tree,.side{background:var(--panel);border-right:1px solid var(--line);padding:10px;overflow:auto;min-height:0}.side{border-right:none;border-left:1px solid var(--line);display:flex;flex-direction:column}.tree-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.tree-title{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.tree-actions{display:flex;gap:2px}.node-row{display:flex;align-items:center;gap:2px;border-radius:4px;padding-right:2px}.node-row:hover{background:var(--line)}.node-row.active{background:var(--accent)}.node-row.active .node-name{color:#fff}.node-name{flex:1;min-width:0;text-align:left;background:transparent;color:var(--text);border:none;padding:5px 6px;font-size:13px;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.node-name.folder{color:var(--muted)}.node-actions{display:none;gap:2px}.node-row:hover .node-actions{display:flex}.mini{background:transparent;color:var(--muted);border:none;font-size:13px;padding:2px 6px;border-radius:4px;cursor:pointer}.mini:hover{color:var(--text);background:#ffffff14}.editor{display:flex;flex-direction:column;min-width:0;min-height:0}.tabs{display:flex;overflow-x:auto;background:var(--panel);border-bottom:1px solid var(--line)}.tab{display:flex;align-items:center;gap:4px;padding:0 6px 0 12px;font-size:13px;color:var(--muted);border-right:1px solid var(--line);white-space:nowrap}.tab-active{color:var(--text);background:var(--bg)}.tab-name{background:transparent;border:none;color:inherit;padding:8px 0;cursor:pointer}.tab-close{background:transparent;border:none;color:var(--muted);cursor:pointer;padding:2px 6px;border-radius:4px}.tab-close:hover{color:var(--text);background:#ffffff14}.editor-body{flex:1;min-height:0;display:flex}.monaco{flex:1;min-width:0;min-height:0}.preview-pane{flex:1;min-width:0;border-left:1px solid var(--line);display:flex;flex-direction:column}.preview-pane iframe{flex:1;border:none;background:#fff}.preview-bar{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;font-size:12px;color:var(--muted);border-bottom:1px solid var(--line)}.empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:14px;padding:20px;text-align:center}.output-body{font-family:Consolas,Menlo,monospace;font-size:13px;white-space:pre-wrap;color:#b8f0c4;flex:1;overflow:auto}.output-body .err{color:#ff9b9b}.search-input,.palette-input{width:100%;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:7px 10px;font-size:13px;margin-bottom:8px}.search-hit{display:block;width:100%;text-align:left;background:transparent;border:none;color:var(--text);padding:6px;border-radius:4px;cursor:pointer;font-size:12px}.search-hit:hover{background:var(--line)}.search-hit .where{color:var(--accent);display:block;font-size:12px}.search-hit .snip{color:var(--muted);font-family:Consolas,Menlo,monospace}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:flex-start;justify-content:center;padding-top:12vh;z-index:50}.modal{width:min(520px,92vw);background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px;max-height:70vh;overflow:auto}.palette-item{display:block;width:100%;text-align:left;background:transparent;border:none;color:var(--text);padding:8px 10px;border-radius:4px;cursor:pointer;font-size:13px}.palette-item:hover,.palette-item.sel{background:var(--accent);color:#fff}.setting-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:13px;border-bottom:1px solid var(--line)}.setting-row select,.setting-row input[type=number]{background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:4px;padding:4px 6px;width:110px}@media (max-width: 900px){.workspace{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.tree,.side{border:none;max-height:160px}.preview-pane{border-left:none;border-top:1px solid var(--line)}}.prompt-bar{position:relative;display:flex;align-items:center;gap:10px;margin:0;padding:10px 16px;background:var(--panel);border-top:1px solid var(--line);overflow:hidden}.prompt-glow{position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(108,140,255,.35),rgba(180,120,255,.35),transparent);background-size:200% 100%;animation:prompt-sweep 6s linear infinite;opacity:.6}.prompt-bar:focus-within .prompt-glow{opacity:1;animation-duration:2.5s}@keyframes prompt-sweep{0%{background-position:200% 0}to{background-position:-200% 0}}.prompt-caret{position:relative;font-size:20px;line-height:1;color:var(--accent);text-shadow:0 0 12px rgba(108,140,255,.8)}.prompt-input{position:relative;flex:1;min-width:0;background:#00000059;color:var(--text);border:1px solid var(--line);border-radius:8px;padding:9px 12px;font:14px Consolas,Menlo,monospace;outline:none;transition:border-color .2s,box-shadow .2s}.prompt-input::placeholder{color:var(--muted);opacity:.7}.prompt-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #6c8cff2e,0 0 24px #6c8cff40}.prompt-msg{position:relative;font-size:12px;color:var(--accent);white-space:nowrap}.prompt-kbd{position:relative;font:11px Consolas,Menlo,monospace;color:var(--muted);border:1px solid var(--line);border-bottom-width:2px;border-radius:4px;padding:2px 6px}@media (prefers-reduced-motion: reduce){.prompt-glow{animation:none}}.side-tabs{display:flex;gap:4px;padding:4px;margin-bottom:10px;background:#0000004d;border:1px solid var(--line);border-radius:8px}.side-tab{flex:1;background:transparent;border:none;color:var(--muted);font-size:12px;font-weight:600;padding:6px 4px;border-radius:6px;cursor:pointer;transition:color .2s,background .2s}.side-tab:hover{color:var(--text)}.side-tab.on{color:#fff;background:linear-gradient(135deg,#6c8cff59,#b478ff59);box-shadow:0 0 14px #6c8cff40}.claude-panel{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:10px}.claude-empty{color:var(--muted);font-size:13px;line-height:1.6;padding:14px 6px;text-align:center}.claude-thinking{display:flex;align-items:center;gap:10px;padding:14px;font-size:13px;color:var(--muted);border:1px dashed var(--line);border-radius:10px}.claude-bubble{position:relative;padding:12px 14px;border-radius:12px;background:linear-gradient(160deg,#6c8cff14,#b478ff0d);border:1px solid rgba(108,140,255,.28);box-shadow:0 0 24px #6c8cff1f;animation:reply-in .35s cubic-bezier(.2,.8,.2,1) both}.claude-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;font-weight:700;color:var(--accent)}.claude-meta .reply-close{margin-left:auto}.claude-avatar{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;background:linear-gradient(135deg,#6c8cff,#b478ff);color:#fff;font-size:11px;box-shadow:0 0 10px #6c8cff99}.claude-text{font-size:13px;line-height:1.65;color:var(--text);white-space:pre-wrap;word-wrap:break-word}.reply-close{background:transparent;border:none;color:var(--muted);font-size:18px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:4px}.reply-close:hover{color:var(--text);background:#ffffff14}.reply-dots{display:inline-flex;gap:3px}.reply-dots i{width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px #6c8cffe6;animation:reply-dot 1.2s ease-in-out infinite}.reply-dots i:nth-child(2){animation-delay:.15s}.reply-dots i:nth-child(3){animation-delay:.3s}@keyframes reply-dot{0%,80%,to{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}@keyframes reply-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.claude-bubble,.reply-dots i{animation:none}}