/* ============================================================
   Follow-ups
   ============================================================ */
.fu-head{
  font-size:var(--t-label);font-weight:700;color:var(--ink-3);
  display:flex;align-items:center;gap:var(--sp-2);
  margin:var(--sp-5) 0 var(--sp-3);
}
.fu-head:first-child{margin-top:0}
.fu-head span{
  background:var(--line-soft);color:var(--ink-3);border-radius:99px;
  padding:2px 9px;font-size:var(--t-micro);font-weight:800;
}
.fu-head.urgent{color:var(--bad)}
.fu-head.urgent span{background:var(--bad-bg);color:var(--bad)}

.fu-card{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-md);margin-bottom:var(--sp-2);
  box-shadow:var(--lift);overflow:hidden;
}
.fu-card.urgent{border-left:3px solid var(--bad)}
.fu-main{display:block;width:100%;text-align:left;padding:var(--sp-3) var(--sp-4) var(--sp-2)}
.fu-when{display:block;font-size:var(--t-micro);font-weight:800;color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.06em}
.fu-when.red{color:var(--bad)}
.fu-name{display:block;font-size:var(--t-body);font-weight:650;letter-spacing:-.01em;margin-top:3px}
.fu-meta{display:block;font-size:var(--t-label);color:var(--ink-3);margin-top:2px}
.fu-acts{display:flex;gap:var(--sp-2);padding:0 var(--sp-3) var(--sp-3)}
.fu-b{
  flex:1;text-align:center;padding:10px 4px;border-radius:var(--r-sm);
  font-size:var(--t-label);font-weight:650;min-height:42px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line);background:var(--surface-2);color:var(--ink-2);
}
.fu-b.wa{background:var(--good-bg);border-color:transparent;color:var(--good)}
.fu-b.done{background:var(--navy);border-color:transparent;color:#fff}
[data-theme="dark"] .fu-b.done{background:var(--orange)}
.fu-b:active{transform:scale(.97)}

/* ============================================================
   Money
   ============================================================ */
.m-top{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-md);padding:var(--sp-4);margin-bottom:var(--sp-3);box-shadow:var(--lift);
}
.m-line{display:flex;justify-content:space-between;align-items:baseline;padding:5px 0;
  font-size:var(--t-label);color:var(--ink-2)}
.m-line b{font-size:var(--t-body);font-weight:700;color:var(--ink)}
.m-line.total{border-top:1px solid var(--line-soft);margin-top:var(--sp-2);padding-top:var(--sp-3)}
.m-line.total b{font-size:var(--t-title);letter-spacing:-.02em}

.m-actions{display:grid;grid-template-columns:2fr 1fr;gap:var(--sp-2);margin-bottom:var(--sp-5)}
.m-big{
  background:linear-gradient(160deg,var(--orange),var(--orange-deep));color:#fff;
  border-radius:var(--r-md);padding:var(--sp-4);font-weight:700;font-size:var(--t-body);
  display:flex;align-items:center;justify-content:center;gap:var(--sp-2);min-height:56px;
  box-shadow:0 10px 24px -12px rgba(243,111,36,.9);
}
.m-big svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.m-big:active{transform:scale(.98)}

/* buckets */
.bkt{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);margin-bottom:var(--sp-2);
  box-shadow:var(--lift);
}
.bkt.full{border-color:color-mix(in srgb,var(--good) 40%,var(--line))}
.bkt-top{display:flex;align-items:flex-start;gap:var(--sp-3)}
.bkt-n{
  width:22px;height:22px;border-radius:7px;flex-shrink:0;
  background:var(--navy);color:#fff;font-size:var(--t-micro);font-weight:800;
  display:grid;place-items:center;margin-top:2px;
}
.bkt.full .bkt-n{background:var(--good)}
.bkt-t{flex:1;min-width:0}
.bkt-t b{display:block;font-size:var(--t-body);font-weight:650;letter-spacing:-.01em}
.bkt-t i{display:block;font-style:normal;font-size:var(--t-micro);color:var(--ink-3);margin-top:1px}
.bkt-v{text-align:right;flex-shrink:0}
.bkt-v b{display:block;font-size:var(--t-body);font-weight:700}
.bkt-v i{display:block;font-style:normal;font-size:var(--t-micro);color:var(--ink-3)}
.bkt-bar{height:6px;border-radius:99px;background:var(--line);overflow:hidden;margin:var(--sp-3) 0 var(--sp-2)}
.bkt-bar span{display:block;height:100%;border-radius:99px;background:var(--navy);
  transition:width .8s cubic-bezier(.22,1,.36,1)}
