/* Layout: barra superior con pestañas; contenido en columna de 1080px; la vista del cliente oculta la navegación y muestra el documento como hoja de papel. */
:root{
  --bg:#F3F6F4; --surface:#FFFFFF; --paper:#FFFEFB; --ink:#13201B; --muted:#5A6B63; --line:#D9E1DC;
  --accent:#0D8566; --accent-ink:#095E48; --accent-soft:#E2F2EC; --on-accent:#FFFFFF;
  --warn:#9A6206; --warn-soft:#FCF0D9; --bad:#B4322A; --bad-soft:#FBE5E2; --ok:#0D8566; --ok-soft:#E2F2EC;
  --pen:#1B2430;
  --f-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --f-body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --f-mono:"JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
  --r:10px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0E1412; --surface:#151E1B; --paper:#1A2420; --ink:#E6EEE9; --muted:#97A8A0; --line:#2A3833;
  --accent:#3CC49C; --accent-ink:#7ADBBE; --accent-soft:#16342B; --on-accent:#06261C;
  --warn:#E7B04F; --warn-soft:#3A2E14; --bad:#F08A80; --bad-soft:#3D1D1A; --ok:#3CC49C; --ok-soft:#16342B;
  --pen:#E6EEE9; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0E1412; --surface:#151E1B; --paper:#1A2420; --ink:#E6EEE9; --muted:#97A8A0; --line:#2A3833;
  --accent:#3CC49C; --accent-ink:#7ADBBE; --accent-soft:#16342B; --on-accent:#06261C;
  --warn:#E7B04F; --warn-soft:#3A2E14; --bad:#F08A80; --bad-soft:#3D1D1A; --ok:#3CC49C; --ok-soft:#16342B;
  --pen:#E6EEE9; color-scheme:dark}

*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.55}
h1,h2,h3{font-family:var(--f-display);font-weight:700;line-height:1.15;text-wrap:balance;margin:0}
h1{font-size:clamp(26px,4vw,34px)} h2{font-size:22px} h3{font-size:17px;font-weight:500}
p{margin:0}
.wrap{max-width:1080px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.mono{font-family:var(--f-mono);font-size:12.5px;word-break:break-all}
.muted{color:var(--muted)}
.label{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}

/* top bar */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--surface);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding-block:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand b{font-family:var(--f-display);font-size:20px;letter-spacing:-.01em}
.brand b span{color:var(--accent);font-weight:500;letter-spacing:.14em;font-size:13px;margin-left:4px;vertical-align:2px}
nav.tabs{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
nav.tabs a{padding:8px 14px;border-radius:999px;text-decoration:none;color:var(--muted);font-weight:500}
nav.tabs a:hover{color:var(--ink);background:var(--bg)}
nav.tabs a[aria-current="page"]{background:var(--accent-soft);color:var(--accent-ink)}

main{padding-block:28px 56px;display:grid;gap:24px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 14px var(--f-body);padding:10px 18px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;text-decoration:none;min-height:42px}
.btn:hover{border-color:var(--muted)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn.primary:hover{filter:brightness(1.06)}
.btn:disabled{opacity:.45;cursor:not-allowed;filter:none}
.btn.sm{min-height:34px;padding:6px 12px;font-size:13px}
.btn.ghost{border-color:transparent;background:transparent}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}

/* stats */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;display:grid;gap:4px}
.stat strong{font-family:var(--f-display);font-size:30px;font-variant-numeric:tabular-nums}
.stat .dot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:6px}

/* table */
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
table{border-collapse:collapse;width:100%;min-width:640px}
th,td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600;background:var(--bg)}
tr:last-child td{border-bottom:0}
td .sub{font-size:13px;color:var(--muted)}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:3px 10px;border-radius:999px}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.pill.PENDIENTE{background:var(--warn-soft);color:var(--warn)}
.pill.ABIERTO{background:var(--accent-soft);color:var(--accent-ink)}
.pill.FIRMADO{background:var(--ok-soft);color:var(--ok)}

.empty{display:grid;gap:18px;justify-items:start}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;width:100%}
.steps div{border-top:2px solid var(--accent);padding-top:10px}
.steps b{display:block;font-family:var(--f-display);font-weight:500}

/* forms */
form{display:grid;gap:16px}
.field{display:grid;gap:6px;min-width:0}
.field label{font-weight:600;font-size:14px}
input[type=text],input[type=email],textarea{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;width:100%}
textarea{min-height:220px;resize:vertical;font-size:14px}
input:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
.hint{font-size:13px;color:var(--muted)}

/* email card */
.mail{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--surface)}
.mail .h{display:grid;gap:4px;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--bg);font-size:14px}
.mail pre{margin:0;padding:18px;white-space:pre-wrap;word-break:break-word;font:14px/1.6 var(--f-body)}

