/* Kadabox kit — what every Kadabox page shares, served at /kit/ on each
   address (kadabox.com, app.kadabox.com, lab.kadabox.com): the brand's
   tokens, the mark, the networks' marks and a few brand pieces. The web
   inbox (app.css) and Android (Theme.kt) get the same tokens written into
   them by tools/design.mjs; the source is kit/tokens.json.

   Names are --kb-*: a page maps its own short names onto them
   (--acc: var(--kb-acc)), so a colour is decided here once. */
/* design:fonts — Inter, self-hosted on /kit/fonts/ (SIL OFL 1.1), written by tools/design.mjs from kit/tokens.json */
@font-face { font-family: Inter; font-style: normal; font-weight: 300 800; font-display: swap; src: url(/kit/fonts/inter-cyrillic-ext.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: Inter; font-style: normal; font-weight: 300 800; font-display: swap; src: url(/kit/fonts/inter-cyrillic.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: Inter; font-style: normal; font-weight: 300 800; font-display: swap; src: url(/kit/fonts/inter-greek-ext.woff2) format("woff2"); unicode-range: U+1F00-1FFF; }
@font-face { font-family: Inter; font-style: normal; font-weight: 300 800; font-display: swap; src: url(/kit/fonts/inter-greek.woff2) format("woff2"); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; }
@font-face { font-family: Inter; font-style: normal; font-weight: 300 800; font-display: swap; src: url(/kit/fonts/inter-vietnamese.woff2) format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: Inter; font-style: normal; font-weight: 300 800; font-display: swap; src: url(/kit/fonts/inter-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: Inter; font-style: normal; font-weight: 300 800; font-display: swap; src: url(/kit/fonts/inter-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/* /design */
:root {
  /* design:kit — written by tools/design.mjs from kit/tokens.json; edit the tokens, not these lines */
  --kb-sun: #ffb547; --kb-ember: #ff7a1a; --kb-flame: #ef4a2b; --kb-glow: #3ec8ff; --kb-heart: #ff3040;
  --kb-grad: linear-gradient(135deg, #ffb547 0%, #ff7a1a 55%, #ef4a2b 100%);
  --kb-grad-text: linear-gradient(100deg, #c2510a 0%, #d9441c 55%, #c92f3a 100%);
  --kb-ink-0: #ffffff; --kb-ink-25: #fbfcfd; --kb-ink-50: #f5f7fa; --kb-ink-100: #ebeff3; --kb-ink-150: #e0e5eb; --kb-ink-200: #d1d8e0;
  --kb-ink-300: #afb8c3; --kb-ink-400: #8993a1; --kb-ink-500: #66717f; --kb-ink-600: #4a5563; --kb-ink-650: #3c4551; --kb-ink-700: #313a45;
  --kb-ink-750: #28303a; --kb-ink-800: #20272f; --kb-ink-850: #1a2028; --kb-ink-900: #151a21; --kb-ink-950: #0e1218;
  --kb-accent-50: #fff6ef; --kb-accent-100: #ffe8d8; --kb-accent-200: #ffcda9; --kb-accent-300: #ffae79; --kb-accent-400: #ff9447; --kb-accent-500: #f2690f;
  --kb-accent-600: #c2510a; --kb-accent-700: #9a3f0b; --kb-accent-800: #8a2c08; --kb-accent-900: #4a2414; --kb-accent-950: #33200f;
  --kb-whatsapp: #25d366; --kb-instagram: #e1306c; --kb-telegram: #229ed9; --kb-sms: #8e8e93; --kb-messenger: #0084ff;
  --kb-font: Inter, "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
  --kb-mono: ui-monospace, "SF Mono", "Cascadia Code", "JetBrains Mono", Menlo, Consolas, monospace;
  --kb-r-xs: 8px; --kb-r-sm: 12px; --kb-r-md: 16px; --kb-r-lg: 22px; --kb-r-xl: 28px; --kb-r-pill: 999px;
  --kb-enter: cubic-bezier(.1,.82,.25,1); --kb-exit: cubic-bezier(.69,0,.79,.14); --kb-press: cubic-bezier(.2,0,0,1); --kb-spring: cubic-bezier(.34,1.56,.64,1);
  /* /design */
  /* design:doodle — the chat doodle (kit/doodle.json), a mask: background the ink, mask-image this */
  --kb-doodle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='360' viewBox='0 0 360 360'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='translate(70.5 322.3) rotate(-19)' d='M-7.5-6.5c0-1.6 1.3-2.5 2.7-2.5l2 4.3-2 1.8c1.1 2.6 3 4.5 5.6 5.6l1.8-2 4.3 2c0 1.4-.9 2.7-2.5 2.7C-1.5 5.4-7.5-.5-7.5-6.5z'/%3E%3Cpath transform='translate(27.2 61.9) rotate(-12)' d='M-9.5 1l3.5 3.5L1.5-4M-2.5 3.5l1 1L6.5-4'/%3E%3Cpath transform='translate(308.8 107.9) rotate(11)' d='M9-8L-9-.5l6.5 2.5L0 8.5zM-2.5 2L9-8'/%3E%3Cpath transform='translate(64.3 103.7) rotate(-24)' d='M-3-6a3 3 0 0 1 6 0v4a3 3 0 0 1-6 0zM-6.5-2a6.5 6.5 0 0 0 13 0M0 4.5V8'/%3E%3Cpath transform='translate(112.3 212.7) rotate(0)' d='M8.5 0A8.5 8.5 0 1 1-8.5 0 8.5 8.5 0 0 1 8.5 0zM0-5V0l3.5 2.5'/%3E%3Cpath transform='translate(219.1 196) rotate(27)' d='M0 7.5C-5.5 3.8-8.5.8-8.5-2.6a4.3 4.3 0 0 1 8.5-1.6 4.3 4.3 0 0 1 8.5 1.6C8.5.8 5.5 3.8 0 7.5z'/%3E%3Cpath transform='translate(148.7 274.6) rotate(10)' d='M8.5 0A8.5 8.5 0 1 1-8.5 0 8.5 8.5 0 0 1 8.5 0zM-8.5 0h17M0-8.5C3-5.5 3.4 5.5 0 8.5M0-8.5C-3-5.5-3.4 5.5 0 8.5'/%3E%3Cpath transform='translate(111.6 111.2) rotate(-24)' d='M0-5.5C.5-1.8 1.8-.5 5.5 0 1.8.5.5 1.8 0 5.5-.5 1.8-1.8.5-5.5 0-1.8-.5-.5-1.8 0-5.5z'/%3E%3Cpath transform='translate(167.7 106.9) rotate(25)' d='M-3-8l-2 16M3.5-8l-2 16M-7.5-3h15M-8.5 3h15'/%3E%3Cpath transform='translate(-3.6 -4.5) rotate(-8)' d='M-7.5 7.5C-7.5-2.5-1.5-8.5 8.5-8.5c0 10-6 16-16 16zM-7.5 7.5L2-2'/%3E%3Cpath transform='translate(-3.6 355.5) rotate(-8)' d='M-7.5 7.5C-7.5-2.5-1.5-8.5 8.5-8.5c0 10-6 16-16 16zM-7.5 7.5L2-2'/%3E%3Cpath transform='translate(356.4 -4.5) rotate(-8)' d='M-7.5 7.5C-7.5-2.5-1.5-8.5 8.5-8.5c0 10-6 16-16 16zM-7.5 7.5L2-2'/%3E%3Cpath transform='translate(356.4 355.5) rotate(-8)' d='M-7.5 7.5C-7.5-2.5-1.5-8.5 8.5-8.5c0 10-6 16-16 16zM-7.5 7.5L2-2'/%3E%3Cpath transform='translate(109.4 27.5) rotate(21)' d='M-9-3a2 2 0 0 1 2-2h2.5L-3-8h6l1.5 3H7a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H-7a2 2 0 0 1-2-2zM3.4 1a3.4 3.4 0 1 1-6.8 0 3.4 3.4 0 0 1 6.8 0z'/%3E%3Cpath transform='translate(300.6 186.3) rotate(14)' d='M0-9C.8-3 3-.8 9 0 3 .8.8 3 0 9-.8 3-3 .8-9 0-3-.8-.8-3 0-9z'/%3E%3Cpath transform='translate(258.1 40.2) rotate(-22)' d='M3.6 0a3.6 3.6 0 1 1-7.2 0 3.6 3.6 0 0 1 7.2 0zM3.6-3.6v5a2.4 2.4 0 0 0 4.8 0V0a8.5 8.5 0 1 0-3.3 6.7'/%3E%3Cpath transform='translate(209.9 125.3) rotate(-2)' d='M-6 7.5L0-8l6 15.5M-3.6 1.5h7.2'/%3E%3Cpath transform='translate(55.3 282.6) rotate(29)' d='M-1.5 3.5l-2 2a3.2 3.2 0 0 1-4.5-4.5l3-3a3.2 3.2 0 0 1 4.5 0M1.5-3.5l2-2a3.2 3.2 0 0 1 4.5 4.5l-3 3a3.2 3.2 0 0 1-4.5 0'/%3E%3Cpath transform='translate(134.3 178.3) rotate(16)' d='M-5.5 6a4.5 4.5 0 0 1-.6-9A6 6 0 0 1 5.4-3.3 4.7 4.7 0 0 1 5.6 6z'/%3E%3Cpath transform='translate(303.9 47.1) rotate(-25)' d='M-6 4V-1a6 6 0 0 1 12 0v5l2 2H-8zM-2 8.2a2 2 0 0 0 4 0'/%3E%3Cpath transform='translate(213.9 304) rotate(13)' d='M9-5a3 3 0 0 0-3-3H-6a3 3 0 0 0-3 3v6a3 3 0 0 0 3 3h6l5 4v-4h1a3 3 0 0 0 3-3zM-4-2h.01M0-2h.01M4-2h.01'/%3E%3Cpath transform='translate(-7.5 298.5) rotate(29)' d='M-7-2h11v5a5 5 0 0 1-5 5h-1a5 5 0 0 1-5-5zM4 0h1.5a2.5 2.5 0 0 1 0 5H3.6M-3.5-8.5c-1 1.4 1 2.4 0 4M.5-8.5c-1 1.4 1 2.4 0 4'/%3E%3Cpath transform='translate(352.5 298.5) rotate(29)' d='M-7-2h11v5a5 5 0 0 1-5 5h-1a5 5 0 0 1-5-5zM4 0h1.5a2.5 2.5 0 0 1 0 5H3.6M-3.5-8.5c-1 1.4 1 2.4 0 4M.5-8.5c-1 1.4 1 2.4 0 4'/%3E%3Cpath transform='translate(288.7 312.5) rotate(13)' d='M-9-5a3 3 0 0 1 3-3h12a3 3 0 0 1 3 3v6a3 3 0 0 1-3 3h-6l-5 4v-4h-1a3 3 0 0 1-3-3z'/%3E%3Cpath transform='translate(82.6 159.3) rotate(1)' d='M6.5 5.5A8 8 0 0 1-3.5-4.5a8 8 0 1 0 10 10z'/%3E%3Cpath transform='translate(151.8 64.2) rotate(-20)' d='M0-5c-2-2-5-2.5-8.5-2v13C-5 5.5-2 6 0 8c2-2 5-2.5 8.5-2V-7C5-7.5 2-7 0-5zM0-5V8'/%3E%3Cpath transform='translate(146.4 337.4) rotate(21)' d='M-8-6a3 3 0 0 1 3-3H5a3 3 0 0 1 3 3V6a3 3 0 0 1-3 3H-5a3 3 0 0 1-3-3zM-2-3.5v7l5.5-3.5z'/%3E%3Cpath transform='translate(237.1 93) rotate(29)' d='M0-8.5l2.5 5.2 5.7.8-4.1 4 1 5.7L0 4.5l-5.1 2.7 1-5.7-4.1-4 5.7-.8z'/%3E%3Cpath transform='translate(288.4 -8.3) rotate(-19)' d='M0 9a6 6 0 0 1-6-6c0-3.5 2.5-5.5 3.5-9 1.5 1.5 2.5 3.4 2.3 5.6C1-1.4 2-2.8 2.2-4.6 4.6-2.5 6 0 6 3a6 6 0 0 1-6 6z'/%3E%3Cpath transform='translate(288.4 351.7) rotate(-19)' d='M0 9a6 6 0 0 1-6-6c0-3.5 2.5-5.5 3.5-9 1.5 1.5 2.5 3.4 2.3 5.6C1-1.4 2-2.8 2.2-4.6 4.6-2.5 6 0 6 3a6 6 0 0 1-6 6z'/%3E%3Cpath transform='translate(213.8 258.8) rotate(-14)' d='M1.5-9l-7.5 11h6l-1.5 7L6-2H0z'/%3E%3Cpath transform='translate(48.9 219.7) rotate(4)' d='M-6-1h12v9H-6zM-4-1v-3a4 4 0 0 1 8 0v3'/%3E%3Cpath transform='translate(323.9 230.9) rotate(-5)' d='M-9-6h18v12H-9zM-9-5.5l9 6.5 9-6.5'/%3E%3Cpath transform='translate(48.8 3.1) rotate(-2)' d='M-3 6a2.6 2.6 0 1 1-5.2 0 2.6 2.6 0 0 1 5.2 0zM7 3.5a2.6 2.6 0 1 1-5.2 0 2.6 2.6 0 0 1 5.2 0zM-3 6V-6.5l10-2.5V3.5'/%3E%3Cpath transform='translate(48.8 363.1) rotate(-2)' d='M-3 6a2.6 2.6 0 1 1-5.2 0 2.6 2.6 0 0 1 5.2 0zM7 3.5a2.6 2.6 0 1 1-5.2 0 2.6 2.6 0 0 1 5.2 0zM-3 6V-6.5l10-2.5V3.5'/%3E%3Cpath transform='translate(168 220.3) rotate(-12)' d='M-8-2.5h16v4h-16zM-7 1.5h14V8h-14zM0-2.5V8M0-2.5c-2-5-7-5-6-2 .5 1.5 6 2 6 2zM0-2.5c2-5 7-5 6-2-.5 1.5-6 2-6 2z'/%3E%3Cpath transform='translate(271.5 150.9) rotate(-9)' d='M-8 4.5V0a8 8 0 0 1 16 0v4.5M-8.5 2h3v6.5h-3zM5.5 2h3v6.5h-3z'/%3E%3Cpath transform='translate(252.6 226.6) rotate(-30)' d='M0 9S-6 3-6-2a6 6 0 0 1 12 0c0 5-6 11-6 11zM2.2-2a2.2 2.2 0 1 1-4.4 0 2.2 2.2 0 0 1 4.4 0z'/%3E%3Cpath transform='translate(283.6 258.9) rotate(-24)' d='M-9.5 0c1.6-3 3.2-3 4.8 0s3.2 3 4.8 0 3.2-3 4.8 0 3.2 3 4.8 0'/%3E%3Cpath transform='translate(207.7 33.1) rotate(-17)' d='M3.8 0a3.8 3.8 0 1 1-7.6 0 3.8 3.8 0 0 1 7.6 0zM0-9v2.2M0 6.8V9M-9 0h2.2M6.8 0H9M-6.4-6.4l1.6 1.6M4.8 4.8l1.6 1.6M-6.4 6.4l1.6-1.6M4.8-4.8l1.6-1.6'/%3E%3Cpath transform='translate(101.4 261.5) rotate(23)' d='M8.5 0A8.5 8.5 0 1 1-8.5 0 8.5 8.5 0 0 1 8.5 0zM-3.2-2.4h.01M3.2-2.4h.01M-3.8 2.6c2 2.4 5.6 2.4 7.6 0'/%3E%3Cpath transform='translate(37.9 144.5) rotate(16)' d='M-9-7h18v14H-9zM-9 4l5-5 4 4 3-3 6 6M4.5-3.2a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z'/%3E%3Cpath transform='translate(17.3 177.2) rotate(4)' d='M-9.5 0c1.6-3 3.2-3 4.8 0s3.2 3 4.8 0 3.2-3 4.8 0 3.2 3 4.8 0'/%3E%3Cpath transform='translate(16.6 105.6) rotate(20)' d='M-7.5 7.5C-7.5-2.5-1.5-8.5 8.5-8.5c0 10-6 16-16 16zM-7.5 7.5L2-2'/%3E%3Cpath transform='translate(181.2 153.1) rotate(-3)' d='M-7-2h11v5a5 5 0 0 1-5 5h-1a5 5 0 0 1-5-5zM4 0h1.5a2.5 2.5 0 0 1 0 5H3.6M-3.5-8.5c-1 1.4 1 2.4 0 4M.5-8.5c-1 1.4 1 2.4 0 4'/%3E%3Cpath transform='translate(7.6 236.8) rotate(27)' d='M0 9a6 6 0 0 1-6-6c0-3.5 2.5-5.5 3.5-9 1.5 1.5 2.5 3.4 2.3 5.6C1-1.4 2-2.8 2.2-4.6 4.6-2.5 6 0 6 3a6 6 0 0 1-6 6z'/%3E%3Cpath transform='translate(367.6 236.8) rotate(27)' d='M0 9a6 6 0 0 1-6-6c0-3.5 2.5-5.5 3.5-9 1.5 1.5 2.5 3.4 2.3 5.6C1-1.4 2-2.8 2.2-4.6 4.6-2.5 6 0 6 3a6 6 0 0 1-6 6z'/%3E%3Cpath transform='translate(226.4 -13.4) rotate(-25)' d='M-9-6h18v12H-9zM-9-5.5l9 6.5 9-6.5'/%3E%3Cpath transform='translate(226.4 346.6) rotate(-25)' d='M-9-6h18v12H-9zM-9-5.5l9 6.5 9-6.5'/%3E%3Cpath transform='translate(168.9 15.9) rotate(-24)' d='M-9-3a2 2 0 0 1 2-2h2.5L-3-8h6l1.5 3H7a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H-7a2 2 0 0 1-2-2zM3.4 1a3.4 3.4 0 1 1-6.8 0 3.4 3.4 0 0 1 6.8 0z'/%3E%3Cpath transform='translate(344.6 83.2) rotate(1)' d='M8.5 0A8.5 8.5 0 1 1-8.5 0 8.5 8.5 0 0 1 8.5 0zM-8.5 0h17M0-8.5C3-5.5 3.4 5.5 0 8.5M0-8.5C-3-5.5-3.4 5.5 0 8.5'/%3E%3Cpath transform='translate(334.7 139.2) rotate(21)' d='M-9-7h18v14H-9zM-9 4l5-5 4 4 3-3 6 6M4.5-3.2a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z'/%3E%3Cpath transform='translate(108.9 67) rotate(14)' d='M0 7.5C-5.5 3.8-8.5.8-8.5-2.6a4.3 4.3 0 0 1 8.5-1.6 4.3 4.3 0 0 1 8.5 1.6C8.5.8 5.5 3.8 0 7.5z'/%3E%3Cpath transform='translate(-6.1 40.6) rotate(29)' d='M-9.5 1l3.5 3.5L1.5-4M-2.5 3.5l1 1L6.5-4'/%3E%3Cpath transform='translate(353.9 40.6) rotate(29)' d='M-9.5 1l3.5 3.5L1.5-4M-2.5 3.5l1 1L6.5-4'/%3E%3Cpath transform='translate(192.7 73.3) rotate(-25)' d='M9-8L-9-.5l6.5 2.5L0 8.5zM-2.5 2L9-8'/%3E%3Cpath transform='translate(254.6 293.4) rotate(12)' d='M-3-6a3 3 0 0 1 6 0v4a3 3 0 0 1-6 0zM-6.5-2a6.5 6.5 0 0 0 13 0M0 4.5V8'/%3E%3Cpath transform='translate(276.5 79.4) rotate(24)' d='M-6 4V-1a6 6 0 0 1 12 0v5l2 2H-8zM-2 8.2a2 2 0 0 0 4 0'/%3E%3Cpath transform='translate(326.8 269.5) rotate(-12)' d='M1.5-9l-7.5 11h6l-1.5 7L6-2H0z'/%3E%3Cpath transform='translate(70.8 47.8) rotate(-27)' d='M-3-8l-2 16M3.5-8l-2 16M-7.5-3h15M-8.5 3h15'/%3E%3Cpath transform='translate(116.2 312.4) rotate(-6)' d='M-5.5 6a4.5 4.5 0 0 1-.6-9A6 6 0 0 1 5.4-3.3 4.7 4.7 0 0 1 5.6 6z'/%3E%3Cpath transform='translate(321.3 12.7) rotate(-1)' d='M-6-1h12v9H-6zM-4-1v-3a4 4 0 0 1 8 0v3'/%3E%3Cpath transform='translate(321.3 372.7) rotate(-1)' d='M-6-1h12v9H-6zM-4-1v-3a4 4 0 0 1 8 0v3'/%3E%3Cpath transform='translate(188.8 338.4) rotate(-17)' d='M0-8.5l2.5 5.2 5.7.8-4.1 4 1 5.7L0 4.5l-5.1 2.7 1-5.7-4.1-4 5.7-.8z'/%3E%3Cpath transform='translate(141.9 135.5) rotate(-14)' d='M0-5c-2-2-5-2.5-8.5-2v13C-5 5.5-2 6 0 8c2-2 5-2.5 8.5-2V-7C5-7.5 2-7 0-5zM0-5V8'/%3E%3Cpath transform='translate(338.2 195.1) rotate(23)' d='M3.6 0a3.6 3.6 0 1 1-7.2 0 3.6 3.6 0 0 1 7.2 0zM3.6-3.6v5a2.4 2.4 0 0 0 4.8 0V0a8.5 8.5 0 1 0-3.3 6.7'/%3E%3Cpath transform='translate(324.9 328.8) rotate(5)' d='M8.5 0A8.5 8.5 0 1 1-8.5 0 8.5 8.5 0 0 1 8.5 0zM-3.2-2.4h.01M3.2-2.4h.01M-3.8 2.6c2 2.4 5.6 2.4 7.6 0'/%3E%3Cpath transform='translate(28.9 324.1) rotate(-26)' d='M-1.5 3.5l-2 2a3.2 3.2 0 0 1-4.5-4.5l3-3a3.2 3.2 0 0 1 4.5 0M1.5-3.5l2-2a3.2 3.2 0 0 1 4.5 4.5l-3 3a3.2 3.2 0 0 1-4.5 0'/%3E%3Cpath transform='translate(105.2 -10.4) rotate(-4)' d='M-8 4.5V0a8 8 0 0 1 16 0v4.5M-8.5 2h3v6.5h-3zM5.5 2h3v6.5h-3z'/%3E%3Cpath transform='translate(105.2 349.6) rotate(-4)' d='M-8 4.5V0a8 8 0 0 1 16 0v4.5M-8.5 2h3v6.5h-3zM5.5 2h3v6.5h-3z'/%3E%3Cpath transform='translate(233.8 156.9) rotate(9)' d='M0-5.5C.5-1.8 1.8-.5 5.5 0 1.8.5.5 1.8 0 5.5-.5 1.8-1.8.5-5.5 0-1.8-.5-.5-1.8 0-5.5z'/%3E%3Cpath transform='translate(257.8 187.1) rotate(-18)' d='M3.8 0a3.8 3.8 0 1 1-7.6 0 3.8 3.8 0 0 1 7.6 0zM0-9v2.2M0 6.8V9M-9 0h2.2M6.8 0H9M-6.4-6.4l1.6 1.6M4.8 4.8l1.6 1.6M-6.4 6.4l1.6-1.6M4.8-4.8l1.6-1.6'/%3E%3Cpath transform='translate(175.3 302.5) rotate(-7)' d='M-6 7.5L0-8l6 15.5M-3.6 1.5h7.2'/%3E%3C/g%3E%3C/svg%3E");
  /* /design */
  /* design:light — the brand pages' surfaces, light */
  --kb-bg: #f5f7fa; --kb-fg: #0e1218; --kb-dim: #66717f; --kb-faint: #8993a1; --kb-line: rgba(14,18,24,.09);
  --kb-line2: rgba(14,18,24,.16); --kb-card: rgba(255,255,255,.85); --kb-solid: #ffffff; --kb-field: #ffffff; --kb-hover: rgba(14,18,24,.05);
  --kb-acc: #c2510a; --kb-acc-ink: #ffffff; --kb-acc-soft: rgba(194,81,10,.1); --kb-ring: rgba(194,81,10,.28); --kb-on-grad: #0e1218;
  --kb-good: #12a150; --kb-warn: #c58730; --kb-bad: #e5384f;
  /* /design */
  --kb-shadow: 0 1px 2px rgba(10, 13, 17, .05), 0 12px 40px -12px rgba(28, 34, 42, .22);
  --kb-shadow-lg: 0 2px 6px rgba(10, 13, 17, .06), 0 30px 80px -24px rgba(120, 50, 10, .28);
  /* the light behind the pages: ember, flame, and a cool sky to balance them */
  --kb-glow-a: rgba(255, 122, 26, .26); --kb-glow-b: rgba(239, 74, 43, .16); --kb-glow-c: rgba(62, 200, 255, .16);
  --kb-glow-shadow: rgba(255, 122, 26, .55);
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
    /* design:dark — the brand pages' surfaces, dark */
    --kb-bg: #0e1218; --kb-fg: #f5f7fa; --kb-dim: #afb8c3; --kb-faint: #66717f; --kb-line: rgba(255,255,255,.08);
    --kb-line2: rgba(255,255,255,.14); --kb-card: rgba(26,32,40,.8); --kb-solid: #1a2028; --kb-field: rgba(255,255,255,.04); --kb-hover: rgba(255,255,255,.05);
    --kb-acc: #ff9447; --kb-acc-ink: #0e1218; --kb-acc-soft: rgba(255,148,71,.14); --kb-ring: rgba(255,148,71,.35); --kb-on-grad: #0e1218;
    --kb-good: #3ccf8e; --kb-warn: #ffb74d; --kb-bad: #ff6b7d; --kb-grad-text: linear-gradient(100deg, #ffb547 0%, #ff9447 55%, #ff6a55 100%);
    /* /design */
    --kb-shadow: 0 1px 0 rgba(255, 255, 255, .04) inset, 0 20px 50px -20px rgba(0, 0, 0, .7);
    --kb-shadow-lg: 0 1px 0 rgba(255, 255, 255, .05) inset, 0 40px 100px -30px rgba(0, 0, 0, .85);
    --kb-glow-a: rgba(255, 122, 26, .26); --kb-glow-b: rgba(239, 74, 43, .18); --kb-glow-c: rgba(62, 200, 255, .12);
  }
}

/* The inbox's own colours, for a page that draws a piece of it (the site's
   live demo): class="kbi" follows the system, add kbi-light / kbi-dark to pin. */
/* design:inbox — written by tools/design.mjs from kit/tokens.json; edit the tokens, not these lines */
.kbi {
  --i-bg: #ffffff; --i-deep: #f5f7fa; --i-panel: #ffffff; --i-head: #ffffff; --i-rail: #f5f7fa;
  --i-surface: #f5f7fa; --i-field: #ffffff; --i-menu: #ffffff; --i-hover: #f5f7fa; --i-sel: #ebeff3;
  --i-line: #ebeff3; --i-line2: #e0e5eb; --i-txt: #0e1218; --i-txt-hi: #000000; --i-dim: rgba(14,18,24,.62);
  --i-dim2: rgba(14,18,24,.44); --i-acc: #c2510a; --i-acc-hi: #f2690f; --i-acc-ink: #ffffff; --i-acc-soft: #ffe8d8;
  --i-acc-soft-ink: #8a2c08; --i-bub-in: #ffffff; --i-bub-out: #ffe8d8; --i-meta-in: rgba(14,18,24,.58); --i-meta-out: rgba(14,18,24,.58);
  --i-wall: #f7f2ec; --i-doodle-ink: rgba(194,81,10,.1); --i-tick: #1a73e8; --i-link: #1d68c9; --i-good: #12a150;
  --i-warn: #c58730; --i-danger: #e5384f; --i-sys: rgba(255,255,255,.92); --i-sys-ink: rgba(14,18,24,.6); --i-nest: rgba(14,18,24,.05);
  --i-nest2: rgba(14,18,24,.08); --i-quote-bar: #c2510a; --i-scrim: rgba(14,18,24,.36); --i-scroll: #d1d8e0; --i-skel: #ebeff3;
  --i-skel2: #f5f7fa; --i-toast: #20272f; --i-toast-ink: #f5f7fa; --i-toast-acc: #ffae79;
}
@media (prefers-color-scheme: dark) {
  .kbi:not(.kbi-light) {
    --i-bg: #151a21; --i-deep: #0e1218; --i-panel: #151a21; --i-head: #151a21; --i-rail: #1a2028;
    --i-surface: #313a45; --i-field: #28303a; --i-menu: #1a2028; --i-hover: #20272f; --i-sel: #313a45;
    --i-line: #20272f; --i-line2: #313a45; --i-txt: #fbfcfd; --i-txt-hi: #ffffff; --i-dim: rgba(255,255,255,.6);
    --i-dim2: rgba(255,255,255,.45); --i-acc: #ff9447; --i-acc-hi: #ffae79; --i-acc-ink: #0e1218; --i-acc-soft: #33200f;
    --i-acc-soft-ink: #ffcda9; --i-bub-in: #28303a; --i-bub-out: #653720; --i-meta-in: rgba(255,255,255,.6); --i-meta-out: rgba(255,255,255,.62);
    --i-wall: #151a21; --i-doodle-ink: rgba(255,255,255,.06); --i-tick: #5cc0f2; --i-link: #6cc4f4; --i-good: #3ccf8e;
    --i-warn: #ffb74d; --i-danger: #ff6b7d; --i-sys: #1a2028; --i-sys-ink: rgba(255,255,255,.6); --i-nest: rgba(14,18,24,.4);
    --i-nest2: rgba(14,18,24,.55); --i-quote-bar: #ff9447; --i-scrim: rgba(14,18,24,.66); --i-scroll: #3c4551; --i-skel: #20272f;
    --i-skel2: #28303a; --i-toast: #313a45; --i-toast-ink: #f5f7fa; --i-toast-acc: #ffae79;
  }
}
.kbi.kbi-light {
  --i-bg: #ffffff; --i-deep: #f5f7fa; --i-panel: #ffffff; --i-head: #ffffff; --i-rail: #f5f7fa;
  --i-surface: #f5f7fa; --i-field: #ffffff; --i-menu: #ffffff; --i-hover: #f5f7fa; --i-sel: #ebeff3;
  --i-line: #ebeff3; --i-line2: #e0e5eb; --i-txt: #0e1218; --i-txt-hi: #000000; --i-dim: rgba(14,18,24,.62);
  --i-dim2: rgba(14,18,24,.44); --i-acc: #c2510a; --i-acc-hi: #f2690f; --i-acc-ink: #ffffff; --i-acc-soft: #ffe8d8;
  --i-acc-soft-ink: #8a2c08; --i-bub-in: #ffffff; --i-bub-out: #ffe8d8; --i-meta-in: rgba(14,18,24,.58); --i-meta-out: rgba(14,18,24,.58);
  --i-wall: #f7f2ec; --i-doodle-ink: rgba(194,81,10,.1); --i-tick: #1a73e8; --i-link: #1d68c9; --i-good: #12a150;
  --i-warn: #c58730; --i-danger: #e5384f; --i-sys: rgba(255,255,255,.92); --i-sys-ink: rgba(14,18,24,.6); --i-nest: rgba(14,18,24,.05);
  --i-nest2: rgba(14,18,24,.08); --i-quote-bar: #c2510a; --i-scrim: rgba(14,18,24,.36); --i-scroll: #d1d8e0; --i-skel: #ebeff3;
  --i-skel2: #f5f7fa; --i-toast: #20272f; --i-toast-ink: #f5f7fa; --i-toast-acc: #ffae79;
}
.kbi.kbi-dark {
  --i-bg: #151a21; --i-deep: #0e1218; --i-panel: #151a21; --i-head: #151a21; --i-rail: #1a2028;
  --i-surface: #313a45; --i-field: #28303a; --i-menu: #1a2028; --i-hover: #20272f; --i-sel: #313a45;
  --i-line: #20272f; --i-line2: #313a45; --i-txt: #fbfcfd; --i-txt-hi: #ffffff; --i-dim: rgba(255,255,255,.6);
  --i-dim2: rgba(255,255,255,.45); --i-acc: #ff9447; --i-acc-hi: #ffae79; --i-acc-ink: #0e1218; --i-acc-soft: #33200f;
  --i-acc-soft-ink: #ffcda9; --i-bub-in: #28303a; --i-bub-out: #653720; --i-meta-in: rgba(255,255,255,.6); --i-meta-out: rgba(255,255,255,.62);
  --i-wall: #151a21; --i-doodle-ink: rgba(255,255,255,.06); --i-tick: #5cc0f2; --i-link: #6cc4f4; --i-good: #3ccf8e;
  --i-warn: #ffb74d; --i-danger: #ff6b7d; --i-sys: #1a2028; --i-sys-ink: rgba(255,255,255,.6); --i-nest: rgba(14,18,24,.4);
  --i-nest2: rgba(14,18,24,.55); --i-quote-bar: #ff9447; --i-scrim: rgba(14,18,24,.66); --i-scroll: #3c4551; --i-skel: #20272f;
  --i-skel2: #28303a; --i-toast: #313a45; --i-toast-ink: #f5f7fa; --i-toast-acc: #ffae79;
}
/* /design */

/* The mark (the app icon) as an element: <i class="kb-mark"></i>. */
.kb-mark { display: inline-block; flex: none; width: 32px; height: 32px; border-radius: 28%; background: url(/kit/mark.svg) center / contain no-repeat;
  box-shadow: 0 6px 18px -6px var(--kb-glow-shadow); }
/* The wordmark beside it: <a class="kb-logo"><i class="kb-mark"></i>Kadabox</a>. */
.kb-logo { display: inline-flex; align-items: center; gap: 10px; font-weight: 750; font-size: 19px; letter-spacing: -.025em; color: inherit; text-decoration: none; }
.kb-logo:hover { text-decoration: none; }
/* Words in the brand's gradient, and the ✦ that marks anything the AI made. */
.kb-grad-text, .kb-spark { background: var(--kb-grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* A network's mark, white on its own colour: <i class="kb-net" data-net="whatsapp"></i>. */
.kb-net { position: relative; display: inline-block; flex: none; width: 20px; height: 20px; border-radius: 50%; background: var(--nc, var(--kb-ink-500)); }
.kb-net::after { content: ""; position: absolute; inset: 22%; background: #fff; -webkit-mask: var(--logo) center / contain no-repeat; mask: var(--logo) center / contain no-repeat; }
.kb-net[data-net="whatsapp"] { --nc: var(--kb-whatsapp); --logo: url(/kit/nets/whatsapp.svg); }
.kb-net[data-net="instagram"] { --nc: var(--kb-instagram); --logo: url(/kit/nets/instagram.svg); background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.kb-net[data-net="telegram"] { --nc: var(--kb-telegram); --logo: url(/kit/nets/telegram.svg); }
.kb-net[data-net="sms"] { --nc: var(--kb-sms); --logo: url(/kit/nets/sms.svg); }
.kb-net[data-net="sms"]::after { inset: 25%; }

/* The light behind the brand pages: <div class="kb-aura"><i></i><i></i><i></i></div>. */
.kb-aura { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.kb-aura i { position: absolute; border-radius: 50%; filter: blur(70px); will-change: transform; }
.kb-aura i:nth-child(1) { width: 52vmax; height: 52vmax; left: -14vmax; top: -18vmax; background: radial-gradient(circle, var(--kb-glow-a), transparent 65%); animation: kb-drift1 26s ease-in-out infinite alternate; }
.kb-aura i:nth-child(2) { width: 46vmax; height: 46vmax; right: -16vmax; top: 10vmax; background: radial-gradient(circle, var(--kb-glow-b), transparent 65%); animation: kb-drift2 32s ease-in-out infinite alternate; }
.kb-aura i:nth-child(3) { width: 40vmax; height: 40vmax; left: 20vmax; bottom: -24vmax; background: radial-gradient(circle, var(--kb-glow-c), transparent 65%); animation: kb-drift3 38s ease-in-out infinite alternate; }
@keyframes kb-drift1 { to { transform: translate(8vmax, 6vmax) scale(1.08); } }
@keyframes kb-drift2 { to { transform: translate(-7vmax, 8vmax) scale(.94); } }
@keyframes kb-drift3 { to { transform: translate(-6vmax, -6vmax) scale(1.1); } }

/* The brand's buttons: the gradient one says "the main thing here". */
.kb-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 9px; height: 48px; padding: 0 22px; border-radius: 14px;
  border: 1px solid var(--kb-line2); background: var(--kb-solid); color: var(--kb-fg); font: 600 15.5px/1 var(--kb-font); white-space: nowrap; text-decoration: none; cursor: pointer;
  transition: transform .15s var(--kb-enter), box-shadow .2s, background .2s, filter .2s; }
.kb-btn:hover { text-decoration: none; background: color-mix(in srgb, var(--kb-solid) 92%, var(--kb-fg)); }
.kb-btn:active { transform: scale(.975); }
.kb-btn svg { width: 19px; height: 19px; flex: none; }
/* ink on the bright gradient, never white: 7.5:1 */
.kb-btn.primary { border: 0; color: var(--kb-on-grad); background: var(--kb-grad); box-shadow: 0 1px 0 rgba(255, 255, 255, .35) inset, 0 10px 24px -10px var(--kb-glow-shadow); }
.kb-btn.primary:hover { box-shadow: 0 1px 0 rgba(255, 255, 255, .35) inset, 0 14px 30px -10px var(--kb-glow-shadow); filter: brightness(1.05) saturate(1.05); }
.kb-btn.big { height: 56px; padding: 0 28px; font-size: 16.5px; border-radius: 16px; }
.kb-btn.ghost { background: none; border-color: transparent; }
.kb-btn.ghost:hover { background: var(--kb-hover); }

/* A small rounded label: <span class="kb-pill">Now on Android</span>. */
.kb-pill { display: inline-flex; align-items: center; gap: 7px; padding: 6px 13px; border-radius: 99px; background: var(--kb-acc-soft); color: var(--kb-acc);
  font: 600 13.5px/1.2 var(--kb-font); }
.kb-pill .dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px color-mix(in srgb, currentColor 18%, transparent); }

/* Glass: the cards on the brand pages. */
.kb-glass { background: var(--kb-card); border: 1px solid var(--kb-line); border-radius: var(--kb-r-lg); box-shadow: var(--kb-shadow);
  -webkit-backdrop-filter: blur(24px) saturate(1.5); backdrop-filter: blur(24px) saturate(1.5); }

@media (prefers-reduced-motion: reduce) {
  .kb-aura i { animation: none; }
}
