/* LB Access — mobile-first capture app.
   Tokens follow the console design system (restraint: neutral layered dark, one accent). */
:root {
  --bg:#0a0a0b; --card:#16161a; --card2:#111114; --elev:#20202a;
  --bd:#2a2a31; --bdh:#3a3a45;
  --tx:#ededf0; --sub:#c3c3cc; --mut:#9a9aa6; --mut2:#63636d;
  --accent:#f4c44f; --green:#5ccf86; --red:#ec6b75; --blue:#6fa5f5;
  --wash:rgba(244,196,79,.09);
  --r:12px;
  --pad:14px;
  --tap:46px;
}
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html { font-size:16px; }
body {
  background:var(--bg); color:var(--tx);
  font:15px/1.45 -apple-system, "SF Pro Text", Inter, system-ui, sans-serif;
  min-height:100dvh; overscroll-behavior-y:none;
}
button { font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
input, select { font:inherit; color:var(--tx); }
svg { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

/* Top bar */
#topbar {
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between;
  padding:calc(10px + env(safe-area-inset-top)) var(--pad) 10px;
  background:rgba(10,10,11,.92); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--bd);
}
.brand { font-weight:700; font-size:15.5px; letter-spacing:.01em; display:flex; align-items:center; gap:8px; }
.brand .mark {
  display:grid; place-items:center; width:26px; height:26px; border-radius:7px;
  background:var(--wash); border:1px solid var(--bd); color:var(--accent);
  font-size:11.5px; font-weight:800;
}
.chip {
  font-size:12px; color:var(--mut); border:1px solid var(--bd); border-radius:99px;
  padding:4px 10px; background:var(--card2);
}
.chip::before { content:""; display:inline-block; width:7px; height:7px; border-radius:99px;
  background:var(--accent); margin-right:6px; vertical-align:1px; }

/* Main scroll area */
#view { padding:var(--pad) var(--pad) calc(86px + env(safe-area-inset-bottom)); max-width:560px; margin:0 auto; }
h1 { font-size:19px; font-weight:700; margin:4px 0 14px; }
h2 { font-size:12px; font-weight:600; color:var(--mut); text-transform:uppercase; letter-spacing:.07em; margin:20px 0 8px; }