/* paper */
.paper{background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:clamp(20px,5vw,48px);box-shadow:0 1px 0 var(--line),0 12px 30px -18px rgba(0,0,0,.25);max-width:760px;width:100%;margin:0 auto}
.paper h2{text-align:center;letter-spacing:.02em;margin-bottom:18px}
.paper .doc{font-size:15px}
.doc .dl{white-space:pre-wrap;min-height:1.55em}
.doc .dh{text-align:center;font-style:italic;font-size:16px;margin:18px 0 8px}
.doc .chk{display:flex;gap:10px;align-items:flex-start;margin:8px 0;white-space:normal}
.doc .cbx{width:22px;height:22px;accent-color:var(--accent);flex:none;margin-top:1px;cursor:pointer}
.doc .cbm{font-size:19px;line-height:1.2;flex:none}
.fillin{display:inline-block;width:min(280px,100%);border:0;border-bottom:2px solid var(--accent);background:var(--accent-soft);padding:3px 8px;font:inherit;color:var(--ink);border-radius:4px 4px 0 0;vertical-align:baseline}
.fillin:focus{outline:2px solid var(--accent);outline-offset:1px}
.filled{border-bottom:1px solid var(--ink);padding:0 6px;font-weight:600}
.blank.cl{background:var(--accent-soft);color:var(--accent-ink)}
.sigline{margin-top:28px;display:grid;gap:4px;max-width:320px}
.sigline .box{height:96px;border-bottom:1.5px solid var(--ink);display:flex;align-items:flex-end}
.sigline img{max-height:90px;max-width:100%}
.sigline .who{font-size:13px;color:var(--muted)}

/* signing */
.sign-head{display:grid;gap:6px;max-width:760px;margin:0 auto;width:100%}
.consent{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;max-width:760px;margin:0 auto;width:100%}
.consent input{width:20px;height:20px;margin-top:2px;accent-color:var(--accent);flex:none}
.pad-wrap{max-width:760px;margin:0 auto;width:100%;display:grid;gap:10px}
.pad{position:relative;background:var(--paper);border:1.5px dashed var(--muted);border-radius:var(--r);height:220px;touch-action:none}
.pad canvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair;border-radius:var(--r)}
.pad .baseline{position:absolute;left:8%;right:8%;bottom:56px;border-bottom:1px dashed var(--line);pointer-events:none}
.pad .ph{position:absolute;left:0;right:0;top:44%;text-align:center;color:var(--muted);pointer-events:none;font-size:15px}
.inks{display:flex;gap:10px;align-items:center}
.ink{width:30px;height:30px;border-radius:50%;border:3px solid var(--surface);outline:1.5px solid var(--line);cursor:pointer;padding:0}
.ink[aria-pressed="true"]{outline:2.5px solid var(--ink)}

/* fingerprint */
.fp{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center}
.fp canvas{width:132px;height:132px;max-width:100%}
.code{font-family:var(--f-mono);font-size:20px;font-weight:600;letter-spacing:.06em;color:var(--accent-ink)}
@media (max-width:520px){.fp{grid-template-columns:1fr;justify-items:start}}

/* certificate */
.cert{display:grid;gap:22px}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px 24px}
.kv div{display:grid;gap:2px;min-width:0}
.kv span:last-child{overflow-wrap:anywhere}
.trail{list-style:none;margin:0;padding:0;display:grid}
.trail li{display:grid;grid-template-columns:150px 1fr;gap:14px;padding:10px 0;border-top:1px solid var(--line)}
.trail li:first-child{border-top:0}
.trail time{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.trail .t{font-weight:600}
@media (max-width:560px){.trail li{grid-template-columns:1fr;gap:2px}}

.checks{display:grid;gap:10px}
.check{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:8px}
.check.ok{background:var(--ok-soft)} .check.bad{background:var(--bad-soft)} .check.na{background:var(--bg)}
.check i{font-style:normal;font-weight:700;width:22px;flex:none;text-align:center}
.check.ok i{color:var(--ok)} .check.bad i{color:var(--bad)}
.verdict{font-family:var(--f-display);font-size:22px}
.verdict.ok{color:var(--ok)} .verdict.bad{color:var(--bad)}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:999px;font-weight:600;font-size:14px;z-index:20}
footer{border-top:1px solid var(--line);padding-block:18px;font-size:12.5px;color:var(--muted)}
.notice{font-size:13px;color:var(--muted);max-width:760px;margin:0 auto;width:100%}

