/* ══════════════════════════════════════════════════════════════
   INQUILINE — tokens.css
   The single source of truth for colour, type, space, radius and
   motion across ALL THREE surfaces: /, /console and /admin.

   RULES
   - This file contains TOKENS ONLY. No component classes, ever.
     The moment a `.card` or `.btn` appears here, the surface split
     described in the UI reference §2 stops protecting anything.
   - tests/test_console_ui.py asserts these values token by token.
     Changing a hex here fails the build. That is deliberate. If the
     change is intended, update LIGHT_TOKENS in the test in the same
     commit so the diff shows you meant it.
   - Both themes ship together. Theme is set with data-theme on
     <html>, resolved before first paint (see §3 of the spec).
   ══════════════════════════════════════════════════════════════ */

:root{
  /* Light — paper white, ink black */
  --bg:#FAFAFA;
  --surface:#FFFFFF;
  --surface-2:#F2F2F2;
  --surface-3:#E8E8E8;
  --line:#E4E4E4;
  --line-hi:#CFCFCF;
  --tx-1:#0A0A0A;      /* 19.0:1 on --bg */
  --tx-2:#4A4A4A;      /*  8.4:1 on --bg */
  --tx-3:#8A8A8A;      /*  3.3:1 — non-text / ≥24px only */
  --accent:#0A0A0A;    /* the accent IS ink: black on white */
  --accent-soft:#EDEDED;
  --focus:#0A0A0A;
  --on-accent:#FFFFFF; /* text on an --accent fill */
  --on-state:#FFFFFF;  /* text on a --st-* fill */

  /* Run states. Colour is never the only carrier — each has a glyph.
     Monochrome except the two states that must read at a glance:
     done (a muted green) and failed (a muted red). */
  --st-queued:#8A8A8A;
  --st-running:#0A0A0A;
  --st-review:#5C5C5C;
  --st-done:#2F6B45;
  --st-failed:#A33A32;

  /* Type */
  --f-ui:"Geist","Helvetica Neue",Arial,sans-serif;
  --f-read:"Source Serif 4",Georgia,serif;
  --f-mono:"Geist Mono",ui-monospace,SFMono-Regular,monospace;

  --t-h1:1.5rem;
  --t-h2:1.125rem;
  --t-h3:0.9375rem;
  --t-body:0.9375rem;
  --t-read:1.0625rem;
  --t-small:0.8125rem;
  --t-micro:0.6875rem;

  /* Space — 4px base */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px;
  --s6:24px; --s7:32px; --s8:48px; --s9:64px;

  --r-sm:4px; --r-md:8px; --r-lg:12px; --r-xl:16px; --r-full:999px;

  --e-out:cubic-bezier(.2,.7,.3,1);
  --e-in-out:cubic-bezier(.4,0,.2,1);
  --d-fast:120ms; --d-base:180ms; --d-slow:280ms;

  --rail:270px;        /* left sidebar */
  --roster:296px;      /* right roster panel */
  --read:720px;        /* transcript measure */
}

:root[data-theme="dark"]{
  --bg:#0A0A0A;
  --surface:#141414;
  --surface-2:#1C1C1C;
  --surface-3:#262626;
  --line:#262626;
  --line-hi:#3A3A3A;
  --tx-1:#F5F5F5;
  --tx-2:#A8A8A8;
  --tx-3:#6E6E6E;
  --accent:#F5F5F5;
  --accent-soft:#262626;
  --focus:#F5F5F5;
  --on-accent:#0A0A0A;
  --on-state:#0A0A0A;
  --st-queued:#6E6E6E;
  --st-running:#F5F5F5;
  --st-review:#BDBDBD;
  --st-done:#7DB892;
  --st-failed:#E0857D;
}

/* ── Kampala Mono: the barkcloth signature ──────────────────────
   Inquiline's own texture: hairline fibres drawn after olubugo, the
   barkcloth beaten from Mutuba bark in Buganda. Original artwork,
   generated by scripts/make_weave.py (re-run it to change the
   drawing; never hand-edit the data URIs). Used as a MASK, so the
   ink follows the theme, and only ever at a whisper: sign-in, the
   empty-chat greeting, the logo mark, and the woven rule under the
   top bar. Never behind body text.                               */
