/* ==========================================================================
   CLIENT THEME. The only colours a client sets. Everything else in this file
   is worked out from these five, in both themes, by the derived palette below.

     --brand         the main accent: buttons, live dots, the Dispatch app
     --brand-ink     readable text on top of --brand
     --brand-deep    the dark brand tone
     --brand-soft    the pale brand tint (in dark: its dark counterpart)
     --neutral-tint  the hue the greys lean toward. Body text, captions,
                     lines and panels mix from this and never from the
                     brand, so a strong brand colour (an orange, a pink)
                     does not tint the words. A plain grey such as #808080
                     gives neutral greys.

   First Glass, 6 Oct 2026, Jay's ask ("match brand colours"): its own brand
   guide (clients/first-glass/assets/First-Glass-Brand-Guidelines.html,
   section 04 Colour). --brand Glass Blue #1E6FE3 (Primary), --brand-ink white
   (about 4.7:1 on it), --brand-deep Deep Glass Blue #0B2D6B, --brand-soft a
   pale tint of the blue, --neutral-tint plain grey. In dark, --brand is Glass
   Blue lightened a quarter toward white (#5B95EC), so it reads on the dark
   surfaces, with Charcoal #111317 as its ink (about 6:1; Deep Glass Blue
   reads only 4.3:1 there). Until this date the dashboard
   wore the hub's reference green (#06cc5d, greys tinted #5ec43c), which is
   PlainBlack's, not First Glass's.

   Status colours that mean something (the amber "waiting", the blue, green,
   amber and grey "came from" tags, chart series, reds for errors and
   deletions) are fixed below and are NOT brand: leave them alone. The one
   chart colour that is the client's own is --rp-now, the "you" bar in Google
   Ads' market chart and the Website progress bars: it follows --brand. The
   grey bars beside it (--rp-bar) are greys, from --neutral-tint.
   The hub engine notes are in _internal/first-glass/SETUP.md, "Hub engine".
   ========================================================================== */
