:root {
  /* Treasure Crown brand: gold + black on warm white */
  --gold:#c9a23f;          /* brand gold (surfaces/accents, never text-on-white) */
  --gold-soft:#e6c565;     /* lighter gold for text on dark */
  --gold-deep:#9c7a2e;     /* pressed / focus */
  --ink:#17130b;           /* primary text, warm near-black */
  --ink-2:#574f3e;         /* secondary text (warm-tinted, not gray) */
  --ink-3:#7a7160;         /* muted text, ≥4.5:1 on white */
  --bg:#faf8f3;            /* warm off-white app bg */
  --surface:#ffffff;
  --line:#ece2d0;          /* warm hairline */
  --hero:#17130b;          /* dark hero surface */
  --hero-2:#211a10;        /* hero depth */
  --pos:#1e7a4d;           /* profit */
  --neg:#c0392b;           /* loss — the single red in the system */
  --pos-dk:#7fe0ab;        /* profit on dark */
  --neg-dk:#f0a08f;        /* loss on dark */
  --shadow:0 1px 2px rgba(23,19,11,.05), 0 6px 16px rgba(23,19,11,.07);
  --shadow-hero:0 10px 30px rgba(23,19,11,.22);
}
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
body { margin:0; font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif; color:var(--ink); background:var(--bg); padding-bottom:calc(66px + env(safe-area-inset-bottom)); }

/* ---- Top bar: white, gold crown + two-tone wordmark, gold hairline ---- */
.topbar { position:sticky; top:0; display:flex; justify-content:space-between; align-items:center;
  background:var(--surface); padding:calc(11px + env(safe-area-inset-top)) 16px 11px; z-index:10; border-bottom:1px solid var(--line);
  box-shadow:inset 0 -2px 0 rgba(201,162,63,.35); }
@media (max-width:400px) { .brand { font-size:13.5px; gap:7px; } }
.brand { display:flex; align-items:center; gap:9px; font-weight:800; letter-spacing:.4px; font-size:15px; text-transform:uppercase; text-decoration:none; cursor:pointer; -webkit-tap-highlight-color:transparent; min-width:0; }
.brand:active { opacity:.7; }
.brand .crown { width:24px; height:24px; flex:none; display:block; }
/* The signed-in shop's name. Truncates so a long name never pushes the sync pill
   off-screen; the crown stays the gold brand mark. */