:root{
  --weave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160' viewBox='0 0 240 160'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round'%3E%3Cpath d='M0 6.1C10 6.5 20 5.8 30 5.5C40 5.1 50 4.0 60 4.0C70 3.9 80 5.4 90 5.3C100 5.2 110 4.0 120 3.4C130 2.9 140 2.2 150 2.0C160 1.9 170 2.3 180 2.5C190 2.7 200 2.6 210 3.2C220 3.8 230 5.7 240 6.1' stroke-width='0.49' stroke-opacity='0.39'/%3E%3Cpath d='M0 8.4C10 8.0 20 7.3 30 7.2C40 7.0 50 7.1 60 7.5C70 7.9 80 9.7 90 9.8C100 9.9 110 8.3 120 8.0C130 7.6 140 7.4 150 7.8C160 8.1 170 9.8 180 10.1C190 10.3 200 9.5 210 9.2C220 8.9 230 8.7 240 8.4' stroke-width='0.66' stroke-opacity='0.84'/%3E%3Cpath d='M0 13.9C10 13.5 20 13.4 30 13.0C40 12.6 50 11.4 60 11.3C70 11.2 80 12.0 90 12.4C100 12.9 110 13.7 120 14.1C130 14.4 140 14.3 150 14.6C160 14.9 170 15.9 180 16.0C190 16.1 200 15.7 210 15.3C220 15.0 230 14.3 240 13.9' stroke-width='0.76' stroke-opacity='0.31'/%3E%3Cpath d='M0 22.2C10 22.0 20 20.8 30 20.3C40 19.8 50 19.6 60 19.4C70 19.1 80 18.9 90 18.6C100 18.4 110 17.6 120 17.8C130 18.0 140 19.3 150 19.8C160 20.2 170 20.3 180 20.6C190 20.8 200 21.0 210 21.2C220 21.5 230 22.3 240 22.2' stroke-width='0.59' stroke-opacity='0.69'/%3E%3Cpath d='M0 23.4C10 23.4 20 23.7 30 23.6C40 23.5 50 22.8 60 22.8C70 22.7 80 23.1 90 23.2C100 23.3 110 23.4 120 23.3C130 23.2 140 22.6 150 22.6C160 22.7 170 23.5 180 23.7C190 23.9 200 23.8 210 23.8C220 23.7 230 23.4 240 23.4' stroke-width='0.63' stroke-opacity='0.49'/%3E%3Cpath d='M0 26.2C10 26.7 20 27.8 30 27.7C40 27.6 50 25.6 60 25.5C70 25.3 80 26.0 90 26.6C100 27.2 110 29.0 120 29.1C130 29.2 140 28.0 150 27.4C160 26.8 170 25.9 180 25.5C190 25.0 200 24.4 210 24.5C220 24.7 230 25.7 240 26.2' stroke-width='0.67' stroke-opacity='0.55'/%3E%3Cpath d='M0 35.5C10 35.2 20 34.2 30 34.4C40 34.5 50 35.9 60 36.2C70 36.5 80 36.1 90 36.3C100 36.4 110 36.7 120 37.0C130 37.4 140 38.4 150 38.3C160 38.2 170 36.8 180 36.5C190 36.1 200 36.4 210 36.2C220 36.1 230 35.8 240 35.5' stroke-width='0.55' stroke-opacity='0.84'/%3E%3Cpath d='M0 42.7C10 42.6 20 41.6 30 41.1C40 40.6 50 39.9 60 39.9C70 39.9 80 41.0 90 41.2C100 41.4 110 41.1 120 41.1C130 41.0 140 40.9 150 41.0C160 41.0 170 41.2 180 41.3C190 41.4 200 41.5 210 41.7C220 41.9 230 42.8 240 42.7' stroke-width='0.67' stroke-opacity='0.41'/%3E%3Cpath d='M0 47.8C10 47.6 20 47.4 30 47.4C40 47.4 50 47.6 60 47.7C70 47.8 80 48.2 90 48.3C100 48.3 110 48.2 120 48.0C130 47.8 140 47.3 150 47.2C160 47.2 170 47.5 180 47.7C190 47.9 200 48.3 210 48.3C220 48.3 230 47.9 240 47.8' stroke-width='0.78' stroke-opacity='0.82'/%3E%3Cpath d='M0 56.2C10 56.2 20 55.0 30 54.5C40 54.0 50 53.6 60 53.5C70 53.4 80 54.2 90 54.1C100 54.1 110 53.2 120 53.4C130 53.5 140 54.8 150 55.1C160 55.4 170 55.3 180 55.3C190 55.2 200 54.5 210 54.6C220 54.8 230 56.2 240 56.2' stroke-width='0.49' stroke-opacity='0.57'/%3E%3Cpath d='M0 57.6C10 57.5 20 56.3 30 55.8C40 55.4 50 54.9 60 54.8C70 54.8 80 55.5 90 55.5C100 55.5 110 54.6 120 54.7C130 54.9 140 56.1 150 56.4C160 56.7 170 56.7 180 56.6C190 56.5 200 55.8 210 56.0C220 56.2 230 57.6 240 57.6' stroke-width='0.38' stroke-opacity='0.29'/%3E%3Cpath d='M0 62.7C10 63.1 20 62.5 30 62.6C40 62.6 50 63.2 60 63.0C70 62.8 80 61.9 90 61.2C100 60.4 110 59.0 120 58.5C130 58.1 140 58.5 150 58.4C160 58.3 170 57.7 180 58.0C190 58.2 200 59.2 210 59.9C220 60.7 230 62.2 240 62.7' stroke-width='0.70' stroke-opacity='0.41'/%3E%3Cpath d='M0 64.1C10 63.5 20 63.0 30 62.9C40 62.8 50 63.3 60 63.6C70 63.9 80 64.8 90 64.8C100 64.8 110 64.1 120 63.8C130 63.5 140 62.8 150 63.2C160 63.7 170 65.7 180 66.3C190 66.9 200 67.2 210 66.8C220 66.5 230 64.8 240 64.1' stroke-width='0.43' stroke-opacity='0.32'/%3E%3Cpath d='M0 70.8C10 71.3 20 73.4 30 73.9C40 74.5 50 74.7 60 74.2C70 73.6 80 71.4 90 70.5C100 69.7 110 69.4 120 68.9C130 68.4 140 67.5 150 67.5C160 67.5 170 68.4 180 69.0C190 69.5 200 70.5 210 70.8C220 71.1 230 70.2 240 70.8' stroke-width='0.77' stroke-opacity='0.50'/%3E%3Cpath d='M0 76.5C10 76.8 20 76.9 30 76.6C40 76.4 50 75.4 60 75.1C70 74.9 80 75.3 90 75.0C100 74.8 110 74.2 120 73.6C130 73.0 140 71.7 150 71.6C160 71.5 170 72.3 180 72.8C190 73.4 200 74.2 210 74.8C220 75.4 230 76.2 240 76.5' stroke-width='0.65' stroke-opacity='0.84'/%3E%3Cpath d='M0 77.8C10 78.1 20 78.1 30 77.9C40 77.7 50 76.7 60 76.4C70 76.1 80 76.5 90 76.3C100 76.0 110 75.4 120 74.9C130 74.3 140 73.0 150 72.9C160 72.7 170 73.6 180 74.1C190 74.6 200 75.5 210 76.1C220 76.7 230 77.5 240 77.8' stroke-width='0.54' stroke-opacity='0.42'/%3E%3Cpath d='M0 78.9C10 79.4 20 79.6 30 80.3C40 81.0 50 82.7 60 83.0C70 83.4 80 82.7 90 82.4C100 82.1 110 81.4 120 81.0C130 80.6 140 80.4 150 79.8C160 79.1 170 77.4 180 77.0C190 76.6 200 77.1 210 77.5C220 77.8 230 78.4 240 78.9' stroke-width='0.64' stroke-opacity='0.57'/%3E%3Cpath d='M0 87.5C10 88.2 20 88.6 30 88.7C40 88.8 50 88.5 60 88.1C70 87.6 80 86.7 90 86.2C100 85.7 110 85.4 120 85.0C130 84.6 140 84.2 150 83.8C160 83.4 170 82.6 180 82.7C190 82.9 200 83.7 210 84.5C220 85.3 230 86.8 240 87.5' stroke-width='0.45' stroke-opacity='0.39'/%3E%3Cpath d='M0 92.4C10 92.4 20 92.2 30 91.9C40 91.7 50 91.3 60 90.8C70 90.2 80 89.1 90 88.6C100 88.1 110 87.8 120 87.7C130 87.7 140 87.9 150 88.2C160 88.5 170 88.8 180 89.4C190 89.9 200 91.0 210 91.5C220 92.0 230 92.3 240 92.4' stroke-width='0.47' stroke-opacity='0.55'/%3E%3Cpath d='M0 96.4C10 95.8 20 95.3 30 95.1C40 94.8 50 95.1 60 95.0C70 94.8 80 94.4 90 94.3C100 94.1 110 93.8 120 94.0C130 94.1 140 94.6 150 95.2C160 95.8 170 97.1 180 97.6C190 98.2 200 98.7 210 98.5C220 98.3 230 97.0 240 96.4' stroke-width='0.45' stroke-opacity='0.74'/%3E%3Cpath d='M0 97.3C10 96.7 20 96.2 30 96.0C40 95.7 50 96.0 60 95.9C70 95.7 80 95.3 90 95.2C100 95.0 110 94.8 120 94.9C130 95.0 140 95.5 150 96.1C160 96.7 170 98.0 180 98.6C190 99.1 200 99.6 210 99.4C220 99.2 230 97.9 240 97.3' stroke-width='0.52' stroke-opacity='0.37'/%3E%3Cpath d='M0 101.2C10 101.4 20 101.7 30 101.5C40 101.3 50 100.7 60 100.2C70 99.7 80 98.4 90 98.5C100 98.6 110 100.1 120 100.9C130 101.7 140 103.1 150 103.0C160 103.0 170 101.3 180 100.8C190 100.3 200 100.0 210 100.1C220 100.2 230 101.0 240 101.2' stroke-width='0.87' stroke-opacity='0.43'/%3E%3Cpath d='M0 106.4C10 106.9 20 108.6 30 109.2C40 109.8 50 110.3 60 109.8C70 109.3 80 107.3 90 106.2C100 105.2 110 104.0 120 103.7C130 103.3 140 103.9 150 104.2C160 104.5 170 105.2 180 105.5C190 105.8 200 105.7 210 105.8C220 106.0 230 105.8 240 106.4' stroke-width='0.68' stroke-opacity='0.51'/%3E%3Cpath d='M0 107.8C10 108.3 20 110.0 30 110.6C40 111.2 50 111.7 60 111.3C70 110.8 80 108.7 90 107.7C100 106.6 110 105.4 120 105.1C130 104.8 140 105.3 150 105.6C160 105.9 170 106.7 180 106.9C190 107.2 200 107.1 210 107.2C220 107.4 230 107.2 240 107.8' stroke-width='0.44' stroke-opacity='0.45'/%3E%3Cpath d='M0 108.4C10 108.9 20 110.8 30 111.2C40 111.6 50 111.0 60 110.8C70 110.6 80 110.3 90 110.3C100 110.3 110 110.6 120 110.7C130 110.8 140 110.8 150 110.7C160 110.7 170 110.8 180 110.4C190 110.0 200 108.4 210 108.1C220 107.8 230 107.9 240 108.4' stroke-width='0.87' stroke-opacity='0.73'/%3E%3Cpath d='M0 109.8C10 110.3 20 112.2 30 112.6C40 113.0 50 112.3 60 112.1C70 112.0 80 111.6 90 111.6C100 111.6 110 112.0 120 112.0C130 112.1 140 112.1 150 112.0C160 112.0 170 112.2 180 111.8C190 111.3 200 109.8 210 109.4C220 109.1 230 109.2 240 109.8' stroke-width='0.53' stroke-opacity='0.41'/%3E%3Cpath d='M0 121.1C10 121.0 20 120.1 30 119.9C40 119.7 50 119.5 60 119.7C70 119.9 80 120.9 90 120.9C100 120.9 110 119.7 120 119.7C130 119.6 140 120.5 150 120.8C160 121.0 170 121.4 180 121.3C190 121.2 200 120.1 210 120.1C220 120.1 230 121.1 240 121.1' stroke-width='0.62' stroke-opacity='0.32'/%3E%3Cpath d='M0 128.4C10 127.9 20 126.2 30 125.5C40 124.7 50 124.1 60 124.0C70 123.9 80 124.6 90 124.6C100 124.6 110 124.3 120 124.1C130 124.0 140 123.4 150 123.6C160 123.8 170 124.6 180 125.4C190 126.2 200 127.7 210 128.2C220 128.7 230 128.9 240 128.4' stroke-width='0.45' stroke-opacity='0.36'/%3E%3Cpath d='M0 134.1C10 134.6 20 135.0 30 135.0C40 135.1 50 135.0 60 134.4C70 133.9 80 132.5 90 131.6C100 130.7 110 129.6 120 129.2C130 128.8 140 129.1 150 129.3C160 129.5 170 129.8 180 130.2C190 130.7 200 131.4 210 132.0C220 132.6 230 133.6 240 134.1' stroke-width='0.77' stroke-opacity='0.78'/%3E%3Cpath d='M0 135.0C10 135.5 20 135.9 30 136.0C40 136.0 50 136.0 60 135.4C70 134.8 80 133.4 90 132.5C100 131.7 110 130.5 120 130.1C130 129.7 140 130.1 150 130.2C160 130.4 170 130.7 180 131.2C190 131.6 200 132.3 210 132.9C220 133.6 230 134.5 240 135.0' stroke-width='0.54' stroke-opacity='0.43'/%3E%3Cpath d='M0 138.2C10 138.3 20 137.1 30 137.0C40 136.9 50 137.0 60 137.4C70 137.8 80 139.3 90 139.5C100 139.7 110 138.8 120 138.6C130 138.3 140 138.2 150 137.9C160 137.6 170 136.9 180 136.7C190 136.4 200 136.2 210 136.4C220 136.7 230 138.1 240 138.2' stroke-width='0.76' stroke-opacity='0.50'/%3E%3Cpath d='M0 139.4C10 139.5 20 138.3 30 138.2C40 138.1 50 138.2 60 138.6C70 139.0 80 140.5 90 140.7C100 140.9 110 140.0 120 139.8C130 139.5 140 139.4 150 139.1C160 138.8 170 138.1 180 137.9C190 137.6 200 137.4 210 137.6C220 137.9 230 139.3 240 139.4' stroke-width='0.34' stroke-opacity='0.39'/%3E%3Cpath d='M0 146.3C10 146.2 20 144.1 30 143.5C40 142.9 50 142.7 60 142.6C70 142.4 80 142.7 90 142.6C100 142.6 110 142.2 120 142.3C130 142.4 140 143.1 150 143.1C160 143.1 170 142.1 180 142.3C190 142.5 200 143.6 210 144.3C220 144.9 230 146.5 240 146.3' stroke-width='0.46' stroke-opacity='0.72'/%3E%3Cpath d='M0 157.3C10 157.2 20 156.6 30 156.4C40 156.2 50 156.6 60 156.3C70 155.9 80 155.0 90 154.2C100 153.4 110 151.9 120 151.5C130 151.0 140 151.0 150 151.5C160 152.0 170 153.3 180 154.2C190 155.2 200 156.7 210 157.2C220 157.7 230 157.4 240 157.3' stroke-width='0.40' stroke-opacity='0.46'/%3E%3Cpath d='M74 86.7q24 0.8 49 -1.6' stroke-width='0.67' stroke-opacity='0.60'/%3E%3Cpath d='M91 6.3q32 -0.0 64 -2.5' stroke-width='0.39' stroke-opacity='0.32'/%3E%3Cpath d='M127 129.5q21 -2.3 42 4.5' stroke-width='0.69' stroke-opacity='0.33'/%3E%3Cpath d='M116 66.8q33 2.2 65 -1.3' stroke-width='0.62' stroke-opacity='0.57'/%3E%3Cpath d='M99 98.4q22 0.0 45 1.6' stroke-width='0.59' stroke-opacity='0.40'/%3E%3Cpath d='M5 94.0q26 -1.8 53 -4.8' stroke-width='0.59' stroke-opacity='0.48'/%3E%3Cpath d='M5 6.9q24 -1.6 48 3.1' stroke-width='0.58' stroke-opacity='0.45'/%3E%3Cpath d='M18 25.8q35 -1.8 71 -2.1' stroke-width='0.51' stroke-opacity='0.28'/%3E%3Cpath d='M40 13.6q9 -1.0 19 0.0' stroke-width='0.74' stroke-opacity='0.31'/%3E%3Cpath d='M56 97.4q33 0.2 67 4.4' stroke-width='0.58' stroke-opacity='0.46'/%3E%3Cpath d='M93 139.2q14 -1.6 29 5.0' stroke-width='0.57' stroke-opacity='0.52'/%3E%3Cpath d='M27 77.2q29 1.7 57 -4.5' stroke-width='0.43' stroke-opacity='0.51'/%3E%3Cpath d='M89 60.3q24 -0.0 48 4.8' stroke-width='0.48' stroke-opacity='0.40'/%3E%3Cpath d='M45 41.2q28 -2.2 56 3.4' stroke-width='0.44' stroke-opacity='0.48'/%3E%3Cpath d='M52 55.1q19 -1.5 39 4.4' stroke-width='0.71' stroke-opacity='0.42'/%3E%3Cpath d='M75 7.1q16 -1.3 33 -1.9' stroke-width='0.36' stroke-opacity='0.54'/%3E%3Cpath d='M134 26l0.7 13' stroke-width='.35' stroke-opacity='0.21'/%3E%3Cpath d='M133 29l-0.8 8' stroke-width='.35' stroke-opacity='0.23'/%3E%3Cpath d='M128 76l1.1 9' stroke-width='.35' stroke-opacity='0.35'/%3E%3Cpath d='M123 59l1.1 10' stroke-width='.35' stroke-opacity='0.34'/%3E%3Cpath d='M122 140l0.9 12' stroke-width='.35' stroke-opacity='0.32'/%3E%3Cpath d='M123 67l-0.2 11' stroke-width='.35' stroke-opacity='0.24'/%3E%3Cpath d='M125 134l-1.0 13' stroke-width='.35' stroke-opacity='0.31'/%3E%3Cpath d='M125 123l-0.3 10' stroke-width='.35' stroke-opacity='0.23'/%3E%3Cpath d='M83 52l0.4 11' stroke-width='.35' stroke-opacity='0.17'/%3E%3Cpath d='M83 71l-1.2 11' stroke-width='.35' stroke-opacity='0.21'/%3E%3Cpath d='M83 7l0.5 10' stroke-width='.35' stroke-opacity='0.17'/%3E%3Cpath d='M83 23l-1.1 8' stroke-width='.35' stroke-opacity='0.20'/%3E%3Cpath d='M87 40l0.4 10' stroke-width='.35' stroke-opacity='0.28'/%3E%3Cpath d='M32 56l1.1 13' stroke-width='.35' stroke-opacity='0.26'/%3E%3Cpath d='M34 61l-0.6 11' stroke-width='.35' stroke-opacity='0.19'/%3E%3Cpath d='M32 125l0.7 11' stroke-width='.35' stroke-opacity='0.24'/%3E%3Cpath d='M33 34l1.0 7' stroke-width='.35' stroke-opacity='0.27'/%3E%3Cpath d='M36 81l0.4 8' stroke-width='.35' stroke-opacity='0.21'/%3E%3Cpath d='M33 72l0.3 14' stroke-width='.35' stroke-opacity='0.16'/%3E%3C/g%3E%3C/svg%3E");
  --cord:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='4' viewBox='0 0 12 4'%3E%3Cg fill='none' stroke='%23000' stroke-width='.8' stroke-linecap='round'%3E%3Cpath d='M0 2C3 .4 3 .4 6 2S9 3.6 12 2'/%3E%3Cpath d='M0 2C3 3.6 3 3.6 6 2S9 .4 12 2' stroke-opacity='.55'/%3E%3C/g%3E%3C/svg%3E");
  --weave-ink:var(--tx-1);
  --weave-alpha:.085;   /* sign-in and the greeting */
  --cord-alpha:.22;     /* the woven rule under the top bar */
}
:root[data-theme="dark"]{
  --weave-alpha:.11;
  --cord-alpha:.3;
}

