
[hidden]{display:none!important}
/* Layout: hoja de cuaderno continua. Una tabla: Ingresos (Guía, Nombre, Yape, Efect., Detalle) ‖ Gastos (Nombre, Yape, Efect., Detalle). Cada día: fecha resaltada, filas, totales alineados bajo sus columnas y el cierre (ingresos − gastos, caja en efectivo y saldo Yape). Los colores y fuentes están en el bloque "Espumita fresca" de más abajo. */
:root{color-scheme:light}
*{box-sizing:border-box}
body{background:var(--desk);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.4;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:0 40px}
.wrap{max-width:1120px;margin:0 auto;display:grid;gap:14px}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}

/* top */
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--f-brand);font-size:1.45rem;color:var(--brand)}
.brand small{font-family:var(--f-body);font-size:.8rem;color:var(--ink-3);font-weight:700}
.top-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.live{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;color:var(--ink-3);font-weight:700;margin-right:4px}
.live i{width:7px;height:7px;border-radius:50%;background:var(--ink-3)}
.live.on i{background:var(--in)}
.tb{height:36px;border:1px solid var(--col);background:var(--paper);border-radius:9px;padding:0 12px;font-weight:700;font-size:.88rem;color:var(--ink-2)}
.tb:hover{color:var(--ink);border-color:var(--ink-3)}
.tb:disabled{opacity:.45;cursor:default}
.viewbar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:end}
.tabs{display:flex;background:#e2e8ef;border-radius:11px;padding:3px;gap:3px}
.tabs button{border:0;background:transparent;border-radius:9px;height:36px;padding:0 20px;font-weight:800;color:var(--ink-2)}
.tabs button[aria-pressed=true]{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgb(20 30 60 / .15)}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:end;flex:1 1 auto}
.filters label{display:grid;gap:3px;font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.filters select,.filters input[type=date]{height:36px;border:1px solid var(--col);background:var(--paper);border-radius:9px;padding:0 8px}
.filters .grow{flex:1 1 180px}
.filters .search{width:100%}
.filters input.on,.filters select.on{border-color:var(--brand);box-shadow:0 0 0 2px #d6eef7}
#undoBtn:not(:disabled){color:var(--brand);border-color:var(--brand)}
.search{height:36px;width:210px;max-width:100%;border:1px solid var(--col);background:var(--paper);border-radius:9px;padding:0 12px}
@media (max-width:640px){.search{flex:1 1 100%;width:auto}}

/* hoy */
.today{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.st{background:var(--paper);border:1px solid var(--col);border-radius:12px;padding:9px 14px;display:grid;min-width:0}
.st span{font-size:.7rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.st b{font-family:var(--f-hand);font-weight:400;font-size:1.65rem;line-height:1.15}
.st small{font-size:.75rem;color:var(--ink-2)}
.st.in b{color:var(--in)} .st.out b{color:var(--out)}
.st.caja{background:var(--ink);border-color:var(--ink)} .st.caja span,.st.caja small{color:#c4cde4} .st.caja b{color:#fff}
@media (max-width:700px){.today{grid-template-columns:repeat(2,minmax(0,1fr))}}

.panel{background:var(--paper);border:1px solid var(--col);border-radius:12px;padding:12px 16px}
.settings{display:flex;flex-wrap:wrap;gap:10px;align-items:end}
.settings p{flex-basis:100%;margin:0;color:var(--ink-2);font-size:.85rem}
.settings label{display:grid;gap:4px;font-size:.72rem;font-weight:800;color:var(--ink-2)}
.settings input{height:36px;border:1px solid var(--col);border-radius:8px;padding:0 10px;background:#fff}
.btn{height:36px;border:0;border-radius:8px;padding:0 14px;font-weight:800;background:var(--brand);color:#fff;font-size:.88rem}
.btn:disabled{opacity:.5}
.ro{background:var(--warn-soft);color:var(--warn);border-radius:9px;padding:8px 12px;font-weight:700;font-size:.88rem}

/* hoja */
.sheet-box{background:var(--paper);border:1px solid var(--col);border-radius:12px;overflow:auto;max-height:calc(100vh - 230px);min-height:340px}
table.sheet{border-collapse:separate;border-spacing:0;width:100%;min-width:1100px;font-variant-numeric:tabular-nums}
.sheet col.c-g{width:64px}.sheet col.c-n{width:210px}.sheet col.c-m{width:100px}.sheet col.c-d{width:170px}.sheet col.c-n2{width:170px}.sheet col.c-d2{width:150px}.sheet col.c-x{width:40px}
.sheet thead th{position:sticky;background:var(--paper);z-index:2;text-align:left;white-space:nowrap}
.sheet thead tr.g th{top:0;height:30px;padding:0 10px;font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.sheet thead tr.g th.gi{color:var(--in);background:var(--in-soft)}
.sheet thead tr.g th.go{color:var(--out);background:var(--out-soft)}
.sheet thead tr.h th{top:30px;height:32px;padding:0 10px;font-size:.74rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);border-bottom:2px solid var(--margin)}
.sheet .r{text-align:right}
.sheet td{height:var(--row);padding:0;border-bottom:1px solid var(--rule);position:relative;vertical-align:middle}
.sheet td,.sheet th{border-right:1px solid var(--col)}
.sheet td:first-child,.sheet th:first-child{border-left:2px solid var(--margin)}
.sheet td:last-child,.sheet th:last-child{border-right:0}
.sheet .split{border-right:4px double var(--margin)!important}
.sheet td.go{background:rgb(253 238 234 / .35)}

.cell{display:block;width:100%;height:var(--row);border:0;background:transparent;padding:0 10px;font-family:var(--f-hand);font-size:1.12rem;color:var(--ink);border-radius:0}
.cell.r{text-align:right}
.cell::placeholder{color:#c0cad8;font-family:var(--f-body);font-size:.85rem}
.cell:hover{background:rgb(28 44 90 / .04)}
.cell:focus{outline:none;background:#fffbe6;box-shadow:inset 0 -2px 0 var(--brand)}
.cell.mi{color:var(--in)} .cell.mo{color:var(--out)}

tr.dayhead td{height:auto;padding:16px 10px 6px;border-right:0;border-bottom:1px solid var(--rule)}
.hl{display:inline-flex;align-items:baseline;gap:10px;padding:2px 12px;border-radius:3px;background:var(--hl);font-family:var(--f-hand);font-size:1.3rem;letter-spacing:.05em;text-transform:uppercase;color:#262a3a}
.hl small{font-family:var(--f-body);font-size:.66rem;font-weight:800;letter-spacing:.06em;background:var(--ink);color:#fff;padding:1px 6px;border-radius:4px}

tr.tot td{height:38px;background:#f7f9fc;border-top:1.5px solid var(--ink);border-bottom:0;padding:0 10px;font-family:var(--f-hand);font-size:1.18rem;white-space:nowrap}
tr.tot td.lbl{font-family:var(--f-body);font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
tr.tot td.ai{color:var(--in)} tr.tot td.ao{color:var(--out)}
tr.tot td.sub{font-family:var(--f-body);font-size:.8rem;color:var(--ink-2);font-weight:700}
tr.res td{height:auto;padding:10px 10px 14px;border-bottom:2px solid var(--ink);border-right:0!important;background:#f7f9fc}
.resbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px}
.resbar .t{font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.resbar .v{display:inline-flex;align-items:baseline;gap:6px;font-size:.78rem;font-weight:700;color:var(--ink-2)}
.resbar .v b{font-family:var(--f-hand);font-weight:400;font-size:1.25rem;color:var(--ink)}
.resbar .v.total b{font-size:1.4rem;text-decoration:underline double}
.resbar .neg b{color:var(--out)}
.resbar .caja{margin-left:auto;display:inline-flex;align-items:baseline;gap:8px;font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.resbar .caja b{font-family:var(--f-hand);font-weight:400;font-size:1.45rem;letter-spacing:0;color:var(--ink);border-bottom:3px double var(--ink);line-height:1.1}
.resbar .caja em{font-style:normal;font-weight:600;text-transform:none;letter-spacing:0;color:var(--ink-3)}

td.act{text-align:center}
.del{border:0;background:transparent;width:28px;height:28px;border-radius:7px;color:var(--ink-3);display:inline-grid;place-items:center}
.del:hover{background:var(--out-soft);color:var(--out)}
.del[data-show]{color:var(--brand)}
/* administrador */
.admin-btn{display:inline-flex;align-items:center;gap:6px;color:var(--ink);border-color:var(--ink)}
.admin-btn.on{background:var(--ink);color:#fff}
.admin-bar{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;justify-content:space-between;background:var(--ink);color:#fff;border-radius:12px;padding:10px 14px;font-weight:700;font-size:.9rem}
.admin-bar .ab-act{display:flex;gap:8px}
.admin-bar .tb{height:32px;background:transparent;color:#fff;border-color:rgb(255 255 255 / .4)}
.admin-bar .tb:hover{border-color:#fff;color:#fff}
.adm-card{width:min(400px,100%)}
.adm-form{display:grid;gap:10px}
.adm-form label{display:grid;gap:4px;font-size:.72rem;font-weight:800;color:var(--ink-2);text-transform:uppercase;letter-spacing:.05em}
.adm-form input{height:44px;border:1px solid var(--col);border-radius:9px;padding:0 12px;font-size:1.05rem}
.adm-form input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px #d6eef7}
.amsg{margin:0;min-height:1.2em;color:var(--out);font-size:.85rem;font-weight:700}
.adm-form .btn{height:44px}
.h-adm{color:var(--ink);background:#e6eaf3;border-radius:4px;padding:0 5px;margin-left:4px}
/* encabezado del día: editar + historial */
.dh-wrap{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap}
.dh-btn{height:30px;border:1px solid var(--col);background:#fff;border-radius:8px;padding:0 10px;font-size:.78rem;font-weight:800;color:var(--ink-2)}
.dh-btn:hover{color:var(--ink);border-color:var(--ink-3)}
.dh-tip{font-size:.78rem;color:var(--brand);font-weight:700}
.dh-lock{font-size:.78rem;color:var(--ink-3);font-weight:700}
.cell.fix{cursor:text}
.cell.fix:hover{background:#eef6fb;box-shadow:inset 0 -1px 0 var(--brand)}
.cfm-date{display:grid;gap:4px;font-size:.72rem;font-weight:800;color:var(--ink-2);text-transform:uppercase;letter-spacing:.05em}
.cfm-date input{height:42px;border:1px solid var(--col);border-radius:9px;padding:0 10px;font-size:1rem}
.cfm-act{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
.cfm-act .btn{height:40px;padding:0 22px}
.cfm-act .tb{height:40px}
/* fecha automática */
.e-auto{font-size:.75rem;font-weight:700;color:var(--in);background:var(--in-soft);padding:3px 9px;border-radius:999px}
.e-auto.manual{color:var(--warn);background:var(--warn-soft)}
/* historial de cambios */
.modal{position:fixed;inset:0;z-index:30;background:rgb(20 28 50 / .45);display:grid;place-items:center;padding:calc(16px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) calc(16px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.modal-card{background:var(--paper);border-radius:14px;width:min(640px,100%);max-height:100%;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 50px rgb(20 30 60 / .3)}
.modal-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--col)}
.modal-h h2{margin:0;font-family:var(--f-brand);font-weight:600;font-size:1.15rem}
.modal-b{overflow:auto;padding:12px 16px 16px;display:grid;gap:10px}
/* tarjeta de un cambio (clases k-*: no usar "del", que es el botón de papelera) */
.h-item{border:1px solid var(--col);border-left:5px solid var(--in);border-radius:10px;padding:12px 14px;display:grid;gap:8px;min-width:0;background:#fff}
.h-item.k-edit{border-left-color:var(--brand)} .h-item.k-del{border-left-color:var(--out)}
.h-top{display:flex;justify-content:space-between;align-items:baseline;gap:4px 10px;flex-wrap:wrap}
.h-acc{font-weight:900;font-size:1rem}
.h-item.k-edit .h-acc{color:var(--brand)} .h-item.k-del .h-acc{color:var(--out)} .h-item.k-new .h-acc{color:var(--in)}
.h-when{font-size:.8rem;color:var(--ink-2);font-weight:800}
.h-meta{display:flex;flex-wrap:wrap;gap:6px}
.h-chip{font-size:.75rem;font-weight:800;border-radius:999px;padding:3px 10px;background:#f1f5f8;color:var(--ink-2)}
.h-chip.adm{background:#fff1e0;color:#9a5200} .h-chip.per{background:var(--brand-soft);color:var(--brand)}
.h-ctx{font-size:.88rem;color:var(--ink-2)} .h-ctx b{color:var(--ink)}
.h-tbl{width:100%;border-collapse:collapse;font-size:.9rem;table-layout:fixed}
.h-tbl th{text-align:left;font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);padding:4px 8px;border-bottom:1.5px solid var(--col)}
.h-tbl td{padding:6px 8px;border-bottom:1px solid var(--rule);vertical-align:top;overflow-wrap:anywhere}
.h-tbl th:first-child,.h-tbl td:first-child{width:30%}
.h-tbl td.f{font-weight:800;color:var(--ink-2)}
.h-tbl td.a{color:var(--out);text-decoration:line-through} .h-tbl td.d{color:var(--in);font-weight:800}
.h-tbl td.x{color:var(--out);text-decoration:line-through}
.h-ref{font-size:.88rem;color:var(--ink-2)}
.h-gone{text-decoration:line-through}
.h-diff{margin:0;padding:0;list-style:none;display:grid;gap:4px}
.h-diff li{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-size:.9rem}
.h-f{font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);min-width:70px}
.h-old{color:var(--out);text-decoration:line-through;background:var(--out-soft);padding:0 6px;border-radius:4px}
.h-arrow{color:var(--ink-3)}
.h-new{color:var(--in);font-weight:800;background:var(--in-soft);padding:0 6px;border-radius:4px}
.menu{position:absolute;right:4px;top:50%;transform:translateY(-50%);z-index:3;display:flex;gap:4px;background:var(--paper);border:1px solid var(--col);border-radius:8px;padding:4px;box-shadow:0 4px 14px rgb(20 30 60 / .12);white-space:nowrap}
.menu button{border:0;border-radius:6px;padding:4px 8px;font-size:.75rem;font-weight:800;background:var(--out-soft);color:var(--out)}
.menu button.no{background:#f0f3f7;color:var(--ink-2)}
.empty{padding:40px 16px!important;text-align:center;color:var(--ink-2);height:auto!important;border-right:0!important}

/* filas guardadas (solo lectura) */
.cv{display:block;height:var(--row);line-height:var(--row);padding:0 10px;font-family:var(--f-hand);font-size:1.12rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv.r{text-align:right}.cv.mi{color:var(--in)}.cv.mo{color:var(--out)}
.menu button.ed{background:#e6f1f8;color:var(--brand)}
.f-act{display:flex;gap:8px;margin-left:auto;align-self:end}
@media (max-width:640px){.f-act{flex:1 1 100%}.f-act .btn{flex:1}}
/* título y hoja sin encabezado (las columnas las da el formulario de arriba) */
.sec-title{display:flex;align-items:baseline;gap:12px;margin-top:6px}
.sec-title h2{margin:0;font-family:var(--f-brand);font-weight:600;font-size:1.35rem;color:var(--ink)}
.sec-title span{font-size:.85rem;color:var(--ink-3);font-weight:700}
#box thead{display:none}
.sheet tr.colh td{height:28px;padding:0 10px;font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;font-family:var(--f-body)}
.sheet tr.colh.g td{height:24px;color:var(--ink-2);border-bottom:0}
.sheet tr.colh.g td.gi{color:var(--in);background:var(--in-soft)}
.sheet tr.colh.g td.go{color:var(--out);background:var(--out-soft)}
.sheet tr.colh.h td{color:var(--ink-2);border-bottom:2px solid var(--margin);background:#fff}
.sheet tr.colh.h td.r{text-align:right}
#box tr.dayhead:first-child td{padding-top:12px}
/* formulario con el mismo formato de la hoja */
.e2 .e-top{align-items:center;padding:12px 14px}
.e-hl{border:0;cursor:pointer}
.e-hl:hover{filter:brightness(.97)}
.e2 .e-top .e-date{display:flex;align-items:center;gap:8px;font-size:.68rem;color:var(--ink-3)}
.e2 .e-top .e-date input{height:32px;width:150px;font-size:.88rem;color:var(--ink-2)}
.e-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:10px 14px;border-top:1px solid var(--col)}
.e-bottom .e-mode{padding:0}
form.entry.e2{display:block;padding:0;border:1px solid var(--col);border-top:4px solid var(--brand);background:var(--paper);border-radius:12px;overflow:hidden}
.e-top{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:end;padding:10px 14px}
.e-date{display:grid;gap:3px;font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.e2 .e-date input{height:38px;width:160px;border:1px solid var(--col);border-radius:9px;padding:0 10px;background:#fff;font-size:1rem}
.e-mode{font-size:.85rem;color:var(--ink-3);padding-bottom:9px}
.e2 .btn{height:40px;padding:0 22px;background:var(--brand)}
.e-scroll{overflow-x:auto;border-top:1px solid var(--col)}
.etbl thead th{position:static}
.etbl td{height:auto;padding:6px 5px;border-bottom:0}
.e2 .etbl input.ein{display:block;width:100%;height:42px;border:1px solid var(--col);border-radius:8px;background:#fbfdff;padding:0 8px;font-family:var(--f-hand);font-size:1.15rem;color:var(--ink)}
.e2 .etbl input.ein.r{text-align:right}
.e2 .etbl input.ein.mi{color:var(--in)} .e2 .etbl input.ein.mo{color:var(--out)}
.e2 .etbl input.ein::placeholder{font-family:var(--f-body);font-size:.85rem;color:#b3bfcf}
.e2 .etbl input.ein:focus{outline:none;border-color:var(--brand);background:#fffbe6;box-shadow:0 0 0 3px #d6eef7}
@media (max-width:640px){.e2 .f-act{flex:1 1 100%}.e2 .f-act .btn{flex:1}.e-mode{display:none}}
.cell::placeholder{color:#aab6c8}
.warn-note{background:var(--warn-soft);color:var(--warn);border-radius:var(--r-md);padding:10px 14px;font-weight:800;font-size:.88rem}
.toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:#fff;padding:9px 16px;border-radius:10px;font-weight:700;font-size:.88rem;z-index:20}

/* =========================================================
   VERSIÓN 2 · diseño "Espumita fresca"
   Misma estructura; nueva piel: cielo aguamarina con burbujas,
   tarjetas redondeadas, Baloo 2 para títulos y números grandes,
   Nunito para todo lo demás. Ingresos = menta, Gastos = coral.
   ========================================================= */
:root{
  --desk:#e9f7fb; --paper:#ffffff; --rule:#edf4f8; --col:#dbe9f0; --margin:#bfe3f0;
  --ink:#123047; --ink-2:#4f6b7f; --ink-3:#93a8b7;
  --brand:#0a8fc2; --brand-2:#36c2e8; --brand-soft:#e2f5fc;
  --in:#0e9f6a; --in-soft:#e3f7ee; --in-line:#9fdfc3;
  --out:#e8574a; --out-soft:#fdecea; --out-line:#f5b8b1;
  --warn:#9a6a00; --warn-soft:#fff3cf;
  --hl-1:#ffe1b8; --hl-2:#ffd6e7; --hl-3:#fff2a8; --hl-4:#cdeeff; --hl-5:#d3f5dc;
  --f-hand:"Nunito",system-ui,sans-serif;
  --f-brand:"Baloo 2","Trebuchet MS",system-ui,sans-serif;
  --f-body:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
  --row:40px; --r-lg:20px; --r-md:14px;
  --shadow:0 1px 2px rgb(18 48 71 / .05),0 8px 24px rgb(18 48 71 / .07);
}
body{
  font-family:var(--f-body);
  background:
    radial-gradient(circle at 8% 12%, rgb(54 194 232 / .16) 0 70px, transparent 71px),
    radial-gradient(circle at 14% 22%, rgb(54 194 232 / .10) 0 28px, transparent 29px),
    radial-gradient(circle at 92% 8%, rgb(14 159 106 / .10) 0 90px, transparent 91px),
    radial-gradient(circle at 86% 18%, rgb(54 194 232 / .12) 0 34px, transparent 35px),
    linear-gradient(180deg,#dff3fa 0,#eef8fb 320px,#f4f9fb 100%);
  background-attachment:fixed;
}
.wrap{gap:16px}

/* cabecera */
.top{padding-top:20px}
.brand{font-family:var(--f-brand);font-weight:800;font-size:1.9rem;letter-spacing:-.01em;color:var(--brand);gap:12px}
.brand svg{width:40px;height:40px;padding:6px;border-radius:14px;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;box-shadow:0 6px 16px rgb(10 143 194 / .3)}
.brand small{font-family:var(--f-body);font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);align-self:center;margin-top:6px}
.live{background:#fff;border:1px solid var(--col);border-radius:999px;padding:6px 12px}
.tb{border-radius:999px;border-color:var(--col);font-weight:800;padding:0 14px;background:#fff;box-shadow:0 1px 2px rgb(18 48 71 / .05)}
.tb:hover{border-color:var(--brand);color:var(--brand)}
#undoBtn:not(:disabled){background:var(--brand-soft);color:var(--brand);border-color:transparent}
.admin-btn{background:var(--ink);color:#fff;border-color:var(--ink)}
.admin-btn:hover{background:#0b2233;color:#fff;border-color:#0b2233}
.admin-btn.on{background:linear-gradient(135deg,#ffb547,#ff8a3d);border-color:transparent;color:#3a1e00}
.admin-bar{background:linear-gradient(135deg,#123047,#1d4a6b);border-radius:var(--r-md);box-shadow:var(--shadow)}

/* pestañas y filtros */
.tabs{background:#fff;border:1px solid var(--col);border-radius:999px;padding:4px;box-shadow:var(--shadow)}
.tabs button{border-radius:999px;height:38px;padding:0 24px;font-size:.95rem}
.tabs button[aria-pressed=true]{background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;box-shadow:0 4px 12px rgb(10 143 194 / .3)}
.filters select,.filters input[type=date],.filters .search{border-radius:12px;height:38px;background:#fff}

/* recuadros de hoy */
.today{gap:12px}
.st{border:0;border-radius:var(--r-lg);padding:14px 16px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.st::after{content:"";position:absolute;right:-18px;top:-18px;width:64px;height:64px;border-radius:50%;background:currentColor;opacity:.08}
.st span{font-size:.7rem;letter-spacing:.09em}
.st b{font-family:var(--f-brand);font-weight:800;font-size:1.75rem;letter-spacing:-.01em;line-height:1.2}
.st.in{color:var(--in)} .st.in b{color:var(--in)}
.st.out{color:var(--out)} .st.out b{color:var(--out)}
.st:not(.in):not(.out):not(.caja){color:var(--brand)} .st:not(.in):not(.out):not(.caja) b{color:var(--ink)}
.st small{color:var(--ink-2)}
.st.caja{background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff}
.st.caja::after{opacity:.18;background:#fff}
.st.caja span,.st.caja small{color:rgb(255 255 255 / .85)}
.st.caja b{color:#fff}

/* formulario */
form.entry.e2{border:0;border-radius:var(--r-lg);box-shadow:var(--shadow);border-top:0;overflow:hidden}
form.entry.e2::before{content:"";display:block;height:6px;background:linear-gradient(90deg,var(--in) 0 55%,var(--out) 55% 100%)}
.e2 .e-top{padding:14px 16px}
.e2 .e-top .e-date input{border-radius:10px}
.e-auto{border-radius:999px}
.e-scroll{border-top:0}
.etbl thead tr.g th{background:transparent!important;padding-top:4px}
.etbl thead tr.g th.gi span,.etbl thead tr.g th.go span{display:none}
.e2 .etbl input.ein{height:46px;border-radius:12px;border:1.5px solid var(--col);background:#f8fbfd;font-family:var(--f-body);font-size:1.05rem;font-weight:700}
.e2 .etbl input.ein:focus{border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px rgb(54 194 232 / .2)}
.e2 .etbl input.ein.mi{color:var(--in)} .e2 .etbl input.ein.mo{color:var(--out)}
.e-bottom{border-top:1px solid var(--rule);background:#fbfdfe}
.e2 .btn{border-radius:999px;height:44px;padding:0 30px;font-size:1rem;background:linear-gradient(135deg,var(--brand-2),var(--brand));box-shadow:0 6px 16px rgb(10 143 194 / .3)}
.e2 .btn:hover{filter:brightness(1.05)}

/* encabezados de columnas (formulario y hoja) */
.sheet thead tr.g th,.sheet tr.colh.g td{font-family:var(--f-brand);font-size:.9rem;letter-spacing:.06em;font-weight:800}
.sheet thead tr.g th.gi,.sheet tr.colh.g td.gi{background:var(--in-soft)!important;color:var(--in)!important;border-radius:12px 0 0 0}
.sheet thead tr.g th.go,.sheet tr.colh.g td.go{background:var(--out-soft)!important;color:var(--out)!important;border-radius:0 12px 0 0}
.sheet thead tr.h th,.sheet tr.colh.h td{font-size:.7rem;letter-spacing:.07em;color:var(--ink-3)!important;border-bottom:2px solid var(--col)!important;background:#fff}
.sheet td,.sheet th{border-right:1px solid var(--rule)}
.sheet td:first-child,.sheet th:first-child{border-left:0}
.sheet .split{border-right:3px solid var(--in-line)!important}
.sheet td.go{background:rgb(253 236 234 / .28)}

/* registros diarios */
.sec-title h2{font-family:var(--f-brand);font-weight:800;font-size:1.6rem;color:var(--ink)}
.sec-title h2::before{content:"";display:inline-block;width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,var(--brand-2),var(--brand));margin-right:10px;vertical-align:middle}
.sec-title span:empty{display:none}
.sec-title span{background:#fff;border:1px solid var(--col);border-radius:999px;padding:3px 12px;font-size:.78rem}
.sheet-box{border:0;border-radius:var(--r-lg);box-shadow:var(--shadow)}
tr.dayhead td{padding:20px 12px 10px;border-bottom:0}
.hl{font-family:var(--f-brand);font-weight:800;font-size:1.25rem;letter-spacing:.03em;border-radius:999px;padding:4px 16px;background:var(--hl);color:var(--ink)}
.hl small{border-radius:999px;padding:2px 8px;background:var(--brand);font-family:var(--f-body)}
.dh-btn{border-radius:999px;height:32px;padding:0 14px;background:#fff}
.dh-btn:hover{border-color:var(--brand);color:var(--brand)}
.dh-tip{background:var(--brand-soft);border-radius:999px;padding:3px 10px;font-size:.74rem}
.dh-lock{background:#f1f5f8;border-radius:999px;padding:3px 10px;font-size:.74rem}
.sheet td{border-bottom:1px solid var(--rule)}
.sheet tbody tr:nth-child(even) td:not(.go){background:#fbfdfe}
.cv,.cell{font-family:var(--f-body);font-size:1rem;font-weight:600}
.cv.mi,.cell.mi{color:var(--in);font-weight:800} .cv.mo,.cell.mo{color:var(--out);font-weight:800}
.cell.fix:hover{background:var(--brand-soft);box-shadow:inset 0 0 0 1.5px var(--brand-2);border-radius:8px}
.cell:focus{background:#fff;box-shadow:inset 0 0 0 2px var(--brand);border-radius:8px}
tr.tot td{background:#f5fafc;border-top:2px solid var(--col);font-family:var(--f-brand);font-weight:800;font-size:1.1rem}
tr.tot td.lbl{font-family:var(--f-body)}
tr.res td{background:#f5fafc;border-bottom:10px solid var(--paper);padding:10px 12px 16px}
.resbar{background:#fff;border:1px solid var(--col);border-radius:16px;padding:10px 16px}
.resbar .v b{font-family:var(--f-brand);font-weight:800;font-size:1.2rem}
.resbar .v.total b{font-size:1.4rem;text-decoration:none;background:var(--brand-soft);color:var(--brand);padding:0 10px;border-radius:999px}
.resbar .neg b{color:var(--out)}
.resbar .caja b{font-family:var(--f-brand);font-weight:800;font-size:1.4rem;border-bottom:0;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;padding:0 12px;border-radius:999px}
.del{border-radius:999px}
.menu{border-radius:14px;padding:6px;border:0;box-shadow:0 10px 30px rgb(18 48 71 / .2)}
.menu button{border-radius:999px;padding:5px 12px}

/* ventanas */
.modal{background:rgb(18 48 71 / .4);backdrop-filter:blur(3px)}
.modal-card{border-radius:24px}
.modal-h h2{font-family:var(--f-brand);font-weight:800;font-size:1.3rem}
.cfm-act .btn,.adm-form .btn{border-radius:999px;background:linear-gradient(135deg,var(--brand-2),var(--brand))}
.h-item{border-radius:14px}
.toast{border-radius:999px;background:var(--ink);box-shadow:0 10px 30px rgb(18 48 71 / .3);padding:10px 20px}
.empty{color:var(--ink-3)}

/* saldo Yape y retiros de lavandería */
.today{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:980px){.today{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.today{grid-template-columns:repeat(2,minmax(0,1fr))}}
.caja-sum{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:700px){.caja-sum{grid-template-columns:repeat(2,minmax(0,1fr))}}
.st.yape{background:linear-gradient(135deg,#9b6cf0,#6a2fd6);color:#fff}
.st.yape::after{opacity:.18;background:#fff}
.st.yape span,.st.yape small{color:rgb(255 255 255 / .85)}
.st.yape b{color:#fff}
.resbar .caja.yp{margin-left:0}
.resbar .caja.yp b{background:linear-gradient(135deg,#9b6cf0,#6a2fd6)}
.resbar .ret b{color:var(--out)}
#cajaView{display:grid;gap:16px}
#cajaView .panel{border:0;border-radius:var(--r-lg);box-shadow:var(--shadow);padding:16px 18px}
#cajaView h3{margin:0 0 12px;font-family:var(--f-brand);font-weight:800;font-size:1.25rem;color:var(--ink)}
.ret-form{border-top:6px solid var(--out)!important}
.ret-row{display:flex;flex-wrap:wrap;gap:10px;align-items:end}
.ret-row label{display:grid;gap:4px;font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.ret-row input,.ret-row select{height:44px;border:1.5px solid var(--col);border-radius:12px;padding:0 12px;background:#f8fbfd;font-size:1rem;font-weight:700}
.ret-row input:focus,.ret-row select:focus{outline:none;border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px rgb(54 194 232 / .2)}
.ret-row #rMonto{width:130px;color:var(--out);text-align:right}
.ret-row .grow{flex:1 1 200px}
.ret-row .btn{height:44px;border-radius:999px;padding:0 26px;font-size:1rem;background:linear-gradient(135deg,#ff8a7a,var(--out));box-shadow:0 6px 16px rgb(232 87 74 / .3)}
.ret-row :disabled{opacity:.55;cursor:not-allowed}
.ret-help{margin:10px 0 0;font-size:.85rem;font-weight:700;color:var(--ink-3)}
.ret-help.lock{color:var(--warn)}
.ret-scroll{overflow-x:auto}
.ret-tbl{width:100%;min-width:760px;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ret-tbl th{text-align:left;font-size:.7rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);padding:0 10px 8px;border-bottom:2px solid var(--col);white-space:nowrap}
.ret-tbl td{padding:10px;border-bottom:1px solid var(--rule);font-weight:600;white-space:nowrap}
.ret-tbl .r{text-align:right}
.ret-tbl .m{color:var(--out);font-weight:800}
.ret-tbl .acc{color:var(--ink-2)}
.ret-tbl .tot{font-family:var(--f-brand);font-weight:800;color:var(--ink)}
.ret-tag{display:inline-block;border-radius:999px;padding:2px 10px;font-size:.75rem;font-weight:800}
.ret-tag.e{background:var(--brand-soft);color:var(--brand)} .ret-tag.y{background:#efe6fd;color:#6a2fd6}
/* celular: nada puede ensanchar la página; las 4 pestañas van en 2 filas */
.wrap{grid-template-columns:minmax(0,1fr)}
.tabs button{white-space:nowrap}
@media (max-width:640px){
  .viewbar .tabs{display:grid;grid-template-columns:1fr 1fr;width:100%;border-radius:22px}
  .tabs button{padding:0 8px;font-size:.88rem}
  .cam-nav{flex-wrap:wrap}
}
/* usuarios y cierres */
.usr-list{display:grid;gap:8px}
.usr-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--col);border-radius:12px;padding:10px 12px}
.usr-row.off{opacity:.6}
.usr-who{display:grid}
.usr-who small{color:var(--ink-3);font-weight:700}
.usr-act{display:flex;flex-wrap:wrap;gap:6px}
.usr-form{border-top:1px solid var(--col);padding-top:12px}
.usr-form h3{margin:0;font-family:var(--f-brand);font-size:1.05rem}
.adm-form #admSetup{height:38px}
.cierres-ttl{margin:14px 0 6px;font-family:var(--f-brand);font-size:1rem}
.cierres{margin:0;padding:0;list-style:none;display:grid;gap:6px;font-size:.9rem}
.cierres li{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.cierres .tb{height:28px;padding:0 10px;font-size:.78rem}
.cam-panel{border:0;border-radius:var(--r-lg);box-shadow:var(--shadow);padding:16px 18px;display:grid;gap:10px}
.cam-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.cam-head h3{margin:0;font-family:var(--f-brand);font-weight:800;font-size:1.25rem;color:var(--ink)}
.cam-nav{display:flex;gap:6px;align-items:center}
.cam-nav input{height:36px;border:1.5px solid var(--col);border-radius:12px;padding:0 10px;font-weight:700;background:#fff}
.cam-lock{margin:0;background:#f1f5f8;border-radius:12px;padding:8px 12px;font-size:.85rem;font-weight:700;color:var(--ink-2)}
.cam-count{margin:0;font-size:.85rem;font-weight:800;color:var(--ink-3)}
.cam-list{display:grid;gap:10px}
.h-col{font-size:.72rem;font-weight:800;color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em}
td.rev .cv,td.rev .cell{background:var(--warn-soft);color:var(--warn);border-radius:8px}
.ret-empty{text-align:center;color:var(--ink-3);padding:24px 10px!important;white-space:normal!important}
