/* ===== Pescaderos · carta náutica del Callao =====
   Tierra crema para trabajar, el mar en franjas de profundidad (batimetría):
   cuanto más espera una mesa o más vende una hora, más hondo el azul. */
:root{
  --tierra:#F2F4F7;--tierra2:#E9ECF1;--papel:#FFFFFF;
  --p0:#EEF4FC;--p1:#D3E4F7;--p2:#9EC3E9;--p3:#1973B1;--p4:#074AB2;--p5:#1D1491;--abismo:#120C5E;
  --tinta:#101828;--tinta2:#344054;--tinta3:#667085;--tinta4:#98A2B3;
  --linea:#E4E7EC;--linea2:#D0D5DD;--linea3:#98A2B3;
  --coral:#E5484D;--coral-s:#FDECEC;--alga:#0F7A4D;--alga-s:#E3F7EE;--arena:#A35F00;--arena-s:#FFF4E0;--verde:#22A06B;--ambar:#F5A524;
  --r:12px;--r-s:10px;--r-l:14px;
  --sh:0 1px 2px rgba(16,24,40,.06);--sh2:0 16px 40px -16px rgba(16,24,40,.3);
  --font:Manrope,system-ui,-apple-system,'Segoe UI',sans-serif;--marca:Manrope,system-ui,sans-serif;--marca-logo:'Baloo 2',Manrope,sans-serif;
  --rail:236px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{font:15px/1.45 var(--font);color:var(--tinta);background:var(--tierra);-webkit-tap-highlight-color:transparent;font-feature-settings:"tnum" 1}
::selection{background:var(--p2);color:var(--tinta)}
:focus-visible{outline:2.5px solid var(--p4);outline-offset:2px;border-radius:6px}
*{scrollbar-width:thin;scrollbar-color:var(--linea2) transparent}
button,input,select,textarea{font:inherit;color:inherit}
input,textarea{caret-color:var(--p4)}
button{cursor:pointer}
a{color:var(--p4);text-underline-offset:3px}
.hidden{display:none!important}
h1,h2,h3{margin:0;line-height:1.15;letter-spacing:-.01em}
h1{font-size:25px;font-weight:800}
h2{font-size:19px;font-weight:800}
h3{font-size:15px;font-weight:700}
.muted{color:var(--tinta3)}.small{font-size:13px}.xs{font-size:12px}
.num{font-variant-numeric:tabular-nums}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.sp{flex:1}
.stack{display:flex;flex-direction:column;gap:10px}
svg.i{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
svg.i.s{width:17px;height:17px}

/* ---------- controles ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:var(--r-s);border:1px solid var(--linea2);background:var(--papel);font-weight:650;color:var(--tinta);transition:background .15s,border-color .15s,transform .08s;white-space:nowrap;text-decoration:none}
.btn:hover{border-color:var(--linea3);background:#FBFDFF}
.btn:active{transform:translateY(1px)}
.btn.pri{background:var(--p4);border-color:var(--p4);color:#fff}.btn.pri:hover{background:#063E97}
.btn.ok{background:var(--alga);border-color:var(--alga);color:#fff}.btn.ok:hover{background:#0E6E43}
.btn.mal{color:var(--coral);border-color:#F5B5B7;background:var(--papel)}.btn.mal:hover{background:var(--coral-s)}
.btn.plano{background:transparent;border-color:transparent;color:var(--p4)}.btn.plano:hover{background:var(--p0)}
.btn.big{min-height:54px;font-size:16.5px;border-radius:var(--r);padding:0 20px}
.btn.sm{min-height:36px;padding:0 12px;font-size:13.5px}
.btn.ico{width:44px;padding:0}.btn.sm.ico{width:36px}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn.cargando{position:relative;color:transparent!important}.btn.cargando::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid var(--linea3);border-right-color:transparent;animation:gira .7s linear infinite}
.btn.pri.cargando::after,.btn.ok.cargando::after{border-color:#fff;border-right-color:transparent}
@keyframes gira{to{transform:rotate(360deg)}}
.in{width:100%;min-height:44px;padding:9px 12px;border:1px solid var(--linea2);border-radius:var(--r-s);background:var(--papel);outline:none;transition:border-color .15s,box-shadow .15s}
.in:hover{border-color:var(--linea3)}
.in:focus{border-color:var(--p4);box-shadow:0 0 0 3px rgba(7,74,178,.14)}
.in::placeholder{color:var(--tinta4)}
select.in{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23264887' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:34px}
textarea.in{min-height:80px;resize:vertical}
label.lb{display:block;font-weight:650;font-size:13px;margin:0 0 5px;color:var(--tinta2)}
.field{margin-bottom:12px}
.ayuda{font-size:12.5px;color:var(--tinta3);margin-top:4px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:640px){.g3{grid-template-columns:1fr 1fr}}
.chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 0}.chips::-webkit-scrollbar{display:none}
.chip{flex:none;min-height:38px;padding:0 14px;border-radius:999px;border:1px solid var(--linea2);background:var(--papel);font-weight:650;font-size:14px;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.chip:hover{border-color:var(--linea3)}
.chip[aria-pressed="true"]{background:var(--p5);border-color:var(--p5);color:#fff}
.chip .n{font-size:12px;opacity:.7}
.seg{display:inline-flex;border:1px solid var(--linea2);border-radius:var(--r-s);background:var(--papel);padding:3px;gap:2px;overflow-x:auto;max-width:100%;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg button{border:0;background:transparent;min-height:36px;padding:0 14px;border-radius:7px;font-weight:650;font-size:14px;color:var(--tinta2);white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.seg button:hover{background:var(--p0)}
.seg button[aria-pressed="true"]{background:var(--p5);color:#fff}
.tag{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:6px;font-size:12px;font-weight:700;background:var(--p0);color:var(--p4);white-space:nowrap}
.tag.ok{background:var(--alga-s);color:var(--alga)}.tag.warn{background:var(--arena-s);color:var(--arena)}.tag.mal{background:var(--coral-s);color:var(--coral)}.tag.gris{background:var(--tierra2);color:var(--tinta3)}.tag.hondo{background:var(--p5);color:#fff}
.cab .izq{display:flex;flex-direction:column;gap:8px}
.sw{display:flex;align-items:center;gap:10px;font-weight:600;margin:4px 0 12px;cursor:pointer}
.sw input{width:20px;height:20px;accent-color:var(--p4)}
.tog{position:relative;width:42px;height:24px;flex:none;appearance:none;border-radius:12px;background:var(--linea2);cursor:pointer;transition:background .15s;margin:0}
.tog::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .18s}
.tog:checked{background:var(--p4)}.tog:checked::after{transform:translateX(18px)}
.tog.agot:checked{background:var(--coral)}

/* ---------- ingreso: carta náutica de fondo ---------- */
#login{min-height:100vh;display:grid;place-items:center;padding:24px 16px;position:relative;overflow:hidden;background:var(--tierra)}
#login .mar{position:absolute;inset:0;width:100%;height:100%}
.lg{position:relative;width:min(380px,100%)}
.lg img{display:block;width:min(260px,74%);margin:0 auto 10px;mix-blend-mode:multiply}
.lg form{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-l);box-shadow:var(--sh2);padding:24px}
.lg h1{font-size:21px;margin-bottom:16px}
.lg .err{color:var(--coral);font-weight:600;font-size:14px;min-height:20px;margin:2px 0 10px}

/* ---------- estructura ---------- */
#app{min-height:100vh}
.rail{position:fixed;inset:0 auto 0 0;width:var(--rail);background:var(--p5);color:#C9CFF2;display:flex;flex-direction:column;padding:16px 12px;z-index:30;overflow-y:auto}
.rail .marca{display:flex;align-items:center;gap:10px;padding:4px 8px 18px;color:#fff;font:800 21px/1 var(--marca)}
.rail .marca img{width:36px;height:36px;border-radius:9px;background:var(--tierra)}
.rail .marca small{display:block;font:600 11.5px var(--font);color:#9EA6E0;margin-top:3px;letter-spacing:.02em}
.rail nav{display:flex;flex-direction:column;gap:2px}
.rail nav button{display:flex;align-items:center;gap:12px;width:100%;min-height:42px;padding:0 12px;border:0;border-radius:9px;background:transparent;color:#C9CFF2;font-weight:600;font-size:14.5px;text-align:left}
.rail nav button:hover{background:rgba(255,255,255,.07);color:#fff}
.rail nav button[aria-current="page"]{background:var(--p4);color:#fff}
.rail nav .cnt{margin-left:auto;min-width:22px;height:20px;border-radius:10px;background:var(--coral);color:#fff;font-size:11.5px;font-weight:800;display:grid;place-items:center;padding:0 6px}
.rail .sep{height:1px;background:rgba(255,255,255,.1);margin:10px 8px}
.rail .pie{margin-top:auto;display:flex;align-items:center;gap:10px;padding:12px 8px 2px;border-top:1px solid rgba(255,255,255,.1)}
.av{width:34px;height:34px;border-radius:50%;background:var(--p1);color:var(--p5);display:grid;place-items:center;font-weight:800;flex:none;border:0}
.rail .pie b{color:#fff;font-size:14px;display:block}.rail .pie span{font-size:12px}
.rail .pie button{margin-left:auto;background:transparent;border:0;color:#C9CFF2;padding:6px;border-radius:8px}.rail .pie button:hover{background:rgba(255,255,255,.08);color:#fff}
.vivo{width:8px;height:8px;border-radius:50%;background:#58D68D;display:inline-block;box-shadow:0 0 0 3px rgba(88,214,141,.2)}.vivo.off{background:#FF8A75;box-shadow:0 0 0 3px rgba(255,138,117,.25)}
main{margin-left:var(--rail);padding:26px 30px 60px;max-width:calc(1480px + var(--rail))}
.top,.tabbar{display:none}
@media (max-width:999px){
  .rail{display:none}
  main{margin-left:0;padding:14px 16px calc(96px + env(safe-area-inset-bottom))}
  .top{display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:30;background:var(--p5);color:#fff;padding:10px 14px;padding-top:max(10px,env(safe-area-inset-top))}
  .top .marca{display:flex;align-items:center;gap:8px;font:800 19px/1 var(--marca)}
  .top .marca img{width:30px;height:30px;border-radius:8px;background:var(--tierra)}
  .top .av{width:32px;height:32px}
  .tabbar{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--papel);border-top:1px solid var(--linea);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  .tabbar button{background:none;border:0;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11.5px;font-weight:650;color:var(--tinta3);padding:6px 0;border-radius:10px;position:relative}
  .tabbar button svg{width:23px;height:23px}
  .tabbar button[aria-current="page"]{color:var(--p5);background:var(--p0)}
  .tabbar .cnt{position:absolute;top:2px;left:calc(50% + 6px);min-width:18px;height:18px;border-radius:9px;background:var(--coral);color:#fff;font-size:10.5px;font-weight:800;display:grid;place-items:center;padding:0 5px}
}
.cab{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.cab .sub{color:var(--tinta3);font-size:14px;margin-top:3px}
.panel{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r-s)}
.panel.pad{padding:16px}
.panel>.ph{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--linea);flex-wrap:wrap}
.panel>.pb{padding:14px 16px}
.sec{font-weight:750;font-size:15px;color:var(--tinta);margin:0;display:flex;align-items:center;gap:8px}
.vacio{text-align:center;padding:36px 16px;color:var(--tinta3)}
.vacio b{display:block;color:var(--tinta);font-size:16px;margin-bottom:4px}
.vacio .btn{margin-top:12px}
.esq{border-radius:8px;background:linear-gradient(90deg,var(--tierra2),#F7F8FA,var(--tierra2));background-size:200% 100%;animation:brillo 1.2s infinite linear;height:14px;margin:12px 16px}
@keyframes brillo{to{background-position:-200% 0}}

/* ---------- escala batimétrica (la firma) ---------- */
@media (max-width:560px){.escala .xm{display:none}}
.escala{white-space:nowrap;display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--tinta3);font-weight:600}
.escala i{display:flex;border-radius:4px;overflow:hidden;border:1px solid var(--linea)}
.escala i span{width:26px;height:16px;font-style:normal;font-size:10px;font-weight:700;display:grid;place-items:center;color:var(--p5)}
.escala i span.d3,.escala i span.d4,.escala i span.d5{color:#fff}
.d0{background:var(--p0)}.d1{background:var(--p1)}.d2{background:var(--p2)}.d3{background:var(--p3)}.d4{background:var(--p4)}.d5{background:var(--p5)}

/* ---------- mesas ---------- */
.zh{display:flex;align-items:center;gap:10px;font-weight:750;font-size:14px;color:var(--tinta2);margin:22px 0 10px}
.zh::after{content:"";flex:1;height:1px;background:var(--linea)}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.mesa{position:relative;min-height:120px;border-radius:var(--r);border:1px dashed var(--linea3);background:transparent;padding:12px;text-align:left;display:flex;flex-direction:column;gap:2px;color:var(--tinta);transition:transform .1s,box-shadow .15s}
.mesa:hover{border-color:var(--p3)}
.mesa:active{transform:scale(.98)}
.mesa .n{font:800 30px/1 var(--marca);color:var(--p5)}
.mesa .est{margin-top:auto;font-size:13px;font-weight:650;color:var(--tinta3)}
.mesa.oc{border:1px solid var(--linea2)}
.mesa .who{font-size:13px;font-weight:650;color:var(--tinta2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mesa .pie{margin-top:auto;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:0 6px;font-weight:750}.mesa .pie>*{white-space:nowrap}.mesa .pie .num{margin-left:auto}
.mesa .sonda{position:absolute;top:10px;right:10px;min-width:44px;height:26px;padding:0 7px;border-radius:7px;display:grid;place-items:center;font-weight:800;font-size:14px;background:rgba(255,255,255,.9);color:var(--p5)}
.mesa .avisos{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}
.mesa.z0{background:var(--p0)}.mesa.z1{background:var(--p1)}.mesa.z2{background:var(--p2)}
.mesa.z3{background:var(--p3);color:#fff}.mesa.z4{background:var(--p4);color:#fff}.mesa.z5{background:var(--p5);color:#fff}
.mesa.z3 .n,.mesa.z4 .n,.mesa.z5 .n{color:#fff}.mesa.z3 .who,.mesa.z4 .who,.mesa.z5 .who,.mesa.z3 .pie .xs,.mesa.z4 .pie .xs,.mesa.z5 .pie .xs{color:#fff}
.mesa.z5 .sonda{background:var(--coral);color:#fff}
.mesa.comiendo{background:var(--papel)}
.mesa.cuenta{background:var(--arena-s);border-color:rgba(168,106,0,.4)}
.mesa.listo{outline:3px solid var(--alga);outline-offset:2px}
@media (max-width:560px){.mgrid{grid-template-columns:repeat(3,1fr);gap:9px}.mesa{min-height:98px;padding:9px}.mesa .n{font-size:25px}.mesa .sonda{top:7px;right:7px;min-width:34px;height:22px;font-size:12.5px;padding:0 5px}.mesa .who{display:none}.mesa .pie{font-size:13px}.mesa .avisos .tag{height:19px;font-size:10.5px;padding:0 5px}.mesa .pie .xs{display:none}.mesa .pie{justify-content:flex-end}.cab .escala{order:3;flex-basis:100%}}

/* ---------- pedido de la mesa ---------- */
.ohead{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.ohead .t{min-width:0}
.ogrid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(360px,1fr);gap:18px;align-items:start}
.ogrid>section:last-child{position:sticky;top:16px}
.otabs{display:none}
@media (max-width:999px){.ogrid{grid-template-columns:minmax(0,1fr)}.ogrid>section:last-child{position:static}.otabs{display:flex;margin-bottom:12px;position:sticky;top:52px;z-index:5;background:var(--tierra);padding:4px 0}.otabs .seg{width:100%}.otabs .seg button{flex:1;justify-content:center}.ogrid>section{display:none}.ogrid>section.on{display:block}}
.buscar{position:relative;margin-bottom:10px}.buscar svg{position:absolute;left:12px;top:12px;color:var(--tinta3)}.buscar .in{padding-left:40px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:10px;margin-top:10px}
@media (max-width:560px){.pgrid{grid-template-columns:1fr 1fr;gap:8px}.plato .tx{padding:9px 10px}.plato b{font-size:14px}.plato .ds{display:none}}
.plato{position:relative;text-align:left;border:1px solid var(--linea);background:var(--papel);border-radius:var(--r);padding:0;min-height:92px;display:flex;flex-direction:column;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.plato:hover{border-color:var(--p3)}
.plato img{width:100%;height:86px;object-fit:cover;display:block;background:var(--p0)}
.plato .tx{padding:10px 11px;display:flex;flex-direction:column;gap:2px;flex:1}
.plato b{font-size:14.5px;line-height:1.25;font-weight:700;padding-right:26px}
.plato .ds{font-size:12.5px;color:var(--tinta3);line-height:1.3}
.plato .pr{margin-top:auto;padding-top:4px;font-weight:800;color:var(--p4)}
.plato.off{opacity:.5;pointer-events:none}
.plato .cnt{position:absolute;top:8px;right:8px;min-width:28px;height:28px;border-radius:14px;background:var(--p5);color:#fff;font-weight:800;display:grid;place-items:center;padding:0 7px;box-shadow:0 4px 10px -3px rgba(29,20,145,.6)}
.plato .ag{position:absolute;top:8px;left:8px}
.plato.toque{animation:toque .22s}@keyframes toque{50%{transform:scale(.97)}}
.it{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--linea)}
.it:last-child{border-bottom:0}
.it .nm{font-weight:650;line-height:1.25}.it .nt{font-size:12.5px;color:var(--arena);font-weight:650}
.it.anul .nm{text-decoration:line-through;color:var(--tinta4)}
.paso{display:flex;align-items:center;border:1px solid var(--linea2);border-radius:var(--r-s);background:var(--papel);overflow:hidden}
.paso button{width:36px;height:36px;border:0;background:var(--papel);font-size:19px;font-weight:700;color:var(--p4)}.paso button:hover{background:var(--p0)}
.paso span{min-width:24px;text-align:center;font-weight:800}
.qty{min-width:30px;height:30px;border-radius:8px;background:var(--p0);color:var(--p5);font-weight:800;display:grid;place-items:center}
.borrador{background:#FFFBF0;border:1px solid #EBD8A7;border-radius:var(--r);padding:4px 12px 12px;margin-bottom:12px}
.ronda-h{display:flex;justify-content:space-between;font-size:12px;color:var(--tinta3);font-weight:700;margin:12px 0 0;padding-bottom:4px;border-bottom:1px solid var(--linea)}
.tots{border-top:1px solid var(--linea2);margin-top:12px;padding-top:10px}
.tots .l{display:flex;justify-content:space-between;padding:2px 0}
.tots .gt{font-size:24px;font-weight:800;color:var(--p5)}
.acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.fbar{display:none}
@media (max-width:999px){.fbar{display:flex;position:fixed;left:12px;right:12px;bottom:calc(74px + env(safe-area-inset-bottom));z-index:25;gap:8px}.fbar .btn{flex:1;box-shadow:var(--sh2)}.fbar .btn.ver{flex:0 0 auto}}
.saldo{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--linea);border-radius:var(--r);overflow:hidden;margin-bottom:14px}
.saldo div{padding:10px 12px}.saldo div+div{border-left:1px solid var(--linea)}
.saldo b{display:block;font-size:19px;font-weight:800}
@media (max-width:560px){.saldo b{font-size:15.5px;white-space:nowrap}.saldo div{padding:9px 10px}}
.saldo .f b{color:var(--coral)}.saldo .f.cero b{color:var(--alga)}
.medios{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:6px;margin-bottom:12px}
.medios button{min-height:48px;border-radius:var(--r-s);border:1px solid var(--linea2);background:var(--papel);font-weight:700;font-size:14px}
.medios button[aria-pressed="true"]{border-color:var(--p5);background:var(--p5);color:#fff}
.vuelto{background:var(--alga-s);color:var(--alga);font-weight:750;border-radius:var(--r-s);padding:10px 12px;margin-bottom:12px}
.cpbox{border-top:1px solid var(--linea2);margin-top:16px;padding-top:14px}
.linea-i{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid var(--linea)}
.linea-i:last-child{border-bottom:0}

/* ---------- tablas ---------- */
.tabla{width:100%;border-collapse:collapse;font-size:14px}
.tabla th{text-align:left;font-size:12px;font-weight:700;color:var(--tinta3);padding:10px 12px;border-bottom:1px solid var(--linea2);white-space:nowrap;background:var(--papel)}
.tabla td{padding:11px 12px;border-bottom:1px solid var(--linea);vertical-align:middle}
.tabla tr:last-child td{border-bottom:0}
.tabla .r{text-align:right}.tabla .c{text-align:center}
.tabla tbody tr.clic{cursor:pointer}.tabla tbody tr.clic:hover td{background:#F8FBFF}
.tabla tr.anul td{color:var(--tinta4)}.tabla tr.anul .tx{text-decoration:line-through}
.twrap{overflow-x:auto}
.fecha{position:relative;display:inline-flex}.fecha input{position:absolute;inset:0;opacity:0;pointer-events:none;width:100%}
.isla{margin-left:14px}
.tabla .r,.tabla .num{white-space:nowrap}
@media (max-width:1280px){.tabla .om2{display:none}}
@media (max-width:760px){
  .tabla.resp thead{display:none}
  .tabla.resp tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 10px;padding:12px 14px;border-bottom:1px solid var(--linea)}
  .tabla.resp tbody tr:last-child{border-bottom:0}
  .tabla.resp td{padding:0;border:0}
  .tabla.resp td.om{display:none}
  .tabla.resp td.full{grid-column:1/-1}
}
.sello{display:inline-block;transform:none!important;border:1.5px solid var(--coral);color:var(--coral);font-weight:800;font-size:10.5px;letter-spacing:.08em;padding:1px 6px;border-radius:4px;transform:rotate(-4deg)}

/* ---------- cifras del día y gráficos ---------- */
.cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));border:1px solid var(--linea);border-radius:var(--r-s);background:var(--papel);overflow:hidden;margin-bottom:18px}
.cifras>div{padding:14px 16px;border-right:1px solid var(--linea);border-bottom:1px solid var(--linea);margin:0 -1px -1px 0}
.cifras .l{font-size:12.5px;color:var(--tinta3);font-weight:650}
.cifras .v{white-space:nowrap;font-size:22px;font-weight:800;margin-top:2px;letter-spacing:-.01em}
.cifras .v.mal{color:var(--coral)}.cifras .v.bien{color:var(--alga)}
.cifras .d{font-size:12.5px;font-weight:650;margin-top:2px;color:var(--tinta3)}
.sube{color:var(--alga)!important}.baja{color:var(--coral)!important}
.graf{display:flex;align-items:flex-end;gap:3px;height:180px;padding:8px 0 22px;position:relative;border-bottom:1px solid var(--linea)}
.graf .b{flex:1;position:relative;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-width:5px}
.graf .b i{display:block;border-radius:4px 4px 0 0;min-height:2px}
.graf .b em{position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);font-style:normal;font-size:10.5px;color:var(--tinta3);white-space:nowrap}
.graf .b .g{position:absolute;left:12%;right:12%;height:3px;background:var(--tinta);border-radius:2px}
.graf .b[data-t]:hover::after{content:attr(data-t);position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%);background:var(--tinta);color:#fff;font-size:12px;font-weight:600;padding:5px 8px;border-radius:6px;white-space:pre;z-index:3;pointer-events:none;text-align:center}
.leyenda{display:flex;gap:14px;font-size:12px;color:var(--tinta3);font-weight:600;flex-wrap:wrap}
.leyenda span{display:inline-flex;align-items:center;gap:6px}.leyenda i{width:12px;height:12px;border-radius:3px;display:inline-block}
.barra{height:8px;border-radius:4px;background:var(--p0);overflow:hidden}.barra i{display:block;height:100%;border-radius:4px}
.hb{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:9px 0;border-bottom:1px solid var(--linea);align-items:center}
.hb:last-child{border-bottom:0}.hb .barra{grid-column:1/-1}
.cols{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.c4{grid-column:span 4}.c5{grid-column:span 5}.c6{grid-column:span 6}.c7{grid-column:span 7}.c8{grid-column:span 8}.c12{grid-column:span 12}
@media (max-width:1100px){.c4,.c5,.c6,.c7,.c8{grid-column:span 12}}

/* ---------- inventario ---------- */
.nivel{display:flex;align-items:center;gap:10px;min-width:150px}
.nivel .barra{flex:1;min-width:60px}
.nivel b{min-width:70px;text-align:right}

/* ---------- carta (administración) ---------- */
.carta-l{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;align-items:start}
.carta-l aside{position:sticky;top:16px;display:flex;flex-direction:column;gap:2px}
.carta-l aside button{display:flex;justify-content:space-between;width:100%;min-height:40px;padding:0 12px;border:0;border-radius:8px;background:transparent;font-weight:650;color:var(--tinta2);text-align:left;align-items:center;gap:8px}
.carta-l aside button:hover{background:var(--tierra2)}
.carta-l aside button[aria-pressed="true"]{background:var(--p5);color:#fff}
@media (max-width:860px){.carta-l{grid-template-columns:minmax(0,1fr)}.carta-l aside{position:static;flex-direction:row;overflow-x:auto;gap:6px;scrollbar-width:none}.carta-l aside button{width:auto;flex:none;border:1px solid var(--linea2);border-radius:999px;background:var(--papel)}}
.pl{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--linea)}
.pl:last-child{border-bottom:0}
.pl .ft{width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--p0);display:grid;place-items:center;color:var(--p3)}
.pl .nm{cursor:pointer}.pl .nm:hover b{color:var(--p4)}
.pl .ctl{display:flex;align-items:center;gap:16px}
.pl .ctl label{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;font-weight:650;color:var(--tinta3);cursor:pointer}
@media (max-width:640px){.pl{grid-template-columns:48px minmax(0,1fr)}.pl .ft{width:48px;height:48px}.pl .ctl{grid-column:1/-1;justify-content:flex-end}}
.receta-r{display:grid;grid-template-columns:minmax(0,1fr) 120px 44px;gap:8px;margin-bottom:8px}

/* ---------- cocina (mar de noche) ---------- */
body.kds{background:var(--abismo);color:#E6EAFB}
body.kds main{margin-left:0;max-width:none;padding:14px 16px 40px}
body.kds .rail,body.kds .top,body.kds .tabbar{display:none}
.kbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.kbar h1{color:#fff;font-size:24px}
.kbar .reloj{font-size:24px;font-weight:800;color:var(--p2)}
.kbar .seg{background:#1C1680;border-color:#2C2697}.kbar .seg button{color:#C9CFF2}.kbar .seg button:hover{background:#25209A}.kbar .seg button[aria-pressed="true"]{background:var(--p4);color:#fff}
.kbar .btn{background:#1C1680;border-color:#2C2697;color:#E6EAFB}.kbar .btn:hover{background:#25209A}
.kbar .escala{color:#9EA6E0}.kbar .escala i{border-color:#2C2697}
.kgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;align-items:start}
.kt{background:#fff;color:var(--tinta);border-radius:var(--r);overflow:hidden;outline:1px solid rgba(255,255,255,.14)}
.kt.nuevo .kh{animation:llega 1s 3}@keyframes llega{50%{filter:brightness(1.35)}}
.kt .kh{display:flex;align-items:center;gap:8px;padding:11px 12px;background:var(--p0)}
.kt .kh .m{font:800 24px/1 var(--marca);color:var(--p5)}
.kt .kh .t{margin-left:auto;font-size:19px;font-weight:800;padding:3px 10px;border-radius:8px;background:#fff;color:var(--p5);min-width:66px;text-align:center}
.kt.z1 .kh{background:var(--p1)}.kt.z2 .kh{background:var(--p2)}
.kt.z3 .kh{background:var(--p3);color:#fff}.kt.z4 .kh{background:var(--p4);color:#fff}.kt.z5 .kh{background:var(--p5);color:#fff}
.kt.z3 .kh .m,.kt.z4 .kh .m,.kt.z5 .kh .m{color:#fff}
.kt.z5 .kh .t{background:var(--coral);color:#fff}
.kt.z3 .kh .tag,.kt.z4 .kh .tag,.kt.z5 .kh .tag{background:rgba(255,255,255,.2);color:#fff}
.kt.ls{opacity:.85}.kt.ls .kh{background:var(--alga-s)}
.kt .ks{padding:7px 12px;font-size:13px;color:var(--tinta3);font-weight:600;border-bottom:1px solid var(--linea)}
.kt ul{list-style:none;margin:0;padding:2px 12px}
.kt li{display:grid;grid-template-columns:34px 1fr 28px;gap:8px;align-items:start;padding:10px 0;border-bottom:1px solid var(--linea);cursor:pointer}
.kt li:last-child{border-bottom:0}
.kt li .q{font:800 22px/1 var(--marca);color:var(--p5)}
.kt li .n{font-weight:750;font-size:17px;line-height:1.2}
.kt li .no{display:block;font-size:14px;font-weight:700;color:var(--arena);background:var(--arena-s);border-radius:5px;padding:1px 6px;margin-top:4px}
.kt li .ck{width:26px;height:26px;border-radius:7px;border:2px solid var(--linea2);display:grid;place-items:center;color:#fff}
.kt li.hecho .n{text-decoration:line-through;color:var(--tinta4)}.kt li.hecho .ck{background:var(--alga);border-color:var(--alga)}
.kt li.prep .ck{border-color:var(--arena);background:var(--arena-s)}
.kt .kf{display:flex;gap:6px;padding:10px 12px;background:#F7F9FD;border-top:1px solid var(--linea)}
.kt .kf .btn{flex:1;min-height:48px}.kt .kf .btn.ico{flex:0 0 48px}
body.kds .aviso,body.kds #hoja .box{box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}
.kvacio{text-align:center;padding:70px 10px;color:#9EA6E0;font-size:19px;font-weight:700}
.ktit{font-weight:750;font-size:15px;color:var(--p2);margin:22px 0 10px}

/* ---------- hoja (diálogo) ---------- */
#hoja{position:fixed;inset:0;z-index:60;background:rgba(14,26,58,.48);display:flex;align-items:flex-end;justify-content:center}
#hoja .box{background:var(--papel);width:min(560px,100%);max-height:92vh;overflow:auto;border-radius:18px 18px 0 0;padding:20px 18px calc(18px + env(safe-area-inset-bottom));animation:sube .2s cubic-bezier(.2,.8,.2,1)}
#hoja .box.ancha{width:min(780px,100%)}
@media (min-width:700px){#hoja{align-items:center}#hoja .box{border-radius:18px}}
@keyframes sube{from{transform:translateY(24px);opacity:0}}
#hoja h2{margin-bottom:14px}
.hh{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px}.hh h2{margin:0;flex:1}.hh .btn{margin:-6px -6px 0 0}
.nchips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.nchips .chip{min-height:34px;font-size:13px}
.kpad{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:6px 0 16px}.kpad button{min-height:52px;border-radius:var(--r-s);border:1px solid var(--linea2);background:var(--papel);font:800 21px var(--marca);color:var(--p5)}
.kpad button[aria-pressed="true"]{background:var(--p5);color:#fff;border-color:var(--p5)}

/* ---------- avisos ---------- */
#avisos{position:fixed;top:calc(12px + env(safe-area-inset-top));left:12px;right:12px;z-index:90;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}
.aviso{pointer-events:auto;width:min(440px,100%);display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:var(--r);background:var(--tinta);color:#fff;box-shadow:var(--sh2);font-weight:600;animation:sube .22s cubic-bezier(.2,.8,.2,1)}
.aviso .ic{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;background:rgba(255,255,255,.14)}
.aviso .ic svg{width:16px;height:16px}
.aviso.ok .ic{background:var(--alga)}.aviso.err{background:#7A1E10}.aviso.err .ic{background:var(--coral)}
.aviso.listo{background:var(--alga);font-size:16.5px}.aviso.listo .ic{background:#fff;color:var(--alga)}
.aviso.sale{opacity:0;transform:translateY(-8px);transition:.25s}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* =================== Salón claro =================== */
body{font-family:var(--font)}
.btn{border-radius:var(--r-s);font-weight:700}
.btn.pri{box-shadow:0 1px 2px rgba(16,24,40,.08)}
.in{border-color:var(--linea2)}
.chip{border-color:var(--linea2);font-weight:700}
.chip[aria-pressed="true"]{background:var(--p4);border-color:var(--p4)}
.seg{background:#EAEDF2;border:0;padding:3px;border-radius:11px}
.seg button{color:var(--tinta3);font-weight:700;border-radius:8px}
.seg button:hover{background:rgba(255,255,255,.6);color:var(--tinta)}
.seg button[aria-pressed="true"]{background:#fff;color:var(--tinta);box-shadow:0 1px 3px rgba(16,24,40,.12)}
.tag{border-radius:7px}
.tag.hondo{background:var(--p4)}
.panel{border-radius:var(--r-l);border-color:var(--linea)}
.cifras{border-radius:var(--r-l)}
.cifras .v{font-weight:800;letter-spacing:-.02em}
/* menú lateral blanco */
.rail{background:#fff;color:var(--tinta3);border-right:1px solid var(--linea)}
.rail .marca{color:var(--p4)}
.rail .marca span{font-family:var(--marca-logo)}
.rail .marca small{color:var(--tinta3)}
.rail .marca img{background:var(--p0)}
.rail nav button{color:var(--tinta3);font-weight:650}
.rail nav button:hover{background:var(--tierra);color:var(--tinta)}
.rail nav button[aria-current="page"]{background:#EAF1FD;color:var(--p4);font-weight:800}
.rail .sep{background:var(--linea)}
.rail .pie{border-top-color:var(--linea)}
.rail .pie b{color:var(--tinta)}
.rail .pie button{color:var(--tinta3)}.rail .pie button:hover{background:var(--tierra);color:var(--tinta)}
.av{background:#EAF1FD;color:var(--p4)}
@media (max-width:999px){
  .top{background:#fff;color:var(--tinta);border-bottom:1px solid var(--linea)}
  .top .marca{color:var(--p4);font-family:var(--marca-logo)}
  .top .marca img{background:var(--p0)}
  .tabbar button[aria-current="page"]{color:var(--p4);background:#EAF1FD}
}
/* leyenda de tiempos */
.escala{gap:4px 12px;color:var(--tinta3);font-weight:650;white-space:normal;flex-wrap:wrap}
.cab .izq{min-width:0;flex:1}
@media (max-width:560px){.escala{font-size:11.5px}}
.escala>span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}.escala .pt{width:9px;height:9px;border-radius:50%;display:inline-block}
.pt.ok{background:var(--verde)}.pt.warn{background:var(--ambar)}.pt.mal{background:var(--coral)}
/* mesas */
.zh{color:var(--tinta3);font-size:13px}
.mesa{background:transparent;border:1.5px dashed var(--linea2);border-radius:14px;color:var(--tinta)}
.mesa .n{font:800 24px/1 var(--font);color:var(--tinta4);letter-spacing:-.02em}
.mesa .est{color:var(--tinta4)}
.mesa:hover{border-color:var(--p3)}
.mesa.oc{background:#fff;border:1px solid var(--linea)}
.mesa.oc .n{color:var(--tinta)}
.mesa.oc:hover{border-color:var(--linea2);box-shadow:0 4px 12px -6px rgba(16,24,40,.15)}
.mesa .who{color:var(--tinta3);font-weight:600}
.mesa .pie .num{color:var(--tinta);font-weight:800}
.mesa.st-mal{border:1.5px solid var(--coral)}
.mesa.cuenta{background:#fff;border:1.5px solid var(--ambar)}
.mesa.listo{outline:0;border:1.5px solid var(--verde)}
.anillo{position:absolute;top:10px;right:10px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:11.5px;font-weight:800;color:var(--c)}
.anillo::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--c) calc(var(--p) * 360deg),#E9ECF1 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3.5px));mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3.5px))}
.anillo b{position:relative}
.anillo.ok{--c:var(--verde)}.anillo.warn{--c:var(--ambar)}.anillo.warn b{color:var(--arena)}.anillo.mal{--c:var(--coral)}
@media (max-width:560px){.anillo{top:7px;right:7px;width:32px;height:32px;font-size:10.5px}.mesa .n{font-size:21px}}
/* pedido */
.plato{border-radius:14px}
.plato:hover{border-color:var(--linea2);box-shadow:0 4px 12px -6px rgba(16,24,40,.15)}
.plato .cnt{background:var(--p4);box-shadow:none}
.qty{background:#EAF1FD;color:var(--p4)}
.tots .gt{color:var(--tinta)}
.medios button[aria-pressed="true"]{background:var(--p4);border-color:var(--p4)}
.kpad button{font:800 20px var(--font);color:var(--tinta)}
.kpad button[aria-pressed="true"]{background:var(--p4);border-color:var(--p4)}
.borrador{background:#FFFAEB;border-color:#FDE3A7}
/* carta */
.carta-l aside button[aria-pressed="true"]{background:#EAF1FD;color:var(--p4)}
.pl .ft{background:#EAF1FD;color:var(--p4)}
/* cocina: misma luz que el salón, legible de lejos */
body.kds{background:var(--tierra);color:var(--tinta)}
.kbar h1{color:var(--tinta)}
.kbar .reloj{color:var(--tinta3)}
.kbar .seg{background:#EAEDF2}.kbar .seg button{color:var(--tinta3)}.kbar .seg button:hover{background:rgba(255,255,255,.6)}.kbar .seg button[aria-pressed="true"]{background:#fff;color:var(--tinta)}
.kbar .btn{background:#fff;border-color:var(--linea2);color:var(--tinta)}.kbar .btn:hover{background:#F9FAFB}
.kbar .escala{color:var(--tinta3)}
.kt{outline:0;border:1px solid var(--linea);border-radius:14px}
.kt .kh{background:#F8FAFC;border-bottom:1px solid var(--linea)}
.kt .kh .m{font:800 22px/1 var(--font);color:var(--tinta);letter-spacing:-.01em}
.kt .kh .t{background:#E3F7EE;color:#0F7A4D}
.kt.st-warn{border-color:var(--ambar)}.kt.st-warn .kh{background:#FFF7E6}.kt.st-warn .kh .t{background:var(--ambar);color:#fff}
.kt.st-mal{border:1.5px solid var(--coral)}.kt.st-mal .kh{background:#FDECEC}.kt.st-mal .kh .t{background:var(--coral);color:#fff}
.kt.ls .kh{background:#E3F7EE}
.kt li .q{font:800 20px/1 var(--font);color:var(--p4)}
.kt .kf{background:#fff}
.kvacio{color:var(--tinta3)}
.ktit{color:var(--tinta3)}
body.kds .aviso,body.kds #hoja .box{box-shadow:var(--sh2)}
/* ingreso */
#login{background:var(--tierra)}
.lg form{box-shadow:0 12px 32px -16px rgba(16,24,40,.25);border-radius:18px}
.lg img{mix-blend-mode:multiply}

/* =================== Movimiento (sistema de motion) =================== */
:root{--t-rap:140ms;--t-med:220ms;--t-len:360ms;--e-out:cubic-bezier(.22,1,.36,1);--e-in:cubic-bezier(.4,0,1,1);--e-spring:cubic-bezier(.34,1.56,.64,1)}
@property --p{syntax:'<number>';inherits:false;initial-value:0}
.btn,.chip,.seg button,.medios button,.kpad button,.mesa,.plato{transition:transform var(--t-rap) var(--e-out),background-color var(--t-rap),border-color var(--t-rap),box-shadow var(--t-med) var(--e-out),color var(--t-rap)}
.btn:active,.chip:active,.medios button:active,.kpad button:active{transform:scale(.97)}
.mesa:active,.plato:active{transform:scale(.98)}
/* al cambiar de pantalla, el contenido entra una sola vez */
main.entra>*{animation:entra var(--t-len) var(--e-out) both}
main.entra>*:nth-child(2){animation-delay:30ms}main.entra>*:nth-child(3){animation-delay:60ms}main.entra>*:nth-child(4){animation-delay:90ms}main.entra>*:nth-child(n+5){animation-delay:120ms}
@keyframes entra{from{opacity:0;transform:translateY(6px)}}
main.entra .mgrid>.mesa{animation:entra var(--t-len) var(--e-out) both}
main.entra .mgrid>.mesa:nth-child(2){animation-delay:20ms}main.entra .mgrid>.mesa:nth-child(3){animation-delay:40ms}main.entra .mgrid>.mesa:nth-child(4){animation-delay:60ms}main.entra .mgrid>.mesa:nth-child(5){animation-delay:80ms}main.entra .mgrid>.mesa:nth-child(6){animation-delay:100ms}main.entra .mgrid>.mesa:nth-child(n+7){animation-delay:120ms}
/* el anillo de tiempo se dibuja al entrar */
main.entra .anillo::before{animation:anillo 700ms var(--e-out) 120ms both}
@keyframes anillo{from{--p:0}}
/* platos listos: un latido suave para que el mozo los vea */
.mesa.listo{animation:latido-v 2.4s var(--e-out) infinite}
@keyframes latido-v{0%,100%{box-shadow:0 0 0 0 rgba(34,160,107,0)}50%{box-shadow:0 0 0 6px rgba(34,160,107,.16)}}
.latido{animation:latido-a 1.6s ease-in-out infinite}
@keyframes latido-a{50%{opacity:.55}}
/* contadores que cambian */
.cnt.pop{animation:pop 420ms var(--e-spring)}
@keyframes pop{0%{transform:scale(.4)}60%{transform:scale(1.2)}100%{transform:scale(1)}}
/* hoja con resorte y fondo que aparece */
#hoja{animation:velo var(--t-med) ease-out}
@keyframes velo{from{background:rgba(16,24,40,0)}}
#hoja .box{animation:hoja var(--t-len) var(--e-out)}
@keyframes hoja{from{transform:translateY(32px);opacity:0}}
@media (min-width:700px){#hoja .box{animation-name:hoja-c}@keyframes hoja-c{from{transform:translateY(10px) scale(.98);opacity:0}}}
/* avisos: bajan con resorte; el visto se dibuja */
.aviso{animation:aviso 420ms var(--e-spring)}
@keyframes aviso{from{transform:translateY(-16px) scale(.96);opacity:0}}
.aviso.ok .ic path{stroke-dasharray:24;stroke-dashoffset:24;animation:traza 360ms var(--e-out) 160ms forwards}
@keyframes traza{to{stroke-dashoffset:0}}
/* cocina: la comanda nueva cae en su lugar */
.kt.nuevo{animation:cae 520ms var(--e-spring)}
@keyframes cae{from{transform:translateY(-14px);opacity:0}}
/* banda de pedidos por confirmar */
.banda-web{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:#FFF7E6;border:1.5px solid var(--ambar);border-radius:14px;padding:12px 14px;margin:0 0 14px;color:var(--tinta);flex-wrap:wrap;animation:entra var(--t-len) var(--e-out)}
.banda-web .muted{flex:1}
.punto{width:10px;height:10px;border-radius:50%;background:var(--ambar);flex:none;box-shadow:0 0 0 0 rgba(245,165,36,.6);animation:onda 1.6s ease-out infinite}
@keyframes onda{to{box-shadow:0 0 0 10px rgba(245,165,36,0)}}
.web-pend{background:#FFF7E6;border:1.5px solid var(--ambar);border-radius:14px;padding:12px 14px;margin-bottom:12px}
.web-pend .linea-i{border-color:rgba(245,165,36,.25)}
.web-cli{background:#F8FAFC;border:1px solid var(--linea);border-radius:14px;padding:12px 14px;margin-bottom:12px}
/* links y accesos */
.link-r{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--linea)}
.link-r:last-child{border-bottom:0}
.link-ic{width:44px;height:44px;border-radius:12px;background:#EAF1FD;color:var(--p4);display:grid;place-items:center}
.link-u{color:var(--tinta4);word-break:break-all;margin-top:4px}
.link-acc{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
@media (max-width:760px){.link-r{grid-template-columns:44px minmax(0,1fr)}.link-acc{grid-column:1/-1;justify-content:flex-start}}
/* =================== App de mozos =================== */
.modo-mozo .rail{display:none}
.modo-mozo main{margin-left:0;max-width:760px;margin:0 auto;padding:14px 16px calc(96px + env(safe-area-inset-bottom))}
.modo-mozo .top{display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid var(--linea);padding:10px 14px;padding-top:max(10px,env(safe-area-inset-top))}
.modo-mozo .top .marca{display:flex;align-items:center;gap:8px;font:800 19px/1 var(--marca-logo);color:var(--p4)}
.modo-mozo .top .marca img{width:30px;height:30px;border-radius:8px}
.modo-mozo .tabbar{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid var(--linea);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
.modo-mozo .tabbar button{background:none;border:0;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11.5px;font-weight:700;color:var(--tinta3);padding:6px 0;border-radius:10px;position:relative}
.modo-mozo .tabbar button svg{width:23px;height:23px}
.modo-mozo .tabbar button[aria-current="page"]{color:var(--p4);background:#EAF1FD}
.modo-mozo .tabbar .cnt{position:absolute;top:2px;left:calc(50% + 6px);min-width:18px;height:18px;border-radius:9px;background:var(--coral);color:#fff;font-size:10.5px;font-weight:800;display:grid;place-items:center;padding:0 5px}
.modo-mozo .ogrid{grid-template-columns:minmax(0,1fr)}.modo-mozo .ogrid>section:last-child{position:static}
.modo-mozo .otabs{display:flex;margin-bottom:12px;position:sticky;top:52px;z-index:5;background:var(--tierra);padding:4px 0}.modo-mozo .otabs .seg{width:100%}.modo-mozo .otabs .seg button{flex:1;justify-content:center}
.modo-mozo .ogrid>section{display:none}.modo-mozo .ogrid>section.on{display:block}
.modo-mozo .fbar{display:flex;position:fixed;left:12px;right:12px;bottom:calc(74px + env(safe-area-inset-bottom));z-index:25;gap:8px;max-width:736px;margin:0 auto}.modo-mozo .fbar .btn{flex:1;box-shadow:var(--sh2);white-space:nowrap}.modo-mozo .fbar .btn.ver{flex:0 0 auto}
.modo-mozo .mgrid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}
/* teclado del PIN */
.pin-puntos{display:flex;justify-content:center;gap:12px;margin:6px 0 14px}
.pin-puntos i{width:13px;height:13px;border-radius:50%;border:2px solid var(--linea2);transition:background var(--t-rap),border-color var(--t-rap),transform var(--t-med) var(--e-spring)}
.pin-puntos i.on{background:var(--p4);border-color:var(--p4);transform:scale(1.15)}
.pinpad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pinpad button{min-height:60px;border-radius:16px;border:1px solid var(--linea);background:#F8FAFC;font:800 24px var(--font);color:var(--tinta);display:grid;place-items:center;transition:transform var(--t-rap) var(--e-out),background var(--t-rap)}
.pinpad button:active{transform:scale(.94);background:#EAF1FD}
.pinpad .ent{background:var(--p4);border-color:var(--p4);color:#fff}.pinpad .ent:active{background:#063D93}

/* =================== Estructura tipo SWOX =================== */
.rail{padding:18px 12px}
.rail .marca{padding:4px 10px 14px}
.nav-sec{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--tinta4);padding:16px 12px 6px}
.nav-sec:first-child{padding-top:4px}
.rail nav button{min-height:40px;position:relative}
.rail nav button[aria-current="page"]::before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--p4)}
.rail nav{overflow-y:auto;flex:1;scrollbar-width:none}.rail nav::-webkit-scrollbar{display:none}
/* barra superior */
.barra-sup{display:none}
@media (min-width:1000px){
  .barra-sup{display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:20;margin-left:var(--rail);padding:12px 30px;background:color-mix(in srgb,var(--tierra) 86%,transparent);backdrop-filter:saturate(1.3) blur(10px);-webkit-backdrop-filter:saturate(1.3) blur(10px);border-bottom:1px solid var(--linea)}
  main{padding-top:20px}
}
.bs-busca{display:flex;align-items:center;gap:10px;min-width:320px;min-height:42px;padding:0 10px 0 14px;border:1px solid var(--linea2);border-radius:12px;background:var(--papel);color:var(--tinta3);font-weight:600;transition:border-color var(--t-rap)}
.bs-busca:hover{border-color:var(--linea3)}
.bs-busca span{flex:1;text-align:left}
kbd{font:700 11px var(--font);border:1px solid var(--linea2);border-radius:6px;padding:2px 6px;color:var(--tinta3);background:var(--tierra)}
.bs-vivo{width:42px;height:42px;display:grid;place-items:center}
body.kds .barra-sup,.modo-mozo .barra-sup{display:none}
/* buscador */
.br{display:flex;flex-direction:column;gap:2px;max-height:60vh;overflow:auto}
.br-i{display:flex;align-items:center;gap:12px;text-align:left;border:0;background:transparent;border-radius:10px;padding:10px 12px;color:var(--tinta)}
.br-i:hover,.br-i.sel{background:#EAF1FD}
.br-i svg{color:var(--p4)}
.br-i small{display:block;color:var(--tinta3);font-size:12.5px}
/* tarjetas de resumen (Hoy) */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
@media (max-width:1180px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.kpis{grid-template-columns:minmax(0,1fr);gap:10px}.kpi{min-height:0}.kv{font-size:24px}.spark{height:40px}.gauge{width:90px;height:48px}}
.kpi{position:relative;text-align:left;background:var(--papel);border:1px solid var(--linea);border-radius:18px;padding:16px 16px 10px;display:flex;flex-direction:column;gap:4px;overflow:hidden;color:var(--tinta);min-height:168px;transition:border-color var(--t-rap),transform var(--t-med) var(--e-out),box-shadow var(--t-med) var(--e-out)}
.kpi:hover{border-color:var(--linea2);transform:translateY(-2px);box-shadow:0 12px 28px -18px rgba(16,24,40,.35)}
.kpi.destaca{border:1.5px solid color-mix(in srgb,var(--p4) 45%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--p4) 7%,var(--papel)),var(--papel) 70%)}
.kh{display:flex;align-items:center;gap:10px}
.ki{width:34px;height:34px;border-radius:10px;background:#EAF1FD;color:var(--p4);display:grid;place-items:center;flex:none}
.kl{font-size:13.5px;font-weight:700;color:var(--tinta3);line-height:1.2;flex:1}
.kv{font-size:28px;font-weight:800;letter-spacing:-.03em;margin-top:6px;white-space:nowrap}
.kv.mal{color:var(--coral)}
.ks{font-size:12.5px;color:var(--tinta3);font-weight:600;min-height:18px}
.dl{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:800;padding:3px 8px;border-radius:999px;white-space:nowrap}
.dl svg{width:13px;height:13px}
.dl.up{background:var(--alga-s);color:var(--alga)}.dl.dn{background:var(--coral-s);color:var(--coral)}.dl.warn{background:var(--arena-s);color:var(--arena)}.dl.nuevo{background:#EAF1FD;color:var(--p4)}
.spark{width:100%;height:58px;margin-top:auto;display:block}
.spark .sl{stroke-dasharray:1;stroke-dashoffset:0}
main.entra .spark .sl{animation:dibuja 900ms var(--e-out) 150ms both}
@keyframes dibuja{from{stroke-dashoffset:1}}
.gauge{width:120px;height:64px;margin:auto 0 0 auto;display:block}
main.entra .gauge .ga{animation:gauge 900ms var(--e-out) 150ms both}
@keyframes gauge{from{stroke-dasharray:0 100}}
.ocupa{display:flex;flex-wrap:wrap;gap:4px;margin-top:auto;padding:10px 0 6px}
.ocupa i{width:14px;height:14px;border-radius:4px;border:1.5px dashed var(--linea2)}
.ocupa i.oc{background:var(--linea2);border:0}.ocupa i.st-ok{background:var(--verde);border:0}.ocupa i.st-warn{background:var(--ambar);border:0}.ocupa i.st-mal{background:var(--coral);border:0}
.fila-m{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--linea);cursor:pointer;position:relative;transition:background var(--t-rap)}
.fila-m:hover{background:var(--tierra)}
.fila-m:last-child{border-bottom:0}
.fila-m .anillo{position:relative;top:auto;right:auto;flex:none}
.anillo-v{width:38px;height:38px;border-radius:50%;border:3.5px solid var(--linea);display:grid;place-items:center;color:var(--verde);flex:none}
.fm-t{flex:1;min-width:0;display:flex;flex-direction:column}
/* ajustes con menú lateral */
.aj-l{display:grid;grid-template-columns:230px minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:1320px){.aj-c .link-r{grid-template-columns:44px minmax(0,1fr)}.aj-c .link-acc{grid-column:2;justify-content:flex-start}}
.aj-nav{position:sticky;top:84px;display:flex;flex-direction:column;gap:2px;background:var(--papel);border:1px solid var(--linea);border-radius:16px;padding:8px}
.aj-nav button{display:flex;align-items:center;gap:10px;border:0;background:transparent;border-radius:10px;min-height:42px;padding:0 12px;font-weight:650;color:var(--tinta2);text-align:left}
.aj-nav button:hover{background:var(--tierra)}
.aj-nav button[aria-current="true"]{background:#EAF1FD;color:var(--p4);font-weight:800}
@media (max-width:860px){.aj-l{grid-template-columns:minmax(0,1fr)}.aj-nav{position:static;flex-direction:row;overflow-x:auto;scrollbar-width:none}.aj-nav button{flex:none}}
/* usuarios en tarjetas */
.u-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.u-card{background:var(--papel);border:1px solid var(--linea);border-radius:18px;padding:16px;display:flex;flex-direction:column;transition:border-color var(--t-rap),opacity var(--t-med)}
.u-card:hover{border-color:var(--linea2)}
.u-card.off{opacity:.6}
.u-card.dueno{border:1.5px solid color-mix(in srgb,var(--p4) 40%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--p4) 6%,var(--papel)),var(--papel) 60%)}
.u-h{display:flex;align-items:center;gap:12px}
.u-h>div{flex:1;min-width:0}
.u-h .av{width:44px;height:44px;font-size:17px}
.av.g{background:var(--p4);color:#fff}
.u-perms{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin:14px 0 12px}
.u-perms span{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:650;color:var(--tinta2)}
.u-perms svg{color:var(--tinta3)}
.u-f{display:flex;align-items:center;gap:6px;margin-top:auto;padding-top:10px;border-top:1px solid var(--linea)}
.tag.rol-mozo{background:#EAF1FD;color:var(--p4)}.tag.rol-cajero{background:var(--alga-s);color:var(--alga)}.tag.rol-cocina{background:var(--arena-s);color:var(--arena)}.tag.rol-admin{background:var(--coral-s);color:var(--coral)}
.pasos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:760px){.pasos{grid-template-columns:minmax(0,1fr)}}
.pasos div{display:flex;gap:12px}
.pasos span{width:26px;height:26px;border-radius:8px;background:#EAF1FD;color:var(--p4);display:grid;place-items:center;font-weight:800;flex:none}
.pasos p{margin:0;font-size:14px;color:var(--tinta2)}
/* apariencia */
.temas{display:flex;gap:12px;flex-wrap:wrap}
.temas button{display:flex;flex-direction:column;align-items:flex-start;gap:8px;border:1.5px solid var(--linea2);background:var(--papel);border-radius:16px;padding:12px;font-weight:700;color:var(--tinta);width:200px}
.temas button[aria-pressed="true"]{border:2px solid var(--p4)}
.temas button svg{display:inline}
.mu{width:100%;height:84px;border-radius:10px;display:grid;grid-template-columns:30% 1fr;grid-template-rows:1fr 1fr;gap:5px;padding:6px}
.mu i:first-child{grid-row:1/3;border-radius:6px}.mu i{border-radius:6px}
.mu.claro{background:#F2F4F7}.mu.claro i{background:#fff;border:1px solid #E4E7EC}
.mu.oscuro{background:#0B1220}.mu.oscuro i{background:#16213A;border:1px solid #233154}

/* pisos y mesas */
.pisos{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px;margin-bottom:12px}
.piso{background:var(--papel);border:1px solid var(--linea);border-radius:18px;padding:14px 16px}
.piso-h{display:flex;align-items:center;gap:10px}
.piso-h .in{max-width:240px;font-weight:700}
.piso-n{width:30px;height:30px;border-radius:9px;background:#EAF1FD;color:var(--p4);font-weight:800;display:grid;place-items:center;flex:none}
.piso-c{display:flex;align-items:center;gap:12px;margin:14px 0 10px}
.paso.grande button{width:46px;height:46px;font-size:24px}.paso.grande span{min-width:40px;font-size:18px}
.mini-mesas{display:flex;flex-wrap:wrap;gap:6px}
.mm{display:inline-flex;align-items:center;gap:2px;min-width:40px;height:34px;padding:0 4px 0 10px;border-radius:9px;border:1.5px dashed var(--linea2);font-weight:800;font-size:14px;color:var(--tinta2)}
.mm.oc{border:1.5px solid var(--p4);color:var(--p4);padding-right:10px}
.mm button{border:0;background:transparent;color:var(--tinta4);width:22px;height:22px;border-radius:6px;display:grid;place-items:center;padding:0}
.mm button:hover{background:var(--coral-s);color:var(--coral)}
.guardar-pisos{position:sticky;bottom:12px;background:var(--papel);border:1px solid var(--linea);border-radius:14px;padding:10px 12px;box-shadow:var(--sh2)}
@media (max-width:999px){.guardar-pisos{bottom:84px}}
html[data-tema="oscuro"] .piso-n{background:#16284D;color:#8DB8FF}

/* campana y avisos */
.campana{position:relative;width:42px;height:42px;border-radius:12px;border:0;background:transparent;color:var(--tinta2);display:grid;place-items:center}
.campana:hover{background:var(--tierra2)}
.campana .cnt{position:absolute;top:4px;right:3px;min-width:18px;height:18px;border-radius:9px;background:var(--coral);color:#fff;font-size:10.5px;font-weight:800;display:grid;place-items:center;padding:0 5px}
.campana.suena svg{animation:suena 700ms var(--e-out)}
@keyframes suena{15%{transform:rotate(14deg)}30%{transform:rotate(-12deg)}45%{transform:rotate(8deg)}60%{transform:rotate(-5deg)}75%{transform:rotate(2deg)}}
.top .campana{width:38px;height:38px}
.notis{display:flex;flex-direction:column;gap:2px;max-height:60vh;overflow:auto}
.noti{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:10px;align-items:start;text-align:left;border:0;background:transparent;border-radius:12px;padding:10px;color:var(--tinta)}
.noti:hover{background:var(--tierra)}
.noti small{display:block;color:var(--tinta3);font-size:12.5px}
.noti time{font-size:12px;color:var(--tinta4)}
.punto-n{width:8px;height:8px;border-radius:50%;margin-top:6px;background:transparent}
.noti.nueva .punto-n{background:var(--p4)}
.push-f{display:flex;align-items:center;gap:12px;border:1px solid var(--linea);border-radius:14px;padding:12px;margin-bottom:12px}
.push-f>span{width:36px;height:36px;border-radius:10px;background:#EAF1FD;color:var(--p4);display:grid;place-items:center;flex:none}
.push-f>div{flex:1;min-width:0}.push-f small{display:block;color:var(--tinta3);font-size:12.5px}
.push-f.ok>span{background:var(--alga-s);color:var(--alga)}
.push-ofrece{position:fixed;z-index:70;left:12px;right:12px;bottom:calc(84px + env(safe-area-inset-bottom));max-width:520px;margin:0 auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--papel);border:1px solid var(--linea2);border-radius:16px;padding:12px 14px;box-shadow:var(--sh2);animation:aviso 420ms var(--e-spring)}
.push-ofrece>span{width:36px;height:36px;border-radius:10px;background:#EAF1FD;color:var(--p4);display:grid;place-items:center;flex:none}
.push-ofrece>div{flex:1;min-width:200px}.push-ofrece small{display:block;color:var(--tinta3);font-size:12.5px}
@media (min-width:1000px){.push-ofrece{left:auto;right:24px;bottom:24px}}
.tag.sup{background:#EAF1FD;color:var(--p4);margin-left:4px}
html[data-tema="oscuro"] .push-f>span,html[data-tema="oscuro"] .push-ofrece>span,html[data-tema="oscuro"] .tag.sup{background:#16284D;color:#8DB8FF}

/* =================== Tema oscuro (azules de Pescaderos) =================== */
html[data-tema="oscuro"]{color-scheme:dark;
  --tierra:#0B1220;--tierra2:#141E33;--papel:#111A2E;
  --tinta:#E9EEF8;--tinta2:#C5CEE0;--tinta3:#8C98B2;--tinta4:#5F6B86;
  --linea:#1E2A44;--linea2:#2A3757;--linea3:#44547A;
  --p0:#132447;--p1:#1A3263;--p2:#244A8F;--p4:#3D82F0;--p3:#4C93E0;
  --alga:#5FD39B;--alga-s:#0E2F24;--coral:#FF6B6E;--coral-s:#3A1720;--arena:#F5B54A;--arena-s:#33260C;--verde:#2FBF7E;--ambar:#F5A524;
  --sh2:0 18px 44px -16px rgba(0,0,0,.7)}
html[data-tema="oscuro"] body{background:var(--tierra)}
html[data-tema="oscuro"] .rail,html[data-tema="oscuro"] .top,html[data-tema="oscuro"] .tabbar,html[data-tema="oscuro"] .modo-mozo .top,html[data-tema="oscuro"] .modo-mozo .tabbar{background:#0E1628;border-color:var(--linea)}
html[data-tema="oscuro"] .rail nav button[aria-current="page"],html[data-tema="oscuro"] .aj-nav button[aria-current="true"],html[data-tema="oscuro"] .carta-l aside button[aria-pressed="true"],html[data-tema="oscuro"] .tabbar button[aria-current="page"],html[data-tema="oscuro"] .br-i:hover,html[data-tema="oscuro"] .br-i.sel{background:#16284D;color:#8DB8FF}
html[data-tema="oscuro"] .ki,html[data-tema="oscuro"] .av,html[data-tema="oscuro"] .qty,html[data-tema="oscuro"] .link-ic,html[data-tema="oscuro"] .pl .ft,html[data-tema="oscuro"] .pasos span,html[data-tema="oscuro"] .tag.rol-mozo,html[data-tema="oscuro"] .dl.nuevo,html[data-tema="oscuro"] .tag{background:#16284D;color:#8DB8FF}
html[data-tema="oscuro"] .tag.ok,html[data-tema="oscuro"] .tag.rol-cajero{background:var(--alga-s);color:var(--alga)}
html[data-tema="oscuro"] .tag.warn,html[data-tema="oscuro"] .tag.rol-cocina{background:var(--arena-s);color:var(--arena)}
html[data-tema="oscuro"] .tag.mal,html[data-tema="oscuro"] .tag.rol-admin{background:var(--coral-s);color:var(--coral)}
html[data-tema="oscuro"] .tag.gris{background:var(--tierra2);color:var(--tinta3)}
html[data-tema="oscuro"] .tag.hondo,html[data-tema="oscuro"] .av.g{background:var(--p4);color:#fff}
html[data-tema="oscuro"] .seg{background:#0E1628}
html[data-tema="oscuro"] .seg button[aria-pressed="true"],html[data-tema="oscuro"] .kbar .seg button[aria-pressed="true"]{background:#1E2C4A;color:var(--tinta);box-shadow:none}
html[data-tema="oscuro"] .mesa.oc,html[data-tema="oscuro"] .mesa.cuenta,html[data-tema="oscuro"] .kt,html[data-tema="oscuro"] .kt .kf,html[data-tema="oscuro"] .kbar .btn,html[data-tema="oscuro"] .lg form{background:var(--papel)}
html[data-tema="oscuro"] .mesa.comiendo{background:var(--papel)}
html[data-tema="oscuro"] .anillo::before{background:conic-gradient(var(--c) calc(var(--p) * 360deg),#22304F 0)}
html[data-tema="oscuro"] .kt .kh{background:#16213A}
html[data-tema="oscuro"] .kt.st-warn .kh,html[data-tema="oscuro"] .web-pend,html[data-tema="oscuro"] .banda-web{background:#2A210D}
html[data-tema="oscuro"] .kt.st-mal .kh{background:#3A1720}
html[data-tema="oscuro"] .kt.ls .kh,html[data-tema="oscuro"] .kt .kh .t{background:#0E2F24;color:var(--alga)}
html[data-tema="oscuro"] .web-cli,html[data-tema="oscuro"] .kt .kf,html[data-tema="oscuro"] .pinpad button{background:#0E1628}
html[data-tema="oscuro"] .borrador{background:#2A210D;border-color:#5A4415}
html[data-tema="oscuro"] .aviso{background:#1C2945;color:#fff}
html[data-tema="oscuro"] .aviso.err{background:#5A1A1F}
html[data-tema="oscuro"] .btn:hover{background:#16213A}
html[data-tema="oscuro"] .btn.pri,html[data-tema="oscuro"] .btn.pri:hover{background:var(--p4);border-color:var(--p4);color:#fff}
html[data-tema="oscuro"] .btn.ok{background:#1F9D63;border-color:#1F9D63}
html[data-tema="oscuro"] .btn.plano{background:transparent}
html[data-tema="oscuro"] .tabla th{background:var(--papel)}
html[data-tema="oscuro"] .tabla tbody tr.clic:hover td{background:#16213A}
html[data-tema="oscuro"] .esq{background:linear-gradient(90deg,#141E33,#1B2742,#141E33);background-size:200% 100%}
html[data-tema="oscuro"] .lg img,html[data-tema="oscuro"] .cab img{mix-blend-mode:normal;background:#FEF9F6;border-radius:12px;padding:4px}
html[data-tema="oscuro"] select.in{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%238C98B2' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E")}
html[data-tema="oscuro"] ::selection{background:#244A8F;color:#fff}
html[data-tema="oscuro"] .kpi.destaca,html[data-tema="oscuro"] .u-card.dueno{background:linear-gradient(180deg,#132447,var(--papel) 70%)}


/* =================== Futurista e intuitivo (v8) =================== */
:root{--disp:'Sora',Manrope,system-ui,sans-serif;--grad:linear-gradient(135deg,#074AB2,#1973B1);--glow:0 10px 30px -12px rgba(7,74,178,.55)}
h1,h2,h3,.kv,.c-tot b,.mesa .n,.cifras .v,.kt .kh .m{font-family:var(--disp);letter-spacing:-.02em}
.ti.i{font-size:20px;line-height:1;flex:none;display:inline-block}.ti.i.s{font-size:17px}
.tabbar button .ti{font-size:23px}.aviso .ic .ti{font-size:15px}.campana .ti{font-size:21px}
.w100{width:100%}
.btn{border-radius:12px}
.btn.pri{background:var(--grad);border:0;box-shadow:var(--glow)}.btn.pri:hover{filter:brightness(1.08)}
.btn.ok{box-shadow:0 10px 26px -12px rgba(34,160,107,.7)}
.btn.brilla{position:relative;overflow:hidden}
.btn.brilla::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);transform:translateX(-100%);animation:barrido 3.2s ease-in-out infinite}
@keyframes barrido{55%,100%{transform:translateX(100%)}}
.in.grande{font-size:20px;font-weight:800;min-height:52px}
/* pasos del cobro */
.c-pasos{display:flex;align-items:center;gap:8px;margin-bottom:14px;font-size:12.5px;font-weight:800;color:var(--tinta4)}
.c-pasos span{display:flex;align-items:center;gap:6px;white-space:nowrap}
.c-pasos i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;background:var(--tierra2);color:var(--tinta3);font-size:12px}
.c-pasos .on{color:var(--p4)}.c-pasos .on i{background:var(--grad);color:#fff;box-shadow:var(--glow)}
.c-pasos .ya{color:var(--alga)}.c-pasos .ya i{background:var(--verde);color:#fff}
.c-pasos hr{flex:1;border:0;height:2px;border-radius:2px;background:var(--linea);margin:0;min-width:12px}
.c-tot{border-radius:18px;padding:16px;margin-bottom:14px;background:var(--grad);color:#fff;box-shadow:var(--glow);position:relative;overflow:hidden}
.c-tot::after{content:"";position:absolute;right:-30px;top:-30px;width:140px;height:140px;border-radius:50%;background:rgba(255,255,255,.08)}
.c-tot span{font-size:13px;font-weight:700;opacity:.85}.c-tot b{display:block;font-size:36px;font-weight:800;line-height:1.1;margin:2px 0}
.c-tot small{font-size:12.5px;opacity:.85;font-weight:600}
.c-tot.ok{background:linear-gradient(135deg,#12804F,#22A06B);box-shadow:0 10px 30px -12px rgba(34,160,107,.6)}
.c-medios{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;margin-bottom:12px}
.c-medios button span{text-align:center;line-height:1.2}
.buscar>.ti{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--tinta3);font-size:18px}.buscar{position:relative}
.c-medios button{display:flex;flex-direction:column;align-items:center;gap:6px;min-height:72px;justify-content:center;border:1.5px solid var(--linea2);background:var(--papel);border-radius:14px;font-weight:800;font-size:12.5px;color:var(--tinta2);transition:all var(--t-rap) var(--e-out)}
.c-medios button .ti{font-size:24px;color:var(--tinta3)}
.c-medios button[aria-pressed="true"]{border:2px solid var(--p4);background:color-mix(in srgb,var(--p4) 10%,var(--papel));color:var(--p4);transform:translateY(-2px)}
.c-medios button[aria-pressed="true"] .ti{color:var(--p4)}
.c-pagos{margin:12px 0 0}
.cpbox{border-top:1px dashed var(--linea2);margin-top:16px;padding-top:14px}
.cpbox.activo{border:2px solid color-mix(in srgb,var(--p4) 40%,transparent);border-radius:18px;padding:14px;background:color-mix(in srgb,var(--p4) 5%,var(--papel));animation:entra var(--t-len) var(--e-out)}
.c-tipos{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-bottom:12px}
.c-tipos button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;border:1.5px solid var(--linea2);background:var(--papel);border-radius:14px;padding:12px;color:var(--tinta);transition:all var(--t-rap) var(--e-out)}
.c-tipos button .ti{font-size:22px;color:var(--p4);margin-bottom:4px}
.c-tipos button b{font-size:14px}.c-tipos button small{font-size:12px;color:var(--tinta3);font-weight:600}
.c-tipos button[aria-pressed="true"]{border:2px solid var(--p4);background:color-mix(in srgb,var(--p4) 10%,var(--papel));transform:translateY(-2px);box-shadow:var(--glow)}
.c-tipos button:disabled{opacity:.45}
/* impresoras */
.imp-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.imp{border:1.5px solid var(--linea);border-radius:16px;padding:12px;background:var(--tierra)}
.imp.ok{border-color:color-mix(in srgb,var(--verde) 55%,transparent)}
.imp .in{font-weight:800}.imp .row>.ti{font-size:24px;color:var(--p4)}
.ruta{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid var(--linea)}
.ruta span{font-weight:650}
@media (max-width:560px){.ruta{grid-template-columns:minmax(0,1fr)}}
/* carga masiva */
.imp-drop{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;border:2px dashed color-mix(in srgb,var(--p4) 45%,transparent);border-radius:20px;padding:28px 16px;cursor:pointer;background:color-mix(in srgb,var(--p4) 5%,var(--papel));transition:all var(--t-med) var(--e-out)}
.imp-drop:hover,.imp-drop.sobre{background:color-mix(in srgb,var(--p4) 12%,var(--papel));transform:scale(1.01)}
.imp-ic{width:60px;height:60px;border-radius:18px;background:var(--grad);color:#fff;display:grid;place-items:center;box-shadow:var(--glow);margin-bottom:6px}.imp-ic .ti{font-size:30px}
.imp-tipos{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;justify-content:center}.imp-tipos span{display:inline-flex;gap:5px;align-items:center;font-size:12.5px;font-weight:700;color:var(--tinta2);background:var(--papel);border:1px solid var(--linea);padding:4px 10px;border-radius:999px}
.imp-t{max-height:46vh;overflow:auto;border:1px solid var(--linea);border-radius:14px}
.imp-h,.imp-f{display:grid;grid-template-columns:28px minmax(0,1.6fr) minmax(0,1fr) 96px;gap:8px;align-items:center;padding:8px 10px}
.imp-h{position:sticky;top:0;background:var(--papel);font-size:12px;font-weight:800;color:var(--tinta3);border-bottom:1px solid var(--linea);z-index:1}
.imp-f{border-bottom:1px solid var(--linea)}.imp-f.off{opacity:.45}
.imp-f .in{min-height:38px;padding:6px 9px;font-size:14px}
.imp-f input[type=checkbox]{width:18px;height:18px;accent-color:var(--p4)}
@media (max-width:560px){.imp-h{display:none}.imp-f{grid-template-columns:24px minmax(0,1fr) 84px}.imp-f>input[data-ic]{grid-column:2/4}}
/* venta manual */
.vm-l{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px;max-height:220px;overflow:auto}
.vm-i{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid var(--linea);background:var(--papel);border-radius:12px;padding:9px 10px;color:var(--tinta)}
.vm-i:hover{border-color:var(--p4)}.vm-i span:first-child{flex:1;min-width:0}.vm-i small{display:block;color:var(--tinta3);font-size:12px}.vm-i .ti{color:var(--p4)}
/* alertas SweetAlert2 con la marca */
.swal2-container{z-index:200!important}
.sw-pop{border-radius:24px!important;padding:26px 22px 22px!important;background:var(--papel)!important;color:var(--tinta)!important;border:1px solid var(--linea)!important;box-shadow:0 30px 80px -24px rgba(0,0,0,.55)!important;font-family:var(--font)!important}
.sw-tit{font-family:var(--disp)!important;font-size:24px!important;color:var(--tinta)!important;padding-top:6px!important}
.sw-txt{color:var(--tinta3)!important;font-size:15px!important}.sw-txt p{margin:0 0 6px}.sw-txt .in{margin-top:6px}
.sw-acc{gap:10px;width:100%;flex-wrap:nowrap!important;margin-top:18px!important}.sw-acc .btn{flex:1}
.sw-in{animation:swin 380ms var(--e-spring)}@keyframes swin{from{transform:translateY(18px) scale(.94);opacity:0}}
.sw-out{animation:swout 200ms ease-in forwards}@keyframes swout{to{transform:scale(.96);opacity:0}}
.swal2-timer-progress-bar{background:var(--p4)!important}
.swal2-icon.swal2-success [class^=swal2-success-line]{background-color:var(--verde)!important}.swal2-icon.swal2-success .swal2-success-ring{border-color:color-mix(in srgb,var(--verde) 35%,transparent)!important}
/* modo oscuro futurista: luz azul de fondo, bordes que brillan */
html[data-tema="oscuro"] body{background:radial-gradient(1200px 600px at 85% -10%,rgba(61,130,240,.16),transparent 60%),radial-gradient(900px 500px at -10% 110%,rgba(25,115,177,.14),transparent 60%),var(--tierra);background-attachment:fixed}
html[data-tema="oscuro"] .panel,html[data-tema="oscuro"] .kpi,html[data-tema="oscuro"] .cifras,html[data-tema="oscuro"] .u-card,html[data-tema="oscuro"] .piso,html[data-tema="oscuro"] .aj-nav,html[data-tema="oscuro"] .mesa.oc,html[data-tema="oscuro"] .plato,html[data-tema="oscuro"] .kt{background:linear-gradient(var(--papel),var(--papel)) padding-box,linear-gradient(150deg,rgba(91,155,255,.35),rgba(30,42,68,.9) 35%,rgba(30,42,68,.9) 70%,rgba(91,155,255,.18)) border-box;border:1px solid transparent}
html[data-tema="oscuro"] .rail{background:rgba(14,22,40,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
html[data-tema="oscuro"] .barra-sup{background:rgba(11,18,32,.7)}
html[data-tema="oscuro"] .rail nav button[aria-current="page"]{background:linear-gradient(90deg,rgba(61,130,240,.28),rgba(61,130,240,.06));color:#B8D3FF;box-shadow:inset 0 0 0 1px rgba(91,155,255,.25)}
html[data-tema="oscuro"] .rail nav button[aria-current="page"]::before{background:#5B9BFF;box-shadow:0 0 12px #5B9BFF}
html[data-tema="oscuro"] .mesa.st-mal{box-shadow:0 0 0 1px var(--coral),0 0 22px -6px rgba(255,107,110,.6)}
html[data-tema="oscuro"] .mesa.listo{box-shadow:0 0 0 1px var(--verde),0 0 22px -6px rgba(47,191,126,.6)}
html[data-tema="oscuro"] .c-medios button,html[data-tema="oscuro"] .c-tipos button,html[data-tema="oscuro"] .vm-i{background:#0E1628}
html[data-tema="oscuro"] .imp{background:#0E1628}
html[data-tema="oscuro"] .sw-pop{background:#111A2E!important;border-color:#24324F!important}
html[data-tema="oscuro"] .kpi .ki{box-shadow:0 0 18px -6px rgba(91,155,255,.7)}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;animation-delay:0ms!important;transition-duration:1ms!important}}
@media print{body *{visibility:hidden}}

/* ===== v9: caja gobierna mesas, consulta DNI/RUC ===== */
.acc-m{display:flex;gap:6px;justify-content:flex-end;flex-wrap:nowrap}
.acc-m .btn{padding-inline:10px;white-space:nowrap}
@media (max-width:1100px) and (min-width:701px){.acc-m .btn .ti{display:none}}
.mz-b{gap:6px;font-weight:600}
.mz-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.mz-o{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 10px;border-radius:16px;border:1px solid var(--linea);background:var(--papel);color:var(--tinta);cursor:pointer;transition:transform .15s,border-color .15s,box-shadow .15s}
.mz-o:hover{transform:translateY(-2px);border-color:var(--p3)}
.mz-o[aria-pressed="true"]{border-color:var(--p3);box-shadow:var(--glow,0 0 0 3px rgba(59,130,246,.25))}
.mz-o .av{width:44px;height:44px;font-size:18px}
.mz-o small{color:var(--tinta3);font-size:12px}
.doc-res{display:flex;gap:10px;align-items:flex-start;margin-top:10px;padding:12px;border-radius:12px;font-size:14px;border:1px solid var(--linea)}
.doc-res small{display:block;color:var(--tinta3);margin-top:2px}
.doc-res.ok{border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.08)}
.doc-res.warn{border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.08)}
@media (max-width:700px){.acc-m .btn{flex:1}}
@media (max-width:1100px) and (min-width:701px){.c-ab{display:none}}

/* ===== v10: cocina, mozo, tickets, guías, fotos ===== */
.kt li[aria-disabled="true"]{cursor:default;opacity:.75}
.ohead{display:flex;align-items:center;gap:10px;flex-wrap:nowrap}
.ohead .t{flex:1;min-width:0}
.ohead .t h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ohead .t .small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oh-b{display:flex;gap:6px;flex-shrink:0}
@media (max-width:600px){.oh-b .lbl{display:none}.oh-b .btn{padding:0 10px;min-width:40px;justify-content:center}}
.o-pasos{display:flex;gap:6px;list-style:none;margin:10px 0 12px;padding:0;font-size:12.5px;font-weight:700;color:var(--tinta3)}
.o-pasos li{flex:1;display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;background:var(--tierra);border:1px solid var(--linea);white-space:nowrap;overflow:hidden}
.o-pasos li i{font-style:normal;display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--linea2);color:var(--tinta);font-size:11px;flex-shrink:0}
.o-pasos li.on{color:var(--p4);border-color:var(--p3);background:var(--p0)}
.o-pasos li.on i{background:var(--p3);color:#fff}
.o-pasos li.ya{color:var(--alga)}
.o-pasos li.ya i{background:var(--alga);color:#fff}
.fbar .btn.ok span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}
.fbar .btn.ok small{font-size:12px;font-weight:600;opacity:.9}
.guia{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:12px}
.guia li{display:flex;gap:12px;align-items:flex-start}
.guia li>i{font-style:normal;flex-shrink:0;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--p3);color:#fff;font-weight:800}
.guia p{margin:3px 0 0;font-size:14px;color:var(--tinta2);line-height:1.45}
.tk-ed{display:grid;grid-template-columns:1fr 320px;gap:18px;align-items:start}
.tk-g{border:1px solid var(--linea);border-radius:14px;padding:14px;margin-bottom:12px}
.tk-g h4{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:15px}
.tk-g .g2{gap:4px 12px}
.tk-pre{position:sticky;top:0}
.tk-papel{margin-top:10px;background:#e9ecf1;border-radius:12px;padding:12px;display:flex;justify-content:center;max-height:62vh;overflow:auto}
.tk-papel iframe{width:300px;border:0;background:#fff;box-shadow:0 6px 20px rgba(0,0,0,.18);border-radius:2px;min-height:300px}
@media (max-width:760px){.tk-ed{grid-template-columns:1fr}.tk-pre{position:static}}
.w100{width:100%}
.imp-txt{margin:10px 0 0;border:1px dashed var(--linea2);border-radius:12px;padding:10px 12px}
.imp-txt summary{cursor:pointer;font-weight:700;display:flex;gap:8px;align-items:center}
.imp-txt textarea{margin-top:10px;width:100%;font-family:inherit}
.fa-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;max-height:52vh;overflow:auto}
.fa-c{border:1px solid var(--linea);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:4px;font-size:13px;animation:faIn .3s ease}
.fa-c img,.fa-i{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;background:var(--tierra);display:grid;place-items:center;color:var(--tinta4)}
.fa-c small{color:var(--tinta3)}
.fa-c.mal{border-color:rgba(229,72,77,.5)}
.lnk{background:none;border:0;padding:0;color:var(--p3);font-weight:700;cursor:pointer;font:inherit;text-decoration:underline}
.fb-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:10px}
.fb-o{padding:0;border:2px solid transparent;border-radius:12px;overflow:hidden;cursor:pointer;background:var(--tierra);aspect-ratio:4/3}
.fb-o:hover{border-color:var(--p3)}
.fb-o img{width:100%;height:100%;object-fit:cover;display:block}
@keyframes faIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.fa-c{animation:none}}