/* ── Density ramp ──────────────────────────────────────────────
   Surfaces are not all the same weight. /console is generous;
   /admin is dense. Same tokens, remapped through three aliases so
   a component written once reads correctly on both surfaces.     */
:root{
  --pad-block:var(--s6);
  --pad-inline:var(--s5);
  --row-gap:var(--s3);
}
:root[data-density="dense"]{
  --pad-block:var(--s3);
  --pad-inline:var(--s3);
  --row-gap:var(--s2);
}

/* ── Surface accents ───────────────────────────────────────────
   Each surface gets one identifying grey used ONLY in its chrome —
   the rail edge and the surface badge — never in content. It is
   how you know at a glance which console you are looking at, and
   it is why admin cannot be mistaken for the user console in a
   screenshot.                                                     */
:root{
  --sf-console:var(--accent);
  --sf-admin:#3D3D3D;
  --sf-owner:#6B6B6B;
}
:root[data-theme="dark"]{
  --sf-admin:#D4D4D4;
  --sf-owner:#9A9A9A;
}

/* ── Transcript roles ──────────────────────────────────────────
   Six roles from GET /api/admin/transcript. Each carries a glyph
   and a word in the UI; these hues are the third carrier, never
   the only one.                                                   */
:root{
  --role-say:var(--tx-2);
  --role-delegate:var(--tx-1);
  --role-return:var(--st-done);
  --role-tool:var(--st-review);
  --role-verdict:var(--accent);
  --role-system:var(--tx-3);
}

