:root{--n:#130E1E;--w:#FFF;--y:#FFDA00;--g1:#F3F3F3;--g2:#E7E7E7;--g3:#E0E0E0;--g4:#D4D4D4;--ok:#447B20;--err:#B03333;--warn:#D04B20;--m:#6B6B6B}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'FK Cuerva Grotesk',Helvetica,Arial,sans-serif;background:#F7F7F7;color:var(--n)}
.hd{background:var(--n);padding:14px 28px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;flex-wrap:wrap;gap:8px}
.hd svg{height:26px;width:auto}
.hd-left{display:flex;align-items:center;gap:14px}
.hd-title{color:#fff;font-size:15px;font-weight:600;letter-spacing:.02em}
.hd-badge{background:rgba(255,218,0,.15);color:#FFDA00;font-size:9.5px;font-weight:700;padding:3px 8px;letter-spacing:.06em;text-transform:uppercase}
.hd-btns{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.accent{height:3px;background:var(--y)}
.wrap{max-width:1400px;margin:0 auto;padding:20px 28px 80px}
.lbl{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--m);margin-bottom:10px}
.btn{padding:7px 16px;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;border:none}
.btn-primary{background:var(--y);color:var(--n)}
.btn-dark{background:var(--n);color:#fff}
.btn-danger{background:#FCEAEA;color:var(--err)}
.btn-sm{padding:5px 10px;font-size:11px}
.btn:hover{opacity:.85}
.btn:disabled{opacity:.4;cursor:not-allowed}
.sync-bar{background:#FFFEF5;border-bottom:1px solid var(--g1);padding:6px 28px;display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--m)}
.sync-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:6px}
.sync-on{background:#4CAF50}.sync-off{background:#F44336}.sync-loading{background:#FFC107}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.chip{padding:6px 12px;font-size:12px;border:1.5px solid var(--g3);background:var(--w);cursor:pointer;user-select:none;white-space:nowrap;display:flex;align-items:center;gap:5px;transition:all .12s}
.chip:hover{border-color:var(--n)}
.chip.on{background:var(--n);color:#fff;border-color:var(--n)}
.chip .cc{font-size:10px;font-weight:600;background:var(--g1);color:var(--m);padding:1px 5px;min-width:18px;text-align:center}
.chip.on .cc{background:rgba(255,218,0,.2);color:var(--y)}
/* Chips de tipo — borde amarillo para diferenciar */
.chip-tipo{border-color:var(--y);border-style:dashed}
.chip-tipo.on{background:var(--y);color:var(--n);border-color:var(--y);border-style:solid}
.chip-tipo.on .cc{background:rgba(19,14,30,.15);color:var(--n)}
.sbar{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;align-items:center}
.sinput{flex:1;min-width:200px;padding:9px 14px;border:1px solid var(--g3);font-size:13px;font-family:inherit;background:var(--w);outline:none}
.sinput:focus{border-color:var(--y)}
.ssel{padding:9px 12px;border:1px solid var(--g3);font-size:12px;font-family:inherit;background:var(--w);cursor:pointer;outline:none}
.ctr{font-size:11px;color:var(--m);margin-left:auto;white-space:nowrap}
.tw{background:var(--w);overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:12.5px}
thead th{background:var(--n);color:#fff;padding:10px 14px;text-align:left;font-weight:500;font-size:11px;letter-spacing:.03em;white-space:nowrap;cursor:pointer;user-select:none;position:sticky;top:0;z-index:2}
thead th:hover{background:#2a2535}
thead th .ar{opacity:.3;margin-left:3px;font-size:8px}
thead th.s .ar{opacity:1;color:var(--y)}
tbody tr{border-bottom:1px solid var(--g1);transition:background .1s;cursor:pointer}
tbody tr:hover{background:#FFFEF5}
td{padding:9px 14px;vertical-align:top}
.cn{font-weight:600}.cd{font-size:11px;color:var(--m)}
.cd a{color:var(--m);text-decoration:none;border-bottom:1px solid var(--g3)}
.cd a:hover{color:var(--n);border-color:var(--y)}
.ca{font-size:11.5px;color:var(--m);max-width:280px}
.tag{display:inline-block;padding:2px 7px;font-size:10.5px;margin:1px;background:var(--g1);white-space:nowrap}
.tag.hi{background:var(--y);color:var(--n);font-weight:600}
.tag-tipo{background:#FFFEF5;border:1px dashed var(--y);color:var(--n);font-size:10px;padding:2px 6px}
.te{font-size:11px;font-weight:600;padding:3px 9px;display:inline-block}
.tp{background:#FFF3CC;color:#8B6914}.ta{background:#E8F5E0;color:var(--ok)}
.tv{background:#FFF0EB;color:var(--warn)}.tx{background:#FCEAEA;color:var(--err)}
.th{background:#E0F0FF;color:#1a5fa0}.ts{background:#FFE0E0;color:#993333}
.em{color:var(--g4);font-style:italic;font-size:11px}
.es-box{text-align:center;padding:56px 24px;color:var(--m);display:none}
.ov{display:none;position:fixed;inset:0;background:rgba(19,14,30,.45);z-index:200}
.ov.on{display:block}
.pn{position:fixed;top:0;right:0;width:560px;max-width:94vw;height:100vh;background:var(--w);z-index:201;overflow-y:auto;transform:translateX(100%);transition:transform .25s ease;box-shadow:-4px 0 24px rgba(0,0,0,.1)}
.pn.on{transform:translateX(0)}
.ph{background:var(--n);color:#fff;padding:20px 24px;display:flex;justify-content:space-between;align-items:center}
.ph h2{font-size:16px;font-weight:600;margin:0;flex:1}
.pc{background:none;border:none;color:#fff;font-size:22px;cursor:pointer;opacity:.6}
.pc:hover{opacity:1}
.pa{height:3px;background:var(--y)}
.pb{padding:24px}
/* Tabs dentro del panel */
.tabs{display:flex;border-bottom:2px solid var(--g2);margin-bottom:20px;gap:0}
.tab{padding:10px 18px;font-size:12px;font-weight:600;color:var(--m);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .15s;white-space:nowrap}
.tab:hover{color:var(--n)}
.tab.active{color:var(--n);border-bottom-color:var(--y)}
.tab-content{display:none}
.tab-content.active{display:block}
.fl{margin-bottom:16px}
.fl-l{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--m);margin-bottom:4px;font-weight:600}
.fl-v{font-size:13.5px;line-height:1.5}
.fl-v a{color:var(--n)}
.fi{padding:8px 12px;border:1px solid var(--g3);font-size:13px;font-family:inherit;outline:none;background:#fff;width:100%;margin-bottom:14px}
.fi:focus{border-color:var(--y)}
.fi-ta{resize:vertical;font-family:inherit}
.spec-pick{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:16px}
.sp{padding:4px 10px;font-size:11px;cursor:pointer;border:1.5px solid var(--g3);background:#fff;color:var(--n);user-select:none;transition:all .1s}
.sp.on{background:var(--n);color:var(--y);border-color:var(--n)}
.sp-tipo{border-color:var(--y);border-style:dashed}
.sp-tipo.on{background:var(--y);color:var(--n);border-color:var(--y);border-style:solid}
.sp-zc{border-color:#b0d4b0;font-size:10.5px}
.sp-zc.on{background:#E8F5E0;color:var(--n);border-color:#447B20;font-weight:600}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--n);color:var(--y);padding:10px 24px;font-size:13px;font-weight:600;z-index:300;box-shadow:0 4px 12px rgba(0,0,0,.2);display:none}
.toast.on{display:block}
.footer{text-align:center;padding:32px;font-size:11px;color:var(--g4)}
.loading{display:flex;justify-content:center;align-items:center;height:100vh;font-size:15px;color:var(--m)}
/* Contacto card */
.con-card{border:1px solid var(--g2);padding:12px;margin-bottom:8px;position:relative}
.con-card.principal{border-left:3px solid var(--y)}
.con-name{font-weight:600;font-size:13px}
.con-dept{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--m)}
.con-detail{font-size:12px;color:var(--m);margin-top:4px}
.con-actions{position:absolute;top:8px;right:8px;display:flex;gap:4px}
/* Observaciones internas */
.obs-box{background:#FFFEF5;border:1px solid var(--y);padding:12px;font-size:13px;line-height:1.5}
.cif-help{font-size:10px;color:var(--m);margin-top:-10px;margin-bottom:10px}
.cif-error{font-size:11px;color:var(--err);margin-top:-10px;margin-bottom:10px;font-weight:600}
.cif-ok{font-size:11px;color:var(--ok);margin-top:-10px;margin-bottom:10px}
.fi-error{border-color:var(--err) !important}
.fi-ok{border-color:var(--ok) !important}
@media(max-width:768px){.wrap{padding:16px}.hd{padding:14px 16px}.pn{width:100vw;max-width:100vw}.hd-badge{display:none}.tabs{overflow-x:auto}.tab{padding:8px 12px;font-size:11px}}