/* ============================================================
   SEBAS FIT · Finanzas — usa los tokens de Sculpt (--ground, --surface, --raised, --accent…)
   ============================================================ */
.fi{padding-bottom:40px}
.fi > * + *{margin-top:0}
.fi-grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.fi-card-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.fi-card-head h3{margin:0}
.fi-ok{color:var(--ok)}
.fi-sm{width:96px;padding:6px 8px;font-size:13px;text-align:right}
.fi-big{font-size:22px;font-weight:700}
.fi-big2{font-size:34px;font-weight:700;line-height:1}
.fi-free{margin:0 0 20px;padding:12px 16px;border:1px dashed var(--hairline);border-radius:var(--radius-sm);color:var(--muted);font-size:13.5px}
.fi-free b{color:var(--ink)}

.fi-notice{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:12px 16px;margin:18px 0 0;border-radius:var(--radius-sm);font-size:13.5px}
.fi-notice.warn{background:rgba(227,171,82,.12);border:1px solid rgba(227,171,82,.4);color:var(--warn)}
.fi > .fi-notice + .blk, .fi > .fi-notice + section{margin-top:18px}

.fi-meter{height:10px;border-radius:999px;background:var(--raised-2);overflow:hidden}
.fi-meter > i{display:block;height:100%;border-radius:999px}
.fi-meter.thin{height:6px}

/* hoy: héroe */
.fi-hero{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius);padding:24px 24px 18px}
.fi-hero-amt{font-family:var(--f-display);font-weight:700;font-size:clamp(60px,15vw,112px);line-height:.9;margin-top:10px;color:var(--ink);letter-spacing:.005em}
.fi-hero-amt.neg{color:var(--danger)}
.fi-hero-sub{color:var(--ink-dim);margin:10px 0 16px;max-width:62ch}
.fi-hero-foot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:10px;font-size:12px;color:var(--muted-2)}

/* clases y cobros */
.fi-pers{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.fi-per{background:var(--surface);border:1px solid var(--hairline-soft);border-radius:var(--radius);padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.fi-per-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:13.5px}
.fi-per-k{color:var(--muted)}
.fi-per-rec{padding-top:6px;border-top:1px dashed var(--hairline)}
.fi-per-rec b{color:var(--ok);font-size:20px}
.fi-per-big{font-size:30px;font-weight:700;line-height:1.1}
.fi-table{border:1px solid var(--hairline-soft);border-radius:var(--radius-sm);overflow:hidden}
.fi-trow{display:grid;grid-template-columns:1.6fr .6fr 1fr 1fr;gap:10px;align-items:center;padding:10px 14px;border-top:1px solid var(--hairline-soft);font-size:13.5px}
.fi-trow:first-child{border-top:0}
.fi-trow .num{text-align:right}
.fi-trow.cur{background:var(--raised)}
.fi-thead{font-family:var(--f-mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted-2);background:var(--raised)}
.fi-thead span:not(:first-child){text-align:right}
.fi-pend{display:flex;flex-direction:column;gap:10px}
.fi-pend-row{display:grid;grid-template-columns:minmax(150px,1.6fr) 110px 150px auto;gap:8px;align-items:center;padding:10px 12px;border:1px solid var(--hairline-soft);border-radius:var(--radius-sm);background:var(--raised)}
.fi-pend-row .inp{padding:7px 9px;font-size:13px}

/* diagnóstico */
.fi-score{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.fi-score-num{font-family:var(--f-display);font-weight:700;font-size:64px;line-height:.9}
.fi-parts{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;margin-bottom:6px}
.fi-part-top{display:flex;justify-content:space-between;gap:6px;font-family:var(--f-mono);font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-2);margin-bottom:5px}
.fi-part-top b{color:var(--ink);text-transform:none;letter-spacing:0;font-weight:600;font-size:11.5px}
.fi-insights{display:flex;flex-direction:column;margin-top:10px}
.fi-insight{display:grid;grid-template-columns:62px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--hairline-soft)}
.fi-sev{font-family:var(--f-mono);font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 0;border-radius:999px;height:fit-content;text-align:center}
.fi-sev.s3{background:rgba(255,157,133,.14);color:var(--danger)}
.fi-sev.s2{background:rgba(227,171,82,.14);color:var(--warn)}
.fi-sev.s1{background:rgba(127,183,126,.14);color:var(--ok)}
.fi-insight b{display:block;font-size:14px}
.fi-insight p{margin:3px 0 0;font-size:12.5px;color:var(--muted)}
.fi-insight .btn{margin-top:8px}