.bkt.full .bkt-bar span{background:var(--good)}
.bkt-foot{display:flex;align-items:center;gap:var(--sp-3)}
.bkt-foot i{font-style:normal;font-size:var(--t-micro);color:var(--ink-3);flex:1}
.bkt-btn{
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:9px var(--sp-4);font-size:var(--t-label);font-weight:650;color:var(--ink-2);min-height:40px;
}
.bkt-btn:active{border-color:var(--orange);color:var(--orange)}

/* splitter */
.sp-in{
  display:flex;align-items:center;gap:var(--sp-2);
  background:var(--navy);border-radius:var(--r-md);padding:var(--sp-4);margin-bottom:var(--sp-3);
}
.sp-in .cur{font-size:var(--t-title);font-weight:800;color:var(--orange)}
.sp-in input{
  flex:1;background:transparent;border:0;color:#fff;font-size:var(--t-display);
  font-weight:800;padding:0;min-height:auto;letter-spacing:-.03em;
}
.sp-in input:focus{outline:none;box-shadow:none}
.sp-in input::placeholder{color:#55688C}
.sp-quick{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.sp-quick button{
  background:var(--surface);border:1px solid var(--line);border-radius:99px;
  padding:9px var(--sp-4);font-size:var(--t-label);font-weight:650;color:var(--ink-2);min-height:42px;
}
.sp-quick button:active{border-color:var(--orange);color:var(--orange)}

.sp-row{
  display:flex;align-items:center;gap:var(--sp-3);
  padding:11px var(--sp-3);border-radius:var(--r-sm);margin-bottom:6px;
  border:1px solid var(--line);background:var(--surface);
}
.sp-row.full{border-color:transparent;background:var(--good-bg)}
.sp-row.part{border-color:transparent;background:var(--warn-bg)}
.sp-row.none{opacity:.45}
.sp-n{width:21px;height:21px;border-radius:6px;background:var(--navy);color:#fff;
  font-size:var(--t-micro);font-weight:800;display:grid;place-items:center;flex-shrink:0}
.sp-row.full .sp-n{background:var(--good)}
.sp-row.part .sp-n{background:var(--warn)}
.sp-t{flex:1;min-width:0}
.sp-t b{display:block;font-size:var(--t-label);font-weight:650}
.sp-t i{display:block;font-style:normal;font-size:var(--t-micro);color:var(--ink-3);margin-top:1px}
.sp-v{font-size:var(--t-body);font-weight:700;flex-shrink:0}
.sp-row.full .sp-v{color:var(--good)}
.sp-row.none .sp-v{color:var(--ink-3)}
.sp-extra{
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:var(--sp-3);margin-top:var(--sp-3);
}
.sp-extra b{display:block;font-size:var(--t-body);font-weight:700}
.sp-extra span{display:block;font-size:var(--t-label);color:var(--ink-3);margin-top:3px;line-height:1.5}
.sp-empty{font-size:var(--t-label);color:var(--ink-3);line-height:1.7;text-align:center;padding:var(--sp-5) 0}
.sp-empty b{color:var(--ink)}

/* plan editor */
.plan-f{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;
  border-bottom:1px solid var(--line-soft)}
.plan-f label{flex:1;font-size:var(--t-label);font-weight:650;margin:0;display:block}
.plan-f label i{display:block;font-style:normal;font-size:var(--t-micro);color:var(--ink-3);
  font-weight:500;margin-top:1px}
.plan-f label .bkt-n{display:inline-grid;margin-right:7px;vertical-align:middle}
.plan-f .money-in{width:130px;flex-shrink:0}
.plan-f input{text-align:right;min-height:44px}
.plan-total{font-size:var(--t-label);color:var(--ink-2);text-align:center;
  padding:var(--sp-3) 0;font-weight:600}
.plan-total b{font-size:var(--t-body);color:var(--ink)}

/* expenses */
.ex-head{display:flex;align-items:baseline;gap:var(--sp-2);margin-bottom:var(--sp-3)}
.ex-head h2{font-size:var(--t-body);font-weight:700}
.ex-head span{margin-left:auto;font-size:var(--t-body);font-weight:700;color:var(--bad)}
.ex-row{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);
  padding:10px 0;border-bottom:1px solid var(--line-soft)}
.ex-row:last-child{border-bottom:0}
.ex-t b{display:block;font-size:var(--t-label);font-weight:650}
.ex-t i{display:block;font-style:normal;font-size:var(--t-micro);color:var(--ink-3);margin-top:1px}
.ex-v{font-size:var(--t-label);font-weight:700;white-space:nowrap}

/* what you moved — every entry removable, because mistakes happen */
.mv-row{display:flex;align-items:center;gap:var(--sp-3);padding:10px 0;
  border-bottom:1px solid var(--line-soft)}
.mv-row:last-child{border-bottom:0}
.mv-t{flex:1;min-width:0}
.mv-t b{display:block;font-size:var(--t-label);font-weight:650}
.mv-t i{display:block;font-style:normal;font-size:var(--t-micro);color:var(--ink-3);margin-top:1px}
.mv-v{font-size:var(--t-label);font-weight:700;white-space:nowrap}
.mv-x{width:40px;height:40px;border-radius:var(--r-sm);display:grid;place-items:center;
  color:var(--ink-3);border:1px solid var(--line);flex-shrink:0}
.mv-x svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.mv-x:active{border-color:var(--bad);color:var(--bad)}

/* ---------- inside Payments: each thing has its own limit ---------- */
.subs{margin-top:var(--sp-3);padding-top:var(--sp-3);border-top:1px solid var(--line-soft)}
.sub{margin-bottom:var(--sp-3)}
.sub:last-child{margin-bottom:0}
.sub-top{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-2);
  font-size:var(--t-label);color:var(--ink-2)}
