
.bsign-wrap{max-width:100%;margin:0;padding:14px 2px 26px;color:#172033}
.bsign-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:24px;align-items:start}
.bsign-wrap p{line-height:1.75}
.bsign-wrap button,.bsign-wrap select,.bsign-wrap textarea{font:inherit;border:1px solid #cbd5e1;border-radius:9px;padding:11px 14px;box-sizing:border-box}
.bsign-wrap button{cursor:pointer;background:#fff;color:#172033;font-weight:600}
.bsign-wrap button:disabled{cursor:not-allowed;opacity:.45}
.bsign-wrap button:focus-visible,.bsign-wrap select:focus-visible,.bsign-wrap textarea:focus-visible{outline:3px solid rgba(255,101,0,.45);outline-offset:3px}
.bsign-wrap button.bsign-primary{background:#ff6500;color:#fff;border-color:#ff6500}
.bsign-wrap button.bsign-primary:hover{background:#e55600}
.bsign-panel{padding:22px;border:1px solid #e5e7eb;border-radius:14px;background:#fff}
.bsign-panel label{display:block;font-weight:600;margin:14px 0 8px}
.bsign-panel label:first-child{margin-top:0}
.bsign-panel textarea{width:100%;min-height:170px;resize:vertical}
.bsign-panel select{width:100%;background:#fff}
.bsign-preview{min-width:0}
.bsign-stage{border-radius:14px;overflow:hidden;min-height:180px;display:flex;justify-content:center;align-items:center;position:relative}
.bsign-stage canvas{display:block;width:100%;height:auto;max-width:100%;max-height:min(calc(100vh - 240px),820px);max-height:min(calc(100dvh - 240px),820px);object-fit:contain}
.bsign-stage:fullscreen{border-radius:0;width:100vw;height:100dvh}
.bsign-stage:fullscreen canvas{max-height:100dvh;max-width:100vw;width:100%;height:100%;object-fit:contain}
.bsign-empty{position:absolute;padding:20px;text-align:center;color:#94a3b8}
.bsign-exit{position:absolute;top:12px;right:12px;z-index:5}
.bsign-actions{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 10px}
.bsign-hint{color:#6b7280;font-size:14px;margin-top:8px;overflow-wrap:anywhere}
.bsign-error{color:#b91c1c;margin-top:12px;display:none}
.bsign-help{margin-top:30px;padding:24px;border-radius:14px;background:#f1f5f9}
.bsign-help h2{font-size:20px;font-weight:700;margin:0}
.bsign-help p{margin:10px 0}
.night .bsign-wrap{color:#d5dce6}
.night .bsign-panel{background:#23262a;border-color:#3a3d42}
.night .bsign-panel label{color:#e6e8eb}
.night .bsign-wrap button,.night .bsign-wrap select,.night .bsign-wrap textarea{background:#2a2d31;border-color:#3a3d42;color:#e6e8eb}
.night .bsign-wrap button.bsign-primary{background:#ff6500;border-color:#ff6500;color:#fff}
.night .bsign-wrap button.bsign-primary:hover{background:#ff7a1f}
.night .bsign-panel select{background:#2a2d31;color:#e6e8eb}
.night .bsign-hint{color:#9aa4b5}
.night .bsign-error{color:#f87171}
.night .bsign-help{background:#2a2d31}
.night .bsign-help h2{color:#eef2f7}
.night .bsign-help p{color:#a8b1c0}
.night .bsign-empty{color:#7c8698}
@media (max-width:720px){
    .bsign-layout{grid-template-columns:1fr}
    .bsign-wrap{padding:18px 0 22px}
    .bsign-stage canvas{max-height:min(calc(100vh - 260px),480px);max-height:min(calc(100dvh - 260px),480px)}
}
