/* ═══════════════════════════════════════════════════════
   Expenses App — Dark amber/gold palette
   Prefix: .exapp-
   ═══════════════════════════════════════════════════════ */

.exapp-shell{
  min-height:100vh;padding:0 0 32px;
  background:linear-gradient(170deg,#1a1408 0%,#24190e 40%,#100c04 100%);
  color:#f0e8d8;
}
.exapp-back{
  position:fixed;top:14px;left:14px;z-index:90;
  width:36px;height:36px;border-radius:50%;border:none;
  background:rgba(180,138,60,.18);backdrop-filter:blur(12px);
  color:#d9c08a;font-size:1.3rem;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.exapp-header{padding:52px 20px 12px;text-align:center}
.exapp-header h1{margin:0;font-size:1.4rem;font-weight:800;color:#f0e8d8}
.exapp-header p{margin:4px 0 0;font-size:.78rem;color:rgba(240,232,216,.45)}

/* segment */
.exapp-seg{
  display:flex;gap:4px;margin:0 16px 16px;padding:3px;
  background:rgba(180,138,60,.08);border-radius:12px;
}
.exapp-seg button{
  flex:1;padding:8px 4px;border:none;border-radius:10px;
  background:transparent;color:rgba(240,232,216,.5);
  font-size:.72rem;font-weight:600;cursor:pointer;transition:.2s;
}
.exapp-seg button.active{
  background:rgba(180,138,60,.22);color:#d9c08a;
}

.exapp-content{padding:0 16px}

/* empty */
.exapp-empty{text-align:center;padding:48px 24px}
.exapp-empty-icon{font-size:2.4rem;margin-bottom:10px;opacity:.5}
.exapp-empty-title{font-size:1rem;font-weight:700;margin-bottom:6px;color:#f0e8d8}
.exapp-empty-text{font-size:.78rem;color:rgba(240,232,216,.4)}

/* card */
.exapp-card{
  background:rgba(180,138,60,.06);border:1px solid rgba(180,138,60,.1);
  border-radius:14px;padding:14px;margin-bottom:12px;
}

/* donut chart (inline SVG) */
.exapp-donut-wrap{display:flex;justify-content:center;margin:12px 0}
.exapp-legend{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:8px}
.exapp-legend-item{
  display:inline-flex;align-items:center;gap:4px;
  font-size:.68rem;color:rgba(240,232,216,.55);
}
.exapp-legend-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* budget bars */
.exapp-budget{margin-bottom:10px}
.exapp-budget-row{display:flex;justify-content:space-between;font-size:.75rem;margin-bottom:3px}
.exapp-budget-cat{font-weight:600;color:#f0e8d8}
.exapp-budget-nums{color:rgba(240,232,216,.45)}
.exapp-bar{height:6px;background:rgba(240,232,216,.06);border-radius:3px;overflow:hidden}
.exapp-bar-fill{height:100%;border-radius:3px;transition:width .3s}
.exapp-bar-fill.warn{background:#d9a03a}
.exapp-bar-fill.danger{background:#cc6a42}
.exapp-bar-fill.ok{background:#5e7e62}

/* compare bars */
.exapp-compare{margin-bottom:10px}
.exapp-compare-label{font-size:.72rem;color:rgba(240,232,216,.55);margin-bottom:2px}
.exapp-compare-bars{display:flex;gap:3px;height:8px}
.exapp-compare-this,.exapp-compare-avg{height:100%;border-radius:3px}
.exapp-compare-this{background:#d9c08a}
.exapp-compare-avg{background:rgba(240,232,216,.15)}
.exapp-compare-nums{font-size:.65rem;color:rgba(240,232,216,.35);margin-top:1px}

/* category picker */
.exapp-cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.exapp-cat-chip{
  padding:6px 10px;border-radius:10px;border:1px solid rgba(180,138,60,.15);
  background:transparent;color:rgba(240,232,216,.6);font-size:.72rem;
  cursor:pointer;transition:.2s;
}
.exapp-cat-chip.active{
  background:rgba(180,138,60,.2);border-color:rgba(180,138,60,.35);color:#d9c08a;
}

/* amount input big */
.exapp-amount{
  width:100%;padding:14px;border:1px solid rgba(180,138,60,.15);
  border-radius:12px;background:rgba(180,138,60,.06);
  color:#f0e8d8;font-size:1.6rem;font-weight:700;text-align:center;
}
.exapp-amount::placeholder{color:rgba(240,232,216,.2)}

/* form fields */
.exapp-label{font-size:.72rem;color:rgba(240,232,216,.4);margin-bottom:4px}
.exapp-input{
  width:100%;padding:9px 12px;border:1px solid rgba(180,138,60,.12);
  border-radius:10px;background:rgba(180,138,60,.06);
  color:#f0e8d8;font-size:.82rem;
}
.exapp-input::placeholder{color:rgba(240,232,216,.2)}
.exapp-form-row{display:flex;gap:8px;margin-bottom:8px}
.exapp-submit{
  width:100%;padding:12px;border:none;border-radius:12px;
  background:linear-gradient(135deg,rgba(180,138,60,.25),rgba(217,192,138,.2));
  color:#d9c08a;font-weight:700;font-size:.82rem;cursor:pointer;
  margin-top:8px;
}

/* expense list items */
.exapp-item{
  display:flex;align-items:center;gap:10px;padding:10px 0;
  border-bottom:1px solid rgba(180,138,60,.06);
}
.exapp-item:last-child{border-bottom:none}
.exapp-item-icon{
  width:36px;height:36px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;font-size:1.1rem;
}
.exapp-item-info{flex:1;min-width:0}
.exapp-item-title{font-size:.82rem;font-weight:600;color:#f0e8d8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exapp-item-meta{font-size:.68rem;color:rgba(240,232,216,.35)}
.exapp-item-amount{font-size:.88rem;font-weight:700;color:#d9c08a;white-space:nowrap}
.exapp-recurring{font-size:.6rem;margin-left:3px;opacity:.7}
.exapp-item-actions{display:flex;gap:2px}
.exapp-item-btn{
  background:none;border:none;color:rgba(240,232,216,.35);
  font-size:.68rem;cursor:pointer;padding:4px;
}
.exapp-item-btn.danger{color:#cc6a42}

/* date header */
.exapp-date-header{
  display:flex;justify-content:space-between;align-items:center;
  padding:8px 0 4px;font-size:.75rem;font-weight:600;
  color:rgba(240,232,216,.5);
}
.exapp-date-total{color:#d9c08a}

/* chart container */
.exapp-chart{height:160px;margin:8px 0}
.exapp-chart canvas{max-height:160px}

/* receipt */
.exapp-receipt{padding:14px}
.exapp-receipt-title{font-size:.82rem;font-weight:700;color:#f0e8d8;margin-bottom:4px}
.exapp-receipt-hint{font-size:.72rem;color:rgba(240,232,216,.35);margin-bottom:10px}
.exapp-receipt-btns{display:flex;gap:8px}
.exapp-receipt-btn{
  flex:1;padding:10px;border:1px solid rgba(180,138,60,.15);
  border-radius:10px;background:transparent;color:rgba(240,232,216,.6);
  font-size:.75rem;cursor:pointer;
}

/* edit form inline */
.exapp-edit-row{
  display:flex;gap:6px;flex-wrap:wrap;padding:8px 0;
  border-top:1px solid rgba(180,138,60,.08);
}

/* btn */
.exapp-btn{
  padding:6px 14px;border:none;border-radius:8px;
  background:rgba(180,138,60,.15);color:#d9c08a;
  font-size:.72rem;font-weight:600;cursor:pointer;
}
.exapp-btn.danger{background:rgba(204,106,66,.15);color:#cc6a42}
.exapp-btn.ghost{background:transparent;color:rgba(240,232,216,.4)}

/* toast */
.exapp-toast{
  position:fixed;bottom:80px;left:50%;transform:translateX(-50%) translateY(20px);
  padding:10px 22px;border-radius:12px;font-size:.78rem;font-weight:600;
  background:rgba(180,138,60,.2);backdrop-filter:blur(14px);color:#d9c08a;
  opacity:0;transition:all .3s;z-index:200;pointer-events:none;
}
.exapp-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.exapp-toast.error{background:rgba(204,106,66,.2);color:#cc6a42}

/* Confirm dialog (H2 — replaces inline-styled overlay) */
.exapp-confirm-overlay{
  position:fixed;inset:0;z-index:9999;
  background:rgba(0,0,0,.6);
  display:flex;align-items:center;justify-content:center;
}
.exapp-confirm-box{
  background:var(--card-bg,#1e1e1e);
  border:1px solid var(--card-border,#333);
  border-radius:12px;padding:20px;max-width:300px;text-align:center;
}
.exapp-confirm-msg{font-size:1rem;margin-bottom:16px;color:var(--fg,inherit)}
.exapp-confirm-actions{display:flex;gap:8px;justify-content:center}
.exapp-confirm-actions .jb-btn{flex:1}

/* H2 helper classes — replace per-site inline styles */
.exapp-section-label{padding:12px 0 6px;display:flex;align-items:center;justify-content:space-between}
.exapp-section-label--simple{padding:12px 0 6px}
.exapp-link-action{background:none;border:none;color:var(--color-teal);font-size:.85rem;cursor:pointer}
.exapp-row-flex{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.04)}
.exapp-row-flex__main{flex:1;min-width:0}
.exapp-row-flex__title{font-size:.85rem;font-weight:500}
.exapp-row-flex__sub{font-size:.72rem;opacity:.5}
.exapp-row-flex__amt{text-align:right;font-size:.85rem}
.exapp-row-flex__amt strong{font-weight:600;display:block}
.exapp-row-flex__freq{font-size:.7rem;opacity:.5}
.exapp-row-flex__icon{font-size:1.1rem}
.exapp-recurring-total{font-size:.8rem;color:var(--hint)}
.exapp-card--empty{text-align:center;padding:12px;opacity:.6;font-size:.85rem}
.exapp-card--row{display:flex;align-items:center;gap:12px}
.exapp-card__main{flex:1;font-size:.85rem}
.exapp-card__hint{opacity:.7}
.exapp-card__sub{font-size:.75rem;opacity:.6}
.exapp-card__nav-arrow{color:var(--color-teal,#33A199);font-size:.85rem}
.exapp-nav-card{cursor:pointer}
.exapp-nav-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}
.exapp-form-row--split{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:8px}
.exapp-input--grow{flex:1;min-width:90px}
.exapp-input--narrow{width:100px}
.exapp-split-result{padding:8px;background:rgba(51,161,153,.12);border-radius:8px;text-align:center;font-size:.9rem;font-weight:600}
.exapp-budget-form{margin-bottom:10px}
.exapp-input--cat{flex:1;min-width:120px}
.exapp-custom-cat-form{margin:8px 0;padding:10px;border:1px solid var(--card-border,#333);border-radius:8px}
.exapp-custom-cat-form__label{margin-bottom:6px}
.exapp-custom-cat-form__row{display:flex;gap:6px;align-items:center}
.exapp-input--emoji{width:48px;text-align:center;font-size:1.2rem;padding:6px}
.exapp-btn--compact{padding:8px 14px;white-space:nowrap}
.exapp-amount-wrap{text-align:center;margin-bottom:12px}
.exapp-amount-hint{margin-top:4px}
.exapp-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.exapp-input--desc{margin-bottom:4px}
.exapp-history-tools{display:flex;justify-content:flex-end;gap:8px;margin-bottom:8px}
.exapp-btn--small{font-size:.78rem;padding:4px 12px}
.exapp-btn--small label, label.exapp-btn--small{cursor:pointer}
.exapp-import-result{margin-bottom:8px;padding:8px 12px;background:rgba(51,161,153,.12);border-radius:8px;font-size:.82rem}
.exapp-load-more-wrap{text-align:center;padding:12px 0}
.exapp-receipt-preview{margin-top:10px}
.exapp-receipt-loading{text-align:center;padding:8px;color:rgba(240,232,216,.4)}
.exapp-receipt-result{padding:12px}
.exapp-receipt-result__title{font-size:.82rem;font-weight:600;margin-bottom:6px}
.exapp-receipt-result__field{font-size:.72rem;color:rgba(240,232,216,.4)}
.exapp-receipt-result__hint{margin-top:8px;font-size:.72rem;color:rgba(240,232,216,.5)}
.exapp-receipt-result__actions{display:flex;gap:6px;margin-top:8px}
.exapp-receipt-result__actions .exapp-btn{flex:1}
.exapp-receipt-items{margin-top:4px;max-height:200px;overflow-y:auto}
.exapp-receipt-item-row{display:flex;align-items:center;gap:6px;padding:4px 0;font-size:.72rem;cursor:pointer}
.exapp-receipt-item-row__name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.exapp-receipt-item-row__price{color:var(--color-gold);white-space:nowrap}
.exapp-receipt-error{font-size:.72rem;color:#cc6a42}
.exapp-btn--block{margin-top:8px;width:100%}
.exapp-input--w-80{width:80px}
.exapp-input--w-120{width:120px}
.exapp-card--center{text-align:center}
.exapp-label--mb{margin-bottom:6px}