.sp-generator{--sp-blue:#3755a5;--sp-blue-dark:#263b78;--sp-soft:#f5f7ff;--sp-border:#dfe4f2;--sp-text:#26324a;max-width:1180px;margin:24px auto;color:var(--sp-text)}
.sp-generator *{box-sizing:border-box}.sp-intro{margin:0 0 20px}.sp-intro p{margin:0;line-height:1.65}.sp-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:22px;align-items:start}.sp-panel,.sp-workspace{background:#fff;border:1px solid var(--sp-border);border-radius:18px;box-shadow:0 8px 24px rgba(40,52,126,.08)}.sp-panel{padding:18px;position:sticky;top:18px}.sp-workspace{padding:18px;min-width:0}.sp-toolgroup+.sp-toolgroup{border-top:1px solid var(--sp-border);margin-top:18px;padding-top:18px}.sp-toolgroup h2{font-size:1rem;margin:0 0 12px;color:var(--sp-blue-dark)}.sp-template-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.sp-template{border:2px solid transparent;border-radius:10px;background:#fff;padding:5px;cursor:pointer;transition:.18s ease}.sp-template:hover,.sp-template:focus{border-color:#9eabe0}.sp-template.is-active{border-color:var(--sp-blue);box-shadow:0 0 0 2px rgba(55,85,165,.08)}.sp-template img{display:block;width:100%;aspect-ratio:1.414/1;object-fit:contain;background:#fafafa;border-radius:6px}.sp-row{display:grid;gap:8px}.sp-input,.sp-select{width:100%;border:1px solid #cdd5e7;border-radius:9px;padding:10px 11px;background:#fff;color:inherit}.sp-controls{display:grid;grid-template-columns:1fr;gap:10px;margin-top:11px}.sp-controls label{display:grid;gap:5px;font-size:.9rem}.sp-controls input[type=range]{width:100%}.sp-controls input[type=color]{width:100%;height:36px;padding:2px;border:1px solid #cdd5e7;border-radius:8px;background:#fff}.sp-sticker-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-bottom:12px}.sp-sticker{aspect-ratio:1;border:1px solid var(--sp-border);border-radius:9px;background:#fff;padding:5px;cursor:pointer}.sp-sticker:hover{border-color:var(--sp-blue)}.sp-sticker img{width:100%;height:100%;object-fit:contain}.sp-upload{display:flex;justify-content:center;align-items:center;min-height:42px;border:1px dashed #9eabe0;border-radius:10px;background:var(--sp-soft);cursor:pointer;font-weight:600}.sp-upload input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.sp-toolgroup small{display:block;margin-top:7px;line-height:1.4;color:#66728a}.sp-btn{appearance:none;border:1px solid #cfd6e7;border-radius:9px;background:#fff;color:var(--sp-text);padding:9px 12px;font-weight:700;cursor:pointer;transition:.15s ease}.sp-btn:hover{transform:translateY(-1px);border-color:#9ca9d8}.sp-btn-primary{border-color:var(--sp-blue);background:var(--sp-blue);color:#fff}.sp-btn-primary:hover{background:var(--sp-blue-dark)}.sp-actions{display:flex;flex-wrap:wrap;gap:8px}.sp-actions-small .sp-btn{font-size:.88rem;padding:8px 10px}.sp-topbar{display:flex;justify-content:flex-end;margin-bottom:12px}.sp-canvas-wrap{width:100%;overflow:hidden;border-radius:13px;border:1px solid #dce2ef;background:#eef1f8;padding:12px}.sp-canvas-wrap .canvas-container{max-width:100%!important;margin:0 auto}.sp-canvas-wrap canvas{max-width:100%;height:auto!important}.sp-help{font-size:.88rem;color:#68748d;margin:10px 0 14px;text-align:center}.sp-downloads{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.sp-message{min-height:1.4em;text-align:center;margin-top:10px;font-size:.9rem}.sp-message.is-error{color:#a22}.sp-message.is-ok{color:#267a3f}@media(max-width:900px){.sp-layout{grid-template-columns:1fr}.sp-panel{position:static}.sp-toolgroup h2{font-size:1.05rem}.sp-template-grid{grid-template-columns:repeat(4,1fr)}.sp-sticker-grid{grid-template-columns:repeat(7,1fr)}}@media(max-width:620px){.sp-generator{margin-top:14px}.sp-panel,.sp-workspace{padding:13px;border-radius:14px}.sp-template-grid{grid-template-columns:1fr 1fr}.sp-sticker-grid{grid-template-columns:repeat(5,1fr)}.sp-downloads .sp-btn{flex:1 1 100%}.sp-canvas-wrap{padding:6px}.sp-topbar{justify-content:flex-start}}