@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@500;700&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500;600&display=swap');
:root{
  --paper:#F2EBD9; --paper-2:#E7DDC0; --paper-white:#FBF8EF;
  --ink:#23291F; --ink-soft:#65604A; --ink-faint:#948D6E; --rule:#CBBF9E;
  --forest:#2E4A3D; --forest-dark:#1C2E26; --forest-light:#3F6350;
  --stamp:#A8442C; --stamp-bg:#F3E1D9; --gold:#A9862F;
  --shadow:0 2px 10px rgba(28,46,38,.16); --radius:3px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:var(--paper);color:var(--ink);font-family:'IBM Plex Sans',sans-serif;min-height:100vh;}
h1,h2,h3,.slab{font-family:'Roboto Slab',serif;}
.mono{font-family:'IBM Plex Mono',monospace;}
a{color:var(--forest);}
button,input,select,textarea{font-family:inherit;}

/* ---- LOGIN ---- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;}
.login-card{width:100%;max-width:380px;background:var(--forest-dark);border-radius:6px;box-shadow:var(--shadow);padding:36px 32px 28px;position:relative;overflow:hidden;}
.login-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:10px;background:repeating-linear-gradient(180deg,var(--gold) 0 3px, transparent 3px 10px);opacity:.7;}
.login-logo{display:block;margin:0 auto 14px;width:68px;height:68px;object-fit:contain;border-radius:10px;background:var(--paper-white);padding:6px;box-shadow:var(--shadow);}
.login-card h1{color:var(--paper-white);font-size:22px;margin:0 0 2px;text-align:center;}
.login-card .sub{color:#B9C2BA;font-size:12.5px;margin:0 0 26px;text-transform:uppercase;letter-spacing:.4px;text-align:center;}
.login-card label{display:block;color:#CFD6CF;font-size:12px;margin:14px 0 6px;text-transform:uppercase;letter-spacing:.5px;}
.login-card input{width:100%;padding:10px 12px;border-radius:var(--radius);border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);color:var(--paper-white);font-size:14.5px;}
.login-btn{margin-top:22px;width:100%;padding:11px;border:none;border-radius:var(--radius);background:var(--gold);color:var(--forest-dark);font-weight:700;font-size:14.5px;}
.login-error{color:#E6A28F;font-size:12.5px;margin-top:10px;}
.login-hint{margin-top:16px;font-size:11.5px;color:#93A096;line-height:1.5;}

/* ---- SHELL ---- */
.shell{display:flex;min-height:100vh;}
.sidebar{width:216px;flex-shrink:0;background:var(--forest-dark);display:flex;flex-direction:column;padding:22px 0 16px;}
.brand{padding:0 20px 20px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:10px;display:flex;align-items:center;gap:10px;}
.brand-logo{width:38px;height:38px;object-fit:contain;border-radius:7px;background:var(--paper-white);padding:3px;flex-shrink:0;}
.brand .name{color:var(--paper-white);font-size:16px;font-weight:700;}
.brand .tag{color:var(--gold);font-size:10.5px;text-transform:uppercase;letter-spacing:1px;margin-top:3px;}
.nav{flex:1;display:flex;flex-direction:column;gap:2px;padding:10px 0;}
.nav a{display:flex;align-items:center;gap:10px;padding:10px 20px 10px 18px;margin-right:14px;color:#C9D0C7;text-decoration:none;font-size:13.5px;font-weight:500;border-left:3px solid transparent;border-radius:0 20px 20px 0;}
.nav a:hover{background:rgba(255,255,255,.06);color:#fff;}
.nav a.active{background:var(--paper);color:var(--ink);border-left:3px solid var(--gold);font-weight:600;}
.sidebar-foot{padding:14px 20px 0;border-top:1px solid rgba(255,255,255,.08);margin-top:8px;}
.who{color:#EDE9D8;font-size:12.5px;font-weight:600;}
.who .rol{display:block;color:var(--gold);font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;margin-top:2px;}
.logout-btn{margin-top:10px;display:block;text-align:center;width:100%;background:transparent;border:1px solid rgba(255,255,255,.18);color:#D8DED6;padding:8px;border-radius:var(--radius);font-size:12px;text-decoration:none;}
.logout-btn:hover{background:rgba(255,255,255,.08);}
.main{flex:1;min-width:0;padding:26px 34px 50px;}
.main-header{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:10px;border-bottom:2px solid var(--rule);padding-bottom:14px;margin-bottom:22px;}
.main-header h2{margin:0;font-size:23px;}
.main-header .today{color:var(--ink-soft);font-size:12.5px;}

/* ---- SHARED UI ---- */
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px;}
.btn{border:none;border-radius:var(--radius);padding:9px 16px;font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:7px;text-decoration:none;cursor:pointer;}
.btn-primary{background:var(--forest);color:var(--paper-white);}
.btn-outline{background:transparent;color:var(--forest);border:1px solid var(--forest);}
.btn-danger{background:transparent;color:var(--stamp);border:1px solid var(--stamp);}
.btn-sm{padding:6px 11px;font-size:12px;}
.card{background:var(--paper-white);border:1px solid var(--rule);border-radius:6px;padding:18px 20px;box-shadow:var(--shadow);margin-bottom:20px;}
.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:22px;}
.stat{background:var(--paper-white);border:1px solid var(--rule);border-left:4px solid var(--forest);border-radius:4px;padding:14px 16px;}
.stat.alt{border-left-color:var(--stamp);}
.stat .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--ink-soft);}
.stat .val{font-family:'IBM Plex Mono',monospace;font-size:20px;font-weight:600;margin-top:5px;}
.resumen-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:22px;}
.resumen-card{border-radius:8px;padding:18px 20px;box-shadow:var(--shadow);background:var(--forest-dark);color:var(--paper-white);}
.resumen-card.egreso{background:var(--stamp);}
.resumen-card.ganancia{background:var(--gold);color:var(--forest-dark);}
.resumen-card .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.6px;opacity:.85;}
.resumen-card .val{font-family:'IBM Plex Mono',monospace;font-size:25px;font-weight:600;margin-top:8px;}
table{width:100%;border-collapse:collapse;background:var(--paper-white);border:1px solid var(--rule);border-radius:6px;overflow:hidden;}
thead th{background:var(--paper-2);color:var(--forest-dark);text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.5px;padding:10px 14px;border-bottom:1px solid var(--rule);}
tbody td{padding:11px 14px;font-size:13.5px;border-bottom:1px solid var(--rule);}
tbody tr:last-child td{border-bottom:none;}
tbody tr:hover{background:#FDFBF3;}
.num{font-family:'IBM Plex Mono',monospace;}
.muted{color:var(--ink-faint);}
.empty-row td{text-align:center;color:var(--ink-faint);padding:26px;font-style:italic;}
.actions-cell{display:flex;gap:10px;}
.actions-cell form{display:inline;}
.actions-cell button{background:none;border:none;color:var(--ink-soft);cursor:pointer;font-size:12.5px;text-decoration:underline;padding:0;}
.actions-cell button.danger{color:var(--stamp);}
.badge{display:inline-block;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:600;}
.badge-forest{background:rgba(46,74,61,.12);color:var(--forest);}
.stamp-badge{display:inline-block;border:1.5px solid var(--stamp);color:var(--stamp);padding:2px 9px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;transform:rotate(-3deg);border-radius:2px;background:var(--stamp-bg);}
.badge-low{background:var(--stamp-bg);color:var(--stamp);}
.field{margin-bottom:14px;}
.field label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-soft);margin-bottom:5px;}
.field input,.field select,.field textarea{width:100%;padding:9px 11px;border:1px solid var(--rule);border-radius:var(--radius);font-size:13.5px;background:#fff;color:var(--ink);}
.field textarea{resize:vertical;min-height:60px;}
.field-row{display:flex;gap:10px;flex-wrap:wrap;}
.field-row .field{flex:1;min-width:150px;}
.form-error{color:var(--stamp);font-size:12.5px;margin:8px 0;}
.field-note{font-size:11.5px;color:var(--ink-faint);}
.form-ok{color:var(--forest);font-size:12.5px;margin:8px 0;}
.line-item{display:flex;gap:8px;align-items:flex-end;margin-bottom:8px;flex-wrap:wrap;}
.total-line{display:flex;justify-content:space-between;padding-top:12px;margin-top:6px;border-top:1.5px solid var(--rule);font-weight:700;font-size:16px;}
.hint-box{background:var(--paper-2);border:1px dashed var(--rule);border-radius:6px;padding:14px 16px;font-size:12.5px;color:var(--ink-soft);margin-bottom:18px;line-height:1.5;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}
.cal-dow{text-align:center;font-size:10.5px;text-transform:uppercase;color:var(--ink-soft);padding-bottom:4px;}
.cal-cell{aspect-ratio:1/.85;background:var(--paper-white);border:1px solid var(--rule);border-radius:4px;padding:6px;font-size:12.5px;position:relative;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);}
.cal-cell.empty{background:transparent;border:none;}
.cal-cell.today{background:#FBF3DE;}
.cal-cell.selected{border:2px solid var(--forest);}
.cal-dots{display:flex;gap:3px;margin-top:auto;}
.dot{width:6px;height:6px;border-radius:50%;}
.dot.pend{background:var(--stamp);}
.dot.done{background:var(--forest);}
.event-row{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--paper-white);border:1px solid var(--rule);border-radius:4px;padding:10px 14px;margin-bottom:8px;}
.event-row.done{opacity:.55;}
.bar-row{margin-bottom:12px;}
.bar-row .bl{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:4px;}
.bar-track{background:var(--paper-2);border-radius:20px;height:12px;overflow:hidden;}
.bar-fill{height:100%;border-radius:20px;}
@media (max-width:760px){
  .shell{flex-direction:column;}
  .sidebar{width:100%;flex-direction:row;overflow-x:auto;padding:10px;align-items:center;}
  .brand,.sidebar-foot{display:none;}
  .nav{flex-direction:row;padding:0;}
  .nav a{border-radius:20px;border-left:none;padding:8px 14px;white-space:nowrap;}
  .nav a.active{border-left:none;border-bottom:3px solid var(--gold);}
  .main{padding:20px 16px 40px;}
}