/*
 * The four operator tools (/vendor, /console, /door, /admin), on top of
 * Paste-up's tool shell (paste/tool.css). Linked by those four pages only, so
 * /post and the marketing pages are untouched. Two jobs (Nov 2026, the
 * owner's notes):
 *
 *   1. Type a size up. Body and help text at 15-16px, labels 14-15px, and no
 *      meta, hint or "why" line under 13px; headings heavier. The shell's
 *      own classes are restated here at one more class of specificity
 *      (body.tool) so the shared sheet stays as /post has it.
 *   2. Maps as paper. Every map frame, live or still, is cut like a scrap
 *      from the collage: a torn edge (a mask, so it holds through the
 *      WebGL canvas), the page's grain over the streets, and the edges sunk
 *      into the paper or the ink room. No zoom buttons: pinch, scroll and
 *      double-click zoom. The Mapbox credit stays, small and quiet.
 */

/* ── 1. Type ────────────────────────────────────────────────────────────── */

/* The desk's scale, which the vendor sheets were written against, a step up. */
:root:root:root:root { --t-11: 12.5px; --t-12: 13px; --t-13: 14px; --t-14: 15px; --t-15: 16px; --t-16: 16.5px; }

body.tool .why { font-size: 15px; line-height: 1.45; }
body.tool .tcard h2, body.tool .tcard h3.t { font-size: 20px; font-weight: 800; letter-spacing: -.025em; }
body.tool .d-card-head h2 { font-size: 20px; font-weight: 800; letter-spacing: -.025em; }
body.tool .d-card-sub { font-size: 15px; }
body.tool .page-head .lede { font-size: 18px; }
body.tool .lbl { font-size: 14.5px; }
body.tool .hint { font-size: 13.5px; }
body.tool .small { font-size: 14px; }
body.tool .row b { font-size: 15.5px; }
body.tool .row small { font-size: 14px; }
body.tool .kpi .k { font-size: 14px; }
body.tool .kpi .d { font-size: 13.5px; }
body.tool .cx { font-size: 15px; }
body.tool .cx.sm { font-size: 14px; }
body.tool .seg button { font-size: 14.5px; }
body.tool .side-place b { font-size: 15px; }
body.tool .side-place small { font-size: 13px; }
body.tool .side-nav .grp { font-size: 12.5px; }
body.tool .side-nav a, body.tool .side-nav button { font-size: 15.5px; }
body.tool .side-note { font-size: 14px; }
body.tool .side-foot a, body.tool .side-foot button { font-size: 15px; }
body.tool .legal-links, body.tool .side-foot .legal-links a { font-size: 13px; }
body.tool .topbar .crumb { font-size: 15px; }
body.tool .search-btn { font-size: 15px; }
body.tool .empty p { font-size: 15px; }
body.tool .empty b { font-size: 17px; }
body.tool .note-item b { font-size: 15px; }
body.tool .note-item small, body.tool .palette li small { font-size: 13.5px; }
body.tool .steps li { font-size: 15px; }
body.tool .tag { font-size: 13px; }
body.tool .kick { font-size: 13px; }
body.tool .toast { font-size: 15px; }
@media (max-width: 860px) { body.tool .tabbar a, body.tool .tabbar button { font-size: 12px; } }

/* A textarea grows with what is typed (the field's own script) and has no
   grip to drag, as the shared controls now are. */
body.tool textarea { resize: none; field-sizing: content; min-height: 96px; max-height: 60vh; }

/* ── 2. Maps as paper ───────────────────────────────────────────────────── */

/* Every map frame on these pages: the vendor previews and area map, the
   console's alert maps, admin's still pictures. */
