:root{font-family:Arial,sans-serif;color:#203630;background:#f5f5ef;--green:#193f37;--orange:#e66d3e;--border:#dedfd6}*{box-sizing:border-box}body{margin:0}header{height:100px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:50px;padding:20px 34px;background:#fff}.brand{font-size:42px;font-weight:900;letter-spacing:-3px;color:var(--green);text-decoration:none;line-height:.8}.brand span{display:block;font-size:10px;letter-spacing:3px;margin-top:9px}.heading{font-size:12px;letter-spacing:2px;font-weight:bold}.heading small{font-size:13px;letter-spacing:0;font-weight:normal;display:block;margin-top:9px}.badge{margin-left:auto;background:#f0f1e9;border-radius:20px;padding:11px 17px;font-size:11px;letter-spacing:1px}main{display:grid;grid-template-columns:265px minmax(380px,1fr) 265px;max-width:1700px;margin:auto}.tools,.properties{padding:28px 23px;background:#fff}.tools{border-right:1px solid var(--border)}.properties{border-left:1px solid var(--border)}.eyebrow{font-size:10px;letter-spacing:2px;color:#78867c;margin-bottom:19px}h1{font-size:29px;letter-spacing:-1px;line-height:1.08;margin:0 0 14px}h2{font-size:14px;margin:22px 0 12px}h2 small{font-size:10px;display:inline;margin-left:6px;font-weight:normal}p{font-size:13px;line-height:1.6;color:#68766d}label{display:block;font-size:11px;font-weight:bold;margin:13px 0 8px;line-height:1.5}input:not([type=checkbox]):not([type=color]):not([type=range]),select{width:100%;border:1px solid var(--border);border-radius:5px;padding:9px;background:#fcfcf8;color:#203630;font:12px Arial;margin-top:5px}input[type=color]{display:block;width:100%;height:35px;border:1px solid var(--border);background:white;padding:3px;border-radius:5px}input[type=range]{width:100%}button,.upload{font:11px Arial;color:var(--green);background:#fff;border:1px solid var(--border);border-radius:5px;padding:11px 12px;cursor:pointer}button:hover,.upload:hover{background:#f0f2eb}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #d67d4e;outline-offset:2px}.tools>button,.properties>button{width:100%;margin-top:8px}.primary{background:var(--green)!important;color:white!important}.upload{display:block;text-align:center;background:#f5f7f0;font-weight:bold}.upload input{display:none}small{display:block;font-size:10px;color:#7a837c;line-height:1.6}.rule{height:1px;background:var(--border);margin:23px 0}.twocol{display:grid;grid-template-columns:1fr 1fr;gap:8px}.twocol label{margin:6px 0}.twocol button{padding:10px 6px}.workspace{padding:25px 28px;display:flex;flex-direction:column}.workbar{display:flex;justify-content:space-between;gap:8px}.workbar button{border:0;background:transparent}.tabs{background:#e6e9df;border-radius:6px;padding:4px}.tabs button{padding:8px 24px}.tabs .active{background:white;box-shadow:0 1px 5px #0001}.canvas-wrap{display:flex;align-items:center;justify-content:center;flex:1;padding:25px 10px;min-height:450px;background-image:radial-gradient(#d6dbd1 1px,transparent 1px);background-size:18px 18px;margin-top:22px;border-radius:12px}#canvas{width:min(100%,580px);height:auto;touch-action:none;border-radius:50%;box-shadow:0 18px 35px #14382a20;background:white;cursor:move}.guide-key{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;font-size:10px;color:#718274;padding-top:17px}.guide-key label{font-size:10px;margin:0}.notice{font-size:10px;text-align:center}.bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);padding:22px 0 0;margin-top:14px;gap:12px}.bottom b{font-size:12px}.bottom small{margin-top:6px}.bottom button{background:var(--green);color:white;white-space:nowrap}#layers{display:grid;gap:5px;margin-bottom:12px}#layers button{text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#layers .active{border-color:var(--green);background:#edf3e9}#inspector[hidden]{display:none}#resolution{font-size:11px}footer{display:flex;justify-content:space-between;padding:15px 25px;border-top:1px solid var(--border);font-size:11px;background:#fff;gap:15px}dialog{border:0;border-radius:15px;padding:24px;max-width:900px;width:90%;box-shadow:0 20px 100px #0004}dialog::backdrop{background:#14251dbb}.previews{display:flex;gap:20px}.previews figure{width:50%;margin:0;text-align:center}.previews canvas{width:100%;border-radius:50%}.previews figcaption{padding:15px;font-size:11px;letter-spacing:2px}#closePreview{float:right}button:disabled{opacity:.45;cursor:default}@media(max-width:1100px){main{grid-template-columns:220px minmax(300px,1fr)}.properties{grid-column:1/-1;display:block;border-top:1px solid var(--border)}#inspector{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.canvas-wrap{min-height:400px}.properties>button{width:auto;margin-right:8px}.badge{display:none}}@media(max-width:650px){header{height:82px;padding:18px;gap:25px}.heading small{font-size:10px}main{display:flex;flex-direction:column}.workspace{order:-1;padding:15px}.tools,.properties{padding:20px}.canvas-wrap{min-height:280px}#canvas{max-width:440px}.bottom{flex-wrap:wrap}#inspector{grid-template-columns:1fr 1fr}footer{flex-direction:column}.previews{gap:10px}}