/* ══════════════════════════════════════════════════════════════
   EXPERIENCE TOKENS — the UI build of 6 Oct 2026 (docs/ui/DESIGN_SYSTEM.md)
   Additions only. Every value above stays exactly as it was (the
   tests hold it); these name ROLES over it, add the scales the
   component library needs, and define the display modes. Still
   tokens only — no class rules in this file, ever.
   ══════════════════════════════════════════════════════════════ */

/* ── Semantic roles (prompt §6). Components use these names; the
   palette underneath can change without touching a component.
   Colour still means STATE: warning and info join done and failed
   as the only hues, and every one ships with a glyph and a word. */
:root{
  --c-background:var(--bg);
  --c-surface:var(--surface);
  --c-surface-raised:var(--surface);
  --c-surface-sunken:var(--surface-2);
  --c-primary:var(--accent);
  --c-on-primary:var(--on-accent);
  --c-secondary:var(--tx-2);
  --c-accent:var(--tx-1);
  --c-neutral:var(--tx-3);
  --c-success:var(--st-done);
  --c-danger:var(--st-failed);
  --c-warning:#8A5300;      /* 6.1:1 on --bg; AA on every light surface */
  --c-info:#2D5B8A;         /* 6.8:1 on --bg */
  --c-focus:var(--focus);
  --c-selected:var(--accent-soft);
  --c-disabled:var(--tx-3);
  /* --tx-3 is 3.3:1 and documented as non-text; small secondary TEXT
     uses --tx-muted (5.5:1). The audit's axe failures were all this. */
  --tx-muted:#666666;
  --c-line:var(--line);
  --c-line-strong:var(--line-hi);
}
:root[data-theme="dark"]{
  --c-warning:#D9A657;
  --c-info:#8AB2DE;
  --tx-muted:#949494;
}