.sub-top b{font-weight:700;color:var(--ink)}
.sub-bar{height:5px;border-radius:99px;background:var(--line);overflow:hidden;margin-top:6px}
.sub-bar span{display:block;height:100%;border-radius:99px;background:var(--navy);transition:width .6s}
.sub.near .sub-bar span{background:var(--warn)}
.sub.over .sub-bar span{background:var(--bad)}
.sub i{display:block;font-style:normal;font-size:var(--t-micro);margin-top:4px;font-weight:650}
.sub.near i{color:var(--warn)}
.sub.over i{color:var(--bad)}

/* ---------- the period ---------- */
.m-period{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);
  margin:0 0 var(--sp-4);font-size:var(--t-label);color:var(--ink-3)}
.m-fresh{font-size:var(--t-label);font-weight:650;color:var(--orange);min-height:40px;padding:0 4px}

.sub-f label{font-weight:600}

/* categories with no limit, and money no category has claimed */
.sub.unset .sub-top span:last-child{color:var(--ink-3);font-style:italic}
.sub-unset{font-size:var(--t-label);color:var(--warn);background:var(--warn-bg);
  border-radius:var(--r-sm);padding:10px var(--sp-3);margin-top:var(--sp-2);line-height:1.5}
.sub-unset.over{color:var(--bad);background:var(--bad-bg)}
.sub-unset b{font-weight:800}
