:root{--bg:#f5f6f7;--card:#fff;--border:#e6e7ea;--text:#1f2328;--muted:#6b7280;--accent:#2b6cb0;--shadow:0 2px 10px rgba(0,0,0,.06);--radius:14px;--btn-radius:12px;--chat:#f1f3f5}
*{box-sizing:border-box}body{background:var(--bg);color:var(--text)}
.stt-app.centered{display:grid;grid-template-columns:320px minmax(860px,1fr);gap:22px;align-items:start;justify-content:center;padding:8px}
.stt-sidebar.neutral{background:#f7f7f8;border:1px solid var(--border);padding:18px;position:sticky;top:16px;height:calc(100vh - 32px);overflow:auto;border-radius:var(--radius)}
.stt-logo{font-weight:700;font-size:20px;margin-bottom:12px}.stt-sidebar nav{display:flex;flex-direction:column;gap:8px}
.stt-sidebar nav button{border:1px solid var(--border);background:#fff;padding:10px 12px;border-radius:10px;text-align:left;cursor:pointer;color:#111}
.stt-sidebar nav button.active{background:var(--accent);color:#fff;border-color:transparent}.stt-main{max-width:1200px;margin:0 auto}
.stt-tab{display:none}.stt-tab.active{display:block}.stt-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;margin-bottom:16px}
.stt-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}.stt-actions{display:flex;gap:8px;margin-left:auto;flex-wrap:wrap}
.btn{border:1px solid var(--border);background:#fff;border-radius:var(--btn-radius);padding:10px 14px;cursor:pointer}.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.stt-stage.canvas,.stt-stage.svg{border:1px dashed var(--border);background:#fff;border-radius:12px;padding:8px;margin-top:12px}.stt-stage.hscroll{overflow-x:auto;overflow-y:hidden}.centered-stage{display:flex;justify-content:center}
.stt-select summary{list-style:none;cursor:pointer;border:1px solid var(--border);background:#fff;padding:10px 12px;border-radius:10px}
.stt-select-list{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:8px;margin-top:8px;max-height:280px;overflow:auto;background:#fff;border:1px solid var(--border);border-radius:12px;padding:8px}
.stt-swatch{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:12px;padding:8px;cursor:pointer}.stt-swatch .chip{width:18px;height:18px;border-radius:4px;border:1px solid rgba(0,0,0,.15)}
.stt-toolbar{display:flex;gap:8px;align-items:center;padding:8px;background:#fafafa;border:1px solid var(--border);border-radius:10px;margin-top:8px}.stt-toolbar .spacer{flex:1}
.stt-label-editor{position:absolute;min-width:140px;padding:6px 8px;border:1px solid var(--border);background:#fff;border-radius:10px;box-shadow:var(--shadow);font-size:16px;color:#111}
.stt-chat-btn.left{position:fixed;left:20px;bottom:20px;width:54px;height:54px;border-radius:50%;border:1px solid var(--border);background:#fff;box-shadow:var(--shadow);cursor:pointer;font-weight:700}
.stt-chat.left{position:fixed;left:20px;bottom:86px;width:360px;max-height:60vh;background:var(--chat);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:14px;display:flex;flex-direction:column}
.stt-chat-head{padding:8px 10px;font-weight:700}.stt-chat-body{flex:1;padding:8px 10px;overflow:auto;display:flex;flex-direction:column;gap:8px}.stt-chat-input{display:flex;gap:8px;padding:8px;border-top:1px solid var(--border)}
.stt-welcome.left{position:fixed;left:84px;bottom:24px;background:#ffffff;border:1px solid var(--border);box-shadow:var(--shadow);border-radius:12px;padding:10px 12px;font-size:13px;color:#111}
@media (max-width:900px){.stt-app.centered{grid-template-columns:1fr}.stt-sidebar.neutral{position:relative;height:auto}.stt-chat.left{width:92vw;left:4vw}.stt-welcome.left{left:4vw;max-width:80vw}.stt-stage.hscroll{overflow-x:auto}}