*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
:root{--r:var(--radio,10px)}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--tinta);font:15px/1.5 var(--sans);-webkit-font-smoothing:antialiased}
h1,h2{font-family:var(--serif);font-weight:var(--serif-w,400);letter-spacing:0;margin:0}
button,input,select,textarea{font:inherit;color:inherit}
.btn{background:var(--acento);color:var(--sobre-acento,#fff);border:0;border-radius:var(--r);padding:12px 20px;font-weight:500;cursor:pointer;transition:transform .16s cubic-bezier(.2,.8,.2,1),filter .16s}
.btn:hover{filter:brightness(1.08)} .btn:active{transform:scale(.97)}
.btn-sec{background:transparent;border:1px solid var(--linea);border-radius:var(--r);padding:10px 16px;cursor:pointer}
.btn-sec:hover{border-color:var(--tinta)}
input,select,textarea{width:100%;background:var(--campo,#fff);border:1px solid var(--linea);border-radius:calc(var(--r) - 4px);padding:10px 12px;outline:none}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{outline:2px solid var(--acento);outline-offset:2px}
label{display:grid;gap:6px;font-size:13px;color:var(--suave)}
label small{font-size:12px;color:var(--suave)}
.login{min-height:100svh;display:grid;place-items:center;padding:24px;background:var(--fondo-login,var(--fondo))}
.login-box{width:min(400px,100%);background:var(--papel,#fff);padding:40px 32px;border-radius:calc(var(--r) + 6px);display:grid;gap:16px;box-shadow:0 30px 60px -30px rgba(0,0,0,.25)}
.login-logo{width:180px;height:auto;margin:0 auto 8px;display:block}
.login-box h1{font-size:28px;text-align:center}
.sub{margin:-8px 0 8px;text-align:center;color:var(--suave)}
.err{min-height:1em;margin:0;color:#a3262a;font-size:13px}
.demo-nota{margin:0;text-align:center;font-size:13px;color:var(--suave)}
.volver{text-align:center;font-size:13px;color:var(--tinta)}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px clamp(16px,4vw,40px);background:var(--papel,#fff);border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:5}
.top-logo img{height:34px;width:auto;display:block}
.top nav{display:flex;gap:18px;align-items:center;font-size:14px}
.top nav a{color:var(--tinta)} .top nav button{background:none;border:0;cursor:pointer;text-decoration:underline}
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--linea);border-bottom:1px solid var(--linea)}
.kpis div{background:var(--fondo);padding:22px clamp(16px,3vw,32px);display:grid;gap:2px}
.kpis b{font-family:var(--serif);font-weight:var(--serif-w,400);font-size:clamp(26px,3vw,38px);line-height:1.1}
.kpis span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--suave)}
.cfg,.prods{padding:32px clamp(16px,4vw,40px)}
.cfg h2,.prods h2{font-size:clamp(24px,2.4vw,32px);margin-bottom:18px}
.cfg-grid{display:grid;grid-template-columns:1fr 1.3fr 1.6fr 1.6fr auto;gap:16px;align-items:end}
.prods{padding-top:8px}
.prods-head{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:end}
.prods-head h2{margin:0} .prods-head small{font-family:var(--sans);font-size:14px;color:var(--suave);margin-left:8px}
.tools{display:flex;gap:10px;flex-wrap:wrap}.tools input{width:220px}.tools select{width:210px}
.ayuda{font-size:13px;color:var(--suave);margin:12px 0 16px}
.tabla-wrap{overflow-x:auto;border:1px solid var(--linea);border-radius:var(--r);background:var(--papel,#fff)}
table{width:100%;border-collapse:collapse;min-width:920px}
th{text-align:left;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--suave);font-weight:500;padding:12px 14px;border-bottom:1px solid var(--linea)}
td{padding:10px 14px;border-bottom:1px solid var(--linea);vertical-align:top}
tr:last-child td{border-bottom:0}
tr.off td{opacity:.5}
.c-foto{width:76px}.foto{cursor:pointer;display:block}.foto img{width:56px;height:70px;object-fit:cover;border-radius:6px;background:#fff;border:1px solid var(--linea);display:block}
.c-nom{min-width:300px}.in-nom{font-weight:500;margin-bottom:6px}.in-desc{font-size:13px;resize:vertical}
.c-cat{width:200px}.chk{display:flex;align-items:center;gap:8px;margin-top:8px;color:var(--tinta)}.chk input{width:auto}
.c-pre{width:150px}.pre{display:flex;align-items:center;gap:6px}.pre input{font-variant-numeric:tabular-nums}
.sw{display:flex;align-items:center;gap:8px;cursor:pointer;color:var(--tinta)}.sw input{position:absolute;opacity:0;width:1px}
.sw span{width:38px;height:22px;border-radius:20px;background:var(--linea);position:relative;transition:background .2s}
.sw span::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.sw input:checked+span{background:var(--acento)}.sw input:checked+span::after{transform:translateX(16px)}
.sw input:focus-visible+span{outline:2px solid var(--acento);outline-offset:2px}
.sw em{font-style:normal;font-size:13px}
.del{background:none;border:0;color:#a3262a;cursor:pointer;font-size:13px;text-decoration:underline}
.pie-tools{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
dialog{border:0;border-radius:calc(var(--r) + 6px);padding:0;width:min(520px,calc(100% - 32px));background:var(--papel,#fff);color:var(--tinta)}
dialog::backdrop{background:rgba(20,18,16,.45)}
dialog form{padding:28px;display:grid;gap:14px}
dialog h2{font-size:28px}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.acc{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;background:var(--tinta);color:var(--fondo);padding:12px 20px;border-radius:30px;font-size:14px;transition:opacity .2s,transform .2s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}
@media (max-width:900px){.cfg-grid{grid-template-columns:1fr 1fr}.kpis{grid-template-columns:repeat(2,1fr)}.kpis div:last-child{grid-column:span 2}}
@media (max-width:560px){.cfg-grid{grid-template-columns:1fr}.tools input,.tools select{width:100%}.tools{width:100%}.dos{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
