
.visual-editor{max-width:1180px;margin:28px auto;padding:0 20px;display:grid;gap:16px}
.visual-editor[hidden]{display:none}
.visual-editor-head,.visual-editor-toolbar,.visual-editor-footer,.visual-editor-inputs,.visual-draw-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.visual-editor-head{align-items:flex-start}
.visual-editor-head h2{margin:4px 0 4px}
.visual-editor-head p{margin:0;color:#667085;max-width:760px}
.visual-editor-notice{margin-top:8px!important;padding:9px 11px;border:1px solid #d7e3f3;border-radius:10px;background:#f7fbff;color:#344054!important;font-size:13px;line-height:1.45}
.visual-editor-page-nav,.visual-editor-history,.visual-editor-tools,.visual-editor-stage-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.visual-editor button,.visual-editor select,.visual-editor input{font:inherit}
.visual-editor button{min-height:42px;border:1px solid #d0d9e6;border-radius:10px;background:#fff;color:#1d2939;padding:9px 13px;font-weight:800;cursor:pointer}
.visual-editor button:hover{border-color:#9db7da;background:#f8fbff}
.visual-editor button:focus-visible,.visual-editor input:focus-visible,.visual-editor select:focus-visible{outline:3px solid rgba(18,100,232,.2);outline-offset:2px}
.visual-editor button.danger{color:#b42318;border-color:#f4c7c3}
.visual-editor button[disabled]{opacity:.5;cursor:not-allowed}
.visual-editor-toolbar,.visual-editor-inputs,.visual-draw-panel,.visual-editor-footer{border:1px solid #e2e8f0;border-radius:14px;background:#fff;padding:12px 14px}
.visual-editor-tools button.active{background:#1264e8;color:#fff;border-color:#1264e8}
.visual-editor-inputs{justify-content:flex-start;flex-wrap:wrap}
.visual-editor-text-field{display:grid;gap:5px;min-width:min(420px,100%);flex:1}
.visual-editor-size-field{display:grid;gap:5px;min-width:90px}
.visual-editor-inputs label span{font-size:12px;font-weight:800;color:#475467}
.visual-editor-inputs input,.visual-editor-inputs select{min-height:42px;border:1px solid #cfd9e6;border-radius:9px;background:#fff;padding:8px 10px}
.visual-editor-status{min-height:22px;font-size:13px;color:#475467}
.visual-editor-status.error{color:#b42318}
.visual-editor-stage-shell{border:1px solid #dce5ef;border-radius:16px;background:#eef3f8;overflow:hidden}
.visual-editor-stage-toolbar{justify-content:center;padding:10px;border-bottom:1px solid #dce5ef;background:#fff}
.visual-editor-workspace{display:grid;grid-template-columns:132px minmax(0,1fr);min-width:0}
.visual-editor-thumbnails{display:flex;flex-direction:column;gap:9px;padding:10px;background:#f8fafc;border-right:1px solid #dce5ef;overflow:auto;max-height:76vh}
.visual-editor-thumbnail{display:grid!important;gap:5px;justify-items:center;width:100%;min-height:44px!important;padding:7px!important;background:#fff!important;border:2px solid transparent!important}
.visual-editor-thumbnail.active{border-color:#1264e8!important;background:#eef5ff!important}
.visual-editor-thumbnail canvas{display:block;max-width:100%;height:auto;background:#fff;box-shadow:0 1px 4px rgba(15,23,42,.16)}
.visual-editor-thumbnail span{font-size:12px;color:#475467;font-weight:800}
.visual-editor-scroll{overflow:auto;max-height:76vh;padding:18px;min-width:0}
.visual-editor-page{position:relative;margin:0 auto;background:#fff;box-shadow:0 8px 30px rgba(15,23,42,.14);touch-action:none}
.visual-editor-page canvas{display:block;width:100%;height:100%}
.visual-editor-overlay{position:absolute;inset:0;pointer-events:none}
.visual-editor.redact-mode .visual-editor-overlay{pointer-events:auto;cursor:crosshair}
.visual-editor-item{position:absolute;border:2px solid #1264e8;border-radius:6px;box-sizing:border-box;pointer-events:auto;cursor:move;background:rgba(255,255,255,.8);overflow:visible;touch-action:none}
.visual-editor-item:not(.selected){border-color:rgba(18,100,232,.42)}
.visual-editor-item.whiteout{background:#fff}
.visual-editor-item.redaction{background:rgba(15,23,42,.78);border-color:#111827}
.visual-editor-item.redaction:not(.selected){border-color:rgba(17,24,39,.72)}
.visual-editor-redaction-draft{position:absolute;box-sizing:border-box;border:2px dashed #b42318;background:rgba(180,35,24,.28);pointer-events:none}
.visual-editor-item.shape-rectangle{background:transparent;border:2px solid #0f172a}
.visual-editor-item.shape-line{background:transparent;border-color:transparent}
.visual-editor-item.shape-line.selected{border-color:rgba(18,100,232,.65)}
.visual-editor-line{position:absolute;inset:0;background:linear-gradient(to bottom right,transparent calc(50% - 1px),#0f172a 50%,transparent calc(50% + 1px));pointer-events:none}
.visual-editor-item.image-item{background:rgba(255,255,255,.08)}
.visual-editor-item img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none}
.visual-editor-item .visual-editor-item-text{width:100%;height:100%;display:flex;align-items:center;padding:3px 6px;box-sizing:border-box;overflow:hidden;white-space:pre-wrap;line-height:1.1;pointer-events:none;color:#0f172a}
.visual-editor-item.signature .visual-editor-item-text{font-style:italic;color:#073d8f}
.visual-editor-item .resize-handle{position:absolute;right:-8px;bottom:-8px;width:18px;height:18px;border:2px solid #fff;border-radius:50%;background:#1264e8;box-shadow:0 1px 5px rgba(0,0,0,.2);cursor:nwse-resize;touch-action:none}
.visual-editor-item:not(.selected) .resize-handle{display:none}
.visual-editor-footer{align-items:center}
.visual-editor-footer>span{font-size:13px;color:#475467}
#visualEditorCreate{background:#1264e8;color:#fff;border-color:#1264e8;min-width:150px}
.visual-draw-panel{display:grid;gap:10px}
.visual-draw-panel[hidden]{display:none}
#visualDrawCanvas{width:100%;height:180px;border:1px dashed #aab9ca;border-radius:10px;background:#fff;touch-action:none}
.visual-draw-head{flex-wrap:wrap}
.visual-draw-head>div{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:720px){
  .visual-editor{padding:0 12px}
  .visual-editor-head,.visual-editor-toolbar,.visual-editor-footer{align-items:stretch;flex-direction:column}
  .visual-editor-page-nav,.visual-editor-tools,.visual-editor-history{width:100%}
  .visual-editor-page-nav button,.visual-editor-tools button,.visual-editor-history button,.visual-editor-inputs button,.visual-editor-stage-toolbar button,.visual-draw-head button{min-height:44px;min-width:44px}
  .visual-editor-workspace{grid-template-columns:1fr}
  .visual-editor-thumbnails{flex-direction:row;max-height:none;overflow-x:auto;overflow-y:hidden;border-right:0;border-bottom:1px solid #dce5ef;padding:8px}
  .visual-editor-thumbnail{flex:0 0 88px;width:88px}
  .visual-editor-scroll{padding:10px;max-height:68vh}
  .visual-editor-inputs{display:grid;grid-template-columns:1fr 92px}
  .visual-editor-text-field{min-width:0}
  #visualEditorAddText{grid-column:1/-1}
  .visual-editor-item .resize-handle{right:-22px;bottom:-22px;width:44px;height:44px;border:0;background:transparent;box-shadow:none;display:grid;place-items:center}
  .visual-editor-item .resize-handle::after{content:"";width:18px;height:18px;border:2px solid #fff;border-radius:50%;background:#1264e8;box-shadow:0 1px 5px rgba(0,0,0,.2)}
  #visualEditorCreate{width:100%;min-height:48px}
}