/* ── Typography roles (§7). Serif for display and reading — the
   calm voice; Geist for interface; Geist Mono for code and data. */
:root{
  --type-display:clamp(1.75rem,1.2rem + 2.2vw,2.75rem);
  --type-headline:1.5rem;
  --type-title:1.125rem;
  --type-subtitle:0.9375rem;
  --type-body:0.9375rem;
  --type-body-sm:0.8125rem;
  --type-label:0.75rem;
  --type-caption:0.6875rem;
  --type-code:0.8125rem;
  --type-data:1.75rem;
  --type-hero-figure:3rem;
  --lh-tight:1.2;
  --lh-snug:1.35;
  --lh-body:1.55;
  --lh-read:1.7;
  --ls-label:.04em;
  --ls-body:0;
  --ws-body:0;
  --measure:68ch;
  --fw-regular:400; --fw-medium:500; --fw-strong:600;
}

/* ── Spacing names (§8) over the 4px scale above. */
:root{
  --space-xs:var(--s1);    /*  4 */
  --space-sm:var(--s2);    /*  8 */
  --space-md:var(--s4);    /* 16 */
  --space-lg:var(--s6);    /* 24 */
  --space-xl:var(--s7);    /* 32 */
  --space-2xl:var(--s8);   /* 48 */
  --space-3xl:var(--s9);   /* 64 */
  --gutter:var(--s4);
  --r-panel:var(--r-lg);
  --r-control:var(--r-md);
}
@media(max-width:560px){:root{--gutter:var(--s4)}}

