:root{--bg:#1b1d22;--bg-panel:#23262d;--bg-elevated:#2b2f38;--border:#383d48;--text:#e8eaed;--text-dim:#9aa0ab;--accent:#4f8cff;--accent-hover:#6ba0ff;--danger:#ff6b6b;--hole:#c9a35c;font-family:Hiragino Sans,Noto Sans JP,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{background:var(--bg);height:100%;color:var(--text);margin:0;overflow:hidden}button{cursor:pointer;border:1px solid var(--border);background:var(--bg-elevated);color:var(--text);border-radius:6px;padding:6px 10px;font-family:inherit;font-size:13px}button:hover{background:#343945}button:disabled{opacity:.45;cursor:default}input,select,textarea{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:5px 8px;font-family:inherit;font-size:13px}input:focus,textarea:focus{outline:1px solid var(--accent)}.app{height:100%;display:flex}.viewport-area{flex:1;min-width:0;position:relative}.chat-area{border-left:1px solid var(--border);background:var(--bg-panel);flex-direction:column;width:360px;display:flex}.viewport-canvas{position:absolute;inset:0}.viewport-canvas canvas{display:block}.selection-rect{border:1px solid var(--accent);pointer-events:none;z-index:5;background:#4f8cff26;position:absolute}.viewport-warning{color:#ffd479;z-index:10;background:#4a3a17;border:1px solid #8a6d2b;border-radius:8px;padding:8px 14px;font-size:13px;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.toolbar{z-index:5;flex-direction:column;gap:8px;display:flex;position:absolute;top:12px;left:12px}.toolbar-row{background:color-mix(in srgb, var(--bg-panel) 88%, transparent);border:1px solid var(--border);border-radius:10px;align-items:center;gap:6px;width:fit-content;padding:6px;display:flex}.toolbar .seg{gap:0;display:flex}.toolbar .seg button{border-radius:0}.toolbar .seg button:first-child{border-radius:6px 0 0 6px}.toolbar .seg button:last-child{border-radius:0 6px 6px 0}.toolbar button.active{background:var(--accent);border-color:var(--accent);color:#fff}.toolbar-sep{background:var(--border);align-self:stretch;width:1px;margin:0 2px}.inspector{background:color-mix(in srgb, var(--bg-panel) 92%, transparent);border:1px solid var(--border);z-index:5;border-radius:10px;flex-direction:column;gap:10px;width:220px;max-height:calc(100% - 24px);padding:12px;display:flex;position:absolute;top:12px;right:12px;overflow-y:auto}.inspector-title{font-size:13px;font-weight:600}.inspector-title code,.inspector-note{color:var(--text-dim);font-size:12px}.field-group{flex-direction:column;gap:4px;display:flex}.field-group-label{color:var(--text-dim);font-size:11px}.field{align-items:center;gap:8px;font-size:12px;display:flex}.field span{width:36px;color:var(--text-dim)}.field input[type=number]{flex:1;width:0}.field input[type=color]{border:1px solid var(--border);background:0 0;width:40px;height:24px;padding:0}.field.checkbox{gap:6px}.field.checkbox span{width:auto}.chat-panel{flex-direction:column;height:100%;min-height:0;display:flex}.chat-header{border-bottom:1px solid var(--border);align-items:center;gap:8px;padding:10px 12px;display:flex}.chat-title{font-size:13px;font-weight:600}.chat-model{flex:1;min-width:0;font-size:12px}.chat-messages{flex-direction:column;flex:1;gap:10px;padding:12px;display:flex;overflow-y:auto}.chat-empty{color:var(--text-dim);font-size:13px;line-height:1.6}.chat-suggestions{flex-direction:column;gap:6px;margin-top:10px;display:flex}.chat-suggestions button{text-align:left}.chat-bubble{border-radius:10px;max-width:100%;padding:8px 12px;font-size:13px;line-height:1.65}.chat-bubble.user{background:var(--accent);color:#fff;white-space:pre-wrap;align-self:flex-end}.chat-bubble.assistant{background:var(--bg-elevated);align-self:flex-start;width:100%}.chat-bubble.error{color:#ffb4b4;white-space:pre-wrap;background:#3c2226;border:1px solid #6e3540}.chat-text{white-space:pre-wrap}.chat-busy{color:var(--text-dim);font-size:12px}.chat-input-row{border-top:1px solid var(--border);gap:8px;padding:10px 12px;display:flex}.chat-input-row textarea{resize:none;flex:1;line-height:1.5}.chat-send{background:var(--accent);border-color:var(--accent);color:#fff;align-self:stretch;min-width:52px}.chat-send:hover{background:var(--accent-hover)}.tool-card{background:var(--bg);border:1px solid var(--border);border-radius:7px;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:6px;padding:5px 8px;font-size:12px;display:flex}.tool-card.error{border-color:#6e3540}.tool-card-status{color:var(--accent);font-weight:700}.tool-card.error .tool-card-status{color:var(--danger)}.tool-card-label{font-weight:600}.tool-card-args{color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.tool-card-error{color:var(--danger);flex-basis:100%}.dialog-overlay{z-index:100;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.dialog{background:var(--bg-panel);border:1px solid var(--border);border-radius:10px;width:420px;max-width:calc(100vw - 32px);padding:20px;box-shadow:0 12px 40px #00000080}.dialog-title{margin:0 0 16px;font-size:15px;font-weight:600}.dialog-label{color:var(--text-dim);margin-bottom:6px;font-size:12px;display:block}.dialog-input{width:100%;color:var(--text);background:var(--bg-elevated);border:1px solid var(--border);border-radius:6px;padding:8px 10px;font-family:inherit;font-size:13px}.dialog-input:focus{border-color:var(--accent);outline:none}.dialog-hint{color:var(--text-dim);margin:10px 0 0;font-size:11px;line-height:1.6}.dialog-hint a{color:var(--accent)}.dialog-actions{align-items:center;gap:8px;margin-top:20px;display:flex}.dialog-actions .primary{background:var(--accent);border-color:var(--accent);color:#fff}.dialog-actions .primary:hover{background:var(--accent-hover)}