/* plan */
.fi-planbar{display:flex;height:14px;border-radius:999px;overflow:hidden;background:var(--raised-2)}
.fi-planbar > div{height:100%}
.fi-legend{display:flex;gap:6px 16px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-dim);margin-top:10px}
.fi-legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px}
.fi-verdict{padding:12px 14px;border-radius:var(--radius-sm);font-size:13.5px}
.fi-verdict b{display:block;font-size:15px;margin-bottom:4px}
.fi-verdict ul{margin:6px 0 0;padding-left:18px;color:var(--ink-dim)}
.fi-verdict.ok{background:rgba(127,183,126,.14);color:var(--ok)}
.fi-verdict.justo{background:rgba(227,171,82,.14);color:var(--warn)}
.fi-verdict.no{background:rgba(255,157,133,.14);color:var(--danger)}
.fi-verdict.sin-plan{background:var(--raised);color:var(--muted)}

/* deudas y tarjetas */
.fi-item{background:var(--surface);border:1px solid var(--hairline-soft);border-radius:var(--radius);padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.fi-item.click{cursor:pointer}.fi-item.click:hover{border-color:var(--muted-2)}
.fi-item.paid{opacity:.6}
.fi-item-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.fi-item-meta{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:12.5px;color:var(--muted)}
.fi-tag{font-family:var(--f-mono);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;padding:3px 9px;border-radius:999px;background:rgba(255,157,133,.14);color:var(--danger)}
.fi-tag.dark{background:var(--raised);color:var(--ink)}
details.fi-more > summary{cursor:pointer;font-size:12.5px;color:var(--muted);font-weight:600;list-style:none;padding:6px 0}
details.fi-more > summary::-webkit-details-marker{display:none}
details.fi-more > summary::before{content:"▸ "}
details.fi-more[open] > summary::before{content:"▾ "}
.fi-mini{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center;font-size:12.5px;color:var(--muted);padding-bottom:6px}
.fi-mini .inp{width:96px;padding:6px 8px;font-size:13px;text-align:right}

/* gastos */
.fi-donut{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.fi-donut-list{flex:1;min-width:200px;display:flex;flex-direction:column;gap:9px}
.fi-donut-item{display:flex;align-items:center;gap:8px;font-size:13px}
.fi-donut-item .dot{width:9px;height:9px;border-radius:50%;flex:none}
.fi-donut-item .name{flex:1;color:var(--ink-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fi-donut-item .amt{font-weight:600}
.fi-delta{font-family:var(--f-mono);font-size:10.5px;font-weight:600}
.fi-brow{display:grid;grid-template-columns:130px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--hairline-soft)}
.fi-brow:first-child{border-top:0}
.fi-bname{font-size:13.5px;color:var(--ink-dim)}
.fi-bctl{display:flex;align-items:center;gap:4px}
.fi-ledger{display:flex;flex-direction:column}
.fi-lrow{display:grid;grid-template-columns:50px 1fr auto auto 30px;gap:12px;align-items:center;padding:11px 4px;border-top:1px solid var(--hairline-soft);cursor:pointer}
.fi-lrow:first-child{border-top:0}
.fi-lrow:hover{background:var(--raised)}
.fi-lrow.ro{cursor:default}
.fi-ldate{font-family:var(--f-mono);font-size:11px;color:var(--muted-2);line-height:1.25;text-transform:uppercase}
.fi-ldate b{display:block;font-size:16px;color:var(--ink-dim)}
.fi-lnote{font-size:14px;font-weight:600}
.fi-lmeta{display:flex;gap:6px;align-items:center;margin-top:3px;flex-wrap:wrap}
.fi-pill{font-size:11px;font-weight:600;padding:2px 9px;border-radius:999px}
.fi-lacc{font-size:12px;color:var(--muted-2);text-align:right;white-space:nowrap}
.fi-lamt{font-weight:600;font-size:14px;text-align:right;white-space:nowrap}
.fi-lamt.income{color:var(--ok)}.fi-lamt.expense{color:var(--danger)}

/* crecer */
.fi-fondo-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.fi-srow{display:grid;grid-template-columns:1fr auto auto;gap:4px 14px;align-items:center;padding:9px 0;border-top:1px solid var(--hairline-soft)}
.fi-srow:first-child{border-top:0}

@media (max-width:820px){
  .fi-grid2{grid-template-columns:1fr}
  .fi-pers{grid-template-columns:1fr 1fr}
  .fi-pend-row{grid-template-columns:1fr 1fr}
  .fi-pend-row > div:first-child{grid-column:1 / -1}
  .fi-pend-row .btn{grid-column:1 / -1}
  .fi-parts{grid-template-columns:1fr}
}
@media (max-width:560px){
  .fi-lrow{grid-template-columns:44px 1fr auto 28px}
  .fi-lacc{display:none}
  .fi-brow{grid-template-columns:1fr auto}
  .fi-bmeter{grid-column:1 / -1;order:3}
  .fi-trow{grid-template-columns:1.5fr .5fr .9fr .9fr;padding:9px 10px;font-size:12.5px}
}

/* gastos de siempre */
.fi-gf{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.fi-gf-row{display:grid;grid-template-columns:minmax(0,1.6fr) 100px 130px auto;gap:8px;align-items:center}
.fi-gf-row .inp{padding:8px 10px;font-size:13.5px;min-width:0}
.fi-gf-add{margin-top:6px;padding-top:12px;border-top:1px dashed var(--hairline)}
.fi-gf-fondo{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px;padding:12px 14px;background:var(--raised);border-radius:var(--radius-sm)}
.fi-gf-fondo > div:first-child{flex:1;min-width:200px}
@media (max-width:560px){ .fi-gf-row{grid-template-columns:1fr 1fr} .fi-gf-row > :first-child{grid-column:1 / -1} .fi-gf-row .btn{grid-column:1 / -1} }

/* guía */
.fi-pasos{display:flex;flex-direction:column}
.fi-paso{display:flex;align-items:center;gap:14px;padding:13px 0;border-top:1px solid var(--hairline-soft)}
.fi-paso:first-child{border-top:0;padding-top:2px}
.fi-paso-n{flex:none;width:28px;height:28px;border-radius:50%;background:var(--raised-2);color:var(--ink);display:flex;align-items:center;justify-content:center;font-family:var(--f-mono);font-size:13px;font-weight:600}
.fi-paso.ok .fi-paso-n{background:rgba(127,183,126,.2);color:var(--ok)}
.fi-paso-body{flex:1;min-width:0}
.fi-paso-body b{font-size:15px}
.fi-resumen{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:11px;color:var(--ink-dim);font-size:14px;line-height:1.5}
.fi-resumen b{color:var(--ink)}

/* apartados */
.fi-ap-act{display:flex;gap:8px;align-items:center;margin-top:4px}
.fi-ap-act .inp{width:120px;padding:7px 9px;font-size:13px}

.fi-ajustes{margin-top:14px;padding-top:4px;border-top:1px dashed var(--hairline)}
.fi-ajustes .fi-paso{padding:10px 0}

.fi-extra-blk{margin-top:14px;padding-top:12px;border-top:1px dashed var(--hairline)}

/* iPhone y iPad: tacto cómodo (44 px, como pide Apple), fechas de iOS que no se desbordan, y espacio para la barra inferior y la raya de inicio */
.fi input[type=date],.fi input[type=number],.fi select{min-width:0;max-width:100%}
.fi input[type=date]{-webkit-appearance:none;appearance:none;min-height:42px}
.fi{padding-bottom:calc(40px + env(safe-area-inset-bottom))}
@media (pointer:coarse){
  .fi .btn,.fi .btn.sm{min-height:44px;padding-top:10px;padding-bottom:10px}
  .fi .inp,.fi select.inp{min-height:44px}
  .fi .seg button,.fi .tabs button{min-height:44px}
  .fi-gf-row .btn{min-height:44px}
  .fi-lrow{padding-top:14px;padding-bottom:14px}
}
@media (max-width:560px){ .fi-ap-act{flex-wrap:wrap} .fi-ap-act .inp{flex:1;min-width:120px} .fi-paso{flex-wrap:wrap} .fi-paso .btn{margin-left:42px} }
@media (min-width:561px) and (max-width:1100px){ .fi-pers{grid-template-columns:repeat(2,1fr)} }