/* ── Elevation (§9). Mostly hairlines; shadow only where a surface
   genuinely floats (menus, drawers, the command center). */
:root{
  --shadow-0:none;
  --shadow-1:0 1px 2px rgba(0,0,0,.05),0 0 0 1px var(--line);
  --shadow-2:0 6px 20px -8px rgba(0,0,0,.18),0 0 0 1px var(--line);
  --shadow-3:0 24px 60px -20px rgba(0,0,0,.34),0 0 0 1px var(--line-hi);
}
:root[data-theme="dark"]{
  --shadow-1:0 0 0 1px var(--line);
  --shadow-2:0 8px 24px -8px rgba(0,0,0,.6),0 0 0 1px var(--line-hi);
  --shadow-3:0 28px 64px -18px rgba(0,0,0,.75),0 0 0 1px var(--line-hi);
}

/* ── Motion (§57). Motion explains a change — it never decorates.
   data-motion="reduce" (and the OS setting) already stop it. */
:root{
  --d-instant:60ms;
  --d-gentle:420ms;
  --e-emph:cubic-bezier(.2,0,0,1);
  --pulse-once:900ms;       /* an Intelligence Pulse plays ONCE per real event */
}

/* ── Layers (§9 z-index). One ladder; nothing invents a z-index. */
:root{
  --z-base:0; --z-raised:10; --z-sticky:20; --z-ribbon:30; --z-panel:40;
  --z-dimmer:49; --z-rail:50; --z-bottomnav:55; --z-scrim:70;
  --z-popover:80; --z-toast:90; --z-skip:100;
}