:root{--brand:#1E6FE3;--brand-ink:#FFFFFF;--brand-deep:#0B2D6B;--brand-soft:#eaf1fc;--neutral-tint:#808080}
:root[data-theme="dark"]{--brand:#5B95EC;--brand-ink:#111317;--brand-deep:#0b1322;--brand-soft:#131c2b;--neutral-tint:#808080}
/* END CLIENT THEME. Nothing below this line changes from client to client. */
/* ==========================================================================
   DERIVED PALETTE (engine). Each colour is a mix of one input and a
   near-neutral base, worked out so the reference client's inputs reproduce its
   approved colours exactly. A client with other inputs gets the same
   lightness and structure in its own hue. The greys (every --n-*, the grey
   text tokens among the --b-*, and --muted, --line and the other grey named
   tokens further down) mix from --neutral-tint only; the brand tints (the
   rest of the --b-*: buttons, the current nav item, chips, links, pressed
   tabs, the What needs you panel, toggles, chart series) mix from --brand.
   The number is the colour's lightness (OKLab, 0 to 100). Worked out on
   1 Oct 2026 against the reference client; the greys moved onto
   --neutral-tint on 2 Oct 2026 with the reference client unchanged.
   Contrast, 2 Oct 2026 (Jay's ruling): every light-mode text token that
   read under 4.5:1 on its own surface was darkened toward black at its own
   mix (so it keeps its hue, and the greys stay on --neutral-tint), and the
   breadcrumb "/" went darker in light (--n-84) and lighter in dark
   (--n-38). The reference client's text moved slightly with it, as
   approved. Second pass, same day: the light pill tints (--b-54, --b-54-3,
   --b-56-3) are solved for the worst case, a white brand, so they read at
   4.5:1 for any brand; --b-61-3, --b-62-3 and --b-62-4 went darker; --b-23
   is --brand-ink, the one pair the inputs promise reads on --brand.
   ========================================================================== */
:root{
  --b-22:color-mix(in srgb,var(--brand) 9.5%,#040f07);
  --b-23:var(--brand-ink);
  --b-25-2:color-mix(in srgb,var(--brand-ink) 91%,#000000);
  --b-27:color-mix(in srgb,var(--brand) 10.1%,#1b1917);
  --b-29:color-mix(in srgb,var(--brand) 10.9%,#201d1b);
  --b-31-2:color-mix(in srgb,var(--brand) 23.6%,#0e0d0d);
  --b-32:color-mix(in srgb,var(--brand) 11.0%,#292725);
  --b-33-2:color-mix(in srgb,var(--brand) 14.4%,#2a241e);
  --b-33-3:color-mix(in srgb,var(--brand) 15.2%,#28211a);
  --b-33-4:color-mix(in srgb,var(--brand) 14.3%,#2a231e);
  --b-33-5:color-mix(in srgb,var(--brand) 13.8%,#2b251c);
  --b-33:color-mix(in srgb,var(--neutral-tint) 12.3%,#1c2a2b);
  --b-36:color-mix(in srgb,var(--brand) 6.3%,#373a30);
  --b-37:#1d4a33;
  --b-39:color-mix(in srgb,var(--brand) 26.0%,#282623);
  --b-41:color-mix(in srgb,var(--brand) 21.6%,#433318);
  --b-43:color-mix(in srgb,var(--neutral-tint) 22.4%,#3a3938);
  --b-46-2:color-mix(in srgb,var(--neutral-tint) 17.8%,#474847);
  --b-46:color-mix(in srgb,var(--neutral-tint) 19.9%,#444742);
  --b-47:color-mix(in srgb,var(--neutral-tint) 18.7%,#4d4a4b);
  --b-48-2:color-mix(in srgb,var(--neutral-tint) 23.9%,#4e4749);
  --b-48-3:color-mix(in srgb,var(--neutral-tint) 20.6%,#4f4a4a);
  --b-48-4:color-mix(in srgb,var(--neutral-tint) 18.7%,#4d4e47);
  --b-48:color-mix(in srgb,var(--brand) 18.8%,#5b5142);
  --b-49-2:color-mix(in srgb,var(--neutral-tint) 21.3%,#504f4e);
  --b-49-3:color-mix(in srgb,var(--neutral-tint) 21.3%,#504e4e);
  --b-49-4:color-mix(in srgb,var(--brand) 24.3%,#5c4c2f);
  --b-49:color-mix(in srgb,var(--neutral-tint) 15.3%,#505557);
  --b-50-2:color-mix(in srgb,var(--neutral-tint) 22.3%,#51504a);
  --b-50-3:color-mix(in srgb,var(--brand) 17.3%,#63593f);
  --b-50-4:color-mix(in srgb,var(--brand) 19.3%,#64553e);
  --b-50-5:color-mix(in srgb,var(--neutral-tint) 25.8%,#4f4c4c);
  --b-50:color-mix(in srgb,var(--neutral-tint) 15.6%,#585856);
  --b-51-2:color-mix(in srgb,var(--brand) 17.1%,#695c46);
  --b-51:color-mix(in srgb,var(--neutral-tint) 18.9%,#545a61);
  --b-52:color-mix(in srgb,var(--brand) 37.2%,#4f463f);
  --b-53-2:color-mix(in srgb,var(--neutral-tint) 22.7%,#5b5a58);
  --b-53:color-mix(in srgb,var(--neutral-tint) 18.2%,#64615e);
  --b-54-2:color-mix(in srgb,var(--neutral-tint) 19.4%,#636261);
  --b-54-3:color-mix(in srgb,var(--brand) 14.7%,#5b5341);
  --b-54-4:color-mix(in srgb,var(--neutral-tint) 20.4%,#676163);
  --b-54-5:color-mix(in srgb,var(--neutral-tint) 18.5%,#64635d);
  --b-54:color-mix(in srgb,var(--brand) 16.2%,#59503c);
  --b-55-2:color-mix(in srgb,var(--neutral-tint) 20.8%,#676362);
  --b-55:color-mix(in srgb,var(--neutral-tint) 23.4%,#626162);
  --b-56-2:color-mix(in srgb,var(--neutral-tint) 25.6%,#6a6663);
  --b-56-3:color-mix(in srgb,var(--brand) 16.0%,#5c4e3a);
  --b-56:color-mix(in srgb,var(--neutral-tint) 17.3%,#615f61);
  --b-58-2:color-mix(in srgb,var(--neutral-tint) 18.1%,#74716e);
  --b-58-3:color-mix(in srgb,var(--neutral-tint) 20.6%,#655e5b);
  --b-58:color-mix(in srgb,var(--neutral-tint) 17.1%,#767371);
  --b-59-2:color-mix(in srgb,var(--neutral-tint) 15.5%,#797676);
  --b-59-3:color-mix(in srgb,var(--neutral-tint) 22.3%,#797372);
  --b-59:color-mix(in srgb,var(--neutral-tint) 19.2%,#787675);
  --b-60-2:color-mix(in srgb,var(--neutral-tint) 19.3%,#787776);
  --b-60-3:color-mix(in srgb,var(--neutral-tint) 11.9%,#6a6966);
  --b-60:color-mix(in srgb,var(--neutral-tint) 19.9%,#7c7979);
  --b-61-2:color-mix(in srgb,var(--neutral-tint) 17.0%,#817d7c);
  --b-61-3:color-mix(in srgb,var(--neutral-tint) 12.8%,#706f6c);
  --b-61-4:color-mix(in srgb,var(--neutral-tint) 18.1%,#807c78);
  --b-61-5:color-mix(in srgb,var(--neutral-tint) 17.2%,#827e7c);
  --b-61:color-mix(in srgb,var(--neutral-tint) 13.4%,#7c8080);
  --b-62-10:color-mix(in srgb,var(--neutral-tint) 19.9%,#827e7d);
  --b-62-11:color-mix(in srgb,var(--brand) 58.1%,#655e58);
  --b-62-2:color-mix(in srgb,var(--neutral-tint) 17.0%,#827e7d);
  --b-62-3:color-mix(in srgb,var(--neutral-tint) 11.6%,#6b6a65);
  --b-62-4:color-mix(in srgb,var(--neutral-tint) 13.5%,#676664);
  --b-62-5:color-mix(in srgb,var(--neutral-tint) 22.3%,#827d7b);
  --b-62-6:color-mix(in srgb,var(--neutral-tint) 20.3%,#85807d);
  --b-62-7:color-mix(in srgb,var(--neutral-tint) 19.9%,#867e7e);
  --b-62-8:color-mix(in srgb,var(--brand) 22.8%,#93825d);
  --b-62-9:color-mix(in srgb,var(--neutral-tint) 13.1%,#706d6b);
  --b-62:color-mix(in srgb,var(--neutral-tint) 13.7%,#83827f);
  --b-63-2:color-mix(in srgb,var(--brand) 28.7%,#998053);
  --b-63-3:color-mix(in srgb,var(--brand) 64.5%,#58595a);
  --b-63:color-mix(in srgb,var(--neutral-tint) 18.6%,#8a8481);
  --b-64-2:color-mix(in srgb,var(--neutral-tint) 20.8%,#8a8584);
  --b-64-3:color-mix(in srgb,var(--neutral-tint) 18.0%,#8a8684);
  --b-64-4:color-mix(in srgb,var(--neutral-tint) 19.0%,#898581);
  --b-64-5:color-mix(in srgb,var(--neutral-tint) 12.3%,#726d6b);
  --b-64-6:color-mix(in srgb,var(--neutral-tint) 14.9%,#6f6c6a);
  --b-64-7:color-mix(in srgb,var(--neutral-tint) 19.2%,#8d8684);
  --b-64-8:color-mix(in srgb,var(--neutral-tint) 20.8%,#8f8684);
  --b-64-9:color-mix(in srgb,var(--neutral-tint) 19.5%,#8d8683);
  --b-64:color-mix(in srgb,var(--neutral-tint) 12.4%,#8d8a86);
  --b-65-2:color-mix(in srgb,var(--neutral-tint) 14.5%,#8e8c89);
  --b-65-3:color-mix(in srgb,var(--neutral-tint) 14.3%,#8f8c8a);
  --b-65-4:color-mix(in srgb,var(--neutral-tint) 16.7%,#8f8989);
  --b-65-5:color-mix(in srgb,var(--neutral-tint) 17.7%,#908b8a);
  --b-65-6:color-mix(in srgb,var(--neutral-tint) 16.5%,#62605d);
  --b-65-7:color-mix(in srgb,var(--neutral-tint) 14.3%,#908d89);
  --b-65:color-mix(in srgb,var(--neutral-tint) 17.3%,#938b8e);
  --b-66-2:color-mix(in srgb,var(--brand) 19.7%,#9f9067);
  --b-66-3:color-mix(in srgb,var(--brand) 18.5%,#9e9077);
  --b-66-4:color-mix(in srgb,var(--neutral-tint) 16.3%,#908d8c);
  --b-66:color-mix(in srgb,var(--brand) 19.9%,#a2906c);
  --b-67-2:color-mix(in srgb,var(--neutral-tint) 13.8%,#716c6d);
  --b-67:color-mix(in srgb,var(--brand) 19.8%,#a89571);
  --b-68:color-mix(in srgb,var(--brand) 17.4%,#a8987f);
  --b-74-2:var(--brand);
  --b-74-a12:color-mix(in srgb,var(--brand) 12.1569%,transparent);
  --b-74-a20:color-mix(in srgb,var(--brand) 20%,transparent);
  --b-74-a33:color-mix(in srgb,var(--brand) 33.3333%,transparent);
  --b-74-a40:color-mix(in srgb,var(--brand) 40%,transparent);
  --b-74:var(--brand);
  --b-75:color-mix(in srgb,var(--neutral-tint) 16.4%,#b4b2b0);
  --b-78-2:color-mix(in srgb,var(--brand) 15.7%,#ccbaa4);
  --b-78:color-mix(in srgb,var(--neutral-tint) 16.6%,#bebdbb);
  --b-82-2:color-mix(in srgb,var(--neutral-tint) 22.6%,#d1ccca);
  --b-82:color-mix(in srgb,var(--brand) 57.9%,#fffee4);
  --b-83:color-mix(in srgb,var(--brand) 15.7%,#dfcdb6);
  --b-85:color-mix(in srgb,var(--neutral-tint) 16.1%,#d9d7d2);
  --b-89:color-mix(in srgb,var(--neutral-tint) 15.1%,#e9e4e2);
  --b-90:color-mix(in srgb,var(--brand) 11.1%,#f2e6dc);
  --b-93:color-mix(in srgb,var(--brand) 11.1%,#faf1dc);
  --b-95:color-mix(in srgb,var(--brand) 7.7%,#e5ffeb);
  --n-13:color-mix(in srgb,var(--neutral-tint) 2.1%,#030405);
  --n-14:#060a08;
  --n-15:color-mix(in srgb,var(--neutral-tint) 2.2%,#070709);
  --n-19-2:color-mix(in srgb,var(--neutral-tint) 2.7%,#0d1111);
  --n-20-3:color-mix(in srgb,var(--neutral-tint) 5.0%,#0d1012);
  --n-22-3:color-mix(in srgb,var(--neutral-tint) 5.1%,#101315);
  --n-24:color-mix(in srgb,var(--neutral-tint) 7.9%,#111518);
  --n-25-2:color-mix(in srgb,var(--neutral-tint) 4.1%,#191e1f);
  --n-25-5:color-mix(in srgb,var(--neutral-tint) 5.8%,#161a1c);
  --n-25:color-mix(in srgb,var(--neutral-tint) 3.0%,#171e1e);
  --n-27-2:color-mix(in srgb,var(--neutral-tint) 7.2%,#181e20);
  --n-28-2:color-mix(in srgb,var(--neutral-tint) 4.9%,#212425);
  --n-28:color-mix(in srgb,var(--neutral-tint) 9.6%,#161c1d);
  --n-31-3:color-mix(in srgb,var(--neutral-tint) 5.8%,#272a2c);
  --n-31:color-mix(in srgb,var(--neutral-tint) 7.1%,#25292d);
  --n-32:color-mix(in srgb,var(--neutral-tint) 7.2%,#262a2f);
  --n-33:color-mix(in srgb,var(--neutral-tint) 8.0%,#2c2c31);
  --n-34-2:color-mix(in srgb,var(--neutral-tint) 9.3%,#292e30);
  --n-34:color-mix(in srgb,var(--neutral-tint) 8.1%,#2c2e32);
  --n-37:color-mix(in srgb,var(--neutral-tint) 7.2%,#34393b);
  --n-38-2:color-mix(in srgb,var(--neutral-tint) 7.9%,#373b3e);
  --n-42:color-mix(in srgb,var(--neutral-tint) 7.3%,#44474b);
  --n-45:color-mix(in srgb,var(--neutral-tint) 5.2%,#4c5453);
  --n-46:color-mix(in srgb,var(--neutral-tint) 9.5%,#4a5252);
  --n-48:color-mix(in srgb,var(--neutral-tint) 9.2%,#55585d);
  --n-50:color-mix(in srgb,var(--neutral-tint) 5.9%,#5b6061);
  --n-57-2:color-mix(in srgb,var(--neutral-tint) 6.5%,#707677);
  --n-59-2:color-mix(in srgb,var(--neutral-tint) 7.9%,#787a7c);
  --n-59-3:color-mix(in srgb,var(--neutral-tint) 7.4%,#6e7174);
  --n-59-4:color-mix(in srgb,var(--neutral-tint) 11.1%,#706f6e);
  --n-59:color-mix(in srgb,var(--neutral-tint) 4.4%,#767e7c);
  --n-62:color-mix(in srgb,var(--neutral-tint) 8.0%,#6e7073);
  --n-64-2:color-mix(in srgb,var(--neutral-tint) 8.8%,#72706f);
  --n-64:color-mix(in srgb,var(--neutral-tint) 7.3%,#858c8d);
  --n-65-2:color-mix(in srgb,var(--neutral-tint) 5.6%,#6c6d70);
  --n-65:color-mix(in srgb,var(--neutral-tint) 4.9%,#727275);
  --n-66-2:color-mix(in srgb,var(--neutral-tint) 8.0%,#8f9192);
  --n-66-3:color-mix(in srgb,var(--neutral-tint) 9.1%,#6c6b6a);
  --n-66-4:color-mix(in srgb,var(--neutral-tint) 7.9%,#8f9396);
  --n-66:color-mix(in srgb,var(--neutral-tint) 8.1%,#8e9192);
  --n-68-2:color-mix(in srgb,var(--neutral-tint) 9.6%,#726f6f);
  --n-68:color-mix(in srgb,var(--neutral-tint) 9.3%,#93989c);
  --n-69-2:color-mix(in srgb,var(--neutral-tint) 10.2%,#999ca0);
  --n-69:color-mix(in srgb,var(--neutral-tint) 12.6%,#9d9b9b);
  --n-70:color-mix(in srgb,var(--neutral-tint) 10.0%,#999ea2);
  --n-71-2:color-mix(in srgb,var(--neutral-tint) 9.2%,#a0a3a7);
  --n-71:color-mix(in srgb,var(--neutral-tint) 9.4%,#9ca3a5);
  --n-72:color-mix(in srgb,var(--neutral-tint) 10.6%,#a1a8ac);
  --n-75:color-mix(in srgb,var(--neutral-tint) 5.1%,#adb1b2);
  --n-77:color-mix(in srgb,var(--neutral-tint) 8.1%,#b3b7b9);
  --n-80:color-mix(in srgb,var(--neutral-tint) 11.6%,#bdc4c7);
  --n-84:color-mix(in srgb,var(--neutral-tint) 1.2%,#727473);
  --n-86:color-mix(in srgb,var(--neutral-tint) 6.0%,#d0d4d5);
  --n-89:color-mix(in srgb,var(--neutral-tint) 7.1%,#dfe1e4);
  --n-90:color-mix(in srgb,var(--neutral-tint) 3.7%,#e0e1e2);
  --n-91-2:color-mix(in srgb,var(--neutral-tint) 11.2%,#ece8e6);
  --n-91-3:color-mix(in srgb,var(--neutral-tint) 13.4%,#ece9e8);
  --n-91-4:color-mix(in srgb,var(--neutral-tint) 10.6%,#ebe8e7);
  --n-91:color-mix(in srgb,var(--neutral-tint) 8.8%,#e8e7e5);
  --n-92-10:color-mix(in srgb,var(--neutral-tint) 10.4%,#eeeae9);
  --n-92-11:color-mix(in srgb,var(--neutral-tint) 11.9%,#f4eeed);
  --n-92-2:color-mix(in srgb,var(--neutral-tint) 7.9%,#e7ebed);
  --n-92-3:color-mix(in srgb,var(--neutral-tint) 5.9%,#e7e7e7);
  --n-92-4:color-mix(in srgb,var(--neutral-tint) 9.6%,#eeeded);
  --n-92-5:color-mix(in srgb,var(--neutral-tint) 10.2%,#e9ecee);
  --n-92-6:color-mix(in srgb,var(--neutral-tint) 9.7%,#efeceb);
  --n-92-7:color-mix(in srgb,var(--neutral-tint) 10.4%,#eeeaea);
  --n-92-8:color-mix(in srgb,var(--neutral-tint) 10.4%,#efece9);
  --n-92-9:color-mix(in srgb,var(--neutral-tint) 14.1%,#f2efee);
  --n-92:color-mix(in srgb,var(--neutral-tint) 10.1%,#eaedef);
  --n-93-2:color-mix(in srgb,var(--neutral-tint) 9.1%,#efeeee);
  --n-93-3:color-mix(in srgb,var(--neutral-tint) 7.0%,#edece9);
  --n-93-4:color-mix(in srgb,var(--neutral-tint) 7.5%,#efeceb);
  --n-93-5:color-mix(in srgb,var(--neutral-tint) 9.4%,#f4f0f0);
  --n-93-6:color-mix(in srgb,var(--neutral-tint) 7.4%,#f1eeec);
  --n-93-7:color-mix(in srgb,var(--neutral-tint) 5.6%,#edebeb);
  --n-93-9:color-mix(in srgb,var(--neutral-tint) 2.9%,#e7e9e8);
  --n-94-2:color-mix(in srgb,var(--neutral-tint) 2.8%,#ededed);
  --n-94-3:color-mix(in srgb,var(--neutral-tint) 6.7%,#f1f0f2);
  --n-94-4:color-mix(in srgb,var(--neutral-tint) 6.7%,#f2f1ef);
  --n-94:color-mix(in srgb,var(--neutral-tint) 4.9%,#eef0f2);
  --n-95-2:color-mix(in srgb,var(--neutral-tint) 6.0%,#f6f3f4);
  --n-95-3:color-mix(in srgb,var(--neutral-tint) 8.0%,#f6f6f6);
  --n-95-4:color-mix(in srgb,var(--neutral-tint) 6.0%,#f6f4f3);
  --n-95-5:color-mix(in srgb,var(--neutral-tint) 6.5%,#f5f5f3);
  --n-95:color-mix(in srgb,var(--neutral-tint) 6.0%,#f6f3f5);
  --n-96-2:color-mix(in srgb,var(--neutral-tint) 8.9%,#fbfbfc);
  --n-96-3:color-mix(in srgb,var(--neutral-tint) 5.8%,#faf8f8);
  --n-96-4:color-mix(in srgb,var(--neutral-tint) 9.5%,#fbf8fa);
  --n-96-5:color-mix(in srgb,var(--neutral-tint) 8.9%,#fdfafa);
  --n-96-6:color-mix(in srgb,var(--neutral-tint) 5.8%,#faf8f7);
  --n-96-7:color-mix(in srgb,var(--neutral-tint) 9.5%,#fcfaf9);
  --n-96-8:color-mix(in srgb,var(--neutral-tint) 7.5%,#fdf9f9);
  --n-96-9:color-mix(in srgb,var(--neutral-tint) 2.1%,#f1f4f3);
  --n-97-2:color-mix(in srgb,var(--neutral-tint) 7.2%,#f9fbfc);
  --n-97-3:color-mix(in srgb,var(--neutral-tint) 3.8%,#f9f8f7);
  --n-97-4:color-mix(in srgb,var(--neutral-tint) 5.7%,#fefbfb);
  --n-97-5:color-mix(in srgb,var(--neutral-tint) 5.8%,#fbf9f7);
  --n-97-6:color-mix(in srgb,var(--neutral-tint) 5.8%,#fbf9f8);
  --n-97-7:color-mix(in srgb,var(--neutral-tint) 5.7%,#fdfafa);
  --n-97-8:color-mix(in srgb,var(--neutral-tint) 5.7%,#fefbfa);
  --n-97:color-mix(in srgb,var(--neutral-tint) 2.1%,#f5f6f6);
  --n-98-2:color-mix(in srgb,var(--neutral-tint) 2.0%,#faf9fa);
  --n-98-3:color-mix(in srgb,var(--neutral-tint) 3.7%,#fefcfc);
  --n-98-4:color-mix(in srgb,var(--neutral-tint) 3.7%,#fcfafa);
  --n-98-5:color-mix(in srgb,var(--neutral-tint) 3.8%,#fcfaf9);
  --n-98-6:color-mix(in srgb,var(--neutral-tint) 3.7%,#fefcfb);
  --n-98:color-mix(in srgb,var(--neutral-tint) 3.7%,#fcfafc)
}
:root[data-theme="dark"]{
  --b-22:color-mix(in srgb,var(--brand) 9.5%,#040f07);
  --b-23:var(--brand-ink);
  --b-25-2:var(--brand-ink);
  --b-27:color-mix(in srgb,var(--brand) 10.1%,#1b1917);
  --b-29:color-mix(in srgb,var(--brand) 10.9%,#201d1b);
  --b-31:color-mix(in srgb,var(--brand) 13.9%,#221e1d);
  --b-31-2:color-mix(in srgb,var(--brand) 23.6%,#0e0d0d);
  --b-32:color-mix(in srgb,var(--brand) 11.0%,#292725);
  --b-33:color-mix(in srgb,var(--neutral-tint) 12.3%,#1c2a2b);
  --b-33-2:color-mix(in srgb,var(--brand) 14.4%,#2a241e);
  --b-33-3:color-mix(in srgb,var(--brand) 15.2%,#28211a);
  --b-33-4:color-mix(in srgb,var(--brand) 14.3%,#2a231e);
  --b-33-5:color-mix(in srgb,var(--brand) 13.8%,#2b251c);
  --b-34:color-mix(in srgb,var(--brand) 16.7%,#2a2421);
  --b-36:color-mix(in srgb,var(--brand) 6.3%,#373a30);
  --b-37:#1d4a33;
  --b-39:color-mix(in srgb,var(--brand) 26.0%,#282623);
  --b-41:color-mix(in srgb,var(--brand) 21.6%,#433318);
  --b-43:color-mix(in srgb,var(--neutral-tint) 22.4%,#3a3938);
  --b-46:color-mix(in srgb,var(--neutral-tint) 19.9%,#444742);
  --b-46-2:color-mix(in srgb,var(--neutral-tint) 17.8%,#474847);
  --b-47:color-mix(in srgb,var(--neutral-tint) 18.7%,#4d4a4b);
  --b-48:color-mix(in srgb,var(--brand) 18.8%,#5b5142);
  --b-48-2:color-mix(in srgb,var(--neutral-tint) 23.9%,#4e4749);
  --b-48-3:color-mix(in srgb,var(--neutral-tint) 20.6%,#4f4a4a);
  --b-48-4:color-mix(in srgb,var(--neutral-tint) 18.7%,#4d4e47);
  --b-49:color-mix(in srgb,var(--neutral-tint) 15.3%,#505557);
  --b-49-2:color-mix(in srgb,var(--neutral-tint) 21.3%,#504f4e);
  --b-49-3:color-mix(in srgb,var(--neutral-tint) 21.3%,#504e4e);
  --b-49-4:color-mix(in srgb,var(--brand) 24.3%,#5c4c2f);
  --b-50:color-mix(in srgb,var(--neutral-tint) 15.6%,#585856);
  --b-50-2:color-mix(in srgb,var(--neutral-tint) 22.3%,#51504a);
  --b-50-3:color-mix(in srgb,var(--brand) 17.3%,#63593f);
  --b-50-4:color-mix(in srgb,var(--brand) 19.3%,#64553e);
  --b-50-5:color-mix(in srgb,var(--neutral-tint) 25.8%,#4f4c4c);
  --b-51:color-mix(in srgb,var(--neutral-tint) 18.9%,#545a61);
  --b-51-2:color-mix(in srgb,var(--brand) 17.1%,#695c46);
  --b-52:color-mix(in srgb,var(--brand) 37.2%,#4f463f);
  --b-53:color-mix(in srgb,var(--neutral-tint) 18.2%,#64615e);
  --b-53-2:color-mix(in srgb,var(--neutral-tint) 23.2%,#5e5d5b);
  --b-54:color-mix(in srgb,var(--brand) 19.8%,#71664d);
  --b-54-2:color-mix(in srgb,var(--neutral-tint) 19.4%,#636261);
  --b-54-3:color-mix(in srgb,var(--brand) 17.7%,#726751);
  --b-54-4:color-mix(in srgb,var(--neutral-tint) 20.4%,#676163);
  --b-54-5:color-mix(in srgb,var(--neutral-tint) 18.5%,#64635d);
  --b-55:color-mix(in srgb,var(--neutral-tint) 23.4%,#626162);
  --b-55-2:color-mix(in srgb,var(--neutral-tint) 20.8%,#676362);
  --b-56:color-mix(in srgb,var(--neutral-tint) 19.0%,#6d6a6c);
  --b-56-2:color-mix(in srgb,var(--neutral-tint) 25.6%,#6a6663);
  --b-56-3:color-mix(in srgb,var(--brand) 20.4%,#7c694e);
  --b-58:color-mix(in srgb,var(--neutral-tint) 17.1%,#767371);
  --b-58-2:color-mix(in srgb,var(--neutral-tint) 18.1%,#74716e);
  --b-58-3:color-mix(in srgb,var(--neutral-tint) 22.9%,#736c68);
  --b-59:color-mix(in srgb,var(--neutral-tint) 19.2%,#787675);
  --b-59-2:color-mix(in srgb,var(--neutral-tint) 15.5%,#797676);
  --b-59-3:color-mix(in srgb,var(--neutral-tint) 22.3%,#797372);
  --b-60:color-mix(in srgb,var(--neutral-tint) 19.9%,#7c7979);
  --b-60-2:color-mix(in srgb,var(--neutral-tint) 19.3%,#787776);
  --b-60-3:color-mix(in srgb,var(--neutral-tint) 13.6%,#7b7a77);
  --b-61:color-mix(in srgb,var(--neutral-tint) 13.4%,#7c8080);
  --b-61-2:color-mix(in srgb,var(--neutral-tint) 17.0%,#817d7c);
  --b-61-3:color-mix(in srgb,var(--neutral-tint) 14.3%,#807e7b);
  --b-61-4:color-mix(in srgb,var(--neutral-tint) 18.1%,#807c78);
  --b-61-5:color-mix(in srgb,var(--neutral-tint) 17.2%,#827e7c);
  --b-62:color-mix(in srgb,var(--neutral-tint) 13.7%,#83827f);
  --b-62-10:color-mix(in srgb,var(--neutral-tint) 19.9%,#827e7d);
  --b-62-11:color-mix(in srgb,var(--brand) 58.1%,#655e58);
  --b-62-2:color-mix(in srgb,var(--neutral-tint) 17.0%,#827e7d);
  --b-62-3:color-mix(in srgb,var(--neutral-tint) 13.8%,#83827c);
  --b-62-4:color-mix(in srgb,var(--neutral-tint) 16.5%,#83817f);
  --b-62-5:color-mix(in srgb,var(--neutral-tint) 22.3%,#827d7b);
  --b-62-6:color-mix(in srgb,var(--neutral-tint) 20.3%,#85807d);
  --b-62-7:color-mix(in srgb,var(--neutral-tint) 19.9%,#867e7e);
  --b-62-8:color-mix(in srgb,var(--brand) 22.8%,#93825d);
  --b-62-9:color-mix(in srgb,var(--neutral-tint) 15.2%,#85827f);
  --b-63:color-mix(in srgb,var(--neutral-tint) 18.6%,#8a8481);
  --b-63-2:color-mix(in srgb,var(--brand) 28.7%,#998053);
  --b-63-3:color-mix(in srgb,var(--brand) 64.5%,#58595a);
  --b-64:color-mix(in srgb,var(--neutral-tint) 12.4%,#8d8a86);
  --b-64-2:color-mix(in srgb,var(--neutral-tint) 20.8%,#8a8584);
  --b-64-3:color-mix(in srgb,var(--neutral-tint) 18.0%,#8a8684);
  --b-64-4:color-mix(in srgb,var(--neutral-tint) 19.0%,#898581);
  --b-64-5:color-mix(in srgb,var(--neutral-tint) 14.9%,#8e8886);
  --b-64-6:color-mix(in srgb,var(--neutral-tint) 18.0%,#8b8785);
  --b-64-7:color-mix(in srgb,var(--neutral-tint) 19.2%,#8d8684);
  --b-64-8:color-mix(in srgb,var(--neutral-tint) 20.8%,#8f8684);
  --b-64-9:color-mix(in srgb,var(--neutral-tint) 19.5%,#8d8683);
  --b-65:color-mix(in srgb,var(--neutral-tint) 17.3%,#938b8e);
  --b-65-2:color-mix(in srgb,var(--neutral-tint) 14.5%,#8e8c89);
  --b-65-3:color-mix(in srgb,var(--neutral-tint) 14.3%,#8f8c8a);
  --b-65-4:color-mix(in srgb,var(--neutral-tint) 16.7%,#8f8989);
  --b-65-5:color-mix(in srgb,var(--neutral-tint) 17.7%,#908b8a);
  --b-65-6:color-mix(in srgb,var(--neutral-tint) 22.0%,#8b8885);
  --b-65-7:color-mix(in srgb,var(--neutral-tint) 14.3%,#908d89);
  --b-66:color-mix(in srgb,var(--brand) 19.9%,#a2906c);
  --b-66-2:color-mix(in srgb,var(--brand) 19.7%,#9f9067);
  --b-66-3:color-mix(in srgb,var(--brand) 18.5%,#9e9077);
  --b-66-4:color-mix(in srgb,var(--neutral-tint) 16.3%,#908d8c);
  --b-67:color-mix(in srgb,var(--brand) 19.8%,#a89571);
  --b-67-2:color-mix(in srgb,var(--neutral-tint) 17.6%,#969091);
  --b-68:color-mix(in srgb,var(--brand) 17.4%,#a8987f);
  --b-70:color-mix(in srgb,var(--neutral-tint) 20.9%,#9c9ea1);
  --b-70-2:color-mix(in srgb,var(--neutral-tint) 15.7%,#979fa2);
  --b-71:color-mix(in srgb,var(--neutral-tint) 12.8%,#9ba4a3);
  --b-71-2:color-mix(in srgb,var(--neutral-tint) 17.1%,#9fa2a5);
  --b-74:var(--brand);
  --b-74-2:var(--brand);
  --b-74-a12:color-mix(in srgb,var(--brand) 12.1569%,transparent);
  --b-74-a20:color-mix(in srgb,var(--brand) 20%,transparent);
  --b-74-a33:color-mix(in srgb,var(--brand) 33.3333%,transparent);
  --b-74-a40:color-mix(in srgb,var(--brand) 40%,transparent);
  --b-75:color-mix(in srgb,var(--neutral-tint) 16.4%,#b4b2b0);
  --b-76:color-mix(in srgb,var(--neutral-tint) 22.2%,#afb6b5);
  --b-77:color-mix(in srgb,var(--neutral-tint) 14.6%,#b6b7b8);
  --b-78:color-mix(in srgb,var(--neutral-tint) 16.6%,#bebdbb);
  --b-78-2:color-mix(in srgb,var(--brand) 15.7%,#ccbaa4);
  --b-79:color-mix(in srgb,var(--neutral-tint) 29.2%,#c1c7c9);
  --b-80:color-mix(in srgb,var(--brand) 22.9%,#d8c8b4);
  --b-82:color-mix(in srgb,var(--brand) 57.9%,#fffee4);
  --b-82-2:color-mix(in srgb,var(--neutral-tint) 22.6%,#d1ccca);
  --b-82-3:color-mix(in srgb,var(--brand) 14.3%,#d2cbbe);
  --b-82-4:color-mix(in srgb,var(--brand) 40.5%,#ece2d6);
  --b-83:color-mix(in srgb,var(--brand) 15.7%,#dfcdb6);
  --b-84:color-mix(in srgb,var(--brand) 25.7%,#e0dcd2);
  --b-85:color-mix(in srgb,var(--neutral-tint) 16.1%,#d9d7d2);
  --b-85-2:color-mix(in srgb,var(--neutral-tint) 13.7%,#d2d4d4);
  --b-87:color-mix(in srgb,var(--brand) 25.5%,#eee7de);
  --b-89:color-mix(in srgb,var(--neutral-tint) 15.1%,#e9e4e2);
  --b-90:color-mix(in srgb,var(--brand) 11.1%,#f2e6dc);
  --b-91:color-mix(in srgb,var(--brand) 18.1%,#f9f2ed);
  --b-93:color-mix(in srgb,var(--brand) 11.1%,#faf1dc);
  --b-95:color-mix(in srgb,var(--brand) 7.7%,#e5ffeb);
  --n-13:color-mix(in srgb,var(--neutral-tint) 2.1%,#030405);
  --n-14:#060a08;
  --n-15:color-mix(in srgb,var(--neutral-tint) 2.2%,#070709);
  --n-19:color-mix(in srgb,var(--neutral-tint) 2.7%,#101112);
  --n-19-2:color-mix(in srgb,var(--neutral-tint) 2.7%,#0d1111);
  --n-20-2:color-mix(in srgb,var(--neutral-tint) 2.8%,#111314);
  --n-20-3:color-mix(in srgb,var(--neutral-tint) 5.0%,#0d1012);
  --n-21-2:color-mix(in srgb,var(--neutral-tint) 2.8%,#121515);
  --n-22:color-mix(in srgb,var(--neutral-tint) 2.9%,#151818);
  --n-22-3:color-mix(in srgb,var(--neutral-tint) 5.1%,#101315);
  --n-23-2:color-mix(in srgb,var(--neutral-tint) 2.9%,#181a1b);
  --n-24:color-mix(in srgb,var(--neutral-tint) 8.0%,#111518);
  --n-25:color-mix(in srgb,var(--neutral-tint) 3.0%,#171e1e);
  --n-25-2:color-mix(in srgb,var(--neutral-tint) 4.1%,#191e1f);
  --n-25-3:color-mix(in srgb,var(--neutral-tint) 5.9%,#181a1d);
  --n-25-4:color-mix(in srgb,var(--neutral-tint) 6.5%,#131a1b);
  --n-25-5:color-mix(in srgb,var(--neutral-tint) 5.8%,#161a1c);
  --n-26:color-mix(in srgb,var(--brand) 9.9%,#1a1616);
  --n-27-2:color-mix(in srgb,var(--neutral-tint) 7.2%,#181e20);
  --n-28:color-mix(in srgb,var(--neutral-tint) 9.6%,#161c1d);
  --n-28-2:color-mix(in srgb,var(--neutral-tint) 4.9%,#212425);
  --n-30:color-mix(in srgb,var(--neutral-tint) 5.2%,#222829);
  --n-31:color-mix(in srgb,var(--neutral-tint) 7.1%,#25292d);
  --n-31-3:color-mix(in srgb,var(--neutral-tint) 5.8%,#272a2c);
  --n-32:color-mix(in srgb,var(--neutral-tint) 7.2%,#262a2f);
  --n-33:color-mix(in srgb,var(--neutral-tint) 8.0%,#2c2c31);
  --n-34:color-mix(in srgb,var(--neutral-tint) 8.1%,#2c2e32);
  --n-34-2:color-mix(in srgb,var(--neutral-tint) 9.4%,#292e30);
  --n-37:color-mix(in srgb,var(--neutral-tint) 7.1%,#34393b);
  --n-38:color-mix(in srgb,var(--neutral-tint) 3.9%,#7c7e7f);
  --n-38-2:color-mix(in srgb,var(--neutral-tint) 7.4%,#373c3e);
  --n-42:color-mix(in srgb,var(--neutral-tint) 7.3%,#44474b);
  --n-45:color-mix(in srgb,var(--neutral-tint) 5.2%,#4c5453);
  --n-46:color-mix(in srgb,var(--neutral-tint) 9.5%,#4a5252);
  --n-48:color-mix(in srgb,var(--neutral-tint) 9.1%,#55585d);
  --n-50:color-mix(in srgb,var(--neutral-tint) 5.9%,#5b6061);
  --n-57-2:color-mix(in srgb,var(--neutral-tint) 6.5%,#707677);
  --n-59:color-mix(in srgb,var(--neutral-tint) 4.4%,#767e7c);
  --n-59-2:color-mix(in srgb,var(--neutral-tint) 8.1%,#787a7c);
  --n-59-3:color-mix(in srgb,var(--neutral-tint) 7.9%,#767a7d);
  --n-59-4:color-mix(in srgb,var(--neutral-tint) 11.8%,#787776);
  --n-62:color-mix(in srgb,var(--neutral-tint) 9.3%,#808386);
  --n-62-2:color-mix(in srgb,var(--neutral-tint) 9.3%,#808487);
  --n-64:color-mix(in srgb,var(--neutral-tint) 7.3%,#858c8d);
  --n-64-2:color-mix(in srgb,var(--neutral-tint) 10.6%,#8c8a89);
  --n-65:color-mix(in srgb,var(--neutral-tint) 5.9%,#8e8f92);
  --n-65-2:color-mix(in srgb,var(--neutral-tint) 7.1%,#8b8d90);
  --n-66:color-mix(in srgb,var(--neutral-tint) 8.1%,#8e9192);
  --n-66-2:color-mix(in srgb,var(--neutral-tint) 8.2%,#8f9192);
  --n-66-3:color-mix(in srgb,var(--neutral-tint) 11.9%,#92918f);
  --n-66-4:color-mix(in srgb,var(--neutral-tint) 7.9%,#8f9396);
  --n-68:color-mix(in srgb,var(--neutral-tint) 9.3%,#93989c);
  --n-68-2:color-mix(in srgb,var(--neutral-tint) 12.4%,#989594);
  --n-69:color-mix(in srgb,var(--neutral-tint) 12.6%,#9d9b9b);
  --n-69-2:color-mix(in srgb,var(--neutral-tint) 10.2%,#999ca0);
  --n-70:color-mix(in srgb,var(--neutral-tint) 10.0%,#999ea2);
  --n-71:color-mix(in srgb,var(--neutral-tint) 9.4%,#9ca3a5);
  --n-71-2:color-mix(in srgb,var(--neutral-tint) 9.2%,#a0a3a7);
  --n-72:color-mix(in srgb,var(--neutral-tint) 10.6%,#a1a8ac);
  --n-75:color-mix(in srgb,var(--neutral-tint) 5.1%,#adb1b2);
  --n-77:color-mix(in srgb,var(--neutral-tint) 8.1%,#b3b7b9);
  --n-80:color-mix(in srgb,var(--neutral-tint) 11.6%,#bdc4c7);
  --n-80-2:color-mix(in srgb,var(--neutral-tint) 4.5%,#b9c0bd);
  --n-84:color-mix(in srgb,var(--neutral-tint) 2.0%,#c8ccca);
  --n-86:color-mix(in srgb,var(--neutral-tint) 6.0%,#d0d4d5);
  --n-88:color-mix(in srgb,var(--neutral-tint) 10.9%,#e0dfe1);
  --n-89:color-mix(in srgb,var(--neutral-tint) 7.1%,#dfe1e4);
  --n-90:color-mix(in srgb,var(--neutral-tint) 3.7%,#e0e1e2);
  --n-91:color-mix(in srgb,var(--neutral-tint) 8.8%,#e8e7e5);
  --n-91-2:color-mix(in srgb,var(--neutral-tint) 11.2%,#ece8e6);
  --n-91-3:color-mix(in srgb,var(--neutral-tint) 13.4%,#ece9e8);
  --n-91-4:color-mix(in srgb,var(--neutral-tint) 10.6%,#ebe8e7);
  --n-92:color-mix(in srgb,var(--neutral-tint) 10.1%,#eaedef);
  --n-92-10:color-mix(in srgb,var(--neutral-tint) 10.4%,#eeeae9);
  --n-92-11:color-mix(in srgb,var(--neutral-tint) 11.9%,#f4eeed);
  --n-92-2:color-mix(in srgb,var(--neutral-tint) 7.9%,#e7ebed);
  --n-92-3:color-mix(in srgb,var(--neutral-tint) 5.8%,#e7e7e7);
  --n-92-4:color-mix(in srgb,var(--neutral-tint) 9.6%,#eeeded);
  --n-92-5:color-mix(in srgb,var(--neutral-tint) 10.2%,#e9ecee);
  --n-92-6:color-mix(in srgb,var(--neutral-tint) 9.7%,#efeceb);
  --n-92-7:color-mix(in srgb,var(--neutral-tint) 10.4%,#eeeaea);
  --n-92-8:color-mix(in srgb,var(--neutral-tint) 10.4%,#efece9);
  --n-92-9:color-mix(in srgb,var(--neutral-tint) 14.1%,#f2efee);
  --n-93-2:color-mix(in srgb,var(--neutral-tint) 9.1%,#efeeee);
  --n-93-3:color-mix(in srgb,var(--neutral-tint) 7.0%,#edece9);
  --n-93-4:color-mix(in srgb,var(--neutral-tint) 7.5%,#efeceb);
  --n-93-5:color-mix(in srgb,var(--neutral-tint) 9.4%,#f4f0f0);
  --n-93-6:color-mix(in srgb,var(--neutral-tint) 7.4%,#f1eeec);
  --n-93-7:color-mix(in srgb,var(--neutral-tint) 5.6%,#edebeb);
  --n-93-8:color-mix(in srgb,var(--neutral-tint) 5.0%,#ebecee);
  --n-93-9:color-mix(in srgb,var(--neutral-tint) 2.9%,#e7e9e8);
  --n-94:color-mix(in srgb,var(--neutral-tint) 4.9%,#eef0f2);
  --n-94-2:color-mix(in srgb,var(--neutral-tint) 2.8%,#ededed);
  --n-94-3:color-mix(in srgb,var(--neutral-tint) 6.7%,#f1f0f2);
  --n-94-4:color-mix(in srgb,var(--neutral-tint) 6.7%,#f2f1ef);
  --n-94-5:color-mix(in srgb,var(--neutral-tint) 2.9%,#ebeded);
  --n-95:color-mix(in srgb,var(--neutral-tint) 6.0%,#f6f3f5);
  --n-95-2:color-mix(in srgb,var(--neutral-tint) 6.0%,#f6f3f4);
  --n-95-3:color-mix(in srgb,var(--neutral-tint) 8.0%,#f6f6f6);
  --n-95-4:color-mix(in srgb,var(--neutral-tint) 6.0%,#f6f4f3);
  --n-95-5:color-mix(in srgb,var(--neutral-tint) 6.5%,#f5f5f3);
  --n-96-2:color-mix(in srgb,var(--neutral-tint) 8.9%,#fbfbfc);
  --n-96-3:color-mix(in srgb,var(--neutral-tint) 5.8%,#faf8f8);
  --n-96-4:color-mix(in srgb,var(--neutral-tint) 9.5%,#fbf8fa);
  --n-96-5:color-mix(in srgb,var(--neutral-tint) 8.9%,#fdfafa);
  --n-96-6:color-mix(in srgb,var(--neutral-tint) 5.8%,#faf8f7);
  --n-96-7:color-mix(in srgb,var(--neutral-tint) 9.5%,#fcfaf9);
  --n-96-8:color-mix(in srgb,var(--neutral-tint) 7.5%,#fdf9f9);
  --n-96-9:color-mix(in srgb,var(--neutral-tint) 2.1%,#f1f4f3);
  --n-97:color-mix(in srgb,var(--neutral-tint) 2.1%,#f5f6f6);
  --n-97-2:color-mix(in srgb,var(--neutral-tint) 7.2%,#f9fbfc);
  --n-97-3:color-mix(in srgb,var(--neutral-tint) 3.8%,#f9f8f7);
  --n-97-4:color-mix(in srgb,var(--neutral-tint) 5.7%,#fefbfb);
  --n-97-5:color-mix(in srgb,var(--neutral-tint) 5.8%,#fbf9f7);
  --n-97-6:color-mix(in srgb,var(--neutral-tint) 5.8%,#fbf9f8);
  --n-97-7:color-mix(in srgb,var(--neutral-tint) 5.7%,#fdfafa);
  --n-97-8:color-mix(in srgb,var(--neutral-tint) 5.7%,#fefbfa);
  --n-98:color-mix(in srgb,var(--neutral-tint) 10.2%,#aea6b3);
  --n-98-2:color-mix(in srgb,var(--neutral-tint) 2.0%,#faf9fa);
  --n-98-3:#f8faf5;
  --n-98-4:color-mix(in srgb,var(--neutral-tint) 3.7%,#fcfafa);
  --n-98-5:color-mix(in srgb,var(--neutral-tint) 3.7%,#fcfaf9);
  --n-98-6:#f8faf4
}
/* FIXED colours: status, charts, third-party UI (WhatsApp), white, black,
   shadows and overlays. The same for every client and both themes. Two more
   are fixed where they sit in the palette above: --b-37 and --n-14, the
   Dispatch demo's phone screen, because a gradient drawn from mixed colours
   renders a level off the approved one. */
:root{
  --n-100:#fcfff8;
  --s-amber-30:#3a2c12;
  --s-amber-47:#7a5000;
  --s-amber-59:#b46a00;
  --s-amber-65:#b9804f;
  --s-amber-72:#d49a1c;
  --s-amber-84:#f0c574;
  --s-amber-96:#fdf1dc;
  --s-amber-98:#fff8d6;
  --s-black-a18:#0000002e;
  --s-black-a20:#00000033;
  --s-black-a27:#00000044;
  --s-black-a30:#0000004c;
  --s-black-a53:#00000088;
  --s-black-a55:#0000008c;
  --s-black-a60:#00000099;
  --s-black-a67:#000000aa;
  --s-black-a80:#000000cc;
  --s-black-a86:#000000db;
  --s-black-a8:#00000014;
  --s-black:#000000;
  --s-blue-21-a0:#0a173300;
  --s-blue-21-a26:#0a173342;
  --s-blue-21-a35:#0a173359;
  --s-blue-21-a45:#0a173373;
  --s-blue-21-a55:#0a17338c;
  --s-blue-21-a82:#0a1733d1;
  --s-blue-21-a88:#0a1733e0;
  --s-blue-21:#0a1733;
  --s-blue-24:#16222a;
  --s-blue-27-2:#1b2733;
  --s-blue-28:#1f2c34;
  --s-blue-29:#202c33;
  --s-blue-30:#123049;
  --s-blue-34:#2a3942;
  --s-blue-50:#5a6470;
  --s-blue-51-2:#5b6770;
  --s-blue-51:#3d6b8c;
  --s-blue-53:#5b6b8c;
  --s-blue-55:#1f6ce0;
  --s-blue-56-2:#667781;
  --s-blue-66-2:#8696a0;
  --s-blue-67:#8d96a3;
  --s-blue-75:#53bdeb;
  --s-green-30-a9:#25321b16;
  --s-green-31-a9:#26351a18;
  --s-green-35-a3:#28442108;
  --s-green-42:#005c4b;
  --s-green-46:#0e6b36;
  --s-green-51:#0e7a3d;
  --s-green-61:#1f9d55;
  --s-green-62-a60:#2e9e5b99;
  --s-green-63:#23a35c;
  --s-green-73-a0:#34c75900;
  --s-green-73-a67:#34c759aa;
  --s-green-73:#34c759;
  --s-green-82:#6fe196;
  --s-green-95:#e2f3e8;
  --s-green-96:#d9fdd3;
  --s-grey-14:#0a0a0a;
  --s-grey-16-a25:#04100740;
  --s-grey-19-a13:#0b141a21;
  --s-grey-19:#0b141a;
  --s-grey-20-a40:#0e190f66;
  --s-grey-22:#111b21;
  --s-grey-23-a8:#13201614;
  --s-grey-25-2:#19231f;
  --s-grey-25:#182229;
  --s-grey-35:#3b3b3b;
  --s-grey-39:#444444;
  --s-grey-57:#707972;
  --s-grey-63-a8:#808c8414;
  --s-grey-71:#9aa3a8;
  --s-grey-87:#dcd4c8;
  --s-grey-89:#dcdcdc;
  --s-grey-93:#e4e9f2;
  --s-grey-94-2:#e9edef;
  --s-grey-94:#efeae2;
  --s-grey-97:#f6f5f3;
  --s-purple-25-2:#221c36;
  --s-purple-25:#241d3a;
  --s-purple-28:#2a2340;
  --s-purple-46:#5b3fa8;
  --s-purple-57:#7b5fd0;
  --s-purple-68:#9d86e8;
  --s-purple-82:#c9b8ff;
  --s-purple-87:#d6ccff;
  --s-purple-92:#e6e0ff;
  --s-purple-95:#f1ecfb;
  --s-red-22:#2a1512;
  --s-red-44:#9a1119;
  --s-red-47:#ac0f18;
  --s-red-55:#d50f21;
  --s-red-56:#c2413b;
  --s-red-63-a15:#e0583f26;
  --s-red-63-a40:#e0583f66;
  --s-red-63-a60:#e0583f99;
  --s-red-65:#ff3b30;
  --s-red-76:#ff8a80;
  --s-red-79-2:#ff9a9a;
  --s-red-79:#ff9a86;
  --s-teal-79:#9fc4bd;
  --s-white-a13:#ffffff22;
  --s-white-a15:#ffffff26;
  --s-white-a18:#ffffff2e;
  --s-white-a50:#ffffff80;
  --s-white-a5:#ffffff0d;
  --s-white-a70:#ffffffb3;
  --s-white-a7:#ffffff12;
  --s-white-a80:#ffffffcc;
  --s-white-a85:#ffffffd9;
  --s-white-a88:#ffffffe0;
  --s-white-a8:#ffffff14;
  --s-white-a92:#ffffffeb;
  --s-white:#ffffff
}
/* The hub's own named tokens, light then dark, on the palette above.
   --brand-text is the brand as words on a light surface (Booked in Leads):
   --rp-now's mix taken darker so it reads at 4.5:1 or better on white. In
   dark it is --rp-now itself. */
:root{
  --ink:var(--n-25);
  --muted:color-mix(in srgb,var(--neutral-tint) 4.7%,#6b6e6e);
  --line:color-mix(in srgb,var(--neutral-tint) 2.8%,#e9eaea);
  --paper:var(--n-98);
  --green:var(--b-74);
  --deep:var(--brand-deep);
  --soft:var(--brand-soft);
  --x-panel:var(--s-white);
  --x-raise:var(--n-98);
  --x-line:var(--n-93-9);
  --x-ink:var(--n-25);
  --x-ink2:color-mix(in srgb,var(--neutral-tint) 4.6%,#4c5653);
  --x-ink3:color-mix(in srgb,var(--neutral-tint) 9.1%,#5d5e65);
  --x-chip:color-mix(in srgb,var(--brand) 7.5%,#f8f4ee);
  --x-chip-ink:color-mix(in srgb,var(--brand) 25.1%,#453c35);
  --x-warn-bg:var(--s-amber-96);
  --x-warn:var(--s-amber-47);
  --x-mine:color-mix(in srgb,var(--brand) 8.2%,#faf3ee);
  --v-ad-bg:#e4edfd;
  --v-ad:#1a56c8;
  --v-search-bg:var(--s-green-95);
  --v-search:var(--s-green-46);
  --v-gbp-bg:var(--s-amber-96);
  --v-gbp:var(--s-amber-47);
  --v-direct-bg:#edf0f3;
  --v-direct:#46505c;
  --rp-a:var(--s-green-61);
  --rp-b:#2f6fdc;
  --rp-c:#b27a0e;
  --rp-bar:color-mix(in srgb,var(--neutral-tint) 7.5%,#cbcfd1);
  --rp-now:color-mix(in srgb,var(--brand) 64.0%,#4b4947);
  --rp-band:#d7eadb;
  --brand-text:color-mix(in srgb,var(--brand) 54.8%,#333230);
  --x-line2:color-mix(in srgb,var(--neutral-tint) 8.2%,#d9dadc);
  --icon-hole:color-mix(in srgb,var(--neutral-tint) 2.7%,#0e1011)
}
:root[data-theme="dark"]{
  --ink:var(--n-94-5);
  --muted:color-mix(in srgb,var(--neutral-tint) 8.0%,#a9acaf);
  --line:color-mix(in srgb,var(--neutral-tint) 7.7%,#1d1c22);
  --paper:color-mix(in srgb,var(--neutral-tint) 2.2%,#090a0b);
  --deep:var(--brand-deep);
  --soft:var(--brand-soft);
  --d-top:color-mix(in srgb,var(--neutral-tint) 2.3%,#0d0f0f);
  --d-panel:var(--n-19);
  --d-raise:color-mix(in srgb,var(--neutral-tint) 2.8%,#131516);
  --d-well:color-mix(in srgb,var(--neutral-tint) 2.2%,#0b0d0d);
  --d-fill:var(--n-22);
  --d-fill2:color-mix(in srgb,var(--neutral-tint) 5.3%,#16181a);
  --d-line2:color-mix(in srgb,var(--neutral-tint) 5.2%,#272a2b);
  --d-t2:var(--n-80-2);
  --d-t3:var(--n-69-2);
  --d-chip:var(--n-26);
  --d-chip-ink:var(--b-84);
  --d-inv:color-mix(in srgb,var(--neutral-tint) 5.0%,#edeff0);
  --d-inv-ink:color-mix(in srgb,var(--neutral-tint) 7.0%,#090d0f);
  --d-attn:color-mix(in srgb,var(--brand) 7.9%,#120e10);
  --d-attn-line:color-mix(in srgb,var(--brand) 11.0%,#221f1f);
  --x-panel:var(--n-19);
  --x-raise:var(--n-22);
  --x-line:color-mix(in srgb,var(--neutral-tint) 5.2%,#24282a);
  --x-ink:var(--n-94-5);
  --x-ink2:var(--n-80-2);
  --x-ink3:var(--n-69-2);
  --x-chip:var(--n-26);
  --x-chip-ink:var(--b-84);
  --x-warn-bg:var(--s-amber-30);
  --x-warn:var(--s-amber-84);
  --x-mine:color-mix(in srgb,var(--brand) 9.1%,#1e1d1c);
  --v-ad-bg:#16283a;
  --v-ad:#9fd0ff;
  --v-search-bg:#15321f;
  --v-search:#86e2a8;
  --v-gbp-bg:var(--s-amber-30);
  --v-gbp:var(--s-amber-84);
  --v-direct-bg:#262d29;
  --v-direct:#c2ccc5;
  --rp-a:var(--s-green-63);
  --rp-b:#5a92ec;
  --rp-c:#bd861c;
  --rp-bar:color-mix(in srgb,var(--neutral-tint) 5.2%,#383f3f);
  --rp-now:color-mix(in srgb,var(--brand) 64.5%,#58595a);
  --rp-band:#1c3325;
  --brand-text:var(--rp-now);
  --x-line2:color-mix(in srgb,var(--neutral-tint) 3.0%,#3a4340);
  --icon-hole:color-mix(in srgb,var(--neutral-tint) 2.7%,#0e1011)
}
*{box-sizing:border-box}body{margin:0;background:var(--paper);font-family:Inter,system-ui,Arial,sans-serif;color:var(--ink);font-size:14px;-webkit-font-smoothing:antialiased}
button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid var(--b-74);outline-offset:4px}button{color:inherit}button svg{flex-shrink:0}button,a{-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}h1,h2,h3,p{margin:0}button{border:0}svg.icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}.symbols{position:absolute;width:0;height:0;overflow:hidden}
.preview-label{height:30px;background:var(--n-15);color:var(--n-75);display:flex;align-items:center;justify-content:space-between;padding:0 24px;font-size:10px;letter-spacing:1.1px;text-transform:uppercase}.preview-label strong{font-weight:500;color:var(--n-89)}.preview-label .dot{width:5px;height:5px;background:var(--green);border-radius:50%;display:inline-block;margin-right:8px}
.shell{display:grid;grid-template-columns:210px 1fr;min-height:calc(100vh - 30px)}
.sidebar{background:var(--s-black);color:var(--n-90);display:flex;flex-direction:column;padding:27px 15px 20px;gap:27px}.brand{width:154px;height:auto;display:block;margin:0 12px}.workspace{display:flex;gap:11px;align-items:center;border:1px solid var(--n-33);border-radius:10px;padding:12px 10px;margin-top:3px}.workspace-icon{width:34px;height:34px;flex-shrink:0;border-radius:8px;background:var(--n-94);color:var(--b-33);display:grid;place-items:center;font-size:12px;font-weight:650}.workspace strong{display:block;font-size:12px;font-weight:550}.workspace small{display:block;font-size:10px;color:var(--n-71);margin-top:4px}.sidebar-label{color:var(--n-64);letter-spacing:1.2px;font-size:9px;font-weight:550;text-transform:uppercase;margin:0 13px 12px}.nav-list{display:grid;gap:5px}.nav-item{display:flex;align-items:center;gap:12px;width:100%;padding:11px 13px;border-radius:7px;background:transparent;color:var(--n-77);text-align:left;font-size:12px;font-weight:450;transition:background .15s,color .15s}.nav-item:hover{background:var(--n-25-2);color:var(--s-white)}.nav-item.current{background:var(--b-32);color:var(--b-95)}.nav-item.current .icon{color:var(--b-82)}.nav-item .count{margin-left:auto;border-radius:4px;background:var(--n-31);padding:2px 6px;font-size:10px;color:var(--n-80)}.nav-item .count.green{background:var(--green);color:var(--b-23)}.sidebar-bottom{margin-top:auto;padding-top:22px}.help-card{padding:17px 13px;border:1px solid var(--n-34);border-radius:10px;margin-bottom:22px}.help-card .help-heading{font-size:12px;color:var(--n-97);margin-bottom:6px}.help-card p{color:var(--n-70);font-size:11px;line-height:1.5}.help-card button{margin-top:13px;background:var(--n-92);color:var(--b-29);border-radius:6px;padding:8px 12px;font-size:11px;font-weight:600;width:100%}.account{display:flex;align-items:center;gap:10px;padding:0 9px}.account .avatar{background:var(--n-37);color:var(--n-92-2);width:30px;height:30px}.account strong{display:block;font-size:11px;font-weight:500}.account small{display:block;font-size:10px;color:var(--n-68);margin-top:3px}.account .icon{margin-left:auto;color:var(--n-72);width:16px}.avatar{border-radius:50%;width:31px;height:31px;display:grid;place-items:center;font-size:10px;font-weight:600;flex-shrink:0}
.app{min-width:0}.topbar{height:65px;border-bottom:1px solid var(--line);background:var(--s-white);display:flex;align-items:center;justify-content:space-between;gap:25px;padding:0 32px}.breadcrumb{display:flex;align-items:center;gap:13px;font-size:11px;color:var(--n-65);white-space:nowrap}.breadcrumb b{color:var(--ink);font-weight:500}.breadcrumb span.sep{color:var(--n-84)}.top-actions{display:flex;align-items:center;gap:19px}.search-trigger{width:220px;display:flex;align-items:center;gap:9px;background:var(--n-98-2);border:1px solid var(--n-94-2);border-radius:7px;padding:9px 11px;color:var(--n-65-2);font-size:11px;text-align:left}.search-trigger .icon{width:15px;height:15px}.icon-button{width:29px;height:29px;display:grid;place-items:center;background:transparent;border-radius:6px;color:var(--n-59);position:relative}.notification-dot{position:absolute;right:5px;top:2px;width:5px;height:5px;border-radius:50%;background:var(--green);box-shadow:0 0 0 2px var(--s-white)}.top-actions>.avatar{background:var(--n-94-3);color:var(--b-49)}
.content{padding:29px 32px 21px;max-width:1640px;margin:auto}.welcome{display:flex;align-items:center;justify-content:space-between;margin-bottom:27px}.eyebrow{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;font-weight:550;color:var(--n-59-2);margin-bottom:9px}.welcome h1{font-size:32px;line-height:1.12;font-weight:520;letter-spacing:-1.15px}.welcome p{font-size:12px;color:var(--muted);margin-top:10px}.welcome-actions{display:flex;gap:10px;align-items:center}.button{border-radius:7px;padding:10px 13px;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;font-size:11px;font-weight:550;transition:transform .15s,background .15s}.button:hover{transform:translateY(-1px)}.button .icon{width:15px;height:15px}.button.dark{background:var(--b-27);color:var(--s-white);box-shadow:0 2px 3px var(--s-grey-23-a8)}.button.light{background:var(--s-white);border:1px solid var(--n-92-3)}.button.green{background:var(--green);color:var(--b-25-2)}.button.ghost{background:none;padding:0;color:var(--n-46)}.link-button{background:transparent;padding:0;font-size:11px;font-weight:550;text-align:left}.link-button:hover{text-decoration:underline;text-underline-offset:4px}
.top-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:18px;margin-bottom:18px}.panel{background:var(--s-white);border:1px solid var(--line);border-radius:13px;overflow:hidden;min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel h2{font-size:14px;font-weight:580;letter-spacing:-.2px}.panel-subtitle{font-size:11px;color:var(--muted);margin-top:5px}.numbers{padding:21px 23px 15px;height:254px}.period{font-size:10px;color:var(--n-62);display:flex;align-items:center;gap:6px}.period .icon{width:12px;height:12px}.metric-row{display:grid;grid-template-columns:1fr 1fr 1fr;margin-top:23px}.metric{padding-right:15px}.metric+.metric{padding-left:22px;border-left:1px solid var(--n-95)}.metric-label{color:var(--n-59-3);font-size:10px;margin-bottom:6px}.metric-value{font-size:30px;letter-spacing:-1.1px;line-height:1;font-weight:520;font-variant-numeric:tabular-nums}.metric-delta{display:inline-flex;font-size:9px;color:var(--b-52);background:var(--n-97-2);padding:3px 5px;border-radius:4px;margin-left:8px;vertical-align:middle;letter-spacing:0;font-weight:500}.chart{width:100%;height:72px;margin-top:12px;display:block;overflow:visible}.chart .grid{stroke:var(--n-95-2);stroke-width:1}.chart-labels{display:flex;justify-content:space-between;color:var(--n-66);font-size:9px;margin-top:4px}.numbers .open-report{color:var(--b-51);font-size:10px;font-weight:500}.metric-value .currency{font-size:22px}
.attention{padding:23px 24px 20px;background:var(--n-95-3);border-color:var(--n-92-4);height:254px;display:flex;flex-direction:column}.attention .eyebrow{display:flex;align-items:center;gap:7px;color:var(--b-55);margin:0;font-size:9px}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--b-66)}.attention-body{display:grid;grid-template-columns:1fr 88px;gap:18px;align-items:center;margin-top:19px}.attention h2{font-size:23px;line-height:1.15;font-weight:500;letter-spacing:-.65px;max-width:260px}.attention p{font-size:11px;line-height:1.55;color:var(--b-56);margin-top:10px;max-width:242px}.photo-stack{position:relative;height:99px;isolation:isolate}.photo-stack:before{content:"";position:absolute;inset:2px 0 3px 0;background:var(--n-100);border-radius:7px;transform:rotate(9deg);box-shadow:0 4px 9px var(--s-green-30-a9);z-index:-1}.photo-stack img{width:88px;height:96px;object-fit:cover;border:4px solid var(--s-white);border-radius:7px;transform:rotate(-6deg);box-shadow:0 4px 12px var(--s-green-31-a9)}.attention-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:12px}.attention-count{font-size:10px;color:var(--b-60)}.attention-count strong{color:var(--b-46);font-weight:550}
.section-row{display:flex;justify-content:space-between;align-items:center;margin:23px 1px 12px}.section-row h2{font-size:12px;font-weight:550;letter-spacing:-.1px}.section-row span{font-size:10px;color:var(--n-66-2)}.workspace-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}.workspace-grid .panel{height:218px;padding:20px;display:flex;flex-direction:column}.card-title{display:flex;align-items:center;gap:9px}.card-title>.icon{width:17px;height:17px;color:var(--b-61)}.card-title h2{font-size:13px}.pill{font-size:9px;padding:4px 6px;background:var(--n-96-2);color:var(--b-54);border-radius:4px;white-space:nowrap}.message{display:flex;gap:10px;margin-top:22px}.message .avatar{background:var(--n-93-2);color:var(--b-48);border:3px solid var(--n-97-3);width:34px;height:34px}.message-meta{font-size:10px;display:flex;align-items:center;gap:7px;margin-top:1px}.message-meta b{font-weight:550}.message-meta span{font-size:9px;color:var(--n-69)}.message p{font-size:12px;line-height:1.55;color:var(--b-50);margin-top:6px;max-width:290px}.card-footer{margin-top:auto;padding-top:11px;display:flex;align-items:center;justify-content:space-between}.card-footer .tiny{font-size:9px;color:var(--n-64-2)}.plan-focus{font-size:12px;line-height:1.4;margin-top:19px;font-weight:500}.plan-track{display:flex;gap:5px;margin-top:13px}.plan-track span{height:4px;flex:1;background:var(--n-94-4);border-radius:5px}.plan-track span.done{background:var(--b-66-2)}.plan-track span.active{background:var(--b-83)}.plan-meta{font-size:10px;color:var(--b-63);margin-top:8px}.plan-next{font-size:11px;color:var(--b-53);display:flex;gap:7px;align-items:center;margin-top:11px}.plan-next .small-dot{width:5px;height:5px;border-radius:50%;background:var(--b-67)}.gallery .gallery-images{display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:minmax(0,1fr);gap:6px;margin-top:16px;height:90px}.gallery-images img{width:100%;height:100%;object-fit:cover;border-radius:6px;min-width:0}.gallery-last{position:relative;min-width:0}.gallery-last img{filter:brightness(.56)}.gallery-last span{position:absolute;inset:0;display:grid;place-items:center;color:var(--s-white);font-size:17px;font-weight:500}.gallery-subtitle{font-size:10px;color:var(--b-62);margin-top:7px}
.utility-row{display:grid;grid-template-columns:1.12fr 1fr 1fr;gap:18px;margin-top:18px}.utility{border:1px solid var(--line);border-radius:10px;background:var(--s-white);display:flex;gap:12px;align-items:center;padding:16px 17px;text-align:left;transition:border-color .15s,box-shadow .15s}.utility:hover{border-color:var(--b-78);box-shadow:0 4px 12px var(--s-green-35-a3)}.utility-icon{width:31px;height:31px;background:var(--n-96-3);border-radius:8px;color:var(--b-59);display:grid;place-items:center;flex-shrink:0}.utility-icon .icon{width:17px;height:17px}.utility h3{font-size:11px;font-weight:550;margin-bottom:4px}.utility p{font-size:10px;color:var(--b-65)}.utility>span:last-child{margin-left:auto;font-size:10px;color:var(--b-62-2)}.utility.feedback{background:var(--n-28);border-color:var(--n-28);color:var(--n-96-4)}.utility.feedback .utility-icon{background:var(--b-36);color:var(--b-82-2)}.utility.feedback p{color:var(--b-75)}.utility.feedback>span:last-child{color:var(--b-85)}.bottom-line{display:flex;align-items:center;justify-content:space-between;margin-top:19px;color:var(--n-66-3);font-size:9px}.bottom-line .quiet-links{display:flex;gap:17px}.bottom-line button{font-size:9px;color:var(--b-65-2);background:none;padding:0}.connected-dot{width:5px;height:5px;display:inline-block;border-radius:50%;background:var(--b-66-3);margin-right:6px}
dialog{border:1px solid var(--n-91);border-radius:15px;padding:0;color:var(--ink);width:min(520px,80vw);max-height:78vh;box-shadow:0 30px 100px var(--s-grey-16-a25);background:var(--s-white)}dialog::backdrop{background:var(--s-grey-20-a40);backdrop-filter:blur(4px)}.dialog-top{padding:23px 26px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.dialog-top h2{font-size:21px;font-weight:500;letter-spacing:-.5px}.dialog-body{padding:23px 26px}.dialog-note{font-size:11px;line-height:1.5;color:var(--b-58);margin-bottom:18px}.dialog-description{font-size:14px;line-height:1.65;color:var(--b-47)}.destination-list{display:grid;gap:8px;margin-top:22px}.destination-item{border:1px solid var(--n-93-3);border-radius:8px;padding:13px;display:flex;align-items:center;gap:12px;font-size:12px;background:var(--n-98-3);color:var(--b-43)}.destination-item .icon{color:var(--b-60-2)}.dialog-foot{padding:17px 26px;background:var(--n-98-4);border-top:1px solid var(--line);font-size:10px;color:var(--b-64)}.search-input{width:100%;padding:13px 14px;border:1px solid var(--n-91);border-radius:8px;font-size:13px;margin-bottom:6px}.search-result{width:100%;background:var(--s-white);text-align:left;border-bottom:1px solid var(--n-95-4);padding:13px 3px}.search-result:hover{background:var(--n-97-4)}.search-result b{display:block;font-size:13px;font-weight:550}.search-result span{display:block;font-size:11px;color:var(--b-62-3);margin-top:4px}.empty-search{font-size:12px;color:var(--b-58-2);padding:18px 0}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;clip:rect(0,0,0,0);overflow:hidden}
@media(min-width:1600px){.content{padding-top:40px}.welcome{margin-bottom:35px}.numbers,.attention{height:280px}.workspace-grid .panel{height:237px}.chart{height:90px}.utility{padding:21px}.section-row{margin-top:28px}}
@media(max-height:820px){.sidebar{padding-top:20px;gap:18px;padding-bottom:14px}.sidebar-bottom{padding-top:14px}.help-card{margin-bottom:12px;padding:12px}.help-card p{display:none}.help-card button{margin-top:7px}.topbar{height:58px}.content{padding-top:22px;padding-bottom:4px}.welcome{margin-bottom:21px}.welcome h1{font-size:29px}.welcome p{margin-top:7px}.numbers,.attention{height:223px}.numbers{padding:18px 21px 12px}.metric-row{margin-top:19px}.chart{height:53px;margin-top:9px}.attention{padding:19px 21px}.attention-body{margin-top:14px;gap:12px}.attention h2{font-size:21px}.attention p{margin-top:7px}.photo-stack{height:88px}.photo-stack img{height:85px}.section-row{margin-top:19px;margin-bottom:10px}.workspace-grid .panel{height:192px;padding:17px}.message{margin-top:17px}.message p{font-size:11px}.plan-focus{margin-top:15px}.gallery .gallery-images{height:73px;margin-top:13px}.utility-row{margin-top:15px}.utility{padding:13px 15px}.bottom-line{margin-top:14px}.sidebar .nav-item{padding-top:7px;padding-bottom:7px}}
@media(max-width:1240px){.shell{grid-template-columns:185px 1fr}.brand{width:140px;margin-left:7px}.topbar{padding-left:25px;padding-right:25px}.content{padding-left:25px;padding-right:25px}.attention-body{grid-template-columns:1fr 68px}.photo-stack img{width:68px}.attention h2{font-size:20px}.top-grid,.workspace-grid,.utility-row{gap:14px}.metric+.metric{padding-left:13px}.metric-value{font-size:27px}.metric-delta{margin-left:4px;font-size:8px}.welcome-actions .button.light{display:none}.utility p{font-size:9px}.sidebar{padding-left:12px;padding-right:12px}.workspace{gap:8px}.workspace strong{font-size:11px}.search-trigger{width:250px}}
@media(max-width:1050px){body{min-width:1050px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Features adapted from the earlier dashboard. */
.sidebar-contact{display:block;width:100%;background:var(--n-24);border:1px solid var(--n-34-2);border-radius:7px;padding:11px;color:var(--n-92-5);text-align:left;font-size:12px;margin-bottom:20px}
.welcome{min-height:58px}.metric-row{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:21px}.metric+.metric{padding-left:15px}.metric{padding-right:10px}.metric-value{font-size:27px}.metric-label{font-size:10px}.chart{height:48px;margin-top:15px}.chart-labels{margin-top:6px}.result-links{display:flex;gap:22px;border-top:1px solid var(--n-95-2);margin-top:12px;padding-top:11px}.result-links button{background:none;padding:0;color:var(--b-49-2);font-size:11px}.result-links button:hover{text-decoration:underline;text-underline-offset:4px}.gallery .gallery-images{grid-template-columns:1fr 1fr}.utility-row{grid-template-columns:repeat(3,1fr)}.utility h3{font-size:12px}.utility p{font-size:10px}.search-trigger{width:220px}.numbers{display:flex;flex-direction:column}.numbers .result-links{margin-top:auto}.attention-bottom .link-button{font-size:10px;color:var(--b-54-2)}.dialog-body .destination-list{margin-top:0}.destination-item{width:100%;text-align:left}.destination-item small{display:block;color:var(--b-62-4);font-size:11px;margin-top:4px}.destination-item strong{font-weight:550}.destination-item:hover{background:var(--n-96-5)}.dialog-description{margin-bottom:18px}.demo-caption{font-size:11px;color:var(--b-61-2);margin-bottom:17px}.lead-detail{border:1px solid var(--n-92-6);border-radius:9px;margin-bottom:9px;overflow:hidden}.lead-detail summary{display:flex;align-items:center;gap:10px;padding:15px;cursor:pointer;list-style:none;font-size:13px}.lead-detail summary::-webkit-details-marker{display:none}.lead-detail summary:after{content:'+';margin-left:5px;color:var(--b-62-5);font-size:16px}.lead-detail[open] summary:after{content:'−'}.lead-detail summary small{display:block;margin-top:5px;font-size:10px;color:var(--b-64-2)}.lead-badge{margin-left:auto;border-radius:4px;padding:4px 6px;color:var(--b-54-3);background:var(--n-96-5);font-size:10px;white-space:nowrap}.lead-inside{padding:0 15px 17px}.lead-inside p{font-size:12px;line-height:1.6;color:var(--b-54-4);margin-bottom:13px}.choice-row{display:flex;gap:7px;flex-wrap:wrap}.choice-row button{border:1px solid var(--n-92-7);background:var(--n-98-3);border-radius:6px;padding:9px 12px;font-size:11px}.choice-row button[aria-pressed="true"]{background:var(--b-33-2);border-color:var(--b-33-2);color:var(--s-white)}.value-row{display:flex;align-items:center;gap:9px;margin-top:12px;font-size:11px}.value-row input{width:115px;padding:9px;border:1px solid var(--n-91-2);border-radius:6px}.value-row[hidden]{display:none}.preview-status{font-size:10px;color:var(--b-56-2);margin-top:12px;min-height:13px}.calls-fold{border-top:1px solid var(--n-93-4);margin-top:20px;padding-top:16px}.calls-fold>summary{font-size:12px;color:var(--b-50-2);cursor:pointer}.calls-fold p{font-size:11px;color:var(--b-62-6);line-height:1.5;margin:12px 0}.photo-detail-image{width:100%;height:210px;object-fit:cover;border-radius:8px;margin-bottom:17px}.field-label{display:block;font-size:11px;font-weight:550;margin:16px 0 8px}.photo-uses{display:flex;gap:17px;font-size:12px;color:var(--b-54-5)}.photo-uses label{display:flex;align-items:center;gap:6px}.photo-uses input{accent-color:var(--b-33-3)}.photo-notes{width:100%;min-height:65px;resize:vertical;font:12px Inter;padding:10px;border:1px solid var(--n-91-2);border-radius:7px}.photo-picker{display:flex;gap:8px;margin-bottom:14px}.photo-picker button{border:2px solid transparent;border-radius:7px;padding:2px;background:var(--n-96-6)}.photo-picker button[aria-pressed="true"]{border-color:var(--b-63-2)}.photo-picker img{display:block;width:65px;height:45px;object-fit:cover;border-radius:4px}.photo-meta{display:flex;justify-content:space-between;align-items:center}.photo-meta h3{font-size:14px;font-weight:550}.photo-favourite{font-size:11px;background:var(--n-97-5);padding:7px 10px;border-radius:6px}.photo-favourite[aria-pressed="true"]{background:var(--b-93);color:var(--b-41)}.compact-note{font-size:11px;color:var(--b-62-7);line-height:1.55;margin:12px 0 0}
@media(max-height:820px){.welcome{min-height:52px;margin-bottom:20px}.numbers .metric-row{margin-top:16px}.numbers .chart{height:38px;margin-top:11px}.result-links{padding-top:10px;gap:21px}.sidebar-bottom{padding-top:0}.sidebar-contact{margin-bottom:13px}.metric-value{font-size:26px}.attention-body{margin-top:16px}}
@media(max-width:1240px){.metric-label{font-size:9px}.metric-value{font-size:23px}.metric+.metric{padding-left:11px}.result-links{gap:18px}.search-trigger{width:180px}}


.source-breakdown{margin-top:22px}.source-bar{height:8px;display:flex;gap:4px;overflow:hidden;border-radius:5px}.source-bar span{background:var(--b-62-8);border-radius:2px}.source-bar span:nth-child(2){background:var(--b-78-2)}.source-bar span:nth-child(3){background:var(--n-92-8)}.source-key{display:flex;gap:17px;margin-top:9px;font-size:10px;color:var(--b-64-3)}.source-key span{display:flex;align-items:center;gap:4px}.source-key b{font-weight:550;color:var(--b-48-2)}.source-key i{height:5px;width:5px;border-radius:50%;background:var(--b-62-8);margin-right:2px}.source-key span:nth-child(2) i{background:var(--b-78-2)}.source-key span:nth-child(3) i{background:var(--b-90)}.numbers .chart-labels{margin-top:14px;align-items:center}.inline-count{font-size:9px;background:var(--n-96-7);color:var(--b-56-3);border-radius:4px;padding:3px 5px;margin-left:7px}.conversation-list{display:grid;margin-top:15px;gap:0}.conversation-list button{background:none;text-align:left;display:flex;align-items:center;gap:8px;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--n-95-2);font-size:11px;line-height:1.3;color:var(--b-48-3)}.conversation-list button:last-child{border-bottom:0}.conversation-list time{white-space:nowrap;font-size:9px;color:var(--b-67-2)}.conversation-list button:hover span{text-decoration:underline;text-underline-offset:3px}.current-work{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:16px;font-size:12px;line-height:1.4;color:var(--b-49-3)}.current-work li{display:flex;align-items:flex-start;gap:9px}.current-work li:before{content:'';width:5px;height:5px;flex-shrink:0;background:var(--b-68);border-radius:50%;margin-top:6px}.small-link{font-size:9px;color:var(--b-64-4)}.work-detail{padding:15px 0;border-bottom:1px solid var(--n-93-5)}.work-detail:first-child{padding-top:0}.work-detail h3{font-size:14px;font-weight:550;margin-bottom:7px}.work-detail p{font-size:12px;line-height:1.6;color:var(--b-59-2)}.snapshot-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:18px}.snapshot-table th,.snapshot-table td{text-align:left;padding:11px 7px;border-bottom:1px solid var(--n-93-6)}.snapshot-table th{font-size:10px;font-weight:500;color:var(--b-66-4)}.snapshot-table td:first-child{font-weight:550}.snapshot-table small{display:block;font-size:10px;color:var(--b-65-3);margin-top:4px}.source-note{font-size:11px;line-height:1.7;color:var(--b-61-3);margin-top:17px}.source-note a{color:var(--b-50-3)}.thread-date{display:inline-block;margin-bottom:15px;font-size:11px;color:var(--b-65-4)}.source-link{display:inline-flex;color:var(--b-50-4);font-size:11px;margin-top:18px;text-decoration:underline;text-underline-offset:3px}.preview-composer{margin-top:20px}.preview-composer textarea{display:block;min-height:100px;width:100%;border:1px solid var(--n-91-2);border-radius:8px;padding:12px;font:13px Inter;resize:vertical}.preview-composer .button{margin-top:10px}.report-tabs{display:flex;gap:7px;margin-bottom:18px}.report-tabs button{background:var(--n-97-6);color:var(--b-58-3);padding:8px 10px;border-radius:6px;font-size:11px}.report-tabs button[aria-pressed="true"]{background:var(--b-33-4);color:var(--s-white)}.report-totals{display:grid;grid-template-columns:1fr 1fr;gap:12px}.report-totals div{padding:16px;background:var(--n-98-5);border-radius:8px}.report-totals span{display:block;font-size:11px;color:var(--b-61-4);margin-bottom:8px}.report-totals strong{font-size:25px;font-weight:500;letter-spacing:-.5px}.report-totals small{display:block;font-size:10px;color:var(--b-65-5);margin-top:6px}
@media(max-height:820px){.source-breakdown{margin-top:17px}.numbers .chart-labels{margin-top:11px}.source-key{margin-top:7px}.conversation-list{margin-top:10px}.conversation-list button{padding:8px 0;font-size:10px}.current-work{margin-top:18px;gap:12px;font-size:11px}.attention h2{font-size:20px}.content{padding-top:18px}.welcome{min-height:44px;margin-bottom:16px}.numbers,.attention{height:211px}.workspace-grid .panel{height:182px}}
/* Second concept: clearer navigation and a working overview. */
.shell{grid-template-columns:198px 1fr}.sidebar{padding:23px 13px 17px;gap:18px}.brand{width:146px;margin-left:12px}.workspace{padding:10px 8px;margin-top:0}.workspace strong{font-size:11px}.workspace-icon{width:30px;height:30px}.nav-group+.nav-group{margin-top:15px}.sidebar-label{font-size:8px;margin-bottom:6px;letter-spacing:1.3px}.nav-list{gap:2px}.sidebar .nav-item{font-size:11px;padding:7px 12px;gap:11px;min-height:31px}.nav-item .icon{width:16px;height:16px}.sidebar-bottom{padding-top:0}.sidebar-contact{margin-bottom:13px}.sidebar-bottom .nav-item{padding-left:9px}.account{margin-top:13px;padding-top:12px;border-top:1px solid var(--n-28-2)}.topbar{height:56px;padding:0 28px}.search-trigger{width:145px;padding:8px 10px}.content{padding:24px 28px 16px;max-width:1550px}.welcome{min-height:46px;margin-bottom:22px}.welcome h1{font-size:29px}.welcome p{margin-top:7px}.welcome-actions .button.light{display:inline-flex}.top-grid{grid-template-columns:1.65fr 1fr;gap:16px;margin-bottom:20px}.numbers,.attention{height:320px;padding:20px}.numbers .metric-row{margin-top:19px;margin-bottom:17px}.metric-label{font-size:10px}.metric-value{font-size:26px}.metric+.metric{padding-left:17px}.metric-note{font-size:9px;color:var(--n-64-2);margin-top:5px}.lead-list-title{display:flex;justify-content:space-between;align-items:center;padding:12px 0 8px;border-top:1px solid var(--line);font-size:10px;color:var(--n-59-4)}.lead-list-title b{font-weight:550;color:var(--b-46-2)}.lead-list{display:grid}.lead-preview{display:grid;grid-template-columns:1fr 100px 56px;align-items:center;gap:12px;background:transparent;text-align:left;padding:9px 0;border-bottom:1px solid var(--n-95-2);font-size:11px}.lead-preview:last-child{border-bottom:0}.lead-preview strong{font-weight:550;display:block}.lead-preview small{display:block;margin-top:3px;font-size:9px;color:var(--n-68-2)}.lead-preview .via{font-size:9px;color:var(--b-61-3)}.lead-preview .lead-badge{font-size:9px;max-width:80px;text-align:center}.lead-preview:hover strong{text-decoration:underline;text-underline-offset:3px}.calls-strip{display:flex;align-items:center;gap:7px;margin-top:auto;font-size:10px;color:var(--b-62-9)}.calls-strip .icon{width:12px;height:12px}.calls-strip button{margin-left:auto;font-size:10px}.attention{background:var(--n-95-5)}.attention .panel-head{align-items:flex-start}.attention .eyebrow{font-size:9px;color:var(--b-53-2)}.turn-badge{font-size:9px;color:var(--b-49-4);background:var(--n-92-9);border-radius:4px;padding:4px 6px}.attention-body{margin-top:17px;grid-template-columns:1fr 72px;gap:13px}.attention h2{font-size:23px;line-height:1.13}.attention p{font-size:11px;line-height:1.5;margin-top:8px}.photo-stack{height:85px}.photo-stack img{width:72px;height:83px}.attention .request-actions{margin-top:14px;display:flex;gap:9px}.request-actions .button{padding:8px 11px;font-size:10px}.request-list{display:grid;margin-top:auto;border-top:1px solid var(--n-91-3);padding-top:9px;gap:2px}.request-list button{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:7px 0;text-align:left;background:none;color:var(--b-50-5);font-size:10px}.request-list button span:first-child{display:flex;align-items:center;gap:8px}.request-list .icon{width:14px;height:14px}.request-list .request-tag{font-size:8px;color:var(--b-65-6)}.section-row{margin:0 0 11px}.section-row h2{font-size:11px;color:var(--b-60-3)}.workspace-grid{grid-template-columns:1.12fr 1fr 1fr 1fr;gap:16px}.workspace-grid .panel{height:230px;padding:17px}.card-title{gap:7px}.card-title h2{font-size:12px}.card-title>.icon{width:16px;height:16px}.pill{font-size:8px}.site-thumb{width:100%;height:115px;padding:0;overflow:hidden;border:1px solid var(--n-93-7);border-radius:6px;background:var(--s-white);margin-top:17px;display:block}.site-thumb img{width:120%;height:auto;display:block;max-width:none}.site-caption{font-size:9px;color:var(--b-64-5);margin-top:7px}.card-footer .link-button{font-size:10px}.conversation-list{margin-top:14px}.conversation-list button{font-size:10px;display:block;width:100%;padding:10px 0}.conversation-list time{display:block;font-size:8px;margin-top:4px}.conversation-list button:last-child{border-bottom:0}.current-work{font-size:11px;margin-top:20px;gap:16px;line-height:1.4}.gallery .gallery-images{height:104px;margin-top:17px}.photo-summary{display:flex;justify-content:space-between;font-size:9px;color:var(--b-64-6);margin-top:8px}.bottom-line{margin-top:16px;font-size:9px}.bottom-line button{font-size:9px}.help-link{color:var(--b-51-2)!important;font-weight:550}.dialog-wide{width:min(920px,90vw)}.dialog-wide .dialog-body{padding:22px}.website-review{display:grid;grid-template-columns:1.7fr 1fr;gap:22px}.website-window{border:1px solid var(--n-91-4);border-radius:8px;overflow:hidden;align-self:start}.window-label{background:var(--n-97-7);padding:10px 12px;font-size:10px;color:var(--b-55-2);border-bottom:1px solid var(--n-91-4)}.website-snapshot{overflow:hidden;aspect-ratio:2.35;background:var(--s-white)}.website-snapshot img{display:block;width:120%;max-width:none}.section-selector{display:flex;gap:5px;flex-wrap:wrap;padding:12px;background:var(--n-98-6)}.section-selector button{background:var(--s-white);border:1px solid var(--n-92-10);border-radius:5px;font-size:10px;padding:8px}.section-selector button[aria-pressed=true]{background:var(--b-33-5);color:var(--s-white);border-color:var(--b-33-5)}.feedback-box h3{font-size:15px;font-weight:550}.feedback-box p{font-size:11px;line-height:1.55;color:var(--b-64-7);margin-top:8px}.feedback-box .preview-composer{margin-top:15px}.feedback-box textarea{min-height:105px}.feedback-box .field-label{margin-top:0}.local-comment{padding:12px;border-radius:6px;background:var(--n-96-5);margin-top:14px;font-size:12px;line-height:1.6}.local-comment small{display:block;font-size:9px;color:var(--b-59-3);margin-bottom:4px}.placement{background:var(--n-97-8);border:1px solid var(--n-92-11);border-radius:8px;padding:13px;margin-top:18px}.placement .field-label{margin-top:0}.placement select{width:100%;padding:9px;border:1px solid var(--b-89);border-radius:5px;background:var(--s-white);font:12px Inter;color:var(--b-48-4)}.placement small{display:block;font-size:10px;color:var(--b-64-8);margin-top:8px}.inbox-tabs{display:flex;gap:6px;margin-bottom:16px}.inbox-tabs button{font-size:11px;background:var(--n-96-8);border-radius:6px;padding:9px 11px}.inbox-tabs button[aria-pressed=true]{background:var(--b-33-5);color:var(--s-white)}.inbox-row{border-bottom:1px solid var(--n-93-5);padding:15px 0}.inbox-row button{display:block;width:100%;background:none;text-align:left}.inbox-row strong{font-size:13px;font-weight:550}.inbox-row p{font-size:11px;color:var(--b-61-5);margin:6px 0}.inbox-row small{font-size:9px;color:var(--b-65-7)}.inbox-row .turn-badge{float:right;font-size:8px}.thread-reply{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.thread-reply .choice-row{margin-top:14px}.thread-reply textarea{margin-top:9px}.keyline{border-top:1px solid var(--line);padding-top:15px;margin-top:15px}.preview-note{font-size:9px;color:var(--b-64-9)}.empty-box{padding:30px 0;color:var(--b-62-10);font-size:13px;line-height:1.6}
@media(max-height:820px){.sidebar{padding-top:19px;gap:16px}.nav-group+.nav-group{margin-top:10px}.sidebar .nav-item{min-height:28px;padding-top:5px;padding-bottom:5px}.nav-list{gap:1px}.content{padding-top:19px}.welcome{margin-bottom:19px}.numbers,.attention{height:304px}.numbers .metric-row{margin-top:16px;margin-bottom:13px}.lead-preview{padding:8px 0}.lead-list-title{padding-top:10px}.workspace-grid .panel{height:217px}.top-grid{margin-bottom:17px}.gallery .gallery-images{height:91px}.site-thumb{height:104px}.current-work{margin-top:19px;gap:14px}.bottom-line{margin-top:13px}.account{margin-top:8px}.attention h2{font-size:22px}.attention p{font-size:10px}.attention-body{margin-top:13px}.attention .request-actions{margin-top:12px}.request-list{padding-top:7px}.request-list button{padding:6px 0}}
@media(max-width:1240px){.shell{grid-template-columns:182px 1fr}.content{padding-left:21px;padding-right:21px}.topbar{padding-left:21px;padding-right:21px}.workspace-grid,.top-grid{gap:12px}.workspace-grid .panel{padding:14px}.numbers,.attention{padding:17px}.brand{width:137px;margin-left:9px}.metric-value{font-size:23px}.metric+.metric{padding-left:11px}.metric-label{font-size:9px}.lead-preview{grid-template-columns:1fr 88px 48px;gap:7px}.attention h2{font-size:20px}.current-work{font-size:10px}.card-title h2{font-size:11px}.search-trigger{width:135px}.site-thumb{height:94px}.conversation-list button{font-size:9px}.gallery .gallery-images{height:91px}}
@media(min-width:1600px){.content{padding-top:32px}.top-grid{margin-bottom:26px}.numbers,.attention{height:345px}.workspace-grid .panel{height:260px}.site-thumb{height:140px}.gallery .gallery-images{height:134px}.welcome{margin-bottom:29px}}
/* Dark theme, added 30 Sep 2026. Opens dark; the switch in the top bar flips to light.
   Every rule sits under :root[data-theme="dark"], so the light design above is unchanged.
   The sidebar is black in both. */
.theme-toggle .theme-sun{display:none}
:root[data-theme="dark"]{color-scheme:dark;}:root[data-theme="dark"] .sidebar{border-right:1px solid var(--n-23-2)}:root[data-theme="dark"] .preview-label{border-bottom:1px solid var(--n-23-2)}:root[data-theme="dark"] .topbar{background:var(--d-top)}:root[data-theme="dark"] .breadcrumb{color:var(--d-t3)}:root[data-theme="dark"] .breadcrumb span.sep{color:var(--n-38)}:root[data-theme="dark"] .search-trigger{background:var(--d-well);border-color:var(--d-line2);color:var(--d-t3)}:root[data-theme="dark"] .topbar .icon-button{color:var(--d-t3)}:root[data-theme="dark"] .notification-dot{box-shadow:0 0 0 2px var(--d-top)}:root[data-theme="dark"] .eyebrow{color:var(--d-t3)}:root[data-theme="dark"] .button.dark{background:var(--d-inv);color:var(--d-inv-ink);box-shadow:none}:root[data-theme="dark"] .button.light{background:var(--d-panel);border-color:var(--d-line2)}:root[data-theme="dark"] .button.ghost{color:var(--d-t2)}:root[data-theme="dark"] .panel{background:var(--d-panel)}:root[data-theme="dark"] .period,:root[data-theme="dark"] .metric-label,:root[data-theme="dark"] .metric-note{color:var(--d-t3)}:root[data-theme="dark"] .metric+.metric{border-left-color:var(--line)}:root[data-theme="dark"] .lead-list-title{color:var(--d-t3)}:root[data-theme="dark"] .lead-list-title b{color:var(--d-t2)}:root[data-theme="dark"] .lead-preview{border-bottom-color:var(--line)}:root[data-theme="dark"] .lead-preview small,:root[data-theme="dark"] .lead-preview .via,:root[data-theme="dark"] .calls-strip{color:var(--d-t3)}:root[data-theme="dark"] .lead-badge,:root[data-theme="dark"] .inline-count,:root[data-theme="dark"] .pill{background:var(--d-chip);color:var(--d-chip-ink)}:root[data-theme="dark"] .attention{background:var(--d-attn);border-color:var(--d-attn-line)}:root[data-theme="dark"] .attention .eyebrow{color:var(--b-76)}:root[data-theme="dark"] .attention p{color:var(--b-77)}:root[data-theme="dark"] .photo-stack:before{background:var(--n-30);box-shadow:none}:root[data-theme="dark"] .photo-stack img{border-color:var(--n-93-8);box-shadow:0 6px 16px var(--s-black-a53)}:root[data-theme="dark"] .turn-badge{color:var(--b-87);background:var(--b-31)}:root[data-theme="dark"] .request-list{border-top-color:var(--d-attn-line)}:root[data-theme="dark"] .request-list button{color:var(--b-85-2)}:root[data-theme="dark"] .request-list .request-tag{color:var(--b-70)}:root[data-theme="dark"] .section-row h2{color:var(--d-t3)}:root[data-theme="dark"] .card-title>.icon{color:var(--b-70-2)}:root[data-theme="dark"] .site-thumb{border-color:var(--d-line2);background:var(--d-well)}:root[data-theme="dark"] .site-caption,:root[data-theme="dark"] .photo-summary{color:var(--d-t3)}:root[data-theme="dark"] .conversation-list button{border-bottom-color:var(--line);color:var(--d-t2)}:root[data-theme="dark"] .conversation-list time{color:var(--d-t3)}:root[data-theme="dark"] .current-work{color:var(--d-t2)}:root[data-theme="dark"] .bottom-line,:root[data-theme="dark"] .bottom-line button{color:var(--d-t3)}:root[data-theme="dark"] .help-link{color:var(--b-82-3)!important}:root[data-theme="dark"] dialog{background:var(--d-raise);border-color:var(--d-line2);box-shadow:0 30px 100px var(--s-black-a80)}:root[data-theme="dark"] dialog::backdrop{background:var(--s-black-a67)}:root[data-theme="dark"] .dialog-description{color:var(--d-t2)}:root[data-theme="dark"] .dialog-foot{background:var(--d-well);color:var(--d-t3)}:root[data-theme="dark"] .destination-item{border-color:var(--d-line2);background:var(--d-fill);color:var(--n-88)}:root[data-theme="dark"] .destination-item .icon{color:var(--b-71)}:root[data-theme="dark"] .destination-item small{color:var(--d-t3)}:root[data-theme="dark"] .destination-item:hover{background:var(--n-25-3)}:root[data-theme="dark"] .search-input,:root[data-theme="dark"] .value-row input,:root[data-theme="dark"] .photo-notes,:root[data-theme="dark"] .preview-composer textarea,:root[data-theme="dark"] .placement select{background:var(--d-well);border-color:var(--d-line2);color:var(--ink)}:root[data-theme="dark"] ::placeholder{color:var(--n-62-2)}:root[data-theme="dark"] .search-result{background:transparent;border-bottom-color:var(--line)}:root[data-theme="dark"] .search-result:hover{background:var(--d-fill)}:root[data-theme="dark"] .search-result span,:root[data-theme="dark"] .empty-search,:root[data-theme="dark"] .demo-caption,:root[data-theme="dark"] .thread-date{color:var(--d-t3)}:root[data-theme="dark"] .lead-detail{border-color:var(--d-line2)}:root[data-theme="dark"] .lead-detail summary:after{color:var(--b-71-2)}:root[data-theme="dark"] .lead-detail summary small{color:var(--d-t3)}:root[data-theme="dark"] .lead-inside p{color:var(--d-t2)}:root[data-theme="dark"] .choice-row button{border-color:var(--d-line2);background:var(--d-fill)}:root[data-theme="dark"] .report-tabs button,:root[data-theme="dark"] .inbox-tabs button{background:var(--d-fill2);color:var(--d-t2)}:root[data-theme="dark"] .section-selector{background:var(--n-20-2)}:root[data-theme="dark"] .section-selector button{background:var(--d-fill2);border-color:var(--d-line2)}:root[data-theme="dark"] .choice-row button[aria-pressed="true"],:root[data-theme="dark"] .report-tabs button[aria-pressed="true"],:root[data-theme="dark"] .inbox-tabs button[aria-pressed=true],:root[data-theme="dark"] .section-selector button[aria-pressed=true]{background:var(--d-inv);border-color:var(--d-inv);color:var(--d-inv-ink)}:root[data-theme="dark"] .preview-status{color:var(--b-79)}:root[data-theme="dark"] .calls-fold{border-top-color:var(--line)}:root[data-theme="dark"] .calls-fold>summary{color:var(--d-t2)}:root[data-theme="dark"] .calls-fold p{color:var(--d-t3)}:root[data-theme="dark"] .photo-uses{color:var(--d-t2)}:root[data-theme="dark"] .photo-uses input{accent-color:var(--b-82-4)}:root[data-theme="dark"] .photo-picker button{background:var(--d-fill2)}:root[data-theme="dark"] .photo-favourite{background:var(--d-fill2)}:root[data-theme="dark"] .photo-favourite[aria-pressed="true"]{background:var(--b-34);color:var(--b-91)}:root[data-theme="dark"] .source-note{color:var(--d-t3)}:root[data-theme="dark"] .source-note a{color:var(--b-80)}:root[data-theme="dark"] .work-detail{border-bottom-color:var(--line)}:root[data-theme="dark"] .work-detail p{color:var(--d-t2)}:root[data-theme="dark"] .report-totals div{background:var(--d-fill)}:root[data-theme="dark"] .report-totals span,:root[data-theme="dark"] .report-totals small{color:var(--d-t3)}:root[data-theme="dark"] .website-window{border-color:var(--d-line2)}:root[data-theme="dark"] .window-label{background:var(--d-fill);color:var(--d-t2);border-bottom-color:var(--d-line2)}:root[data-theme="dark"] .feedback-box p{color:var(--d-t3)}:root[data-theme="dark"] .local-comment{background:var(--n-25-4)}:root[data-theme="dark"] .local-comment small{color:var(--b-76)}:root[data-theme="dark"] .placement{background:var(--n-21-2);border-color:var(--d-line2)}:root[data-theme="dark"] .placement small{color:var(--d-t3)}:root[data-theme="dark"] .inbox-row{border-bottom-color:var(--line)}:root[data-theme="dark"] .inbox-row p,:root[data-theme="dark"] .inbox-row small{color:var(--d-t3)}:root[data-theme="dark"] .theme-toggle .theme-sun{display:block}:root[data-theme="dark"] .theme-toggle .theme-moon{display:none}
/* Text sizes, 30 Sep 2026. Body 18px, smallest 14.4px.
   Sizes only: no colours here, so both themes keep their own. Panels size to their
   content, so the page scrolls on a laptop. The sidebar stays put and scrolls inside. */
:root body{font-size:18px}:root .preview-label{position:sticky;top:0;z-index:20;font-size:14.4px;letter-spacing:.9px}:root .shell{grid-template-columns:268px minmax(0,1fr)}:root .sidebar{position:sticky;top:30px;align-self:start;height:calc(100vh - 30px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--n-31-3) transparent;padding:18px 14px 12px;gap:13px}:root .brand{width:160px;margin-left:12px}:root .workspace{padding:10px;gap:11px}:root .workspace-icon{width:38px;height:38px;font-size:15.6px}:root .workspace strong{font-size:16.8px}:root .workspace small{font-size:14.4px}:root .nav-group+.nav-group{margin-top:10px}:root .sidebar-label{font-size:14.4px;letter-spacing:1.1px;margin-bottom:6px}:root .nav-list{gap:2px}:root .sidebar .nav-item{font-size:16.8px;padding:6px 12px;min-height:34px;gap:12px}:root .nav-item .icon{width:20px;height:20px}:root .account{margin-top:12px;padding:0 4px;gap:9px}:root .account .icon-button{width:28px;height:28px}:root .account .avatar{width:38px;height:38px;font-size:14.4px}:root .account strong{font-size:16.8px}:root .account small{font-size:14.4px}:root .topbar{height:68px;padding:0 32px}:root .breadcrumb{font-size:16.8px}:root .search-trigger{width:230px;padding:9px 12px;font-size:16.8px}:root .search-trigger .icon{width:18px;height:18px}:root .icon-button{width:38px;height:38px}:root .notification-dot{right:7px;top:5px}:root .content{padding:28px 32px}:root .welcome{margin-bottom:24px}:root .welcome h1{font-size:38.4px}:root .welcome p{font-size:18px;margin-top:8px}:root .eyebrow{font-size:14.4px;letter-spacing:1.2px}:root .button{font-size:16.8px;padding:11px 16px}:root .button .icon{width:18px;height:18px}:root .link-button{font-size:16.2px}:root .top-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:18px;margin-bottom:24px}:root .numbers,:root .attention{height:auto;padding:22px}:root .panel h2{font-size:19.2px}:root .period{font-size:15.6px}:root .numbers .metric-row{margin-top:20px;margin-bottom:18px}:root .metric-label{font-size:15.6px;margin-bottom:8px}:root .metric-value{font-size:36px}:root .metric-note{font-size:14.4px;margin-top:6px}:root .lead-list-title{font-size:15.6px;padding:14px 0 8px}:root .inline-count{font-size:14.4px;padding:3px 7px}:root .lead-badge{font-size:14.4px;padding:4px 8px}:root .lead-preview{font-size:16.8px;padding:11px 0;gap:12px;grid-template-columns:minmax(0,1fr) 160px 150px}:root .lead-preview small{font-size:14.4px;margin-top:3px}:root .lead-preview .via{font-size:15px}:root .lead-preview .lead-badge{font-size:14.4px;max-width:none;justify-self:end}:root .calls-strip{font-size:15.6px;padding-top:12px}:root .calls-strip .icon{width:17px;height:17px}:root .calls-strip button{font-size:15.6px}:root .attention .eyebrow{font-size:14.4px}:root .turn-badge{font-size:14.4px;padding:4px 8px}:root .attention-body{grid-template-columns:minmax(0,1fr) 96px;gap:16px;margin-top:18px}:root .attention h2{font-size:28.8px;max-width:none}:root .attention p{font-size:16.8px;line-height:1.5;max-width:none;margin-top:8px}:root .photo-stack{height:112px}:root .photo-stack img{width:96px;height:110px}:root .attention .request-actions{margin-top:16px;gap:14px}:root .request-actions .button{font-size:16.2px;padding:10px 14px}:root .request-list{margin-top:auto;padding-top:10px}:root .attention .request-list{margin-top:18px}:root .request-list button{font-size:16.8px;padding:8px 0}:root .request-list .icon{width:18px;height:18px}:root .request-list .request-tag{font-size:14.4px}:root .section-row{margin:0 0 12px}:root .section-row h2{font-size:16.8px}:root .workspace-grid{grid-template-columns:minmax(0,1.12fr) repeat(3,minmax(0,1fr));gap:18px}:root .workspace-grid .panel{height:auto;min-height:300px;padding:20px}:root .card-title{gap:8px}:root .card-title h2{font-size:19.2px}:root .card-title>.icon{width:21px;height:21px}:root .pill{font-size:14.4px;padding:4px 8px}:root .site-thumb{height:140px;margin-top:16px}:root .site-caption{font-size:15px;margin-top:8px}:root .card-footer{padding-top:14px}:root .card-footer .link-button{font-size:16.2px}:root .conversation-list{margin-top:12px}:root .conversation-list button{font-size:16.8px;padding:11px 0}:root .conversation-list time{font-size:14.4px;margin-top:4px}:root .gallery .gallery-images{height:140px;margin-top:16px}:root .photo-summary{font-size:15px;margin-top:9px}:root .current-work{font-size:16.8px;margin-top:18px;gap:14px}:root .current-work li:before{margin-top:8px}:root .bottom-line{font-size:15px;margin-top:22px}:root .bottom-line button{font-size:15px}:root dialog{width:min(740px,88vw)}:root dialog.dialog-wide{width:min(1200px,94vw)}:root .dialog-top{padding:22px 26px}:root .dialog-top h2{font-size:26.4px}:root .dialog-description{font-size:18px}:root .destination-item{font-size:17.4px;padding:14px}:root .destination-item small{font-size:15.6px}:root .dialog-foot{font-size:15px}:root .search-input{font-size:18px}:root .search-result b{font-size:18px}:root .search-result span{font-size:15.6px}:root .empty-search{font-size:16.8px}:root .demo-caption{font-size:15.6px}:root .lead-detail summary{font-size:18px}:root .lead-detail summary small{font-size:15px}:root .lead-inside p{font-size:17.4px}:root .choice-row button{font-size:16.2px;padding:10px 14px}:root .value-row{font-size:16.2px}:root .value-row input{width:150px;padding:10px}:root .preview-status{font-size:15px;min-height:16px}:root .calls-fold>summary{font-size:16.8px}:root .calls-fold p{font-size:16.2px}:root .field-label{font-size:16.2px}:root .photo-uses{font-size:16.8px}:root .photo-notes{font-size:16.8px}:root .photo-meta h3{font-size:19.2px}:root .photo-favourite{font-size:15.6px;padding:8px 12px}:root .placement select{font-size:16.8px}:root .placement small{font-size:15px}:root .source-note{font-size:15.6px}:root .thread-date{font-size:15.6px}:root .preview-composer textarea{font-size:18px}:root .report-tabs button{font-size:16.2px;padding:9px 12px}:root .report-totals span{font-size:15.6px}:root .report-totals strong{font-size:33.6px}:root .report-totals small{font-size:15px}:root .work-detail h3{font-size:19.2px}:root .work-detail p{font-size:17.4px}:root .inbox-tabs button{font-size:16.2px;padding:9px 12px}:root .inbox-row strong{font-size:18px}:root .inbox-row p{font-size:16.2px}:root .inbox-row small{font-size:15px}:root .inbox-row .turn-badge{font-size:14.4px}:root .window-label{font-size:15px}:root .section-selector button{font-size:15.6px;padding:8px 10px}:root .feedback-box h3{font-size:20.4px}:root .feedback-box p{font-size:16.2px}:root .local-comment{font-size:16.8px}:root .local-comment small{font-size:14.4px}
/* A card's label (the Inbox's "All answered", Google's review count) sits
   beside the title when both fit and wraps under it when they do not. Never
   clipped, never widening the card: the head wraps, its children may shrink,
   and a label too long for the card on its own line wraps its own words. */
:root .panel-head{flex-wrap:wrap;row-gap:6px}
:root .panel-head>*{min-width:0}
:root .panel-head .pill{max-width:100%;white-space:normal}
@media(max-width:1240px){:root .shell{grid-template-columns:248px minmax(0,1fr)}:root .content{padding-left:24px;padding-right:24px}:root .topbar{padding-left:24px;padding-right:24px}:root .lead-preview{grid-template-columns:minmax(0,1fr) 140px 132px}}
@media(max-height:860px){:root .sidebar{gap:12px;padding-top:18px}:root .nav-group+.nav-group{margin-top:8px}:root .sidebar .nav-item{min-height:33px;padding-top:4px;padding-bottom:4px}}
@media(max-height:800px){:root .sidebar{gap:10px;padding:14px 14px 10px}:root .nav-group+.nav-group{margin-top:6px}:root .sidebar .nav-item{min-height:31px;padding-top:3px;padding-bottom:3px}:root .account{margin-top:8px;padding-top:10px}}
@media(max-height:740px){:root .sidebar .nav-item{min-height:29px;padding-top:2px;padding-bottom:2px}:root .workspace{padding:7px 10px}:root .sidebar-label{margin-bottom:3px}}
/* Overview rulings, 30 Sep 2026: the parts brought across from the live dashboard.
   Sizes match the standard text block above. Colours are tokens, set for both themes. */

:root .day-line{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;font-size:15.6px;color:var(--x-ink2);margin:0 0 14px}
:root .day-line b{font-weight:600;color:var(--x-ink)}
:root .day-line #quotes-waiting{font-weight:600;color:var(--x-warn)}
:root .day-line [hidden]{display:none}
:root .lead-preview.x-lead{grid-template-columns:minmax(0,1fr) auto auto auto;gap:14px}
:root .x-lead .x-lead-main{min-width:0}
:root .x-lead .x-lead-main small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root .x-time{font-size:14.4px;color:var(--x-ink3);white-space:nowrap}
:root .via-tag{display:inline-block;font-size:14.4px;font-weight:600;border-radius:999px;padding:3px 10px;white-space:nowrap;background:var(--v-direct-bg);color:var(--v-direct)}
:root .via-tag.v-ad{background:var(--v-ad-bg);color:var(--v-ad)}
:root .via-tag.v-search{background:var(--v-search-bg);color:var(--v-search)}
:root .via-tag.v-gbp{background:var(--v-gbp-bg);color:var(--v-gbp)}
:root .x-meta{display:flex;align-items:center;gap:10px;margin-top:6px;font-size:14.4px;color:var(--x-ink3)}
:root .lead-detail summary small{white-space:normal}
:root .lead-badge.is-empty{display:none}:root .lead-detail summary>div{flex:1;min-width:0}
:root .x-msg{font-size:17px;font-style:italic;color:var(--x-ink)}
:root .x-facts{display:grid;grid-template-columns:max-content 1fr;gap:6px 18px;font-size:16px;margin:0 0 14px}
:root .x-facts span{color:var(--x-ink3)}
:root .x-facts b{font-weight:500;color:var(--x-ink)}
:root .x-track{display:flex;align-items:center;gap:10px;margin:16px 0 0;font-size:15.6px;font-weight:600;color:var(--x-ink3)}
:root .x-track span{font-size:14.4px;background:var(--x-raise);border:1px solid var(--x-line);border-radius:999px;padding:2px 10px}
:root .x-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}
:root .x-fig{margin:4px 0 18px}
:root .x-fig img{display:block;width:100%;border-radius:10px;border:1px solid var(--x-line)}
:root .x-fig figcaption{font-size:15.6px;color:var(--x-ink2);margin-top:10px;line-height:1.5}
:root .x-fig figcaption b{display:block;color:var(--x-ink);margin-bottom:2px}
:root .x-acct{display:flex;align-items:center;gap:14px;font-size:17px}
:root .x-acct .avatar{width:44px;height:44px;font-size:16px;background:var(--x-chip);color:var(--x-chip-ink)}
:root .x-acct small{display:block;font-size:15px;color:var(--x-ink3);margin-top:2px}
:root .x-mods{display:grid;gap:10px}
:root .x-mod{display:grid;grid-template-columns:1fr auto;gap:10px 16px;align-items:center;border:1px solid var(--x-line);border-radius:12px;padding:16px;background:var(--x-raise)}
:root .x-mod b{font-size:18px}
:root .x-mod p{font-size:15.6px;color:var(--x-ink2);margin-top:4px}
:root .x-mod .button{grid-column:1/-1;justify-self:start}
:root .nav-item .count[hidden]{display:none}:root a.button{text-decoration:none}:root a.button.light{color:var(--x-ink)}:root a.button.dark{color:var(--s-white)}:root[data-theme="dark"] a.button.dark{color:var(--d-inv-ink)}

/* Inbox, after the Switchboard's */
:root dialog .ib{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:16px;align-items:start}
:root .ib-side{display:grid;gap:16px}
:root .ib-pane{border:1px solid var(--x-line);border-radius:14px;background:var(--x-panel);min-width:0}
:root .ib-head{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding:12px;border-bottom:1px solid var(--x-line)}
:root .ib-tabs{display:flex;flex-wrap:wrap;gap:6px}
:root .ib-tab{font-size:14.4px;font-weight:600;padding:8px 12px;border-radius:999px;border:1px solid var(--x-line);background:transparent;color:var(--x-ink2)}
:root .ib-tab[aria-pressed="true"]{background:var(--x-ink);border-color:var(--x-ink);color:var(--x-panel)}
:root .ib-items{list-style:none;margin:0;padding:6px;display:grid;gap:2px;max-height:430px;overflow-y:auto}
:root .ib-item{width:100%;display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;text-align:left;padding:11px 10px;border-radius:10px;background:transparent}
:root .ib-item:hover{background:var(--x-raise)}
:root .ib-item.on{background:var(--x-chip)}
:root .ib-glyph{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--x-chip);color:var(--x-chip-ink)}
:root .ib-glyph.off{background:transparent;color:var(--x-ink3);box-shadow:inset 0 0 0 1px var(--x-line)}
:root .ib-glyph .icon{width:17px;height:17px}
:root .ib-main{display:grid;gap:3px;min-width:0}
:root .ib-top{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
:root .ib-top b{font-size:16.2px;font-weight:600;color:var(--x-ink);line-height:1.3}
:root .ib-top time{font-size:14.4px;color:var(--x-ink3);white-space:nowrap}
:root .ib-snip{font-size:14.4px;color:var(--x-ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root .ib-foot{display:flex;flex-wrap:wrap;gap:6px;margin-top:3px}
:root .ib-chip,:root .ib-pin{font-size:14.4px;font-weight:600;border-radius:999px;padding:2px 9px;background:var(--x-raise);color:var(--x-ink2);border:1px solid var(--x-line)}
:root .ib-chip.wait{background:var(--x-warn-bg);color:var(--x-warn);border-color:transparent}
:root .ib-empty,:root .ib-none{list-style:none;padding:16px;font-size:15.6px;color:var(--x-ink3)}
:root .ib-lines{padding:12px}
:root .ib-label{font-size:14.4px;font-weight:700;color:var(--x-ink3);margin:0 4px 6px}
:root .ib-group{font-size:14.4px;color:var(--x-ink3);margin:12px 4px 4px}
:root .ib-line{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:6px 4px;border-radius:9px;cursor:pointer}
:root .ib-line:hover{background:var(--x-raise)}
:root .ib-more{width:100%;border:0;background:transparent;text-align:left;font:inherit;color:inherit}
:root .ib-more .ib-lname{color:var(--x-ink2)}
:root .ib-mod{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px}
:root .ib-mod small{display:block;font-size:14.4px;color:var(--x-ink3)}
:root .ib-lname{font-size:15.6px;color:var(--x-ink)}
:root .ib-lname small{display:block;font-size:14.4px;color:var(--x-ink3)}
:root .ib-switch{appearance:none;-webkit-appearance:none;width:40px;height:23px;border-radius:999px;background:var(--x-line);position:relative;cursor:pointer;margin:0}
:root .ib-switch::before{content:"";position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:var(--s-white);box-shadow:0 1px 2px var(--s-black-a27);transition:transform .15s}
:root .ib-switch:checked{background:var(--b-62-11)}
:root .ib-switch:checked::before{transform:translateX(17px)}
:root .ib-switch:disabled{cursor:default;opacity:.7}
:root .ib-note{margin:8px 0 2px;padding:14px;border-radius:10px;background:var(--x-warn-bg);display:grid;gap:6px}
:root .ib-note b{font-size:16.2px;color:var(--x-ink)}
:root .ib-note p{font-size:15px;color:var(--x-ink2)}
:root .ib-thread{position:sticky;top:0}
:root .ib-thead{padding:16px 18px 12px;border-bottom:1px solid var(--x-line)}
:root .ib-thead h3{font-size:20.4px;font-weight:600;color:var(--x-ink)}
:root .ib-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px;font-size:14.4px;color:var(--x-ink3)}
:root .ib-msgs{list-style:none;margin:0;padding:16px;display:flex;flex-direction:column;gap:12px;background:var(--x-raise);max-height:340px;overflow-y:auto}
:root .ib-msg{max-width:86%;display:grid;gap:4px}
:root .ib-msg.mine{align-self:flex-end}
:root .ib-bubble{padding:11px 14px;border-radius:14px;border:1px solid var(--x-line);background:var(--x-panel);font-size:16.2px;line-height:1.55;color:var(--x-ink);white-space:pre-wrap}
:root .ib-msg.mine .ib-bubble{background:var(--x-mine)}
:root .ib-mmeta{font-size:14.4px;color:var(--x-ink3)}
:root .ib-msg.mine .ib-mmeta{text-align:right}
:root .ib-link{padding:12px 18px 0}
:root .ib-form{padding:14px 18px 18px;display:grid;gap:6px}
:root .ib-form .field-label{margin:4px 0 2px}
:root .ib-form textarea{width:100%;min-height:90px;padding:12px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:16.8px/1.5 Inter,system-ui,Arial,sans-serif;resize:vertical}
:root .ib-hint{font-size:14.4px;color:var(--x-ink3)}
:root .ib-seg{display:inline-flex;justify-self:start;border:1px solid var(--x-line);border-radius:999px;overflow:hidden}
:root .ib-seg button{font-size:15px;font-weight:600;padding:9px 16px;color:var(--x-ink2)}
:root .ib-seg button[aria-pressed="true"]{background:var(--x-ink);color:var(--x-panel)}
@media(max-width:1100px){:root dialog .ib{grid-template-columns:minmax(0,1fr)}:root .ib-thread{position:static}}
/* Report rulings, 30 Sep 2026: the monthly report, how it compares and since we started, from the
   live Report page; September so far, simpler. Chart colours checked for colour-blind separation
   and contrast in both themes. */
:root .rp-cap{font-size:15.6px;color:var(--x-ink3);margin:0 0 16px;max-width:780px;line-height:1.5}
:root .rp-cap .link-button{margin-left:12px;color:var(--x-ink2)}
:root .rp-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 22px}
:root .rp-tile{background:var(--x-raise);border:1px solid var(--x-line);border-radius:12px;padding:16px}
:root .rp-tile span{display:block;font-size:15.6px;color:var(--x-ink3);margin-bottom:8px}
:root .rp-tile strong{display:block;font-size:33.6px;font-weight:520;letter-spacing:-.6px;line-height:1.05;color:var(--x-ink);font-variant-numeric:tabular-nums}
:root .rp-tile small{display:block;font-size:14.4px;color:var(--x-ink3);margin-top:8px;line-height:1.4}
:root .rp h3{font-size:19.2px;font-weight:600;color:var(--x-ink);margin:28px 0 12px}
:root .rp h3+.rp-cap{margin-top:-6px}
:root .rp-text{font-size:17.4px;line-height:1.6;color:var(--x-ink2);margin:0 0 10px;max-width:780px}
:root .rp-split{display:flex;gap:2px;height:16px;border-radius:4px;overflow:hidden;margin:4px 0 12px;max-width:780px}
:root .rp-split i{display:block;height:100%}
:root .rp-key{display:flex;flex-wrap:wrap;gap:8px 24px;font-size:16.2px;color:var(--x-ink2);margin-bottom:12px}
:root .rp-key span{display:flex;align-items:center;gap:8px}
:root .rp-key i{width:12px;height:12px;border-radius:3px}
:root .rp-key b{font-weight:600;color:var(--x-ink);font-variant-numeric:tabular-nums}
:root .rp-ranges{display:grid;gap:14px;margin:8px 0 18px}
:root .rp-range{display:grid;grid-template-columns:270px minmax(0,1fr);gap:24px;align-items:center;padding:12px 0;border-bottom:1px solid var(--x-line)}
:root .rp-range:last-child{border-bottom:0}
:root .rp-rl b{display:block;font-size:17px;font-weight:600;color:var(--x-ink);line-height:1.35}
:root .rp-rl small{display:block;font-size:14.4px;color:var(--x-ink3);margin-top:4px}
:root .rp-track{position:relative;height:78px;margin:0 60px 0 40px}
:root .rp-track::before{content:"";position:absolute;left:0;right:0;top:37px;height:2px;border-radius:2px;background:var(--x-line)}
:root .rp-band{position:absolute;top:28px;height:20px;border-radius:4px;background:var(--rp-band)}
:root .rp-band span{position:absolute;top:26px;left:50%;transform:translateX(-50%);font-size:14.4px;color:var(--x-ink3);white-space:nowrap}
:root .rp-dot{position:absolute;top:22px;width:4px;height:32px;margin-left:-2px;border-radius:2px;background:var(--x-ink)}
:root .rp-dot span{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);font-size:15.6px;font-weight:600;color:var(--x-ink);white-space:nowrap}
:root .rp-chart{max-width:680px;margin:4px 0 16px}
:root .rp-bars{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:18px;align-items:end;height:230px;border-bottom:1px solid var(--x-line)}
:root .rp-bar{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
:root .rp-bar b{font-size:18px;font-weight:600;color:var(--x-ink);margin-bottom:6px;font-variant-numeric:tabular-nums}
:root .rp-bar i{display:block;width:58%;max-width:84px;min-height:2px;border-radius:4px 4px 0 0;background:var(--rp-bar)}
:root .rp-bar.now i{background:var(--rp-now)}
:root .rp-caps{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:18px;padding-top:8px}
:root .rp-caps span{text-align:center;font-size:15px;line-height:1.35;color:var(--x-ink3)}
:root .rp-fold{margin-top:18px;border:1px solid var(--x-line);border-radius:12px;padding:0 16px}
:root .rp-fold summary{padding:14px 0;cursor:pointer;font-size:17px;font-weight:600;color:var(--x-ink)}
:root .rp-fold[open]{padding-bottom:10px}
:root .rp-table{width:100%;max-width:880px;border-collapse:collapse;font-size:16.2px;margin:4px 0 8px}
:root .rp-table th,:root .rp-table td{padding:10px 10px;border-bottom:1px solid var(--x-line);text-align:left;color:var(--x-ink)}
:root .rp-table th{font-size:14.4px;font-weight:600;color:var(--x-ink3)}
:root .rp-table tr:last-child td{border-bottom:0}
:root .rp-table .n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
:root .rp-after{margin-top:16px}
@media(max-width:1240px){:root .rp-range{grid-template-columns:220px minmax(0,1fr)}}
/* Google Ads rulings, 30 Sep 2026. Cost per enquiry comes across whole; month against month,
   your ads on Google, market reach and campaigns and keywords are the simpler versions. */
:root .ad-seg{display:inline-flex;border:1px solid var(--x-line);border-radius:999px;overflow:hidden;margin:0 0 14px}
:root .ad-seg button{font-size:15px;font-weight:600;padding:9px 16px;color:var(--x-ink2);background:transparent}
:root .ad-seg button[aria-pressed="true"]{background:var(--x-ink);color:var(--x-panel)}
:root .rp-tiles.ad-three{grid-template-columns:repeat(3,minmax(0,1fr));max-width:900px}
:root .ad-cpe{max-width:540px}
:root .ad-cpe .rp-bars,:root .ad-cpe .rp-caps{grid-template-columns:repeat(3,minmax(0,1fr))}
:root .rp-tile .ad-chg{display:inline-block;font-size:14.4px;font-weight:600;border-radius:999px;padding:2px 9px;margin-top:10px;background:var(--x-raise);border:1px solid var(--x-line);color:var(--x-ink2)}
:root .ad-camps{display:grid;gap:10px;max-width:880px;margin:4px 0 8px}
:root .ad-camp{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px 26px;align-items:baseline;padding:14px 16px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise)}
:root .ad-camp b{font-size:17px;font-weight:600;color:var(--x-ink)}
:root .ad-camp small{display:block;font-size:14.4px;color:var(--x-ink3);margin-top:4px}
:root .ad-camp .n{font-size:22px;font-weight:560;color:var(--x-ink);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
:root .ad-camp .n small{text-align:right}
:root .ad-where{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:28px;align-items:start}
:root .ad-shot{margin:0;border:1px solid var(--x-line);border-radius:12px;overflow:hidden;background:var(--s-white)}
:root .ad-shot img{display:block;width:100%;height:auto}
:root .ad-shot figcaption{padding:12px 14px;font-size:15.6px;line-height:1.5;color:var(--x-ink2);background:var(--x-raise);border-top:1px solid var(--x-line)}
:root .ad-shot figcaption b{display:block;color:var(--x-ink)}
:root .ad-hero{font-size:72px;font-weight:560;letter-spacing:-2px;line-height:1;color:var(--x-ink);margin:4px 0 6px;font-variant-numeric:tabular-nums}
:root .ad-hero+p{font-size:18px;color:var(--x-ink2);margin:0 0 20px}
:root .ad-hbars{display:grid;gap:12px;margin:0 0 18px}
:root .ad-hbar{display:grid;grid-template-columns:190px minmax(0,1fr);gap:14px;align-items:center;font-size:15.6px;color:var(--x-ink2)}
:root .ad-hbar div{display:flex;align-items:center;gap:10px}
:root .ad-hbar i{display:block;height:18px;border-radius:0 4px 4px 0;background:var(--rp-bar)}
:root .ad-hbar.you i{background:var(--rp-now)}
:root .ad-hbar b{font-size:16.2px;font-weight:600;color:var(--x-ink);font-variant-numeric:tabular-nums}
:root .ad-budgets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 10px}
:root .ad-budget{padding:14px 16px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise)}
:root .ad-budget span{display:block;font-size:15.6px;color:var(--x-ink2)}
:root .ad-budget strong{display:block;font-size:28px;font-weight:540;color:var(--x-ink);margin-top:6px;font-variant-numeric:tabular-nums}
:root .ad-budget small{display:block;font-size:14.4px;color:var(--x-warn);margin-top:4px}
:root .ad-kw{font-size:16.2px;line-height:1.7;color:var(--x-ink2);margin:0 0 12px}
:root .rp-fold h4{font-size:16.2px;font-weight:600;color:var(--x-ink);margin:14px 0 6px}
:root .ad-kwgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
:root .ad-kwgrid .rp-table{font-size:15px}
@media(max-width:1240px){:root .ad-where{grid-template-columns:minmax(0,1fr)}:root .ad-kwgrid{grid-template-columns:minmax(0,1fr)}}
/* Website rulings, 30 Sep 2026. Status and Traffic come across whole, Search visibility is
   simpler, and page feedback stays from the demo. */
:root .ws-open{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 18px;align-items:start;padding:16px 18px;border-radius:12px;background:var(--x-warn-bg);margin:0 0 22px;max-width:980px}
:root .ws-open b{display:block;font-size:17.4px;color:var(--x-ink)}
:root .ws-open p{font-size:16.2px;line-height:1.6;color:var(--x-ink2);margin-top:6px}
:root .ws-open a{color:var(--x-ink)}
:root .ws-chip{font-size:14.4px;font-weight:600;border-radius:999px;padding:3px 10px;background:var(--x-chip);color:var(--x-chip-ink);white-space:nowrap}
:root .ws-done{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 28px;max-width:1080px}
:root .ws-done li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;font-size:16.2px;line-height:1.5;color:var(--x-ink2)}
:root .ws-done li b{color:var(--x-ink);font-weight:600}
:root .ws-done .icon{width:20px;height:20px;color:var(--rp-now);margin-top:2px}
:root .ws-bars td{vertical-align:middle}
:root .ws-bar{display:flex;align-items:center;gap:10px;min-width:220px}
:root .ws-bar i{display:block;height:14px;border-radius:0 4px 4px 0;background:var(--rp-now);flex:none}
:root .ws-bar b{font-weight:600;font-variant-numeric:tabular-nums}
:root .ws-note{font-size:15.6px;line-height:1.5;color:var(--x-ink3);margin:6px 0 12px;max-width:780px}
@media(max-width:1240px){:root .ws-done{grid-template-columns:minmax(0,1fr)}}
/* Website, 2 Oct 2026: To approve, New pages and Page changes are one row each. */
:root .ws-list{display:grid;gap:10px;max-width:980px;margin:4px 0 18px}
:root .ws-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 22px;align-items:center;padding:14px 16px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise)}
:root .ws-item b{display:block;font-size:17px;font-weight:600;color:var(--x-ink)}
:root .ws-item p{font-size:16.2px;line-height:1.5;color:var(--x-ink2);margin-top:4px}
:root .ws-item small{display:block;font-size:14.4px;color:var(--x-ink3);margin-top:6px}
:root .ws-item .ws-chip{display:inline-block;margin-bottom:8px}
:root .ws-item.is-ok .ws-chip{background:var(--green);color:var(--brand-ink)}
:root .ws-acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
:root .ws-item .button .icon{width:14px;height:14px}
:root .ws-form,:root .ws-ask .preview-status{grid-column:1/-1}
:root .ws-form{display:grid;gap:8px;justify-items:start}
:root .ws-form textarea{width:100%;min-height:92px;resize:vertical;padding:12px 14px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:16.2px/1.6 Inter,system-ui,Arial,sans-serif}
:root .ws-form[hidden]{display:none}
:root .ws-empty{padding:18px 20px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise);max-width:980px;margin-bottom:6px}
:root .ws-empty b{display:block;font-size:17.4px;color:var(--x-ink)}
:root .ws-empty p{font-size:16.2px;line-height:1.6;color:var(--x-ink2);margin-top:6px}
@media(max-width:700px){:root .ws-item{grid-template-columns:minmax(0,1fr)}:root .ws-acts{justify-content:flex-start}}
/* Google rulings, 30 Sep 2026. Google Search, Business Profile and the review link come across
   whole; Where you appear and Google Maps are the simpler versions. */
:root .g-chips{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 10px;max-width:1080px}
:root .g-chips span{font-size:15.6px;font-weight:500;padding:6px 12px;border-radius:999px;background:var(--x-chip);color:var(--x-chip-ink)}
:root .g-chart{max-width:1000px;margin:8px 0 16px}
:root .g-shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start;margin:4px 0 12px}
:root .g-shots .ad-shot.big{grid-column:1/-1;max-width:1000px}
:root .g-shots img{cursor:zoom-in}
:root .g-shots .big img{cursor:zoom-out}
:root .g-copy{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:6px 0 8px}
:root .g-copy code{font:15px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--x-ink2);background:var(--x-raise);border:1px solid var(--x-line);border-radius:8px;padding:6px 10px}
@media(max-width:1240px){:root .g-shots{grid-template-columns:minmax(0,1fr)}}
/* Dispatch, 30 Sep 2026. A coming-soon Mod: the demo behind its card in Mods.
   Plan: ~/Studio/plainblack/handoffs/dispatch-mod.md. Made-up customers, nothing live.
   Colours are the tokens above, so both themes work. */
:root .x-mod .x-row{grid-column:1/-1;margin-top:0}
:root .dp-note{display:inline-block;font-size:14.4px;font-weight:600;border-radius:999px;padding:3px 10px;background:var(--x-warn-bg);color:var(--x-warn);margin:0 0 12px}
:root .dp-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:18px;align-items:start}
:root .dp-card{border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise);padding:16px 18px;min-width:0}
:root .dp-card h3{font-size:17.4px;font-weight:600;color:var(--x-ink);margin:0 0 10px}
:root .dp-card .x-facts{margin:0 0 12px}
:root .dp-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
:root .dp-list{margin:0 0 12px;padding-left:22px;display:grid;gap:6px;font-size:17.4px;line-height:1.5;color:var(--x-ink2)}
:root .dp-toggle{appearance:none;-webkit-appearance:none;flex:none;width:40px;height:23px;border-radius:999px;background:var(--x-line);position:relative;cursor:pointer;margin:0}
:root .dp-toggle::before{content:"";position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:var(--s-white);box-shadow:0 1px 2px var(--s-black-a27);transition:transform .15s}
:root .dp-toggle:checked{background:var(--b-62-11)}
:root .dp-toggle:checked::before{transform:translateX(17px)}
:root .dp-out{display:grid;gap:8px;padding:14px 16px;border-radius:12px;background:var(--x-chip);color:var(--x-chip-ink);font-size:16.2px;line-height:1.5}
:root .dp-out b{font-weight:600}
:root .dp-foot{margin-top:22px}
/* The WhatsApp tab as the customer's phone. The phone follows the page theme. */
:root .dp-phone-grid{grid-template-columns:auto minmax(0,1fr)}
:root .dp-phonewrap{margin:0;display:grid;justify-items:center;gap:10px}
:root .dp-phonewrap figcaption{font-size:14.4px;color:var(--x-ink3)}
:root .dp-phone{--wa-bg:var(--s-grey-94);--wa-dot:var(--s-grey-87);--wa-head:var(--s-grey-97);--wa-text:var(--s-grey-22);--wa-sub:var(--s-blue-56-2);--wa-in:var(--s-white);--wa-out:var(--s-green-96);--wa-time:var(--s-blue-56-2);--wa-time-out:var(--s-blue-56-2);--wa-tick:var(--s-blue-75);--wa-chip:var(--s-white);--wa-field:var(--s-white);--wa-line:var(--s-grey-89);
  width:375px;height:812px;padding:11px;border-radius:56px;background:var(--s-grey-14);box-shadow:0 0 0 1.5px var(--s-grey-35),0 24px 60px var(--s-black-a27);flex:none}
:root[data-theme="dark"] .dp-phone{--wa-bg:var(--s-grey-19);--wa-dot:var(--s-blue-24);--wa-head:var(--s-blue-28);--wa-text:var(--s-grey-94-2);--wa-sub:var(--s-blue-66-2);--wa-in:var(--s-blue-29);--wa-out:var(--s-green-42);--wa-time:var(--s-blue-66-2);--wa-time-out:var(--s-teal-79);--wa-chip:var(--s-grey-25);--wa-field:var(--s-blue-34);--wa-line:var(--s-blue-34);box-shadow:0 0 0 1.5px var(--s-grey-39),0 24px 60px var(--s-black-a67)}
:root .wa-screen{position:relative;height:100%;border-radius:45px;overflow:hidden;display:flex;flex-direction:column;background:var(--wa-bg);color:var(--wa-text);font:15px/1.35 -apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Arial,sans-serif}
:root .wa-island{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:104px;height:31px;border-radius:20px;background:var(--s-black);z-index:2}
:root .wa-status{display:flex;justify-content:space-between;align-items:center;height:48px;padding:8px 30px 0 38px;background:var(--wa-head);font-size:15.5px}
:root .wa-status b{font-weight:600}
:root .wa-status span{display:flex;gap:6px;align-items:center}
:root .wa-status svg{height:12px;width:auto;fill:currentColor}
:root .wa-head{display:flex;align-items:center;gap:10px;padding:4px 16px 9px 12px;background:var(--wa-head);border-bottom:1px solid var(--wa-line)}
:root .wa-back{width:12px;height:20px;flex:none}
:root .wa-av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--b-39);color:var(--s-white);font-size:13px;font-weight:700;flex:none}
:root .wa-who{flex:1;min-width:0;display:grid;line-height:1.2}
:root .wa-who b{font-size:16px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root .wa-who small{font-size:12.5px;color:var(--wa-sub)}
:root .wa-acts{display:flex;gap:18px}
:root .wa-acts svg{width:22px;height:22px}
:root .wa-chat{flex:1;overflow-y:auto;padding:6px 14px 8px;background-color:var(--wa-bg);background-image:radial-gradient(var(--wa-dot) 1.1px,transparent 1.4px);background-size:22px 22px;scrollbar-width:none}
:root .wa-chat::-webkit-scrollbar{display:none}
:root .wa-day{display:block;width:max-content;margin:2px auto 2px;padding:4px 10px;border-radius:8px;background:var(--wa-chip);color:var(--wa-sub);font-size:12.5px;box-shadow:0 1px .5px var(--s-grey-19-a13)}
:root .wa-row{display:flex;margin-top:2px}
:root .wa-row.first{margin-top:8px}
:root .wa-row.out{justify-content:flex-end}
:root .wa-bubble{position:relative;max-width:82%;padding:6px 9px 7px;border-radius:9px;background:var(--wa-in);font-size:14.5px;line-height:1.33;box-shadow:0 1px .5px var(--s-grey-19-a13);overflow-wrap:anywhere}
:root .wa-row.out .wa-bubble{background:var(--wa-out)}
:root .wa-row.first.in .wa-bubble{border-top-left-radius:0}
:root .wa-row.first.out .wa-bubble{border-top-right-radius:0}
:root .wa-row.first .wa-bubble::before{content:"";position:absolute;top:0;width:8px;height:13px;background:inherit}
:root .wa-row.first.in .wa-bubble::before{left:-8px;clip-path:polygon(0 0,100% 0,100% 100%)}
:root .wa-row.first.out .wa-bubble::before{right:-8px;clip-path:polygon(0 0,100% 0,0 100%)}
:root .wa-sp{display:inline-block;width:52px;height:1px}
:root .wa-row.out .wa-sp{width:74px}
:root .wa-time{position:absolute;right:8px;bottom:4px;display:flex;align-items:center;gap:3px;font-size:11px;color:var(--wa-time);white-space:nowrap}
:root .wa-row.out .wa-time{color:var(--wa-time-out)}
:root .wa-tick{width:17px;height:11px;color:var(--wa-tick)}
:root .wa-bubble.pic{padding:3px}
:root .wa-photo{position:relative;display:block}
:root .wa-photo>svg{display:block;width:190px;height:auto;border-radius:6px}
:root .wa-row .wa-photo .wa-time{right:7px;bottom:5px;color:var(--s-white);text-shadow:0 1px 2px var(--s-black-a60)}
:root .wa-bar{display:flex;align-items:center;gap:12px;padding:8px 12px;background:var(--wa-head);color:var(--wa-sub);border-top:1px solid var(--wa-line)}
:root .wa-bar svg{width:23px;height:23px;flex:none}
:root .wa-field{flex:1;padding:7px 14px;border-radius:18px;background:var(--wa-field);border:1px solid var(--wa-line);font-size:15px;color:var(--wa-sub)}
:root .wa-home{height:24px;flex:none;background:var(--wa-head);display:grid;place-items:center}
:root .wa-home::before{content:"";width:130px;height:5px;border-radius:3px;background:var(--wa-text)}
/* The after-hours call as the Dispatch app: the agent on the call, what it has captured,
   and beside it the response library it answers from and the lead it saves. Always dark. */
:root .dp-phone.ds-app,:root[data-theme="dark"] .dp-phone.ds-app{--wa-head:var(--n-13);--wa-text:var(--n-96-9)}
:root .ds-screen{position:relative;height:100%;border-radius:45px;overflow:hidden;display:flex;flex-direction:column;background:var(--n-13);color:var(--n-96-9);font:14px/1.4 Inter,system-ui,Arial,sans-serif}
:root .ds-bar{display:flex;justify-content:space-between;align-items:center;padding:4px 16px 10px}
:root .ds-logo{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:700;letter-spacing:-.3px}
:root .ds-logo i{width:10px;height:10px;border-radius:50%;background:var(--b-74);box-shadow:0 0 0 4px var(--b-74-a20)}
:root .ds-live{font-size:12.5px;font-weight:600;color:var(--b-74-2);background:var(--b-74-a12);border-radius:999px;padding:4px 10px;font-variant-numeric:tabular-nums}
:root .ds-live.off{color:var(--n-71-2);background:var(--s-white-a7)}
:root .ds-caller{display:flex;align-items:center;gap:12px;margin:0 12px;padding:11px 12px;border-radius:16px;background:var(--n-19-2);border:1px solid var(--n-27-2)}
:root .ds-av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--b-74);color:var(--b-22);flex:none}
:root .ds-av svg{width:20px;height:20px}
:root .ds-caller b{display:block;font-size:15.5px}
:root .ds-caller small{display:block;font-size:12.5px;color:var(--n-71-2)}
:root .ds-wave{margin-left:auto;display:flex;align-items:center;gap:3px;height:26px}
:root .ds-wave i{width:3px;height:8px;border-radius:2px;background:var(--b-74);animation:ds-wave 1s ease-in-out infinite}
:root .ds-wave i:nth-child(2){animation-delay:.12s}:root .ds-wave i:nth-child(3){animation-delay:.24s}:root .ds-wave i:nth-child(4){animation-delay:.36s}:root .ds-wave i:nth-child(5){animation-delay:.48s}:root .ds-wave i:nth-child(6){animation-delay:.6s}:root .ds-wave i:nth-child(7){animation-delay:.72s}
:root .ds-wave.off i{animation:none;height:3px;background:var(--n-38-2)}
@keyframes ds-wave{0%,100%{height:6px}50%{height:24px}}
:root .ds-cap{display:flex;justify-content:space-between;margin:12px 16px 6px;font-size:11.5px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--n-66-4)}
:root .ds-cap b{color:var(--b-74);font-weight:700}
:root .ds-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0 12px}
:root .ds-f{padding:7px 10px;border-radius:12px;background:var(--n-19-2);border:1px solid var(--n-27-2);min-width:0;transition:border-color .4s,background .4s}
:root .ds-f span{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--n-66-4);text-transform:uppercase;letter-spacing:.6px;font-weight:600}
:root .ds-f span svg{width:13px;height:13px;color:var(--b-74);stroke-width:2.4}
:root .ds-f:not(.got) span svg{display:none}
:root .ds-f b{display:block;font-size:13.5px;font-weight:600;margin-top:2px;line-height:1.3;color:var(--n-45)}
:root .ds-f.got{border-color:var(--b-74-a40)}
:root .ds-f.got b{color:var(--n-96-9)}
:root .ds-f.alert{background:var(--s-red-22);border-color:var(--s-red-63-a60)}
:root .ds-f.alert b{color:var(--s-red-79)}
:root .ds-f.alert span svg{color:var(--s-red-79)}
:root .ds-talk{flex:1;overflow-y:auto;padding:12px 12px 6px;display:flex;flex-direction:column;gap:8px;scrollbar-width:none}
:root .ds-talk::-webkit-scrollbar{display:none}
:root .ds-line{max-width:86%;padding:8px 11px;border-radius:14px;background:var(--n-22-3);font-size:13.8px;line-height:1.4;animation:ds-in .35s ease-out}
:root .ds-line small{display:block;font-size:11px;color:var(--n-66-4);margin-bottom:2px}
:root .ds-line.ag{align-self:flex-end;background:var(--b-31-2);border-bottom-right-radius:4px}
:root .ds-line.cl{align-self:flex-start;border-bottom-left-radius:4px}
:root .ds-sys{align-self:center;max-width:94%;font-size:11.5px;color:var(--n-71-2);background:var(--s-white-a5);border-radius:999px;padding:3px 10px;text-align:center;animation:ds-in .35s ease-out}
:root .ds-sys.alert{color:var(--s-red-79);background:var(--s-red-63-a15)}
:root .ds-dots{display:flex;gap:4px;padding:10px 12px;align-self:flex-start;background:var(--n-22-3);border-radius:14px}
:root .ds-dots i{width:6px;height:6px;border-radius:50%;background:var(--n-66-4);animation:ds-dot 1s infinite}
:root .ds-dots i:nth-child(2){animation-delay:.2s}:root .ds-dots i:nth-child(3){animation-delay:.4s}
@keyframes ds-dot{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes ds-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
:root .ds-act{margin:6px 12px 8px;padding:12px 14px;border-radius:14px;background:var(--n-19-2);border:1px solid var(--n-27-2);font-size:14px;font-weight:600;color:var(--n-71-2);display:flex;align-items:center;gap:10px;transition:background .4s,color .4s}
:root .ds-act::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
:root .ds-act.alert{color:var(--s-red-79);border-color:var(--s-red-63-a40);background:var(--s-red-22)}
:root .ds-act.on{color:var(--b-22);background:var(--b-74);border-color:var(--b-74)}
:root .ds-side{display:grid;gap:14px;align-content:start;min-width:0}
:root .ds-side .dp-card h3{display:flex;align-items:center;gap:10px}
:root .ds-lib{list-style:none;margin:0;padding:0;display:grid;gap:6px}
:root .ds-lib li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:9px 12px;border-radius:10px;border:1px solid var(--x-line);background:var(--x-panel);transition:border-color .4s,background .4s}
:root .ds-lib b{font-size:15.6px;font-weight:600;color:var(--x-ink)}
:root .ds-lib span{grid-column:1;font-size:14.4px;color:var(--x-ink3)}
:root .ds-lib em{grid-row:1/3;grid-column:2;align-self:center;font-style:normal;font-size:13.5px;font-weight:600;border-radius:999px;padding:3px 10px;background:var(--x-raise);color:var(--x-ink3);border:1px solid var(--x-line);white-space:nowrap}
:root .ds-lib li.used{border-color:var(--s-green-62-a60);background:var(--x-chip)}
:root .ds-lib li.used em{background:var(--b-62-11);color:var(--s-white);border-color:transparent}
:root .ds-lib li.new{border-style:dashed;border-color:var(--x-warn);animation:ds-in .35s ease-out}
:root .ds-lib li.new em{background:var(--x-warn-bg);color:var(--x-warn);border-color:transparent}
:root .ds-save{font-size:13.5px;font-weight:600;border-radius:999px;padding:3px 10px;background:var(--x-raise);color:var(--x-ink3);border:1px solid var(--x-line)}
:root .ds-save.done{background:var(--b-62-11);color:var(--s-white);border-color:transparent}
@media(prefers-reduced-motion:reduce){:root .ds-wave i,:root .ds-dots i,:root .ds-line,:root .ds-sys,:root .ds-lib li.new{animation:none}}
/* When the owner gets woken, on the owner's phone: the emergency call at night, played step by step,
   and the lock screen the next morning. Always dark. */
:root .dp-phone.wk-app,:root[data-theme="dark"] .dp-phone.wk-app{--wa-head:transparent;--wa-text:var(--s-white)}
:root .wk-screen{position:relative;height:100%;border-radius:45px;overflow:hidden;display:flex;flex-direction:column;color:var(--s-white);font:15px/1.35 -apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Arial,sans-serif;background:radial-gradient(120% 60% at 20% 8%,var(--b-37) 0,transparent 60%),radial-gradient(90% 60% at 90% 92%,var(--s-blue-30) 0,transparent 60%),var(--n-14)}
:root .wk-screen.day{background:radial-gradient(120% 70% at 30% 0,var(--s-blue-51) 0,transparent 62%),radial-gradient(100% 70% at 80% 100%,var(--s-amber-65) 0,transparent 60%),var(--s-blue-27-2)}
:root .wk-body{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;padding:0 22px}
:root .wk-top{display:grid;justify-items:center;gap:4px;margin-top:56px;text-align:center;animation:ds-in .35s ease-out}
:root .wk-top.small{margin-top:22px}
:root .wk-av{width:86px;height:86px;border-radius:50%;display:grid;place-items:center;background:var(--b-31-2);box-shadow:0 0 0 1px var(--s-white-a13);font-size:34px;font-weight:600;margin-bottom:8px}
:root .wk-av i{width:22px;height:22px;border-radius:50%;background:var(--b-74);box-shadow:0 0 0 7px var(--b-74-a20)}
:root .wk-av.cust{background:var(--s-blue-51-2)}
:root .wk-name{font-size:32px;font-weight:400;letter-spacing:-.3px;line-height:1.2}
:root .wk-sub{font-size:16px;color:var(--s-white-a70)}
:root .wk-btns{margin-top:auto;margin-bottom:30px;width:100%;display:flex;justify-content:space-between;padding:0 16px}
:root .wk-btn{display:grid;justify-items:center;gap:8px;font-size:14px}
:root .wk-round{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;color:var(--s-white)}
:root .wk-round svg{width:32px;height:32px;stroke-width:2}
:root .wk-round.no{background:var(--s-red-65)}
:root .wk-round.no svg{transform:rotate(135deg)}
:root .wk-round.yes{background:var(--s-green-73)}
:root .wk-round.pulse{animation:wk-pulse 1.2s ease-out infinite}
@keyframes wk-pulse{0%{box-shadow:0 0 0 0 var(--s-green-73-a67)}100%{box-shadow:0 0 0 22px var(--s-green-73-a0)}}
:root .wk-caps{margin-top:18px;width:100%;flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;padding:14px 16px;border-radius:22px;background:var(--s-white-a8)}
:root .wk-caps small{margin-bottom:auto;font-size:11.5px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--s-white-a50)}
:root .wk-caps p{font-size:17px;line-height:1.35;color:var(--s-white-a50);animation:ds-in .35s ease-out}
:root .wk-caps p.now{color:var(--s-white);font-weight:500}
:root .wk-ctl{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;width:100%;margin-top:18px}
:root .wk-ctl span{display:grid;justify-items:center;gap:6px;font-size:13px;color:var(--s-white-a80)}
:root .wk-ci{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--s-white-a15)}
:root .wk-ci svg{width:26px;height:26px}
:root .wk-pad{display:grid;grid-template-columns:repeat(3,58px);gap:10px 22px;justify-content:center;margin-top:14px}
:root .wk-pad span{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--s-white-a15);font-size:26px;transition:background .2s,transform .2s}
:root .wk-pad span.glow{box-shadow:0 0 0 2px var(--b-74);animation:wk-glow 1s ease-in-out infinite}
@keyframes wk-glow{50%{box-shadow:0 0 0 7px var(--b-74-a33)}}
:root .wk-pad span.hit{background:var(--b-74);color:var(--b-22);transform:scale(.94)}
:root .wk-end{margin:16px 0 24px}
:root .wk-end .wk-round{width:66px;height:66px}
:root .wk-note{margin-top:22px;padding:10px 14px;border-radius:14px;background:var(--s-white-a8);font-size:14.5px;color:var(--s-white-a80);text-align:center;animation:ds-in .35s ease-out}
:root .wk-note+.wk-ctl{margin-top:auto}
:root .wk-lock{display:grid;justify-items:center;margin-top:6px;text-align:center}
:root .wk-lock small{font-size:17px;font-weight:600;color:var(--s-white-a85)}
:root .wk-lock b{font-size:84px;font-weight:600;letter-spacing:-2px;line-height:1.05}
:root .wk-notes{margin-top:auto;display:grid;gap:8px;width:100%;padding-bottom:10px}
:root .wk-n{display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;padding:11px 12px;border-radius:20px;background:var(--s-white-a18);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);animation:ds-in .35s ease-out}
:root .wk-ic{width:38px;height:38px;border-radius:10px;background:var(--n-13);display:grid;place-items:center}
:root .wk-ic i{width:12px;height:12px;border-radius:50%;background:var(--b-74);box-shadow:0 0 0 4px var(--b-74-a20)}
:root .wk-nh{display:flex;justify-content:space-between;font-size:12.5px;color:var(--s-white-a70)}
:root .wk-nh b{font-weight:600;letter-spacing:.3px}
:root .wk-nt{font-size:15px;font-weight:600;margin-top:1px}
:root .wk-nb{font-size:14.5px;color:var(--s-white-a88)}
:root .wk-lockbar{display:flex;justify-content:space-between;width:100%;padding:6px 20px 12px}
:root .wk-lk{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:var(--s-white-a15)}
:root .wk-lk svg{width:22px;height:22px}
:root .ds-side .ib-seg{flex-wrap:wrap}
@media(prefers-reduced-motion:reduce){:root .wk-round.pulse,:root .wk-pad span.glow,:root .wk-top,:root .wk-caps p,:root .wk-n,:root .wk-note{animation:none}}
/* Where calls go, as the Dispatch app's settings screen. Same dark app as the call. */
:root .st-scroll{flex:1;min-height:0;overflow-y:auto;padding:2px 16px 14px;scrollbar-width:none}
:root .st-scroll::-webkit-scrollbar{display:none}
:root .st-title{font-size:30px;font-weight:700;letter-spacing:-.5px;margin:4px 2px 0}
:root .st-sub{font-size:13px;color:var(--n-66-4);margin:2px 2px 0}
:root .st-h{font-size:12px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;color:var(--n-66-4);margin:18px 14px 6px}
:root .st-group{border-radius:14px;background:var(--n-20-3);border:1px solid var(--n-27-2);overflow:hidden}
:root .st-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;padding:0 14px;font-size:15.5px;cursor:pointer}
:root .st-row+.st-row{border-top:1px solid var(--n-27-2)}
:root .st-val{display:flex;align-items:center;gap:4px;color:var(--b-74)}
:root .st-row input[type=time],:root .st-row select{appearance:none;-webkit-appearance:none;background:transparent;border:0;color:var(--b-74);font:500 15.5px Inter,system-ui,Arial,sans-serif;text-align:right;padding:6px 0;color-scheme:dark;cursor:pointer}
:root .st-row input[type=time]::-webkit-calendar-picker-indicator{filter:invert(1);opacity:.5}
:root .st-row select option{color:var(--n-96-9);background:var(--n-20-3)}
:root .st-chev{font-style:normal;font-size:18px;color:var(--n-48)}
:root .st-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:3px;background:var(--n-25-5);border-radius:12px}
:root .st-seg button{padding:9px 4px;border-radius:9px;font-size:13.5px;font-weight:600;color:var(--n-86);background:transparent;line-height:1.2}
:root .st-seg button[aria-pressed="true"]{background:var(--b-74);color:var(--b-22)}
:root .st-help{font-size:12.5px;color:var(--n-66-4);margin:7px 14px 0;line-height:1.4}
:root .st-row .dp-toggle{background:var(--n-32)}
:root .st-row .dp-toggle:checked{background:var(--b-74)}
:root .st-tabs{display:grid;grid-template-columns:repeat(4,1fr);padding:8px 6px 0;border-top:1px solid var(--n-27-2);background:var(--n-13)}
:root .st-tabs span{display:grid;justify-items:center;gap:3px;font-size:10.5px;font-weight:600;color:var(--n-57-2)}
:root .st-tabs svg{width:22px;height:22px}
:root .st-tabs span.on{color:var(--b-74)}
@media(max-width:1100px){:root .dp-grid{grid-template-columns:minmax(0,1fr)}:root .dp-phone-grid{grid-template-columns:minmax(0,1fr)}}
/* Leads, 30 Sep 2026: the pipeline, each lead's journey, the funnel and the quote generator. */
:root .ld-ex{display:inline-block;font-size:14.4px;font-weight:700;border-radius:999px;padding:2px 10px;margin-right:8px;background:var(--x-warn-bg);color:var(--x-warn)}
:root .ld-strip{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 16px;font-size:16.2px;color:var(--x-ink2)}
:root .ld-strip b{font-size:20px;font-weight:600;color:var(--x-ink);font-variant-numeric:tabular-nums}
:root .ld-strip i{font-style:normal;color:var(--x-ink3)}
:root .ld-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:start}
:root .ld-col{background:var(--x-raise);border:1px solid var(--x-line);border-radius:14px;padding:10px;min-height:240px}
:root .ld-colhead{display:flex;justify-content:space-between;align-items:baseline;padding:4px 6px 10px;font-size:16.2px;font-weight:600;color:var(--x-ink)}
:root .ld-colhead span{font-size:14.4px;font-weight:500;color:var(--x-ink3)}
:root .ld-card{display:block;width:100%;text-align:left;background:var(--x-panel);border:1px solid var(--x-line);border-radius:10px;padding:12px;margin-bottom:8px;color:var(--x-ink)}
:root .ld-card:hover{border-color:var(--x-ink3)}
:root .ld-card b{display:block;font-size:16.2px;font-weight:600;line-height:1.3}
:root .ld-card small{display:block;font-size:14.4px;color:var(--x-ink3);margin:3px 0 9px}
:root .ld-cmeta{display:flex;align-items:center;justify-content:space-between;gap:8px}
:root .ld-val{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--x-ink)}
:root .ld-col.no .ld-card{opacity:.9}
:root .ld-empty{font-size:14.4px;color:var(--x-ink3);padding:6px}
:root .ld-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 6px}
:root .ld-detail{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:26px;align-items:start}
:root .ld-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin:0 0 14px}
:root .ld-head h3{font-size:25px;font-weight:600;letter-spacing:-.3px;color:var(--x-ink)}
:root .ld-head p{font-size:15.6px;color:var(--x-ink3);margin-top:4px}
:root .ld-chip{font-size:14.4px;font-weight:600;border-radius:999px;padding:3px 10px;white-space:nowrap;background:var(--x-chip);color:var(--x-chip-ink)}
:root .ld-chip.q{background:var(--x-warn-bg);color:var(--x-warn)}
:root .ld-chip.b{background:var(--rp-now);color:var(--s-white)}
:root .ld-chip.n{background:var(--x-raise);color:var(--x-ink3);border:1px solid var(--x-line)}
:root .ld-journey{list-style:none;margin:6px 0 8px;padding:0 0 0 24px;position:relative}
:root .ld-journey::before{content:"";position:absolute;left:8px;top:14px;bottom:14px;width:2px;background:var(--x-line)}
:root .ld-journey li{position:relative;padding:7px 0;font-size:16.2px;color:var(--x-ink)}
:root .ld-journey li::before{content:"";position:absolute;left:-21px;top:13px;width:12px;height:12px;border-radius:50%;background:var(--x-panel);border:2px solid var(--rp-now)}
:root .ld-journey li.done::before{background:var(--rp-now)}
:root .ld-journey li small{display:block;font-size:14.4px;color:var(--x-ink3);margin-top:2px}
:root .ld-box{border:1px solid var(--x-line);border-radius:12px;padding:16px;background:var(--x-raise);margin-bottom:12px}
:root .ld-box h4{font-size:17.4px;font-weight:600;color:var(--x-ink);margin:0 0 8px;display:flex;align-items:center;justify-content:space-between;gap:10px}
:root .ld-box p{font-size:15.6px;line-height:1.5;color:var(--x-ink2)}
:root .ld-box .x-row{margin-top:12px}
:root .ld-box .choice-row button{background:var(--x-panel);border-color:var(--x-line);color:var(--x-ink)}
:root .ld-box .choice-row button[aria-pressed="true"]{background:var(--x-ink);border-color:var(--x-ink);color:var(--x-panel)}
:root .ld-money{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:16.2px;color:var(--x-ink2)}
:root .ld-money input{font:16.2px/1.3 Inter,system-ui,Arial,sans-serif;color:var(--x-ink);background:var(--x-panel);border:1px solid var(--x-line);border-radius:8px;padding:9px 10px}
:root .ld-money input{width:150px}
:root .ld-funnel{display:grid;gap:6px;max-width:960px;margin:8px 0 24px}
:root .ld-stage{display:grid;grid-template-columns:180px minmax(0,1fr);gap:14px;align-items:center}
:root .ld-stage>span{font-size:16.8px;color:var(--x-ink)}
:root .ld-stage .ws-bar i{height:34px;border-radius:0 6px 6px 0}
:root .ld-stage .ws-bar b{font-size:20px}
:root .ld-rate{font-size:14.4px;color:var(--x-ink3);padding-left:194px;margin:-2px 0 2px}
:root .qg-doc{background:var(--s-white);color:var(--n-25);border-radius:14px;padding:26px;box-shadow:0 10px 40px var(--s-black-a20);border:1px solid var(--n-93-9)}
:root .qg-doc header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;border-bottom:2px solid var(--n-25);padding-bottom:14px;margin-bottom:16px}
:root .qg-doc header b{display:block;font-size:20px;font-weight:700;letter-spacing:-.3px}
:root .qg-doc header small,:root .qg-doc .qg-to small{display:block;font-size:13.5px;color:var(--n-50);margin-top:3px}
:root .qg-doc header span{font-size:13.5px;font-weight:700;color:var(--s-green-46);background:var(--s-green-95);border-radius:999px;padding:3px 10px}
:root .qg-to{margin-bottom:14px;font-size:15.6px}
:root .qg-doc table{width:100%;border-collapse:collapse;font-size:14.4px}
:root .qg-doc th,:root .qg-doc td{padding:8px 4px;border-bottom:1px solid var(--n-93-9);text-align:left;vertical-align:top}
:root .qg-doc th{font-size:12.6px;color:var(--n-50);font-weight:600}
:root .qg-doc .n{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
:root .qg-doc .qg-dsum{display:grid;grid-template-columns:1fr auto;gap:4px 16px;max-width:260px;margin:12px 0 0 auto;font-size:14.4px;font-variant-numeric:tabular-nums}
:root .qg-doc .qg-dsum .t{font-size:17px;font-weight:700}
:root .qg-doc footer{margin-top:18px;padding-top:12px;border-top:1px solid var(--n-93-9);font-size:12.6px;color:var(--n-50);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

:root .rp .ld-head h3{margin:0}
:root .x-mod .x-row{grid-column:1/-1;margin-top:0}
/* The Quote mod, after quote.js: an opened lead, the customer table and the three-step quote. */
:root .ld-acts{margin-top:16px}
:root .ld-mini{display:inline-block;margin:-4px 0 9px;font-size:13.2px;padding:2px 8px}
:root .ld-chip.ld-st-contacted,:root .ld-chip.ld-st-quote-drafted{background:var(--x-raise);color:var(--x-ink2);border:1px solid var(--x-line)}
:root .ld-chip.ld-st-quote-sent{background:var(--x-warn-bg);color:var(--x-warn)}
:root .ld-chip.ld-st-booked,:root .ld-chip.ld-st-invoiced{background:var(--rp-now);color:var(--s-white)}
:root .ld-chip.ld-st-no-job{background:var(--x-raise);color:var(--x-ink3);border:1px solid var(--x-line)}
:root .ld-quotes{display:grid;gap:8px;margin:14px 0 4px}
:root .ld-qrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise)}
:root .ld-qrow b{display:block;font-size:16.2px;color:var(--x-ink)}
:root .ld-qrow span{display:block;font-size:14.4px;color:var(--x-ink3);margin-top:2px}
:root .ld-client>summary{font-size:17.4px;font-weight:600;color:var(--x-ink);cursor:pointer}
:root .ld-client[open]>summary{margin-bottom:10px}
:root .ld-tscroll{overflow-x:auto;border:1px solid var(--x-line);border-radius:12px}
:root .ld-table{max-width:none;margin:0}
:root .ld-table th,:root .ld-table td{white-space:nowrap}
:root .ld-table tbody tr{cursor:pointer}
:root .ld-table tbody tr:hover td{background:var(--x-raise)}
:root .ld-st{font-weight:600}
:root .ld-st.ld-st-booked,:root .ld-st.ld-st-invoiced{color:var(--brand-text)}
:root .ld-st.ld-st-quote-sent,:root .ld-st.ld-st-quote-drafted{color:var(--x-warn)}
:root .ld-st.ld-st-new{color:var(--s-red-56)}
:root[data-theme="dark"] .ld-st.ld-st-new{color:var(--s-red-76)}
:root .ld-st.ld-st-no-job{color:var(--x-ink3)}
:root .ld-stage .ws-bar b small{display:block;font-size:14.4px;font-weight:500;color:var(--x-ink3)}
:root .ld-stage .ws-bar.f1 i{background:var(--x-warn)}
:root .fqv{border:1px solid var(--x-line);border-radius:16px;background:var(--x-raise);overflow:hidden;max-width:980px}
:root .fqv-head{padding:16px 18px 12px;background:var(--x-panel);border-bottom:1px solid var(--x-line)}
:root .rp .fqv-head h3{margin:0;font-size:21.6px;font-weight:600;color:var(--x-ink)}
:root .fqv-head p{margin-top:4px;font-size:15px;color:var(--x-ink3)}
:root .fqv-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px 18px;background:var(--x-panel);border-bottom:1px solid var(--x-line)}
:root .fqv-steps button{min-height:42px;border-radius:9px;background:var(--x-raise);color:var(--x-ink3);font-size:15.6px;font-weight:600}
:root .fqv-steps button[aria-current="true"]{background:var(--x-ink);color:var(--x-panel)}
:root .fqv-body{padding:14px 18px;display:grid;gap:12px}
:root .fqv-card{background:var(--x-panel);border:1px solid var(--x-line);border-radius:12px;padding:14px 16px}
:root .fqv-card h4,:root .fqv-inside>summary{font-size:17.4px;font-weight:600;color:var(--x-ink);margin:0 0 8px}
:root .fqv-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
:root .fqv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}
:root .fqv-grid3{grid-template-columns:repeat(3,minmax(0,1fr))}
:root .fqv-field{display:grid;gap:4px;align-content:start;margin-top:8px}
:root .fqv-field>span{font-size:14.4px;font-weight:600;color:var(--x-ink3)}
:root .fqv-field small{font-size:13.2px;color:var(--x-ink3)}
:root .fqv-field input,:root .fqv-field select,:root .fqv-field textarea,:root .fqv-line input,:root .fqv-line textarea{width:100%;min-height:42px;padding:8px 11px;border:1px solid var(--x-line);border-radius:8px;background:var(--x-raise);color:var(--x-ink);font:16.2px/1.4 Inter,system-ui,Arial,sans-serif}
:root .fqv-field textarea,:root .fqv-line textarea{resize:vertical}
:root .fqv-check{display:flex;align-items:center;gap:8px;min-height:42px;margin-top:28px;font-size:16.2px;font-weight:600;color:var(--x-ink)}
:root .fqv-check input{width:20px;height:20px;accent-color:var(--b-63-3)}
:root .fqv-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px}
:root .fqv-chips>span{flex:0 0 100%;font-size:14.4px;font-weight:600;color:var(--x-ink3)}
:root .fqv-chip{min-height:34px;padding:0 12px;border-radius:999px;border:1.5px dashed var(--x-ink2);background:var(--x-raise);color:var(--x-ink);font-size:15px;font-weight:600}
:root .fqv-lines{display:grid;gap:8px;margin-top:6px}
:root .fqv-line{display:grid;grid-template-columns:minmax(0,1fr) 70px 70px 170px 104px 36px;gap:8px;align-items:start}
:root .fqv-lh span{font-size:13.2px;font-weight:700;color:var(--x-ink3)}
:root .fqv-line input[data-fq-qty],:root .fqv-line input[data-fq-unit]{text-align:center}
:root .fqv-price{display:grid;gap:3px}
:root .fqv-price small{font-size:13.2px;color:var(--x-ink3);line-height:1.35}
:root .fqv-remember{font-size:13.2px;text-align:left}
:root .fqv-remember[hidden]{display:none}
:root .fqv-lt{padding-top:10px;text-align:right;font-weight:600;color:var(--x-ink);font-variant-numeric:tabular-nums}
:root .fqv-line .icon-button{width:36px;height:42px;color:var(--x-ink3)}
:root .fqv-add{justify-self:start;margin-top:4px}
:root .fqv-totals,:root .fqv-calc{display:grid;gap:4px;margin:12px 0 4px;padding-top:10px;border-top:1px solid var(--x-line)}
:root .fqv-totals p,:root .fqv-calc p{display:flex;justify-content:space-between;gap:10px;font-size:16.2px;color:var(--x-ink2);font-variant-numeric:tabular-nums}
:root .fqv-totals b,:root .fqv-calc b{color:var(--x-ink)}
:root .fqv-totals p.g{font-size:18px;font-weight:600;color:var(--x-ink)}
:root .fqv-calc .fqv-target{display:block;font-size:15.6px}
:root .fqv-inside>summary{display:flex;align-items:center;gap:10px;cursor:pointer;margin:0}
:root .fqv-tag{font-size:13.2px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--x-warn-bg);color:var(--x-warn)}
:root .fqv-warn{font-size:15px;font-weight:600;color:var(--x-warn);background:var(--x-warn-bg);border-radius:8px;padding:8px 10px;margin:6px 0}
:root .fqv-sum p{font-size:16.2px;color:var(--x-ink3)}
:root .fqv-sum p b{font-size:30px;font-weight:600;color:var(--x-ink)}
:root .fqv-status{border-color:var(--x-ink2)}
:root .fqv-ask{font-size:17px;font-weight:600;color:var(--x-ink);margin-bottom:6px}
:root .fqv-yes{background:var(--s-green-61);color:var(--s-white)}
:root .fqv-no{background:var(--x-ink3);color:var(--x-panel)}
:root .fqv-foot{display:flex;align-items:center;gap:10px;padding:12px 18px;background:var(--x-panel);border-top:1px solid var(--x-line)}
:root .fqv-spacer{flex:1}
:root .fqv-danger{color:var(--s-red-56)}
:root #fq-msg{padding:0 18px}
:root #fq-msg:empty{display:none}
:root .qg-notes{margin-top:12px;font-size:13.5px;color:var(--n-42);white-space:pre-wrap}
@media(max-width:1240px){:root .ld-board{grid-template-columns:repeat(2,minmax(0,1fr))}:root .ld-detail{grid-template-columns:minmax(0,1fr)}:root .fqv-line{grid-template-columns:minmax(0,1fr) 60px 60px 150px 90px 36px}}
:root .fqv-photos{margin:10px 0 4px}
:root .fqv-pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;max-width:520px}
:root .fqv-pgrid button{display:block;aspect-ratio:1/1;border-radius:9px;overflow:hidden;border:1px solid var(--x-line);background:var(--x-raise);padding:0}
:root .fqv-pgrid img{display:block;width:100%;height:100%;object-fit:cover}
:root .fqv-pbig{margin:10px 0 0;max-width:560px}
:root .fqv-pbig img{display:block;width:100%;border-radius:10px;border:1px solid var(--x-line)}
:root .fqv-pbig figcaption{font-size:14.4px;color:var(--x-ink3);margin-top:6px}
:root .fqv-padd{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:8px}
:root .fqv-addp{position:relative;cursor:pointer}
:root .fqv-hidden{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer}
:root .fqv-airow{margin-top:12px}
:root .fqv-ai{border:1.5px solid var(--s-purple-57);color:var(--s-purple-46);background:var(--s-purple-95)}
:root[data-theme="dark"] .fqv-ai{border-color:var(--s-purple-68);color:var(--s-purple-87);background:var(--s-purple-25)}
:root .fqv-ai:disabled{opacity:.7}
:root .fqv-aiout{margin-top:10px;padding:12px 14px;border-radius:10px;background:var(--s-purple-95);color:var(--s-purple-28)}
:root[data-theme="dark"] .fqv-aiout{background:var(--s-purple-25-2);color:var(--s-purple-92)}
:root .fqv-aisum{font-size:16.2px;font-weight:600;margin-bottom:6px}
:root .fqv-label{font-size:14.4px;font-weight:700;opacity:.8}
:root .fqv-aiout ul{margin:4px 0 0;padding-left:20px;font-size:15.6px;line-height:1.5}
:root .fqv-aiout .rp-cap{color:inherit;opacity:.75}
/* Review replies, 30 Sep 2026, after the live Reviews page: their words left, the reply right. */
:root .rv-bar{position:sticky;top:-22px;z-index:3;display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:10px 0;margin:0 0 16px;background:var(--x-panel);border-bottom:1px solid var(--x-line)}
:root[data-theme="dark"] .rv-bar{background:var(--d-raise)}
:root .rv-tally{display:flex;flex-wrap:wrap;gap:8px;flex:1}
:root .rv-tal{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid var(--x-line);border-radius:999px;background:var(--x-raise);color:var(--x-ink);font-size:15px;font-weight:600}
:root .rv-tal[aria-pressed="true"]{border-color:var(--x-ink);background:var(--x-chip)}
:root .rv-dot{width:9px;height:9px;border-radius:50%;background:var(--x-ink3)}
:root .rv-dot-ok{background:var(--rp-now)}
:root .rv-dot-done{background:var(--x-line);box-shadow:inset 0 0 0 2px var(--x-ink3)}
:root .rv-dot-none{background:var(--x-warn)}
:root .rv-n{font-weight:500;color:var(--x-ink3);font-variant-numeric:tabular-nums}
:root .rv-n b{color:var(--x-ink)}
:root .rv-save{font-size:14.4px;color:var(--x-ink3)}
:root .rv-list{display:grid;gap:14px}
:root .rv{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);border:1px solid var(--x-line);border-radius:14px;overflow:hidden;background:var(--x-panel)}
:root .rv.is-ok{border-color:var(--rp-now);box-shadow:0 0 0 2px color-mix(in srgb,var(--rp-now) 25%,transparent)}
:root .rv.is-done{background:var(--x-raise)}
:root .rv.is-done .rv-text,:root .rv.is-done .rv-box,:root .rv.is-done .field-label{display:none}
:root .rv-said{padding:18px 20px;background:var(--x-raise);border-right:1px solid var(--x-line)}
:root .rv-who{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px}
:root .rv-who b{font-size:17px;color:var(--x-ink)}
:root .rv-stars{color:var(--s-amber-72);letter-spacing:1px;font-size:15px}
:root .rv-when{font-size:14.4px;color:var(--x-ink3)}
:root .rv-text{margin-top:10px;font-size:16.2px;line-height:1.6;color:var(--x-ink2);white-space:pre-line}
:root .rv-none{font-style:italic;color:var(--x-ink3)}
:root .rv-mine{padding:18px 20px;display:grid;gap:10px;align-content:start}
:root .rv-head{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:26px}
:root .rv-head .field-label{margin:0}
:root .rv-box{width:100%;min-height:92px;resize:vertical;overflow:hidden;padding:12px 14px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-raise);color:var(--x-ink);font:16.2px/1.6 Inter,system-ui,Arial,sans-serif}
:root .rv-foot{display:flex;justify-content:flex-end;gap:10px}
@media(max-width:1100px){:root .rv{grid-template-columns:minmax(0,1fr)}:root .rv-said{border-right:0;border-bottom:1px solid var(--x-line)}}

:root .rv-pills{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
:root .ld-chip.rv-web{background:var(--v-ad-bg);color:var(--v-ad)}
:root .rv-where{font-size:14.4px;color:var(--x-ink3);margin:-4px 0 0}
:root .rv.is-done .rv-where{margin:0}
/* Gallery and the photo dump, 30 Sep 2026, after the old Photos page. */
:root .ph-src{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:15.6px;color:var(--x-ink3);margin:0 0 14px}
:root .ph-src b{color:var(--x-ink)}
:root .ph-src a{color:var(--x-ink2)}
:root .ph-dump{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:20px;padding:18px 20px;border:2px dashed var(--x-line);border-radius:16px;background:var(--x-raise);margin:0 0 14px;transition:border-color .15s,background .15s}
:root .ph-dump.is-over{border-color:var(--rp-now);background:var(--x-chip)}
:root .ph-dump h3{font-size:21.6px;font-weight:600;color:var(--x-ink);margin:0 0 6px}
:root .ph-dump p{font-size:16.2px;line-height:1.5;color:var(--x-ink2)}
:root .ph-dump b{color:var(--x-ink)}
:root .ph-dump-app{border-left:1px solid var(--x-line);padding-left:20px}
:root .ph-dump-app ol{margin:4px 0 0;padding-left:20px;font-size:16.2px;line-height:1.6;color:var(--x-ink2)}
:root .ph-pick{padding:16px 18px;border:1px solid var(--x-ink2);border-radius:14px;background:var(--x-panel);margin:0 0 14px;max-width:560px}
:root .ph-pick select,:root .ph-bar select,:root #ph-place,:root .ph-selbar select{font:16.2px/1.3 Inter,system-ui,Arial,sans-serif;color:var(--x-ink);background:var(--x-raise);border:1px solid var(--x-line);border-radius:10px;padding:8px 10px;max-width:100%}
:root .ph-pick select{width:100%}
:root .ph-bar{display:grid;gap:10px;padding:10px 0;margin:0 0 14px;border-bottom:1px solid var(--x-line)}
:root .ph-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
:root .ph-tal{padding:7px 12px;border:1px solid var(--x-line);border-radius:999px;background:var(--x-raise);color:var(--x-ink);font-size:15px;font-weight:600}
:root .ph-tal span{color:var(--x-ink3);font-weight:500;font-variant-numeric:tabular-nums}
:root .ph-tal[aria-pressed="true"]{background:var(--x-ink);border-color:var(--x-ink);color:var(--x-panel)}
:root .ph-tal[aria-pressed="true"] span{color:var(--x-panel);opacity:.75}
:root .ph-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
:root .ph{position:relative;border:1px solid var(--x-line);border-radius:12px;overflow:hidden;background:var(--x-panel);cursor:pointer}
:root .ph:hover{border-color:var(--x-ink3)}
:root .ph img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--x-raise)}
:root .ph.is-dim img{opacity:.45}
:root .ph.is-selected{outline:3px solid var(--x-ink);outline-offset:-3px}
:root .ph-meta{display:flex;justify-content:space-between;gap:6px;padding:8px 10px;font-size:14.4px;color:var(--x-ink2)}
:root .ph-meta span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root .ph-tag{position:absolute;top:8px;left:8px;font-size:13.2px;font-weight:700;padding:3px 9px;border-radius:999px;background:var(--s-white);color:var(--s-grey-25-2)}
:root .ph-tag.t-new{background:var(--s-blue-55);color:var(--s-white)}
:root .ph-tag.t-use{background:var(--s-green-61);color:var(--s-white)}
:root .ph-tag.t-edit{background:var(--s-amber-59);color:var(--s-white)}
:root .ph-tag.t-hide{background:var(--s-blue-50);color:var(--s-white)}
:root .ph-tag.t-archive{background:var(--s-blue-67);color:var(--s-white)}
:root .ph-tag.t-delete{background:var(--s-red-47);color:var(--s-white)}
:root .ph-fav{position:absolute;top:6px;right:6px;width:34px;height:34px;border-radius:50%;background:var(--s-white-a92);color:var(--s-grey-57);font-size:18px;line-height:34px}
:root .ph-fav.is-on{color:var(--s-red-55)}
:root .ph-check{position:absolute;left:8px;bottom:44px;width:28px;height:28px;border-radius:50%;border:2px solid var(--s-white);background:var(--s-white-a85);color:var(--n-25);font:700 16px/24px Inter,system-ui,Arial,sans-serif;text-align:center}
:root .ph.is-selected .ph-check{background:var(--n-25);color:var(--s-white)}
:root .gal-vbadge{position:absolute;right:8px;bottom:44px;padding:3px 9px;border-radius:999px;background:var(--s-black-a67);color:var(--s-white);font:700 13.2px/1.4 Inter,system-ui,Arial,sans-serif;font-variant-numeric:tabular-nums}
:root .gal-video{display:block;width:100%;max-height:70vh;border-radius:12px;border:1px solid var(--x-line);background:var(--s-black-a86)}
:root .ph-selbar{position:sticky;bottom:-22px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px;padding:10px 12px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-panel);font-size:16.2px;color:var(--x-ink)}
:root .ph-detail{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px;align-items:start}
:root .ph-detail figure{margin:0}
:root .ph-detail figure img{display:block;width:100%;border-radius:12px;border:1px solid var(--x-line)}
:root .ph-h{font-size:21.6px;font-weight:600;color:var(--x-ink);overflow-wrap:anywhere}
:root .ph-dec{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
:root .ph-dec button{padding:10px 6px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-raise);color:var(--x-ink);font-size:15.6px;font-weight:600}
:root .ph-dec button[aria-pressed="true"]{background:var(--x-ink);border-color:var(--x-ink);color:var(--x-panel)}
:root .ph-favl,:root .ph-for label{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border:1px solid var(--x-line);border-radius:999px;font-size:15.6px;color:var(--x-ink);background:var(--x-raise);cursor:pointer}
:root .ph-favl{margin-top:12px}
:root .ph-for{display:flex;flex-wrap:wrap;gap:8px}
:root .ph-notes{border-top:1px solid var(--x-line)}
:root .ph-note{padding:10px 0;border-bottom:1px solid var(--x-line);font-size:15.6px;line-height:1.5;color:var(--x-ink2)}
:root .ph-note b{color:var(--x-ink)}
:root .ph-note span{margin-left:8px;font-size:14.4px;color:var(--x-ink3)}
:root .ph-note.none{font-style:italic;color:var(--x-ink3)}
:root #ph-note{margin-top:10px;min-height:72px}
@media(max-width:1240px){:root .ph-dump,:root .ph-detail{grid-template-columns:minmax(0,1fr)}:root .ph-dump-app{border-left:0;padding-left:0;border-top:1px solid var(--x-line);padding-top:14px}}
/* Prices, 30 Sep 2026, after the live Prices page. */
:root .pr-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:0 0 14px}
:root .pr-count{font-size:16.2px;color:var(--x-ink2)}
:root .pr-count b{color:var(--x-ink);font-variant-numeric:tabular-nums}
:root .pr-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
:root .pr-group{border:1px solid var(--x-line);border-radius:14px;background:var(--x-panel);overflow:hidden}
:root .rp .pr-group h3,:root .pr-group h3{margin:0;padding:12px 16px;font-size:17px;font-weight:600;color:var(--x-ink);background:var(--x-raise);border-bottom:1px solid var(--x-line)}
:root .pr-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,210px);gap:12px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--x-line)}
:root .pr-row:last-child{border-bottom:0}
:root .pr-label{font-size:16.2px;color:var(--x-ink)}
:root .pr-label small{display:block;font-size:13.2px;color:var(--x-ink3);margin-top:2px}
:root .pr-val{width:100%;padding:8px 10px;border:1px solid var(--x-line);border-radius:8px;background:var(--x-raise);color:var(--x-ink);font:500 16.2px/1.3 Inter,system-ui,Arial,sans-serif;font-variant-numeric:tabular-nums}
:root .pr-row.is-changed .pr-val{border-color:var(--rp-now);background:var(--x-chip)}
:root .pr-q{margin-top:18px;max-width:880px}
:root .pr-q h3{font-size:19.2px;font-weight:600;color:var(--x-ink);margin:0 0 4px}
:root .pr-q .rp-cap{margin:0 0 10px}
@media(max-width:1100px){:root .pr-groups{grid-template-columns:minmax(0,1fr)}}
/* Shared folder in the sidebar is a link to Drive. */
:root a.nav-item{text-decoration:none}
:root .nav-item .nav-ext{width:15px;height:15px;margin-left:auto;opacity:.6}
/* Assets, 30 Sep 2026, after the live Assets page. The signature and logo previews sit on white
   in both themes, because that is what they are made for. */
:root .as-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 16px}
:root .as-step{display:grid;align-content:start;gap:4px;padding:14px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise);font-size:15px;line-height:1.45;color:var(--x-ink2)}
:root .as-step span{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--x-ink);color:var(--x-panel);font-size:14px;font-weight:700}
:root .as-step b{font-size:16.2px;color:var(--x-ink)}
:root .as-sig{border:1px solid var(--x-line);border-radius:14px;padding:16px 18px;margin:0 0 14px;background:var(--x-panel)}
:root .as-sighead{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:10px;margin:0 0 8px}
:root .rp .as-sighead h3{margin:0;font-size:19.2px}
:root .as-sighead p{font-size:15px;color:var(--x-ink3)}
:root .as-msg{font-weight:600;color:var(--x-chip-ink)}
:root .as-preview{background:var(--s-white);border-radius:10px;padding:18px;overflow-x:auto;border:1px solid var(--x-line)}
:root .as-preview [contenteditable]:hover,:root .as-preview [contenteditable]:focus{border-bottom-color:var(--s-grey-71)!important;background:var(--s-amber-98)}
:root .as-paste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;padding:4px 0 8px}
:root .as-paste h4{font-size:17px;font-weight:600;color:var(--x-ink);margin:0 0 8px}
:root .as-paste ol{margin:0;padding-left:20px;font-size:15.6px;line-height:1.6;color:var(--x-ink2)}
:root .as-paste .ws-done{grid-template-columns:minmax(0,1fr)}
:root .as-logos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
:root .as-logo{border:1px solid var(--x-line);border-radius:14px;overflow:hidden;background:var(--x-panel)}
:root .as-lprev{display:grid;place-items:center;height:150px;padding:18px;background:var(--s-white);border-bottom:1px solid var(--x-line)}
:root .as-lprev.tall{height:210px}
:root .as-lprev img{display:block;width:auto;height:auto;max-width:100%;max-height:114px;object-fit:contain}
:root .as-lprev.tall img{max-height:174px}
:root .as-linfo{padding:14px 16px}
:root .as-linfo h4{font-size:17.4px;font-weight:600;color:var(--x-ink);margin:0 0 6px}
:root .as-linfo p{font-size:15.6px;line-height:1.5;color:var(--x-ink2)}
:root .as-spec{font-size:14.4px!important;color:var(--x-ink3)!important;margin-top:6px}
:root .as-swatches{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
:root .as-swatch{border:1px solid var(--x-line);border-radius:12px;overflow:hidden;background:var(--x-panel)}
:root .as-chip{height:84px}
:root .as-swatch>div:last-child{padding:10px 12px}
:root .as-swatch b{display:block;font-size:16.2px;color:var(--x-ink)}
:root .as-hex{display:inline-flex;align-items:center;gap:6px;margin:6px 0;padding:4px 8px;border:1px solid var(--x-line);border-radius:8px;background:var(--x-raise);color:var(--x-ink);font:600 14.4px ui-monospace,SFMono-Regular,Menlo,monospace}
:root .as-hex .icon{width:14px;height:14px;opacity:.6}
:root .as-swatch p{font-size:14.4px;line-height:1.45;color:var(--x-ink3)}
:root .as-type{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
:root .as-type>div{border:1px solid var(--x-line);border-radius:12px;padding:16px;background:var(--x-panel)}
:root .as-tl{font-size:14.4px;font-weight:600;color:var(--x-ink3);margin:0 0 8px}
:root .as-ts{color:var(--x-ink);margin:0 0 8px}
:root .as-ts1{font:800 30px/1.15 Inter,system-ui,Arial,sans-serif;letter-spacing:-.5px}
:root .as-ts2{font:400 17px/1.55 Inter,system-ui,Arial,sans-serif}
:root .as-icons{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
:root .as-icon{padding:12px 14px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise)}
:root .as-icon b{display:block;font-size:16.2px;color:var(--x-ink)}
:root .as-icon span{display:block;font-size:14.4px;color:var(--x-ink3);margin-top:3px}
:root .as-zip{border-color:var(--x-ink2)}
@media(max-width:1240px){:root .as-steps,:root .as-swatches{grid-template-columns:repeat(2,minmax(0,1fr))}:root .as-logos,:root .as-paste,:root .as-type{grid-template-columns:minmax(0,1fr)}}
/* ==========================================================================
   LIVE LAYER, 30 Sep 2026. Everything above this line is the hub demo's own
   styles, carried across unchanged from handoffs/2026-09-29 - Dashboard hub
   demo.html so the page looks exactly as it was approved. Everything below is
   what going live added.
   ========================================================================== */

/* No preview strip above the shell any more. */
.shell{min-height:100vh}
[hidden]{display:none!important}

/* THE LIVE SCRIPTS' OWN MARKUP. quote.js (the quote window and the photo
   strip), updates.js (Chats, inside the Inbox) and shots.js (the screenshot
   viewer) are the live dashboard's files, unchanged, and they style
   themselves with the old dashboard's tokens. These map those tokens onto the
   hub's, so both themes carry through. Scoped to the places those scripts
   draw, because the hub has an --ink of its own. */
.lv,.fq,.shotbox{
  --ink:var(--x-ink);--ink-deep:var(--x-ink);--text:var(--x-ink);
  --muted:var(--x-ink2);--muted-soft:var(--x-ink3);
  --border:var(--x-line);--border-strong:var(--x-line2);
  --white:var(--x-panel);--page:var(--x-raise);--cream:var(--x-chip);
  --accent:var(--x-chip);--accent-bright:var(--x-mine);
  --amber:var(--x-warn);--amber-soft:var(--x-warn-bg);
  --radius-lg:14px;--radius:10px;--radius-sm:8px;
  --display:"Inter Tight",Inter,system-ui,Arial,sans-serif;--sans:Inter,system-ui,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --shadow-sm:0 1px 2px var(--s-black-a8);--shadow:0 10px 34px var(--s-black-a18);--shadow-lg:0 20px 56px var(--s-black-a30);
  --on-ink:var(--x-panel);--bad:var(--s-red-44);--good:var(--s-green-51);--ai:var(--s-purple-46);--ai-bg:var(--s-purple-95);
  color:var(--x-ink);font-family:Inter,system-ui,Arial,sans-serif
}
:root[data-theme="dark"] .lv,:root[data-theme="dark"] .fq,:root[data-theme="dark"] .shotbox{--bad:var(--s-red-79-2);--good:var(--s-green-82);--ai:var(--s-purple-82);--ai-bg:var(--s-purple-28)}

/* The disclosure the chat rows are built on, from the old dashboard sheet. */
.lv .disclose{border:1px solid var(--border);border-radius:var(--radius);background:var(--white);overflow:hidden}
.lv .disclose+.disclose{margin-top:10px}
.lv .disclose>summary{position:relative;list-style:none;cursor:pointer;padding:15px 44px 15px 18px;min-height:44px;font-family:var(--display);font-size:14.5px;font-weight:700;color:var(--ink-deep)}
.lv .disclose>summary::-webkit-details-marker{display:none}
.lv .disclose>summary:hover{background:var(--cream)}
.lv .disclose[open]>summary{border-bottom:1px solid var(--border)}
.lv .disclose>summary::after{content:"";position:absolute;right:19px;top:50%;width:8px;height:8px;margin-top:-6px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .16s ease}
.lv .disclose[open]>summary::after{transform:translateY(3px) rotate(-135deg)}
.lv .disclose .d-body{padding:16px 18px 18px}
.lv .allclear{font-size:14.5px;color:var(--muted)}

/* Chats, inside the Inbox: what its injected sheet takes for granted. */
.lv .fgu-tag.u-res{color:var(--good);background:var(--x-chip)}
.lv .fgu-tag.u-held{color:var(--bad);background:var(--x-warn-bg)}
.lv .fgu-row.is-res{border-left-color:var(--good)}
.lv .fgu-row.is-hidden{background:repeating-linear-gradient(135deg,transparent,transparent 9px,var(--s-grey-63-a8) 9px,var(--s-grey-63-a8) 18px)}
.lv .fgu button{color:var(--x-ink)}
.lv .fgu button.fgu-del:hover{background:var(--x-warn-bg);color:var(--bad)}
.lv .fgu textarea,.lv .fgu input.fgu-snip{background:var(--x-raise)}
/* ---- The quote window ---- */
.fq { width: min(860px, 100vw - 24px); max-height: calc(100vh - 24px); padding: 0; border: 0; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); background: var(--page); color: var(--text); }
.fq::backdrop { background: var(--s-blue-21-a55); }
.fq-shell { position: relative; display: flex; flex-direction: column; max-height: calc(100vh - 24px); }
.fq-loading, .fq-err { padding: 24px; }
.fq-err { color: var(--s-red-44); font-weight: 700; }
.fq-head { display: flex; align-items: flex-start; gap: 10px; padding: 16px 18px 12px; background: var(--white); border-bottom: 1px solid var(--border); }
.fq-hwords { flex: 1; min-width: 0; }
.fq-head h2 { margin: 0; font-family: var(--display); font-size: 19px; line-height: 1.25; color: var(--ink-deep); }
.fq-hsub { margin: 3px 0 0; font-size: 13.5px; color: var(--muted); }
.fq-save { font: 500 12px/1 var(--mono); color: var(--muted); padding-top: 9px; }
.fq-x { width: 38px; height: 38px; border: 0; border-radius: var(--radius-sm); background: var(--page); font-size: 24px; line-height: 1; color: var(--ink-deep); cursor: pointer; }
.fq-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 10px 18px; background: var(--white); border-bottom: 1px solid var(--border); }
.fq-step { min-height: 40px; border: 0; border-radius: var(--radius-sm); background: var(--page); color: var(--muted); font: inherit; font-size: 14.5px; font-weight: 700; cursor: pointer; }
.fq-step[aria-current="true"] { background: var(--ink); color: var(--s-white); }
.fq-body { flex: 1; overflow-y: auto; padding: 14px 18px; display: grid; gap: 12px; align-content: start; }
.fq-body > div { display: grid; gap: 12px; }
.fq-foot { display: flex; align-items: center; gap: 10px; padding: 12px 18px; background: var(--white); border-top: 1px solid var(--border); }
.fq-spacer { flex: 1; }
.fq-card { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 16px; }
.fq-card h3 { margin: 0 0 8px; font-family: var(--display); font-size: 16px; color: var(--ink-deep); }
.fq-quote { font-size: 15px; font-style: italic; white-space: pre-wrap; margin: 0 0 8px; }
.fq-muted { font-size: 13.5px; color: var(--muted); margin: 4px 0 0; }
.fq-warn { font-size: 14px; font-weight: 600; color: var(--amber); background: var(--amber-soft); border-radius: var(--radius-sm); padding: 8px 10px; margin: 6px 0; }
.fq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; }
@media (min-width: 700px) { .fq-step1 .fq-card:last-child .fq-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.fq-field { display: grid; gap: 4px; align-content: start; margin-top: 6px; }
.fq-label { font-size: 13px; font-weight: 600; color: var(--muted); }
.fq-hint { font-size: 12px; color: var(--muted-soft); }
.fq-input { width: 100%; min-height: 42px; padding: 8px 11px; border: 1.5px solid var(--border-strong); border-radius: var(--radius-sm); font: inherit; font-size: 15px; color: var(--text); background: var(--white); }
.fq-input:focus { outline: 2px solid var(--ink); outline-offset: 1px; }
.fq-area { resize: vertical; line-height: 1.5; }
.fq-check { display: flex; align-items: center; gap: 8px; min-height: 42px; margin-top: 22px; font-size: 15px; font-weight: 600; color: var(--ink-deep); }
.fq-check input { width: 20px; height: 20px; }
.fq-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; }
.fq-chips .fq-label { flex: 0 0 100%; }
.fq-chip { min-height: 34px; padding: 0 12px; border-radius: 999px; border: 1.5px dashed var(--ink); background: var(--cream); color: var(--ink); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.fq-btn { min-height: 44px; padding: 0 16px; border-radius: var(--radius); border: 1.5px solid var(--border-strong); background: var(--white); color: var(--ink-deep); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
.fq-btn:disabled { opacity: 0.6; cursor: default; }
.fq-primary { background: var(--ink); border-color: var(--ink); color: var(--s-white); }
.fq-ghost { background: transparent; }
.fq-yes { background: var(--s-green-51); border-color: var(--s-green-51); color: var(--s-white); }
.fq-no { background: var(--muted); border-color: var(--muted); color: var(--s-white); }
.fq-ai { border-color: var(--s-purple-46); color: var(--s-purple-46); background: var(--s-purple-95); }
.fq-rates-btn { min-height: 38px; padding: 0 12px; font-size: 14px; }
.fq-link { border: 0; background: none; padding: 0; font: inherit; font-size: 14px; font-weight: 700; color: var(--ink); text-decoration: underline; cursor: pointer; }
.fq-danger { color: var(--s-red-44); }
.fq-row-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.fq-airow { margin-top: 10px; }
.fq-aiout:empty { display: none; }
.fq-aiout { margin-top: 10px; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--s-purple-95); }
.fq-aisum { font-weight: 600; margin: 0 0 6px; }
.fq-qs { margin: 4px 0 0; padding-left: 18px; font-size: 14.5px; }

/* Lines: a table on a wide screen, stacked cards on a phone. */
.fq-lines { display: grid; gap: 8px; margin-top: 6px; }
.fq-line { display: grid; grid-template-columns: minmax(0, 1fr) 70px 70px 150px 100px 32px; gap: 8px; align-items: start; }
.fq-line-h span { font-size: 12px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: 0.3px; }
.fq-desc { min-height: 42px; resize: vertical; }
.fq-num, .fq-unit { text-align: center; }
.fq-price { display: grid; gap: 3px; }
.fq-lt { padding-top: 11px; text-align: right; font-weight: 700; color: var(--ink-deep); }
.fq-del { width: 32px; height: 42px; border: 0; background: none; font-size: 22px; color: var(--muted); cursor: pointer; }
.fq-remember { font-size: 12.5px; text-align: left; }
.fq-remember[hidden] { display: none; }
.fq-add { justify-self: start; margin-top: 4px; }
@media (max-width: 700px) {
  .fq-line-h { display: none; }
  .fq-line { grid-template-columns: 1fr 1fr 32px; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); }
  .fq-desc { grid-column: 1 / 3; }
  .fq-del { grid-column: 3; grid-row: 1; }
  .fq-price { grid-column: 1 / 3; }
  .fq-lt { grid-column: 1 / 3; padding-top: 0; }
}
.fq-totals { display: grid; gap: 4px; margin: 12px 0 4px; padding-top: 10px; border-top: 1px solid var(--border); }
.fq-tot { display: flex; justify-content: space-between; gap: 10px; margin: 0; font-size: 15px; }
.fq-tot span { color: var(--muted); }
.fq-grand { font-size: 17px; }
.fq-grand b { color: var(--ink-deep); }
.fq-inside > summary { display: flex; align-items: center; gap: 10px; font-family: var(--display); font-size: 16px; font-weight: 700; color: var(--ink-deep); cursor: pointer; }
.fq-tag { font-family: var(--sans); font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--amber-soft); color: var(--amber); }
.fq-calc { display: grid; gap: 4px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); }
.fq-target { margin: 6px 0 0; font-size: 14.5px; }

/* Send. */
.fq-sum { display: grid; gap: 4px; }
.fq-sumline { margin: 0; font-size: 15px; color: var(--muted); }
.fq-sumline b { font-family: var(--display); font-size: 26px; color: var(--ink-deep); }
.fq-status[hidden] { display: none; }
.fq-status { border-color: var(--ink); }
.fq-ask { margin: 0 0 8px; font-weight: 700; font-size: 15.5px; color: var(--ink-deep); }
.fq-tabs { display: inline-flex; justify-self: start; border: 1.5px solid var(--border-strong); border-radius: 999px; overflow: hidden; background: var(--white); }
.fq-tab { min-height: 40px; padding: 0 18px; border: 0; background: none; font: inherit; font-size: 15px; font-weight: 700; color: var(--muted); cursor: pointer; }
.fq-tab[aria-pressed="true"] { background: var(--ink); color: var(--s-white); }
.fq-wordtools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 10px; }
.fq-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }

/* Customer photos, on a lead and in the window. Square thumbnails, the
   whole photo one tap away. */
.fq-photos { margin-top: 10px; }
.fq-pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 8px; }
.fq-pgrid a { display: block; aspect-ratio: 1 / 1; border-radius: var(--radius-sm); overflow: hidden; border: 1px solid var(--border); background: var(--page); }
.fq-pgrid img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fq-pfiles { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.fq-file { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--border-strong); background: var(--white); color: var(--ink); font-size: 13.5px; font-weight: 600; text-decoration: none; }
.fq-padd { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 8px; }
.fq-addp { position: relative; display: inline-flex; align-items: center; min-height: 36px; }
.fq-hidden-input { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; }
.lh-photobox:empty { display: none; }
.lh-photobox { margin: 4px 0 10px; }
.lh-pcount { font-weight: 600; }
.lh-pcount::before { content: "· "; }

/* Rates, over the window. */
.fq-panel { position: absolute; inset: 0; z-index: 2; overflow-y: auto; padding: 16px 18px 24px; background: var(--page); }
.fq-panel h3 { margin: 18px 0 6px; font-family: var(--display); font-size: 16px; color: var(--ink-deep); }
.fq-panel .fq-row-h h3 { margin: 0; }
.fq-ratelist { display: grid; gap: 6px; }
.fq-rate { display: grid; grid-template-columns: minmax(0, 1fr) 120px; gap: 10px; align-items: center; padding: 8px 12px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.fq-rate b { display: block; font-size: 14.5px; color: var(--ink-deep); }
.fq-toast { position: absolute; left: 50%; bottom: 76px; z-index: 3; transform: translateX(-50%); max-width: 90%; margin: 0; padding: 10px 16px; border-radius: 999px; background: var(--ink-deep); color: var(--s-white); font-size: 14px; font-weight: 600; box-shadow: var(--shadow); }
.fq-toast[hidden] { display: none; }
@media (max-width: 640px) {
  .fq { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; border-radius: 0; margin: 0; }
  .fq-shell { max-height: 100dvh; height: 100%; }
  .fq-grid { grid-template-columns: 1fr; }
  .fq-head, .fq-steps, .fq-body, .fq-foot { padding-left: 14px; padding-right: 14px; }
}
/* The quote window on the hub's colours: white text on the old navy becomes
   the hub's panel colour on its ink, so it reads in both themes. */
.fq{font-family:var(--sans)}
.fq-step[aria-current="true"],.fq-primary,.fq-tab[aria-pressed="true"],.fq-toast{color:var(--on-ink)}
.fq-primary{background:var(--ink);border-color:var(--ink)}
.fq-err,.fq-danger{color:var(--bad)}
.fq-ai{border-color:var(--ai);color:var(--ai);background:var(--ai-bg)}
.fq-aiout{background:var(--ai-bg)}
.fq-yes{background:var(--good);border-color:var(--good);color:var(--on-ink)}
.fq-no{color:var(--on-ink)}
.fq::backdrop{background:var(--s-black-a60)}
.fq-input,.fq-btn:not(.fq-primary):not(.fq-yes):not(.fq-no):not(.fq-ai){background:var(--x-raise)}
.fq-input:focus{outline-color:var(--x-ink)}
.shot { position: relative; display: block; overflow: hidden; }
.shot.is-cropped { cursor: zoom-in; }
/* The frame is a window onto a taller picture, so it says so on hover rather
   than pretending the bottom edge is where the page ends. */
.shot.is-cropped::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 56px;
  background: linear-gradient(to bottom, var(--s-blue-21-a0), var(--s-blue-21-a26));
  opacity: 0; transition: opacity 0.16s ease; pointer-events: none;
}
.shot.is-cropped:hover::after { opacity: 1; }

.shot-zoom {
  position: absolute; right: 10px; bottom: 10px; z-index: 1;
  display: inline-flex; align-items: center; gap: 7px;
  padding: 7px 12px; border: 0; border-radius: 999px;
  background: var(--s-blue-21-a82); color: var(--s-white);
  font: inherit; font-size: 12px; font-weight: 700; cursor: pointer;
  opacity: 0; transition: opacity 0.16s ease, background 0.16s ease;
}
.shot-zoom svg { width: 14px; height: 14px; }
.shot:hover .shot-zoom, .shot-zoom:focus-visible { opacity: 1; }
.shot-zoom:hover { background: var(--ink-deep, var(--s-blue-21)); }
/* Touch has no hover, so on a phone the control is simply always there. */
@media (hover: none) { .shot-zoom { opacity: 1; } }

/* The modal. Fixed, above everything, and it scrolls INSIDE itself so a
   2,140px capture can be read end to end without the page behind it moving. */
.shotbox {
  position: fixed; inset: 0; z-index: 200;
  display: flex; align-items: center; justify-content: center;
  padding: 24px; background: var(--s-blue-21-a88);
}
.shotbox[hidden] { display: none; }
body.shotbox-open { overflow: hidden; }
.shotbox-frame {
  position: relative; display: flex; flex-direction: column;
  width: min(1200px, 100%); max-height: 100%;
  border-radius: var(--radius, 14px); background: var(--white, var(--s-white));
  box-shadow: 0 24px 60px var(--s-blue-21-a45);
}
.shotbox-scroll { overflow: auto; -webkit-overflow-scrolling: touch; border-radius: inherit; }
.shotbox-scroll img { display: block; width: 100%; height: auto; }
.shotbox-cap {
  flex: 0 0 auto; margin: 0; padding: 12px 16px;
  border-top: 1px solid var(--border, var(--s-grey-93));
  font-size: 13px; line-height: 1.5; color: var(--muted, var(--s-blue-53));
}
.shotbox-cap[hidden] { display: none; }
.shotbox-close {
  position: absolute; top: -14px; right: -14px; z-index: 1;
  width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
  border: 0; border-radius: 50%; cursor: pointer;
  background: var(--white, var(--s-white)); color: var(--ink-deep, var(--s-blue-21));
  box-shadow: 0 4px 14px var(--s-blue-21-a35);
}
.shotbox-close svg { width: 19px; height: 19px; }
/* Inside the frame on a phone, where a button hanging off the corner would
   sit under the notch or off the edge. */
@media (max-width: 600px) {
  .shotbox { padding: 12px; }
  .shotbox-close { top: 8px; right: 8px; }
}.shotbox{background:var(--s-black-a86)}

/* No preview strip, so the sidebar sits at the very top. */
:root .sidebar{top:0;height:100vh}
.menu-toggle{display:none}
.ov-wait,.ov-quiet{font-size:15px;color:var(--x-ink3);padding:10px 0}
.x-staff{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;padding-top:14px;border-top:1px dashed var(--x-line2)}
.x-staff>span{font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.4px;color:var(--x-ink3)}
.x-staff small{font-size:13px;color:var(--x-ink3)}
.request-list button.is-hidden{opacity:.55}
:root dialog .ib.ib-live{grid-template-columns:minmax(0,230px) minmax(0,1fr)}
.lv .fgu{font-size:15px}

/* ==========================================================================
   PHONES AND TABLETS, 30 Sep 2026. The demo was drawn for a laptop (and held
   the page at 1050px wide); the live dashboard is also opened on a phone, so
   at 1050px and below the sidebar becomes a drawer behind
   a Menu button, everything stacks into one column, and the window fills the
   screen.
   ========================================================================== */
@media (max-width:1050px){
  body{min-width:0}
  :root .shell{grid-template-columns:minmax(0,1fr)}
  :root .sidebar{position:fixed;top:0;left:0;bottom:0;height:auto;width:min(300px,86vw);z-index:60;transform:translateX(-102%);transition:transform .2s ease;box-shadow:none}
  body.nav-open .sidebar{transform:none;box-shadow:0 0 0 100vmax var(--s-black-a55)}
  .menu-toggle{display:grid}
  :root .topbar{height:58px;padding:0 16px;gap:10px}
  :root .breadcrumb{display:none}
  :root .top-actions{flex:1;justify-content:flex-end;gap:10px}
  :root .search-trigger{width:auto;flex:1;max-width:260px}
  :root .content{padding:18px 16px}
  :root .welcome{flex-direction:column;align-items:flex-start;gap:14px}
  :root .welcome h1{font-size:28px}
  :root .top-grid,:root .workspace-grid{grid-template-columns:minmax(0,1fr)}
  :root .numbers,:root .attention{height:auto}
  :root .workspace-grid .panel{min-height:0}
  :root .numbers .metric-row,:root .metric-row{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:16px}
  :root .metric+.metric{padding-left:0;border-left:0}
  :root .metric-value{font-size:30px}
  :root .lead-preview.x-lead{grid-template-columns:minmax(0,1fr) auto;row-gap:6px}
  :root .lead-preview.x-lead .x-time{display:none}
  :root .attention-body{grid-template-columns:minmax(0,1fr)}
  :root .attention .photo-stack{display:none}
  :root .bottom-line{flex-wrap:wrap;gap:10px}
  :root dialog,:root dialog.dialog-wide{width:calc(100vw - 16px);max-width:none;max-height:calc(100dvh - 16px)}
  :root .dialog-top{padding:16px}
  :root .dialog-body,:root .dialog-wide .dialog-body{padding:16px}
  :root .dialog-top h2{font-size:22px}
  :root .report-tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;padding-bottom:4px}
  :root .report-tabs button{flex:0 0 auto}
  :root .rp-tiles,:root .rp-tiles.ad-three,:root .ad-budgets,:root .as-swatches,:root .as-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  :root .ld-board{grid-template-columns:minmax(0,1fr)}
  :root dialog .ib,:root dialog .ib.ib-live,:root .ld-detail,:root .ad-where,:root .ad-kwgrid,:root .website-review,:root .g-shots,:root .dp-grid,:root .dp-phone-grid,:root .rv,:root .ph-dump,:root .ph-detail,:root .pr-groups,:root .as-paste,:root .as-logos,:root .as-type,:root .ws-done,:root .fqv-grid,:root .fqv-grid3{grid-template-columns:minmax(0,1fr)}
  :root .ph-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  :root .rp-range,:root .ld-stage,:root .ad-hbar{grid-template-columns:minmax(0,1fr)}
  :root .pr-row{grid-template-columns:minmax(0,1fr)}
  :root .rp-table{display:block;overflow-x:auto}
  :root .ld-top{flex-wrap:wrap;gap:10px}
  :root .ld-strip{flex-wrap:wrap}
  :root .x-row{flex-wrap:wrap}
  :root .ph-src,:root .ph-selbar,:root .rv-bar,:root .pr-top{flex-wrap:wrap}
  /* Phones, 5 Oct 2026 (Jay: "the sidebar won't even scroll the full way").
     The drawer kept the laptop's align-self:start, and current browsers apply
     that to a fixed box too: it grew to its content (about 1,500px), so it
     never scrolled and the last items sat below the screen. Stretch it to the
     screen, scroll inside it, and stop the page behind it moving. */
  :root .sidebar{align-self:stretch;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  :root:has(body.nav-open),body.nav-open{overflow:hidden}
  /* A window scrolls itself to its end, and the page behind stays put. */
  :root dialog{overscroll-behavior:contain}
  /* Phones, 9 Oct 2026 (Jay: a window's top and its close X got cut off). The small viewport is what is
     left with the browser bars showing, so a window sized to it always fits. The header stays put while
     the body scrolls, so the close X is never scrolled out of reach. */
  :root dialog,:root dialog.dialog-wide{max-height:calc(100svh - 16px)}
  :root dialog>.dialog-top{position:sticky;top:0;z-index:3;background:inherit}
  :root:has(dialog[open]:modal){overflow:hidden}
  /* The welcome row's buttons wrap instead of pushing the page sideways. */
  :root .welcome>div{min-width:0;max-width:100%}
  :root .welcome-actions{flex-wrap:wrap}
  /* Quick links: a long address is cut short, not allowed to widen the window. */
  :root .destination-list{grid-template-columns:minmax(0,1fr)}
  :root a.destination-item.ao-link>span{min-width:0}
  :root a.destination-item.ao-link small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media (max-width:420px){
  :root .rp-tiles,:root .rp-tiles.ad-three,:root .ad-budgets,:root .as-steps{grid-template-columns:minmax(0,1fr)}
}
@media (min-width:621px) and (max-width:1050px){
  :root .workspace-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  :root .numbers .metric-row,:root .metric-row{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* A long address stays inside the sidebar. */
:root .account>div{min-width:0}
:root .account strong,:root .account small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* "Show all" under a long pipeline column. */
:root .ld-more{width:100%;justify-content:center;margin-top:6px;padding:8px 0}

/* ==========================================================================
   ADD-ONS (engine), 2 Oct 2026. A tool a client has not switched on keeps
   its sidebar item and Overview card, badged Add-on, and opens a window
   saying what it does, what it looks like, and Talk to Jayden (hub.js,
   hub-addons.js). The "what it looks like" previews are drawn with these
   rules from made-up figures, on the theme tokens, so they take each
   client's colours and both themes. Also Quick links and the search tag.
   ========================================================================== */
:root .nav-item .count.ao-count,:root .panel .pill.ao-pill,:root .ao-about .ao-badge,:root .search-result .ao-tag{flex:none;display:inline-grid;place-items:center;width:24px;height:24px;padding:0;border:0;border-radius:6px;background:var(--brand);color:var(--brand-ink);line-height:0}
:root .ao-lock{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
:root .ao-badge{width:30px;height:30px;border-radius:8px}:root .ao-badge .ao-lock{width:17px;height:17px}
:root .ao-tag{width:20px;height:20px;border-radius:5px;margin-left:6px;vertical-align:-3px}:root .ao-tag .ao-lock{width:12px;height:12px}
:root .panel-head .ao-pill{margin-left:auto}
:root .nav-item.is-addon>.count:not(.ao-count){display:none!important}
:root .panel.is-addon>:not(.panel-head):not(.ao-teaser){display:none!important}
:root .panel.is-addon>.panel-head>:not(h2):not(.card-title):not(.eyebrow):not(.ao-pill){display:none!important}
:root .panel.is-addon{display:flex;flex-direction:column}
:root .ao-teaser{display:flex;flex-direction:column;flex:1;min-height:0}
:root .ao-teaser p{font-size:16.2px;line-height:1.5;color:var(--x-ink2);margin-top:14px}
:root .ao-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:28px;align-items:start}
:root .ao-h{display:block;font-size:14.4px;font-weight:600;letter-spacing:1.1px;text-transform:uppercase;color:var(--x-ink3);margin:18px 0 10px}
:root .ao-look .ao-h{margin-top:0}
:root .ao-list{list-style:none;margin:0;padding:0;display:grid;gap:9px}
:root .ao-list li{position:relative;padding-left:20px;font-size:17.4px;line-height:1.45;color:var(--x-ink)}
:root .ao-list li::before{content:"";position:absolute;left:3px;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--green)}
:root .ao-status{min-height:22px;color:var(--x-ink2)}
:root [data-addon-ask][disabled]{opacity:.65;cursor:default}
:root .ao-look{margin:0}
:root .ao-preview{border:1px solid var(--x-line);border-radius:14px;background:var(--x-raise);padding:16px;display:grid;gap:12px;pointer-events:none;user-select:none}
:root .ao-note{font-size:14.4px;color:var(--x-ink3);margin-top:8px}
:root .ao-sample{font-size:14.4px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--x-ink3)}
:root .ao-label{font-size:14.4px;font-weight:600;color:var(--x-ink3);margin-top:4px}
:root .ao-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px}
:root .ao-tile{background:var(--x-panel);border:1px solid var(--x-line);border-radius:10px;padding:10px 12px}
:root .ao-tile span,:root .ao-tile small{display:block;font-size:14.4px;color:var(--x-ink3)}
:root .ao-tile strong{display:block;font-size:24px;font-weight:540;letter-spacing:-.4px;color:var(--x-ink);margin:4px 0 2px;font-variant-numeric:tabular-nums}
:root .ao-rows{display:grid;gap:8px}
:root .ao-row{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--x-panel);border:1px solid var(--x-line);border-radius:10px;padding:10px 12px}
:root .ao-row b{display:block;font-size:15.6px;font-weight:560;color:var(--x-ink)}
:root .ao-row small{display:block;font-size:14.4px;color:var(--x-ink3);margin-top:2px}
:root .ao-chip{flex:none;font-size:14.4px;padding:3px 8px;border-radius:5px;background:var(--x-chip);color:var(--x-chip-ink);white-space:nowrap}
:root .ao-chip.is-brand{background:var(--green);color:var(--brand-ink)}
:root .ao-bars{display:grid;gap:8px}
:root .ao-bar{display:grid;grid-template-columns:118px minmax(0,1fr) 34px;align-items:center;gap:10px;font-size:14.4px;color:var(--x-ink2)}
:root .ao-bar i{display:block;height:12px;border-radius:0 4px 4px 0;background:var(--rp-bar)}
:root .ao-bar.is-you i{background:var(--rp-now)}
:root .ao-bar b{font-weight:600;color:var(--x-ink);text-align:right;font-variant-numeric:tabular-nums}
:root .ao-doc{background:var(--x-panel);border:1px solid var(--x-line);border-radius:10px;padding:14px}
:root .ao-doc-head b{display:block;font-size:16.8px;color:var(--x-ink)}
:root .ao-doc-head small{display:block;font-size:14.4px;color:var(--x-ink3);margin:2px 0 8px}
:root .ao-doc-line{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--x-line);padding:8px 0;font-size:15.6px;color:var(--x-ink2)}
:root .ao-doc-line b{font-weight:560;color:var(--x-ink);font-variant-numeric:tabular-nums}
:root .ao-doc-line.is-total{padding-bottom:0}
:root .ao-doc-line.is-total span,:root .ao-doc-line.is-total b{font-weight:650;color:var(--x-ink)}
:root .ao-review,:root .ao-post,:root .ao-xmas-card{background:var(--x-panel);border:1px solid var(--x-line);border-radius:10px;padding:14px}
:root .ao-review-head{display:flex;justify-content:space-between;align-items:center}
:root .ao-review-head b,:root .ao-post b,:root .ao-xmas-card b{font-size:16.2px;color:var(--x-ink)}
:root .ao-stars{color:var(--s-amber-72);letter-spacing:1px}
:root .ao-review p,:root .ao-post p,:root .ao-xmas-card p{font-size:15.6px;line-height:1.45;color:var(--x-ink2);margin-top:6px}
:root .ao-reply{margin-top:10px;border-radius:8px;background:var(--x-chip);padding:10px 12px}
:root .ao-reply small,:root .ao-post small,:root .ao-xmas-card small{display:block;font-size:14.4px;color:var(--x-ink3)}
:root .ao-post b,:root .ao-xmas-card b{display:block;margin-top:4px}
:root .ao-row-btns{display:flex;gap:8px;margin-top:10px}
:root .ao-btn{font-size:14.4px;padding:6px 12px;border-radius:8px;border:1px solid var(--x-line);color:var(--x-ink)}
:root .ao-btn.is-dark{background:var(--x-ink);border-color:var(--x-ink);color:var(--x-panel)}
:root .ao-photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
:root .ao-photo{position:relative;aspect-ratio:4/3;border-radius:8px;display:flex;align-items:flex-end;padding:6px}
:root .ao-photo-0{background:linear-gradient(160deg,var(--x-chip),var(--x-line))}
:root .ao-photo-1{background:linear-gradient(200deg,var(--x-line),var(--x-raise))}
:root .ao-photo-2{background:linear-gradient(120deg,var(--x-raise),var(--x-chip))}
:root .ao-photo i{position:absolute;top:6px;left:8px;font-style:normal;color:var(--s-amber-72)}
:root .ao-sig{display:flex;align-items:center;gap:12px;background:var(--x-panel);border:1px solid var(--x-line);border-radius:10px;padding:14px}
:root .ao-sig-mark{flex:none;width:44px;height:44px;border-radius:9px;display:grid;place-items:center;font-weight:700;font-size:15.6px;background:var(--green);color:var(--brand-ink)}
:root .ao-sig b{display:block;font-size:16.2px;color:var(--x-ink)}
:root .ao-sig small{display:block;font-size:14.4px;color:var(--x-ink3)}
:root .ao-swatches{display:flex;align-items:center;gap:8px;font-size:14.4px;color:var(--x-ink3)}
:root .ao-swatches i{width:30px;height:30px;border-radius:8px;border:1px solid var(--x-line)}
:root .ao-sw-1{background:var(--brand)}
:root .ao-sw-2{background:var(--brand-deep)}
:root .ao-sw-3{background:var(--brand-soft)}
:root .ao-xmas{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:start}
:root .ao-xmas-card{border-top:4px solid var(--green)}

:root a.destination-item.ao-link{text-decoration:none}
:root a.destination-item.ao-link>.icon:last-child{margin-left:auto;width:16px;height:16px}
@media (max-width:760px){
  :root .ao-body,:root .ao-xmas{grid-template-columns:minmax(0,1fr)}
  :root .ao-bar{grid-template-columns:96px minmax(0,1fr) 30px}
}

/* One UI type for every dashboard, 3 Oct 2026 (Jay): Inter for text, Inter Tight
   for headings, the pair two earlier dashboards used before the hub. Not per client:
   a client's own brand fonts appear only in their Brand window's samples. */
h1,h2,h3,.workspace strong{font-family:"Inter Tight",Inter,system-ui,Arial,sans-serif}
/* The sidebar header, an earlier dashboard's layout: square icon, client name, CLIENT DASHBOARD. */
.workspace strong,:root .workspace strong{font-weight:700;letter-spacing:-.01em}
.workspace small,:root .workspace small{font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase}
/* No PlainBlack logo and no breadcrumb (Jay, 3 Oct 2026): the sidebar header is the
   only place the client's name appears, so the top bar holds just its buttons. */
.top-actions{margin-left:auto}
/* Search, the theme switch and Ask a question live in the sidebar under the
   client header (Jay, 3 Oct 2026). The top bar is left only for the phone
   menu button, so it is hidden on wider screens. */
@media (min-width:1051px){.topbar{display:none}}
.side-tools{display:flex;gap:8px;align-items:center}
:root .sidebar .search-trigger{flex:1;width:auto;min-width:0;background:transparent;border:1px solid var(--n-33);color:var(--n-77)}
:root .sidebar .theme-toggle{flex-shrink:0;background:transparent;border:1px solid var(--n-33);color:var(--n-77)}
:root .sidebar .side-ask{width:100%;justify-content:center;background:var(--brand);color:var(--brand-ink);border:0}

/* The shared Inbox, 3 Oct 2026 (hub-inbox.js). Drawn only when HUB_CLIENT.inboxApi is
   set. Every colour is a theme token (the --x-* set, light and dark), so it takes each
   client's own colours; reds are the fixed status reds. */
:root .hi{display:grid;gap:14px;padding:14px;font-size:15px;color:var(--x-ink)}
:root .hi-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
:root .hi-filter{display:flex;gap:6px}
:root .hi-filter button{font-size:14.4px;font-weight:600;padding:7px 12px;border-radius:999px;border:1px solid var(--x-line);background:transparent;color:var(--x-ink2)}
:root .hi-filter button[aria-pressed="true"]{background:var(--x-ink);border-color:var(--x-ink);color:var(--x-panel)}
:root .hi-n{display:inline-block;min-width:20px;padding:0 6px;margin-left:4px;border-radius:999px;background:var(--x-raise);color:var(--x-ink2);font-size:13px;text-align:center}
:root .hi-filter button[aria-pressed="true"] .hi-n{background:var(--x-panel);color:var(--x-ink)}
:root .hi-sec h3,:root .hi-fold>summary{font-size:14.4px;font-weight:700;color:var(--x-ink3);margin:0 2px 6px}
:root .hi-fold>summary{cursor:pointer;padding:8px 2px;border-top:1px solid var(--x-line)}
:root .hi-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
:root .hi-empty{font-size:15px;color:var(--x-ink3);padding:6px 2px}
:root .hi-t>details{border:1px solid var(--x-line);border-radius:12px;background:var(--x-panel)}
:root .hi-t>details[open]{background:var(--x-raise)}
:root .hi-sum{list-style:none;cursor:pointer;padding:12px 14px;display:block}
:root .hi-sum::-webkit-details-marker{display:none}
:root .hi-main{display:grid;gap:4px;min-width:0}
:root .hi-top{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
:root .hi-top b{font-size:16.2px;font-weight:600;line-height:1.3;color:var(--x-ink);overflow-wrap:anywhere}
:root .hi-top time,:root .hi-mhead time{font-size:13.2px;color:var(--x-ink3);white-space:nowrap}
:root .hi-snip{font-size:14.4px;color:var(--x-ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root .hi-t>details[open] .hi-snip{display:none}
:root .hi-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
:root .hi-chip{display:inline-flex;align-items:center;gap:4px;font-size:13.2px;font-weight:600;border-radius:999px;padding:2px 9px;background:var(--x-raise);color:var(--x-ink2);border:1px solid var(--x-line)}
:root .hi-chip .icon{width:13px;height:13px}
:root .hi-chip.wait{background:var(--x-warn-bg);color:var(--x-warn);border-color:transparent}
:root .hi-chip.pin{background:var(--x-chip);color:var(--x-chip-ink);border-color:transparent}
:root .hi-chip.staff{border-style:dashed}
:root .hi-body{padding:0 14px 14px;display:grid;gap:12px}
:root .hi-msgs{list-style:none;margin:0;padding:0;display:grid;gap:8px}
:root .hi-m{padding:10px 12px;border-radius:10px;background:var(--x-panel);border:1px solid var(--x-line)}
:root .hi-m.is-pb{background:var(--x-mine)}
:root .hi-mhead{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin-bottom:4px}
:root .hi-mhead b{font-size:14.4px;font-weight:700;color:var(--x-ink)}
:root .hi-edited,:root .hi-prov{font-size:13.2px;color:var(--x-ink3)}
:root .hi-prov{font-style:italic}
:root .hi-text{font-size:15px;line-height:1.55;color:var(--x-ink);white-space:pre-wrap;overflow-wrap:anywhere}
:root .hi-text a{color:var(--brand-text);text-decoration:underline;text-underline-offset:3px}
:root .hi-text.is-clamped{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6;overflow:hidden}
:root .hi-mtools{display:flex;gap:14px;margin-top:6px}
:root .hi-link{background:none;border:0;padding:0;font-size:14px;font-weight:600;color:var(--x-ink2);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
:root .hi-link.danger,:root .button.danger{color:var(--s-red-56)}
:root .hi-shots{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
:root .hi-shots a{display:block;width:132px;height:92px;border-radius:8px;overflow:hidden;border:1px solid var(--x-line);background:var(--x-raise)}
:root .hi-shots img{width:100%;height:100%;object-fit:cover;display:block}
:root .hi-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
:root .hi-acts .button,:root .hi-staff .button,:root .hi-send .button{font-size:14px}
:root .hi-acts .button .icon{width:16px;height:16px}
:root .hi-form{display:grid;gap:8px;padding:12px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-panel)}
:root .hi-form[hidden]{display:none}
:root .hi-form textarea{width:100%;min-height:64px;resize:vertical;padding:10px 12px;border-radius:9px;border:1px solid var(--x-line2);background:var(--x-panel);color:var(--x-ink);font:15px/1.5 Inter,system-ui,sans-serif}
:root .hi-form textarea.is-over{outline:2px dashed var(--brand);outline-offset:2px}
:root .hi-attach,:root .hi-send{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
:root .hi-send{justify-content:flex-end}
:root .hi-hint{font-size:13.2px;color:var(--x-ink3)}
:root .hi-send{justify-content:flex-end}
:root .hi-status{font-size:14px;color:var(--x-ink2);min-height:0}
:root .hi-status:empty{display:none}
:root .hi-pending{display:flex;flex-wrap:wrap;gap:8px}
:root .hi-pending:empty{display:none}
:root .hi-chipimg{position:relative;width:72px;height:54px;border-radius:7px;overflow:hidden;border:1px solid var(--x-line)}
:root .hi-chipimg img{width:100%;height:100%;object-fit:cover}
:root .hi-chipimg button{position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:50%;background:var(--x-ink);color:var(--x-panel);font-size:14px;line-height:20px;padding:0}
:root .hi-tx>summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--x-ink2)}
:root .hi-txf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:8px}
:root .hi-txf label{display:grid;gap:4px;font-size:13.2px;color:var(--x-ink3)}
:root .hi-txf input{padding:8px 10px;border-radius:8px;border:1px solid var(--x-line2);background:var(--x-panel);color:var(--x-ink);font:14px Inter,system-ui,sans-serif}
:root .hi-about{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14.4px;color:var(--x-ink2);padding:8px 10px;border-radius:9px;background:var(--x-chip)}
:root .hi-about .icon{width:16px;height:16px;color:var(--x-chip-ink)}
:root .hi-about span{flex:1;min-width:0}
:root .hi-staff{display:grid;gap:8px;padding:12px;border:1px dashed var(--x-line2);border-radius:12px;background:var(--x-raise)}
:root .hi-tag{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--x-ink3)}
:root .hi-seen{font-size:14.4px;color:var(--x-ink2)}
:root .hi-seen b{color:var(--x-ink);font-weight:600}
:root .hi-staff-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
:root .hi-sw{display:inline-flex;gap:8px;align-items:center;font-size:14.4px;color:var(--x-ink2);cursor:pointer}
:root .hi-pinbtn{width:100%;justify-content:center;margin-top:8px;background:transparent;border:1px solid var(--n-33);color:var(--n-77)}
:root .hi-pinbtn .icon{width:15px;height:15px}
:root .topbar .hi-pintop{width:auto;margin:0 0 0 auto;border-color:var(--x-line);color:var(--x-ink)}
@media (min-width:1051px){:root .topbar .hi-pintop{display:none}}
:root body.hi-picking,:root body.hi-picking *{cursor:crosshair}
:root .hi-pickbar{position:fixed;z-index:2147483000;left:50%;top:16px;transform:translateX(-50%);display:flex;gap:12px;align-items:center;padding:10px 12px 10px 16px;border-radius:12px;background:var(--x-ink);color:var(--x-panel);font-size:15px;box-shadow:0 10px 30px var(--s-black-a27);cursor:default}
:root .hi-pickbar *{cursor:default}
:root .hi-pickbar .icon{width:18px;height:18px}
:root .hi-toast{position:fixed;z-index:2147483000;left:50%;bottom:24px;transform:translateX(-50%);max-width:min(560px,90vw);padding:12px 16px;border-radius:12px;background:var(--x-ink);color:var(--x-panel);font-size:15px;box-shadow:0 10px 30px var(--s-black-a27)}
:root .hi-flash{outline:3px solid var(--brand);outline-offset:4px;border-radius:8px;transition:outline-color .3s}
@media (max-width:760px){
  :root .hi{padding:10px}
  :root .hi-txf{grid-template-columns:minmax(0,1fr)}
  :root .hi-top{flex-direction:column;gap:2px}
}

/* ADMIN PANEL, 3 Oct 2026 (hub-admin.js; _internal/switchboard/ADMIN.md). PlainBlack only. Theme tokens only, so light and dark both work. */
:root .adm-tabs{margin-bottom:14px}
:root .adm .ao-h{margin:22px 0 8px}
:root .adm-list{display:flex;flex-direction:column;border-top:1px solid var(--x-line)}
:root .adm-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px 14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--x-line);color:var(--x-ink)}
:root .adm-row.is-removed .adm-who{opacity:.62}
:root .adm-who{min-width:0}
:root .adm-who b{display:block;font-size:16.8px;color:var(--x-ink)}
:root .adm-who small{display:block;font-size:14.4px;color:var(--x-ink3);overflow-wrap:anywhere}
:root .adm-tags,:root .adm-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}
:root .adm-acts .button{padding:7px 12px;font-size:15px}
:root .ao-chip.adm-warn{background:var(--x-warn-bg);color:var(--x-warn)}
:root .ao-chip.adm-off{background:var(--x-line);color:var(--x-ink2)}
:root .adm-steps{grid-column:1/-1;margin-top:4px;padding:12px 14px;border-radius:10px;background:var(--x-warn-bg);color:var(--x-ink);font-size:15px}
:root .adm-steps b{display:block;color:var(--x-warn);margin-bottom:6px}
:root .adm-steps ol{margin:0 0 10px 20px;padding:0;display:grid;gap:4px}
:root .adm-tool{grid-template-columns:minmax(0,1fr) auto}
:root .adm-switch{margin:0}
:root .adm-note{grid-column:1/-1;margin:0;font-size:14.4px;color:var(--x-warn)}
:root .adm-empty{padding:12px 0;color:var(--x-ink3);font-size:15px}
:root .adm-add{margin-top:6px}
:root .adm-fields{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
:root .adm-fields label:not(.hi-sw){display:flex;flex-direction:column;gap:4px;font-size:14.4px;color:var(--x-ink2);flex:1 1 200px}
:root .adm-fields input:not([type=checkbox]){font:inherit;font-size:16px;padding:9px 11px;border-radius:8px;border:1px solid var(--x-line2);background:var(--x-panel);color:var(--x-ink)}
:root .adm-fields .hi-sw{flex:1 1 100%}
:root .adm .x-staff{margin-top:22px}
@media (max-width:760px){:root .adm-row{grid-template-columns:minmax(0,1fr)}:root .adm-tags,:root .adm-acts{justify-content:flex-start}}
/* Admin › Connections, 5 Oct 2026: one tile per thing the dashboard is connected to; the pill says working, needs attention, not connected or not used. */
:root .adm{--adm-ok:var(--s-green-51);--adm-ok-bg:var(--s-green-95);--adm-bad:var(--s-red-44);--adm-bad-bg:color-mix(in srgb,var(--s-red-44) 9%,var(--x-panel))}
:root[data-theme="dark"] .adm{--adm-ok:var(--s-green-82);--adm-ok-bg:color-mix(in srgb,var(--s-green-82) 14%,var(--x-panel));--adm-bad:var(--s-red-79-2);--adm-bad-bg:color-mix(in srgb,var(--s-red-79-2) 14%,var(--x-panel))}
:root .adm-tabs.report-tabs{flex-wrap:wrap}
:root .adm-conn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
:root .adm-conn{display:flex;flex-direction:column;gap:8px;min-width:0;padding:14px 16px;border:1px solid var(--x-line);border-left:4px solid var(--x-line2);border-radius:12px;background:var(--x-raise);color:var(--x-ink)}
:root .adm-conn.is-ok{border-left-color:var(--adm-ok)}
:root .adm-conn.is-warn{border-left-color:var(--x-warn)}
:root .adm-conn.is-bad{border-left-color:var(--adm-bad)}
:root .adm-conn-top{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:6px 10px}
:root .adm-conn-top b{min-width:0;font-size:16.8px;color:var(--x-ink);overflow-wrap:break-word}
:root .adm-pill{flex:none;font-size:13.2px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;background:var(--x-line);color:var(--x-ink2)}
:root .adm-pill.is-ok{background:var(--adm-ok-bg);color:var(--adm-ok)}
:root .adm-pill.is-warn{background:var(--x-warn-bg);color:var(--x-warn)}
:root .adm-pill.is-bad{background:var(--adm-bad-bg);color:var(--adm-bad)}
:root .adm-conn p{margin:0;font-size:15px;color:var(--x-ink2);overflow-wrap:anywhere}
:root .adm-conn .adm-fix{font-size:14.4px;color:var(--x-ink3)}
:root .adm-conn .adm-fix b{color:var(--x-ink2)}
:root .adm-conn .adm-acts{justify-content:flex-start;margin-top:auto}
:root .adm-conn .adm-switch{align-self:flex-start}
:root .adm-conn .adm-drive-box{margin:4px 0 0;padding:12px 14px;max-width:none}
:root .adm-conn .adm-drive-box .gal-pv{font-size:15px;margin:0 0 10px}
:root .adm-conn .adm-drive-box .x-row{margin-top:4px;gap:8px}
:root .adm-conn .adm-drive-box .adm-note,:root .adm-conn .adm-drive-box .adm-drive-msg{margin:0 0 10px;font-size:14.4px}
:root .adm-conn .adm-drive-box .adm-drive-msg{color:var(--x-ink2)}
@media (max-width:520px){:root .adm-conn-grid{grid-template-columns:minmax(0,1fr)}}
/* The Drive tile with its folder form or "Are you sure?" open takes two columns where there are two. */
@media (min-width:760px){:root .adm-conn.is-open{grid-column:span 2}}

/* THE SHARED GALLERY, 4 Oct 2026 (hub-gallery.js; _internal/switchboard/GALLERY.md). Used only once a client sets galleryApi. Builds on the .ph-* rules above. Theme tokens only, so light and dark both work. */
:root .gal .report-tabs{margin-bottom:14px}
:root .gal-tight{margin:6px 0 0}
:root .gal-hint{font-weight:400;color:var(--x-ink3);font-size:14.4px}
:root .gal-field{display:flex;flex-direction:column;gap:4px;font-size:14.4px;color:var(--x-ink2);margin:0 0 10px}
:root .gal-field input,:root .gal-field select,:root .gal-pop select,:root .gal select#gal-pick-folder{font:16px/1.3 Inter,system-ui,Arial,sans-serif;padding:9px 11px;border-radius:10px;border:1px solid var(--x-line);background:var(--x-raise);color:var(--x-ink);max-width:100%}
:root .gal-inline{flex-direction:row;align-items:center;gap:8px;margin:0}
:root .gal-staff{margin:0 0 14px}
:root .gal-box{padding:14px 16px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-raise);margin:0 0 14px;max-width:640px}
:root .gal-pv{font-size:15.6px;color:var(--x-ink2);margin:0 0 10px}
:root .gal-pv b{color:var(--x-ink)}
:root .gal-folders{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 6px}
:root .gal-folder{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-raise);color:var(--x-ink);font-size:15px;font-weight:600}
:root .gal-folder .icon{width:16px;height:16px;color:var(--x-ink3)}
:root .gal-folder span{color:var(--x-ink3);font-weight:500;font-variant-numeric:tabular-nums}
:root .gal-folder[aria-pressed="true"]{background:var(--x-ink);border-color:var(--x-ink);color:var(--x-panel)}
:root .gal-folder[aria-pressed="true"] .icon,:root .gal-folder[aria-pressed="true"] span{color:var(--x-panel)}
:root .gal-on{font-size:12px;font-weight:700;padding:1px 6px;border-radius:5px;background:var(--x-chip);color:var(--x-chip-ink)}
:root .gal .ph-meta>span:last-child,:root .gal-pop .ph-meta>span:last-child{white-space:nowrap;flex:none}
:root .gal-usedon{font-size:15.6px;color:var(--x-ink2);margin:6px 0 0}
:root .gal-hist{margin:6px 0 8px}
:root .gal-hist>summary{cursor:pointer;font-size:15px;color:var(--x-ink3);padding:6px 0}
:root .gal-suggest{margin:8px 0;padding:10px 12px;border-radius:10px;background:var(--x-chip);color:var(--x-chip-ink)}
:root .gal-suggest>span{font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.4px;opacity:.8}
:root .gal-suggest p{margin:4px 0 8px;font-size:16px;line-height:1.45}
:root .gal-pages{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
:root .gal-page{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:0 0 12px;border:1px solid var(--x-line);border-radius:14px;overflow:hidden;background:var(--x-panel);color:var(--x-ink);text-align:left}
:root .gal-page:hover{border-color:var(--x-ink3)}
:root .gal-page b{font-size:17.4px;padding:6px 12px 0}
:root .gal-page small{font-size:14.4px;color:var(--x-ink3);padding:0 12px}
:root .gal-page .ao-chip{margin:4px 12px 0}
:root .gal-pages{align-items:start}
:root .gal-collage{position:relative;display:grid;width:100%;aspect-ratio:4/3;gap:2px;background:var(--x-raise);overflow:hidden;grid-template-rows:minmax(0,1fr)}
:root .gal-collage img{width:100%;height:100%;min-width:0;min-height:0;object-fit:cover;display:block}
:root .gal-collage.n2,:root .gal-collage.n4{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
:root .gal-collage.n3{grid-template-columns:minmax(0,2fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1fr)}
:root .gal-collage.n3 img:first-child{grid-row:span 2}
:root .gal-collage.n4{grid-template-rows:minmax(0,1fr) minmax(0,1fr)}
:root .gal-more{position:absolute;right:8px;bottom:8px;padding:3px 9px;border-radius:999px;background:rgba(0,0,0,.66);color:#fff;font-size:13px;font-weight:600}
:root .gal-tile{display:block;width:100%;padding:0;border:0;background:none;text-align:left;color:inherit;font:inherit;cursor:pointer}
:root .gal-tile:focus-visible{outline:3px solid var(--x-ink);outline-offset:-3px}
:root button.ph{display:block;width:100%;padding:0;text-align:left;color:var(--x-ink);font:inherit}
:root .gal-spot-meta{display:flex;flex-direction:column;gap:6px;padding:10px}
:root .gal-spot-meta b{font-size:16.2px}
:root .gal-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
:root .gal-spot-meta .gal-chips{margin:0}
:root .ao-chip.gal-live{background:var(--x-ink);color:var(--x-panel)}
:root .gal-nophoto{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;background:var(--x-raise);color:var(--x-ink3);font-size:15px}
:root .gal-nophoto.big{border-radius:12px;border:1px dashed var(--x-line);margin:0}
:root .gal-wait{margin:0 0 14px;padding:12px 14px;border-radius:12px;background:var(--x-warn-bg);color:var(--x-ink);font-size:15.6px}
:root .gal-wait b{display:block;color:var(--x-warn);margin-bottom:4px}
:root .gal-wait p{margin:0 0 6px}
:root .gal-wait.is-failed{border-left:4px solid var(--s-red-47)}
:root .gal-err{font-weight:600}
:root .ph-detail figure img.gal-asked{margin-top:12px;outline:3px solid var(--x-warn);outline-offset:-3px}
:root .ph-detail figcaption{margin:6px 0 0}
:root .gal-acts{margin-top:0}
:root .gal-pop .field-label:first-of-type{margin-top:14px}
:root .gal-crop{position:relative;display:inline-block;max-width:100%;margin:12px 0;overflow:hidden;border-radius:8px;touch-action:none;user-select:none;cursor:crosshair}
:root .gal-crop img{display:block;max-width:100%;max-height:60vh;border-radius:8px}
:root .gal-crop-box{position:absolute;border:2px solid var(--s-white);box-shadow:0 0 0 9999px var(--s-black-a53);pointer-events:none}
:root dialog.gal-ask{width:min(480px,92vw)}
:root .gal-ask-form{padding:22px 24px}
:root .gal-ask-form h3{font-size:21.6px;font-weight:600;color:var(--x-ink);margin:0 0 8px}
:root .gal-ask-form p{font-size:16.2px;line-height:1.5;color:var(--x-ink2);margin:0 0 12px}
:root .gal-ask-form textarea{width:100%}
/* NO BROWSER POP-UPS, 5 Oct 2026. HUB.ask (hub.js) is the gal-ask above, with its buttons as an x-row. The Inbox's Summary line (hub-inbox.js, .hi-snipform) and Admin's Rename (hub-admin.js, .adm-rename on .adm-fields) are fields in the page with Save and Cancel. */
:root .adm-rename{flex:1 1 100%;grid-column:1/-1;margin-top:8px}
:root .hi-snipform{display:grid;gap:8px;margin-top:10px;padding:12px;border:1px solid var(--x-line2);border-radius:10px;background:var(--x-raise)}
:root .hi-snipform label{display:grid;gap:4px;font-size:13.2px;color:var(--x-ink3)}
:root .hi-snipform input{padding:8px 10px;border-radius:8px;border:1px solid var(--x-line2);background:var(--x-panel);color:var(--x-ink);font:14px Inter,system-ui,sans-serif}
:root .hi-snipform .hi-hint,:root .hi-snipform .hi-status{margin:0}
@media (max-width:760px){:root .gal-pages{grid-template-columns:repeat(2,minmax(0,1fr))}:root .gal-crop img{max-height:50vh}}
/* THE SHARED BRAND & SIGNATURES, 4 Oct 2026 (hub-brand.js; _internal/switchboard/BRAND.md). Used only once a client sets brandApi. Builds on the .as-* and .gal-* rules above. Theme tokens only, so light and dark both work; the signature preview stays white, as an email is. */
:root .br-sm{font-size:15px;padding:7px 11px}
:root .br-sm small{font-size:13px;font-weight:500;opacity:.75;margin-left:4px}
:root .br-kit{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0 0 14px;padding:12px 14px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-raise)}
:root .br-kitn b{font-size:17px;color:var(--x-ink)}
:root .br-kitz{font-size:14.4px;color:var(--x-ink3)}
:root .br-link{font-size:15.6px;color:var(--x-ink);text-decoration:underline;text-underline-offset:3px}
:root .br-src{margin:0 0 14px}
:root .br-kitgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0 0 18px}
:root .br-kt{position:relative;display:flex;flex-direction:column;gap:6px;min-height:76px;padding:12px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-panel);font-size:15px;color:var(--x-ink)}
:root .br-kt-i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--x-chip);color:var(--x-chip-ink);font-size:13px;font-weight:700}
:root .br-kt-l{font-weight:600}
:root .br-kt.is-locked{background:var(--x-raise);border-style:dashed;color:var(--x-ink3)}
:root .br-kt.is-locked .br-kt-i{background:transparent;color:var(--x-ink3)}
:root .br-kt-acts{display:flex;flex-wrap:wrap;gap:6px;opacity:0;transition:opacity .15s}
:root .br-kt.is-locked:hover .br-kt-acts,:root .br-kt.is-locked:focus-within .br-kt-acts{opacity:1}
@media (hover:none){:root .br-kt-acts{opacity:1}}
:root .br-kt-acts .button{font-size:13.2px;padding:5px 8px}
:root .br-lock{padding:14px 16px;border:1px dashed var(--x-line2);border-radius:14px;background:var(--x-raise);color:var(--x-ink3);margin:0 0 14px;max-width:640px}
:root .br-lock-head{display:flex;align-items:center;gap:8px;color:var(--x-ink2)}
:root .br-lock-i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
:root .br-lock .rp-cap{margin:6px 0 0}
:root .br-lock-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
:root .br-type{margin:0 0 20px}
:root .br-thead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px}
:root .rp .br-thead h3{margin:0}
:root .rp.br .br-h0{margin:0 0 6px}
:root .br-kt.is-locked .br-kt-i .br-lock-i{width:13px;height:13px}
:root .br-lprev{border-bottom:1px solid var(--x-line)}
:root .br-noprev{font:600 14.4px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--s-grey-71)}
:root .br-dls{flex-wrap:wrap;gap:6px;margin-top:10px}
:root .br-which{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 14px}
:root .br-ft{width:150px}
:root .br-files{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
:root .br-file{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-panel);font-size:15px;color:var(--x-ink)}
:root .br-file img{display:block;width:100%;height:96px;object-fit:contain;background:var(--s-white);border-radius:8px;padding:8px}
:root .br-file .br-noprev{display:grid;place-items:center;height:96px;border-radius:8px;background:var(--x-raise)}
:root .br-file .br-dls{margin-top:0}
:root .br-only{font-size:13.2px;color:var(--x-ink3)}
:root .br-email-logo{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
:root .br-email-logo img{display:block;max-width:220px;max-height:110px;background:var(--s-white);border:1px solid var(--x-line);border-radius:10px;padding:10px}
:root .br-ts{font-size:28px;line-height:1.25;color:var(--x-ink);margin:6px 0}
:root .br-email{color:var(--x-ink2)!important;font-weight:600}
:root .br-hexrow{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
:root .br-ok{font-size:14.4px;font-weight:600;color:var(--x-chip-ink);white-space:nowrap}
:root .br-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
:root .br-copy{display:inline-flex;align-items:center;gap:8px}
:root .br-draft{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px;padding:8px 12px;border-radius:10px;background:var(--x-warn-bg);color:var(--x-ink);font-size:15.6px}
:root .br-draft>span{font-weight:600;margin-right:4px}
:root .br-draft[hidden]{display:none}
:root .br-opts{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0 0 8px}
:root .br-check{display:inline-flex;align-items:center;gap:6px;font-size:15.6px;color:var(--x-ink2)}
:root .br-tip{margin:0 0 8px}
:root .br-st{margin-top:8px}
:root .br-prev .br-ed{outline:none;border-bottom:1px dashed var(--s-grey-71);cursor:text;min-width:2ch;display:inline-block}
:root .br-prev .br-ed:hover,:root .br-prev .br-ed:focus{background:var(--s-amber-98);border-bottom-style:solid}
:root .br-prev .br-ph{color:var(--s-grey-71)!important;font-style:italic}
:root .br-prev .br-bad{border-bottom:2px solid var(--s-red-47)}
:root .br-prev a{cursor:text}
@media (max-width:760px){:root .br-kitgrid{grid-template-columns:repeat(2,minmax(0,1fr))}:root .br-which{grid-template-columns:minmax(0,1fr)}}
/* THE SHARED LEADS, 4 Oct 2026 (hub-leads.js, its second part; _internal/switchboard/LEADS.md). Used only once a client sets HUB_CLIENT.leadsApi. Theme tokens only, so light and dark both follow the client theme. */
:root .lx-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 12px}
:root .lx-bar-acts{display:flex;flex-wrap:wrap;gap:8px}
:root .lx-filters{display:inline-flex;flex-wrap:wrap;gap:6px}
:root .lx-filters button{font:inherit;font-size:15px;font-weight:600;padding:6px 14px;border-radius:999px;border:1px solid var(--x-line);background:var(--x-panel);color:var(--x-ink2);cursor:pointer}
:root .lx-filters button[aria-pressed="true"]{background:var(--x-ink);border-color:var(--x-ink);color:var(--x-panel)}
:root .lx-board.lx-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
:root .lx-board.lx-cols-1{grid-template-columns:minmax(0,1fr)}
:root .ld-chip.lx-st-new{background:var(--x-chip);color:var(--x-chip-ink)}
:root .ld-chip.lx-st-open{background:var(--x-warn-bg);color:var(--x-warn)}
:root .ld-chip.lx-st-won{background:var(--rp-now);color:var(--s-white)}
:root .ld-chip.lx-st-lost{background:var(--x-raise);color:var(--x-ink3);border:1px solid var(--x-line)}
:root .ld-chip.lx-tick{background:var(--x-raise);color:var(--x-ink2);border:1px solid var(--x-line);margin-right:4px}
:root .ld-card.lx-notreal{opacity:.6}
:root .lx-ticks{display:grid;gap:8px;margin-top:14px}
:root .lx-tickrow{display:flex;align-items:center;gap:10px;font-size:16px;color:var(--x-ink)}
:root .lx-tickrow input{width:18px;height:18px;accent-color:var(--rp-now)}
:root .lx-tickrow small{margin-left:auto;font-size:14px;color:var(--x-ink3)}
:root .lx-prompt{border:1px dashed var(--x-line2);border-radius:12px;padding:14px 16px;margin:0 0 14px;background:var(--x-raise)}
:root .lx-prompt b{color:var(--x-ink);font-size:16.8px}
:root .lx-prompt p{margin:4px 0 0;font-size:15.6px;color:var(--x-ink2)}
:root .lx-prompt .x-row{margin-top:10px}
:root .lx-clash{border-radius:12px;padding:12px 14px;margin:0 0 14px;background:var(--x-warn-bg);color:var(--x-ink);font-size:15.6px}
:root .lx-histlist{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:6px;font-size:15px;color:var(--x-ink2)}
:root .lx-histlist b{color:var(--x-ink);font-weight:600}
:root .lx-histlist small{color:var(--x-ink3)}
:root .lx-del{color:var(--s-red-47)}
:root .ld-stage .ws-bar.lx-lost i{background:var(--x-line2)}
:root .lx-status{display:inline-block;margin:0 0 12px;padding:6px 12px;border-radius:999px;background:var(--x-chip);color:var(--x-chip-ink);font-weight:600;font-size:15px}
:root .lx-qs{margin:0;padding-left:22px;display:grid;gap:14px}
:root .lx-q b{display:block;font-weight:600;font-size:16.2px;color:var(--x-ink);margin-bottom:6px}
:root .lx-q textarea{width:100%;min-height:76px;padding:8px 11px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:inherit;font-size:16px;resize:vertical}
:root .lx-q .x-row{margin-top:6px}
:root .lx-small{font-size:13.2px;color:var(--x-ink3)}
:root .lx-staff{color:var(--x-warn)}
@media (max-width:760px){:root .lx-board.lx-cols-2{grid-template-columns:minmax(0,1fr)}}
/* THE QUOTE TOOL, 4 Oct 2026 (Quote PR 2: hub-quote.js, and the Reply and quote box in hub-leads.js's second part). Used only once a client sets HUB_CLIENT.quoteApi. The window itself is the .fq rules above; these are what it gained. Theme tokens only. */
:root .lq-box h4{margin-bottom:8px}
:root .lq-box .x-facts{margin:0 0 8px}
:root .lq-box .ld-acts{margin-top:10px}
:root .lq-box .ld-quotes{margin-top:12px}
:root .lq-whole{white-space:pre-wrap}
:root .lq-photos:empty{display:none}
:root .lq-contact{margin-top:10px}
:root .ld-chip.lq-badge{background:var(--x-raise);color:var(--x-ink);border:1px solid var(--x-line2);margin-right:4px;font-variant-numeric:tabular-nums}
:root .ld-chip.lq-pcount{background:transparent;color:var(--x-ink3);border:1px dashed var(--x-line);margin-right:4px}
.fq-clash{margin:10px 18px 0;color:var(--x-ink)}
.fq-clash[hidden]{display:none}
.fq-clash p{margin:0}
.fq-clash .fq-acts{margin-top:8px}
@media (max-width:640px){
  .fq-clash{margin:8px 14px 0}
  :root dialog.fq-hub{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border-radius:0}
  .fq-hub .fq-head h2{font-size:17px}
  .fq-hub .fq-steps{gap:4px}
  .fq-hub .fq-step{font-size:13.5px;padding:0 4px}
  .fq-hub .fq-foot{gap:8px}
  .fq-hub .fq-foot .fq-btn{padding:0 12px}
  .fq-hub .fq-status .fq-acts .fq-btn{flex:1 1 100%}
  .fq-hub .fq-rate{grid-template-columns:minmax(0,1fr) 96px}
  :root .lq-box .ld-acts .button{flex:1 1 auto}
}

/* Busy states (4 Oct 2026): Brand and Gallery uploads, Save to Drive and the brand seed run. A spinner on the
   button pressed, and a bar pinned to the top of the window with the words and the progress. */
:root .x-spin{display:inline-block;flex:none;width:1em;height:1em;box-sizing:border-box;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:-.15em;animation:x-spin .8s linear infinite}
:root .button .x-spin{margin-right:7px}
:root .button[aria-busy="true"]{cursor:progress}
:root [data-br-up]:disabled:not([aria-busy="true"]),:root [data-br-save]:disabled:not([aria-busy="true"]),:root [data-gal-spotupload]:disabled,:root [data-gal-crop]:disabled,:root [data-gal-cropsave]:disabled{opacity:.5}
:root .x-busy{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 14px;padding:12px 14px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-panel);color:var(--x-ink);font-size:15.6px;font-weight:600;box-shadow:0 8px 24px var(--s-grey-16-a25)}
:root .x-busy>span:nth-child(2){flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
:root .x-pct{font-variant-numeric:tabular-nums;color:var(--x-ink3)}
:root .x-bar{display:block;flex:1 0 100%;height:6px;border-radius:3px;background:var(--x-line);overflow:hidden}
:root .x-bar i{display:block;height:100%;width:0;border-radius:3px;background:var(--brand,currentColor);transition:width .2s}
:root .x-bar.is-open i{width:35%;animation:x-slide 1.3s ease-in-out infinite}
:root .br-kt.is-busy .br-kt-acts{opacity:1}
:root .x-note{display:flex;align-items:center;gap:8px;margin:0 0 14px;padding:10px 14px;border-radius:12px;background:var(--x-chip);color:var(--x-chip-ink);font-size:15.6px;font-weight:600}
:root .x-note .icon{width:18px;height:18px;flex:none}
:root .x-note.is-bad{background:var(--x-warn-bg);color:var(--x-ink);border-left:4px solid var(--s-red-47)}
@keyframes x-spin{to{transform:rotate(360deg)}}
@keyframes x-slide{from{transform:translateX(-100%)}to{transform:translateX(290%)}}
@media(prefers-reduced-motion:reduce){:root .x-spin{animation:none;border-right-color:currentColor;opacity:.55}:root .x-bar.is-open i{animation:none;width:100%;opacity:.45}}

/* ---- Shop and Orders (tool 9), 5 Oct 2026, Shop PR 2: hub-shop.js and hub-till.js. Nothing here applies until a
   client sets HUB_CLIENT.shopApi: every rule is under a class only those two files draw. */
:root .sh-empty{display:flex;align-items:center;gap:8px;margin:4px 0 14px;font-size:16.2px;line-height:1.5;color:var(--x-ink2)}
:root .sh-bad{color:var(--x-ink);border-left:3px solid var(--s-red-47);padding-left:10px}
:root .sh-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:0 0 14px}
:root .sh-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px;position:sticky;top:0;z-index:2;background:var(--x-panel);padding:6px 0}
:root .sh-search{flex:1 1 220px;margin:0;min-width:0}
:root .sh-prod{border:1px solid var(--x-line);border-radius:12px;margin:0 0 8px;background:var(--x-panel)}
:root .sh-prod>summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center;padding:12px 14px;cursor:pointer;list-style:none}
:root .sh-prod>summary::-webkit-details-marker{display:none}
:root .sh-new{padding:14px}
:root .sh-name b{display:block;font-size:16.2px;font-weight:600;color:var(--x-ink)}
:root .sh-name small{display:block;font-size:14.4px;color:var(--x-ink3)}
:root .sh-price{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--x-ink);white-space:nowrap}
:root .sh-chips{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px}
:root .sh-chip{display:inline-block;font-size:13px;border-radius:999px;padding:2px 9px;margin-left:4px;background:var(--x-chip);color:var(--x-chip-ink)}
:root .sh-chips .sh-chip{margin-left:0}
:root .sh-warn{background:var(--x-warn-bg);color:var(--x-warn)}
:root .sh-inside{padding:0 14px 14px;border-top:1px solid var(--x-line)}
:root .sh-form{margin:12px 0 0}
:root .sh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px 12px;margin:0 0 10px}
:root .sh-field{display:flex;flex-direction:column;gap:4px;font-size:14.4px;color:var(--x-ink2);min-width:0}
:root .sh-field input,:root .sh-field select,:root .sh-field textarea{font:inherit;font-size:15px;color:var(--x-ink);background:var(--x-panel);border:1px solid var(--x-line2);border-radius:8px;padding:8px 10px;min-width:0;width:100%}
:root .sh-field [aria-invalid="true"]{border-color:var(--s-red-47);box-shadow:0 0 0 2px color-mix(in srgb,var(--s-red-47) 20%,transparent)}
:root .sh-wide{grid-column:1/-1}
:root .sh-narrow{max-width:130px}
:root .sh-check{display:flex;align-items:center;gap:6px;font-size:15px;color:var(--x-ink2)}
:root .sh-variants{border:1px dashed var(--x-line2);border-radius:10px;padding:10px 12px;margin:0 0 10px}
:root .sh-variants legend{font-size:14.4px;color:var(--x-ink3);padding:0 4px}
:root .sh-vrow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr)) auto;gap:8px;align-items:end;margin:0 0 8px}
:root .sh-x{padding:6px}
:root .sh-save{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
:root .sh-save .preview-status{margin:0}
:root .sh-who{font-size:14.4px;color:var(--x-ink3);margin:8px 0}
:root .sh-stock{display:grid;gap:8px;margin:14px 0 0}
:root .sh-vstock{display:flex;flex-wrap:wrap;align-items:end;gap:8px 12px;padding:10px 12px;background:var(--x-raise);border:1px solid var(--x-line);border-radius:10px}
:root .sh-vstock>b{min-width:90px;font-size:15px;color:var(--x-ink);align-self:center}
:root .sh-now{align-self:center;font-variant-numeric:tabular-nums;color:var(--x-ink2)}
:root .sh-now s{color:var(--x-ink3)}
:root .sh-hist{flex-basis:100%;margin:6px 0 0;padding-left:18px;font-size:14.4px;color:var(--x-ink2)}
:root .sh-hist small{color:var(--x-ink3)}
:root .sh-photobox{margin:14px 0 0;padding:12px 0 0;border-top:1px solid var(--x-line)}
:root .sh-photobox .sh-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
:root .sh-addphoto{position:relative;cursor:pointer}
:root .sh-addphoto input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
:root .sh-addphoto:focus-within{outline:2px solid var(--x-ink);outline-offset:2px}
:root .sh-off{opacity:.5;pointer-events:none}
:root .sh-upbar{height:6px;max-width:360px;margin:10px 0 4px;border-radius:3px;background:var(--x-line);overflow:hidden}
:root .sh-upbar i{display:block;height:100%;background:var(--x-ink);transition:width .2s}
:root .sh-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;margin:12px 0 0}
:root .sh-photos figure{margin:0;min-width:0;font-size:12.6px;color:var(--x-ink3)}
:root .sh-photos img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;border:1px solid var(--x-line);background:var(--x-line)}
:root .sh-photos figcaption{margin:6px 0 0;font-weight:600;color:var(--x-ink)}
:root .sh-photos figcaption small{display:block;font-weight:400;color:var(--x-ink3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root .sh-lead img{border:2px solid var(--x-ink)}
:root .sh-pacts{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0 0}
:root .sh-pacts .button,:root .sh-pconfirm .button{flex:1 1 auto;justify-content:center;min-height:34px;padding:4px 8px;font-size:12.6px;white-space:nowrap}
:root .sh-pacts .sh-span{flex-basis:100%}
:root .sh-pconfirm{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0 0;padding:8px;border:1px solid var(--x-line);border-radius:8px;color:var(--x-ink)}
:root .sh-palt{display:flex;flex-wrap:wrap;align-items:flex-end;gap:6px;margin:6px 0 0}
:root .sh-palt .sh-field{flex:1 1 140px;min-width:0}
:root .sh-gpick{margin:12px 0 0;padding:12px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-raise)}
:root .sh-gtitle{margin:0 0 8px;font-size:15px;font-weight:600;color:var(--x-ink);overflow-wrap:anywhere}
:root .sh-gfolders{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
:root .sh-gfolders .button{min-height:34px;padding:4px 10px;font-size:13.5px}
:root .sh-gphotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px;max-height:420px;overflow:auto;padding:2px}
:root .sh-gpic{position:relative;display:flex;flex-direction:column;gap:4px;min-width:0;font-size:12.6px;color:var(--x-ink2);cursor:pointer}
:root .sh-gpic img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;border:2px solid transparent;background:var(--x-line)}
:root .sh-gpic input{position:absolute;top:8px;left:8px;width:20px;height:20px;margin:0;accent-color:var(--x-ink);cursor:pointer}
:root .sh-gpic input:checked~img{border-color:var(--x-ink)}
:root .sh-gpic input:focus-visible~img{outline:2px solid var(--x-ink);outline-offset:2px}
:root .sh-gpic input:disabled{cursor:not-allowed}
:root .sh-gpic input:disabled~img{opacity:.45}
:root .sh-gpic span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root .sh-gacts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0 0}
:root .sh-gacts .sh-who{margin:0}
:root .sh-table{width:100%;border-collapse:collapse;font-size:15px;color:var(--x-ink)}
:root .sh-table th{text-align:left;font-weight:500;font-size:14.4px;color:var(--x-ink3);padding:6px 8px;border-bottom:1px solid var(--x-line)}
:root .sh-table td{padding:8px;border-bottom:1px solid var(--x-line);vertical-align:top}
:root .sh-table small{display:block;font-size:13px;color:var(--x-ink3)}
:root .sh-h{font-size:16.2px;font-weight:600;color:var(--x-ink);margin:18px 0 8px}
:root .sh-h small{font-weight:500;color:var(--x-ink3);margin-left:4px}
:root .sh-order{border:1px solid var(--x-line);border-radius:12px;padding:12px 14px;margin:0 0 8px;background:var(--x-panel)}
:root .sh-ohead{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:16.2px;color:var(--x-ink)}
:root .sh-ohead .sh-price{margin-left:auto}
:root .sh-items{margin:6px 0 0;font-size:15px;color:var(--x-ink2)}
:root .sh-note{margin:6px 0 0;padding:6px 10px;border-left:3px solid var(--x-line2);font-size:14.4px;color:var(--x-ink2)}
:root .sh-acts{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0}
:root .sh-acts:empty{display:none}
:root .sh-chart{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;align-items:end;height:160px}
:root .sh-chart div{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:3px;font-size:12.6px;color:var(--x-ink3)}
:root .sh-chart i{display:block;width:70%;background:var(--x-chip-ink);border-radius:4px 4px 0 0}
:root .sh-chart b{font-weight:500;color:var(--x-ink2);font-variant-numeric:tabular-nums}
:root .sh-bankbox{margin:22px 0 0;padding:14px 16px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise);color:var(--x-ink2);font-size:15px}
:root .tl-demo{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px;padding:8px 12px;border-radius:10px;background:var(--x-warn-bg);color:var(--x-warn);font-size:15px}
:root .tl-wrap{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:16px;align-items:start}
:root .tl-left .search-input{margin:0 0 8px}
:root .tl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin:10px 0 0}
:root .tl-item{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:8px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font-size:14.4px;min-height:44px}
:root .tl-item:disabled{opacity:.5}
:root .tl-item img,:root .tl-noimg{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;background:var(--x-raise)}
:root .tl-item small{color:var(--x-ink3)}
:root .tl-item span{font-variant-numeric:tabular-nums;color:var(--x-ink2)}
:root .tl-right{border:1px solid var(--x-line);border-radius:12px;padding:12px;background:var(--x-raise);position:sticky;top:0}
:root .tl-lines{list-style:none;margin:10px 0;padding:0}
:root .tl-lines li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid var(--x-line);font-size:15px;color:var(--x-ink)}
:root .tl-qty{display:flex;align-items:center;gap:4px}
:root .tl-qty .button{min-width:36px;min-height:36px;padding:4px}
:root .tl-total{display:flex;justify-content:space-between;align-items:baseline;font-size:16.2px;color:var(--x-ink2);margin:8px 0}
:root .tl-total b{font-size:24px;color:var(--x-ink);font-variant-numeric:tabular-nums}
:root .tl-tender,:root .tl-due{font-size:15px;color:var(--x-ink2);margin:4px 0}
:root .tl-ways{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
:root .tl-ways .button{min-height:44px}
:root .tl-go{width:100%;min-height:48px;justify-content:center;margin:8px 0 0}
:root .tl-email{display:flex;gap:6px;flex:1 1 220px}
:root .tl-email input{flex:1;min-width:0;font:inherit;padding:8px 10px;border:1px solid var(--x-line2);border-radius:8px;background:var(--x-panel);color:var(--x-ink)}
:root .tl-receipt{display:none}
@media print{
  :root.tl-printing body>*:not(.shell):not(dialog),:root.tl-printing .shell>.sidebar,:root.tl-printing .app>.topbar,:root.tl-printing .content>:not(dialog){display:none!important}
  :root.tl-printing dialog *{visibility:hidden}
  :root.tl-printing .tl-receipt,:root.tl-printing .tl-receipt *{visibility:visible}
  :root.tl-printing .tl-receipt{display:block;position:fixed;inset:0 auto auto 0;width:72mm;font:12px/1.4 monospace;color:#000;background:#fff}
  :root.tl-printing .tl-receipt span{float:right}
}
@media (max-width:760px){
  :root .sh-vrow{grid-template-columns:repeat(2,minmax(0,1fr)) auto}
  :root .tl-wrap{grid-template-columns:minmax(0,1fr)}
  :root .tl-right{position:static}
  :root .sh-narrow{max-width:none;flex:1 1 120px}
  :root .sh-photos{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* ---- end of Shop and Orders */

/* ==========================================================================
   THE SHARED WEBSITE & GOOGLE (hub-web.js, Website & Google PR 2, 5 Oct 2026). Every class here is wb-*,
   new with this block, so nothing drawn before it changes. The windows also use the shared report-tabs,
   rp-*, ws-*, rv-*, g-* and ad-shot styles above. Inert until a client sets HUB_CLIENT.webApi.
   ========================================================================== */
:root .wb-empty{display:flex;align-items:center;gap:8px;margin:4px 0 14px;font-size:16.2px;line-height:1.5;color:var(--x-ink2)}
:root .wb-bad{color:var(--x-ink);border-left:3px solid var(--s-red-47);padding-left:10px}
:root .wb-lock{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;max-width:720px;margin:0 0 18px;padding:14px 16px;border:1px dashed var(--x-line2);border-radius:14px;background:var(--x-raise);color:var(--x-ink3)}
:root .wb-lock b{display:block;color:var(--x-ink2);font-size:16.2px}
:root .wb-lock p{margin:2px 0 0;font-size:15px;line-height:1.45}
:root .wb-lock-mark{width:14px;height:14px;border-radius:4px;border:2px solid currentColor;opacity:.6}
:root .wb-picker{display:grid;gap:10px;margin:0 0 14px}
:root .wb-group-name{margin:0 0 4px;font-size:13.5px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;color:var(--x-ink3)}
:root .wb-group .report-tabs{margin:0;flex-wrap:wrap}
:root .wb-preview{max-width:1080px;margin:0 0 12px;border:1px solid var(--x-line);border-radius:12px;overflow:hidden;background:var(--x-raise)}
:root .wb-preview-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border-bottom:1px solid var(--x-line);font-size:14.4px;color:var(--x-ink3)}
:root .wb-preview-bar>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root .wb-preview-bar .report-tabs{margin:0;flex:none}
:root .wb-frame{display:block;width:100%;height:560px;border:0;background:var(--s-white)}
:root .wb-frame.wb-phone{width:390px;max-width:100%;height:700px;margin:0 auto;border-left:1px solid var(--x-line);border-right:1px solid var(--x-line)}
:root .wb-photo{display:block;width:100%;max-width:900px;height:auto;border-radius:12px;border:1px solid var(--x-line)}
:root .wb-hint{margin:6px 0 0;font-size:14.4px;color:var(--x-warn)}
:root .wb-hint[hidden]{display:none}
:root .wb-needs{background:var(--x-warn-bg);color:var(--x-ink);border:1px solid var(--x-warn)}
:root .rv.wb-replied{background:var(--x-raise)}
:root .wb-rv .rv-foot{flex-wrap:wrap}
:root .wb-rv .rv-mine{min-width:0}
:root .wb-rv{margin-bottom:22px}
:root .wb-places{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:10px;padding:10px 12px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-panel)}
:root .wb-places .field-label{flex:1 0 100%;margin:0}
:root .wb-places label{display:inline-flex;align-items:center;gap:6px;font-size:15.6px;color:var(--x-ink)}
:root .wb-words{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:1080px;margin:12px 0 4px}
:root .wb-word{display:grid;gap:8px;align-content:start;justify-items:start}
:root .wb-word textarea{width:100%;min-height:120px}
:root .wb-tips,:root .wb-check{margin:6px 0 14px;padding-left:22px;max-width:760px;font-size:16.2px;line-height:1.55;color:var(--x-ink2)}
:root .wb-tips li+li,:root .wb-check li+li{margin-top:6px}
:root .wb-check{list-style:none;padding-left:0}
:root .wb-check li::before{content:"";display:inline-block;width:12px;height:12px;margin-right:10px;border:2px solid var(--x-line2);border-radius:3px;vertical-align:-1px}
:root .wb-me td{font-weight:600}
@media (max-width:1050px){
  :root .wb-lock{grid-template-columns:minmax(0,1fr)}
  :root .wb-lock-mark{display:none}
  :root .wb-words{grid-template-columns:minmax(0,1fr)}
  :root .wb-frame{height:440px}
  :root .wb-frame.wb-phone{height:600px}
  :root .wb-preview-bar{flex-wrap:wrap}
}

/* ==========================================================================
   THE SHARED QR CODES (hub-qr.js, QR codes PR 2, 5 Oct 2026). Every class here is qr-*, new with this block,
   so nothing drawn before it changes. The window also uses the shared button, x-row, x-spin, preview-status,
   source-note and dialog styles above. Inert until a client sets HUB_CLIENT.qrApi.
   ========================================================================== */
:root .qr-bad{color:var(--x-ink);border-left:3px solid var(--s-red-47);padding-left:10px}
:root .qr-small{margin:6px 0 0;font-size:15px;line-height:1.5;color:var(--x-ink3)}
:root .qr-form{display:grid;gap:12px;max-width:640px;margin:0 0 18px;padding:16px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-raise)}
:root .qr-form .x-row{margin-top:2px}
:root .qr-field{display:grid;gap:6px;font-size:15.6px;font-weight:600;color:var(--x-ink2)}
:root .qr-field input{width:100%;padding:10px 12px;border:1px solid var(--x-line2);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:16.2px/1.4 Inter,system-ui,Arial,sans-serif}
:root .qr-tick{display:flex;align-items:flex-start;gap:8px;font-size:15px;line-height:1.45;color:var(--x-ink2)}
:root .qr-list{display:grid;gap:14px;margin:6px 0 18px}
:root .qr-card{display:grid;grid-template-columns:150px minmax(0,1fr);gap:18px;padding:16px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-raise)}
:root .qr-card.is-paused .qr-pic{opacity:.45}
:root .qr-pic svg{display:block;width:150px;height:150px;border-radius:8px}
:root .qr-main{min-width:0}
:root .qr-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
:root .qr-head b{font-size:18px;color:var(--x-ink)}
:root .qr-pill{font-size:13.5px;padding:3px 8px;border-radius:999px;background:var(--x-chip);color:var(--x-chip-ink)}
:root .qr-line{margin:6px 0 0;font-size:15.6px;line-height:1.5;color:var(--x-ink2);overflow-wrap:anywhere}
:root .qr-line a{color:inherit;text-decoration:underline;text-underline-offset:3px}
:root .qr-scans{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px;margin-top:10px;font-size:15px;color:var(--x-ink3)}
:root .qr-scans b{font-size:18px;color:var(--x-ink)}
:root .qr-bars{display:inline-flex;align-items:flex-end;gap:3px;height:28px}
:root .qr-bars i{display:block;width:7px;border-radius:2px;background:var(--x-ink3);opacity:.7}
:root .qr-colour select{padding:9px 10px;border:1px solid var(--x-line2);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:15.6px Inter,system-ui,Arial,sans-serif}
:root .qr-hist ul{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:6px;font-size:15px;color:var(--x-ink2)}
:root .qr-hist time{color:var(--x-ink3)}
:root .qr-edit{margin:14px 0 0}
:root .qr-colour select{width:100%}
:root .qr-more summary{cursor:pointer;font-size:15.6px;font-weight:600;color:var(--x-ink2)}
:root .qr-more[open] summary{margin-bottom:10px}
:root .qr-more .qr-tick{margin-top:10px}
@media(max-width:640px){:root .qr-card{grid-template-columns:1fr}:root .qr-pic svg{width:180px;height:180px}}

/* ==========================================================================
   THE SHARED BRIEF QUESTIONNAIRE AND SITE NOTICE (hub-brief.js and hub-notice.js, Brief and Site notice PR 2,
   5 Oct 2026). Every class here is bf-* or nt-*, new with this block, so nothing drawn before it changes. The
   windows also use the shared button, x-row, x-spin, x-staff, source-note and dialog styles above. Inert until
   a client sets HUB_CLIENT.briefApi or HUB_CLIENT.noticeApi.
   ========================================================================== */
:root .bf-form-wrap{max-width:760px;margin:0 0 22px;padding:18px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-raise)}
:root .bf-form-wrap h3{margin:0 0 4px;font-size:19.2px;color:var(--x-ink)}
:root .bf-intro{margin:0 0 10px;font-size:16.2px;line-height:1.55;color:var(--x-ink2)}
:root .bf-form{display:grid;gap:14px}
:root .bf-field{display:grid;gap:6px}
:root .bf-field label{font-size:16.2px;font-weight:600;color:var(--x-ink)}
:root .bf-help{font-size:15px;line-height:1.45;color:var(--x-ink3)}
:root .bf-field input,:root .bf-field select,:root .bf-field textarea{width:100%;padding:10px 12px;border:1px solid var(--x-line2);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:16.2px/1.5 Inter,system-ui,Arial,sans-serif}
:root .bf-field textarea{resize:vertical;min-height:96px}
:root .bf-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
:root .bf-when{font-size:15px;color:var(--x-ink3)}
:root .bf-status{margin:0;min-height:20px;font-size:15.6px;color:var(--x-ink2)}
:root .bf-bad{color:var(--x-ink);border-left:3px solid var(--s-red-47);padding-left:10px}
:root .bf-acct{margin-top:22px;padding-top:16px;border-top:1px solid var(--x-line)}
:root .bf-acct h3{margin:0 0 10px;font-size:19.2px;color:var(--x-ink)}
:root .bf-acct-form{margin:0 0 14px;padding:14px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-raise)}
:root .bf-acct-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px}
:root .bf-acct-head b{font-size:17.4px;color:var(--x-ink)}
:root .bf-acct-head .link-button{margin-left:auto}
:root .bf-acct-form dl{display:grid;gap:4px;margin:10px 0 0}
:root .bf-acct-form dt{font-size:14.4px;font-weight:600;color:var(--x-ink3)}
:root .bf-acct-form dd{margin:0 0 8px;font-size:16.2px;line-height:1.5;color:var(--x-ink);white-space:pre-wrap;overflow-wrap:anywhere}
:root .nt-note{margin:0 0 14px;font-size:16.2px;line-height:1.5;color:var(--x-ink2)}
:root .nt-form{display:grid;gap:14px;max-width:760px}
:root .nt-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
:root .nt-field{display:grid;gap:6px;font-size:16.2px}
:root .nt-field>span{font-weight:600;color:var(--x-ink)}
:root .nt-field small{font-size:14.4px;color:var(--x-ink3)}
:root .nt-field input{width:100%;padding:10px 12px;border:1px solid var(--x-line2);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:16.2px/1.4 Inter,system-ui,Arial,sans-serif}
:root .nt-tick{display:flex;align-items:center;gap:8px;font-size:16.2px;color:var(--x-ink)}
:root .nt-bar{padding:12px 16px;border-radius:10px;background:var(--x-ink);color:var(--x-panel);font-weight:600;font-size:16.2px;line-height:1.45;overflow-wrap:anywhere}
:root .nt-bar.nt-empty{opacity:.55}
:root .nt-small{font-size:15px;color:var(--x-ink3)}
:root .nt-status{margin:0;font-size:15.6px;color:var(--x-ink2)}
:root .nt-bad{color:var(--x-ink);border-left:3px solid var(--s-red-47);padding-left:10px}
@media(max-width:640px){:root .nt-two{grid-template-columns:1fr}}

/* ==========================================================================
   THE SHARED MARKETING (hub-marketing.js, Marketing PR 2, 5 Oct 2026). Every class here is mkt-*, new with
   this block, so nothing drawn before it changes. The window also uses the shared pill, button, x-row,
   field-label and preview-status styles above. Inert until a client sets HUB_CLIENT.marketingApi.
   ========================================================================== */
:root .mkt-head h3{margin:0 0 6px;font-size:22px}
:root .mkt-mock{max-width:900px;margin:0 0 16px;padding:12px 14px;border:1px solid var(--x-warn);border-radius:12px;background:var(--x-warn-bg);color:var(--x-ink);font-size:16.2px;line-height:1.5}
:root .mkt-badge{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 14px;font-size:16.2px;color:var(--x-ink2)}
:root .mkt-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin:0 0 14px;padding:10px 12px;border:1px dashed var(--x-line2);border-radius:10px;font-size:15px;color:var(--x-ink3)}
:root .mkt-group{margin:0 0 22px}
:root .mkt-place{margin:0 0 10px;font-size:13.5px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;color:var(--x-ink3)}
:root .mkt-piece{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:16px;margin:0 0 14px;padding:14px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-panel)}
:root .mkt-piece.is-picked{border-color:var(--x-ink2);box-shadow:0 0 0 1px var(--x-ink2)}
:root .mkt-piece.is-hidden{opacity:.6}
:root .mkt-spot{position:relative;min-height:150px;border-radius:10px;overflow:hidden;background:var(--x-raise);border:1px solid var(--x-line)}
:root .mkt-spot a{display:block}
:root .mkt-spot img{display:block;width:100%;height:100%;min-height:150px;object-fit:cover}
:root .mkt-art svg{display:block;width:100%;height:auto}
:root .mkt-spot .mkt-art{position:absolute;inset:0;pointer-events:none}
:root .mkt-nophoto{display:flex;align-items:center;justify-content:center;color:var(--x-ink3);font-size:15px}
:root .mkt-notes h4{margin:0 0 6px;font-size:19.2px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
:root .mkt-blurb{margin:0 0 10px;font-size:16.2px;line-height:1.5;color:var(--x-ink2)}
:root .mkt-one{display:flex;justify-content:space-between;gap:12px;margin:0 0 8px;font-size:16.2px}
:root .mkt-opts{display:grid;gap:6px;margin:0 0 8px}
:root .mkt-opts label{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;font-size:16.2px}
:root .mkt-opts b,:root .mkt-one b{white-space:nowrap}
:root .mkt-tick{display:inline-flex;align-items:center;gap:8px;margin:4px 0;font-size:16.8px;font-weight:600}
:root .mkt-ticked{margin:4px 0;font-size:15px;color:var(--x-ink3)}
:root .mkt-dlrow{margin-top:10px}
:root .mkt-locked{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px dashed var(--x-line2);border-radius:8px;color:var(--x-ink3);font-size:15px}
:root .mkt-staff{display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px;margin-top:10px}
:root .mkt-source{font-size:14.4px;color:var(--x-ink3)}
:root .mkt-source pre{white-space:pre-wrap;max-width:640px;font:inherit}
:root .mkt-edit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;margin:10px 0 14px;padding:12px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-raise)}
:root .mkt-edit .x-row{grid-column:1/-1}
:root .mkt-f{display:grid;gap:4px;font-size:14.4px;color:var(--x-ink3)}
:root .mkt-f input,:root .mkt-f textarea,:root .mkt-f select{width:100%;font:inherit;font-size:16.2px;color:var(--x-ink);padding:8px;border:1px solid var(--x-line2);border-radius:8px;background:var(--x-panel)}
:root .mkt-c{display:flex;align-items:center;gap:8px;font-size:15px}
:root .mkt-sum{max-width:760px;margin:8px 0 0;padding:16px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-raise)}
:root .mkt-sum h3{margin:0 0 6px;font-size:20.4px}
:root .mkt-lead,:root .mkt-small{margin:0 0 10px;font-size:15.6px;line-height:1.5;color:var(--x-ink2)}
:root .mkt-small{margin-top:10px;font-size:14.4px;color:var(--x-ink3)}
:root .mkt-list{list-style:none;margin:0 0 10px;padding:0}
:root .mkt-list li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--x-line);font-size:16.2px}
:root .mkt-list .mkt-empty{color:var(--x-ink3)}
:root .mkt-total{margin:0 0 10px;font-size:16.8px}
:root .mkt-note{width:100%;min-height:80px;font:inherit;font-size:16.2px;padding:10px;border:1px solid var(--x-line2);border-radius:8px;background:var(--x-panel);color:var(--x-ink)}
:root .mkt-sends ul{margin:4px 0 0;padding-left:18px;font-size:15px;color:var(--x-ink2)}
@media (max-width:1050px){
  :root .mkt-piece{grid-template-columns:minmax(0,1fr)}
  :root .mkt-edit{grid-template-columns:minmax(0,1fr)}
}

/* ==========================================================================
   THE SHARED BILLING (hub-billing.js, 6 Oct 2026). Every class here is bl-*, new with this block. The list rows
   reuse ao-row above. Inert until a client sets HUB_CLIENT.billingApi.
   ========================================================================== */
:root .bl-list{margin:0 0 6px}
:root .bl-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
:root .bl-staff>span{flex-basis:100%}
:root .bl-staff .bl-form{flex:1 1 100%}
:root .bl-form{display:grid;gap:14px;max-width:760px}
:root .bl-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
:root .bl-field{display:grid;gap:6px;font-size:16.2px}
:root .bl-field>span{font-weight:600;color:var(--x-ink)}
:root .bl-field small{font-size:14.4px;color:var(--x-ink3)}
:root .bl-field input{width:100%;padding:10px 12px;border:1px solid var(--x-line2);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:16.2px/1.4 Inter,system-ui,Arial,sans-serif}
:root .bl-small{font-size:15px;color:var(--x-ink3)}
:root .bl-status{margin:0;font-size:15.6px;color:var(--x-ink2)}
:root .bl-bad{color:var(--x-ink);border-left:3px solid var(--s-red-47);padding-left:10px}
:root .bl-chip{flex:none;font-size:14.4px;line-height:1.3;padding:4px 9px;border-radius:6px;border:1px solid transparent;background:var(--x-chip);color:var(--x-chip-ink);white-space:nowrap;font-weight:560}
:root .bl-chip.is-unpaid{background:var(--x-warn-bg);border-color:var(--x-warn);color:var(--x-ink)}
:root .bl-chip.is-overdue{background:var(--x-panel);border-color:var(--s-red-47);color:var(--x-ink)}
:root select.bl-chip{font-family:inherit;cursor:pointer;padding-right:6px}
:root .bl-actions{align-items:center}
:root .bl-field select{width:100%;padding:10px 12px;border:1px solid var(--x-line2);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:16.2px/1.4 Inter,system-ui,Arial,sans-serif}
:root .bl-narrow{max-width:240px}
@media(max-width:640px){:root .bl-two{grid-template-columns:1fr}:root .bl-list .ao-row{flex-direction:column;align-items:stretch}:root .bl-actions{justify-content:flex-start}}
/* ==========================================================================
   THE SHARED INVOICES (hub-invoices.js, Invoices PR 2, 6 Oct 2026). Every class here is iv-*, new with this
   block. The rows reuse ao-row and the tiles ao-tile above. Inert until a client sets HUB_CLIENT.invoicesApi.
   ========================================================================== */
:root .iv-tiles{margin:4px 0 16px}
:root .iv-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:0 0 10px}
:root .iv-views{display:inline-flex;flex-wrap:wrap;gap:6px}
:root .iv-views button{font-size:16.2px;padding:9px 12px;border-radius:8px;background:var(--x-chip);color:var(--x-chip-ink);border:1px solid var(--x-line2)}
:root .iv-views button[aria-pressed="true"]{background:var(--x-ink);color:var(--x-panel);border-color:var(--x-ink)}
:root .iv-n{font-size:14.4px;opacity:.8}
:root .iv-list{margin:0 0 10px}
:root .iv-row{flex-wrap:wrap;align-items:center;gap:10px}
:root .iv-row>div:first-child{flex:1 1 260px;min-width:0}
:root .iv-row b{overflow-wrap:anywhere}
:root .iv-note{white-space:pre-wrap;overflow-wrap:anywhere}
:root .iv-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}
:root .iv-void{opacity:.6}
:root .iv-late{border-left:3px solid var(--s-red-47)}
:root .iv-pay{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
:root .iv-form{display:grid;gap:14px;max-width:760px;margin:0 0 12px}
:root .iv-form h3{margin:0;font-size:19.2px}
:root .iv-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
:root .iv-gst{display:grid;gap:4px}
:root .iv-gst>button{justify-self:start}
:root .iv-field{display:grid;gap:6px;font-size:16.2px}
:root .iv-field>span{font-weight:600;color:var(--x-ink)}
:root .iv-field input,:root .iv-field select,:root .iv-field textarea{width:100%;padding:10px 12px;border:1px solid var(--x-line2);border-radius:10px;background:var(--x-panel);color:var(--x-ink);font:16.2px/1.4 Inter,system-ui,Arial,sans-serif}
:root .iv-status{border:0;padding:0;margin:0;display:grid;gap:8px;font-size:16.2px}
:root .iv-status legend{font-weight:600;color:var(--x-ink);margin-bottom:6px}
:root .iv-small{font-size:15px;color:var(--x-ink3)}
:root .iv-status-line{margin:0 0 8px;font-size:15.6px;color:var(--x-ink2);min-height:1px}
:root .iv-bad{color:var(--x-ink);border-left:3px solid var(--s-red-47);padding-left:10px}
:root .iv-ask{border:1px solid var(--x-line2);border-radius:10px;padding:12px 14px;display:grid;gap:10px}
:root .iv-ask p{margin:0;font-size:16.2px}
:root .request-list button.is-quiet{opacity:.8}
@media(max-width:640px){:root .iv-two{grid-template-columns:1fr}:root .iv-row{flex-direction:column;align-items:stretch}:root .iv-row>div:first-child{flex:none}:root .iv-row>.ao-chip{align-self:flex-start}:root .iv-actions{justify-content:flex-start}:root .iv-bar{flex-direction:column;align-items:stretch}}

/* ==========================================================================
   THE MODS MARKETPLACE (hub.js renderMods, 7 Oct 2026). Every class here is mp-*, new with this block. The chips
   reuse ao-chip above.
   ========================================================================== */
:root .mp-h{margin:18px 0 10px;font-size:13.5px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;color:var(--x-ink3)}
:root .mp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
:root .mp-tile{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-height:150px;padding:16px;text-align:left;border:1px solid var(--x-line);border-radius:14px;background:var(--x-panel);color:var(--x-ink);cursor:pointer;transition:border-color .15s,transform .15s}
:root .mp-tile:hover,:root .mp-tile:focus-visible{border-color:var(--x-line2);transform:translateY(-1px)}
:root .mp-top{display:flex;align-items:center;justify-content:space-between;width:100%}
:root .mp-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--x-raise)}
:root .mp-icon .icon{width:20px;height:20px}
:root .mp-tile b{font-size:17px;font-weight:600;line-height:1.25}
:root .mp-tile small{font-size:14.4px;line-height:1.45;color:var(--x-ink2)}
:root .mp-tile.is-addon .mp-icon{opacity:.75}
:root .mp-lock{display:inline-flex;align-items:center;gap:4px}
:root .mp-lock .ao-lock{width:12px;height:12px}
@media(max-width:640px){:root .mp-grid{grid-template-columns:1fr 1fr}:root .mp-tile{min-height:0}}
/* What's new: each conversation's actions (hub.js feedActs), 6 Oct 2026. */
:root .request-list .wn-row{display:flex;align-items:center;gap:14px}
:root .request-list .wn-row>button[data-thread]{flex:1;min-width:0}
:root .wn-acts{display:inline-flex;gap:12px;flex:none}
:root .request-list .wn-acts button,:root .request-actions .wn-acts button{display:inline;padding:0;background:none;border:0;font-size:14px;font-weight:600;color:var(--x-ink2);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
:root .request-actions .wn-acts{align-self:center;margin-left:6px}
:root .wn-acts button.danger{color:var(--s-red-56)}
/* The card can be narrow on a wide screen (the Overview's side column), so the actions follow the card's own width:
   below 560px each row's actions drop under its title, and the top one's under Open. */
:root .attention{container-type:inline-size}
:root .attention-body:not(:has(.photo-stack)){grid-template-columns:minmax(0,1fr)}
:root .request-actions{flex-wrap:wrap;align-items:center}
:root .request-list .wn-row .request-tag{white-space:nowrap}
:root .wn-acts{flex-wrap:wrap}
@container (max-width:560px){:root .request-list .wn-row{flex-wrap:wrap;gap:0 12px;padding-bottom:6px}:root .request-list .wn-row>button[data-thread]{flex-basis:100%;padding-bottom:2px}:root .request-list .wn-row .wn-acts{padding-left:22px}:root .request-actions .wn-acts{flex-basis:100%;margin-left:0;margin-top:4px}}
/* Quick links at every width (6 Oct 2026): a long address is cut short with an ellipsis inside the window, never
   widening it. The phone block above had this for narrow screens only. */
:root .destination-list{grid-template-columns:minmax(0,1fr)}
:root a.destination-item.ao-link{min-width:0}
:root a.destination-item.ao-link>.icon{flex:none}
:root a.destination-item.ao-link>span{flex:1 1 auto;min-width:0}
:root a.destination-item.ao-link small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* SUBJECT, DATE, PREVIEW (Jay, 8 Oct 2026). The Inbox's New message names a subject (hub-inbox.js .hi-subj), and What's new rows carry a preview line under the subject (hub.js .wn-text). */
:root .hi-subj{display:grid;gap:4px;font-size:13.2px;color:var(--x-ink3)}
:root .hi-subj input{padding:8px 10px;border-radius:8px;border:1px solid var(--x-line2);background:var(--x-panel);color:var(--x-ink);font:15px Inter,system-ui,sans-serif}
:root .request-list .wn-row>button[data-thread]>span:first-child{align-items:flex-start;min-width:0}
:root .request-list .wn-row>button[data-thread]>span:first-child>.icon{flex:none;margin-top:3px}
:root .request-list .wn-text{display:grid;gap:2px;min-width:0}
:root .request-list .wn-text b{font-weight:inherit;overflow-wrap:anywhere}
:root .request-list .wn-text small{font-size:14.4px;color:var(--x-ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ==========================================================================
   SIDEBAR SUITES (8 Oct 2026, Jay). Built by hub.js "the sidebar, in suites".
   One spacing scale for every row and every gap, so nothing is hand-spaced:
   --nav-row is the height of a row, --nav-gap the space between rows, and
   --nav-suite the space between groups. It tightens on short screens, once.
   ========================================================================== */
:root .sidebar{--nav-row:34px;--nav-gap:2px;--nav-suite:10px}
@media(max-height:860px){:root .sidebar{--nav-row:32px;--nav-suite:8px}}
@media(max-height:800px){:root .sidebar{--nav-row:30px;--nav-suite:6px}}
@media(max-height:740px){:root .sidebar{--nav-row:28px;--nav-suite:4px}}
:root .sidebar .nav-list{display:grid;gap:var(--nav-gap)}
:root .sidebar .nav-item{min-height:var(--nav-row);padding-top:0;padding-bottom:0;box-sizing:border-box}
:root .sidebar .nav-group,:root .sidebar .nav-group+.nav-group{margin:0}
:root .sidebar nav{display:grid;gap:var(--nav-suite);align-content:start}
:root .sidebar .suite-head{display:flex;align-items:center;gap:8px;width:100%;min-height:var(--nav-row);padding:0 12px;border:0;border-radius:7px;background:transparent;color:var(--n-64);font:inherit;font-size:14.4px;font-weight:550;letter-spacing:1.1px;text-transform:uppercase;text-align:left;cursor:pointer;transition:background .15s,color .15s}
:root .sidebar .suite-head:hover{background:var(--n-25-2);color:var(--s-white)}
:root .sidebar .suite-head:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
:root .sidebar .suite-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root .sidebar .suite-lock{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;background:var(--brand);color:var(--brand-ink);line-height:0}
:root .sidebar .suite-lock[hidden],:root .sidebar .suite-count[hidden]{display:none}
:root .sidebar .suite-lock .ao-lock{width:12px;height:12px}
:root .sidebar .suite-count{margin-left:0;border-radius:4px;padding:2px 6px;font-size:12px;letter-spacing:0;text-transform:none}
:root .sidebar .suite-chev{flex:none;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
:root .sidebar .suite.is-shut .suite-chev{transform:rotate(-90deg)}
:root .sidebar .suite.is-shut .suite-body{display:none}
:root .sidebar .suite .suite-body .nav-item{padding-left:20px}
:root .sidebar .nav-top{margin-bottom:0}
:root .sidebar-bottom .nav-list,:root .sidebar-bottom{gap:var(--nav-gap)}
:root .sidebar-bottom>.nav-item{margin-bottom:var(--nav-gap)}
@media(prefers-reduced-motion:reduce){:root .sidebar .suite-chev{transition:none}}
:root .sidebar .suite:not(.is-shut) .suite-count{display:none}
:root .sidebar .suite{display:grid;gap:var(--nav-gap)}:root .sidebar .suite[hidden]{display:none}

/* ==========================================================================
   PAGES, NOT WINDOWS (Jay, 9 Oct 2026). A section opens as a page in the main area, in place of the Overview.
   hub.js moves the one <dialog> into <main> and opens it with show(), so it is not a layer: no backdrop, no click
   outside, no lock on the page behind. The Overview's cards are hidden while it is open and come back when it
   closes. Pop-ups that stay (Are you sure?, the photo picker) are other <dialog>s opened with showModal(), and
   are untouched. The ids win over the old window sizes above.
   ========================================================================== */
:root .content>#destination-dialog{position:static;inset:auto;width:min(740px,100%);max-width:100%;height:auto;max-height:none;margin:0 auto;box-shadow:none;overflow:visible}
:root .content>#destination-dialog.dialog-wide{width:min(1200px,100%)}
:root:has(#destination-dialog[open]) .content>:not(#destination-dialog){display:none}
:root .dialog-top{justify-content:flex-start;gap:14px}
:root .dialog-top .dlg-back{order:-1;flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;min-height:36px}
:root .dialog-top .dlg-back .icon{width:16px;height:16px}
:root .dialog-top h2{min-width:0}

/* ==========================================================================
   THE EDITABLE OVERVIEW (hub-overview.js, 9 Oct 2026, Jay). Every card now sits in the one .workspace-grid, which
   becomes 12 columns on a laptop and up: a widget is ov-c3 (a quarter), ov-c4, ov-c5, ov-c6 (a half), ov-c7 or
   ov-c12 (the row). A tablet keeps two columns and a phone one, the page's own rules above.
   ========================================================================== */
:root .ov-grid>.panel{margin:0!important}
/* The daily report is one short row, not a tall card. */
:root .ov-grid>#ov-report{min-height:0}
@media(min-width:1051px){
  :root .ov-grid{grid-template-columns:repeat(12,minmax(0,1fr))}
  :root .ov-grid>.ov-c3{grid-column:span 3}:root .ov-grid>.ov-c4{grid-column:span 4}:root .ov-grid>.ov-c5{grid-column:span 5}
  :root .ov-grid>.ov-c6{grid-column:span 6}:root .ov-grid>.ov-c7{grid-column:span 7}:root .ov-grid>.ov-c12{grid-column:1/-1}
}
@media(min-width:621px) and (max-width:1050px){
  :root .ov-grid>.ov-c5,:root .ov-grid>.ov-c6,:root .ov-grid>.ov-c7,:root .ov-grid>.ov-c12{grid-column:1/-1}
}
/* What's new rows that open a section (a report, leads, a site change) read like a conversation row. */
:root .request-list .wn-row>button[data-open]{flex:1;min-width:0}
:root .request-list .wn-row>button[data-open]>span:first-child{align-items:flex-start;min-width:0}
:root .request-list .wn-row>button[data-open]>span:first-child>.icon{flex:none;margin-top:3px}
:root .wn-new{display:inline-block;margin-right:6px;padding:2px 6px;border-radius:4px;background:var(--brand);color:var(--brand-ink);font-size:12px;font-weight:600;letter-spacing:0}
/* The Inbox as the large tile: its list is the card, so it loses the rule and the gap a list at the foot of What's new has. */
:root .ov-inbox-big{margin-top:14px}
:root .ov-inbox-big .request-list{border-top:0;margin-top:0;padding-top:0}
/* A mod as a widget. */
:root .ov-mod .ov-mod-what{margin:14px 0 0;font-size:16px;line-height:1.5;color:var(--x-ink2)}
:root .ov-mod .ao-list{margin:12px 0 0}
:root .ov-mod .ov-mod-new{background:var(--brand);color:var(--brand-ink)}
/* Edit Overview (PlainBlack only). */
:root .ovx-h{margin:18px 0 8px;font-size:13.5px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;color:var(--x-ink3)}
:root .ovx-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}
:root .ovx-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-panel)}
:root .ovx-row.is-off{opacity:.85}
:root .ovx-name{flex:1;min-width:0;display:grid;gap:2px}
:root .ovx-name b{font-weight:600;font-size:16.8px}
:root .ovx-name small{font-size:14.4px;color:var(--x-ink3)}
:root .ovx-ver{display:inline-flex;min-width:76px;justify-content:flex-end}
:root .ovx-ver button{padding:6px 14px;border:1px solid var(--x-line2);background:transparent;color:var(--x-ink2);font:inherit;font-size:14.4px;font-weight:600;cursor:pointer}
:root .ovx-ver button:first-child{border-radius:8px 0 0 8px}
:root .ovx-ver button:last-child{border-radius:0 8px 8px 0;border-left:0}
:root .ovx-ver button[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
:root .ovx-move{display:inline-flex;gap:4px}
:root .ovx-move button,:root .ovx-x{padding:6px 10px;border:1px solid var(--x-line2);border-radius:8px;background:transparent;color:var(--x-ink2);font:inherit;font-size:14.4px;font-weight:600;cursor:pointer}
:root .ovx-move button:disabled{opacity:.35;cursor:default}
:root .ovx-move button:not(:disabled):hover,:root .ovx-x:hover{border-color:var(--x-ink3);color:var(--x-ink)}
@media(max-width:640px){:root .ovx-row{flex-wrap:wrap}:root .ovx-name{flex-basis:100%}}
/* Gallery as a library (10 Oct 2026): every file type in the Drive folder. A file that is not a photo shows its
   type in a box, with Drive's thumbnail painted over it where Drive has one. */
:root .ph .gal-ficon,:root .gal-fbig .gal-ficon{position:absolute;top:0;left:0;right:0;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:var(--x-raise);color:var(--x-ink2);font:800 22px/1 Inter,system-ui,Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase}
:root .ph .gal-ficon ~ img,:root .gal-fbig .gal-ficon ~ img{position:relative;background:transparent}
:root .gal-fbig{position:relative;min-height:180px;border-radius:12px;overflow:hidden;border:1px solid var(--x-line)}
:root .gal-fbig img{display:block;width:100%;aspect-ratio:4/3;object-fit:contain}
:root .gal-fbig .gal-ficon{font-size:34px}
:root .gal-kinds{border-bottom:0;padding-bottom:0;margin-bottom:4px}
:root .gal-q{font:16.2px/1.3 Inter,system-ui,Arial,sans-serif;color:var(--x-ink);background:var(--x-raise);border:1px solid var(--x-line);border-radius:10px;padding:8px 10px;width:260px;max-width:100%}
:root .gal-cut{display:block;margin-top:6px;color:var(--x-ink2);font-size:14.4px}