.vp-mapframe, .pp-map, .v-spon-stage, .mv-area, .cmap-wrap, .a-np-pic, .a-seller-area {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000' preserveAspectRatio='none'%3E%3Cpolygon points='0,2 10,5 19,4 32,0 46,0 59,0 69,3 86,1 97,4 116,4 129,7 138,6 150,1 159,2 177,1 192,4 204,4 213,0 224,5 237,2 252,3 264,6 280,2 295,4 313,5 325,7 335,3 351,1 365,0 381,5 396,6 408,5 423,4 437,6 456,3 471,0 488,5 507,6 519,3 535,0 548,1 558,0 575,1 586,3 604,1 618,4 636,6 654,2 667,3 685,7 695,1 706,2 720,4 732,0 745,3 759,7 776,4 791,5 800,6 817,6 834,3 847,1 863,0 872,1 882,2 891,0 901,1 914,0 932,4 942,2 954,3 964,6 984,3 997,1 998,0 994,11 1000,22 996,41 996,51 996,59 994,79 998,95 999,107 996,124 998,142 994,153 994,172 994,189 998,206 998,220 1000,229 998,240 993,257 993,270 993,290 998,302 999,313 996,324 994,342 995,356 999,373 994,389 995,406 999,420 998,437 993,455 997,467 995,486 999,497 994,507 999,524 993,542 998,558 999,572 993,581 996,596 997,615 994,633 998,644 998,656 998,671 999,684 998,703 996,716 997,735 996,753 996,768 997,776 1000,787 999,804 995,818 998,832 996,847 999,864 998,878 995,890 996,904 994,921 996,934 996,948 997,965 997,979 995,998 1000,993 989,996 970,994 960,999 946,999 935,999 919,995 901,999 885,995 875,994 855,998 836,997 822,993 805,999 791,996 779,999 767,995 759,996 745,1000 733,996 719,1000 700,994 680,999 669,1000 652,998 642,997 623,994 612,999 593,996 577,999 568,995 555,999 536,996 519,999 501,1000 483,997 470,996 452,998 442,996 431,999 421,1000 410,998 398,995 386,996 376,998 367,998 359,995 344,999 331,993 321,994 308,997 290,997 276,995 256,998 239,995 223,997 211,1000 201,1000 184,998 174,999 156,994 140,998 129,998 116,999 102,998 83,993 69,998 49,998 37,1000 24,997 10,999 0,1000 1,989 0,976 2,967 4,956 5,942 5,926 3,908 7,896 5,886 0,870 6,852 5,837 1,819 4,805 6,787 4,770 5,751 2,735 1,726 1,714 4,696 4,681 3,665 6,656 4,640 5,625 5,616 1,605 5,593 5,583 3,563 3,551 5,535 4,519 1,510 5,499 4,487 0,478 5,467 5,451 4,439 3,426 6,416 7,405 0,386 6,373 3,354 1,342 1,323 1,308 7,294 6,284 6,270 2,254 3,235 0,227 3,213 1,201 2,189 0,171 6,154 6,144 6,128 3,116 7,103 3,88 2,75 1,66 2,49 2,30 4,18 3,8'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000' preserveAspectRatio='none'%3E%3Cpolygon points='0,2 10,5 19,4 32,0 46,0 59,0 69,3 86,1 97,4 116,4 129,7 138,6 150,1 159,2 177,1 192,4 204,4 213,0 224,5 237,2 252,3 264,6 280,2 295,4 313,5 325,7 335,3 351,1 365,0 381,5 396,6 408,5 423,4 437,6 456,3 471,0 488,5 507,6 519,3 535,0 548,1 558,0 575,1 586,3 604,1 618,4 636,6 654,2 667,3 685,7 695,1 706,2 720,4 732,0 745,3 759,7 776,4 791,5 800,6 817,6 834,3 847,1 863,0 872,1 882,2 891,0 901,1 914,0 932,4 942,2 954,3 964,6 984,3 997,1 998,0 994,11 1000,22 996,41 996,51 996,59 994,79 998,95 999,107 996,124 998,142 994,153 994,172 994,189 998,206 998,220 1000,229 998,240 993,257 993,270 993,290 998,302 999,313 996,324 994,342 995,356 999,373 994,389 995,406 999,420 998,437 993,455 997,467 995,486 999,497 994,507 999,524 993,542 998,558 999,572 993,581 996,596 997,615 994,633 998,644 998,656 998,671 999,684 998,703 996,716 997,735 996,753 996,768 997,776 1000,787 999,804 995,818 998,832 996,847 999,864 998,878 995,890 996,904 994,921 996,934 996,948 997,965 997,979 995,998 1000,993 989,996 970,994 960,999 946,999 935,999 919,995 901,999 885,995 875,994 855,998 836,997 822,993 805,999 791,996 779,999 767,995 759,996 745,1000 733,996 719,1000 700,994 680,999 669,1000 652,998 642,997 623,994 612,999 593,996 577,999 568,995 555,999 536,996 519,999 501,1000 483,997 470,996 452,998 442,996 431,999 421,1000 410,998 398,995 386,996 376,998 367,998 359,995 344,999 331,993 321,994 308,997 290,997 276,995 256,998 239,995 223,997 211,1000 201,1000 184,998 174,999 156,994 140,998 129,998 116,999 102,998 83,993 69,998 49,998 37,1000 24,997 10,999 0,1000 1,989 0,976 2,967 4,956 5,942 5,926 3,908 7,896 5,886 0,870 6,852 5,837 1,819 4,805 6,787 4,770 5,751 2,735 1,726 1,714 4,696 4,681 3,665 6,656 4,640 5,625 5,616 1,605 5,593 5,583 3,563 3,551 5,535 4,519 1,510 5,499 4,487 0,478 5,467 5,451 4,439 3,426 6,416 7,405 0,386 6,373 3,354 1,342 1,323 1,308 7,294 6,284 6,270 2,254 3,235 0,227 3,213 1,201 2,189 0,171 6,154 6,144 6,128 3,116 7,103 3,88 2,75 1,66 2,49 2,30 4,18 3,8'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
  border-radius: 3px;
}