/* ── Breakpoints (§10). CSS cannot read a custom property inside a
   media query, so these are the documented values every @media and
   ui-core.js use: phone ≤560 · tablet ≤900 · laptop ≤1180 ·
   desktop ≤1440 · wide ≤1920 · ultrawide beyond. */
:root{
  --bp-phone:560px; --bp-tablet:900px; --bp-laptop:1180px;
  --bp-desktop:1440px; --bp-wide:1920px;
  --content-max:1160px;     /* workspaces */
  --content-wide:1560px;    /* ultrawide: grows, then stops */
  --panel-w:360px;          /* the context panel */
  --bottomnav-h:60px;
}

/* ── Component states (§78) — the same five feelings everywhere. */
:root{
  --state-hover:var(--surface-3);
  --state-pressed:var(--line-hi);
  --state-selected:var(--accent-soft);
  --state-disabled-alpha:.45;
  --ring-w:2px;
  --ring:0 0 0 var(--ring-w) var(--bg),0 0 0 calc(var(--ring-w) + 2px) var(--focus);
  --hit:44px;               /* minimum touch target */
}

/* ── Data visualisation (§79), validated with the dataviz checks:
   categorical slots 1–4 pass adjacent CVD ΔE ≥ 8.4 and the
   normal-vision floor in BOTH themes; slots 1–3 also pass all-pairs
   (scatter / small multiples). Light slots 3–4 sit under 3:1, so
   every chart ships direct labels or its table view. Single-series
   charts are drawn in INK — the Kampala Mono way. The ink ramp is
   the sequential scale (heatmaps), light end ≥ 2:1 on the surface. */
:root{
  --viz-ink:var(--tx-1);
  --viz-1:#2a78d6; --viz-2:#eb6834; --viz-3:#1baf7a; --viz-4:#eda100;
  --viz-seq-1:#ADADAD; --viz-seq-2:#808080; --viz-seq-3:#555555; --viz-seq-4:#2B2B2B;
  --viz-grid:var(--line);
  --viz-axis:var(--tx-muted);
}
:root[data-theme="dark"]{
  --viz-1:#3987e5; --viz-2:#d95926; --viz-3:#199e70; --viz-4:#c98500;
  --viz-seq-1:#525252; --viz-seq-2:#7A7A7A; --viz-seq-3:#A6A6A6; --viz-seq-4:#D4D4D4;
}

