/* Taco Mensch four-surface app — brand-native per the 2023 Brand Guidelines:
   primary colours TM Green #018E4A · TM Orange #EC5629 · TM Blue #CDE0FC ·
   TM Cream #F7E2D3 · TM White (exact); DM Sans is the ONLY brand typeface
   (self-hosted from the brand pack); the logotype is used only as the provided
   asset, single colour, never text-set. Tint/deep shades are functional UI
   derivations of the five primaries. */
@font-face{
  font-family:'DM Sans';
  src:url('assets/DMSans-Variable.ttf') format('truetype');
  font-weight:100 1000; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'DM Sans';
  src:url('assets/DMSans-Italic-Variable.ttf') format('truetype');
  font-weight:100 1000; font-style:italic; font-display:swap;
}
:root{
  --green:#018E4A; --green-deep:#02703c; --green-tint:#e2f2e9;
  --orange:#EC5629; --orange-tint:#fdeae3;
  --blue:#CDE0FC; --blue-deep:#39588a; --blue-tint:#e8f0fd;
  --cream:#F7E2D3; --paper:#FFFDFA; --ink:#20241f; --ink-soft:#5c6259; --line:#e5d8cc;
  --ink-label:#20231f; --ink-title:#0d0d0d; --ink-section:#111111;
  --serif:'DM Sans', ui-sans-serif, system-ui, sans-serif;  /* display = DM Sans heavy (brand has no serif) */
  --sans:'DM Sans', ui-sans-serif, system-ui, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
/* type scale (one system): 12 metadata/labels · 14 body/controls · 16 card title ·
   24 page title. Weight ladder carries the hierarchy (sizes deliberately unchanged):
   400 body · 500 emphasis · 640 field/column labels · 700 section headings ·
   780 page/card/drawer titles, over inks #20231f / #111111 / #0d0d0d.
   Section headings are 14px SENTENCE CASE with normal tracking — small tracked
   all-caps is clean but slow to scan, so structure gets the friendlier anchor
   while field labels keep their uppercase. Uppercase labels are tracked
   .045-.055em: wider tracking dilutes weight at 10-12px. Helper stays 400. */
body{
  font-family:var(--sans); color:var(--ink); background:var(--cream);
  background-image:radial-gradient(1100px 420px at 12% -6%, #fbeee2 0%, transparent 60%),
                   radial-gradient(800px 380px at 108% 6%, #f2e6da 0%, transparent 55%);
  line-height:1.5; font-size:14px; padding-bottom:5rem;
}
.page{max-width:1080px;margin:0 auto;padding:0 20px}
.boot{padding:80px 0;text-align:center;color:var(--ink-soft);font-family:var(--serif);font-size:18px}

/* ---------- green header band (the tacomensch.com treatment) ---------- */
.topband{background:var(--green)}
.band-inner{max-width:1080px;margin:0 auto;padding:13px 20px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
img.mark{height:30px;width:auto;display:block}   /* the real logotype asset — never text-set */
nav.appnav{display:flex;gap:4px;margin-left:auto}
nav.appnav button{
  font-family:var(--sans);font-size:14px;font-weight:700;color:#fff;
  background:none;border:none;padding:8px 16px;cursor:pointer;border-radius:999px;
  display:flex;align-items:center;gap:7px;
}
nav.appnav button.on{background:var(--paper);color:var(--green-deep)}
nav.appnav button:not(.on):hover{background:rgba(255,255,255,.14)}
.navbadge{display:inline-block;min-width:19px;text-align:center;background:var(--blue-deep);
  color:#fff;border-radius:999px;font-size:11px;padding:1px 6px}
.navbadge[hidden]{display:none}
.navbadge.orange{background:var(--orange)}

/* ---------- generic ---------- */
section.surface{margin-top:22px}
.surface-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.surface-head h1{font-family:var(--serif);font-weight:780;font-size:24px;letter-spacing:-.01em;color:var(--ink-title)}
.surface-head .sub{font-size:12px;color:var(--ink-soft)}
.surface-head .right{margin-left:auto;display:flex;align-items:center;gap:10px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:14px}
.card .card-title{padding:11px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.card .card-title h3{font-family:var(--serif);font-size:16px;font-weight:780;color:var(--ink-title)}
.card .card-title .hint{font-size:12px;font-weight:400;color:var(--ink-soft);margin-left:auto;text-align:right}
.card .pad{padding:16px}
.tbl-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th{font-size:12px;letter-spacing:.045em;text-transform:uppercase;color:var(--ink-label);font-weight:640;text-align:right;padding:8px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
th:first-child,td:first-child{text-align:left}
td{padding:7px 12px;border-bottom:1px solid #f0e7dc;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr:last-child td{border-bottom:none}
td.name{font-weight:500}
tr.total td{border-top:2px solid var(--ink);font-weight:700;background:#fbf6ee}
tr.rowlink{cursor:pointer}
tr.rowlink:hover td{background:#fbf6ee}
.bar{display:inline-block;height:7px;border-radius:4px;background:var(--green);vertical-align:middle;margin-right:7px;min-width:2px}
.muted{color:var(--ink-soft);font-weight:400}
.unk{color:var(--blue-deep);background:var(--blue-tint);border-radius:6px;padding:1px 7px;font-size:12px}
.chip{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:500}
.chip.paid{background:var(--green-tint);color:var(--green-deep)}
.chip.owed{background:var(--orange-tint);color:#b93c14}
.chip.settled{background:var(--blue-tint);color:var(--blue-deep)}
.chip.zero{background:var(--green-tint);color:var(--green-deep)}
.chip.pendingc{background:var(--orange-tint);color:#b93c14;cursor:pointer;border:1px dashed #f0a488}
.chip.pendingc:hover{background:#fbd9cb}
.chip.basis{background:var(--blue-tint);color:var(--blue-deep)}
.chip.inference{background:#f4eefb;color:#6b4d9e}
.chip.lock{background:var(--blue-tint);color:var(--blue-deep)}
.chip.live{background:var(--green-tint);color:var(--green-deep)}
.chip.jw{background:var(--blue-tint);color:var(--blue-deep)}
.empty{padding:26px 16px;text-align:center;color:var(--ink-soft);font-size:13.5px}
.empty .big{font-family:var(--serif);font-size:16px;color:var(--ink);margin-bottom:4px}
.flash{animation:flash 1.8s ease}
@keyframes flash{0%,55%{background:var(--orange-tint)}100%{background:transparent}}

/* ---------- forms ---------- */
label.f{display:block;font-size:12px;letter-spacing:.045em;text-transform:uppercase;color:var(--ink-label);font-weight:640;margin:12px 0 5px}
input[type=text],input[type=number],input[type=date],select,textarea{
  font-family:var(--sans);font-size:14px;padding:9px 12px;border:1px solid var(--line);
  border-radius:10px;background:var(--paper);color:var(--ink);width:100%;
}
input[type=number]{text-align:right;font-variant-numeric:tabular-nums}
input:focus,select:focus,textarea:focus{outline:2px solid var(--green);outline-offset:0;border-color:var(--green)}
/* ONE chip primitive: same height, radius, border and focus everywhere (nav, chips,
   segments share geometry; .btn is the only other control primitive) */
.seg{display:flex;gap:6px;flex-wrap:wrap}
.seg button{
  font-family:var(--sans);font-size:14px;padding:7px 14px;border:1px solid #dccdbc;
  border-radius:999px;background:var(--paper);color:var(--ink-soft);cursor:pointer;
}
.seg button:not(.on):hover{background:#f7f1e8}
.seg button.on{background:var(--green-deep);border-color:var(--green-deep);color:#fff}
.seg.small button{font-size:14px;padding:7px 14px}
/* quiet variant: secondary filters read as text tabs, not peer controls */
.seg.quiet button{border-color:transparent;background:none}
.seg.quiet button:not(.on):hover{background:#f7f1e8}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid3{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px}
@media (max-width:640px){.grid2,.grid3{grid-template-columns:1fr}}
/* .gdate's phone collapse deliberately does NOT live here: .grid2.gdate gets its
   250px 1fr columns ~200 lines below, and at equal specificity the LATER rule wins
   the cascade even against a media query (it did, silently, until 2026-08-25).
   Responsive overrides in this sheet live at the END, where last-wins works FOR them. */
.btn{
  font-family:var(--sans);font-size:14px;font-weight:500;border:none;border-radius:10px;
  padding:10px 18px;cursor:pointer;background:#efe6da;color:var(--ink);
}
.btn.primary{background:var(--green-deep);color:#fff}
.btn.primary:hover{background:#027a40}   /* functional derivation: hover stays AA (4.9:1) */
.btn.warn{background:var(--orange-tint);color:#8a2f10;border:1px dashed #f0a488}   /* pending state: explicit, never the loudest */
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.ghost{background:none;border:1px dashed var(--line);color:var(--ink-soft)}
.btn.small{font-size:13px;padding:7px 14px}
/* Repeatable-record container (a booking, an additional guide, a cost line) — NOT a
   card: quiet border, near-paper fill, small radius. It means "these fields belong to
   one record", never "this is another section". The card/section hierarchy above it:
   outer card = the transaction · hairlines = its stages · this = one repeatable object. */
.booking-strip{border:1px solid #f2e9dd;border-radius:8px;padding:12px 14px;margin-top:10px;background:#fdfbf8;position:relative}
.booking-strip label.f{margin-top:8px}
.booking-strip .rm{position:absolute;top:8px;right:10px;border:none;background:none;color:var(--ink-soft);cursor:pointer;font-size:14px}
.owe-line{
  margin-top:14px;padding:12px 16px;border-radius:11px;background:var(--green-tint);
  color:var(--green-deep);font-size:14px;font-weight:500;
}
.owe-line.pending{background:var(--orange-tint);color:#8a2f10}
.form-error{margin-top:10px;padding:10px 14px;border-radius:10px;background:var(--orange-tint);
  color:#8a2f10;font-size:13px}
.verified{
  font-size:12px;color:var(--green-deep);background:var(--paper);border:1px solid var(--line);
  border-radius:999px;padding:5px 12px;cursor:pointer;
}
.verified:hover{background:var(--green-tint)}

/* ---------- KPI / reports (ported from the compact Reports surface) ---------- */
nav.tabs{display:flex;gap:4px;border-bottom:2px solid var(--ink)}
nav.tabs button{
  font-family:var(--sans);font-size:14.5px;font-weight:500;color:var(--ink-soft);
  background:none;border:none;padding:9px 16px;cursor:pointer;border-radius:9px 9px 0 0;
}
nav.tabs button.on{background:var(--ink);color:var(--paper)}
nav.tabs button:not(.on):hover{background:#f0e3d6}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:18px}
.kpi{background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:14px 16px 12px;position:relative;overflow:hidden}
.kpi .lbl{font-size:11px;letter-spacing:.055em;text-transform:uppercase;color:var(--ink-label);font-weight:640}
.kpi .val{font-family:var(--serif);font-weight:700;font-size:clamp(20px,2.3vw,26px);margin-top:5px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.kpi .note{font-size:11px;color:var(--ink-soft);margin-top:4px}
.kpi.hero{background:var(--green-deep);border-color:var(--green-deep);color:#f2faf5}
.kpi.hero .lbl{color:#bfe3cf}.kpi.hero .val{color:#fff}.kpi.hero .note{color:#a9d8bd}
/* The row reads left to right as the arithmetic it states: money in, money out,
   what is left -- then Owed now, which is current state and deliberately OUTSIDE
   the equation (dashed, blue, actionable). Colour REINFORCES the labels, it never
   replaces them: every tile still says what it is in words, so the row survives
   being read in greyscale or by someone who does not see the hue. Green against
   ORANGE rather than red -- the brand already spends orange on money-out and
   attention (.chip.owed, .btn.warn), and green/orange stays separable under the
   common colour-vision deficiencies where green/red does not. Values stay
   near-black: the tint and the 4px accent carry the coding, so the numbers
   themselves keep maximum legibility. */
.kpi.in{background:var(--green-tint);border-color:#bfe0cd}
.kpi.out{background:var(--orange-tint);border-color:#f2b49c}
.kpi.in .lbl{color:var(--green-deep)}
.kpi.out .lbl{color:#b93c14}
.kpi.in::before,.kpi.out::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px}
.kpi.in::before{background:var(--green)}
.kpi.out::before{background:var(--orange)}
.kpi.now{border-style:dashed;border-color:#b9c9e4;background:var(--blue-tint);cursor:pointer}
.kpi.now .lbl{color:var(--blue-deep)}
.kpi.now:hover{background:#dce9fb}
.kpi.now .today{display:inline-block;background:var(--blue-deep);color:#fff;border-radius:999px;font-size:10px;padding:1px 8px;margin-left:6px;vertical-align:middle;letter-spacing:.06em}
.facts{margin-top:10px;font-size:12.5px;color:var(--ink-soft);display:flex;gap:18px;flex-wrap:wrap}
.facts b{color:var(--ink);font-variant-numeric:tabular-nums}
.facts .pendlink{color:#b93c14;cursor:pointer;text-decoration:underline dotted}
/* Promoted out of .facts: a month needing tax must look like an open item, not metadata. */
.taxbar{display:flex;align-items:center;gap:10px;margin-top:10px;padding:8px 14px;
  border:1px solid var(--line);border-radius:11px;background:var(--paper)}
.taxbar .tb-lbl{font-size:11px;letter-spacing:.055em;text-transform:uppercase;
  color:var(--ink-label);font-weight:640}
.taxbar .tb-val{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink)}
.taxbar .tb-scope{font-size:12px;color:var(--ink-soft)}
.taxbar .tb-ro{margin-left:auto;font-size:12px;color:var(--ink-soft)}
.taxbar .tb-act{margin-left:auto}
.taxbar.needs{background:var(--orange-tint);border-color:#f2b49c}
.taxbar.needs .tb-lbl,.taxbar.needs .tb-val{color:#b93c14}
input.search{font-family:var(--sans);font-size:13.5px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:var(--paper);min-width:170px;width:auto}
details.more{margin-top:14px;background:var(--paper);border:1px solid var(--line);border-radius:12px}
details.more summary{padding:10px 16px;cursor:pointer;font-size:13px;color:var(--ink-soft)}

/* ---------- drawer ---------- */
.backdrop{position:fixed;inset:0;background:rgba(32,36,31,.35);opacity:0;pointer-events:none;transition:opacity .2s;z-index:80}
.backdrop.on{opacity:1;pointer-events:auto}
.drawer{
  position:fixed;top:0;right:-640px;width:min(620px,95vw);height:100vh;z-index:90;
  background:var(--paper);border-left:1px solid var(--line);box-shadow:-18px 0 40px -20px rgba(32,36,31,.35);
  transition:right .22s ease;display:flex;flex-direction:column;
}
.drawer.on{right:0}
.drawer .d-head{padding:16px 20px 12px;border-bottom:1px solid var(--line)}
.drawer .d-head h3{font-family:var(--serif);font-size:19px;font-weight:780;letter-spacing:-.01em;padding-right:26px;color:var(--ink-title)}
.drawer .d-head .sub{font-size:12px;color:var(--ink-soft);margin-top:3px}
.drawer .d-close{position:absolute;top:12px;right:14px;border:none;background:none;font-size:20px;cursor:pointer;color:var(--ink-soft)}
.drawer .d-body{overflow-y:auto;padding:14px 20px 30px;flex:1}
.drawer table{font-size:12.5px}
.drawer td,.drawer th{padding:6px 9px;white-space:normal}
.sumgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:4px 0 6px}
.sumgrid .s{background:#fbf8f2;border:1px solid #f0e7dc;border-radius:10px;padding:8px 10px}
.sumgrid .s .k{font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-label);font-weight:640}
.sumgrid .s .v{font-family:var(--serif);font-weight:700;font-size:15.5px;margin-top:2px;font-variant-numeric:tabular-nums}
.d-tabs{display:flex;gap:4px;margin:12px 0 8px;border-bottom:1px solid var(--line)}
.d-tabs button{font-family:var(--sans);font-size:13px;padding:6px 12px;border:none;background:none;color:var(--ink-soft);cursor:pointer;border-bottom:2px solid transparent}
.d-tabs button.on{color:var(--green-deep);border-bottom-color:var(--green-deep);font-weight:500}
.d-note{font-size:12px;color:var(--ink-soft);background:var(--blue-tint);border:1px solid #cdddf4;border-radius:9px;padding:8px 12px;margin:8px 0}
.d-note.warn{background:var(--orange-tint);border-color:#f2b49c;color:#8a2f10}
.note-cell{max-width:340px;color:var(--ink-soft);font-size:11.5px;text-align:left}
.kv{font-size:12.5px;margin-top:6px}
.kv code{background:var(--blue-tint);border-radius:5px;padding:0 5px;color:var(--blue-deep);font-size:11px;word-break:break-all}
.kv li{margin:5px 0 0 18px;color:var(--ink-soft)}
.d-h4{font-family:var(--serif);font-size:14px;font-weight:700;margin:12px 0 6px;color:var(--green-deep)}

/* ---------- toasts ---------- */
.toasts{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:120;display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{
  background:var(--ink);color:var(--paper);border-radius:999px;padding:10px 22px;font-size:14px;
  box-shadow:0 10px 28px -10px rgba(32,36,31,.5);animation:rise .25s ease both;max-width:88vw;
}
.toast b{color:#9fe0bd}
.toast.warn{background:#8a2f10}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

footer{margin-top:44px;font-size:11.5px;color:var(--ink-soft);border-top:1px solid var(--line);padding-top:12px}
@media print{.drawer,.backdrop,.toasts{display:none}body{background:#fff}}

/* forward domain */
.moremenu{display:inline-flex;gap:6px;margin-left:8px}
.moremenu button{border:1px solid #dccdbc;background:var(--paper);border-radius:999px;
  padding:7px 14px;font:inherit;font-size:14px;cursor:pointer;color:var(--ink-soft)}
.moremenu button:hover{background:#f7f1e8}
.ee-edit{color:var(--blue-deep);text-decoration:none;font-size:13px;margin-left:4px}

.totrow td{font-weight:700;border-top:2px solid var(--line)}
.mg-ren{color:var(--blue-deep);text-decoration:none;font-size:12px;margin-left:6px}

#tbl-acts th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
#tbl-acts th.sortable:hover{color:var(--green)}

/* Delete / Restore records (never a SQL DELETE) */
.btn.danger{color:#a12c22;border-color:#dcaaa4}
.btn.danger:hover{background:#fbf1ef}
.void-banner{background:#fdf1ef;border:1px solid #e6c2bc;border-radius:10px;
  padding:10px 12px;margin-bottom:14px;color:#7c281f;font-size:13px}
.void-confirm{margin-top:8px;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
tr.voided-row td{opacity:.55}
.voided-view #d-correct,.voided-view #d-correct-hist,.voided-view #d-complete,
.voided-view #d-aam-correct,.voided-view #d-ev-correct,.voided-view #d-ev-addcost,
.voided-view #d-ev-topay,.voided-view .ee-edit{display:none}

/* Data-entry polish (design critique 2026-08-23; presentation only) */
/* money inputs say their currency — entry is never ambiguous about pesos */
.mny{position:relative;display:block}
.mny::after{content:'MXN';position:absolute;right:11px;top:50%;transform:translateY(-50%);
  font-size:10.5px;letter-spacing:.06em;color:var(--ink-soft);pointer-events:none}
.mny input{padding-right:52px}
/* one coherent keyboard-focus story: chips and buttons get the same ring inputs have */
.seg button:focus-visible,.btn:focus-visible{outline:2px solid var(--green);outline-offset:2px}
nav.appnav button:focus-visible{outline:2px solid #fff;outline-offset:2px}
/* error-time highlight: the failed save points at the row that needs attention */
.seg.err{outline:2px solid var(--orange);outline-offset:4px;border-radius:12px}

/* Reports calendar — Table | Month | Agenda (read-only presentation of the same rows).
   Grid discipline: no nested scrolling (busy days cap at 3 cards + a quiet "+N more"
   expander), identical day-number placement in every cell, one primary object per
   region — rollups and the unknown-date section are quiet summaries, never the
   loudest thing on screen. */
.cal-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.cal-wrap{overflow-x:auto}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);column-gap:6px;row-gap:8px;min-width:720px}
.cal-dow{font-size:12px;letter-spacing:.045em;text-transform:uppercase;color:var(--ink-label);font-weight:640;padding:4px 8px 6px}
.cal-cell{border:1px solid var(--line);border-radius:9px;background:var(--paper);
  min-height:86px;padding:26px 7px 7px;position:relative}
.cal-cell.cal-out{background:none;border-style:dashed;opacity:.4;min-height:86px}
.cal-daynum{position:absolute;top:6px;left:9px;font-size:12px;color:var(--ink-soft)}
.cal-roll{display:block;font-size:12px;color:var(--ink-soft);margin-bottom:5px;line-height:1.4}
.cal-roll span{display:block}
.cal-pend{color:#9a5b00}
.agenda-h .cal-roll,.agenda-h .cal-roll span{display:inline;margin-right:8px}
.cal-card{font-size:12px;line-height:1.4;padding:3px 5px;border-radius:6px;cursor:pointer;margin-bottom:2px}
.cal-card:hover{background:#fbf6ee}
.cal-card .cal-t{font-weight:500}
.cal-card .cal-m{display:block;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.cal-card.voidedc{opacity:.55}
.cal-card .cal-st{color:#9a5b00;font-size:12px}
.cal-hid{display:none}
.cal-cell.cal-open .cal-hid{display:block}
.cal-more{border:none;background:none;color:var(--blue-deep);font-size:12px;cursor:pointer;
  padding:2px 5px;font-family:var(--sans)}
.cal-more:hover{text-decoration:underline}
.cal-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;vertical-align:1px}
.d-tour{background:var(--green)} .d-jew{background:var(--blue-deep)}
.d-ev{background:var(--orange)} .d-aam{background:#6b4d9e}
.cal-unk{margin-top:14px;border-top:1px dashed var(--line);padding:10px 2px 0}
.cal-unk-h{font-size:12px;font-weight:500;color:var(--ink);margin-bottom:5px}
.cal-unk-h::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--blue-deep);margin-right:6px;vertical-align:1px}
.agenda-day{margin-bottom:16px}
.agenda-h{display:flex;align-items:center;gap:10px;margin-bottom:4px;flex-wrap:wrap;font-size:14px}
/* responsive density: narrow widths privilege names and state over economics */
@media (max-width:900px){.cal-card .cal-m{display:none}}
/* Reports control-bar hierarchy: view mode prominent · filters quiet · utilities tertiary */
.acts-bar .hint{flex-basis:100%;margin-left:0;text-align:left}
.acts-bar label.tertiary{margin-left:auto;font-size:12px;color:var(--ink-soft)}
/* Today: sections breathe; the commit action sits on a quiet footer boundary */
#tc > label.f{margin-top:24px}
.form-foot{margin-top:20px;padding-top:14px;border-top:1px solid var(--line)}
.neg{color:#8a2f10}

/* Today balance pass: the date box fits its content (Experience gets one line),
   placeholders read left while typed numbers stay right, section labels sit one
   step above field labels, and the commit action anchors the footer's end. */
.grid2.gdate{grid-template-columns:250px 1fr}
input[type=number]::placeholder{text-align:left}
label.f.sec{font-size:14px;font-weight:700;text-transform:none;letter-spacing:normal;
  color:var(--ink-section);margin:20px 0 7px}
/* Today's tour card: three primary content blocks in causal order, separated by
   hairlines — deliberately NOT nested cards (no card-in-card noise). */
.tc-sect{padding:2px 0 16px}
.tc-sect + .tc-sect{border-top:1px solid var(--line);padding-top:16px}
.tc-sect h4{font-family:var(--serif);font-size:15px;font-weight:700;color:var(--ink-section);margin:0 0 10px}
/* section header row: the title plus any action that belongs to the SECTION
   (e.g. Manage guides edits the roster, not the guide chosen in a record). */
.tc-sect .sect-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 10px}
.tc-sect .sect-head h4{margin:0}
.tc-sect .sect-head .sect-action{margin-left:auto;font-size:12px;color:var(--blue-deep)}
.form-foot{display:flex;justify-content:flex-end}
/* money fields read intentional: one consistent width, the MXN affix hugs the field */
.mny{max-width:300px}

/* ---------- mobile (phones) ----------
   CSS-only adaptation. Desktop is untouched above 640px, and the lab journey runs a
   desktop viewport, so nothing here can move a pin. Two real fixes live in this block,
   the rest is fit-and-finish:
   1. .grid2.gdate's phone collapse lives HERE and only here: its desktop 250px 1fr
      columns are declared mid-sheet, and at equal specificity the later rule wins the
      cascade even against a media query -- so this block sits at the end, where
      last-wins works for it (the mid-sheet copy of this rule was dead code and is gone).
   2. Inputs go to 16px: below that, iOS Safari zooms the whole page on focus. */
@media (max-width:640px){
  .page{padding:0 14px}
  .band-inner{padding:11px 14px;gap:10px 14px}
  nav.appnav{gap:2px}
  nav.appnav button{padding:8px 12px;font-size:14.5px}
  .surface-head{gap:8px}
  .surface-head .right{margin-left:0;width:100%;justify-content:flex-start}
  .grid2.gdate{grid-template-columns:1fr}
  input[type=text],input[type=number],input[type=date],select,textarea{font-size:16px}
  .card .card-title .hint{margin-left:0;text-align:left;width:100%}
  .taxbar{flex-wrap:wrap}
  .taxbar .tb-ro,.taxbar .tb-act{margin-left:0}
  .drawer{width:100vw;right:-110vw;border-left:none}
  .drawer.on{right:0}
  .toasts{bottom:14px}
}