.brand .brand-name { color:var(--ink); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ---- Sync pill: dot + explicit label, color-coded ---- */
.pill { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600;
  padding:4px 10px; border-radius:999px; background:#f3ede1; color:var(--ink-2); border:1px solid var(--line); white-space:nowrap; }
.pill::before { content:""; width:7px; height:7px; border-radius:50%; background:currentColor; flex:none; }
.pill.ok { color:var(--pos); background:#e8f4ec; border-color:#cfe7d8; }
.pill.local { color:var(--ink-2); background:#f3ede1; border-color:var(--line); }
.pill.pending { color:#9a6a00; background:#fbf0d8; border-color:#f0e0b8; }
.pill.err { color:var(--neg); background:#fbe9e6; border-color:#f2ccc5; }
.pill.tap { cursor:pointer; } .pill.tap:hover { filter:brightness(.97); }

/* ---- Login screen ---- */
.login-screen { position:fixed; inset:0; z-index:100; background:var(--bg); display:flex; align-items:center; justify-content:center; padding:20px calc(20px + env(safe-area-inset-right)) 20px calc(20px + env(safe-area-inset-left)); overflow-y:auto; }
.login-card { width:100%; max-width:380px; background:var(--surface); border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); padding:22px; }
.login-brand { display:flex; align-items:center; gap:9px; font-weight:800; font-size:17px; letter-spacing:.3px; text-transform:uppercase; }
.login-sub { color:var(--ink-3); font-size:14px; margin:5px 0 12px; }
.login-card label { margin-top:12px; }
.login-err { margin-top:12px; padding:9px 11px; background:#fbe9e6; border:1px solid #f2ccc5; color:var(--neg); border-radius:9px; font-size:13px; font-weight:600; }
.login-note { margin-top:12px; padding:9px 11px; background:#eef7ee; border:1px solid #cfe6cf; color:#2f6b34; border-radius:9px; font-size:13px; font-weight:600; }
.login-link { display:block; width:100%; background:none; border:none; color:var(--gold-deep); font-weight:700; font-size:13px; margin-top:12px; cursor:pointer; text-decoration:underline; }
.acct-card { display:flex; align-items:center; justify-content:space-between; gap:10px; }

.screen { padding:16px; max-width:760px; margin:0 auto; }

/* ---- Bottom tab bar: icon + label, safe-area aware ---- */
.tabbar { position:fixed; bottom:0; left:0; right:0; display:flex; background:var(--surface); border-top:1px solid var(--line); z-index:10; padding-bottom:env(safe-area-inset-bottom); box-shadow:0 -2px 12px rgba(23,19,11,.05); }
.tabbar a, .tab-more { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:56px; padding:8px 2px 6px; font-size:11px; font-weight:700; color:var(--ink-3); text-decoration:none; background:none; border:none; border-top:2px solid transparent; cursor:pointer; -webkit-user-select:none; user-select:none; }
.tab-ico { width:23px; height:23px; }
.tabbar a .tab-ico { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.tab-more .tab-ico { fill:currentColor; stroke:none; }
.tabbar a.active, .tab-more.active { color:var(--gold-deep); border-top-color:var(--gold); }

/* ---- "More" bottom sheet ---- */
.more-sheet { position:fixed; inset:0; z-index:30; background:rgba(23,19,11,.4); display:flex; align-items:flex-end; -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
.more-sheet[hidden] { display:none; }
.more-panel { width:100%; background:var(--surface); border-radius:18px 18px 0 0; padding:6px 14px calc(12px + env(safe-area-inset-bottom)); box-shadow:0 -8px 30px rgba(23,19,11,.22); animation:sheetUp .22s cubic-bezier(.2,.7,.2,1) both; }
@keyframes sheetUp { from { transform:translateY(12px); opacity:.6; } to { transform:none; opacity:1; } }
@media (prefers-reduced-motion:reduce) { .more-panel { animation:none; } }
.more-grab { width:40px; height:4px; border-radius:2px; background:var(--line); margin:8px auto 6px; }
.more-panel a { display:flex; align-items:center; gap:10px; padding:15px 6px; font-size:16px; font-weight:700; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); }
.more-panel a:last-child { border-bottom:none; }

h1 { font-size:20px; margin:2px 0; letter-spacing:-.01em; }
label { display:block; font-size:13px; color:var(--ink-2); margin:10px 0 4px; font-weight:600; }
input, select, textarea, button { font:inherit; }
input, select, textarea { width:100%; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline:2px solid var(--gold); outline-offset:1px; border-color:var(--gold); }

/* ---- Buttons: gold primary ---- */
/* The hidden attribute must always win, even over components that set display
   (e.g. .btn is inline-block, which would otherwise defeat [hidden]). */
[hidden] { display:none !important; }
.btn { display:inline-block; width:100%; padding:14px; border:none; border-radius:12px; background:var(--gold); color:var(--ink); font-weight:800; margin-top:14px; cursor:pointer; letter-spacing:.2px; }
.btn:hover { background:#b8912f; } .btn:active { background:var(--gold-deep); }
.btn.secondary { background:var(--surface); color:var(--ink); border:1px solid var(--gold); }
.btn.ghost { background:transparent; color:var(--ink-2); border:1px solid var(--line); font-weight:600; }
.btn:focus-visible, .seg-btn:focus-visible, .tabbar a:focus-visible { outline:2px solid var(--gold-deep); outline-offset:2px; }

.row { display:flex; gap:10px; } .row > * { flex:1; }
.card { background:var(--surface); border:1px solid var(--line); border-radius:15px; padding:15px; margin:11px 0; box-shadow:var(--shadow); }
.muted { color:var(--ink-3); font-size:13px; }
.right { text-align:right; } .big { font-size:26px; font-weight:800; letter-spacing:-.02em; }
.pos { color:var(--pos); } .neg { color:var(--neg); }
.list-item { display:flex; justify-content:space-between; gap:10px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); margin:8px 0; }
.chip { display:inline-block; font-size:11px; font-weight:700; padding:2px 8px; border-radius:999px; background:#f6eeda; color:var(--gold-deep); text-transform:uppercase; letter-spacing:.4px; }
.toast { position:fixed; bottom:80px; left:50%; transform:translateX(-50%); background:var(--ink); color:#fff; padding:11px 16px; border-radius:10px; font-size:14px; z-index:20; box-shadow:var(--shadow-hero); }
.split { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.total-bar { position:sticky; bottom:64px; background:var(--surface); border-top:1px solid var(--line); padding:12px; display:flex; justify-content:space-between; align-items:center; gap:10px; }

/* ===================== Dashboard ===================== */
.dash-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:4px 0 14px; }

/* Segmented period control — active = gold fill */
.seg { display:inline-flex; background:#f1e9d9; border:1px solid var(--line); border-radius:11px; padding:3px; gap:2px; }
.seg-btn { border:none; background:transparent; color:var(--ink-3); font-weight:700; font-size:13px; padding:7px 14px; border-radius:8px; cursor:pointer; text-transform:capitalize; }
.seg-btn.on { background:var(--gold); color:var(--ink); box-shadow:0 1px 2px rgba(23,19,11,.15); }
/* Full-width mode switch at the top of a screen (Buy / Trade). Buttons are links. */
.seg.seg-wide { display:flex; width:100%; margin:2px 0 13px; padding:4px; border-radius:12px; }
.seg.seg-wide .seg-btn { flex:1; text-align:center; font-size:15px; padding:10px 8px; text-decoration:none; }

/* Hero: gold money on a warm, soft dark — the "treasure" */
.hero { position:relative; overflow:hidden; color:#f6efe0;
  background:radial-gradient(120% 120% at 85% -10%, rgba(230,197,101,.16), transparent 55%), linear-gradient(150deg,#3a2f18,#1d1610);
  border-radius:20px; padding:20px 20px 18px; box-shadow:var(--shadow-hero); border:1px solid #493a22; }
.hero-top { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.hero-label { font-size:12.5px; font-weight:700; letter-spacing:.3px; color:var(--gold-soft); text-transform:uppercase; }
.hero .crown-wm { width:34px; height:34px; opacity:.9; flex:none; margin:-2px -2px 0 0; }
.hero-amount { font-size:44px; line-height:1.05; font-weight:800; letter-spacing:-.03em; margin:8px 0 2px; color:var(--gold-soft);
  animation:rise .45s cubic-bezier(.2,.7,.2,1) both; }
.hero-amount.is-neg { color:var(--neg-dk); }
/* Inventory + Cash & sales = business value */
.hero-breakdown { display:flex; align-items:stretch; gap:8px; margin:4px 0 10px; }
.hb-part { display:flex; flex-direction:column; gap:1px; flex:1; min-width:0; padding:8px 11px;
  background:rgba(230,197,101,.07); border:1px solid #493a22; border-radius:12px; }
.hb-k { font-size:11px; font-weight:700; letter-spacing:.2px; color:var(--gold-soft); text-transform:uppercase; opacity:.85; }
.hb-v { font-size:16px; font-weight:800; letter-spacing:-.01em; color:#f0e6cf; white-space:nowrap; }
.hb-v.neg { color:var(--neg-dk); }
.hb-plus { align-self:center; font-size:16px; font-weight:800; color:#8a7c5f; flex:none; }
.hero-sub { display:flex; align-items:center; gap:8px; font-size:13.5px; color:#cdbfa6; }
.hero-sub .dot { color:#7d715a; }
@keyframes rise { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce) { .hero-amount { animation:none; } }

/* Business value block */
.biz-value { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:14px; margin:12px 0; box-shadow:var(--shadow); }
.biz-row { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.biz-k { font-weight:800; font-size:15px; }
.biz-note { color:var(--ink-3); font-size:12.5px; }
.biz-v { font-size:30px; font-weight:800; letter-spacing:-.02em; margin:4px 0; font-variant-numeric:tabular-nums; }
.biz-foot { display:flex; justify-content:space-between; gap:10px; font-size:13px; color:var(--ink-3); font-variant-numeric:tabular-nums; }
.biz-foot .pos { color:var(--pos); font-weight:800; } .biz-foot .neg { color:var(--neg); font-weight:800; }

/* Small secondary inventory stats */
.stat-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:12px 0; }
.stat { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:12px 14px; box-shadow:var(--shadow);
  display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.stat-k { font-size:12.5px; color:var(--ink-3); font-weight:600; }
.stat-v { font-size:17px; font-weight:800; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.stat-v.pos { color:var(--pos); } .stat-v.neg { color:var(--neg); }
@media (min-width:720px) { .stat-row { grid-template-columns:repeat(4,1fr); } }

/* Dashboard performance panel: time-range selector + windowed flow totals */
.perf { padding-bottom:16px; }
.perf .perf-title { font-size:12px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:var(--ink-3); margin-bottom:10px; }
.seg.perf-seg { display:flex; width:100%; padding:3px; }
.seg.perf-seg .seg-btn { flex:1; padding:8px 4px; font-size:12px; text-align:center; }
.perf-custom { display:flex; gap:10px; margin-top:12px; }
.perf-custom[hidden] { display:none; }
.perf-custom > * { flex:1; }
.perf-custom label { margin-top:0; }
.perf-empty { text-align:center; color:var(--ink-3); font-size:13px; padding:4px 0 2px; }
/* Headline metric, centered */
.perf-hero { display:flex; flex-direction:column; align-items:center; gap:3px; padding:20px 0 16px; }
.perf-hero-k { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--ink-3); }
.perf-hero-v { font-size:34px; font-weight:800; letter-spacing:-.025em; font-variant-numeric:tabular-nums; line-height:1; }
.perf-hero-v.pos { color:var(--pos); } .perf-hero-v.neg { color:var(--neg); }
/* One unified block of metrics, split by hairlines (no nested boxes) */
.perf-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:13px; overflow:hidden; }
.perf-grid .pm { background:var(--surface); padding:12px 14px; display:flex; flex-direction:column; gap:4px; }
.perf-grid .pm:last-child:nth-child(odd) { grid-column:1 / -1; }
.pm-k { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--ink-3); }
.pm-v { font-size:18px; font-weight:800; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.pm-v.pos { color:var(--pos); } .pm-v.neg { color:var(--neg); }

/* Shows: filter bar + expandable per-day drill-down */
.shows-filter { display:flex; flex-direction:column; gap:11px; }
.shows-filter input { margin:0; }
.day-block { border-bottom:1px solid var(--line); }
.day-block:last-child { border-bottom:none; }
.day-head { width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px; background:none; border:none; padding:13px 0; margin:0; cursor:pointer; text-align:left; font:inherit; color:var(--ink); }
.day-title { font-weight:700; }
.day-sum { font-size:13px; color:var(--ink-2); display:flex; align-items:center; gap:7px; white-space:nowrap; }
.day-caret { color:var(--ink-3); transition:transform .15s ease; display:inline-block; font-size:12px; }
.day-head.open .day-caret { transform:rotate(90deg); }
.day-detail { padding:0 0 12px; }
.day-detail[hidden] { display:none; }
.day-sec { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.4px; color:var(--ink-3); margin:8px 0 3px; }
.day-line { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:5px 0; font-size:14px; }
.day-line > span:last-child { font-variant-numeric:tabular-nums; white-space:nowrap; }
.day-line > span:first-child { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.sd-title-row { display:flex; align-items:flex-start; gap:10px; }
.sd-title-row h1 { min-width:0; word-break:break-word; }
.sd-edit { width:auto; margin:2px 0 0; padding:6px 11px; flex:none; font-size:15px; line-height:1; }
.sd-rename-in { font-size:20px; font-weight:800; padding:9px 11px; }
.sd-rename-actions { display:flex; gap:8px; margin-top:9px; }
#cash-reset { cursor:pointer; color:var(--gold-deep); text-decoration:underline; font-weight:700; }
/* Source-type chips + controls */
.src-chip { font-size:11px; vertical-align:middle; }
.src-chip.src-show { background:#f3e7c8; color:#7a5c12; }
.src-chip.src-online { background:#dbe8fb; color:#1f4e8a; }
.src-chip.src-local { background:#dff1e0; color:#1f6b39; }
.src-chip.src-other { background:#ece7de; color:#5a5347; }
.src-type-row { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:3px; }
.src-type-pick { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-3); font-weight:600; margin:0; white-space:nowrap; }
.src-type-pick select { width:auto; padding:6px 8px; font-size:13px; margin:0; }
.shows-filter #type-filter { margin:0; }
/* Expenses: tappable category rows with spend bars */
.exp-cat { padding:10px 0; border-bottom:1px solid var(--line); cursor:pointer; -webkit-tap-highlight-color:transparent; }
.exp-cat:last-child { border-bottom:none; }
.exp-cat-row { display:flex; align-items:baseline; justify-content:space-between; gap:10px; font-size:14px; margin-bottom:6px; }
.exp-cat-amt { font-variant-numeric:tabular-nums; color:var(--ink-2); white-space:nowrap; }
.exp-bar { height:7px; background:#f1e9d9; border-radius:4px; overflow:hidden; }
.exp-bar-fill { height:100%; background:var(--gold); border-radius:4px; }
.exp-cat.on .exp-cat-row span:first-child { color:var(--gold-deep); font-weight:800; }
.exp-cat.on .exp-bar-fill { background:var(--gold-deep); }
/* Centered confirmation pop-up (e.g. the full reset) */
.modal-overlay { position:fixed; inset:0; z-index:200; background:rgba(23,19,11,.55); display:flex; align-items:center; justify-content:center; padding:20px calc(20px + env(safe-area-inset-right)) 20px calc(20px + env(safe-area-inset-left)); }
.modal-card { width:100%; max-width:360px; background:var(--surface); border-radius:16px; box-shadow:var(--shadow); padding:22px; }
.modal-card h2 { font-size:19px; margin:0 0 8px; }
.modal-card p { margin:0 0 12px; }
.modal-card .btn { margin-top:10px; }

/* Business-value gain on the dark hero */
.hero-gain.pos { color:var(--pos-dk); font-weight:700; }
.hero-gain.neg { color:var(--neg-dk); font-weight:700; }

/* ===== Home hub: quick actions + active show ===== */
.hub-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:14px 0; }
.hub-btn { display:flex; flex-direction:column; align-items:center; gap:6px; padding:15px 8px; background:var(--surface);
  border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); color:var(--ink); text-decoration:none;
  font-weight:800; font-size:14px; transition:transform .08s ease, border-color .12s ease, box-shadow .12s ease; }
.hub-btn:hover { border-color:var(--gold); transform:translateY(-2px); box-shadow:0 6px 18px rgba(23,19,11,.10); }
.hub-btn:active { transform:translateY(0); }
.hub-ic { display:flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%;
  background:#faf3e0; color:var(--gold-deep); font-size:19px; font-weight:800; }

.show-hub { display:block; margin:14px 0; padding:16px 18px; border-radius:18px; text-decoration:none; color:#f6efe0;
  background:radial-gradient(120% 120% at 90% -20%, rgba(230,197,101,.14), transparent 55%), linear-gradient(140deg,#3f331a,#241c0f);
  border:1px solid #4a3c22; box-shadow:var(--shadow); }
.show-hub-top { display:flex; justify-content:space-between; align-items:center; }
.show-hub-k { font-size:11.5px; font-weight:800; text-transform:uppercase; letter-spacing:.6px; color:var(--gold-soft); }
.show-hub-go { font-size:13px; font-weight:800; color:var(--gold-soft); }
.show-hub-name { font-size:19px; font-weight:800; margin:7px 0 5px; letter-spacing:-.01em; line-height:1.15; }
.show-hub-stats { font-size:14px; color:#d9ccb1; font-variant-numeric:tabular-nums; }
.show-hub-stats b { color:#fff; }
.show-hub .pos { color:var(--pos-dk); font-weight:800; } .show-hub .neg { color:var(--neg-dk); font-weight:800; }

/* Cash-on-hand card (links to the Cash screen) */
.cash-card { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:12px 0; padding:14px 16px;
  background:var(--surface); border:1px solid var(--gold); border-radius:15px; box-shadow:var(--shadow); text-decoration:none; color:var(--ink); }
.cash-card:hover { background:#fdfaf1; }
.cash-card-k { font-weight:800; font-size:15px; }
.cash-card-r { display:flex; align-items:baseline; gap:12px; }
.cash-card-v { font-size:20px; font-weight:800; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.cash-card-v.neg { color:var(--neg); }
.cash-card-go { font-size:13px; font-weight:700; color:var(--gold-deep); white-space:nowrap; }

/* Nudge card shown before the first sale */
.hint-card { display:flex; flex-direction:column; gap:2px; text-decoration:none; margin:12px 0;
  background:var(--surface); border:1px dashed var(--gold); border-radius:14px; padding:14px; box-shadow:var(--shadow); }
.hint-k { font-weight:800; font-size:15px; color:var(--ink); }
.hint-v { color:var(--gold-deep); font-size:13.5px; font-weight:600; }
.hint-card:hover { background:#fbf6ea; }

/* Dice-challenge toggle on the Sell screen */
.dice-toggle { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:12px 0 2px; padding:12px 13px;
  background:#fbf6ea; border:1px solid var(--gold); border-radius:11px; font-weight:800; cursor:pointer; }
.dice-toggle input { width:auto; margin:0; accent-color:var(--gold-deep); transform:scale(1.2); }
.dice-toggle .muted { font-weight:600; }

/* Recent sales + undo on the Sell screen */
.sale-row { display:flex; align-items:center; gap:10px; padding:11px 0; border-bottom:1px solid var(--line); }
.sale-row:last-child { border-bottom:none; }
.sale-main { flex:1; min-width:0; }
.sale-name { font-weight:700; }
.undo-btn { width:auto; margin:0; padding:8px 15px; flex:none; }
.undo-btn.danger { color:#fff; background:var(--neg); border-color:var(--neg); font-weight:800; }
.sale-row.editing { display:block; padding:12px 0; }
.imp-pick { cursor:pointer; }
.imp-cb { width:20px; height:20px; flex:none; accent-color:var(--gold-deep); margin:0; }
.imp-pick:has(.imp-cb:not(:checked)) { opacity:.45; }
.recent-h { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.recent-today { color:var(--gold-deep); font-weight:800; font-size:12px; text-transform:none; letter-spacing:0; }
.recent-all { display:block; text-align:center; padding:12px 0 4px; color:var(--gold-deep); font-weight:700; font-size:13px; text-decoration:none; }
.recent-all:hover { text-decoration:underline; }
.sale-del { width:100%; margin-top:8px; color:var(--neg); border-color:#f2ccc5; }
.sale-del.danger { background:var(--neg); color:#fff; border-color:var(--neg); font-weight:800; }
/* Prominent "selected to sell" card that pops to the top on pick */
.sel-card { display:flex; align-items:center; gap:12px; padding:14px; margin:10px 0 4px; border:2px solid var(--gold); border-radius:12px; background:#fbf6ea; box-shadow:var(--shadow); }
.sel-check { flex:none; width:30px; height:30px; border-radius:50%; background:var(--gold); color:var(--ink); display:flex; align-items:center; justify-content:center; font-weight:800; }
.sel-info { flex:1; min-width:0; }
.sel-name { font-weight:800; font-size:17px; letter-spacing:-.01em; }
.sel-x { flex:none; width:34px; height:34px; border-radius:50%; border:1px solid var(--line); background:var(--surface); color:var(--ink-2); font-size:15px; font-weight:800; cursor:pointer; }
.sel-x:hover { border-color:var(--neg); color:var(--neg); }

/* One-off "not in inventory" sell option */
.custom-pick { border:1px dashed var(--gold); background:#fbf6ea; cursor:pointer; }
.custom-pick:hover { background:#f7efdb; }
/* A search result already added to the lot bundle */
.list-item.lot-in { border-color:var(--gold); background:#fbf6ea; }
.list-item.lot-in .muted:last-child { color:var(--gold-deep); font-weight:800; }

/* Data panels + aligned money tables */
.panel { background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:6px 15px 13px; margin:12px 0; box-shadow:var(--shadow); }
.panel-h { font-size:13px; font-weight:800; letter-spacing:.3px; text-transform:uppercase; color:var(--ink-2); padding:13px 0 9px; border-bottom:1px solid var(--line); }
.tbl { display:block; overflow-x:auto; }
.thd, .trow { display:grid; align-items:center; gap:18px; padding:11px 0; }
.thd { font-size:11px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--ink-3); border-bottom:1px solid var(--line); }
.trow { border-bottom:1px solid var(--line); }
.trow:last-child { border-bottom:none; }
.trow.lead .tname { color:var(--gold-deep); }
.tbl.by-period .thd, .tbl.by-period .trow { grid-template-columns:1fr auto auto; }
.tbl.by-cat .thd, .tbl.by-cat .trow { grid-template-columns:minmax(6.5em,1.4fr) auto auto; }
.tbl.by-top .trow { grid-template-columns:1fr auto; }
.tbl.by-top .chip { vertical-align:middle; }
.tname { font-weight:700; min-width:0; }
.tsub { display:block; font-size:12px; font-weight:600; color:var(--ink-3); margin-top:2px; white-space:nowrap; }
.num { text-align:right; font-variant-numeric:tabular-nums; font-weight:700; }
.thd .num { font-weight:700; }
.num.sub { color:var(--ink-3); font-weight:600; }

/* Empty / first-run state */
.empty { text-align:center; padding:36px 20px 28px; }
.empty .crown-wm { width:56px; height:56px; margin:0 auto 14px; display:block; }
.empty h2 { font-size:20px; margin:0 0 6px; letter-spacing:-.01em; }
.empty p { color:var(--ink-2); margin:0 auto 18px; max-width:34ch; }
.empty-actions { display:flex; gap:10px; max-width:320px; margin:0 auto; }
.empty-actions .btn { margin-top:0; }

/* ===================== Shows ===================== */
.show-card { cursor:pointer; }
.show-card:hover { border-color:var(--gold); }
/* Grand-total summary at the top of the shows list */
.show-total { border:1px solid var(--gold); background:linear-gradient(180deg,#fdfaf1,#fffdf8); }
.show-total .show-name { color:var(--gold-deep); }
.show-head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.show-name { font-weight:800; font-size:16px; }
.show-date { color:var(--ink-3); font-size:13px; font-weight:600; white-space:nowrap; }
/* Two headline metrics per show card: value added + actual sale profit */
.show-metrics { display:flex; gap:22px; margin-top:8px; }
.show-metric { display:flex; flex-direction:column; }
.show-metric-v { font-size:21px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.show-metric-k { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--ink-3); }
.show-metric.pos .show-metric-v { color:var(--pos); } .show-metric.neg .show-metric-v { color:var(--neg); }
/* Per-show "total made" (net cash) headline */
.show-total-made { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-top:11px; padding-top:11px; border-top:1px solid var(--line); }
.stm-k { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.4px; color:var(--ink-2); }
.stm-v { font-size:19px; font-weight:800; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.stm-v.pos { color:var(--pos); } .stm-v.neg { color:var(--neg); }
/* Inline "$ [input]" used in the cash drawer reconcile */
.cur-in { display:inline-flex; align-items:baseline; gap:3px; font-weight:800; }
.cur-in input { width:84px; text-align:right; padding:7px 8px; font-weight:800; }
.show-stats { display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:8px; color:var(--ink-2); font-size:13.5px; }
.show-stats .ss b { color:var(--ink); font-weight:800; font-variant-numeric:tabular-nums; }
.show-stats .net-ss { margin-left:auto; color:var(--ink-3); }
.back-btn { width:auto !important; margin:0 0 4px !important; padding:8px 12px !important; }
.show-detail-h { margin-bottom:6px; }
.dl { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--line); font-size:14px; color:var(--ink-2); }
.dl:last-child { border-bottom:none; }
.dl span:last-child { font-variant-numeric:tabular-nums; color:var(--ink); }
.dl.dl-h { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.4px; color:var(--ink-3); }
.dl.dl-total { font-weight:800; color:var(--ink); border-top:1.5px solid var(--line); border-bottom:none; margin-top:2px; }
.dl.dl-total span:last-child { font-size:15px; }
.dl span:last-child.pos { color:var(--pos); } .dl span:last-child.neg { color:var(--neg); }
.dl b { font-weight:800; }

/* ===================== Inventory ===================== */
.inv-summary .inv-sum-line { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 2px 2px; margin-top:8px; border-top:1px solid var(--line); font-weight:700; font-size:14px; }
.inv-sum-profit { font-weight:800; font-variant-numeric:tabular-nums; white-space:nowrap; }
.inv-cats { display:flex; flex-wrap:wrap; gap:6px 14px; padding:10px 2px 0; color:var(--ink-3); font-size:12.5px; }
.inv-cats b { color:var(--ink); font-weight:800; font-variant-numeric:tabular-nums; }
.inv-alerts { margin-top:10px; padding:9px 11px; background:#fbf0d8; border:1px solid #f0e0b8; border-radius:9px; color:#9a6a00; font-size:13px; font-weight:700; }
.inv-controls { display:flex; gap:10px; align-items:center; margin:10px 0; flex-wrap:wrap; }
.chips { display:flex; gap:6px; flex-wrap:wrap; flex:1; }
.fchip { border:1px solid var(--line); background:var(--surface); color:var(--ink-2); font-weight:700; font-size:12.5px; padding:6px 12px; border-radius:999px; cursor:pointer; }
.fchip.on { background:var(--gold); color:var(--ink); border-color:var(--gold); }
#sort { width:auto; padding:9px 10px; flex:none; }
.inv-row { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); margin:8px 0; box-shadow:var(--shadow); }
.inv-row.editing { display:block; }
.inv-main { flex:1; min-width:0; }
.inv-main.tap { cursor:pointer; }
.inv-main.tap:hover .inv-name { color:var(--gold-deep); }
.tap-hint { color:var(--gold-deep); font-weight:600; white-space:nowrap; }
.inv-name { font-weight:700; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.inv-attr { color:var(--ink-3); font-weight:600; font-size:13px; }
.inv-money { text-align:right; flex:none; }
.inv-profit { font-weight:800; font-variant-numeric:tabular-nums; font-size:15px; }
.flag { display:inline-block; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.4px; padding:1px 6px; border-radius:6px; margin-left:6px; vertical-align:middle; }
.flag.warn { background:#fbf0d8; color:#9a6a00; }
.flag.neg { background:#fbe9e6; color:var(--neg); }

/* ===================== Buy / Trade offer builder ===================== */
.row-actions { display:inline-flex; gap:6px; flex:none; }
.row-btn { width:auto !important; margin:0 !important; padding:9px 11px !important; font-size:15px; }
.list-item.editing { display:block; }
.edit-grid { display:flex; flex-direction:column; gap:8px; }
.edit-grid .row { gap:8px; }
.edit-name { font-weight:700; }
.edit-done { margin-top:2px !important; }
.offer { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:2px 14px 10px; margin:12px 0; box-shadow:var(--shadow); }
.offer-line { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); font-size:14px; color:var(--ink-2); }
.offer-mkt { font-weight:800; font-variant-numeric:tabular-nums; color:var(--ink); font-size:16px; }
.offer-line.sug { padding-top:8px; border-bottom:none; }
.offer-sug { font-weight:800; font-variant-numeric:tabular-nums; color:var(--gold-deep); font-size:16px; }
.pct-ctl { display:inline-flex; align-items:center; gap:6px; }
.pct-step { width:34px; height:34px; border:1px solid var(--line); background:#f6eeda; color:var(--ink); font-size:18px; font-weight:800; line-height:1; border-radius:9px; cursor:pointer; }
.pct-step:active { background:var(--gold); }
.pct-in { width:46px; text-align:right; padding:5px 2px; border:none; border-bottom:2px solid var(--gold); border-radius:0; font-weight:800; font-size:17px; background:transparent; color:var(--ink); }
.pct-sign { font-weight:800; margin-left:1px; }
.offer-final { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 0 6px; }
.offer-final-k { font-weight:800; font-size:15px; }
.muted2 { color:var(--gold-deep); font-weight:700; font-size:12px; cursor:pointer; text-decoration:underline; }
.offer-final-v { display:inline-flex; align-items:baseline; gap:1px; }
.cur { font-size:22px; font-weight:800; color:var(--gold-deep); }
.final-in { width:132px; text-align:right; font-size:30px; font-weight:800; letter-spacing:-.02em; color:var(--ink); border:none; border-bottom:2px solid var(--gold); border-radius:0; padding:2px 2px 4px; background:transparent; font-variant-numeric:tabular-nums; }
.final-in:focus-visible, .pct-in:focus-visible { outline:none; border-bottom-color:var(--gold-deep); }

/* Trade builder */
.side-h { display:flex; align-items:center; gap:8px; font-weight:800; font-size:16px; margin-bottom:6px; }
.side-h .muted { font-weight:600; }
.side-sum { margin-left:auto; font-weight:800; font-variant-numeric:tabular-nums; color:var(--gold-deep); font-size:16px; }
.search-res:not(:empty) { margin-top:8px; }
.trade-row { display:grid; grid-template-columns:1fr auto auto auto; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--line); }
.tr-name { font-weight:700; min-width:0; }
.tr-qty { display:flex; align-items:center; gap:2px; }
.tr-qty input { width:42px; padding:8px 4px; text-align:center; }
.tr-qty-max { color:var(--ink-3); font-size:12px; white-space:nowrap; }
.tr-val { display:inline-flex; align-items:baseline; gap:1px; }
.cur-sm { color:var(--gold-deep); font-weight:800; }
.val-in { width:88px; text-align:right; font-size:18px; font-weight:800; border:none; border-bottom:2px solid var(--gold); border-radius:0; padding:2px; background:transparent; color:var(--ink); font-variant-numeric:tabular-nums; }
.val-in:focus-visible { outline:none; border-bottom-color:var(--gold-deep); }
.tr-del { padding:8px 10px !important; }
.bal-net { text-align:center; font-weight:800; font-size:16px; padding:12px 0 6px; }
.bal-net.even { color:var(--ink); } .bal-net.pos { color:var(--pos); } .bal-net.neg { color:var(--neg); }
.present-sub { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.5px; color:var(--gold-soft); margin:14px 0 2px; }

/* Customer-facing present overlay — the "turn the phone around" view */
.present { position:fixed; inset:0; z-index:50; background:rgba(23,19,11,.55); display:flex; align-items:center; justify-content:center; padding:16px; -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.present-card { width:100%; max-width:460px; max-height:92vh; overflow-y:auto; background:linear-gradient(165deg,var(--hero-2),var(--hero)); color:#f4ecdd; border:1px solid #33291a; border-radius:20px; box-shadow:var(--shadow-hero); padding:22px; }
.present-head { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.6px; color:var(--gold-soft); }
.present-head .crown-wm { width:22px; height:22px; }
.present-title { font-size:15px; color:#cdbfa6; margin:14px 0 6px; }
.present-list { border-top:1px solid #33291a; }
.present-row { display:flex; justify-content:space-between; gap:12px; padding:12px 2px; border-bottom:1px solid #2b2214; font-size:17px; }
.present-name { font-weight:600; }
.present-q { color:var(--gold-soft); font-weight:700; font-size:14px; }
.present-val { font-weight:800; font-variant-numeric:tabular-nums; }
.present-mkt { color:#b7a888; font-weight:600; font-size:.82em; }
.present-sum { padding:12px 2px 2px; }
.present-line { display:flex; justify-content:space-between; gap:12px; padding:5px 0; color:#cdbfa6; font-size:15px; }
.present-line span:last-child { font-weight:700; color:#f4ecdd; font-variant-numeric:tabular-nums; }
.present-offer-k { margin-top:14px; font-size:13px; text-transform:uppercase; letter-spacing:.5px; color:var(--gold-soft); font-weight:700; }
.present-offer { font-size:56px; line-height:1.04; font-weight:800; letter-spacing:-.03em; color:var(--gold-soft); margin:2px 0 18px; font-variant-numeric:tabular-nums; }
.present-close { background:var(--gold); color:var(--ink); }
/* Always-reachable close: sticks to the top of the card as its list scrolls */
.present-x { position:sticky; top:-6px; z-index:3; display:flex; align-items:center; justify-content:center;
  margin:-8px -8px 4px auto; width:38px; height:38px; border:none; border-radius:50%; cursor:pointer;
  background:rgba(244,236,221,.14); color:#f4ecdd; font-size:16px; font-weight:800; }
.present-x:hover { background:rgba(244,236,221,.26); }