/* Grain and sunk edges over the live maps (the stills carry theirs in
   vendor-page/paste.css .v-ground-frame). Over the canvas, under the
   legend, the crosshair and the pins. */
.cmap-wrap::after, .mv-area::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .36 0 0 0 0 .3 0 0 0 0 .22 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E"),
    radial-gradient(130% 100% at 50% 45%, transparent 62%, color-mix(in srgb, var(--ground2) 60%, transparent) 100%);
  opacity: .45;
}
.cmap-wrap > :not(.cmap-gl), .mv-area > :not(.mv-map) { z-index: 2; }
:root[data-theme="dark"] :is(.cmap-wrap, .mv-area)::after { opacity: .7; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) :is(.cmap-wrap, .mv-area)::after { opacity: .7; } }

/* No zoom buttons (the maps no longer add them; this catches a stale one). */
:is(.cmap-gl, .mv-map) .mapboxgl-ctrl-top-right .mapboxgl-ctrl-group { display: none; }
/* The wordmark Mapbox requires, small and quiet. */
:is(.cmap-gl, .mv-map) .mapboxgl-ctrl-logo { transform: scale(.78); transform-origin: 0 100%; opacity: .55; }
.d-map-credit { font-size: 12px !important; opacity: .85; }

/* ── 3. Controls are the shared ones ──────────────────────────────────────
   Every select, date, time, datetime-local and number on these pages is
   drawn by paste/controls.js (each app calls auto() on its root), and
   checkboxes, radios and visible file inputs are dressed by
   paste/controls.css, the same kit /post uses. Nothing here restyles them;
   this only keeps the theme's colour scheme honest and gives a file input
   hidden inside its own label button (the label is the control) a focus ring. */
:root[data-theme="dark"] { color-scheme: dark; }
:root[data-theme="light"] { color-scheme: light; }

body.tool label:has(> input[type="file"]) { position: relative; cursor: pointer; }
body.tool label:has(> input[type="file"]:focus-visible) { box-shadow: 0 0 0 2.5px var(--accent); }

/* ── 4. Tabs are underlined, never filled ─────────────────────────────────
   The owner's rule (Nov 2026): a tab bar or a segmented selector shows the
   chosen one by a 2.5px rule under it, in ink (cream in the dark), with the
   chosen label in full ink and heavier and the rest muted.
     - Equal-width segments (.v-seg, .d-seg: the listing's parts, an event's
       When, the poster's style, Insights' period) carry one rule that slides
       to the chosen segment on the --v-i the page already keeps.
     - Filters that act as tabs (.op-tabs: console severities, the door's
       guest list, admin's queue) each draw their own rule, which grows in.
     - The phone's bottom bar: a short bar under the chosen icon and label.
   Option pickers (the sign's states, hold times, chips in a form) stay
   chips, chosen by a quiet tint rather than a solid fill. */

