.editor-page{background:#f4f5fa}.editor-shell{max-width:1320px;margin:0 auto;padding:42px 28px 84px}.editor-title{margin-bottom:24px}.editor-title>a{color:#5b4bdb;font-size:.88rem;font-weight:800}.editor-title>p{margin:20px 0 4px;color:#5b4bdb;text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;font-weight:850}.editor-title h1{margin:0;font-size:clamp(2rem,4vw,3.3rem);letter-spacing:-.045em}.editor-stats{display:flex;gap:18px;align-items:center;margin-top:12px;color:#66637a;font-size:.88rem}.editor-stats button{border:0;background:transparent;color:inherit;padding:0;cursor:pointer}.editor-stats button.liked{color:#e6466b}.editor-workspace{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);gap:24px;align-items:start}.canvas-panel,.control-panel{background:#fff;border:1px solid #e5e4ee;border-radius:22px;box-shadow:0 18px 42px rgba(23,21,43,.08)}.canvas-panel{padding:26px}.canvas-stage{width:min(100%,680px);aspect-ratio:1;margin:auto;border-radius:16px;background-color:#fff;background-image:linear-gradient(45deg,#e9eaf0 25%,transparent 25%),linear-gradient(-45deg,#e9eaf0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e9eaf0 75%),linear-gradient(-45deg,transparent 75%,#e9eaf0 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0;display:grid;place-items:center;overflow:hidden}.canvas-stage canvas{display:block;width:100%;height:100%}.canvas-panel>p{text-align:center;color:#777488;font-size:.78rem;margin:16px 0 0}.control-panel{padding:4px 24px}.control-group{padding:22px 0;border-bottom:1px solid #ecebf2}.control-group:last-child{border:0}.control-group h2{font-size:1rem;margin:0 0 4px}.control-group>p{font-size:.82rem;color:#777488;margin:0 0 15px}.control-group label{display:grid;grid-template-columns:1fr auto;gap:7px;margin-top:14px;font-size:.84rem;font-weight:750}.control-group input[type=range]{grid-column:1/-1;width:100%;accent-color:#5b4bdb}.control-group output{color:#777488;font-weight:650}.swatches{display:flex;gap:10px;align-items:center}.swatches button,.custom-color{width:34px;height:34px;border-radius:50%;background:var(--swatch);border:3px solid #fff;box-shadow:0 0 0 1px #d8d6e3;cursor:pointer}.swatches button.active{box-shadow:0 0 0 3px #5b4bdb}.custom-color{overflow:hidden}.custom-color input{width:50px;height:50px;border:0;padding:0;margin:-8px;cursor:pointer}.shape-buttons,.export-buttons,.share-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.shape-buttons button,.export-buttons button,.share-buttons button{border:1px solid #dedce9;background:#fff;color:#37334f;border-radius:10px;padding:10px 12px;font-size:.82rem;font-weight:800;cursor:pointer}.shape-buttons button:hover,.export-buttons button:hover,.share-buttons button:hover{border-color:#5b4bdb;color:#5b4bdb}.export-buttons .primary-export{background:#5b4bdb;color:#fff;border-color:#5b4bdb}.status{min-height:20px!important;margin:10px 0 0!important;color:#16836f!important}.catalog-footer{margin-top:0}@media(max-width:900px){.editor-workspace{grid-template-columns:1fr}.control-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}.control-group:nth-child(odd){border-right:1px solid #ecebf2;padding-right:28px}}@media(max-width:620px){.editor-shell{padding:30px 14px 60px}.canvas-panel{padding:12px}.control-panel{display:block;padding:4px 18px}.control-group:nth-child(odd){border-right:0;padding-right:0}.editor-stats{flex-wrap:wrap}}
.editor-page{background:#eef1f7}.editor-shell{max-width:1420px;padding-top:36px}.editor-title{display:grid;grid-template-columns:1fr auto;align-items:end;padding:0 4px}.editor-title>a,.editor-title>p,.editor-title h1{grid-column:1}.editor-title>p{margin-top:18px}.editor-title .editor-stats{grid-column:2;grid-row:1/4;align-self:end;background:#fff;border:1px solid #e1e4ee;border-radius:999px;padding:10px 16px;box-shadow:0 6px 20px rgba(23,21,43,.05)}.editor-workspace{grid-template-columns:minmax(0,1.45fr) minmax(360px,.55fr);gap:28px}.canvas-panel,.control-panel{border-color:#dfe3ed;border-radius:18px;box-shadow:0 18px 50px rgba(31,35,59,.09)}.canvas-panel{padding:0 24px 22px;overflow:hidden}.canvas-toolbar{height:58px;margin:0 -24px 22px;padding:0 22px;border-bottom:1px solid #e6e8ef;display:flex;align-items:center;justify-content:space-between;color:#56546b;font-size:.8rem}.canvas-toolbar span{font-weight:850;color:#29263f}.canvas-toolbar b{font-weight:700;color:#167769;background:#e8f8f3;border-radius:999px;padding:6px 10px}.canvas-stage{width:min(100%,720px);border:1px solid #e1e3eb;box-shadow:inset 0 0 0 1px rgba(255,255,255,.65)}.control-panel{border-top:4px solid #5b4bdb}.control-group{padding:24px 0}.control-group h2{font-size:1.05rem}.palette-row{display:grid;grid-template-columns:62px 1fr;align-items:center;gap:10px;margin-top:16px}.palette-row>span{font-size:.82rem;font-weight:800;color:#4b485f}.swatches{gap:8px;flex-wrap:wrap}.swatches button,.custom-color{width:30px;height:30px}.swatches .original-swatch{width:auto;border-radius:8px;padding:0 9px;background:#f4f5f8;color:#605e70;font-size:.68rem;font-weight:800}.resolution-label{display:flex!important;align-items:center!important;grid-template-columns:none!important}.resolution-label select{min-width:0;flex:1;border:1px solid #d9dce7;border-radius:10px;background:#fff;padding:10px 12px;color:#343148;font-weight:700}.export-buttons button{min-height:42px}.export-buttons .primary-export{box-shadow:0 8px 18px rgba(91,75,219,.23)}
.editor-stats .editor-workspace-link{padding:8px 13px;border-radius:999px;background:#5b4bdb;color:#fff;font-weight:850;white-space:nowrap;box-shadow:0 6px 15px rgba(91,75,219,.22)}
.export-buttons .primary-export:hover,.export-buttons .primary-export:focus-visible{background:#493bc1;border-color:#493bc1;color:#fff}
@media(max-width:900px){.editor-title{display:block}.editor-title .editor-stats{display:inline-flex}.editor-workspace{grid-template-columns:1fr}.control-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}}@media(max-width:620px){.canvas-toolbar{height:auto;min-height:58px;align-items:flex-start;flex-direction:column;justify-content:center;gap:4px}.palette-row{grid-template-columns:1fr}.control-panel{display:block}}
