.template-editor{
    display:none;
    grid-template-columns:minmax(280px,430px) minmax(230px,1fr);
    gap:16px;
    align-items:start;
    min-width:0;
    margin-top:14px;
    padding:16px;
    box-sizing:border-box;
    border:1px solid #d7e4fb;
    border-radius:16px;
    background:#f7fbff;
}
.template-editor.active{display:grid}
.template-editor-status{grid-column:1 / -1;margin:0;color:#35568c;font-size:13px;line-height:1.45}
.template-editor-stage{
    grid-column:1;
    display:grid;
    place-items:center;
    min-width:0;
    min-height:320px;
    max-height:440px;
    padding:16px;
    box-sizing:border-box;
    overflow:hidden;
    border:1px solid #cfe0fb;
    border-radius:13px;
    background:#e9f2ff;
}
.template-editor-stage canvas{
    display:block;
    width:auto;
    height:auto;
    max-width:100%;
    max-height:min(400px,52vh);
    border-radius:10px;
    background:#fff;
    box-shadow:0 10px 24px rgba(31,78,173,.18);
}
.template-editor-controls{grid-column:2;display:grid;gap:14px;min-width:0}
.template-editor-controls label{display:grid;gap:7px;min-width:0;color:#35568c;font-size:12px;font-weight:800}
.template-editor-controls input[type="range"]{width:100%;min-width:0;margin:0}
.template-editor-actions{grid-column:2;display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.template-editor-actions button{width:auto;max-width:100%;padding:9px 13px;border-radius:10px;font-size:13px}
.template-editor-notice{grid-column:2;padding:10px 12px;box-sizing:border-box;border-radius:10px;background:#fff7e6;color:#865b13;font-size:12px;line-height:1.45}
@media (max-width:760px){
    .template-editor{grid-template-columns:1fr;gap:14px;padding:12px}
    .template-editor-status,.template-editor-stage,.template-editor-controls,.template-editor-actions,.template-editor-notice{grid-column:1}
    .template-editor-stage{min-height:0;max-height:420px;padding:10px}
    .template-editor-stage canvas{max-height:min(390px,54vh)}
    .template-editor-controls{gap:12px}
    .template-editor-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
    .template-editor-actions button{width:100%;padding:10px 8px;font-size:12px}
}