body.tool :is(.v-seg, .d-seg) {
  display: inline-grid; grid-template-columns: repeat(var(--v-n, 2), minmax(max-content, 1fr)); gap: 0;
  padding: 0 0 3px; border-radius: 0; background: none; box-shadow: none;
}
body.tool :is(.v-seg, .d-seg)::after {
  content: ""; position: absolute; left: 0; bottom: 0; height: 2.5px; width: calc(100% / var(--v-n, 2));
  border-radius: 2px; background: var(--ink);
  transform: translateX(calc(100% * var(--v-i, 0))); transition: transform 260ms var(--ease-out);
}
body.tool :is(.v-seg, .d-seg)::before { display: none; }
body.tool :is(.v-seg > button, .d-seg-btn) {
  height: 40px; padding: 0 16px; border-radius: 0; background: none !important; box-shadow: none !important;
  color: var(--ink3); font-size: 15px; font-weight: 600; transition: color 160ms ease;
}
body.tool :is(.v-seg > button, .d-seg-btn):hover { color: var(--ink2); }
body.tool :is(.v-seg > button, .d-seg-btn):is([aria-pressed="true"], [aria-selected="true"]) { color: var(--ink); font-weight: 800; }
/* A segment whose chosen one the page marks but not by --v-i (Insights redraws). */
body.tool .d-seg:not([style*="--v-i"])::after { display: none; }

body.tool .chips-x.op-tabs { display: flex; flex-wrap: wrap; gap: 4px 22px; padding: 0; background: none; }
body.tool .op-tabs > .cx {
  position: relative; height: 40px; padding: 0 1px; border-radius: 0; background: none !important; box-shadow: none !important;
  color: var(--ink3); font-size: 15px; font-weight: 600;
}
body.tool .op-tabs > .cx::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 2.5px; border-radius: 2px; background: var(--ink);
  transform: scaleX(0); transform-origin: 50% 50%; transition: transform 240ms var(--ease-out);
}
body.tool .op-tabs > .cx:is([aria-pressed="true"], [aria-checked="true"], [aria-selected="true"]) { color: var(--ink); font-weight: 800; }
body.tool .op-tabs > .cx:is([aria-pressed="true"], [aria-checked="true"], [aria-selected="true"])::after { transform: scaleX(1); }
body.tool .op-tabs > .cx:disabled { opacity: .45; }
body.tool .op-tabs > .cx b { font-weight: inherit; opacity: .6; }

/* The phone's bottom bar. */
body.tool .tabbar :is(a, button) { position: relative; background: none !important; }
body.tool .tabbar :is(a, button)::after {
  content: ""; position: absolute; left: 50%; bottom: 1px; width: 22px; height: 3px; margin-left: -11px; border-radius: 2px;
  background: var(--ink); transform: scaleX(0); transition: transform 240ms var(--ease-out);
}
body.tool .tabbar [aria-current] { color: var(--ink); font-weight: 800; }
body.tool .tabbar [aria-current]::after { transform: scaleX(1); }

/* Option pickers: a quiet tint, not a solid block of ink. */
body.tool :is(.cx, .v-chip-btn, .v-hr):is([aria-pressed="true"], [aria-checked="true"]):not(.op-tabs > *) {
  background: color-mix(in srgb, var(--ink) 13%, var(--well)); color: var(--ink); font-weight: 800; box-shadow: none;
}
body.tool .vp-state.v-state[aria-pressed="true"] {
  background: color-mix(in srgb, var(--v-c, var(--ink)) 20%, var(--well)); box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
  body.tool :is(.v-seg, .d-seg)::after, body.tool .op-tabs > .cx::after, body.tool .tabbar :is(a, button)::after { transition: none; }
}
/* The listing's parts stay pinned while scrolling, so they keep a ground. */
body.tool .ls-tabs.v-seg { background: var(--ground); padding-top: 4px; }