/* Cards & rows */
.card { background:var(--card); border:1px solid var(--bd); border-radius:var(--r); overflow:hidden; }
.row {
  display:flex; align-items:center; gap:10px; width:100%; text-align:left;
  padding:12px var(--pad); min-height:var(--tap); border-bottom:1px solid var(--bd);
}
.row:last-child { border-bottom:none; }
.row .grow { flex:1; min-width:0; }
.row .t { font-weight:600; font-size:14.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.row .s { font-size:12.5px; color:var(--mut); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.row:active { background:var(--card2); }

/* Stats */
.stats { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.stat { background:var(--card); border:1px solid var(--bd); border-radius:var(--r); padding:12px 14px; }
.stat b { display:block; font-size:19px; font-variant-numeric:tabular-nums; }
.stat span { font-size:11.5px; color:var(--mut); }
.stat.warn b { color:var(--accent); }
.stat.good b { color:var(--green); }

/* Pills / badges */
.pill { font-size:11px; font-weight:600; border-radius:6px; padding:2px 7px; white-space:nowrap; }
.p-sold   { color:var(--green); background:rgba(92,207,134,.12); }
.p-unsold { color:var(--accent); background:var(--wash); }
.p-pend   { color:var(--blue); background:rgba(111,165,245,.12); }
.p-refund { color:var(--red); background:rgba(236,107,117,.12); }
.p-mut    { color:var(--mut); background:var(--card2); border:1px solid var(--bd); }
.p-days   { color:var(--red); background:rgba(236,107,117,.12); }

/* Big actions (home) */
.bigactions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:16px; }
.bigbtn {
  display:flex; flex-direction:column; align-items:flex-start; gap:6px;
  border-radius:var(--r); padding:14px; min-height:76px;
  background:var(--wash); border:1px solid var(--bd); color:var(--tx);
}
.bigbtn b { font-size:15.5px; }
.bigbtn span { font-size:12px; color:var(--mut); }
.bigbtn svg { width:20px; height:20px; color:var(--accent); }
.bigbtn:active { background:rgba(244,196,79,.16); }

/* Forms */
.field { margin-bottom:14px; }
.field label { display:block; font-size:12px; color:var(--mut); margin-bottom:6px; }
.input, input[type=text], input[type=number], input[type=date], input[type=search], input[type=password], select {
  width:100%; min-height:var(--tap); padding:10px 12px;
  background:var(--card2); border:1px solid var(--bd); border-radius:10px;
  font-size:16px; /* prevents iOS zoom */
  appearance:none; outline:none;
}
input:focus, select:focus { border-color:var(--bdh); }
.chips { display:flex; flex-wrap:wrap; gap:8px; }
.chips button {
  min-height:38px; padding:7px 13px; border-radius:99px; font-size:13.5px;
  background:var(--card2); border:1px solid var(--bd); color:var(--sub);
}
.chips button.on { background:var(--wash); border-color:var(--accent); color:var(--tx); font-weight:600; }
.stepper { display:flex; align-items:center; gap:14px; }
.stepper button {
  width:var(--tap); height:var(--tap); border-radius:12px; font-size:22px; font-weight:600;
  background:var(--card2); border:1px solid var(--bd);
}
.stepper b { font-size:22px; min-width:44px; text-align:center; font-variant-numeric:tabular-nums; }
.hint { font-size:12.5px; color:var(--mut); margin-top:6px; }
.hint b { color:var(--tx); }
.note {
  background:var(--wash); border:1px solid var(--bd); border-radius:10px;
  padding:10px 12px; font-size:13px; color:var(--sub); margin:12px 0;
}
.primary {
  width:100%; min-height:52px; border-radius:13px; font-size:16px; font-weight:700;
  background:var(--accent); color:#151204; margin-top:6px;
}
.primary:disabled { opacity:.35; }
.ghost {
  width:100%; min-height:46px; border-radius:12px; font-size:14.5px;
  background:var(--card2); border:1px solid var(--bd); color:var(--sub); margin-top:10px;
}
.switch { display:flex; align-items:center; justify-content:space-between; min-height:var(--tap);
  padding:4px 0; }
.switch .lbl { font-size:14.5px; }
.switch .sub { font-size:12px; color:var(--mut); }
.tgl { width:50px; height:30px; border-radius:99px; background:var(--card2); border:1px solid var(--bd); position:relative; transition:background .15s; }
.tgl::after { content:""; position:absolute; top:3px; left:3px; width:22px; height:22px; border-radius:99px;
  background:var(--mut); transition:all .15s; }
.tgl.on { background:var(--wash); border-color:var(--accent); }
.tgl.on::after { left:23px; background:var(--accent); }

/* Search results */
.results { margin-top:10px; }
.empty {
  text-align:center; color:var(--mut); font-size:13px; padding:26px 14px;
  background:var(--card2); border:1px dashed var(--bd); border-radius:var(--r);
}
.empty small { display:block; color:var(--mut2); margin-top:4px; }

/* Tab bar */
#tabbar {
  position:fixed; bottom:0; left:0; right:0; z-index:20;
  display:grid; grid-template-columns:repeat(4,1fr);
  background:rgba(10,10,11,.94); backdrop-filter:blur(12px);
  border-top:1px solid var(--bd);
  padding:6px 8px calc(6px + env(safe-area-inset-bottom));
}
#tabbar button {
  display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:6px 0; font-size:10.5px; color:var(--mut2); border-radius:10px;
}
#tabbar button svg { width:22px; height:22px; }
#tabbar button.active { color:var(--accent); }

/* Sheet (event detail) */
#sheet {
  position:fixed; inset:0; z-index:40; background:rgba(5,5,6,.6);
  display:flex; align-items:flex-end;
}
#sheet.hidden { display:none; }
#sheet-body {
  background:var(--bg); border-top:1px solid var(--bdh); border-radius:18px 18px 0 0;
  width:100%; max-height:88dvh; overflow-y:auto;
  padding:10px var(--pad) calc(24px + env(safe-area-inset-bottom));
}
.grab { width:38px; height:4px; border-radius:99px; background:var(--bd); margin:4px auto 12px; }
.sheet-head { margin-bottom:10px; }
.sheet-head h3 { font-size:17px; font-weight:700; }
.sheet-head .s { font-size:13px; color:var(--mut); margin-top:2px; }
.minibtn {
  min-height:34px; padding:5px 12px; border-radius:9px; font-size:12.5px; font-weight:600;
  background:var(--card2); border:1px solid var(--bd); color:var(--sub);
}
.minibtn.acc { background:var(--wash); border-color:var(--accent); color:var(--tx); }

/* Toast */
#toast {
  position:fixed; left:50%; bottom:calc(96px + env(safe-area-inset-bottom)); transform:translateX(-50%);
  background:var(--elev); border:1px solid var(--bdh); border-radius:12px;
  padding:11px 16px; font-size:13.5px; z-index:60; max-width:88vw; text-align:center;
  box-shadow:0 6px 24px rgba(0,0,0,.5);
}
#toast.hidden { display:none; }
#toast b { color:var(--green); }