/* Estilos propios de la calculadora (index.html). */
*{margin:0;padding:0;box-sizing:border-box;}
:root{--bg:#f5f3ef;--surface:#faf8f5;--card:#ffffff;
--border:#e8e3da;--border2:#d6cfc4;
--gold:#21634f;--gold2:#28765c;--goldbg:#eef6ed;--goldline:#b9d4b4;
--text:#2c2416;--text2:#4a3f2f;--muted:#8a7a65;--subtle:#b5a898;
--green:#2d7a3a;--greenbg:#edf7ef;
--red:#b83232;--redbg:#fdf0f0;
--blue:#2a5ea8;--bluebg:#eef4fc;}
html,body{background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;min-height:100%;}
body{display:flex;flex-direction:column;align-items:center;padding:0 1rem 4rem;}
.wrap{width:100%;max-width:420px;}
header{text-align:center;padding:1.1rem 0 1.1rem;}
.header-label{font-family:Arial,Helvetica,sans-serif;font-size:0.58rem;letter-spacing:0.22em;color:var(--gold2);text-transform:uppercase;margin-bottom:0.4rem;font-weight:600;}
h1{font-family:Arial,Helvetica,sans-serif;font-size:2.4rem;letter-spacing:0.05em;line-height:1;color:var(--text);}
h1 em{color:var(--gold2);font-style:normal;}
.header-sub{font-size:0.75rem;color:var(--muted);margin-top:0.35rem;font-weight:500;}
.tab-selector{display:grid;grid-template-columns:1fr 1fr 1fr;background:var(--card);border:1.5px solid var(--border);border-radius:10px;padding:4px;margin-bottom:1rem;box-shadow:0 1px 4px rgba(44,36,22,0.07);}
.tab-btn{background:transparent;border:none;border-radius:7px;font-family:Arial,Helvetica,sans-serif;font-size:0.72rem;font-weight:600;padding:0.6rem 0.3rem;cursor:pointer;color:var(--muted);transition:all 0.2s;text-align:center;line-height:1.25;}
.tab-btn.active{background:var(--goldbg);color:var(--gold);box-shadow:0 1px 3px rgba(33,99,79,0.15);}
.tab-btn-sub{display:block;font-size:0.57rem;font-weight:500;margin-top:0.08rem;opacity:0.8;}
#view-nomina{display:block;}
#view-finiquito{display:none;}
#view-baja{display:none;}
.card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:1.2rem;margin-bottom:0.65rem;box-shadow:0 1px 4px rgba(44,36,22,0.07);}
.card-label{font-family:Arial,Helvetica,sans-serif;font-size:0.57rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--subtle);margin-bottom:0.85rem;font-weight:600;}
.cat-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.45rem;}
.cat-btn{background:var(--surface);border:1.5px solid var(--border);border-radius:7px;color:var(--muted);font-family:Arial,Helvetica,sans-serif;font-size:0.75rem;font-weight:600;padding:0.65rem 0.4rem;text-align:center;cursor:pointer;transition:all 0.15s;line-height:1.3;width:100%;}
.cat-btn:hover{border-color:var(--gold2);color:var(--text2);background:var(--goldbg);}
.cat-btn.active{background:var(--goldbg);border-color:var(--gold2);color:var(--gold);}
.cat-salary{display:block;font-family:Arial,Helvetica,sans-serif;font-size:0.59rem;margin-top:0.18rem;color:var(--subtle);font-weight:500;}
.cat-btn.active .cat-salary{color:var(--gold2);}
.jornada-toggle{display:grid;grid-template-columns:1fr 1fr;gap:0.45rem;margin-bottom:0.8rem;}
.jorn-btn{background:var(--surface);border:1.5px solid var(--border);border-radius:7px;color:var(--muted);font-family:Arial,Helvetica,sans-serif;font-size:0.76rem;font-weight:600;padding:0.62rem;text-align:center;cursor:pointer;transition:all 0.15s;}
.jorn-btn.active{background:var(--goldbg);border-color:var(--gold2);color:var(--gold);}
.jorn-sub{display:block;font-size:0.61rem;margin-top:0.13rem;font-weight:500;opacity:0.8;}
#parcial-field,#f-parcial-field{display:none;}
.field{margin-bottom:0.8rem;}
.field:last-child{margin-bottom:0;}
.field-label{font-size:0.73rem;font-weight:700;color:var(--text2);margin-bottom:0.35rem;display:flex;align-items:center;gap:0.45rem;}
.field-badge{font-family:Arial,Helvetica,sans-serif;font-size:0.57rem;font-weight:600;color:var(--gold);background:var(--goldbg);border:1px solid var(--goldline);border-radius:4px;padding:0.1rem 0.4rem;}
input[type=number],input[type=date],select{width:100%;background:var(--surface);border:1.5px solid var(--border);border-radius:7px;color:var(--text);font-family:Arial,Helvetica,sans-serif;font-size:1rem;font-weight:500;padding:0.58rem 0.8rem;outline:none;transition:border-color 0.15s,background 0.15s;-webkit-appearance:none;appearance:none;}
input[type=number]{font-family:Arial,Helvetica,sans-serif;font-size:1.05rem;}
input[type=number]:focus,input[type=date]:focus,select:focus{border-color:var(--gold2);background:var(--goldbg);}
input[type=number]::-webkit-inner-spin-button{display:none;}
input::placeholder{color:var(--subtle);}
select{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 1l5 5 5-5' stroke='%238a7a65' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 0.8rem center;padding-right:2.2rem;cursor:pointer;}
select option{background:var(--card);}
.field-hint{font-size:0.63rem;color:var(--muted);margin-top:0.35rem;font-weight:500;line-height:1.4;}
.date-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.45rem;}
.paga-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0.45rem;}
.paga-btn{background:var(--surface);border:1.5px solid var(--border);border-radius:7px;color:var(--muted);font-family:Arial,Helvetica,sans-serif;font-size:0.71rem;font-weight:600;padding:0.58rem 0.3rem;text-align:center;cursor:pointer;transition:all 0.15s;user-select:none;line-height:1.3;width:100%;}
.paga-btn:hover{border-color:var(--gold2);background:var(--goldbg);}
.paga-btn.active{background:var(--goldbg);border-color:var(--gold2);color:var(--gold);}
.paga-sub{display:block;font-size:0.57rem;margin-top:0.1rem;color:var(--subtle);font-weight:500;}
.paga-btn.active .paga-sub{color:var(--gold2);}
.switch-row{display:flex;align-items:center;justify-content:space-between;}
.switch-text{font-size:0.73rem;font-weight:700;color:var(--text2);}
.switch-sub{font-size:0.63rem;color:var(--muted);margin-top:0.1rem;font-weight:500;}
.switch{position:relative;width:44px;height:24px;flex-shrink:0;}
.switch input{opacity:0;width:0;height:0;}
.slider{position:absolute;cursor:pointer;inset:0;background:var(--border2);border-radius:24px;transition:0.2s;}
.slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background:white;border-radius:50%;transition:0.2s;box-shadow:0 1px 3px rgba(44,36,22,0.2);}
input:checked + .slider{background:var(--gold2);}
input:checked + .slider:before{transform:translateX(20px);}
#plus-servicio-field{display:none;margin-top:0.8rem;}
.btn-calc{width:100%;background:var(--gold2);color:#fff;border:none;border-radius:8px;font-family:Arial,Helvetica,sans-serif;font-size:1.35rem;letter-spacing:0.12em;padding:0.88rem;cursor:pointer;transition:background 0.15s;margin-top:0.65rem;box-shadow:0 2px 8px rgba(33,99,79,0.25);display:block;}
.btn-calc:hover{background:var(--gold);}
.btn-calc:active{opacity:0.92;}
.error-box{background:var(--redbg);border:1px solid #e8b4b4;border-radius:7px;padding:0.62rem 0.85rem;font-size:0.73rem;font-weight:600;color:var(--red);display:none;margin-top:0.5rem;}
#resultado,#resultado-finiquito,#resultado-baja{display:none;margin-top:0.65rem;}
.res-top{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:1.1rem 1.2rem;margin-bottom:0.55rem;box-shadow:0 1px 4px rgba(44,36,22,0.07);}
.res-top .res-section-label{font-family:Arial,Helvetica,sans-serif;font-size:0.58rem;letter-spacing:0.14em;text-transform:uppercase;margin-bottom:0.38rem;margin-top:0.7rem;font-weight:600;}
.res-top .res-section-label:first-child{margin-top:0;}
.res-section-label.green{color:var(--green);}
.res-section-label.red{color:var(--red);}
.res-section-label.blue{color:var(--blue);}
.res-row{display:flex;justify-content:space-between;align-items:baseline;padding:0.45rem 0;border-bottom:1px solid var(--border);}
.res-row:last-child{border-bottom:none;}
.res-concept{font-size:0.76rem;font-weight:500;color:var(--muted);flex:1;padding-right:0.5rem;}
.res-val{font-family:Arial,Helvetica,sans-serif;font-size:0.83rem;font-weight:600;white-space:nowrap;}
.res-val.up{color:var(--green);}
.res-val.down{color:var(--red);}
.res-val.neu{color:var(--text);}
.res-val.exento{color:var(--blue);}
.res-divider{height:1px;background:var(--border);margin:0.5rem 0;}
.bruto-row{display:flex;justify-content:space-between;align-items:center;padding:0.5rem 0 0.2rem;}
.bruto-label{font-size:0.85rem;font-weight:700;color:var(--text);}
.bruto-val{font-family:Arial,Helvetica,sans-serif;font-size:1.1rem;font-weight:700;color:var(--text);}
.neto-box{background:var(--goldbg);border:1.5px solid var(--goldline);border-radius:10px;padding:1.15rem 1.2rem;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 8px rgba(33,99,79,0.1);margin-bottom:0.55rem;}
.neto-label{font-family:Arial,Helvetica,sans-serif;font-size:1.05rem;letter-spacing:0.08em;color:var(--gold);}
.neto-label span{display:block;font-family:Arial,Helvetica,sans-serif;font-size:0.65rem;font-weight:500;letter-spacing:0;color:var(--muted);margin-top:0.15rem;}
.neto-val{font-family:Arial,Helvetica,sans-serif;font-size:1.9rem;font-weight:700;color:var(--gold);}
.info-box{background:var(--greenbg);border:1px solid #b4d8bc;border-radius:7px;padding:0.75rem 0.9rem;font-size:0.72rem;font-weight:500;color:#2d5a35;line-height:1.55;margin-bottom:0.55rem;}
.info-box strong{color:var(--green);font-weight:700;}
.info-box.blue{background:var(--bluebg);border-color:#b4c8e0;color:#1e3f6a;}
.info-box.blue strong{color:var(--blue);}
.exento-box{background:var(--bluebg);border:1px solid #b4c8e0;border-radius:7px;padding:0.75rem 0.9rem;font-size:0.72rem;font-weight:500;color:#2a4a6a;line-height:1.55;margin-bottom:0.55rem;}
.exento-box strong{color:var(--blue);font-weight:700;}
.seo-header{text-align:center;margin-bottom:1rem;}
.seo-header h2{font-family:Arial,Helvetica,sans-serif;font-size:1.8rem;letter-spacing:0.05em;color:var(--text);line-height:1.1;}
.seo-header p{font-size:0.75rem;color:var(--muted);font-weight:500;margin-top:0.3rem;}
/* NUEVOS ESTILOS PARA LA SECCIÓN DE PREGUNTAS FRECUENTES */
.disclaimer{font-size:0.62rem;font-weight:500;color:var(--subtle);text-align:center;margin-top:1.75rem;line-height:1.7;}
.btn-pdf{width:100%;background:transparent;color:var(--gold);border:1.5px solid var(--goldline);border-radius:8px;font-family:Arial,Helvetica,sans-serif;font-size:0.8rem;font-weight:700;padding:0.7rem;cursor:pointer;transition:all 0.15s;margin-top:0.55rem;display:flex;align-items:center;justify-content:center;gap:0.45rem;}
.btn-pdf:hover{background:var(--goldbg);border-color:var(--gold2);}
.btn-pdf:disabled{opacity:0.6;cursor:wait;}
/* ═══ CUADRANTE ═══ */
.cal-nav{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;margin-bottom:0.7rem;}
.cal-arrow{background:var(--surface);border:1.5px solid var(--border);border-radius:8px;color:var(--gold2);font-size:1.35rem;line-height:1;width:2.3rem;height:2.3rem;cursor:pointer;font-family:Arial,Helvetica,sans-serif;padding:0;transition:all 0.15s;}
.cal-arrow:hover{background:var(--goldbg);border-color:var(--gold2);}
.cal-mes{flex:1;text-align:center;font-family:Arial,Helvetica,sans-serif;font-size:1.15rem;letter-spacing:0.06em;color:var(--text);}
.cal-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-bottom:3px;}
.cal-dow span{text-align:center;font-family:Arial,Helvetica,sans-serif;font-size:0.58rem;font-weight:600;color:var(--subtle);letter-spacing:0.06em;padding:0.2rem 0;}
.cal-dow span.fs{color:var(--gold2);}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;}
.cal-cell{aspect-ratio:1/1.25;background:var(--surface);border:1.5px solid var(--border);border-radius:6px;padding:0.15rem 0.1rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;transition:all 0.12s;overflow:hidden;min-height:44px;}
.cal-cell:hover{border-color:var(--gold2);}
.cal-cell.vacio{background:transparent;border-color:transparent;cursor:default;}
.cal-cell.hoy{box-shadow:0 0 0 2px var(--goldline);}
.cal-num{font-family:Arial,Helvetica,sans-serif;font-size:0.62rem;font-weight:600;color:var(--muted);line-height:1.1;}
.cal-cell.finde{background:#eceeeb;border-color:#d5dad3;}
.cal-cell.finde .cal-num{color:var(--text2);}
.cal-tag{font-family:Arial,Helvetica,sans-serif;font-size:0.5rem;font-weight:600;line-height:1.25;text-align:center;margin-top:0.08rem;letter-spacing:-0.02em;}
.cal-cell.trab{background:var(--greenbg);border-color:#b4d8bc;}
.cal-cell.trab .cal-tag{color:var(--green);}
.cal-cell.trab .cal-num{color:#2d5a35;}
.cal-cell.vac{background:var(--bluebg);border-color:#b4c8e0;}
.cal-cell.vac .cal-tag{color:var(--blue);font-size:0.7rem;}
.cal-cell.vac .cal-num{color:#1e3f6a;}
.cal-cell.finde.trab{background:linear-gradient(135deg,var(--greenbg) 55%,#e2e6e0);border-color:#b4d8bc;}
.cal-cell.finde.vac{background:linear-gradient(135deg,var(--bluebg) 55%,#e2e6e0);}
.cal-hrs{font-family:Arial,Helvetica,sans-serif;font-size:0.56rem;font-weight:700;color:var(--text2);margin-top:auto;}
.cal-leyenda{display:flex;gap:0.75rem;justify-content:center;flex-wrap:wrap;margin-top:0.6rem;}
.cal-leyenda span{display:flex;align-items:center;gap:0.25rem;font-size:0.6rem;color:var(--muted);font-weight:500;}
.lg{width:9px;height:9px;border-radius:2px;display:inline-block;border:1px solid;}
.lg-trab{background:var(--greenbg);border-color:#b4d8bc;}
.lg-vac{background:var(--bluebg);border-color:#b4c8e0;}
.lg-fest{background:#eceeeb;border-color:#d5dad3;}
.cal-resumen{margin-top:0.75rem;background:var(--card);border:1px solid var(--border);border-radius:9px;padding:0.75rem 0.85rem;}
.cal-res-row{display:flex;justify-content:space-between;align-items:baseline;padding:0.28rem 0;font-size:0.73rem;}
.cal-res-row + .cal-res-row{border-top:1px solid var(--border);}
.cal-res-lbl{color:var(--muted);font-weight:500;}
.cal-res-val{font-family:Arial,Helvetica,sans-serif;font-weight:700;color:var(--text);}
.cal-res-row.destacada .cal-res-lbl{color:var(--text);font-weight:700;}
.cal-res-row.destacada .cal-res-val{color:var(--gold);font-size:0.85rem;}
.cal-vacio-msg{text-align:center;font-size:0.7rem;color:var(--muted);padding:0.5rem 0;font-weight:500;}
/* ═══ DIÁLOGO DEL CUADRANTE ═══ */
.dlg-overlay{position:fixed;inset:0;background:#213e3380;z-index:10000;display:none;align-items:center;justify-content:center;padding:1rem;backdrop-filter:blur(2px);}
.dlg-overlay.abierto{display:flex;}
.dlg{background:var(--card);border-radius:16px;width:100%;max-width:420px;max-height:88vh;max-height:88dvh;display:flex;flex-direction:column;box-shadow:0 12px 40px #213e3340;overflow:hidden;}
.dlg-head{background:var(--goldbg);border-bottom:1px solid var(--goldline);padding:1rem 1.2rem;}
.dlg-title{font-weight:700;letter-spacing:-.01em;color:var(--gold);}
.dlg-sub{color:var(--muted);margin-top:.15rem;}
.dlg-body{padding:1.1rem 1.2rem;overflow-y:auto;flex:1;}
.dlg-label{margin-bottom:.6rem;}
/* Cada tramo: entrada, «a», salida y quitar. Altura fija para que Safari no aplaste los campos de hora. */
.tramo,.tramo-head{display:grid;grid-template-columns:minmax(0,1fr) 1.1rem minmax(0,1fr) 44px;gap:.5rem;align-items:center;}
.tramo{margin-bottom:.6rem;}
.tramo-head{margin-bottom:.35rem;color:var(--muted);font-size:var(--type-meta);font-weight:600;}
.tramo-head span:nth-child(odd){padding-left:.15rem;}
.tramo input[type=time]{display:block;width:100%;min-width:0;height:3rem;min-height:48px;box-sizing:border-box;margin:0;padding:0 .5rem;background:#fff;border:1px solid var(--border2);border-radius:10px;color:var(--text);font-family:inherit;font-size:max(1rem,16px);font-weight:600;line-height:1.2;font-variant-numeric:tabular-nums;text-align:center;-webkit-appearance:none;appearance:none;outline:none;}
.tramo input[type=time]::-webkit-date-and-time-value{text-align:center;min-height:1.2em;line-height:1.2;}
.tramo input[type=time]::-webkit-datetime-edit{padding:0;}
.tramo input[type=time]::-webkit-calendar-picker-indicator{margin-left:.2rem;opacity:.55;cursor:pointer;}
.tramo input[type=time]:focus{border-color:var(--gold);box-shadow:0 0 0 3px var(--goldbg);}
.tramo-sep{text-align:center;color:var(--muted);font-weight:600;font-size:var(--type-note);}
.tramo-del{width:44px;height:44px;padding:0;border-radius:10px;background:var(--redbg);border:1px solid #e3b5b5;color:var(--red);font-family:inherit;font-size:1.25rem;line-height:1;cursor:pointer;}
.tramo-del:hover{background:#f6dede;}
.dlg-add{width:100%;min-height:44px;background:transparent;border:1px dashed var(--border2);border-radius:10px;color:var(--gold);font-family:inherit;font-weight:600;padding:.6rem;cursor:pointer;margin-top:.1rem;transition:background .15s,border-color .15s;}
.dlg-add:hover{border-color:var(--gold);background:var(--goldbg);}
.dlg-nota{color:var(--muted);margin-top:.7rem;min-height:1rem;}
.dlg-nota b{color:var(--green);font-weight:700;}
.dlg-switches{margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--border);}
.dlg-foot{display:flex;gap:.5rem;padding:.9rem 1.2rem;border-top:1px solid var(--border);background:var(--surface);}
.dlg-btn{flex:1;min-height:44px;border-radius:10px;font-family:inherit;font-weight:700;padding:.6rem .4rem;cursor:pointer;border:1px solid transparent;transition:background .15s;}
.dlg-borrar{background:transparent;color:var(--red);border-color:#e3b5b5;}
.dlg-borrar:hover{background:var(--redbg);}
.dlg-cancelar{background:transparent;color:var(--text2);border-color:var(--border2);}
.dlg-cancelar:hover{background:var(--border);}
.dlg-guardar{background:var(--gold);color:#fff;}
.dlg-guardar:hover{background:var(--gold2);}
@media(max-width:360px){
  .tramo,.tramo-head{gap:.35rem;grid-template-columns:minmax(0,1fr) .8rem minmax(0,1fr) 44px;}
  .tramo input[type=time]{padding:0 .3rem;}
  .dlg-body,.dlg-foot{padding-left:1rem;padding-right:1rem;}
}
@media(max-width:360px){
  .cal-cell{min-height:40px;}
  .cal-num{font-size:0.58rem;}
  .cal-tag{font-size:0.46rem;}
}
/* ═══ AVISO DE INSTALACIÓN ═══ */
#inst-banner{position:fixed;left:0;right:0;bottom:0;z-index:9998;background:var(--card);border-top:1.5px solid var(--goldline);box-shadow:0 -4px 18px rgba(44,36,22,0.14);padding:0.95rem 1rem 1.1rem;display:none;animation:instSube 0.3s ease-out;}
#inst-banner.visible{display:block;}
@keyframes instSube{from{transform:translateY(100%);}to{transform:translateY(0);}}
.inst-wrap{max-width:420px;margin:0 auto;position:relative;}
.inst-x{position:absolute;top:-0.35rem;right:-0.2rem;background:transparent;border:none;color:var(--subtle);font-size:1.3rem;line-height:1;cursor:pointer;padding:0.2rem 0.4rem;font-family:Arial,Helvetica,sans-serif;}
.inst-x:hover{color:var(--muted);}
.inst-top{display:flex;align-items:center;gap:0.7rem;padding-right:1.6rem;}
.inst-icono{width:2.6rem;height:2.6rem;border-radius:11px;flex-shrink:0;overflow:hidden;box-shadow:0 2px 7px rgba(33,99,79,0.3);}
.inst-tit{font-size:0.85rem;font-weight:700;color:var(--text);line-height:1.25;}
.inst-sub{font-size:0.7rem;color:var(--muted);font-weight:500;margin-top:0.12rem;line-height:1.4;}
.inst-pasos{margin-top:0.8rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:0.7rem 0.8rem;}
.inst-btn{width:100%;margin-top:0.8rem;background:var(--gold2);color:#fff;border:none;border-radius:8px;font-family:Arial,Helvetica,sans-serif;font-size:0.85rem;font-weight:700;padding:0.72rem;cursor:pointer;box-shadow:0 2px 8px rgba(33,99,79,0.28);}
.inst-btn:hover{background:var(--gold);}
/* Extend only the bar across the body's side gutters; keep its contents aligned. */
.topbar{position:sticky;top:0;z-index:100;width:calc(100% + 2rem);padding-inline:1rem;background:rgba(250,248,245,0.93);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);margin-bottom:0.4rem;}
.topbar-inner{max-width:420px;margin:0 auto;display:flex;align-items:center;gap:0.5rem;padding:0.55rem 1rem;}
.brand{display:flex;align-items:center;gap:0.4rem;text-decoration:none;}
.brand-icon{width:1.4rem;height:1.4rem;border-radius:4px;display:block;flex-shrink:0;}
.brand-name{font-family:Arial,Helvetica,sans-serif;font-size:0.95rem;letter-spacing:0.08em;color:var(--text);}
.brand-name em{color:var(--gold2);font-style:normal;}
/* ═══ MENÚ LATERAL ═══ */
.menu-btn{background:transparent;border:none;cursor:pointer;padding:0.35rem 0.5rem 0.35rem 0;display:flex;flex-direction:column;justify-content:center;gap:4px;width:2rem;flex-shrink:0;}
.menu-btn span{display:block;height:2px;width:19px;background:var(--gold2);border-radius:2px;}
.menu-overlay{position:fixed;inset:0;background:rgba(44,36,22,0.45);z-index:10500;opacity:0;visibility:hidden;transition:opacity 0.22s;backdrop-filter:blur(2px);}
.menu-overlay.abierto{opacity:1;visibility:visible;}
.menu-panel{position:fixed;top:0;left:0;bottom:0;width:82%;max-width:300px;background:var(--card);z-index:10600;transform:translateX(-100%);transition:transform 0.26s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;box-shadow:4px 0 22px rgba(44,36,22,0.2);}
.menu-panel.abierto{transform:translateX(0);}
.menu-cab{background:linear-gradient(135deg,var(--gold2),var(--gold));padding:1.1rem 1.1rem 1rem;display:flex;align-items:center;justify-content:space-between;}
.menu-marca{display:flex;align-items:center;gap:0.5rem;}
.menu-marca-ico{width:2.1rem;height:2.1rem;border-radius:8px;display:block;flex-shrink:0;box-shadow:0 1px 5px rgba(44,36,22,0.22);}
.menu-marca-txt{font-family:Arial,Helvetica,sans-serif;font-size:1.05rem;letter-spacing:0.07em;color:#fff;line-height:1.1;}
.menu-marca-sub{font-size:0.58rem;color:rgba(255,255,255,0.85);font-weight:500;margin-top:0.1rem;}
.menu-x{background:transparent;border:none;color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;padding:0 0.2rem;font-family:Arial,Helvetica,sans-serif;}
.menu-lista{flex:1;overflow-y:auto;padding:0.6rem 0 1.2rem;}
.menu-grupo{font-family:Arial,Helvetica,sans-serif;font-size:0.54rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--subtle);font-weight:600;padding:0.9rem 1.1rem 0.4rem;}
.menu-link{display:flex;align-items:center;gap:0.7rem;padding:0.72rem 1.1rem;text-decoration:none;color:var(--text2);font-size:0.82rem;font-weight:600;border-left:3px solid transparent;transition:background 0.15s;}
.menu-link:hover{background:var(--surface);}
.menu-link.activo{background:var(--goldbg);border-left-color:var(--gold2);color:var(--gold);}
.menu-ico{font-size:1rem;width:1.3rem;text-align:center;flex-shrink:0;}
.menu-pie{border-top:1px solid var(--border);padding:0.8rem 1.1rem;font-size:0.6rem;color:var(--subtle);line-height:1.5;}

/* Ajustes de diseño de la calculadora (antes design.css). */
:root{--bg:#f7f6f2;--surface:#f7f8f5;--border:#dfe5dd;--border2:#bfcabd;--gold:#21634f;--gold2:#28765c;--goldbg:#eef6ed;--goldline:#b9d4b4;--text:#213e33;--text2:#3d554a;--muted:#66766d;--subtle:#748578;}
body{background:radial-gradient(ellipse at 85% 0,#eaf2e5 0,transparent 40%),var(--bg);}
.wrap{max-width:760px;}
.topbar{background:#ffffffed;border-bottom:1px solid var(--border);}
.topbar-inner{max-width:792px;padding-top:.85rem;padding-bottom:.85rem;}
header{text-align:left;padding:2rem 0 1.5rem;}
.header-label{font-family:Arial,Helvetica,sans-serif;font-size:.66rem;letter-spacing:.13em;margin-bottom:.85rem;}
h1{font-family:Arial,Helvetica,sans-serif;font-size:clamp(2rem,5vw,3.2rem);font-weight:700;letter-spacing:-.055em;line-height:1.12;}
h1 em{color:var(--gold);}
.header-sub{font-size:.92rem;line-height:1.65;max-width:38rem;margin-top:1rem;}
.header-story{font-size:.94rem;line-height:1.7;max-width:40rem;margin-top:.85rem;color:var(--text2);}
.tab-selector{border-radius:14px;padding:5px;margin-bottom:1.25rem;box-shadow:none;}
.tab-btn{font-size:.83rem;padding:.8rem .3rem;border-radius:10px;}
.tab-btn-sub{font-size:.66rem;margin-top:.2rem;}
.tab-btn.active{background:var(--gold);color:white;box-shadow:none;}
.card{border-radius:16px;padding:1.4rem;margin-bottom:1rem;box-shadow:0 3px 15px #213e3305;}
.card-label{font-family:Arial,Helvetica,sans-serif;font-size:.72rem;letter-spacing:.1em;color:var(--muted);}
.cat-grid{grid-template-columns:repeat(3,1fr);gap:.65rem;}
.cat-btn{padding:.9rem .5rem;font-size:.8rem;border-radius:10px;}
.cat-salary{font-size:.66rem;}
.field-label{font-size:.85rem;}
.field-hint{font-size:.75rem;line-height:1.6;}
input[type=number],input[type=date],select{padding:.8rem;border-radius:10px;min-height:46px;}
.jorn-btn{padding:.9rem;border-radius:10px;font-size:.85rem;}
.btn-calc{font-family:Arial,Helvetica,sans-serif;font-size:1rem;font-weight:700;letter-spacing:0;text-transform:none;padding:1rem;border-radius:12px;box-shadow:0 5px 15px #21634f1a;}
.btn-pdf{padding:.9rem;font-size:.88rem;border-radius:10px;}
.neto-box{border-radius:14px;}
.account-card{margin:1.5rem 0;background:linear-gradient(135deg,#f1f7ef,#e8f2e3);padding:1.75rem;border-radius:20px;}
.account-card h2{font-size:1.5rem;letter-spacing:-.03em;max-width:32rem;margin:.7rem 0;}
.disclaimer{line-height:1.8;}
@media(max-width:540px){
  .cat-grid{grid-template-columns:1fr 1fr;}
  .account-comparison{grid-template-columns:1fr;}
  .account-card{padding:1.15rem;}
  .account-card h2{font-size:1.3rem;}
  .account-actions{flex-direction:column;}
  .card{padding:1.05rem;}
  header{padding-top:1.5rem;}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;}
}

/* Acceso a la cuenta en la barra superior: siempre visible al hacer scroll.
   Sin sesión: «Iniciar sesión». Con sesión: «Mi cuenta» lleva a la tarjeta de la cuenta. */
.calculator-page .topbar-inner{flex-wrap:nowrap;}
.calculator-page .topbar-inner .brand{min-width:0;}
.topbar-account{margin-left:auto;flex-shrink:0;display:flex;}
.topbar-login,.topbar-member{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:44px;padding:.5rem 1rem;border:1px solid var(--goldline);border-radius:999px;background:var(--card);color:var(--gold);font-family:inherit;font-size:var(--type-note);font-weight:700;line-height:1.2;white-space:nowrap;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s;}
.topbar-login:hover,.topbar-member:hover{background:var(--goldbg);border-color:var(--gold);}
.topbar-login svg,.topbar-member svg{flex-shrink:0;}
.topbar-member,html.nv-signed-in .topbar-login{display:none;}
html.nv-signed-in .topbar-member{display:inline-flex;}
#account-section{scroll-margin-top:5.5rem;}
@media(max-width:400px){
  .calculator-page .topbar-inner{gap:.5rem;padding-left:.75rem;padding-right:.75rem;}
  .calculator-page .brand{gap:.45rem;}
  .calculator-page .brand-icon{width:2rem;height:2rem;}
  .calculator-page .brand-name{font-size:.8rem;line-height:1.15;}
  .topbar-login,.topbar-member{padding:.45rem .7rem;gap:.3rem;}
}
@media(max-width:340px){
  .calculator-page .brand-name{display:none;}
}

/* Finiquito: vacaciones calculadas solas. */
.vac-auto-row{margin:.35rem 0 .9rem;padding:.75rem .9rem;border:1px solid var(--goldline);border-radius:12px;background:var(--goldbg);}
#f-vacas.vac-auto-valor{background:var(--goldbg);border-color:var(--goldline);color:var(--gold);font-weight:700;cursor:default;}
.vac-auto-nota{margin:.6rem 0 0;padding-left:.8rem;border-left:2px solid var(--goldline);color:var(--text2);font-size:var(--type-note);line-height:1.6;}
.vac-auto-nota[hidden]{display:none;}