/* ══ DISPLAY MODES (§6, §11, §71) ══════════════════════════════
   Set on <html> before first paint (console.html's inline script),
   chosen in Settings → Appearance or by a preset. Each only remaps
   tokens, so every component follows without knowing modes exist. */

/* Soft Light — lower glare on paper; still monochrome. */
:root[data-theme="light"][data-tone="soft"]{
  --bg:#F4F4F1; --surface:#FBFBF9; --surface-2:#ECECE8; --surface-3:#E2E2DD;
  --line:#DEDED8; --line-hi:#C9C9C2; --tx-2:#454545;
}
/* OLED Dark — true black for OLED screens and night use. */
:root[data-theme="dark"][data-tone="oled"]{
  --bg:#000000; --surface:#0A0A0A; --surface-2:#121212; --surface-3:#1C1C1C;
  --line:#1F1F1F; --line-hi:#333333;
}
/* High Contrast — hairlines become lines, every grey moves toward ink. */
:root[data-contrast="high"]{
  --tx-2:#262626; --tx-3:#4A4A4A; --tx-muted:#333333;
  --line:#6B6B6B; --line-hi:#1A1A1A; --ring-w:3px;
  --weave-alpha:0; --cord-alpha:.5;
}
:root[data-theme="dark"][data-contrast="high"]{
  --tx-2:#E0E0E0; --tx-3:#BDBDBD; --tx-muted:#CFCFCF;
  --line:#8A8A8A; --line-hi:#F5F5F5;
}
/* Large Text — the whole rem scale grows, layout follows. */
:root[data-text="large"]{font-size:112.5%}
:root[data-text="xl"]{font-size:125%}
/* Comfort / dyslexia-friendly spacing — no new typeface (§1.2 keeps
   three), but looser tracking, word spacing and leading. */
:root[data-comfort="on"]{--ls-body:.02em; --ws-body:.12em; --lh-body:1.75; --lh-read:1.85}
/* Low Bandwidth — system fonts, no texture, motion off (ui-core.js
   also slows polling and defers images). */
:root[data-bandwidth="low"]{
  --f-ui:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --f-read:Georgia,"Times New Roman",serif;
  --f-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --weave-alpha:0; --cord-alpha:0;
}

/* V3 TOKENS — Kampala Instrument. Additive; pinned Kampala Mono values stay intact.
   Risk mapping change: LOW/MEDIUM use ink outlines; HIGH uses pending amber;
   CRITICAL uses danger fill. Words and distinct glyphs carry meaning (visual §4.4). */
:root{
  --plane-ground:var(--bg); --plane-deck:#F3F3F1; --plane-stage:#FFFFFF;
  --plane-lens:#FFFFFF; --plane-well:#EFEFED;
  --lens-edge:0 0 0 1px var(--line); --lens-shadow:var(--shadow-2);
  --graticule:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 8px);
  --graticule-major:repeating-linear-gradient(90deg,var(--line-hi) 0 1px,transparent 1px 64px);
  --glow-live:0 0 0 1px #0A0A0A,0 0 18px -4px rgba(10,10,10,.22);
  --glow-dim:0 0 0 1px rgba(10,10,10,.4),0 0 18px -4px rgba(10,10,10,.088);
  --glow-none:none;
  --c-active:var(--tx-1); --c-pending:var(--c-warning); --c-executed:var(--c-success);
  --c-critical:var(--c-danger); --c-simulated:var(--tx-muted); --c-trust:var(--tx-1);
  --c-untrusted:var(--c-warning); --c-system:var(--tx-2); --c-intelligence:var(--tx-2);
  --c-governance:var(--tx-2); --line-dash:1px dashed var(--line-hi);
  --type-readout:2.25rem; --type-readout-sm:1.125rem; --type-overline:.6875rem;
  --type-narrative:1.1875rem; --type-state:clamp(2rem,1.4rem + 2vw,3.25rem);
  --d-trace:240ms; --d-settle:600ms; --e-trace:cubic-bezier(.3,0,.1,1);
}
:root[data-theme="dark"]{
  --plane-deck:#0E0E0E; --plane-stage:#121212; --plane-lens:#171717; --plane-well:#050505;
  --lens-edge:inset 0 1px 0 rgba(255,255,255,.06),0 0 0 1px var(--line-hi);
  --glow-live:0 0 0 1px rgba(245,245,245,.65),0 0 24px -2px rgba(245,245,245,.22);
  --glow-dim:0 0 0 1px rgba(245,245,245,.26),0 0 24px -2px rgba(245,245,245,.088);
}
:root[data-theme="dark"][data-tone="oled"]{--plane-deck:#000;--plane-well:#000}
:root[data-contrast="high"]{--glow-live:0 0 0 2px var(--tx-1);--glow-dim:0 0 0 2px var(--tx-2)}
:root[data-bandwidth="low"]{--glow-live:none;--glow-dim:none}
@media print{:root{--glow-live:none;--glow-dim:none}}