/* firma desde el celular */
.sflow{display:grid;gap:18px;max-width:760px;margin:0 auto;width:100%;padding-bottom:150px}
.sstep{display:grid;gap:18px}
.progress{display:flex;gap:6px}
.progress span{flex:1;text-align:center;padding:9px 6px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-weight:600;font-size:14px;color:var(--muted)}
.progress span.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.progress span.done{background:var(--accent-soft);border-color:transparent;color:var(--accent-ink)}
.actionbar{position:fixed;left:0;right:0;bottom:0;z-index:10;background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -10px 24px -18px rgba(0,0,0,.35);
  padding-top:10px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.actionbar .inner{max-width:760px;margin:0 auto;display:grid;gap:8px}
.actionbar .why{font-size:14px;color:var(--muted);text-align:center;min-height:1.4em}
.actionbar .btns{display:flex;gap:8px}
.btn.big{min-height:56px;font-size:17px;flex:1;border-radius:14px}
.btn.big.ghost{flex:0 0 auto;border-color:var(--line)}
.pad.big{height:min(46vh,340px);min-height:200px}
.pad.big .ph{font-size:18px}
.consent.big{padding:18px}
.consent.big input{width:28px;height:28px}
.miss{outline:2.5px solid var(--bad)!important;outline-offset:2px;border-radius:6px}
.fillin.miss{background:var(--bad-soft)}
input[type=text],input[type=email],textarea,select,.fillin{font-size:16px}
@media (max-width:600px){ .sflow .paper{padding:22px 16px;border-radius:10px} .sflow h1{font-size:26px} .doc .chk{font-size:15px} .fillin{width:100%;display:block;margin-top:4px} }

/* creador de documentos */
.editor{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
.editor .side{position:sticky;top:calc(env(safe-area-inset-top,0px) + 76px);display:grid;gap:10px;max-height:calc(100vh - 96px);overflow:auto}
@media (max-width:920px){.editor{grid-template-columns:1fr}.editor .side{position:static;max-height:none}}
.ed{display:grid;gap:18px}
.ed section{display:grid;gap:10px}
.ed h3{display:flex;justify-content:space-between;align-items:center;gap:8px}
textarea.sm{min-height:76px}
.clause{border:1px solid var(--line);border-radius:8px;padding:12px;display:grid;gap:8px;background:var(--bg)}
.clause .bar{display:flex;gap:4px;align-items:center}
.clause .n{font-family:var(--f-mono);font-size:12px;color:var(--muted);margin-right:auto}
.clause input,.clause textarea{background:var(--surface)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px dashed var(--muted);background:transparent;border-radius:999px;padding:5px 11px;font:500 13px var(--f-body);color:var(--ink);cursor:pointer}
.chip:hover{border-color:var(--accent);color:var(--accent-ink);border-style:solid}
.vars{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.bases{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.base{display:grid;gap:4px;padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);text-decoration:none;color:var(--ink);align-content:start}
.base:hover{border-color:var(--accent)}
.base b{font-family:var(--f-display);font-weight:500;font-size:16px}
.ai{border:1px solid var(--accent);background:var(--accent-soft);border-radius:var(--r);padding:14px;display:grid;gap:10px}
.paper.pv{padding:clamp(20px,4vw,36px);font-size:14px;max-width:none}
.paper.pv p{margin:0 0 10px}
.blank{background:var(--warn-soft);color:var(--warn);padding:0 4px;border-radius:3px;font-weight:600}
.warnbox{background:var(--warn-soft);color:var(--warn);border-radius:8px;padding:10px 12px;font-size:13px}
select{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;width:100%}
@media (prefers-reduced-motion:no-preference){.fade{animation:fd .3s ease both}@keyframes fd{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}}

/* constructor visual v2 */
.wrap:has(.builder-shell){max-width:1540px}.builder-shell{display:grid;gap:0;margin-top:-28px;min-height:calc(100vh - 75px);background:var(--bg)}
.builder-head{position:sticky;top:61px;z-index:4;display:grid;grid-template-columns:minmax(230px,1fr) auto minmax(340px,1fr);align-items:center;gap:18px;padding:14px 18px;background:var(--surface);border:1px solid var(--line);border-top:0}.builder-head>div:first-child{display:flex;align-items:center;gap:18px}.builder-head h1{font-size:26px}.builder-head .back{color:var(--muted);text-decoration:none;white-space:nowrap}.builder-actions{display:flex;justify-content:flex-end;gap:8px}.save-state{font-size:13px;color:var(--ok);text-align:center}.save-state::before{content:"✓";display:inline-grid;place-items:center;width:18px;height:18px;margin-right:6px;border:1px solid currentColor;border-radius:50%}.save-state.dirty{color:var(--warn)}.save-state.dirty::before{content:"•"}
.builder-setup{display:flex;align-items:center;gap:8px;padding:10px 18px;background:var(--surface);border:1px solid var(--line);border-top:0}.builder-setup select{width:min(250px,28vw);padding:7px 10px}.setup-note{margin-left:auto;color:var(--muted);font-size:13px}.builder-ai{margin:12px 18px 0;grid-template-columns:1fr auto;align-items:center}.builder-ai .hint{grid-column:1/-1}
.import-result{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin:12px 18px 0;padding:13px 15px;border:1px solid var(--ok);border-radius:10px;background:var(--ok-soft)}.import-result-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ok);color:white;font-weight:800}.import-result p{margin:2px 0;color:var(--ink);font-size:13px}.import-result span{color:var(--muted);font-size:12px}
.builder-grid{display:grid;grid-template-columns:250px minmax(500px,1fr) 280px;min-height:720px;border-inline:1px solid var(--line)}.block-library,.block-inspector{background:var(--surface);padding:20px 16px}.block-library{border-right:1px solid var(--line)}.block-inspector{border-left:1px solid var(--line)}.block-library h2,.block-inspector h2{font:700 11px var(--f-body);letter-spacing:.09em;color:var(--muted);margin:0 0 10px}.block-library>p{font-size:12px;color:var(--muted);margin:-5px 0 12px}.block-library h2:not(:first-child){margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.block-tools,.common-list{display:grid;gap:7px}.block-tool,.common-list button{display:grid;grid-template-columns:24px 1fr 16px;align-items:center;gap:10px;width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);text-align:left;cursor:grab;font:inherit}.block-tool:hover,.common-list button:hover{border-color:var(--accent);background:var(--accent-soft)}.block-tool svg,.common-list svg,.inspect-type svg,.block-actions svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.block-tool span{display:grid}.block-tool b{font-size:13px}.block-tool small{font-size:11px;color:var(--muted)}.block-tool i,.common-list i{font-style:normal;color:var(--muted)}.common-list button{grid-template-columns:20px 1fr 14px;font-size:12px;padding:8px 10px}
.document-stage{padding:22px clamp(16px,3vw,44px);background:#eaf0ed;min-width:0}.doc-toolbar{display:flex;align-items:flex-end;gap:12px;justify-content:space-between;max-width:800px;margin:0 auto 10px}.doc-toolbar label{font-size:11px;color:var(--muted);width:min(520px,80%)}.doc-toolbar input{display:block;margin-top:4px;width:100%;font:700 18px var(--f-display);background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:4px 0;color:var(--ink)}.doc-toolbar span{font-size:12px;color:var(--muted);white-space:nowrap}
.builder-paper{max-width:800px;min-height:830px;margin:0 auto;background:var(--paper);border:1px solid var(--line);box-shadow:0 16px 40px -26px rgba(11,35,27,.35);padding:clamp(28px,4vw,54px);color:var(--ink)}.canvas-intro textarea,.canvas-closing textarea{width:100%;border:1px solid transparent;background:transparent;resize:vertical;line-height:1.6;padding:10px;min-height:90px}.canvas-intro textarea:hover,.canvas-closing textarea:hover{border-color:var(--line)}
.canvas-block{position:relative;display:grid;grid-template-columns:24px 1fr auto;gap:8px;padding:12px 10px;margin:0;border:1.5px solid transparent;border-radius:7px;transition:border-color .15s,background .15s}.canvas-block:hover{border-color:var(--line)}.canvas-block.selected{border-color:var(--accent);background:color-mix(in srgb,var(--accent-soft) 45%,transparent)}.canvas-block.dragging{opacity:.35}.drag-handle{align-self:start;border:0;background:transparent;color:var(--muted);cursor:grab;font-size:18px;padding:3px}.block-edit{display:grid;gap:4px}.block-edit input,.block-edit textarea{border:0;border-bottom:1px solid transparent;background:transparent;padding:3px 5px;border-radius:0;width:100%;resize:vertical;color:var(--ink)}.block-edit input{font-weight:700}.block-edit textarea{line-height:1.55;min-height:54px}.block-edit input:focus,.block-edit textarea:focus{outline:0;border-bottom-color:var(--accent);background:var(--surface)}.block-actions{display:flex;gap:3px;opacity:0;transition:opacity .15s}.canvas-block:hover .block-actions,.canvas-block.selected .block-actions{opacity:1}.block-actions button{width:30px;height:30px;border:1px solid var(--line);background:var(--surface);border-radius:6px;color:var(--muted);cursor:pointer}.block-actions button:hover{color:var(--bad);border-color:currentColor}.block-actions svg{width:15px}
.block-drop{height:10px;position:relative;margin-block:1px}.block-drop::after{content:"";position:absolute;inset:4px 0 auto;height:2px;background:transparent}.block-drop span{display:none;position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);padding:4px 10px;background:var(--surface);border:1px solid var(--accent);border-radius:7px;color:var(--accent-ink);font-size:11px;white-space:nowrap}.block-drop.drag-over{height:38px}.block-drop.drag-over::after{background:var(--accent)}.block-drop.drag-over span{display:block}.canvas-add{width:100%;margin-top:12px;padding:13px;border:1px dashed var(--muted);border-radius:7px;background:transparent;color:var(--muted);cursor:pointer}.canvas-add:hover{border-color:var(--accent);color:var(--accent-ink);background:var(--accent-soft)}.canvas-closing{margin-top:22px}.signature-placeholder{margin-top:28px;width:260px;padding-top:8px;border-top:1px solid var(--muted);font-size:12px;color:var(--muted)}
.block-inspector{display:grid;align-content:start;gap:12px}.inspect-type{display:flex;gap:10px;align-items:center;padding-bottom:12px;border-bottom:1px solid var(--line)}.inspect-type svg{width:30px;height:30px;padding:5px;border:1px solid var(--line);border-radius:7px}.inspect-type div{display:grid}.inspect-type small,.inspect-help{font-size:12px;color:var(--muted)}.block-inspector hr{border:0;border-top:1px solid var(--line);width:100%;margin:6px 0}.inspect-actions{display:flex;flex-wrap:wrap;gap:6px}.language-choice{display:grid;grid-template-columns:1fr 1fr;gap:6px}.language-choice button{padding:9px;border:1px solid var(--line);background:var(--surface);border-radius:7px;color:var(--ink);cursor:pointer}.language-choice button.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink);font-weight:600}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}.switch-row input{width:20px;height:20px;accent-color:var(--accent)}.mini-field{display:grid;gap:4px;margin-bottom:8px;font-size:12px}.mini-field input{padding:8px;font-size:13px}.builder-status{display:flex;justify-content:space-between;padding:9px 18px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:12px}
.format-panel{display:grid;gap:7px;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--bg)}.format-row{display:flex;align-items:center;gap:5px}.format-row select{min-width:0;padding:7px;font-size:12px}.format-row select:first-child{flex:1}.format-row select:nth-child(2){width:78px}.format-row input[type=color]{width:38px;height:34px;padding:2px;border:1px solid var(--line);border-radius:6px;background:var(--surface)}.format-row button{display:grid;place-items:center;width:34px;height:32px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);cursor:pointer}.format-row button.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink)}
.doc-table-wrap{overflow-x:auto;margin:12px 0}.doc-table{border-collapse:collapse;table-layout:fixed}.doc-table td{border:1px solid #d9d9d9;padding:8px;vertical-align:middle;white-space:pre-wrap}.doc-image{margin-top:14px;margin-bottom:14px}.doc-image img{display:block;width:100%;height:auto;object-fit:contain}.canvas-table{width:100%;border-collapse:collapse}.canvas-table td{border:1px solid var(--line);padding:7px;background:var(--surface)}.canvas-image{display:block;max-height:360px;object-fit:contain}
.quick-format{position:sticky;top:132px;z-index:3;display:flex;align-items:center;gap:6px;max-width:800px;margin:0 auto 10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.96);box-shadow:0 8px 24px -20px rgba(11,35,27,.5);backdrop-filter:blur(8px)}.quick-format strong{margin-right:4px;font-size:12px;white-space:nowrap}.quick-format select{width:auto;min-width:76px;padding:7px;font-size:12px}.quick-format select:nth-of-type(1){min-width:130px}.quick-format button{display:grid;place-items:center;width:34px;height:32px;border:1px solid var(--line);border-radius:6px;background:var(--surface);cursor:pointer}.quick-format button.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink)}.quick-format.disabled{opacity:.58}.color-control{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--muted)}.color-control input{width:34px;height:32px;padding:2px}.media-block small{display:block;margin-top:6px;text-align:center;color:var(--muted);font-size:11px}.sender-signature-block{min-width:180px;padding:8px}.sender-signature-block img{display:block;width:100%;max-height:100px;object-fit:contain;object-position:left bottom}.signature-name{padding-top:5px;border-top:1px solid var(--ink);font-weight:700}.sender-signature-block small{color:var(--muted)}.signature-editor{display:grid;gap:8px;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--bg)}.signature-editor canvas{position:static;width:100%;height:110px;border:1px dashed var(--muted);border-radius:7px;background:white;touch-action:none;cursor:crosshair}.doc-sender-signature{margin-top:24px;margin-bottom:18px}.doc-sender-signature img{display:block;width:100%;max-height:100px;object-fit:contain;object-position:left bottom}.doc-sender-signature figcaption{display:grid;padding-top:5px;border-top:1px solid var(--ink);font-size:12px}.doc-sender-signature figcaption span{color:var(--muted);font-size:11px}
@media(max-width:1320px){.builder-grid{grid-template-columns:210px minmax(460px,1fr)}.block-inspector{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);grid-template-columns:repeat(2,minmax(0,1fr))}.block-inspector>h2,.block-inspector>hr{grid-column:1/-1}.builder-head{top:101px}.quick-format{top:172px}}
@media(max-width:760px){main.wrap:has(.builder-shell){overflow:hidden}.builder-shell,.builder-head,.builder-setup,.builder-grid,.block-library,.document-stage,.block-inspector{min-width:0;width:100%;max-width:100%}.builder-shell{margin-top:-28px}.builder-head{position:static;grid-template-columns:1fr;padding:14px}.builder-head>div:first-child{display:grid;gap:4px;min-width:0}.builder-actions{justify-content:stretch;min-width:0}.builder-actions .btn{flex:1;min-width:0;padding-inline:7px}.save-state{text-align:left}.builder-setup{overflow-x:auto;padding:9px 14px}.builder-setup select{min-width:190px}.setup-note{display:none}.builder-grid{display:flex;flex-direction:column}.block-library{border-right:0;border-bottom:1px solid var(--line);padding:14px}.block-tools,.common-list{display:flex;max-width:100%;overflow-x:auto}.block-tool,.common-list button{min-width:180px}.block-library h2:not(:first-child),.common-list{display:none}.document-stage{padding:14px 8px}.quick-format{position:static;overflow-x:auto;justify-content:flex-start}.quick-format strong{display:none}.builder-paper{min-height:620px;padding:24px 14px}.block-inspector{display:grid;grid-template-columns:1fr;padding:16px}.block-inspector>*{grid-column:1}.builder-status{display:none}.doc-toolbar{padding-inline:5px}.canvas-block{grid-template-columns:20px 1fr}.block-actions{grid-column:2;opacity:1}.block-drop{height:8px}}

