.casvg-wrapper{display:flex;gap:18px;padding:14px;box-sizing:border-box;font-family:system-ui,Segoe UI,Roboto,Arial;}
.casvg-left{width:360px;background:#fbfff7;padding:14px;border-radius:10px;border:1px solid #eee;overflow:auto;max-height:900px}
.casvg-right{flex:1;display:flex;align-items:flex-start}
.casvg-preview{background:white;border-radius:8px;padding:12px;border:1px solid #eee;width:100%;min-height:480px;display:flex;align-items:center;justify-content:center}
#casvg-svgwrap{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.casvg-left textarea{width:100%;min-height:90px;direction:rtl;padding:8px;border-radius:6px}
.casvg-left label{display:block;margin:6px 0;font-size:14px}
.casvg-left input[type=range],.casvg-left select,.casvg-left input[type=number]{width:100%;margin-top:6px;padding:6px;border-radius:6px}
.casvg-mode,.bg-btn{padding:8px 10px;border-radius:6px;border:1px solid #ccc;margin-right:6px;cursor:pointer;background:white}
.casvg-mode.active,.bg-btn.active{background:linear-gradient(90deg,#ffb84d,#7ddb5f);color:white;border-color:#66bb6a}
.actions{margin-top:12px;display:flex;gap:8px;flex-wrap:wrap}
.action{padding:8px 12px;border-radius:6px;background:#0b874b;color:white;border:none;cursor:pointer}
@media(max-width:900px){.casvg-wrapper{flex-direction:column}.casvg-left{width:100%;order:2}.casvg-right{order:1}}