/* servidor: login, avisos, botones peligro */
.notice-bar{font-size:13px;padding:10px 14px;border-radius:8px;background:var(--warn-soft);color:var(--warn)}
.delivery-card{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:12px;background:linear-gradient(135deg,var(--surface),var(--accent-soft))}.delivery-card p{margin-top:4px;max-width:620px}.delivery-icons{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.delivery-icons span{white-space:nowrap;padding:7px 10px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:12px;font-weight:600;color:var(--accent-ink)}
@media(max-width:650px){.delivery-card{align-items:flex-start;flex-direction:column}.delivery-icons{justify-content:flex-start}}
.gmail-guide{display:grid;gap:16px;padding:18px;border:1px solid var(--accent);border-radius:12px;background:var(--accent-soft)}.gmail-guide-head{display:flex;justify-content:space-between;align-items:center;gap:18px}.gmail-guide-head h2{font-size:19px}.gmail-guide-head p{margin-top:4px;color:var(--muted);font-size:13px;max-width:470px}.gmail-guide ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;list-style:none;padding:0;margin:0;counter-reset:gmail}.gmail-guide li{counter-increment:gmail;display:grid;grid-template-columns:30px 1fr;column-gap:9px;align-items:start;padding:11px;background:var(--surface);border:1px solid var(--line);border-radius:9px}.gmail-guide li::before{content:counter(gmail);grid-row:1/3;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--accent);color:var(--on-accent);font-weight:700}.gmail-guide li b{font-size:13px}.gmail-guide li span{font-size:12px;color:var(--muted)}.gmail-example{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border-radius:8px;background:var(--surface);font-size:12px;color:var(--muted)}.gmail-example code{font:600 13px var(--f-mono);color:var(--ink);letter-spacing:.06em}.gmail-help{font-size:12px;color:var(--muted)}.gmail-help a{color:var(--accent-ink)}@media(max-width:650px){.gmail-guide-head{align-items:flex-start;flex-direction:column}.gmail-guide ol{grid-template-columns:1fr}.gmail-example{align-items:flex-start;flex-direction:column}}
.btn.danger{color:var(--bad);border-color:var(--bad-soft)}
.login{min-height:100%;display:grid;place-items:center;padding-block:40px}
.login form{width:min(400px,100%)}
.err{color:var(--bad);font-size:14px;min-height:1.2em}
.pill.EXPIRADO,.pill.ANULADO{background:var(--bad-soft);color:var(--bad)}
.done-hero{display:grid;gap:10px;justify-items:center;text-align:center;padding:12px 0}
.done-hero .big-check{width:72px;height:72px;border-radius:50%;background:var(--ok-soft);color:var(--ok);display:grid;place-items:center;font-size:38px;font-weight:700}

/* módulo de entrega por WhatsApp */
.wa-page{display:grid;gap:22px;min-width:0}.wa-title{display:flex;justify-content:space-between;align-items:end;gap:18px}.wa-title p{color:var(--muted);margin-top:5px}.wa-secure{font-size:12px;color:var(--accent-ink);padding:7px 10px;border:1px solid var(--accent);border-radius:999px;background:var(--accent-soft)}.wa-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr);gap:22px;align-items:start;min-width:0}.wa-form{display:grid;gap:18px;min-width:0}.wa-form>*{min-width:0}.wa-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding-bottom:14px;border-bottom:1px solid var(--line)}.wa-steps span{display:flex;align-items:center;gap:8px;color:var(--muted);font-weight:600;font-size:13px}.wa-steps i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--bg);font-style:normal}.wa-steps .on{color:var(--ink)}.wa-steps .on i{background:var(--accent);color:var(--on-accent)}.wa-phone{display:grid;grid-template-columns:118px minmax(0,1fr);gap:7px}.wa-phone select,.wa-phone input{min-width:0}.hint.valid{color:var(--ok);font-weight:600}.wa-upload{position:relative;display:flex;align-items:center;gap:12px;min-height:92px;padding:14px;border:1.5px dashed var(--muted);border-radius:10px;background:var(--bg);cursor:pointer}.wa-upload:hover,.wa-upload.over{border-color:var(--accent);background:var(--accent-soft)}.wa-upload-icon{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:50%;font-size:22px;color:var(--accent-ink);background:var(--surface)}.wa-upload>span:nth-child(2){display:grid}.wa-upload small{color:var(--muted)}.wa-upload img{width:72px;height:62px;margin-left:auto;border-radius:7px;object-fit:cover;border:1px solid var(--line)}.wa-upload button{position:absolute;right:7px;top:7px;width:26px;height:26px;border:1px solid var(--line);border-radius:50%;background:var(--surface);cursor:pointer}.wa-privacy{display:grid;gap:3px;padding:12px 14px;border-left:3px solid var(--accent);background:var(--accent-soft);border-radius:4px 9px 9px 4px;font-size:13px}.wa-privacy span{color:var(--muted)}.wa-primary{min-width:270px}.wa-preview{display:grid;gap:12px;justify-items:center;position:sticky;top:86px}.wa-preview>p{color:var(--muted);font-size:12px;max-width:330px;text-align:center}.wa-phone-preview{width:min(330px,100%);padding:12px;border:8px solid #17211e;border-radius:34px;background:#e7e3dc;box-shadow:0 20px 40px -28px rgba(0,0,0,.55)}.wa-phone-preview header{display:flex;align-items:center;gap:10px;margin:-12px -12px 0;padding:14px;background:#f7faf8;border-radius:26px 26px 0 0}.wa-phone-preview header>span{font-size:30px;color:#0b8e69}.wa-phone-preview header div{display:grid}.wa-phone-preview header small{color:var(--muted)}.wa-chat{min-height:430px;padding:42px 10px 14px;background:linear-gradient(rgba(239,234,224,.88),rgba(239,234,224,.88)),repeating-linear-gradient(45deg,#dcd5c9 0 1px,transparent 1px 18px)}.wa-bubble{margin-left:24px;padding:10px 11px;background:#d9fdd3;border-radius:9px 2px 9px 9px;font-size:13px;line-height:1.45;box-shadow:0 1px 1px rgba(0,0,0,.08)}.wa-link-card{display:grid;gap:2px;margin-top:9px;padding:9px;background:rgba(255,255,255,.75);border-radius:7px}.wa-link-card span{color:var(--muted);font-size:11px}.wa-link-card em{color:#0877d1;font-style:normal;font-size:11px;overflow-wrap:anywhere}.wa-bubble>img{display:block;width:100%;max-height:170px;margin-top:8px;border-radius:7px;object-fit:cover}.wa-success{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 18px;border:1px solid var(--ok);border-radius:var(--r);background:var(--ok-soft)}.wa-success>div:first-child{display:grid}.wa-success span{color:var(--muted);font-size:13px}.wa-recent{display:grid;gap:12px;min-width:0}.wa-recent-head{display:flex;justify-content:space-between;align-items:center}.wa-recent-head span{color:var(--muted);font-size:13px}.wa-recent td{font-size:13px}
@media(max-width:900px){.wa-layout{grid-template-columns:1fr}.wa-preview{position:static}.wa-phone-preview{width:min(360px,100%)}}
@media(max-width:600px){.wa-title{align-items:flex-start;flex-direction:column}.wa-secure{display:none}.wa-form{padding:16px}.wa-form .grid2{grid-template-columns:minmax(0,1fr)}.wa-steps span{font-size:11px}.wa-steps i{width:24px;height:24px}.wa-phone{grid-template-columns:105px minmax(0,1fr)}.wa-primary{width:100%;min-width:0}.wa-preview{display:none}.wa-success{align-items:flex-start;flex-direction:column}.wa-success .row{width:100%}.wa-success .btn{flex:1}.wa-upload{align-items:flex-start}.wa-upload img{width:60px;height:52px}}

/* editor de mensaje WhatsApp */
.wa-message-field{gap:8px}.wa-message-label{display:flex;align-items:center;justify-content:space-between;gap:12px}.wa-message-label>span{font-size:11px;font-weight:700;color:var(--accent-ink);background:var(--accent-soft);border-radius:999px;padding:5px 9px}.wa-formatbar{display:flex;align-items:center;gap:6px;padding:7px 8px;border:1px solid var(--line);border-bottom:0;border-radius:10px 10px 0 0;background:var(--bg)}.wa-formatbar button{display:grid;place-items:center;min-width:34px;height:32px;padding:0 8px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--ink);cursor:pointer;font-size:15px}.wa-formatbar button:hover,.wa-formatbar button:focus-visible{border-color:var(--line);background:var(--surface);box-shadow:0 2px 8px rgba(0,0,0,.06)}.wa-message-field textarea{min-height:230px;border-radius:0 0 10px 10px;line-height:1.6;resize:vertical}.wa-bubble strong{font-weight:750}.wa-bubble em{font-style:italic}.wa-signline{display:grid;gap:4px;margin-top:12px;padding-top:10px;border-top:1px solid rgba(0,0,0,.09)}.wa-signline span{color:#0877d1;overflow-wrap:anywhere}.wa-meta{margin-top:9px;color:#53645f;font-size:11px}
@media(max-width:600px){.wa-message-label{align-items:flex-start;flex-direction:column}.wa-formatbar{overflow-x:auto}.wa-message-field textarea{min-height:270px}}

/* edición segura de solicitudes pendientes */
.request-edit{display:grid;gap:14px;margin-top:6px;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}.request-edit-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.request-edit-head h3{margin:0 0 3px}.request-edit textarea#editTexto{min-height:300px;line-height:1.55;font-family:var(--body)}.request-edit textarea#editMensaje{min-height:140px}
@media(max-width:600px){.request-edit{padding:14px}.request-edit-head{flex-direction:column}.request-edit textarea#editTexto{min-height:360px}}

/* importación masiva de contactos */
.wa-bulk{display:grid;gap:16px}.wa-bulk-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.wa-bulk-head h2{margin-bottom:5px}.wa-bulk-config{display:grid;grid-template-columns:minmax(260px,1fr) minmax(170px,240px);gap:18px;align-items:end;padding:14px;border-radius:10px;background:var(--bg)}.wa-bulk .tbl{max-height:480px;overflow:auto}.wa-bulk td{font-size:13px;vertical-align:middle}.wa-row-doc{min-width:230px;padding:8px 34px 8px 10px;font-size:13px}.wa-row-send{min-width:132px;white-space:nowrap}
@media(max-width:700px){.wa-bulk-head{flex-direction:column}.wa-bulk-head .btn{width:100%}.wa-bulk-config{grid-template-columns:1fr}.wa-bulk-config .btn{width:100%}}

/* historial completo, edición y reenvío de WhatsApp */
.wa-recent-head>div{display:grid;gap:3px}.wa-recent-head p{font-size:13px}.wa-row-actions{display:flex;align-items:center;gap:7px;white-space:nowrap}.wa-pager{display:flex;align-items:center;justify-content:flex-end;gap:12px}.wa-pager span{font-size:13px;color:var(--muted)}.wa-edit-modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:18px;background:rgba(8,25,19,.58);backdrop-filter:blur(3px)}.wa-edit-modal[hidden]{display:none}.wa-edit-box{display:grid;gap:18px;width:min(700px,100%);max-height:calc(100vh - 36px);overflow:auto;box-shadow:0 24px 70px rgba(0,0,0,.25)}.wa-edit-warning{padding:11px 13px;border-radius:8px;background:var(--accent-soft);color:var(--accent-ink);font-size:13px}
@media(max-width:600px){.wa-recent-head{align-items:flex-start;gap:8px}.wa-row-actions{align-items:stretch;flex-direction:column}.wa-pager{justify-content:space-between}.wa-pager span{font-size:11px;text-align:center}.wa-edit-box{padding:16px}.wa-edit-box .grid2{grid-template-columns:1fr}}
@media(max-width:760px){.import-result{grid-template-columns:auto 1fr;margin:10px 12px 0}.import-result .btn{grid-column:1/-1}}